:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#ffffffe6;background:#080c16;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{min-width:320px;min-height:100%;background:#080c16}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%;min-height:100vh}a{color:inherit}button,input,textarea,select{font:inherit}.kara-page{position:relative;z-index:1;width:min(100%,1100px);min-height:100vh;margin:0 auto;padding:28px 24px}.kara-page-header{width:100%}.kara-main-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(320px,.9fr);align-items:start;gap:20px;width:100%;margin-bottom:4px}.kara-home-column,.kara-control-column{min-width:0}.kara-home-column .kara-pixel-card{margin-bottom:0}.kara-control-column{display:flex;flex-direction:column;align-items:stretch;align-self:stretch}.kara-stats-card{display:flex;flex-direction:column;justify-content:center;height:100%;margin-bottom:0!important}.kara-stats-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px;padding-bottom:14px;border-bottom:1px dashed rgba(160,175,220,.18);text-align:left}.kara-stats-heading>div{display:flex;flex-direction:column;gap:5px}.kara-stats-heading strong{color:#ebeffaeb;font:500 13px/1.2 Noto Sans SC,sans-serif;letter-spacing:.5px}.kara-stats-heading span:not(.kara-activity-emoji){color:#b4bed77a;font:9px/1.4 Noto Sans SC,sans-serif}.kara-activity-emoji{font-size:25px}.kara-pixel-card{width:100%;margin-bottom:16px;overflow:hidden;border:2px solid rgba(159,169,220,.72);border-radius:18px;color:#514d78;background:linear-gradient(180deg,#fffbe5f7,#e1ebfbf5);box-shadow:0 12px 36px #272a4e47,inset 0 0 0 2px #ffffff8c;animation:karaCardIn .5s ease-out}.kara-pixel-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px 8px;text-align:left;border-bottom:1px solid rgba(111,118,180,.22)}.kara-pixel-meta>div{display:flex;align-items:baseline;min-width:0;gap:6px}.kara-stage-icon{font-size:13px}.kara-stage-name{font:700 11px/1.2 Noto Sans SC,sans-serif;color:#7266af;white-space:nowrap}.kara-stage-desc{font:9px/1.2 Noto Sans SC,sans-serif;color:#4854779e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kara-room-hint{flex:none;font:9px/1 Noto Sans SC,sans-serif;color:#6882a5}.kara-room{position:relative;width:100%;aspect-ratio:3 / 2;overflow:hidden;isolation:isolate;background:#ffe8ec;image-rendering:pixelated}.kara-room-bg{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;-webkit-user-select:none;user-select:none;pointer-events:none}.kara-room-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#ffffff08 55%,#6d3b6114)}.kara-sprite-wrap{position:absolute;z-index:5;left:var(--kara-x);top:var(--kara-y);width:var(--kara-size, 8.5%);min-width:26px;transform:translate(-50%,-100%);transition:left .9s steps(6),top .9s steps(6),width .9s steps(6);filter:drop-shadow(0 3px 1px rgba(85,45,76,.22));pointer-events:none}.kara-ground-shadow{position:absolute;z-index:-1;left:50%;bottom:-1.5%;width:54%;height:7%;transform:translate(-50%);border-radius:50%;background:#4a375d47;filter:blur(.5px);animation:karaShadowPulse 1.7s steps(2) infinite}.kara-room-foreground{position:absolute;inset:0;z-index:6;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;pointer-events:none;-webkit-user-select:none;user-select:none}.kara-room-foreground.is-bed{clip-path:polygon(7% 50%,44% 50%,44% 72%,7% 72%)}.kara-room-foreground.is-dresser{clip-path:polygon(31% 34%,47% 34%,47% 52%,31% 52%)}.kara-room-foreground.is-desk{clip-path:polygon(48% 31%,69% 31%,69% 44%,48% 44%)}.kara-room-foreground.is-desk-left-leg{clip-path:polygon(48% 41%,50.5% 41%,50.5% 54%,48% 54%)}.kara-room-foreground.is-desk-right-leg{clip-path:polygon(66.5% 41%,69% 41%,69% 54%,66.5% 54%)}.kara-room-foreground.is-sofa{clip-path:polygon(71% 42%,95% 42%,95% 65%,71% 65%)}.kara-room-foreground.is-table{clip-path:ellipse(8.4% 6.4% at 66.5% 66%)}.kara-room-foreground.is-table-left-leg{clip-path:polygon(60.4% 66.5%,62.2% 66.5%,62.2% 76.5%,60.4% 76.5%)}.kara-room-foreground.is-table-center-leg{clip-path:polygon(66% 68%,68.3% 68%,68.3% 80%,66% 80%)}.kara-room-foreground.is-table-right-leg{clip-path:polygon(72.2% 66.5%,74% 66.5%,74% 76.5%,72.2% 76.5%)}.kara-room-foreground.is-toybox{clip-path:polygon(69% 80%,88% 80%,88% 97%,69% 97%)}.kara-sprite{display:block;width:100%;height:auto;image-rendering:pixelated;animation:karaIdle 1.7s steps(2) infinite}.kara-sprite-wrap.is-napping{z-index:4;filter:saturate(.75) brightness(.9) drop-shadow(0 3px 1px rgba(85,45,76,.18))}.kara-sprite-wrap.is-napping .kara-sprite{animation:karaSleep 2.4s ease-in-out infinite;transform:rotate(90deg) scale(.84);transform-origin:50% 48%}.kara-sleep-blanket{position:absolute;z-index:2;left:39%;top:41%;width:123%;height:36%;transform:translate(-10%,-50%) rotate(2deg);border:2px solid #b4a8dd;border-radius:45% 16% 18% 38%;background:repeating-linear-gradient(90deg,rgba(255,255,255,.32) 0 5px,transparent 5px 10px),linear-gradient(180deg,#f4d9a4,#dfc17b);box-shadow:inset 0 -3px #947cb82e,1px 2px #52417429;animation:karaBlanketBreath 2.4s ease-in-out infinite}.kara-speech-anchor.is-napping .kara-speech{left:90%;bottom:calc(100% + 2px)}.kara-sprite-wrap.is-computing{z-index:4}.kara-sprite-wrap.is-computing .kara-sprite{animation:karaTyping .72s steps(2) infinite}.kara-sprite-wrap.is-walking .kara-sprite{animation:karaWalk .34s steps(2) infinite}.kara-sprite-wrap.is-playing .kara-sprite{animation:karaPlaying 1.1s steps(2) infinite}.kara-toy{position:absolute;z-index:7;left:-9%;top:66%;font-size:clamp(11px,2vw,21px);filter:drop-shadow(1px 2px 0 rgba(78,59,104,.18));animation:karaToyBounce 1.1s steps(2) infinite}.kara-play-sparkles{position:absolute;z-index:7;right:-8%;top:38%;color:#f3c44d;font:700 clamp(8px,1.4vw,15px)/1 monospace;text-shadow:7px -5px 0 #c8a9f2;animation:karaPlaySparkle 1.4s steps(3) infinite}.kara-typing{position:absolute;z-index:7;left:-19%;top:64%;padding:2px 4px;border:1px solid rgba(109,105,176,.65);border-radius:4px;color:#665ca4;background:#f6f8ffe6;font:700 6px/1 monospace;white-space:nowrap;animation:karaTypingDots .72s steps(2) infinite}.kara-computer-fx{position:absolute;z-index:4;left:55.3%;top:31.6%;width:8.5%;height:7.8%;transform:rotate(1deg);border-radius:5px;background:#9dc7ff33;box-shadow:0 0 12px 5px #77a6ff61;animation:karaScreenGlow 1.8s steps(3) infinite;pointer-events:none}.kara-computer-fx i{position:absolute;left:22%;height:8%;border-radius:2px;background:#f7f0ff;box-shadow:1px 1px #534d9773}.kara-computer-fx i:nth-child(1){top:25%;width:48%}.kara-computer-fx i:nth-child(2){top:46%;width:35%;background:#ffe58e}.kara-computer-fx i:nth-child(3){top:67%;width:57%;background:#bff1da}.kara-speech{position:absolute;left:50%;bottom:calc(100% + 5px);min-width:112px;max-width:166px;padding:6px 8px;transform:translate(-50%);border:2px solid #8f85c8;border-radius:9px;color:#56517e;background:#fffdf6f5;box-shadow:2px 2px #4d4d7e33;font:8.5px/1.45 Noto Sans SC,sans-serif;text-align:center;image-rendering:auto}.kara-speech-anchor{position:absolute;z-index:9;left:var(--kara-x);top:var(--kara-y);width:var(--kara-size, 8.5%);min-width:26px;transform:translate(-50%,-100%);transition:left .9s steps(6),top .9s steps(6),width .9s steps(6);pointer-events:none}.kara-speech-anchor.is-upper .kara-speech{left:calc(100% + 8px);bottom:auto;top:0;transform:translateY(-35%)}.kara-speech-anchor.is-upper .kara-speech:after{left:-6px;bottom:8px;transform:rotate(135deg)}.kara-speech:after{content:"";position:absolute;left:50%;bottom:-6px;width:8px;height:8px;transform:translate(-50%) rotate(45deg);border-right:2px solid #8f85c8;border-bottom:2px solid #8f85c8;background:#fffdf6}.kara-zzz{position:absolute;right:-18px;top:8px;color:#7d72b7;font:700 9px/1 monospace;animation:karaZzz 1.8s steps(3) infinite}.kara-room-badge{position:absolute;z-index:6;left:8px;bottom:7px;padding:4px 6px;border:1px solid rgba(255,255,255,.82);border-radius:6px;color:#59638e;background:#fff7eed1;box-shadow:1px 2px #79406229;font:700 7px/1 Courier New,monospace;letter-spacing:.3px}.kara-progress{padding:8px 12px 10px}.kara-progress-labels{display:flex;justify-content:space-between;gap:8px;margin-bottom:5px;color:#485477b8;font:8.5px/1.2 Noto Sans SC,sans-serif}.kara-progress-track{height:5px;overflow:hidden;border-radius:3px;background:#697db126;box-shadow:inset 0 1px 1px #383f681f}.kara-progress-fill{height:100%;border-radius:inherit;background:repeating-linear-gradient(90deg,#7ca8cf 0 7px,#a594d3 7px 11px,#a9be79 11px 15px,#f0cf6d 15px 19px);transition:width .6s ease}.kara-pixel-card.is-sleeping .kara-room:after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:#4f488e2b;mix-blend-mode:multiply}@keyframes karaCardIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes karaIdle{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}@keyframes karaShadowPulse{0%,to{transform:translate(-50%) scaleX(1);opacity:.8}50%{transform:translate(-50%) scaleX(.88);opacity:.55}}@keyframes karaSleep{0%,to{transform:rotate(90deg) scale(.84)}50%{transform:rotate(90deg) scale(.86)}}@keyframes karaBlanketBreath{0%,to{transform:translate(-10%,-50%) rotate(2deg) scaleY(1)}50%{transform:translate(-10%,-52%) rotate(2deg) scaleY(1.05)}}@keyframes karaZzz{0%{opacity:0;transform:translateY(3px)}50%{opacity:1}to{opacity:0;transform:translateY(-5px)}}@keyframes karaTyping{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(1px) rotate(1deg)}}@keyframes karaTypingDots{0%,to{transform:translate(0)}50%{transform:translate(2px)}}@keyframes karaScreenGlow{0%,to{opacity:.62}50%{opacity:1}}@keyframes karaWalk{0%,to{transform:translateY(0) rotate(-2deg) scaleX(.98)}50%{transform:translateY(-3px) rotate(2deg) scaleX(1.02)}}@keyframes karaPlaying{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(1px) rotate(2deg)}}@keyframes karaToyBounce{0%,to{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-4px) rotate(6deg)}}@keyframes karaPlaySparkle{0%,to{opacity:.25;transform:scale(.8) rotate(0)}50%{opacity:1;transform:scale(1.2) rotate(12deg)}}@media(max-width:360px){.kara-stage-desc{display:none}.kara-room-hint{font-size:8px}.kara-speech{min-width:98px;max-width:132px;font-size:7.5px}}@media(max-width:800px){.kara-page{width:min(100%,420px);padding:20px 16px}.kara-main-grid{grid-template-columns:minmax(0,1fr);gap:16px}.kara-stats-card{height:auto}.kara-stats-heading{margin-bottom:16px}}@media(min-width:801px){.kara-pixel-meta{padding:11px 14px 10px}.kara-stage-icon{font-size:15px}.kara-stage-name{font-size:12px}.kara-stage-desc,.kara-room-hint{font-size:10px}.kara-speech{min-width:138px;max-width:210px;padding:8px 10px;font-size:10px}.kara-progress{padding:10px 14px 12px}.kara-progress-labels{font-size:10px}}@media(prefers-reduced-motion:reduce){.kara-sprite,.kara-zzz,.kara-sleep-blanket,.kara-typing,.kara-computer-fx,.kara-toy,.kara-play-sparkles,.kara-ground-shadow,.kara-pixel-card{animation:none!important}.kara-sprite-wrap{transition:none}}