:root{color-scheme:dark;--cream:#f5ecd8;--muted:#c9cabe;--gold:#e6bb78}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#0c1820;color:var(--cream);font-family:'DM Sans',sans-serif}body{overflow:hidden}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button{border:0}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #f7d899;outline-offset:5px}main{height:100svh;min-height:580px;position:relative;overflow:hidden}.world{position:absolute;width:max(100vw,150svh);aspect-ratio:3/2;top:50%;left:50%;transform:translate(-50%,-50%)}.landscape{width:100%;height:100%;display:block}.warmth{position:absolute;left:34%;top:59%;width:32%;height:29%;background:radial-gradient(ellipse,#ffa63a35,transparent 67%);mix-blend-mode:screen;animation:warmth 5s ease-in-out infinite alternate}.wizard{position:absolute;width:18%;height:auto;left:28%;bottom:27%;filter:brightness(.82) drop-shadow(5px 8px 7px #110e0b88);transform-origin:50% 97%;animation:breathe 6s ease-in-out infinite}.wizard.telling{animation:breathe 4.2s ease-in-out infinite} .vignette{position:absolute;inset:0;background:linear-gradient(#07131b7a,transparent 48%,#070e10a0 87%,#060e12eb),linear-gradient(90deg,#07101540,transparent 20%,transparent 80%,#07101540);pointer-events:none}#particles{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}header{position:absolute;z-index:4;top:0;left:0;right:0;padding:32px 44px;display:flex;justify-content:space-between;align-items:center}.brand{font-family:'Libre Caslon Display',Georgia,serif;font-size:32px;letter-spacing:.4px;display:flex;gap:9px;align-items:center;color:var(--cream);text-decoration:none}.brand svg{color:#eabe79}.brand-dot{color:#cba66c;margin-left:-7px}.header-right{display:flex;align-items:center;gap:25px}.prototype{font-size:9px;letter-spacing:2.3px;color:#c7cabd99}.icon-btn{background:#11232978;border:1px solid #d2dcca22;width:40px;height:40px;border-radius:50%;font-size:24px;color:#dfd7c5}.welcome{position:absolute;top:15%;left:0;width:100%;text-align:center;transition:opacity 1s,transform 1s;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:3.4px;color:#dfc698;margin:0 0 18px}h1{font-family:'Libre Caslon Display',Georgia,serif;font-weight:400;font-size:clamp(45px,5.2vw,78px);line-height:1.02;letter-spacing:-1.5px;margin:0;text-shadow:0 3px 25px #00132670}.intro{font-size:12px;letter-spacing:.25px;color:#d4d9cc;margin-top:22px}.fire{position:absolute;left:43%;bottom:26.5%;width:14%;height:22%;filter:drop-shadow(0 0 24px #ff9b2977)}.log{position:absolute;bottom:1%;left:15%;width:73%;height:8%;border:3px solid #513421;border-radius:45%;background:repeating-linear-gradient(0deg,#382a1c 0 3px,#6b3f22 4px 6px);box-shadow:inset 0 3px 3px #be793c}.l1{transform:rotate(15deg)}.l2{transform:rotate(-16deg)}.flame{position:absolute;bottom:6%;left:22%;width:54%;height:85%;border-radius:70% 30% 55% 45% / 65% 65% 35% 35%;transform-origin:50% 96%;background:linear-gradient(0deg,#ffd97d 1%,#ffae35 48%,#ea732700 100%);animation:flame 2.5s ease-in-out infinite alternate;mix-blend-mode:screen}.f1{left:6%;height:65%;width:43%;animation-delay:-.9s;transform:rotate(-15deg)}.f2{left:39%;height:73%;width:43%;animation-delay:-1.4s}.f3{left:24%;height:100%;width:41%;animation-delay:-.4s;background:linear-gradient(0deg,#ffed9d,#ffad3990 75%,#ff8f1d00)}.f4{left:12%;height:51%;width:77%;animation-delay:-2s}.core{left:31%;width:38%;height:45%;background:linear-gradient(#fff4b9dd,#fff3b3);filter:blur(3px)}footer{position:absolute;z-index:4;bottom:25px;left:50%;transform:translateX(-50%);width:min(510px,calc(100% - 40px));transition:opacity 1s,transform 1s}.story-card{position:relative;display:flex;gap:17px;align-items:center;padding:20px 22px 23px;border:1px solid #d2c29235;background:linear-gradient(135deg,#19282aeb,#142324ed);backdrop-filter:blur(18px);border-radius:16px;box-shadow:0 12px 45px #0003;overflow:hidden}.story-mark{font-size:33px;color:#d9b883;width:38px;text-align:center}.story-info{flex:1}.story-info p{margin:0 0 6px;font-size:8px;letter-spacing:2px;color:#bcc6b5}.story-info h2{font-family:'Libre Caslon Display',Georgia,serif;font-size:25px;font-weight:400;margin:0 0 4px}.story-info>span{font-size:10px;color:#9facaa}.play{display:flex;align-items:center;gap:8px;padding:12px 18px;background:#e9ce99;color:#263132;border-radius:24px;font-size:11px;font-weight:600;transition:background .2s}.play:hover{background:#f5e0b5}.progress{position:absolute;bottom:0;left:0;right:0;height:2px;background:#ffffff08}#progress{height:100%;width:0;background:#eac780;transition:width .2s}.footer-bottom{display:flex;justify-content:space-between;align-items:center;margin:14px 4px 0}.footer-bottom button{background:none;font-size:10px;color:#c2c6b7;padding:5px 0}.footer-bottom>button:hover{color:#fff1cf}#sound-icon{font-size:17px;vertical-align:middle;margin-right:5px}.emotes{display:flex;gap:8px}.emotes button{border:1px solid #d9d8b322;border-radius:50%;font-size:21px;width:32px;height:32px;padding:0;transition:background .2s}.emotes button:hover{background:#f3d3a126;color:#fff0cd}#quiet span{margin-left:5px}#settings{position:absolute;z-index:10;right:35px;top:90px;width:300px;padding:23px;background:#14262af5;border:1px solid #d3c19844;border-radius:15px;box-shadow:0 20px 50px #0006;backdrop-filter:blur(20px)}.panel-heading{font-family:Georgia,serif;font-size:17px;display:flex;align-items:center;justify-content:space-between;margin-bottom:23px}.panel-heading button{background:none;font-size:24px;color:#a6b4ae}#settings label{display:flex;align-items:center;justify-content:space-between;margin:18px 0;font-size:12px}input[type=range]{width:125px;accent-color:#dab47c}input[type=checkbox]{accent-color:#dfc086;width:16px;height:16px}#settings p{font-size:10px;line-height:1.7;color:#a3b5af;margin:22px 0 0;border-top:1px solid #fff1;padding-top:16px}.caption{position:absolute;bottom:200px;left:50%;transform:translateX(-50%);padding:12px 22px;background:#0a171bdb;border-radius:10px;max-width:620px;width:max-content;font-size:14px;line-height:1.6;text-align:center;z-index:3;color:#f2ead7;max-width:min(620px,90vw)}#return{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:8;background:#14272cbb;border:1px solid #d6cdad33;border-radius:30px;padding:12px 22px;font-size:11px;color:#dacdb2;backdrop-filter:blur(10px)}body.quiet .welcome,body.quiet footer{opacity:0;pointer-events:none;transform:translateY(-8px)}body.quiet footer{transform:translate(-50%,20px)}body.quiet .caption{bottom:90px}body.listening .welcome{opacity:.35}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}[hidden]{display:none!important}
@keyframes breathe{50%{transform:rotate(.5deg) scaleY(1.008)}}@keyframes warmth{to{opacity:.55}}@keyframes flame{0%{transform:scaleX(.94) scaleY(.92) rotate(-4deg);opacity:.85}50%{transform:scaleX(1.04) scaleY(1.03) rotate(2deg)}100%{transform:scaleX(.96) scaleY(.98) rotate(5deg);opacity:1}}@keyframes spark-breathe{50%{transform:translateY(-3px) rotate(-1deg)}}@keyframes head-glow{to{box-shadow:inset -6px -5px 10px #ed964c88,0 0 28px #ffd07aaa,0 0 65px #ffb63248}}@keyframes blink{0%,43%,47%,100%{transform:scaleY(1)}45%{transform:scaleY(.08)}}@keyframes reaction{0%{opacity:0;transform:translateY(15px) scale(.5)}25%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-45px) scale(1.15)}}@keyframes wave{50%{transform:rotate(-125deg)}}@keyframes hop{50%{transform:translateY(-12px)}}body.reduced *{animation:none!important;transition:none!important}@media(prefers-reduced-motion:reduce){body:not(.motion-allowed) *{animation:none!important;transition:none!important}}
@media(max-width:600px){header{padding:22px}.brand{font-size:28px}.prototype{font-size:7px;letter-spacing:1.6px}.header-right{gap:12px}.welcome{top:17%}.eyebrow{font-size:7px;letter-spacing:2.4px}h1{font-size:48px}.intro{font-size:10px;margin-top:17px}.world .wizard{left:37%;width:13%;bottom:29%}.spark-wrap{left:56.5%;width:7%;bottom:20.5%;height:17%}.fire{width:11%;left:44.5%;height:19%;bottom:27%}footer{bottom:20px;width:calc(100% - 30px)}.story-card{padding:16px 15px 20px;gap:10px}.story-mark{width:28px}.story-info h2{font-size:23px}.story-info p{font-size:7px}.play{padding:11px 14px}.footer-bottom>button{font-size:9px}.emotes{gap:6px}.emotes button{width:29px;height:29px}#settings{right:15px;top:80px;width:min(300px,calc(100% - 30px))}.caption{bottom:182px;font-size:12px}.spark-label{font-size:6px}}@media(max-height:700px) and (min-width:601px){.welcome{top:16%}h1{font-size:48px}.intro{margin-top:12px}.story-card{padding:12px 20px 15px}footer{bottom:15px}.world .wizard{width:16%;left:30%;bottom:29%}.spark-wrap{bottom:22%;height:17%;width:7%}}
/* The storyteller is cut from the matching painted scene, preserving natural edges. */
.world .wizard{inset:0;width:100%;height:100%;filter:none;transform-origin:29% 70%;animation:wizard-rest 6s ease-in-out infinite}.world .wizard.telling{animation:wizard-tell 5s ease-in-out infinite}.fire{height:18%;filter:blur(.7px) drop-shadow(0 0 23px #ff9b29aa)}.flame{background:linear-gradient(0deg,#ffdb77 1%,#ffae35 48%,#ed7b26bb 82%,#ffad2900 100%);filter:blur(2px)}.core{background:linear-gradient(#ffe7a6,#fff3b3);filter:blur(4px)}.vignette{background:linear-gradient(#07131b66,transparent 43%,#070e1040 77%,#060e12d9),linear-gradient(90deg,#07101530,transparent 20%,transparent 80%,#07101530)}@keyframes wizard-rest{50%{transform:scaleY(1.002) rotate(.08deg)}}@keyframes wizard-tell{50%{transform:scaleY(1.004) rotate(.15deg)}}@media(max-width:600px){.world .wizard{left:11%;animation:wizard-rest 6s ease-in-out infinite}.world .wizard.telling{animation:wizard-tell 5s ease-in-out infinite}.fire{height:16%}.welcome{top:13%}}
@media(max-width:600px){.world .wizard{left:14%;transform:scale(.68);animation:wizard-mobile 6s ease-in-out infinite}.world .wizard.telling{animation:wizard-mobile 4.5s ease-in-out infinite}}@keyframes wizard-mobile{50%{transform:scale(.682,.684) rotate(.12deg)}}

/* Spark: a tiny woodland body beneath a large, living flame. */
.spark-wrap{position:absolute;z-index:2;width:clamp(52px,4.5vw,78px);height:auto;aspect-ratio:180/240;pointer-events:none;transform:translate(-50%,-100%) scale(var(--depth,1));transform-origin:50% 96%;will-change:left,top}
.spark-hop,.spark{width:100%;height:100%;position:absolute;inset:0;transform-origin:50% 96%}.spark-hop{transform:translateY(var(--jump,0px))}.spark{animation:none}.spark-figure{display:block;width:100%;height:100%;overflow:visible}.spark-head{filter:drop-shadow(0 0 9px #ffc44b80) drop-shadow(0 0 24px #ffb34742);transform-origin:90px 158px;animation:spirit-head 3.8s ease-in-out infinite}.flame-inner{transform-origin:90px 160px;animation:inner-flame 2.7s ease-in-out infinite alternate}.spark-eyes{transform-origin:90px 129px;animation:spirit-blink 6.7s infinite}.spirit-arm,.spirit-leg{transform-box:view-box}.arm-left{transform-origin:78px 174px}.arm-right{transform-origin:102px 174px}.leg-left{transform-origin:82px 204px}.leg-right{transform-origin:99px 204px}.spark-shadow{position:absolute;left:32%;bottom:1%;width:36%;height:5%;border-radius:50%;background:#1d1818a0;filter:blur(3px);transform:scale(var(--shadow-scale,1));opacity:var(--shadow-opacity,.65)}.spark-label{position:absolute;top:106%;width:100%;text-align:center;font-size:8px;letter-spacing:2px;text-transform:uppercase;color:#e5d6b4}.spark-label span{color:#f4ce7b}.reaction{position:absolute;left:42%;top:-10%;color:#ffedb7;font-size:32px;opacity:0}.spark-wrap.heart .reaction{animation:reaction 2s ease-out}.spark-wrap.wave .arm-right{animation:spirit-wave .5s ease-in-out 4}.spark-wrap.glow .spark-head{filter:brightness(1.15) drop-shadow(0 0 16px #ffd881) drop-shadow(0 0 35px #ffb650bb)}.spark-wrap.walking .standing-body{animation:spirit-walk .48s ease-in-out infinite}.spark-wrap.walking .leg-left{animation:spirit-step .48s ease-in-out infinite}.spark-wrap.walking .leg-right{animation:spirit-step .48s ease-in-out infinite reverse}.spark-wrap.walking .arm-left{animation:spirit-swing .48s ease-in-out infinite}.spark-wrap.walking:not(.wave) .arm-right{animation:spirit-swing .48s ease-in-out infinite reverse}.spark-wrap.airborne .spirit-leg{transform:rotate(-6deg)}.movement-hint{margin:10px 0 -2px;text-align:center;color:#a7b2a3;font-size:9px;letter-spacing:.3px}.movement-hint span{color:#ddd4b8;letter-spacing:1px}.movement-hint i{font-style:normal;padding:0 8px;color:#718982}
@keyframes spirit-idle{50%{transform:translateY(-2px) rotate(-.7deg)}}@keyframes spirit-head{50%{transform:rotate(1.2deg) scale(1.012,.985)}}@keyframes inner-flame{to{transform:scale(.94,1.025);opacity:.7}}@keyframes spirit-blink{0%,43%,47%,100%{transform:scaleY(1)}45%{transform:scaleY(.13)}}@keyframes spirit-wave{50%{transform:rotate(-115deg)}}@keyframes spirit-step{0%,100%{transform:rotate(-10deg) translateY(0)}50%{transform:rotate(12deg) translateY(-2px)}}@keyframes spirit-swing{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(12deg)}}@keyframes spirit-walk{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-2px) rotate(1deg)}}
@media(max-width:600px){.spark-wrap{width:56px;height:auto}.movement-hint{font-size:8px;margin-top:9px}.caption{bottom:204px}}@media(max-height:700px) and (min-width:601px){.spark-wrap{width:54px;height:auto}}

.night-layers{border-top:1px solid #ffffff12;border-bottom:1px solid #ffffff12;padding:2px 0}#settings{max-height:calc(100svh - 110px);overflow-y:auto}

/* Pose changes affect only the body; the flame keeps its own animation clock. */
.standing-body,.seated-body{transition:opacity .65s ease;transform-origin:90px 230px}
.standing-body{opacity:1;animation:spirit-idle 4.7s ease-in-out infinite}
.seated-body{opacity:0;pointer-events:none}
.spark-wrap.seated .standing-body{opacity:0}
.spark-wrap.sit-crossed .pose-crossed,.spark-wrap.sit-knees .pose-knees,.spark-wrap.sit-stretched .pose-stretched{opacity:1;animation:seated-breath 5.8s ease-in-out infinite}
@keyframes seated-breath{50%{transform:scaleY(.985) scaleX(1.008)}}
.spark-wrap.walking .standing-body,.spark-wrap.airborne .standing-body{opacity:1;transition-duration:.12s}
.spark-wrap.walking .seated-body,.spark-wrap.airborne .seated-body{opacity:0;transition-duration:.12s}

/* Layered flame tongues rise from a bed of embers and rounded split logs. */
.fire{filter:drop-shadow(0 0 15px #ff982d55)}
.campfire-art{display:block;width:100%;height:100%;overflow:visible}
.fire-tongue{transform-box:view-box;transform-origin:120px 264px;animation:living-flame 2.3s ease-in-out infinite alternate}
.tongue-left{animation-duration:1.7s;animation-delay:-.8s;opacity:.85}
.tongue-tall{animation-duration:2.7s;animation-delay:-1.3s}
.tongue-right{animation-duration:1.9s;animation-delay:-.4s;opacity:.85}
.tongue-front{animation-duration:1.4s;animation-delay:-1.9s;opacity:.8}
.tongue-core{animation-duration:1.8s;animation-delay:-.6s}
.coal-light{animation:coal-breathe 3.7s ease-in-out infinite alternate}
@keyframes living-flame{0%{transform:scale(.95,.91) skewX(-3deg);opacity:.78}37%{transform:scale(1.025,1.035) skewX(2deg);opacity:.95}72%{transform:scale(.975,.97) skewX(-1deg);opacity:.87}100%{transform:scale(1.04,1.06) skewX(3deg);opacity:1}}
@keyframes coal-breathe{to{opacity:.6}}

.spark-wrap.sit-side-tuck .pose-side-tuck,.spark-wrap.sit-side-lean .pose-side-lean,.spark-wrap.sit-side-saddle .pose-side-saddle,.spark-wrap.sit-one-knee .pose-one-knee,.spark-wrap.sit-butterfly .pose-butterfly{opacity:1;animation:seated-breath 5.8s ease-in-out infinite}
.customize-toggle{border:1px solid #d7c38d40;border-radius:22px;background:#13262b99;padding:11px 15px;font-size:11px;color:#e9d6af}
#customize-dialog{color:var(--cream);width:min(540px,calc(100vw - 30px));max-height:calc(100svh - 48px);padding:26px;border:1px solid #d7c38d55;border-radius:22px;background:linear-gradient(140deg,#203337f5,#101e27fa);box-shadow:0 24px 100px #0007;overflow:auto}
#customize-dialog::backdrop{background:#06121866;backdrop-filter:blur(2px)}
.skin-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.skin-heading .eyebrow{margin:0 0 10px;font-size:8px}.skin-heading h2{font:32px 'Libre Caslon Display',Georgia,serif;margin:0}.skin-heading>button{background:transparent;font-size:27px;color:#c4cec2;padding:0 4px}
#customize-intro{font-size:12px;color:#b5c5bd;margin:12px 0 23px}.skin-list{display:grid;gap:14px;max-height:55svh;overflow:auto;padding:2px}
.skin-card{display:grid;grid-template-columns:106px 1fr;align-items:center;gap:16px;padding:19px 16px;border:1px solid #d8d4ba22;border-radius:16px;background:#ffffff03;transition:border-color .7s,background .7s}
.skin-selected{border-color:#ebc78880;background:#ebc78809}.skin-preview{height:140px;width:106px;display:grid;place-items:center}.skin-preview .spark-figure{width:90px;height:120px}.skin-preview .standing-body{opacity:1}.skin-detail h3{font:23px 'Libre Caslon Display',Georgia,serif;margin:7px 0}.skin-detail p{font-size:12px;line-height:1.65;margin:7px 0;color:#c6d0c5}.skin-detail .skin-how{font-size:10px;color:#98ada6}.skin-status{font-size:9px;color:#cdb786;letter-spacing:.3px}.skin-detail button{margin-top:9px;padding:9px 13px;border-radius:18px;background:#dfc28c;color:#233033;font-size:10px}.skin-detail button[aria-pressed=true]{background:#dac18b1a;color:#e5cfaa;border:1px solid #dac18b50}.skin-detail button:disabled{background:#ffffff08;color:#829492;cursor:default}.skin-locked .skin-preview{opacity:.3}.skin-locked{border-style:dashed}
.spark-wrap[data-skin=festive] .spark-figure,[data-skin=festive] .skin-preview .spark-figure{filter:hue-rotate(235deg)}
.skin-unlocking{animation:skin-unlock 1.8s ease-out}@keyframes skin-unlock{35%{border-color:#c5a1ed;background:#ae79ed1a;box-shadow:inset 0 0 24px #b18dea18}}
#skin-storage-note{font-size:10px;color:#8ca39c;margin:18px 0 0;line-height:1.6}
@media(max-width:600px){.customize-toggle{font-size:10px;padding:10px}.skin-card{grid-template-columns:76px 1fr;padding:15px 10px;gap:12px}.skin-preview{width:76px}.skin-preview .spark-figure{width:74px}.skin-heading h2{font-size:27px}#customize-dialog{padding:20px}.skin-detail h3{font-size:21px}}

.gathering{display:flex;align-items:center;justify-content:space-between;margin:10px 5px 0;font-size:10px;color:#b9c8bb}.gathering button{background:none;color:#dbc59b;font-size:10px;padding:4px}.remote-spark{transition:left .85s linear,top .85s linear}.remote-spark .spark-label{font-size:7px;letter-spacing:1px;color:#b7c8bb}
#music-dock{position:relative}#music-toggle{font-size:19px}.music-on{color:#f6d496;box-shadow:0 0 15px #eabe7920}#music-panel{position:absolute;top:50px;right:0;width:400px;max-width:calc(100vw - 30px);padding:16px;border:1px solid #d7c38d40;border-radius:16px;background:#13262af5;box-shadow:0 18px 50px #0006;backdrop-filter:blur(15px);max-height:calc(100svh - 125px);overflow:auto}.music-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.music-heading h2{font:23px Georgia,"Times New Roman",serif;margin:0}.music-heading button{background:none;font-size:25px;color:#c9c8b5}.youtube-frame{height:225px;min-width:200px;background:#081518;border-radius:8px;overflow:hidden}.youtube-frame iframe{display:block;width:100%;height:225px;border:0}#youtube-music{height:225px;display:grid;place-items:center;color:#9fb4ac;font-size:12px;text-align:center;padding:18px}.music-actions{display:flex;gap:9px;margin:13px 0}.music-actions button{min-height:44px;border-radius:22px;padding:8px 13px;background:#e3c796;color:#1c2b2d;font-size:12px}.music-actions button+button{background:#ffffff0a;color:#ccdacb}.music-volume{display:flex;gap:10px;align-items:center;font-size:12px}.music-volume input{flex:1;width:100px}.music-volume output{min-width:30px}#music-status{font-size:12px;color:#a7bdb1;line-height:1.5}#music-panel>a{font-size:12px;color:#dfc494}@media(max-width:600px){#music-panel{position:fixed;top:70px;right:12px;width:min(400px,calc(100vw - 24px))}.header-right{gap:8px}}

/* Production integration: legible live controls, no remote font dependency, and touch input. */
html,body{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
main{min-height:0}
.brand,h1,.story-info h2,.skin-heading h2,.skin-detail h3{font-family:Georgia,"Times New Roman",serif}
.brand>span{display:flex;flex-direction:column;line-height:.92}
.brand small{margin-top:7px;color:#c9b484;font:600 9px ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:2px;text-transform:uppercase}
.header-right{gap:18px}.home-link{color:#e6d4ad;font-size:13px;text-decoration:none}.home-link:hover{text-decoration:underline;text-underline-offset:4px}
.icon-btn{width:44px;height:44px}.eyebrow{font-size:11px}.intro{font-size:14px}
.story-info p{font-size:11px}.story-info>span,.gathering,.movement-hint,.footer-bottom button,.customize-toggle{font-size:12px}.play{min-height:44px;font-size:13px}
#settings label,#settings p,.skin-detail p,#customize-intro{font-size:13px}#settings p{line-height:1.6}
.settings-links{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px;padding-top:14px;border-top:1px solid #ffffff16}
.settings-links button,.settings-links a{min-height:44px;display:inline-flex;align-items:center;color:#e3c98f;background:none;font-size:12px;text-decoration:underline;text-underline-offset:4px}
.transcript{margin-top:16px;color:#dfd4bb;font-size:13px;line-height:1.55}.transcript summary{min-height:44px;display:flex;align-items:center;color:#e8c987;cursor:pointer}.transcript p{margin:10px 0!important;padding:0!important;border:0!important;color:#c3cec6!important;font-size:13px!important}
.touch-controls{display:none}
.analytics-consent[hidden]{display:none!important}.analytics-consent{position:fixed;z-index:30;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));left:max(16px,env(safe-area-inset-left));display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;width:min(980px,calc(100% - 32px));margin:auto;padding:18px;color:#eadfbe;background:linear-gradient(145deg,#162a2ef8,#0a1821fa);border:1px solid #ad8548;border-radius:14px;box-shadow:0 22px 70px #000a;backdrop-filter:blur(18px)}
.analytics-consent h2{margin:0 0 5px;color:#f0cf87;font:400 21px Georgia,"Times New Roman",serif}.analytics-consent p{margin:0;font-size:13px;line-height:1.5}.analytics-consent a{color:#efd18e}.analytics-consent__actions{display:flex;gap:10px}.analytics-consent__button{min-height:44px;padding:10px 15px;border:1px solid #b19056;border-radius:22px;font-size:12px}.analytics-consent__button--secondary{background:#ffffff08;color:#e6dcc5}.analytics-consent__button--primary{background:#dfc28c;color:#172629;font-weight:700}

@media(max-width:760px){
 main{height:100svh;min-height:0}header{padding:16px;align-items:flex-start}.brand{font-size:25px}.brand small{font-size:7px;letter-spacing:1.4px}.home-link{display:none}.header-right{gap:7px}.customize-toggle span{display:none}.customize-toggle{width:44px;height:44px;padding:0;border-radius:50%;font-size:19px}
 .welcome{top:12%}.welcome .eyebrow{font-size:8px;margin-bottom:10px}.welcome h1{font-size:clamp(35px,10vw,48px)}.intro{font-size:12px;margin-top:12px}
 footer{bottom:max(10px,env(safe-area-inset-bottom));width:calc(100% - 24px)}.story-card{gap:8px;padding:12px 12px 15px}.story-mark{width:25px;font-size:27px}.story-info h2{font-size:20px}.story-info p{font-size:8px;letter-spacing:1.2px}.story-info>span{font-size:10px}.play{padding:10px 12px;font-size:12px}
 .gathering{margin-top:7px;font-size:11px}.gathering button{min-height:38px;font-size:11px}.movement-hint{display:none}.footer-bottom{margin-top:5px}.footer-bottom button{min-height:42px;font-size:11px}.emotes button{width:38px;height:38px}
 .touch-controls{position:fixed;z-index:6;right:13px;bottom:190px;left:13px;display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none}.touch-pad{display:grid;grid-template-columns:44px 44px 44px;grid-template-rows:44px 44px;gap:6px;pointer-events:auto}.touch-pad button,.touch-jump{border:1px solid #e2d3ac55;background:#102329c9;box-shadow:0 7px 22px #0006;backdrop-filter:blur(9px);touch-action:none;user-select:none}.touch-pad button{width:44px;height:44px;border-radius:50%;font-size:19px}.touch-pad button[data-direction=ArrowUp]{grid-column:2}.touch-pad button[data-direction=ArrowLeft]{grid-row:2;grid-column:1}.touch-pad button[data-direction=ArrowDown]{grid-row:2;grid-column:2}.touch-pad button[data-direction=ArrowRight]{grid-row:2;grid-column:3}.touch-pad button[aria-pressed=true],.touch-jump:active{color:#172629;background:#e5ca93}.touch-jump{min-width:68px;min-height:48px;border-radius:26px;pointer-events:auto;color:#ead9b6;font-size:12px}body.quiet .touch-controls{bottom:max(18px,env(safe-area-inset-bottom))}
 #settings{top:70px;right:12px;width:calc(100% - 24px);max-height:calc(100svh - 82px);padding:20px}.analytics-consent{grid-template-columns:1fr;gap:12px;padding:15px}.analytics-consent__actions{flex-direction:column-reverse}.analytics-consent__button{width:100%}
}
@media(max-width:390px), (max-height:650px) and (max-width:760px){.welcome{top:10%}.welcome .intro{display:none}.touch-controls{bottom:172px}.story-mark{display:none}.story-info h2{font-size:18px}.story-info>span{display:none}.footer-bottom{display:none}.caption{bottom:170px}}