@import url('../paris/lesson.css');
body{background:#e8dfca}::selection{background:#ead7a0;color:#203e32}button,a,select{outline-offset:4px}header{max-width:45vw}#caption:empty{display:none}
#story-tools{position:fixed;left:24px;top:120px;z-index:14;max-width:calc(100vw - 48px)}
.instrument-tray{display:flex;gap:4px;align-items:center;padding:7px;background:#19382fed;border:1px solid #c1a769;border-radius:20px;box-shadow:inset 0 1px 0 #f3df9d38,inset 0 -2px 3px #061f2590,0 8px 24px #10271f38}
#story-tools .instrument{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:72px;height:78px;padding:6px;margin:0;background:transparent;color:#edce87;border:1px solid transparent;border-radius:13px;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
#story-tools .instrument svg{width:43px;height:43px;filter:drop-shadow(0 2px 1px #071d15)}
#story-tools .instrument span{font:500 11px/1.2 system-ui;color:#faf1d6;letter-spacing:.02em}
#story-tools .instrument:hover,#story-tools .instrument[aria-expanded=true]{background:#f8e6b215;border-color:#e0c18460;transform:translateY(-1px)}
#story-tools .instrument:active{transform:translateY(1px);background:#091f20}
#preview-label{display:block;color:#fff8e5;font:11px/1.4 system-ui;margin:8px 10px;text-shadow:0 1px 4px #061e16,0 1px 8px #061e16}
.story-popover,#detail{position:fixed;inset:222px auto auto 24px;width:330px;max-width:calc(100vw - 48px);max-height:calc(100dvh - 350px);margin:0;overflow:auto;box-sizing:border-box;padding:26px;background:#f9f3e5;color:#254536;border:1px solid #b6a77e;border-radius:16px;box-shadow:0 14px 38px #11271f40;z-index:16;scrollbar-width:thin;scrollbar-color:#998353 #f9f3e5}
.story-popover h2,#detail h2{font:25px/1.2 Georgia,serif;margin:0 26px 18px 0;letter-spacing:-.02em}
#detail p{font:15px/1.55 Georgia,serif;margin:12px 0}#detail .detail-note{font:12px/1.5 system-ui;color:#596653}
.story-popover .popover-close,#detail #close-detail{position:absolute;top:6px;right:7px;width:40px;height:40px;display:grid;place-items:center;background:transparent;border:0;color:#395344;font:25px/1 system-ui;padding:0;cursor:pointer}
#navigation-model{font:18px/1.5 Georgia,serif;color:#294436;margin:0 0 14px;padding:0}
#hear-navigation{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px;margin:0 0 20px;border:1px solid #b9aa7f;border-radius:8px;background:#f1e8d3;color:#294436;font:12px system-ui;cursor:pointer}
#hear-navigation svg{width:22px;height:22px}
#guide-panel #navigation{position:static;transform:none;display:grid;grid-template-columns:1fr 1fr;gap:7px;max-width:none;width:auto;margin:0;padding:16px 0 0;border-top:1px solid #d7ccaf;background:transparent;border-radius:0;box-shadow:none}
#guide-panel #navigation button,#detail-body button{min-height:44px;margin:0;padding:9px 11px;background:#fffaf0;color:#294436;border:1px solid #c5b890;border-radius:8px;font:12px/1.4 system-ui;cursor:pointer;white-space:normal}
#guide-panel #navigation button[aria-pressed=true]{background:#244737;color:#fff2d3;border-color:#244737}
#guide-panel #navigation button:hover,#detail-body button:hover{background:#e8dec2;color:#233e30}
#detail-body [data-pattern]{display:inline-flex;flex-direction:column;align-items:center;gap:8px;width:calc(50% - 5px);padding:18px 8px;margin:12px 0;background:#1e4235;color:#f7e5bb;border:1px solid #a88b51;border-radius:12px;font:16px Georgia,serif}
#detail-body [data-pattern]::before{content:'';display:block;width:42px;height:42px;border:1px solid #c4a55d;border-radius:50%;background:repeating-radial-gradient(circle,#cfb572 0 1px,transparent 1px 5px);box-shadow:inset 0 0 0 8px #234537}
#detail-body [data-pattern]:hover{background:#315846;color:#fff4da}
#medals{gap:12px;padding:12px 18px;max-width:95vw}.medal{width:92px}.medal i{position:relative;background-size:cover;filter:grayscale(1);opacity:.7;border:2px solid #8e8775;box-shadow:inset 0 0 0 3px #ded6c3,inset 0 0 0 4px #9e947e,0 3px 5px #1a251f25;background-color:#c8c0ae!important}.medal.earned i{filter:none;opacity:1;border-color:#8f7134;background-color:#dbc080!important;box-shadow:inset 0 0 0 3px #f5e2ae,inset 0 0 0 4px #af8c40,0 4px 9px #503d202b}.medal span{display:block;line-height:1.25;font-size:11px;min-height:28px}
#discovery{pointer-events:none;top:110px;max-width:min(540px,90vw);text-align:center;border:1px solid #d5b577;box-shadow:0 5px 18px #2e251f26;z-index:17;white-space:normal}
.painting-studies{display:flex;gap:14px}.painting-studies figure{margin:0;flex:1}.painting-studies img{width:100%;border:4px solid #b09254;box-sizing:border-box}.painting-studies figcaption{font-size:13px;padding:6px 0}#detail-body article+article{border-top:1px solid #d8ceb7;padding-top:12px;margin-top:20px}#detail-body h3{font:22px Georgia,serif}#status{font-variant-numeric:tabular-nums}#load{padding:30px;text-align:center}
@media(min-width:1001px){#mia{width:130px;height:170px;bottom:12px}}
@media(min-width:701px) and (max-width:1000px){#story-tools{top:180px}.story-popover,#detail{top:282px;max-height:calc(100dvh - 410px)}}
@media(max-width:700px){header{max-width:calc(100vw - 28px)}header h1{font-size:25px}#story-tools{left:12px;top:174px;max-width:calc(100vw - 24px)}.instrument-tray{padding:5px;border-radius:16px;gap:2px}#story-tools .instrument{width:60px;height:66px;border-radius:11px;gap:2px}#story-tools .instrument svg{width:35px;height:35px}#story-tools .instrument span{font-size:10px}#preview-label{font-size:10px;margin:6px 8px}.story-popover,#detail{inset:260px auto auto 12px;width:330px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 385px);padding:20px}.story-popover h2,#detail h2{font-size:23px}#medals{gap:4px;padding:9px 8px;bottom:8px}.medal{width:57px}.medal i{height:43px;width:43px}.medal>span{font-size:10px;min-height:36px}#caption{left:auto;right:12px;transform:none;width:calc(100vw - 108px);max-width:calc(100vw - 108px);bottom:122px;font-size:14px}#mia{bottom:110px;width:80px;height:105px}#discovery{top:auto;bottom:226px;width:90vw}.painting-studies{gap:7px}.lesson-shell:has(.is-live) #story-tools{top:216px}.lesson-shell:has(.is-live) .story-popover,.lesson-shell:has(.is-live) #detail{top:302px;max-height:calc(100dvh - 427px)}}
@media(max-height:600px) and (min-width:701px){#story-tools{top:105px}.story-popover,#detail{top:105px;left:268px;max-height:calc(100dvh - 150px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(min-width:701px){#guide-panel{padding:20px;max-height:calc(100dvh - 300px)}#guide-panel h2{font-size:23px;margin-bottom:12px}#guide-panel #navigation-model{font-size:16px;line-height:1.45;margin-bottom:10px}#guide-panel #hear-navigation{margin-bottom:10px}#guide-panel #navigation{padding-top:10px}}
.orsay-artwork{margin:0;max-height:55vh;overflow:auto}.orsay-artwork img{display:block;width:100%;height:auto}.orsay-artwork figcaption{font:12px/1.5 system-ui;padding:10px 0}.orsay-field{display:block;margin:14px 0}.orsay-field textarea{display:block;width:100%;padding:10px;font:16px/1.5 system-ui;border:1px solid #b9ad91;background:#fffcf4;border-radius:6px}
body[data-environment=orsay] #guide-panel #navigation label,body[data-environment=orsay] #guide-panel #navigation select{grid-column:1/-1}body[data-environment=orsay] #guide-panel #navigation select{width:100%;min-height:44px;background:#fffaf0;color:#294436;border:1px solid #c5b890;border-radius:8px;font:13px system-ui;padding:8px}.orsay-field textarea{box-sizing:border-box}
/* A small record sleeve and four ivory rhythm keys, confined to the diner desk. */
#detail:has(.record-pair){width:370px;padding:23px;max-height:calc(100dvh - 318px)}
.record-pair{display:flex;gap:16px;align-items:flex-start}
#detail-body .record-choice{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;padding:0 0 10px;border:0;border-radius:0;background:transparent;text-align:center}
.record-choice svg{width:112px;max-width:100%;height:auto;filter:drop-shadow(0 4px 3px #25362b30)}
.record-choice span{font:18px/1.4 Georgia,serif;margin-top:7px}.record-choice small{font:11px/1.5 system-ui;color:#536448}
#detail-body .record-choice:hover{background:transparent;color:#71482b}.record-choice:hover svg{transform:rotate(8deg)}
#detail .rhythm-question{margin:8px 0 20px;font-size:16px}.rhythm-compose{border-top:1px solid #c7b992;padding-top:16px}
#detail-body .rhythm-compose h3{font:21px Georgia,serif;margin:0 0 6px}#detail .rhythm-compose p{font:12px/1.5 system-ui;margin:6px 0 12px;color:#526247}
.rhythm-slots{display:flex;gap:8px;margin:14px 0}.rhythm-slots button{flex:1;min-width:44px;height:48px;box-shadow:inset 0 -3px 0 #bbae8760}.rhythm-slots svg{width:26px;height:26px;fill:#284a3a}.rhythm-slots [aria-pressed=false] svg{fill:none;stroke:#6e795e;stroke-width:1.5}
.rhythm-actions{display:flex;gap:8px}#detail-body [data-own]{background:#254837;color:#fff3d5;flex:1}#detail-body [data-tempo]{min-width:60px}#detail .rhythm-status{min-height:36px;margin:12px 0 0}
@media(max-width:700px){#detail:has(.record-pair){width:calc(100vw - 24px);padding:18px;max-height:calc(100dvh - 375px)}.record-choice svg{width:84px}.record-choice span{font-size:17px}.rhythm-compose{padding-top:12px}#detail .rhythm-question{margin-bottom:12px}}
#detail-body .record-choice svg{width:100px;height:100px}#detail-body .rhythm-slots svg{width:26px;height:26px}
#detail-body .rhythm-compose{border:0;padding:0}#detail-body [data-make]{width:100%;background:#254837;color:#fff3d5}#detail-body [data-back]{margin-top:10px;border:0;background:transparent;padding-inline:0;text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){#detail-body .record-choice svg{width:84px;height:84px}}
.rhythm-playhead{display:flex;justify-content:center;gap:18px;padding:13px 0 1px}.rhythm-playhead i{width:9px;height:9px;border:1px solid #6d795e;border-radius:50%;background:transparent}.rhythm-playhead .is-beat{background:#244b37;border-color:#244b37}.rhythm-playhead .is-rest{background:#b69a5f;border-color:#b69a5f}#detail:has(.record-pair) .rhythm-status{font:12px/1.45 system-ui;color:#526247;margin:10px 0 0;min-height:35px}
/* Poppy's illustrated paperbacks: the same table-sized tool, with a reading pace. */
#detail:has(.tea-desk){width:380px;max-height:calc(100dvh - 310px);padding:22px}.tea-desk .tea-intro{color:#526247}#detail .tea-desk h2{margin-bottom:12px}
.tea-books{display:flex;gap:16px;margin:20px 0 10px}#detail-body .tea-books button{flex:1;min-width:0;padding:0 0 12px;border:0;background:transparent;border-radius:0;text-align:left}.tea-books img{display:block;width:100%;border:5px solid #365446;box-sizing:border-box;box-shadow:2px 4px 6px #26382b25}.tea-books button:nth-child(2) img{border-color:#854f42}.tea-books span{display:block;font:18px/1.3 Georgia,serif;margin-top:12px}.tea-books small{display:block;font:11px/1.5 system-ui;color:#536448;margin-top:5px}
#detail-body .tea-link{display:inline-flex;align-items:center;gap:8px;padding:8px 0;border:0;background:transparent;text-decoration:underline;text-underline-offset:4px;font:12px/1.5 system-ui}#detail-body .tea-link svg{width:22px;height:22px}.tea-story-art{width:100%;max-height:150px;object-fit:contain;display:block;background:#e9dfc5}#detail .tea-story-text{font:17px/1.6 Georgia,serif;margin:16px 0}#detail-body .tea-primary{display:block;width:100%;background:#254837;color:#fff3d5;margin-top:12px}
.tea-clues{display:flex;gap:12px;margin:14px 0}#detail-body .tea-clues button{flex:1;display:flex;align-items:center;gap:8px;padding:6px;background:transparent}.tea-clues svg{width:32px!important;height:32px!important;flex:none}.tea-clues [aria-expanded=true]{border-color:#365745!important;background:#e5dbc0!important}#detail .tea-clue-note{font:13px/1.5 system-ui;min-height:40px;color:#526247}#detail .tea-question{font:17px/1.5 Georgia,serif}
.tea-setting{display:flex;gap:8px;margin:18px 0}#detail-body .tea-setting button{flex:1;min-width:0;display:flex;align-items:center;flex-direction:column;background:#ede4ce;padding:8px}.tea-setting svg{width:52px!important;height:52px!important}.tea-setting span{font:14px Georgia,serif}.tea-setting button:disabled{opacity:.5;cursor:default}.tea-order{padding-left:22px;margin:14px 0;color:#2b4939;font:15px/1.8 Georgia,serif}#detail .tea-plan-note{font:13px/1.5 system-ui;min-height:38px;color:#526247}
@media(max-width:700px){#detail:has(.tea-desk){width:calc(100vw - 24px);padding:18px;max-height:calc(100dvh - 375px)}.tea-story-art{max-height:120px}#detail .tea-story-text{font-size:16px}.tea-books{gap:12px;margin-top:14px}.tea-books span{font-size:17px}}
.tea-actions{display:flex;gap:14px;align-items:center}#detail-body .tea-actions .tea-primary{flex:1;margin:0}.tea-actions .tea-link{flex:none}.tea-setting{margin:12px 0}#detail-body .tea-setting svg{width:44px!important;height:44px!important}.tea-story-art{max-height:110px}.tea-story-art.tea-clue-art{max-height:80px}#detail .tea-story-text{font-size:16px;line-height:1.5;margin:12px 0}#detail .tea-desk h2:focus{outline:none}
#detail:has(.tea-setting) .tea-intro{margin:6px 0}#detail .tea-plan-note{min-height:0;margin:8px 0 12px}.tea-order{margin:8px 0;line-height:1.65}
#detail:has(.studio-desk){width:380px;padding:22px;max-height:calc(100dvh - 310px)}.studio-tabs{display:flex;gap:6px;border-bottom:1px solid #c6b78f;margin:0 0 14px;padding-bottom:10px}#detail-body .studio-tabs button{flex:1;border:0;background:transparent;padding:7px}#detail-body .studio-tabs [aria-current=page]{background:#254837;color:#fff3d5}
.studio-comparison{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;border:5px solid #b1965e;box-sizing:border-box}.studio-comparison img{display:block;width:100%;height:100%;object-fit:cover}.studio-warm{position:absolute;inset:0}.studio-comparison i{position:absolute;top:0;bottom:0;width:2px;background:#fff3d5;pointer-events:none}.studio-slider{display:flex;gap:8px;align-items:center;font:11px/1.4 system-ui;color:#536448;margin:10px 0}.studio-slider input{flex:1;min-width:70px;accent-color:#365746;min-height:32px}.studio-palettes{display:flex;gap:12px;margin-bottom:12px}#detail-body .studio-palettes button{display:flex;flex-direction:column;align-items:center;gap:5px;flex:1;background:transparent;padding:7px;font:15px Georgia,serif}#detail-body .studio-palettes svg{width:100px;height:68px}#detail-body .studio-palettes [aria-pressed=true]{border-color:#365746;background:#e8dec4}.studio-preview{display:block;width:100%;height:135px;object-fit:contain;background:#e5dcc5}
#detail-body .studio-primary{width:100%;background:#254837;color:#fff3d5;margin-top:10px}#detail-body .studio-link{border:0;background:transparent;text-decoration:underline;text-underline-offset:4px;padding-inline:0;margin-top:4px}.studio-title{display:block;font:14px Georgia,serif;margin:12px 0}.studio-title input{box-sizing:border-box;display:block;width:100%;min-height:44px;padding:9px;margin-top:7px;border:1px solid #b6a57c;border-radius:6px;background:#fffbef;color:#294436;font:17px Georgia,serif;caret-color:#294436}#detail .studio-choice-note,#detail .studio-export{font:12px/1.5 system-ui;color:#536448}#detail .studio-desk p{font-size:14px;line-height:1.5;margin:10px 0}#detail .studio-desk h2:focus{outline:none}
@media(max-width:700px){#detail:has(.studio-desk){width:calc(100vw - 24px);padding:18px;max-height:calc(100dvh - 375px)}.studio-comparison{aspect-ratio:1.8}.studio-preview{height:110px}}
.studio-colour-body,.studio-label-body{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}.studio-colour-body .studio-palettes{flex-direction:column;margin:0;gap:8px;grid-column:2}.studio-colour-body .studio-preview{grid-column:1;grid-row:1;height:184px;object-fit:cover}#detail-body .studio-colour-body .studio-palettes button{flex-direction:row;text-align:left;gap:3px;padding:7px 4px;min-height:88px;font-size:13px}#detail-body .studio-colour-body .studio-palettes svg{width:64px;height:44px}.studio-label-body .studio-preview{height:160px;object-fit:cover}.studio-label-body .studio-title{margin:0}.studio-label-body p{font-size:12px!important}.studio-label-body .studio-title input{font-size:15px}.studio-comparison{width:210px;margin:0 auto;aspect-ratio:4/3}.studio-look-footer{display:flex;gap:10px;align-items:center;justify-content:space-between}.studio-look-footer p{flex:1}.studio-look-footer button{flex:none}.studio-export:empty{display:none}#detail:has(.studio-desk){width:430px}#detail .studio-desk h2{margin-bottom:10px}.studio-tabs{padding-bottom:6px;margin-bottom:12px}
@media(max-width:700px){#detail:has(.studio-desk){width:calc(100vw - 24px)}.studio-colour-body,.studio-label-body{gap:10px}.studio-label-body{grid-template-columns:110px 1fr}.studio-comparison{aspect-ratio:4/3}.studio-colour-body .studio-preview{height:184px}}
/* Sharing activity: a serving board and three plates, not the studio tab layout. */
#detail:has(.pizza-desk){width:580px;padding:20px;max-height:calc(100dvh - 310px)}#detail .pizza-desk h2{margin-bottom:5px}.pizza-instruction,.pizza-speaking{font-size:13px!important;line-height:1.4;margin:8px 0!important}.pizza-worktop{display:grid;grid-template-columns:160px 1fr;align-items:center;gap:15px}#detail-body .pizza-whole svg{width:160px;height:160px;display:block}.pizza-whole>span{display:block;text-align:center;font-size:12px}.pizza-whole g{cursor:pointer}.pizza-whole g:focus-visible path{stroke:#1c5140;stroke-width:7}.pizza-whole text{font:14px Georgia;pointer-events:none}.pizza-plates{display:flex;gap:8px}.pizza-plates button{padding:0!important;border:0!important;background:transparent!important;min-width:80px;flex:1}.pizza-dish{display:flex;flex-direction:column;align-items:center;justify-content:center;border:6px double #b49d70;border-radius:50%;width:80px;height:80px;color:#324c3b}.dish-1{background:#e7d8b9}.dish-2{background:#b9c8b3}.dish-3{background:#c6c5d5}.pizza-dish strong{font:25px Georgia}.pizza-plates button>span:last-child{font-size:12px}.pizza-actions{display:flex;gap:8px;margin-top:12px}.pizza-actions button,.pizza-under button{min-height:42px;font-size:12px;padding:8px 10px}.pizza-under{margin-top:10px;display:flex;gap:8px}.pizza-under p{font-size:13px!important;margin:0!important}.pizza-speaking{color:#455d49}
@media(max-width:699px){#detail:has(.pizza-desk){width:calc(100vw - 24px);max-height:calc(100dvh - 355px)}.pizza-worktop{grid-template-columns:130px 1fr;gap:9px}#detail-body .pizza-whole svg{width:130px;height:130px}.pizza-plates{gap:4px;flex-wrap:wrap;justify-content:center}.pizza-plates button{min-width:52px;flex:0}.pizza-dish{width:52px;height:52px;border-width:4px}.pizza-dish b{font-size:12px}.pizza-dish strong{font-size:20px}.pizza-actions{gap:5px}.pizza-actions button{padding:6px;font-size:11px}.pizza-instruction{max-width:270px}.pizza-whole>span{font-size:10px}.pizza-speaking{margin-bottom:0!important}}
/* Detective desk: a movable optical lens, reflected receipt, and physical box choices. */
#detail:has(.detective-desk){width:590px;padding:20px;max-height:calc(100dvh - 310px)}#detail .detective-desk h2{margin-bottom:5px}.detective-prompt,.case-status{font-size:13px!important;margin:8px 0!important;line-height:1.4!important}.detective-evidence{display:grid;grid-template-columns:minmax(0,1fr) 145px;gap:14px;align-items:center}.receipt-surface{min-width:0}#detail-body .receipt-surface svg{display:block;width:100%;height:auto;max-height:180px;touch-action:none}.receipt-surface label{display:flex;align-items:center;gap:10px;font:11px system-ui}.receipt-surface input{width:100%;min-width:0;accent-color:#456047}.mirror-face{height:110px;background:#c7d2c6;border:6px double #ad945f;display:flex;align-items:center;justify-content:center;color:#4c6455;font:15px Georgia}.mirror-face img{width:100%;transform:scaleX(-1)}#detail-body .case-mirror button{width:100%;margin-top:8px;padding:6px;font-size:11px}.case-boxes{display:flex;gap:9px;margin-top:12px}.case-boxes button{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;font-size:11px!important;padding:8px!important}.case-boxes i{display:block;width:26px;height:21px;border:2px solid #ad965f;border-top-width:5px;flex:none}.blue-case{background:#5d7889}.green-case{background:#698263}.case-status{min-height:36px}
@media(max-width:699px){#detail:has(.detective-desk){width:calc(100vw - 24px);padding:18px;max-height:calc(100dvh - 350px)}.detective-evidence{grid-template-columns:minmax(0,1fr) 93px;gap:10px}.mirror-face{height:87px;border-width:4px;font-size:13px}.receipt-surface label{display:block;font-size:10px}.receipt-surface input{margin-top:8px}.case-boxes{gap:5px}.case-boxes button{flex-direction:column;gap:4px;font-size:10px!important;padding:5px!important}.case-status{font-size:12px!important}.case-mirror button{min-height:44px}.detective-prompt{max-width:280px}}
/* Shadow workshop keeps source shapes and projected silhouette visible together. */
#detail:has(.shadow-desk){width:550px;padding:20px;max-height:calc(100dvh - 310px)}#detail .shadow-desk h2{margin-bottom:9px}.shadow-views{display:grid;grid-template-columns:1fr 1.3fr;gap:12px}.shadow-views figure{margin:0;background:#e4d6b9;border:1px solid #b4a27a}.shadow-views figure.projected-view{background:#f2e6c6;border:5px double #a38c5e}#detail-body .shadow-views svg{width:100%;height:138px;display:block}.shadow-views figcaption{font:11px system-ui;text-align:center;padding:4px}.paper-turns{display:flex;gap:8px;margin:10px 0}.paper-turns button{flex:1}.lamp-control{display:flex;align-items:center;gap:12px;font:12px system-ui;margin:12px 0}.lamp-control input{min-width:0;flex:1;accent-color:#4e6852}.lamp-control span{min-width:40px}.shadow-actions{display:flex;gap:7px}.shadow-actions button{font-size:11px!important;padding:7px!important;flex:1}.shadow-note{font-size:12px!important;line-height:1.4!important;margin:9px 0 0!important}
@media(max-width:699px){#detail:has(.shadow-desk){width:calc(100vw - 24px);padding:18px;max-height:calc(100dvh - 355px)}#detail-body .shadow-views svg{height:115px}.shadow-views{gap:8px;grid-template-columns:1fr 1fr}.shadow-views figcaption{font-size:10px;min-height:24px}.paper-turns button{font-size:11px!important;padding:7px!important}.lamp-control{gap:7px;font-size:11px}.shadow-actions{gap:5px}.shadow-actions button{font-size:10px!important}.shadow-note{font-size:12px!important}}

/* Fictional city planning desk */
.planner-desk{width:min(600px,100%);color:#294436}.planner-desk .planner-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.planner-desk h2{font:26px Georgia;margin:0}.planner-desk .planner-heading span{white-space:nowrap;font-weight:700;color:#9b5237}.planner-fiction{font-size:12px;margin:6px 0 10px;color:#697568}#detail-body .planner-map{display:block;width:100%;height:auto;max-height:210px}.planner-constraints,.planner-add{display:flex;gap:12px;margin-top:10px}.planner-constraints label{flex:1;font-size:12px}.planner-desk select{width:100%;display:block;padding:9px;border:1px solid #c7ccb8;border-radius:7px;background:#fffbef;color:#294436;font:14px inherit}.planner-add select{flex:1;min-width:0}.planner-desk button{padding:8px 12px;background:#e3e9d8;border:1px solid #bcc9b1;border-radius:7px;color:#294436;min-height:36px}.planner-route{margin:10px 0;padding-left:25px}.planner-route li{padding:4px 0}.planner-route li span{display:inline-block;width:calc(100% - 100px)}.planner-route small{color:#687568}.planner-route button{margin-left:5px;padding:3px 9px}.planner-status{font-size:13px;line-height:1.5;margin:8px 0}.planner-footer{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.planner-footer span{font-size:12px}@media(max-width:650px){.planner-desk h2{font-size:21px}.planner-desk .planner-heading{align-items:flex-start}.planner-desk .planner-heading span{font-size:12px}#detail-body .planner-map{max-height:165px}.planner-constraints{gap:8px}.planner-route small{display:block}}
#detail:has(.planner-desk){width:620px;padding:20px;max-height:calc(100dvh - 310px)}.planner-desk{display:grid;grid-template-columns:230px 1fr;column-gap:18px}.planner-desk .planner-heading,.planner-fiction,.planner-footer{grid-column:1/-1}.planner-desk .planner-map{grid-column:1;grid-row:3/7;align-self:start}.planner-constraints,.planner-add,.planner-route,.planner-status{grid-column:2}.planner-constraints{margin-top:0}#detail .planner-desk h2{font-size:23px;margin:0}#detail-body .planner-map{min-height:170px}.planner-route{font-size:13px}.planner-route li span{width:calc(100% - 90px)}#detail .planner-status{font:12px/1.4 system-ui;margin:6px 0 10px}.planner-desk button{font-size:12px}.planner-footer{margin-top:8px}@media(max-width:700px){#detail:has(.planner-desk){width:calc(100vw - 24px);padding:18px;max-height:calc(100dvh - 375px)}.planner-desk{display:block}#detail .planner-desk h2{font-size:19px}.planner-desk .planner-heading span{font-size:11px}#detail-body .planner-map{min-height:0;max-height:125px}.planner-constraints{margin-top:8px}.planner-route li span{width:calc(100% - 95px)}}

#detail .planner-fiction{font:12px/1.4 system-ui;margin:8px 0 12px}#detail .planner-heading{position:static;display:flex;text-shadow:none;color:#294436;min-width:0;padding:0;background:none;border:0}.planner-heading span{margin-right:22px}
#detail-body .planner-desk button{min-height:32px;padding:6px 10px;font:12px/1.25 system-ui}#detail-body .planner-route button{padding:3px 8px;min-height:28px}#detail-body .planner-desk select{font:13px/1.25 system-ui;padding:8px}.planner-route{margin:8px 0}.planner-route li{padding:3px 0}

#detail-body .planner-route button svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}@media(max-width:700px){.planner-route small{display:inline;margin-left:5px}#detail-body .planner-map{max-height:110px}}
/* A slow gold reveal, one travelling glint and a settling constellation. */
#medals .medal{position:relative;isolation:isolate}
#medals .medal.newly-earned i{animation:mia-gold-reveal 3.4s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--reward-offset,0ms)}
#medals .medal.newly-earned::before,#medals .medal.newly-earned::after{content:'';position:absolute;pointer-events:none;z-index:2;animation-delay:var(--reward-offset,0ms)!important}
#medals .medal.newly-earned::before{inset:-13px 0 25px;border-radius:50%;background:conic-gradient(from 10deg,transparent 0deg,#ffe49a99 18deg,transparent 35deg,transparent 65deg,#fff1bbaa 82deg,transparent 100deg,transparent 140deg,#ffd57799 158deg,transparent 177deg,transparent 220deg,#fff1bb99 237deg,transparent 255deg,transparent 300deg,#ffd57799 317deg,transparent 335deg);animation:mia-gold-rays 3.4s ease-out both;z-index:-1}
#medals .medal.newly-earned::after{left:50%;top:25%;width:5px;height:5px;border-radius:50%;background:#fff6cf;box-shadow:-28px -16px 2px #ffe3a1,25px -23px 1px #fff4bb,36px 13px 2px #f5ca68,-34px 22px 1px #ffe3a1,10px 37px 2px #fff4bb;animation:mia-gold-stars 3.4s ease-out both}
#medals .medal.newly-earned i::after{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 25%,#fff9dfdd 46%,#fff 50%,transparent 64%);animation:mia-gold-glint 3.4s ease-out both;animation-delay:var(--reward-offset,0ms);pointer-events:none}
@keyframes mia-gold-reveal{0%{transform:scale(.93);filter:grayscale(1) brightness(.8)}28%{transform:scale(1.04);filter:grayscale(.3) brightness(1.2)}48%,68%{transform:scale(1.16);filter:grayscale(0) brightness(1.45) drop-shadow(0 4px 15px #ffc34b)}100%{transform:scale(1);filter:none}}
@keyframes mia-gold-rays{0%{opacity:0;transform:scale(.65) rotate(-25deg)}35%,60%{opacity:.85}100%{opacity:0;transform:scale(1.5) rotate(35deg)}}
@keyframes mia-gold-stars{0%,18%{opacity:0;transform:scale(.4)}42%,66%{opacity:1}100%{opacity:0;transform:translateY(-17px) scale(1.3)}}
@keyframes mia-gold-glint{0%,25%{opacity:0;transform:translateX(-55%) scaleX(.4)}45%{opacity:.9}72%,100%{opacity:0;transform:translateX(55%) scaleX(.4)}}
@media(prefers-reduced-motion:reduce){#medals .medal.newly-earned i{animation:none!important;outline:3px solid #edc572;outline-offset:3px}#medals .medal.newly-earned::before,#medals .medal.newly-earned::after,#medals .medal.newly-earned i::after{display:none}}

.journey-choices{display:grid;gap:8px;margin:14px 0}.journey-choices button[aria-pressed=true]{outline:2px solid #8ba284}#journey-note{display:block;width:100%;min-height:130px;margin:10px 0;padding:12px;font:inherit;box-sizing:border-box}

/* Four new journeys: scene-first lettering, following Mia ESL voice guidance. */
body[data-environment=journey] .instrument-tray,body[data-environment=journey] #caption{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;text-shadow:0 1px 3px #102d27,0 2px 12px #102d27}
body[data-environment=journey] #story-tools .instrument{color:#fff9e8;text-shadow:0 1px 3px #102d27,0 2px 10px #102d27}
#journey-voice-navigation{position:fixed;left:24px;top:310px;z-index:12;width:220px;pointer-events:none;color:#fffbed;text-shadow:0 1px 3px #16372c,0 2px 10px #16372c;font:12px/1.8 system-ui}
#journey-voice-navigation>span{display:block;font-size:9px;letter-spacing:.14em;color:#fff0bd}#journey-voice-navigation strong{display:block;font-size:15px;margin:3px 0 8px}#journey-voice-navigation small{display:block;margin-top:8px;line-height:1.5;max-width:210px}#journey-voice-navigation.moving strong{color:#ffe2a1}
@media(max-width:700px){#journey-voice-navigation{left:20px;top:280px;width:215px;font-size:11px}#journey-voice-navigation strong{font-size:14px}}
@media(max-height:600px) and (min-width:701px){#journey-voice-navigation{top:215px;font-size:11px}}

#journey-voice-navigation details{pointer-events:auto}#journey-voice-navigation summary{cursor:pointer;min-height:32px;font-weight:650;font-size:12px}#journey-voice-navigation strong{display:block}#journey-voice-navigation details:not([open])+small{margin-top:0}
@media(max-width:700px){body:has(#scene[data-inspection-target]) #journey-voice-navigation small{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}
