:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:oklch(24% .045 147);--paper:oklch(98% .028 98);--paper-deep:oklch(92% .075 86);--ink:oklch(24% .045 147);--muted:oklch(45% .05 147);--grass:oklch(72% .18 136);--sky:oklch(83% .09 220);--berry:oklch(58% .2 26);--berry-soft:oklch(87% .095 28);--plum:oklch(42% .1 320);--blue:oklch(55% .16 235);--line:oklch(66% .075 98);--shadow:0 10px 0 oklch(42% .07 127/.14);--ease-out-quart:cubic-bezier(.25, 1, .5, 1);--ease-out-quint:cubic-bezier(.22, 1, .36, 1);--space-2xs:4px;--space-xs:8px;--space-sm:12px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;background:oklch(95% .05 133);font-family:Nunito,Avenir Next,Avenir,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;overflow-x:hidden}button{font:inherit}.app-shell{background-color:oklch(96% .052 129);background-image:linear-gradient(90deg,oklch(94% .07 141) 0 24px,#0000 24px 100%),linear-gradient(0deg,oklch(93% .06 130) 0 24px,#0000 24px 100%),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:96px 96px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;min-height:100vh;padding:clamp(12px,2.4vw,28px)}.top-bar{justify-content:space-between;align-items:center;gap:var(--space-md);width:min(100%,1540px);margin:0 auto;display:flex}h1,h2,p{margin:0}h1{color:var(--ink);font-size:clamp(1.8rem,3vw,3.1rem);line-height:1}h2{font-size:1rem;line-height:1.1}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.language-toggle,.top-actions,.scenario-selector,.character-picker,.panel-heading{align-items:center;display:flex}.top-actions{justify-content:flex-end;gap:var(--space-sm)}.language-toggle{gap:var(--space-xs);min-height:56px;padding:var(--space-xs);border:2px solid var(--ink);background:var(--paper);box-shadow:var(--shadow);border-radius:8px}.language-toggle button,.scenario-selector button,.character-picker button,.reset-button{border:2px solid var(--ink);background:var(--paper);min-height:44px;color:var(--ink);cursor:pointer;touch-action:manipulation;border-radius:8px;font-weight:900}.language-toggle button{min-width:92px;padding:0 var(--space-md)}.language-toggle button.is-active,.scenario-selector button.is-active,.character-picker button.is-active{background:var(--berry-soft);color:var(--ink);transform:translateY(-2px)}.scenario-selector,.character-picker{gap:var(--space-xs);min-width:0}.scenario-selector{flex-wrap:wrap}.scenario-selector button,.character-picker button{align-items:center;gap:var(--space-xs);padding:0 var(--space-md);display:inline-flex}.scenario-selector button:disabled{cursor:not-allowed;opacity:.56}.scenario-selector small{color:var(--muted);font-size:.72rem;font-weight:900}.game-layout{gap:var(--space-lg);grid-template-columns:minmax(0,1fr) minmax(320px,420px);align-items:start;width:min(100%,1540px);margin:0 auto;display:grid}.stage-shell{min-width:0;min-height:0;position:relative}.stage{aspect-ratio:16/10;border:3px solid var(--ink);background:var(--sky);touch-action:none;-webkit-user-select:none;user-select:none;border-radius:8px;width:100%;min-height:0;position:relative;overflow:hidden;box-shadow:0 14px oklch(35% .07 144/.18)}.stage-background{object-fit:cover;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.placed-item{cursor:grab;pointer-events:none;touch-action:none;background:0 0;border:0;width:clamp(56px,8vw,94px);height:clamp(56px,8vw,94px);margin:0;padding:0;position:absolute;transform:translate(-50%,-50%)}.placed-item.is-selected:after{content:"";pointer-events:none;border:3px solid oklch(70% .16 63);border-radius:16px;position:absolute;inset:-7px;box-shadow:0 0 0 4px oklch(98% .04 88/.82)}.placed-character{width:clamp(120px,16vw,220px);height:auto}.placed-character.is-selected:after{border-radius:22px;inset:-8px -10px}.placed-item:active{cursor:grabbing}.placed-item img,.drag-ghost img{object-fit:contain;filter:drop-shadow(0 6px oklch(26% .05 93/.14));pointer-events:none;width:100%;height:100%}.placed-character img{filter:drop-shadow(0 7px oklch(30% .05 90/.16));height:auto}.drag-ghost{z-index:20;pointer-events:none;transform-origin:50%;width:92px;height:92px;position:fixed;top:0;left:0}.resize-toolbar{z-index:18;gap:var(--space-2xs);padding:var(--space-2xs);border:2px solid var(--ink);background:var(--paper);box-shadow:var(--shadow);border-radius:8px;align-items:center;display:flex;position:absolute;transform:translate(-50%,-100%)}.resize-toolbar button{border:2px solid var(--ink);background:var(--berry-soft);width:46px;height:46px;min-height:46px;color:var(--ink);cursor:pointer;touch-action:manipulation;border-radius:8px;place-items:center;padding:0;display:grid}.resize-toolbar button:disabled{color:color-mix(in oklch, var(--ink) 45%, transparent);cursor:not-allowed;background:oklch(91% .025 94);transform:none}.side-panel{gap:var(--space-md);min-height:0;display:grid}.item-tray,.sticker-journal{border:3px solid var(--ink);background:var(--paper);box-shadow:var(--shadow);border-radius:8px}.item-tray{padding:var(--space-md)}.panel-heading{justify-content:space-between;gap:var(--space-sm);margin-bottom:var(--space-md)}.tray-group-title{margin:var(--space-sm) 0 var(--space-xs);color:var(--muted);font-size:.8rem;font-weight:900}.panel-heading+.tray-group-title{margin-top:0}.tray-grid{gap:var(--space-sm);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.tray-item{gap:var(--space-xs);min-height:112px;padding:var(--space-sm);border:2px solid var(--ink);color:var(--ink);cursor:grab;text-align:center;touch-action:none;-webkit-user-select:none;user-select:none;background:oklch(96% .053 84);border-radius:8px;place-items:center;font-size:.92rem;font-weight:900;display:grid}.tray-item:active{cursor:grabbing}.tray-item img{object-fit:contain;pointer-events:none;width:58px;height:58px}.sticker-journal{gap:var(--space-md);padding:var(--space-md);display:grid}.sticker-grid{align-items:start;gap:var(--space-xs);flex-wrap:wrap;display:flex}.word-sticker{justify-content:start;align-items:center;gap:var(--space-xs);max-width:210px;min-height:58px;padding:var(--space-xs) var(--space-sm);border:2px solid var(--ink);background:var(--berry-soft);text-align:left;border-radius:8px;grid-template-columns:38px minmax(0,max-content);display:inline-grid}.word-sticker img{object-fit:contain;pointer-events:none;width:38px;height:38px}.word-sticker-text{gap:1px;min-width:0;display:grid}.word-sticker strong{font-size:.94rem;line-height:1.05}.word-sticker-text span,.journal-empty{color:var(--muted);font-size:.78rem;font-weight:800;line-height:1.05}.reset-button{justify-content:center;align-items:center;gap:var(--space-xs);background:oklch(95% .04 232);display:inline-flex}.reset-button-compact{min-width:110px;min-height:56px;padding:0 var(--space-md);box-shadow:var(--shadow)}button:focus-visible{outline-offset:3px;outline:4px solid oklch(77% .17 70)}@media (width<=980px){.top-bar{flex-direction:column;align-items:stretch}.top-actions{justify-content:space-between}.language-toggle{justify-content:center}.game-layout{grid-template-columns:1fr}.side-panel{grid-template-columns:minmax(0,1fr) minmax(260px,.7fr)}.stage{min-height:420px}}@media (width>=981px){html,body,#root{height:100%}body{overflow:hidden}.app-shell{gap:var(--space-md);grid-template-rows:auto minmax(0,1fr);height:100dvh;display:grid;overflow:hidden}.game-layout{grid-template-rows:minmax(0,1fr);grid-template-areas:"stage tray";align-items:stretch;min-height:0}.stage-shell{grid-area:stage;place-items:start stretch;display:grid;container-type:size}.stage{width:min(100cqw,160cqh);height:min(100cqh,62.5cqw)}.side-panel{display:contents}.item-tray,.sticker-journal{min-height:0;overflow:auto}.item-tray{grid-area:tray}.tray-grid{gap:var(--space-xs);grid-template-columns:repeat(3,minmax(0,1fr))}.tray-item{min-height:94px;padding:var(--space-xs);font-size:.84rem}.tray-item img{width:48px;height:48px}.tray-character img{width:42px;height:60px}}@media (width>=1180px) and (height<=820px){.app-shell{padding-block:var(--space-sm);gap:var(--space-sm)}.language-toggle{min-height:48px;padding:var(--space-2xs)}.language-toggle button,.scenario-selector button,.reset-button{min-height:40px}.item-tray,.sticker-journal{padding:var(--space-sm)}.panel-heading{margin-bottom:var(--space-sm)}.word-sticker{min-height:62px}}@media (width<=720px){.app-shell{padding:var(--space-md)}.side-panel{grid-template-columns:1fr}.stage{min-height:360px}.tray-grid{grid-template-columns:repeat(2,minmax(132px,1fr))}}@media (width<=1260px){html,body,#root{height:100%;min-height:0}body{overflow:hidden}.app-shell{gap:var(--space-sm);height:100dvh;min-height:0;padding:var(--space-sm);grid-template-rows:auto minmax(0,1fr);display:grid;overflow:hidden}.top-bar{gap:var(--space-sm)}.scenario-selector button,.language-toggle button,.reset-button{min-height:42px}.scenario-selector button{padding-inline:var(--space-sm)}.language-toggle{min-height:50px;padding:var(--space-2xs)}.reset-button-compact{min-height:50px}.game-layout{gap:var(--space-sm);grid-template:"stage"minmax(0,1fr)/1fr;min-height:0;padding-bottom:clamp(118px,17dvh,148px);display:grid;position:relative;overflow:hidden}.stage-shell{grid-area:stage;place-items:start center;min-height:0;display:grid;container-type:inline-size}.stage{width:min(100%,160dvh - 368px);height:min(100%,62.5cqw);min-height:0}.side-panel{display:contents}.item-tray{right:max(var(--space-sm), env(safe-area-inset-right));bottom:max(var(--space-sm), env(safe-area-inset-bottom));left:max(var(--space-sm), env(safe-area-inset-left));z-index:24;gap:var(--space-xs);max-width:none;min-height:102px;max-height:none;padding:var(--space-xs);overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;grid-area:auto;align-items:stretch;display:flex;position:fixed;overflow:auto hidden}.item-tray .panel-heading{text-align:center;flex:none;place-content:center;width:70px;margin-bottom:0}.item-tray .panel-heading svg{display:none}.tray-group-title{writing-mode:vertical-rl;text-orientation:mixed;flex:none;align-self:center;margin:0;font-size:.76rem;line-height:1}.tray-grid{gap:var(--space-xs);scroll-snap-type:none;flex:none;grid-template-columns:none;display:flex;overflow:visible}.tray-item{gap:var(--space-2xs);min-height:82px;padding:var(--space-xs);scroll-snap-align:start;flex:0 0 88px;font-size:.74rem}.tray-item img{width:44px;height:44px}.tray-character img{width:36px;height:52px}}@media (width>=760px) and (width<=1260px){.top-bar{flex-direction:row;align-items:center}.top-actions{flex:none;margin-left:auto}.scenario-selector{flex:auto}}html,body,#root{height:100%;min-height:0}body{overflow:hidden}.app-shell{gap:var(--space-sm);grid-template-rows:auto minmax(0,1fr);height:100dvh;min-height:0;display:grid;overflow:hidden}.game-layout{gap:var(--space-sm);grid-template:"stage"minmax(0,1fr)/1fr;min-height:0;padding-bottom:clamp(118px,17dvh,148px);display:grid;position:relative;overflow:hidden}.stage-shell{grid-area:stage;place-items:start center;min-height:0;display:grid;container-type:inline-size}.stage{width:min(100%,160dvh - 368px);height:min(100%,62.5cqw);min-height:0}.side-panel{display:contents}.item-tray{right:max(var(--space-sm), env(safe-area-inset-right));bottom:max(var(--space-sm), env(safe-area-inset-bottom));left:max(var(--space-sm), env(safe-area-inset-left));z-index:24;gap:var(--space-xs);max-width:none;min-height:102px;max-height:none;padding:var(--space-xs);overscroll-behavior-x:contain;scroll-snap-type:x proximity;transition:inset .24s var(--ease-out-quart), width .24s var(--ease-out-quart), height .24s var(--ease-out-quart), min-height .24s var(--ease-out-quart), max-height .24s var(--ease-out-quart), border-radius .18s var(--ease-out-quart), box-shadow .18s var(--ease-out-quart), opacity .16s var(--ease-out-quart), transform .24s var(--ease-out-quart);will-change:transform;-webkit-overflow-scrolling:touch;grid-area:auto;align-items:stretch;display:flex;position:fixed;overflow:auto hidden}.item-tray .panel-heading{text-align:center;flex:none;place-content:center;width:70px;margin-bottom:0}.item-tray .panel-heading svg{display:none}.tray-group-title{writing-mode:vertical-rl;text-orientation:mixed;flex:none;align-self:center;margin:0;font-size:.76rem;line-height:1}.tray-grid{gap:var(--space-xs);scroll-snap-type:none;flex:none;grid-template-columns:none;display:flex;overflow:visible}.tray-group-title,.tray-grid{transition:opacity .14s var(--ease-out-quart), transform .18s var(--ease-out-quart)}.tray-item{gap:var(--space-2xs);min-height:82px;padding:var(--space-xs);scroll-snap-align:start;flex:0 0 88px;font-size:.74rem}.tray-item img{width:44px;height:44px}.tray-character img{width:36px;height:52px}.dock-drag-handle{z-index:35;border:2px solid var(--ink);width:44px;height:44px;min-height:44px;color:var(--ink);cursor:grab;touch-action:none;transition:background-color .16s var(--ease-out-quart), box-shadow .16s var(--ease-out-quart), transform .16s var(--ease-out-quart);-webkit-user-select:none;user-select:none;background:oklch(95% .04 232);border-radius:999px;place-items:center;padding:0;display:grid;position:absolute;box-shadow:0 4px oklch(42% .07 127/.15)}.app-shell.tray-dock-left .dock-drag-handle,.app-shell.tray-dock-right .dock-drag-handle{top:50%;transform:translateY(-50%)}.app-shell.tray-dock-left .dock-drag-handle{left:calc(clamp(110px, 12vw, 152px) + var(--space-xs))}.app-shell.tray-dock-right .dock-drag-handle{right:calc(clamp(110px, 12vw, 152px) + var(--space-xs))}.app-shell.tray-dock-bottom .dock-drag-handle{bottom:calc(102px + var(--space-xs));left:50%;transform:translate(-50%)}.dock-handle-dots{background:var(--ink);width:4px;height:4px;box-shadow:0 -8px 0 var(--ink), 0 8px 0 var(--ink), 9px -8px 0 var(--ink), 9px 0 0 var(--ink), 9px 8px 0 var(--ink);border-radius:999px;transform:translate(-4.5px)}.dock-drag-handle:active,.dock-drag-handle.is-dragging{background:var(--berry-soft);cursor:grabbing;box-shadow:0 8px oklch(42% .07 127/.16)}.app-shell.tray-dock-left .dock-drag-handle:active,.app-shell.tray-dock-left .dock-drag-handle.is-dragging,.app-shell.tray-dock-right .dock-drag-handle:active,.app-shell.tray-dock-right .dock-drag-handle.is-dragging{transform:translateY(-50%)scale(1.04)}.app-shell.tray-dock-bottom .dock-drag-handle:active,.app-shell.tray-dock-bottom .dock-drag-handle.is-dragging{transform:translate(-50%)scale(1.04)}.dock-drop-layer{z-index:40;pointer-events:none;position:absolute;inset:0}.dock-drop-target{justify-content:center;align-items:center;gap:var(--space-xs);border:4px dashed var(--ink);background:color-mix(in oklch, var(--berry-soft) 84%, var(--paper));min-width:96px;min-height:76px;color:var(--ink);cursor:copy;letter-spacing:0;opacity:.92;pointer-events:auto;text-transform:capitalize;touch-action:none;transition:background-color .18s var(--ease-out-quart), border-color .18s var(--ease-out-quart), box-shadow .22s var(--ease-out-quart), opacity .18s var(--ease-out-quart), transform .22s var(--ease-out-quart);border-radius:8px;font-size:.88rem;font-weight:1000;display:flex;position:absolute}.dock-drop-target.is-current{background:color-mix(in oklch, var(--sky) 68%, var(--paper))}.dock-drop-target.is-hovered{background:color-mix(in oklch, var(--grass) 38%, var(--paper));opacity:1;border-style:solid;transform:scale(1.015);box-shadow:0 16px oklch(42% .07 127/.16)}.dock-drop-target:after{border:2px solid var(--ink);background:linear-gradient(var(--ink), var(--ink)) center 13px / 22px 3px no-repeat, linear-gradient(var(--ink), var(--ink)) center 20px / 22px 3px no-repeat, linear-gradient(var(--ink), var(--ink)) center 27px / 22px 3px no-repeat, var(--paper);content:"";opacity:0;width:42px;height:42px;transition:border-radius .22s var(--ease-out-quint), height .26s var(--ease-out-quint), opacity .16s var(--ease-out-quart), transform .26s var(--ease-out-quint), width .26s var(--ease-out-quint);border-radius:12px;display:block;position:absolute;transform:scale(.72);box-shadow:0 5px oklch(42% .07 127/.13)}.dock-drop-target.is-hovered:after{opacity:.94;transform:scale(1)}.dock-drop-target-left,.dock-drop-target-right{top:var(--space-sm);bottom:var(--space-sm);writing-mode:vertical-rl;width:clamp(108px,14vw,172px)}.dock-drop-target-left:after,.dock-drop-target-right:after{width:52%;height:72%}.dock-drop-target-left{left:var(--space-sm)}.dock-drop-target-right{right:var(--space-sm)}.dock-drop-target-bottom{right:var(--space-sm);bottom:var(--space-sm);left:var(--space-sm);height:clamp(92px,16dvh,142px)}.dock-drop-target-bottom:after{width:min(56%,520px);height:48%}.app-shell.tray-dock-bottom .game-layout{padding-bottom:clamp(118px,17dvh,148px);padding-left:0;padding-right:0}.app-shell.tray-dock-left .game-layout,.app-shell.tray-dock-right .game-layout{padding-bottom:0}.app-shell.tray-dock-left .game-layout{padding-left:clamp(122px,14vw,172px)}.app-shell.tray-dock-right .game-layout{padding-right:clamp(122px,14vw,172px)}.item-tray{position:absolute}.app-shell.tray-dock-bottom .item-tray{overscroll-behavior-x:contain;overscroll-behavior-y:auto;scroll-snap-type:x proximity;flex-direction:row;max-width:none;min-height:102px;max-height:none;inset:auto 0 0;overflow:auto hidden}.app-shell.tray-dock-left .item-tray,.app-shell.tray-dock-right .item-tray{overscroll-behavior-x:auto;overscroll-behavior-y:contain;scroll-snap-type:y proximity;flex-direction:column;width:clamp(110px,12vw,152px);min-height:0;max-height:none;top:0;bottom:0;overflow:hidden auto}.app-shell.tray-dock-left .item-tray{left:0;right:auto}.app-shell.tray-dock-right .item-tray{left:auto;right:0}.app-shell.tray-dock-left .tray-group-title,.app-shell.tray-dock-right .tray-group-title{writing-mode:horizontal-tb;text-align:center;align-self:stretch}.app-shell.tray-dock-left .tray-grid,.app-shell.tray-dock-right .tray-grid{flex-direction:column;width:100%}.app-shell.tray-dock-left .tray-item,.app-shell.tray-dock-right .tray-item{touch-action:pan-y;flex:0 0 88px;width:100%}.app-shell.tray-dock-bottom .tray-item{touch-action:pan-x}.app-shell.tray-dock-left .stage,.app-shell.tray-dock-right .stage{width:min(100%,160dvh - 179.2px)}.app-shell.tray-dock-left .item-tray{transform-origin:0}.app-shell.tray-dock-right .item-tray{transform-origin:100%}.app-shell.tray-dock-bottom .item-tray{transform-origin:bottom}.app-shell.is-dock-dragging .item-tray{opacity:.82;pointer-events:none;border-radius:22px;overflow:hidden}.app-shell.is-dock-dragging .tray-group-title,.app-shell.is-dock-dragging .tray-grid{opacity:0;transition:opacity .14s var(--ease-out-quart), transform .18s var(--ease-out-quart);transform:scale(.92)}.app-shell.is-dock-dragging.tray-dock-left .item-tray,.app-shell.is-dock-dragging.tray-dock-right .item-tray{width:124px;height:124px;min-height:124px;top:50%;bottom:auto;transform:translateY(-50%)scale(.94)}.app-shell.is-dock-dragging.tray-dock-bottom .item-tray{width:124px;height:124px;min-height:124px;left:50%;right:auto;transform:translate(-50%)scale(.94)}.app-shell.is-dock-dragging.dock-preview-left .item-tray,.app-shell.is-dock-dragging.dock-preview-right .item-tray{width:clamp(110px,12vw,152px);height:auto;min-height:0;top:0;bottom:0;transform:none}.app-shell.is-dock-dragging.dock-preview-left .item-tray{left:0;right:auto}.app-shell.is-dock-dragging.dock-preview-right .item-tray{left:auto;right:0}.app-shell.is-dock-dragging.dock-preview-bottom .item-tray{width:auto;height:auto;min-height:102px;inset:auto 0 0;transform:none}@media (prefers-reduced-motion:reduce){.item-tray,.dock-drag-handle,.dock-drop-target,.dock-drop-target:after,.app-shell.is-dock-dragging .tray-group-title,.app-shell.is-dock-dragging .tray-grid{transition-duration:.01ms!important}}