#little-cri-preview .widget{position:fixed;bottom:20px;left:12px;width:min(670px,calc(100vw - 24px));aspect-ratio:2/1;z-index:5}
#little-cri-preview .art{position:absolute;width:100%;height:100%;object-fit:contain;pointer-events:none}
#little-cri-preview .character{clip-path:polygon(0 20%,32% 20%,32% 45%,30% 51%,32% 59%,35% 65%,35% 100%,0 100%);animation:jump 6s ease-in-out infinite;transform-origin:17% 92%}
#little-cri-preview .speech{clip-path:polygon(0 0,100% 0,100% 100%,35% 100%,35% 65%,32% 59%,30% 51%,32% 45%,32% 20%,0 20%)}
#little-cri-preview .hotspot{position:absolute;background:transparent;border:0;cursor:pointer;border-radius:10px}
#little-cri-preview .upload{left:40%;top:49%;width:50%;height:15%}
#little-cri-preview .dismiss{left:89%;top:12%;width:4%;height:8%}
#little-cri-preview .character-button{left:3%;top:26%;width:30%;height:69%}
#little-cri-preview .hotspot:focus-visible{outline:3px solid white;outline-offset:4px}
#little-cri-preview .collapsed .speech,#little-cri-preview .collapsed .upload,#little-cri-preview .collapsed .dismiss{display:none}
#little-cri-preview .collapsed .character{cursor:pointer}
#little-cri-preview .shade{position:fixed;inset:0;background:#0008;backdrop-filter:blur(5px);z-index:8}
#little-cri-preview .panel{position:fixed;left:26px;bottom:26px;z-index:9;background:#fff9e9;color:#20231b;padding:25px;border:3px solid #22271a;border-radius:15px;width:380px;max-width:calc(100vw - 32px);max-height:calc(100svh - 32px);overflow:auto;box-shadow:6px 6px 0 #0007}
#little-cri-preview .panel h2{font-size:25px;margin:18px 0 8px;letter-spacing:-.7px}
#little-cri-preview .label{font-size:11px;letter-spacing:2px;font-weight:bold}
#little-cri-preview .dot{display:inline-block;background:#a9e93b;border-radius:50%;width:8px;height:8px;margin-left:7px}
#little-cri-preview .hint{font-size:13px;line-height:1.6;color:#626854}
#little-cri-preview .close{float:right;background:none;border:0;font-size:26px;cursor:pointer}
#little-cri-preview .drop{display:block;border:2px dashed #99a877;padding:24px 14px;border-radius:9px;background:#eef1e4;font-size:14px;text-align:center;position:relative;cursor:pointer}
#little-cri-preview .drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
#little-cri-preview .drop strong{display:block;overflow-wrap:anywhere}
#little-cri-preview .drop span{display:block;margin-top:7px;font-size:11px;color:#6e775c}
#little-cri-preview audio{width:100%;height:35px;margin-top:12px}
#little-cri-preview label.money{display:block;font-size:13px;font-weight:bold;margin:22px 0 9px}
#little-cri-preview input[type=number]{width:100%;border:1px solid #aeb99b;border-radius:7px;padding:12px;font:inherit;background:#fff}
#little-cri-preview input[type=checkbox]{accent-color:#597d21}
#little-cri-preview .unknown{display:flex;gap:7px;align-items:center;font-size:12px;margin:11px 0 20px}
#little-cri-preview .primary{background:#d5f176;border:2px solid #20231b;box-shadow:0 3px 0 #20231b;border-radius:7px;padding:13px;width:100%;font-weight:800;cursor:pointer}
#little-cri-preview .primary:disabled{opacity:.45;cursor:not-allowed}
#little-cri-preview .notice{font-size:11px;line-height:1.6;color:#777c6c;border-top:1px solid #d5d9c9;margin-top:19px;padding-top:14px}
#little-cri-preview .status{font-size:13px;line-height:1.6;min-height:20px}
#little-cri-preview .listening .character{animation:listen .65s ease-in-out infinite}
#little-cri-preview .status.error{color:#a52f28}
#little-cri-preview [hidden]{display:none!important}
@keyframes jump{0%,70%,85%,100%{transform:translateY(0)}75%{transform:translateY(-9px) rotate(-1deg)}80%{transform:translateY(0)}82%{transform:translateY(-3px)}}
@keyframes listen{50%{transform:translateY(-4px) rotate(2deg)}}
@media (max-width:600px){#little-cri-preview .widget{bottom:18px}
#little-cri-preview .panel{left:16px;bottom:16px}}
@media (prefers-reduced-motion:reduce){#little-cri-preview .character{animation:none!important}}
#little-cri-preview .writer{display:none;position:absolute;left:2%;bottom:0;width:33%;aspect-ratio:543.0 / 724;background-image:url(/little-cri-writing-v1.png);background-size:400% 100%;background-repeat:no-repeat;image-rendering:auto}
#little-cri-preview .writing .writer{display:block;animation:write-frames 3s steps(1,end) forwards}
#little-cri-preview .writing .character,#little-cri-preview .writing .speech,#little-cri-preview .writing .hotspot{display:none}
#little-cri-preview .thinking-note{display:none;position:absolute;left:36%;bottom:35%;background:#fff9e9;color:#20231b;padding:20px 24px;border:3px solid #20231b;border-radius:12px;font-size:clamp(14px,2.5vw,21px);font-weight:bold;box-shadow:4px 4px 0 #0008}
#little-cri-preview .writing .thinking-note{display:block}
#little-cri-preview .thinking-note small{display:block;font-size:10px;color:#7b826a;letter-spacing:1px;margin-top:8px}
@keyframes write-frames{0%{background-position:0% 0}25%{background-position:33.333333% 0}50%{background-position:66.666667% 0}75%,100%{background-position:100% 0}}
#little-cri-preview .demo-start{display:inline-block;margin-top:12px;width:auto;padding:14px 24px}
#little-cri-preview .result h3{margin:20px 0 7px}
#little-cri-preview .result p{font-size:14px;line-height:1.7}
#little-cri-preview .result-tag{display:inline-block;font-size:10px;letter-spacing:1px;background:#e6edce;padding:7px 9px;border-radius:4px}
#little-cri-preview .result a{display:block;text-align:center;text-decoration:none;color:#20231b;margin-top:20px}
#little-cri-preview .secondary{display:block;margin-top:15px;width:100%;border:0;background:none;text-decoration:underline;cursor:pointer;font-size:12px}
@media (prefers-reduced-motion:reduce){#little-cri-preview .writing .writer{animation:none;background-position:33.333333% 0}}
#little-cri-preview{font-family:Arial,sans-serif;line-height:1.4}
#little-cri-preview *{box-sizing:border-box}
#little-cri-preview .widget{width:min(500px,calc(100vw - 30px));z-index:25;left:8px;bottom:16px}
#little-cri-preview .panel{z-index:42;line-height:1.5}
#little-cri-preview .shade{z-index:41}
#little-cri-preview .primary{font-family:Arial,sans-serif}
#little-cri-preview .demo-start{width:100%;margin-top:14px;font-size:12px}
#little-cri-preview .result p{max-width:none}

@media(max-width:600px){#little-cri-preview .widget{width:calc(100vw - 62px);left:0;bottom:14px}}

#little-cri-preview .demo-badge{position:absolute;right:5%;bottom:18%;max-width:58%;background:#111310f5;border:1px solid #d5f17677;color:#e4efbd;border-radius:6px;padding:6px 8px;font:10px/1.45 Arial,sans-serif;pointer-events:none;text-align:center}
#little-cri-preview .collapsed .demo-badge,#little-cri-preview .writing .demo-badge{display:none}
#little-cri-preview .hint.demo-warning{border-left:3px solid #839c3e;padding-left:11px;color:#414b30}
#little-cri-preview .panel[hidden],#little-cri-preview .shade[hidden]{display:none!important}
@media(max-width:600px){#little-cri-preview .demo-badge{font-size:8px;padding:4px 6px;bottom:10%}#little-cri-preview .panel{left:16px;width:calc(100vw - 32px)}}