:root{font-family:Arial,Helvetica,sans-serif;color:#354d4b;background:#faf6ef;font-synthesis:none;--accent:#d8e2d5;--paper:#faf6ef;--ink:#354d4b;--line:#c8cec4}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.4}button:focus-visible,a:focus-visible,summary:focus-visible,.file-label:focus-within{outline:3px solid #536c87;outline-offset:5px}a{color:inherit}button{touch-action:manipulation}canvas{display:block;width:100%}[hidden]{display:none!important}h1,h2,h3,p,figure{margin-top:0}p{line-height:1.6}h2{letter-spacing:-1px;line-height:1.08;font-size:30px}h3{font-size:20px;letter-spacing:-.5px}em{font-family:Georgia,serif;font-weight:400}main,.top,.bottom{width:min(1240px,calc(100% - 64px));margin-inline:auto}.top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;border-bottom:1px solid var(--ink)}.brand{font-size:28px;letter-spacing:-1.8px;font-weight:900;text-decoration:none;white-space:nowrap}.brand i{font-family:Georgia,serif;font-weight:400;padding:0 3px}.brand span{display:block;font:9px monospace;letter-spacing:1.7px;margin-top:7px}.top nav{display:flex;gap:6px}.top nav button,.back,.text-button{border:0;background:none;padding:10px 12px;min-height:42px}.top nav button{font-size:13px}.top nav button[aria-current=page]{background:var(--ink);color:var(--paper);border-radius:24px}.eyebrow{font:11px/1.6 monospace;letter-spacing:1.1px;text-transform:uppercase;margin-bottom:16px}.section-title{font-size:clamp(38px,5vw,68px);line-height:.98;letter-spacing:-3px;margin-bottom:24px}.lede{font-size:18px;line-height:1.55;max-width:580px}.fine{font:12px/1.6 monospace;color:#5d6963}.view{padding:40px 0}.narrow{max-width:760px;margin-inline:auto}.primary,.secondary,.answer,.file-label{display:inline-flex;justify-content:center;align-items:center;gap:12px;border:1px solid var(--ink);padding:15px 20px;min-height:54px;font-size:14px;font-weight:750;text-decoration:none;border-radius:2px}.primary{background:var(--accent);box-shadow:none;color:#354d4b}.secondary,.file-label{background:transparent}.primary:active,.answer:active{transform:translate(2px,2px);box-shadow:none}.text-button{text-decoration:underline;text-underline-offset:5px;font-size:12px;padding-left:0;text-align:left}.back{padding-left:0;font-size:13px}.tool{border:1px solid var(--ink);border-radius:25px;background:var(--paper);font-size:11px;min-height:36px;padding:8px 12px}.hero{display:grid;grid-template-columns:1.25fr .8fr;align-items:center;gap:64px}.hero h1{font-size:clamp(48px,6.3vw,88px);line-height:.94;letter-spacing:-5px;margin:0 0 26px}.hero .lede{font-size:17px}.hero-art{margin:0;transform:none;border:1px solid var(--ink);box-shadow:none;background:#eeece5;max-width:410px}.hero-art canvas{aspect-ratio:720/820}.hero-art figcaption{display:flex;gap:20px;justify-content:space-between;padding:12px 16px;border-top:1px solid var(--ink);font:9px/1.5 monospace;background:var(--accent)}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin:25px 0 18px}.daily-track{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:50px 0 38px}.track-slot{border-top:3px solid var(--line);padding-top:12px;display:flex;align-items:flex-start;gap:12px}.track-slot.done{border-color:var(--ink)}.track-slot.current{border-color:var(--accent)}.track-slot b{font:italic 28px Georgia,serif}.track-slot span{font-size:13px}.track-slot small{display:block;font:10px monospace;color:#5d6963;margin-top:5px}.home-bottom{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding-top:35px;border-top:1px solid var(--line)}.home-bottom p{font-size:14px}.worlds{display:flex;gap:7px;margin:20px 0}.world-choice{flex:1;text-align:left;border:1px solid var(--line);background:none;padding:12px;min-height:70px;font-size:12px;line-height:1.3}.world-choice small{display:block;font:9px monospace;margin-top:6px}.world-choice[aria-pressed=true]{border-color:var(--ink);box-shadow:none}.lesson-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:25px 0}.lesson-pair figure{margin:0;min-width:0}.lesson-pair figcaption{font:10px/1.5 monospace;letter-spacing:.7px;margin-bottom:8px}.lesson-pair canvas{border:1px solid var(--ink);aspect-ratio:4/3}.lesson-pair p{font:bold 12px/1.5 monospace;margin:10px 0}.lesson-buttons{display:flex;gap:12px;flex-wrap:wrap}.lesson-buttons button{flex:1}.notice{padding:16px 18px;border-left:4px solid var(--ink);background:#eeeae1;font-size:14px;line-height:1.55;min-height:54px}.notice.good{background:#e4ebe0;border-color:#557060}.notice.miss{background:#efe2dd;border-color:#87554c}.rule-card{display:flex;gap:30px;align-items:center;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:30px 0;margin-bottom:25px}.giant-n{font:italic 130px/.8 Georgia,serif;color:#536c87;min-width:90px}.rule-card p:last-child{margin-bottom:0}.rule-card h2{font-size:28px}.rule-card .eyebrow{font-size:10px}.play-view{max-width:1100px;margin:auto;padding-top:18px}.play-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.play-top p{font:11px monospace;margin:0}.play-rule{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:18px 0 13px}.play-rule .eyebrow{margin:0;font-weight:bold}.play-rule .fine{margin:0;white-space:nowrap}.play-layout{display:grid;grid-template-columns:1.5fr 1fr;border:1px solid var(--ink)}.stage{position:relative;aspect-ratio:1.25;overflow:hidden;min-width:0;background:#eeece5}.stage>canvas{width:100%;height:100%}.stage-tools{position:absolute;top:12px;right:12px;display:flex;gap:6px}.stage-label{position:absolute;left:18px;bottom:16px;font:bold 14px monospace;mix-blend-mode:difference;color:white;pointer-events:none}.play-panel{padding:28px;border-left:1px solid var(--ink);display:flex;flex-direction:column;justify-content:center}.play-panel h2{font-size:28px;line-height:1.1;margin-bottom:15px}.play-panel>p{font-size:14px}.play-panel>.eyebrow,.play-panel>.fine{font-size:11px}.hint{background:#e4ebe0;border-left:3px solid #557060;padding:12px;font-size:13px!important}.memory-slots{display:flex;gap:6px;margin:8px 0}.memory-slots i{font:10px monospace;border:1px solid var(--line);padding:7px 9px;font-style:normal}.memory-slots i.target{background:var(--ink);color:var(--paper)}.round-progress{display:flex;gap:5px;margin:18px 0}.round-progress i{flex:1;height:5px;background:#d3cfc6}.round-progress i.done{background:var(--ink)}.round-progress i.now{background:var(--accent);outline:1px solid var(--ink)}.response-area{width:min(620px,100%);margin:20px auto 0}.response-area>p{font-size:14px;line-height:1.5;min-height:42px;margin-bottom:10px}.response-area>.primary{width:100%}.answers{display:grid;grid-template-columns:1fr 1fr;gap:12px}.answer{background:var(--ink);color:white;justify-content:space-between;min-height:62px}.answer.yes{background:var(--accent);color:var(--ink)}.answer span{font:20px monospace}.pause-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#faf6eff2;z-index:2;text-align:center;padding:20px}.pause-overlay h2{font-size:32px}.pause-overlay p{font-size:14px}.result-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:center}.result-art{margin:0;max-width:390px;transform:none;box-shadow:none;border:1px solid var(--ink)}.result-art canvas{aspect-ratio:6/7}.result-art figcaption{font:10px/1.6 monospace;padding:12px;background:var(--accent);border-top:1px solid var(--ink)}.result-actions{display:flex;flex-wrap:wrap;gap:15px;margin:22px 0}.result-stats{display:flex;gap:20px;margin:25px 0}.result-stat{border-left:1px solid var(--ink);padding-left:14px}.result-stat strong{display:block;font:italic 42px Georgia,serif}.result-stat span{display:block;font:10px/1.5 monospace;max-width:125px;margin-top:6px}.result-stat small{display:block;font:11px monospace;color:#5d6963;margin-top:6px}details{margin:30px 0}summary{cursor:pointer;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}.comparison-review{border-bottom:1px solid var(--line);padding:24px 0;max-width:720px}.comparison-review h3{font-size:18px}.collection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:35px 0 50px}.collection-card{min-width:0;border:1px solid var(--ink);padding:10px;background:#f0ede6}.collection-card canvas{aspect-ratio:6/7}.collection-card h3{font-size:16px;margin:16px 5px 8px}.collection-card p{font:11px/1.6 monospace;margin:0 5px}.collection-card button{font-size:12px;padding-inline:5px}.empty-state{grid-column:1/-1;border:1px dashed var(--line);padding:30px;max-width:650px}.history-row{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:17px 0;border-bottom:1px solid var(--line);font-size:13px}.history-row small{display:block;color:#5d6963;font:10px/1.5 monospace;margin-top:5px}.history-row strong{white-space:nowrap}.data-tools{padding:28px;background:#eeeae1;margin-top:35px}.data-tools p{font-size:13px}.data-tools .secondary{margin:8px 8px 0 0;font-size:12px}.file-label{position:relative;cursor:pointer}.file-label input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.offer{margin:28px 0;padding:25px;border:1px solid var(--ink);box-shadow:none;background:#d8e2d5}.offer h2{font-size:38px}.bottom{border-top:1px solid var(--line);padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;font:10px/1.6 monospace;color:#5d6963}.bottom .text-button{font:10px monospace;max-width:200px}.bottom #save-note{max-width:380px}dialog{width:min(650px,calc(100% - 28px));max-height:calc(100dvh - 32px);overflow:auto;border:2px solid var(--ink);padding:26px;background:var(--paper);color:var(--ink);box-shadow:none}dialog::backdrop{background:#354d4b80;backdrop-filter:blur(5px)}dialog h2{font-size:31px;line-height:1.05;margin:12px 0}dialog>p{font-size:15px}dialog .primary{width:100%}dialog[data-correct=true]{border-top:10px solid #557060}dialog[data-correct=false]{border-top:10px solid #87554c}body[data-screen=play] .top nav,body[data-screen=play] .bottom{display:none}body[data-screen=play] .top{padding-block:12px}body[data-screen=play] .brand{font-size:21px}body[data-screen=play] .brand span{display:none}body[data-screen=play]{padding-bottom:30px}
@media(max-width:900px){main,.top,.bottom{width:calc(100% - 44px)}.hero{gap:35px}.hero h1{font-size:62px;letter-spacing:-4px}.hero .lede{font-size:15px}.hero-art{max-width:330px}.home-bottom{gap:30px}.play-panel{padding:20px}.play-panel h2{font-size:25px}.result-layout{gap:35px}.result-actions{display:grid}.collection-grid{gap:14px}.section-title{font-size:53px}.play-layout{grid-template-columns:1.3fr 1fr}}
@media(max-width:650px){main,.top,.bottom{width:calc(100% - 32px)}.top{padding:16px 0;gap:12px}.brand{font-size:25px}.brand span{font-size:7px;letter-spacing:.9px}.top nav{gap:0}.top nav button{padding:8px 10px;font-size:11px;min-height:38px}.view{padding-top:26px}.hero{display:flex;flex-direction:column;align-items:stretch;gap:28px}.hero h1{font-size:58px;letter-spacing:-4px;margin-bottom:20px}.hero .eyebrow{font-size:9px;letter-spacing:.8px}.hero .lede{font-size:15px}.hero .lede br{display:none}.hero-actions{display:grid;margin-block:22px 13px}.hero-art{align-self:center;width:68%;max-width:300px;transform:none;box-shadow:none}.hero-art figcaption{font-size:8px;padding:9px;gap:10px}.hero-art figcaption span:last-child{max-width:95px}.daily-track{margin:32px 0;gap:8px}.track-slot{gap:7px}.track-slot b{font-size:24px}.track-slot span{font-size:11px}.track-slot small{font-size:9px;line-height:1.5}.home-bottom{grid-template-columns:1fr;gap:28px;padding-top:26px}.home-bottom h2{font-size:29px}.home-bottom p{font-size:13px}.freeplay{border-top:1px solid var(--line);padding-top:25px}.world-choice{padding:10px 8px;font-size:11px}.world-choice small{font-size:8px}.section-title{font-size:43px;letter-spacing:-2px}.lede{font-size:16px}.lesson-pair{gap:9px;margin:20px 0}.lesson-pair figcaption{font-size:9px;letter-spacing:.2px}.lesson-pair p{font-size:11px}.lesson-buttons{position:sticky;bottom:12px;background:var(--paper);padding:10px 0 15px;z-index:1}.lesson-buttons button{font-size:13px;padding-inline:13px}.notice{font-size:13px;padding:14px;min-height:60px}.rule-card{gap:18px;padding:24px 0}.giant-n{font-size:100px;min-width:65px}.rule-card h2{font-size:24px}.rule-card .eyebrow{font-size:9px}.rule-card p{font-size:13px}#brief .primary{width:100%}.play-view{padding-top:8px}.play-top .back{font-size:11px;min-height:38px}.play-top p{font-size:10px}.play-top .tool{font-size:10px}.play-rule{margin:12px 0;gap:10px}.play-rule .eyebrow{font-size:9px;line-height:1.5;letter-spacing:.4px}.play-rule .fine{font-size:10px}.play-layout{display:block}.stage{aspect-ratio:1.4}.stage-tools{top:9px;right:9px;gap:5px}.stage-tools .tool{min-height:32px;padding:6px 9px;font-size:9px}.stage-label{font-size:11px;left:13px;bottom:12px}.play-panel{padding:16px;border-left:0;border-top:1px solid var(--ink)}.play-panel h2{font-size:22px;margin-bottom:10px}.play-panel .eyebrow{margin-bottom:9px}.play-panel>p{font-size:12px;margin-bottom:10px}.play-panel>.fine{display:none}.memory-slots{margin:8px 0}.memory-slots i{font-size:9px;padding:6px 7px}.round-progress{margin:10px 0 2px}.response-area{position:sticky;bottom:0;z-index:3;background:#faf6efef;backdrop-filter:blur(12px);width:calc(100% + 32px);margin-left:-16px;padding:12px 16px calc(15px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}.response-area>p{font-size:12px;min-height:36px;margin-bottom:8px}.response-area .primary,.answer{font-size:13px;min-height:54px}.response-area .text-button{min-height:32px;padding-block:5px;font-size:11px}.answers{gap:10px}.answer{padding:13px 14px}.result-layout{display:flex;flex-direction:column;align-items:stretch;gap:25px}.result-art{width:75%;align-self:center;max-width:310px}.result-stats{gap:18px;margin:23px 0}.result-stat strong{font-size:35px}.result-stat span{font-size:9px}.result-stat small{font-size:10px}.result-actions{gap:12px}.collection-grid{grid-template-columns:repeat(2,1fr);gap:13px}.collection-card h3{font-size:13px}.collection-card p{font-size:10px}.collection-card button{font-size:10px}.data-tools{padding:19px}.bottom{display:block;font-size:9px;padding:20px 0}.bottom #save-note{display:block;margin:12px 0}.bottom .text-button{padding-block:0}.offer h2{font-size:32px}.offer{padding:20px}.narrow>p:not(.eyebrow){font-size:14px}dialog{padding:18px}dialog h2{font-size:26px}dialog>p{font-size:14px}dialog .lesson-pair{margin:18px 0}.play-panel .hint{font-size:12px!important}.history-row{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}dialog::backdrop{backdrop-filter:none}.response-area{backdrop-filter:none}}

@media(max-width:650px){.result-layout{display:grid;grid-template-columns:1fr;gap:18px}.result-layout>div{display:contents}#result-kicker{order:0;margin:0}#result-title{order:1;margin:0}.result-art{order:2;justify-self:center;width:76%;margin:8px 0 12px;align-self:auto}#download-art{order:3;margin:0;justify-self:start}#result-copy{order:4;margin-bottom:0}#result-stats{order:5;margin:0}#next-level{order:6;margin:0}.result-actions{order:7;margin:5px 0 0}#result-stats:empty{display:none}}

.practice-controls{margin:10px 0 18px}.practice-controls summary{font-size:12px;padding:10px 0}.practice-controls label{display:block;font:11px monospace;margin:15px 0}.practice-controls select{display:block;margin-top:7px;width:100%;border:1px solid var(--line);padding:12px;background:var(--paper);color:var(--ink);border-radius:0;font:13px Arial}.practice-controls select:focus-visible{outline:3px solid #536c87;outline-offset:3px}

.history-row .text-button{white-space:nowrap;font-size:10px;min-height:40px}.history-row>span{flex:1;min-width:0}

.collection-grid>.collection-card:only-child{grid-column:1/-1;width:100%;max-width:420px;justify-self:center}

/* The path, the earned print, the open studio. */
.hero-actions .secondary{box-shadow:none}.hero-actions .text-button{width:100%}
.flow-options{border:1px solid var(--line);padding:16px 18px;margin:20px 0}.flow-options label{font-size:14px;font-weight:700;display:flex;align-items:center;gap:10px;min-height:38px;cursor:pointer}.flow-options input{accent-color:var(--ink);width:20px;height:20px}.flow-options p{font-size:12px;margin:7px 0 0;max-width:580px}.flow-options input:focus-visible{outline:3px solid #536c87;outline-offset:3px}
.interest-card label{display:block;font-size:12px;font-weight:700;line-height:1.5;margin:22px 0 8px}.interest-card label .fine{display:block;font-weight:400}.interest-card textarea{display:block;width:100%;resize:vertical;padding:12px;border:1px solid var(--ink);background:var(--paper);color:var(--ink);font:13px/1.6 Arial,sans-serif;min-height:80px}.interest-card textarea[readonly]{font:11px/1.65 monospace;min-height:160px}.interest-card textarea:focus-visible{outline:3px solid #536c87;outline-offset:3px}.interest-card #copy-status{min-height:38px}
.journey-teaser{display:flex;align-items:center;justify-content:space-between;gap:36px;border:1px solid var(--ink);padding:24px 28px;margin:44px 0 0;background:var(--accent);box-shadow:none}
.journey-teaser h2{margin-bottom:10px;font-size:28px}.journey-teaser p{margin-bottom:0;max-width:620px;font-size:14px}.journey-teaser .eyebrow{margin-bottom:8px;font-size:10px}.journey-teaser>.text-button{flex-shrink:0}
.journey-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:32px}.chapter-card{border:1px solid var(--ink);padding:25px;display:flex;flex-direction:column;background:#f2eee8;min-width:0}.chapter-card h2{font-size:29px}.chapter-card>p:not(.eyebrow):not(.fine){font-size:14px;flex:1}.chapter-card .fine{font-size:11px}.chapter-card .eyebrow{font-size:10px}.chapter-card.available{background:var(--accent);box-shadow:none}.chapter-card.complete{border-left:7px solid var(--ink)}.chapter-card.locked{background:transparent;border-color:var(--line)}.chapter-card.locked button{opacity:.7}.chapter-card button{align-self:flex-start;font-size:12px}.chapter-card:nth-child(7){grid-column:1/-1}
.print-controls{margin:22px 0}.print-controls>.eyebrow{margin-bottom:10px}.print-controls>div{display:flex;gap:10px}.print-controls button{min-width:120px;min-height:48px}.print-controls button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.print-controls>.fine{max-width:390px;margin:10px 0 0;font-size:11px}
.studio-layout{display:grid;grid-template-columns:1fr .85fr;gap:70px;align-items:center}.studio-layout>div>p:not(.eyebrow){max-width:520px}.studio-art{margin:0;border:1px solid var(--ink);box-shadow:none;transform:none}.studio-art canvas{aspect-ratio:6/7}.studio-art figcaption{padding:12px;font:9px/1.6 monospace;background:#d8e2d5;border-top:1px solid var(--ink)}.sample-variants{display:flex;gap:8px;margin:22px 0 12px}.sample-variants button{min-height:42px}.sample-variants button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.studio-offer{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:38px 0;margin:45px 0 0;border-top:1px solid var(--ink)}.studio-offer h2{font-size:45px}.studio-offer p{font-size:14px}.studio-offer .fine{font-size:12px}.interest-card{border:1px solid var(--ink);background:#eeeae1;padding:28px}.interest-card .secondary{width:100%;margin-top:10px;font-size:13px}.interest-card .secondary[aria-pressed=true]{background:var(--ink);color:var(--paper)}.interest-card #interest-status{min-height:42px;margin:14px 0 0}.memory-print-card canvas{border:1px solid var(--ink)}
@media(max-width:900px){.studio-layout{gap:35px}.studio-offer{gap:30px}.journey-teaser{gap:20px}.journey-teaser>.text-button{max-width:130px}}
@media(max-width:650px){.hero-actions>.primary,.hero-actions>.secondary{width:100%}.journey-teaser{display:block;margin-top:32px;padding:20px;box-shadow:none}.journey-teaser h2{font-size:25px}.journey-teaser p{font-size:13px}.journey-teaser>.text-button{max-width:none;margin-top:12px}.daily-track{margin-top:28px}.journey-grid{grid-template-columns:1fr;gap:16px}.chapter-card{padding:21px}.chapter-card h2{font-size:27px}.chapter-card:nth-child(7){grid-column:auto}.chapter-card button{width:100%}.studio-layout{display:flex;flex-direction:column;gap:24px;align-items:stretch}.studio-art{width:86%;align-self:center;max-width:400px;box-shadow:none}.studio-offer{grid-template-columns:1fr;gap:20px;margin-top:32px;padding-top:28px}.studio-offer h2{font-size:38px}.interest-card{padding:21px}.sample-variants{gap:7px}.sample-variants .tool{flex:1}.print-controls{order:6;margin:0}.print-controls button{flex:1;min-width:0}.print-controls>.fine{font-size:10px}.result-art{width:86%}.history-row{flex-wrap:wrap}.history-row>.text-button{margin-left:auto}}

/* Still Echo — pigment on warm paper; decisive movement, no floating decoration. */
:root{color-scheme:light;--paper:#faf6ef;--ink:#354d4b;--line:#c8cec4;--muted:#5d6963;--accent:#d8e2d5;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--paper)}
body{background:radial-gradient(ellipse at 5% 8%,#c7cddd3d 0,transparent 34%),radial-gradient(ellipse at 96% 34%,#c9d5c33b 0,transparent 39%),radial-gradient(ellipse at 32% 93%,#ddc3c334 0,transparent 35%),var(--paper)}
h1,h2,h3,.brand{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.8px}
h1 em,h2 em{color:#627b77}.hero h1{font-size:clamp(52px,6.3vw,88px);line-height:1.03;letter-spacing:-2.8px}.section-title{line-height:1.06;letter-spacing:-1.6px}.brand{font-size:34px;letter-spacing:-1px}.brand span{font:9px/1.6 "Segoe UI",Arial,sans-serif;letter-spacing:1.8px;color:var(--muted)}
.top{border-color:var(--line);padding-block:25px;gap:24px}.top nav{gap:5px;align-items:center}.top nav button{border-radius:9px;min-height:44px;padding:10px 14px;color:var(--muted);font-size:13px}.top nav button[aria-current=page]{background:#e1e8de;color:var(--ink)}.top nav button:hover{background:#e9ede5;color:var(--ink)}
button,input,select,textarea{font-family:inherit}button{transition:transform 80ms cubic-bezier(.2,.9,.2,1),background-color 80ms linear,border-color 80ms linear;color:var(--ink)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.48}.primary,.secondary,.answer,.file-label{border-radius:10px;min-height:52px;font-weight:600;line-height:1.35;box-shadow:none;border-color:#9fafa3}.primary{background:#d7e2d4;color:#263f3c;border-color:#91a28f}.primary:hover:not(:disabled){background:#cbd9c8;border-color:#627b67}.secondary,.file-label{background:#faf6efb8;border-color:#bbc5b8}.secondary:hover:not(:disabled),.file-label:hover{background:#e8ede4;border-color:#7c9587}.primary:active,.answer:active{box-shadow:none;transform:translateY(1px)}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,.file-label:focus-within{outline:3px solid #627f85;outline-offset:4px}.tool{background:#faf6eff2;border-color:#b8c2b7;min-height:40px;color:#3f5652}.tool:hover:not(:disabled){background:#e4eae1}.text-button,.back{color:#44645b;text-decoration-thickness:1px;text-underline-offset:5px}.eyebrow{font:10px/1.7 "Segoe UI",Arial,sans-serif;letter-spacing:1.7px;color:var(--muted)}.fine,.track-slot small,.history-row small,.result-stat small{color:var(--muted)}
.hero-art,.result-art,.studio-art{transform:none;box-shadow:0 15px 36px #52655a12;border:1px solid #c8cec1;padding:9px;background:#fffaf1;border-radius:3px}.hero-art canvas,.result-art canvas,.studio-art canvas{border:1px solid #d8d9cf}.hero-art figcaption,.result-art figcaption,.studio-art figcaption{background:transparent;border:0;padding:12px 4px 4px;color:var(--muted);font:10px/1.6 "Segoe UI",Arial,sans-serif;letter-spacing:.5px}.hero-art{max-width:420px}.hero-art figcaption span:last-child{max-width:150px}.hero-actions{gap:12px}
.journey-teaser{background:linear-gradient(115deg,#e2e8dfb8,#eee4e46e);border:1px solid var(--line);border-radius:14px;box-shadow:none;padding:27px 30px}.journey-teaser h2{font-size:31px}.chapter-card{background:#faf7f0bd;border-color:var(--line);border-radius:14px;box-shadow:none;padding:27px}.chapter-card.available{background:linear-gradient(140deg,#dfe7dc,#f2ede6);border-color:#a5b69f;box-shadow:none}.chapter-card.complete{border-left:4px solid #8da58e}.chapter-card.locked{background:#f3efe980;border-color:#d2d6cd}.chapter-card h2{font-size:33px}.chapter-card .fine{line-height:1.6}.chapter-card .eyebrow{letter-spacing:1.1px}
.daily-track .track-slot{border-top-width:2px;border-color:#ccd3c6}.daily-track .track-slot.current{border-color:#8ca18c}.daily-track .track-slot.done{border-color:#5e7c69}.world-choice{border-color:var(--line);background:#faf8f26b;border-radius:9px}.world-choice[aria-pressed=true]{border-color:#718b79;background:#e5ecdf;box-shadow:none}.world-choice small{color:var(--muted);letter-spacing:.5px}.practice-controls select{border-color:#b5c1b5;border-radius:8px;background:#fbf8f1;min-height:46px}
.lesson-pair canvas,.memory-print-card canvas{border-color:#c1cbbd;background:#faf5ea;border-radius:4px}.lesson-pair figcaption,.lesson-pair p{color:#4a625a}.lesson-pair p{font-weight:500}.notice,.flow-options,.data-tools{background:#ecefe6;border-color:#a9b7a2;border-radius:9px}.notice{border-left-width:3px}.notice.good,.hint{background:#e5ecdf;border-color:#809978;color:#345440}.notice.miss{background:#f0e4df;border-color:#b48979;color:#704d46}.rule-card{border-color:var(--line)}.giant-n{color:#7889a2}.flow-options{border:1px solid #c6cebf}.flow-options input{accent-color:#55765e}
.play-layout{border-color:#bfcabc;border-radius:12px;overflow:hidden;background:#faf7f0}.play-panel{border-color:#cbd3c4;background:#faf7f0d9}.stage{background:#e7ebe2}.stage-label{mix-blend-mode:normal;color:#49645b;background:#faf6efd9;padding:4px 8px;border-radius:5px;font-weight:500}.answer{background:#f0e4df;border-color:#c4aaa1;color:#5c453f;min-height:60px}.answer.yes{background:#dce7d6;border-color:#a5b99d;color:#324f3e}.answer:hover:not(:disabled){background:#e5d5ce}.answer.yes:hover:not(:disabled){background:#ccddc4}.answer:active:not(:disabled){transform:translateY(2px)}.memory-slots i{border-color:#b8c4b4;border-radius:4px;color:#506956}.memory-slots i.target{background:#e1e9dc;color:#34543d}.round-progress i{background:#d8ddd1}.round-progress i.done{background:#8da48a}.round-progress i.now{background:#bbc8a9;outline-color:#74866d}.pause-overlay{background:#faf6eff5}.play-rule .eyebrow{color:#405d51}.play-top p{color:var(--muted)}
.result-stat{border-color:#b7c5b3}.result-stat strong{color:#47654f}.print-controls button[aria-pressed=true],.sample-variants button[aria-pressed=true],.interest-card .secondary[aria-pressed=true]{background:#dbe5d4;color:#2e4d37;border-color:#7c9577}.collection-card{background:#fcf8ef;border-color:#c6cfbf;border-radius:8px;padding:11px}.collection-card h3{font-size:22px}.collection-card p,.collection-card button{color:#536a5d}.studio-offer{border-color:var(--line)}.interest-card,.offer{background:linear-gradient(140deg,#e5eade,#f0e7e2);border-color:#c0cbb8;border-radius:12px;box-shadow:none}.interest-card textarea{background:#fffcf5;border-color:#b9c6b3;border-radius:8px}.interest-card textarea[readonly]{background:#f8f7ef}.bottom{border-color:#cdd3c6;color:var(--muted)}
dialog{background:#fcf8f0;border:1px solid #a9bba5;border-radius:16px;box-shadow:0 20px 70px #354d4b26;padding:28px}dialog::backdrop{background:#334a4661;backdrop-filter:blur(3px)}dialog h2{font-size:34px;letter-spacing:-.5px}dialog[data-correct=true]{border-top:4px solid #8da181}dialog[data-correct=false]{border-top:4px solid #b48e80}
.account-trigger{border:1px solid #abbba5!important;background:#edf1e7!important;color:#34533e!important;font-size:12px!important;white-space:nowrap}.account-trigger:hover{background:#dfe8d7!important}#account-dialog{width:min(460px,calc(100% - 28px));padding:28px}.platform-account{color:var(--ink)}.platform-account h2{margin:6px 0 12px}.platform-account p{font-size:14px}.platform-account form{display:grid;gap:14px;margin-top:20px}.platform-account label{display:block;font-size:13px;font-weight:600;line-height:1.5}.platform-account input:not([type=checkbox]){display:block;width:100%;min-height:48px;margin-top:7px;padding:11px 13px;border:1px solid #a9bba5;border-radius:8px;background:#fffdf8;color:#2d4740;font-size:16px}.platform-account button{min-height:44px}.platform-account form>.primary{width:100%}.platform-account [role=status],.platform-account [role=alert]{min-height:24px;line-height:1.5;font-size:13px}.platform-account [role=alert]{color:#87564d}.platform-account .account-tabs{display:flex;gap:6px;padding:4px;background:#e8eee2;border-radius:10px}.platform-account .account-tabs button{flex:1;border:0;background:transparent;border-radius:7px;font-size:13px}.platform-account .account-tabs [aria-selected=true]{background:#fdfaf3;color:#34533e}.platform-account .account-close{float:right;border:1px solid #c2ccba;background:transparent;border-radius:8px;padding:5px 12px}.platform-account .account-providers{display:grid;gap:10px;margin:20px 0}.platform-account .account-providers a,.platform-account .account-providers button{display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #b9c5b2;border-radius:8px;background:#fffdf8;min-height:48px;padding:10px;text-decoration:none;color:#344e40}
@media(max-width:900px){.hero h1{font-size:65px;letter-spacing:-2px}.hero{gap:36px}.brand{font-size:31px}.top nav button{padding-inline:11px}.chapter-card h2{font-size:30px}}
@media(max-width:650px){.top{flex-wrap:wrap;align-items:center;gap:12px;padding-block:17px 13px}.brand{font-size:30px;line-height:1.1;letter-spacing:-.7px;flex:1}.brand span{font-size:8px;letter-spacing:1px;margin-top:6px}.top nav{width:100%;display:flex;gap:5px;justify-content:space-between;flex-wrap:wrap}.top nav button{flex:1;min-width:0;min-height:43px;padding:8px 9px;font-size:12px}.top nav .account-trigger{font-size:11px!important;flex:1.3}.hero h1{font-size:clamp(46px,13vw,62px);line-height:1.04;letter-spacing:-1.8px}.hero .lede{font-size:16px}.hero-art{width:79%;padding:7px;max-width:335px;box-shadow:0 12px 26px #52655a12}.hero-art figcaption{font-size:9px;gap:9px}.hero-art figcaption span:last-child{max-width:125px}.section-title{font-size:43px;letter-spacing:-1.1px;line-height:1.07}.hero-actions .primary,.hero-actions .secondary{min-height:54px}.journey-teaser{padding:21px;border-radius:12px;box-shadow:none}.journey-teaser h2{font-size:29px}.chapter-card{padding:22px}.chapter-card h2{font-size:31px}.chapter-card.available{box-shadow:none}.studio-art{width:91%;box-shadow:0 12px 26px #52655a12}.result-art{box-shadow:0 12px 26px #52655a12;padding:7px;width:89%}.result-art figcaption{font-size:10px}.response-area{background:#faf6eff5;border-color:#c9d2c2;backdrop-filter:none}.stage-tools .tool{font-size:10px;padding:7px 8px;min-height:34px}.stage-label{font-size:10px;bottom:9px;left:9px}.lesson-buttons{background:#faf6eff5}.play-panel{padding:17px}.play-panel h2{font-size:25px;letter-spacing:-.4px}.answer{min-height:56px;font-size:14px}.collection-card h3{font-size:18px}.collection-card p,.collection-card button{font-size:10px}.sample-variants button{min-height:44px}.studio-offer h2{font-size:39px}.interest-card{padding:20px}.giant-n{font-size:95px}.tool,.back,.text-button{min-height:40px}.bottom{font-size:10px}dialog,#account-dialog{padding:21px;border-radius:13px}dialog h2{font-size:30px}.platform-account input:not([type=checkbox]){font-size:16px}body[data-screen=play] .top{padding-block:12px}body[data-screen=play] .brand{font-size:23px}}
@media(max-width:359px){.top nav{gap:3px}.top nav button{padding-inline:6px;font-size:11px}.top nav .account-trigger{font-size:10px!important}.hero-art{width:85%}.hero h1{font-size:46px}.play-top p{max-width:135px;line-height:1.4}.play-rule{align-items:flex-start}.play-rule .fine{white-space:normal;text-align:right}.stage-tools{gap:4px}.stage-tools .tool{font-size:9px;padding-inline:6px}.lesson-pair p{font-size:10px}.print-controls>div{gap:8px}.print-controls button{font-size:12px;padding-inline:12px}.history-row strong{font-size:12px}}
@media(prefers-reduced-motion:reduce){button{transition:none!important}button:active:not(:disabled){transform:none!important}dialog::backdrop{backdrop-filter:none}}

.platform-preview-notice{max-width:1180px;margin:0 auto;padding:0 24px;color:var(--muted);font-size:13px}.platform-preview-notice a{color:var(--ink)}
.two-back-explainer{padding:20px;border:1px solid var(--line);border-radius:12px;background:#eeeee6;margin:24px 0}.two-back-explainer h2{font-size:27px}.two-back-explainer ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;list-style:none;padding:0}.two-back-explainer li{padding:15px;border:1px dashed #a9b5a7;border-radius:10px;background:#faf6ef}.two-back-explainer li:first-child,.two-back-explainer li:last-child{border:2px solid #748e7c;background:#dde7d8}.two-back-explainer li span,.two-back-explainer li strong{display:block;font-size:12px;line-height:1.5}.two-back-explainer li strong{font-size:17px;margin-top:10px}
.statistics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:15px;margin:20px 0 35px}.statistics-card{padding:22px;border:1px solid var(--line);border-radius:12px;background:#fbf8f1}.statistics-card h3{font-size:25px}.statistics-card strong{font-size:18px}.statistics-card .fine{line-height:1.8}
.platform-account{width:min(500px,calc(100% - 28px));max-height:calc(100dvh - 32px);overflow-y:auto;border:1px solid #a9b7a2;border-radius:18px;padding:28px;background:#faf6ef;color:var(--ink)}.platform-account::backdrop{background:#283b3659;backdrop-filter:blur(6px)}.platform-account h2{font-size:38px}.platform-account #account-close{float:right}.platform-account form{display:grid;gap:16px}.platform-account label{display:grid;gap:7px;font-size:14px}.platform-account input{min-height:48px;width:100%;padding:10px 12px;border:1px solid #a9b7a2;background:#fffdf8;border-radius:8px;font-size:16px;box-sizing:border-box}.social-buttons{display:grid;gap:10px}.social-button{display:flex;align-items:center;justify-content:center;gap:12px;background:white;color:#1f1f1f;border:1px solid #747775;min-height:48px;border-radius:6px;font:500 14px/1.4 Arial,sans-serif}.auth-divider{text-align:center;font-size:13px;color:var(--muted);margin:22px 0}#account-status:empty{display:none}#account-status{padding:12px;background:#e5ebdf;border-radius:8px;overflow-wrap:anywhere}#account-library{overflow-wrap:anywhere}#account-library ul{padding-left:20px}#account-library li{margin:10px 0}#account-guest>p,#account-member>p{font-size:14px;line-height:1.7}#account-mode{margin-top:14px}.practice-controls label:has(input[type=checkbox]){display:flex;align-items:center;gap:10px}.practice-controls input[type=checkbox]{width:20px;height:20px}
@media(max-width:600px){.top{gap:15px;flex-wrap:wrap}.top nav{width:100%;justify-content:space-between}.top nav button{padding:9px 10px}.platform-account{padding:22px}.two-back-explainer ol{gap:5px}.two-back-explainer li{padding:10px 7px}.two-back-explainer li span{font-size:9px}.two-back-explainer li strong{font-size:14px}}

.keyboard-help{max-width:75rem;margin:1rem auto;padding:.8rem 1rem;border:1px solid #ccd5cd;border-radius:12px}.keyboard-help summary{cursor:pointer}kbd{font:inherit;font-size:.85em;padding:.15em .4em;border:1px solid currentColor;border-radius:4px}.statistics-trend{font-size:.85rem;overflow-wrap:anywhere}.practice-controls select,#statistics-mode{min-height:44px;max-width:100%}

.statistics-chart{height:72px;display:flex;align-items:flex-end;gap:6px;margin:1rem 0;border-bottom:1px solid #ccd5cd}.statistics-chart span{flex:1;max-width:36px;min-width:6px;background:#5b796a;border-radius:4px 4px 0 0}.practice-presets{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}

/* The pond is scenery; instructions and choices sit on opaque readable paper. */
body{isolation:isolate;background:#d6e1df}#living-pond{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}.top{background:#f8f6edea;backdrop-filter:blur(12px)}main{max-width:1240px;margin:auto;padding:24px}.hero{padding:clamp(18px,4vw,48px);background:#faf8f0e8;border:1px solid #ffffffa6;border-radius:28px;box-shadow:0 24px 90px #36584b12}.hero h1{font-size:clamp(2.6rem,6vw,6rem)}.rule-primer{background:#fffdf5;padding:20px;border:1px solid #c8d8c6;border-radius:16px;margin:20px 0}.rule-primer strong{font-size:1.25rem}.rule-primer p{font-size:1rem;line-height:1.7}.practice-controls{background:#fffdf5;padding:22px;border-radius:20px;border:1px solid #b8cebb}.practice-controls h3{margin-top:0}.home-bottom>div,.journey-teaser,.daily-track,.play-view,.view.narrow,#collection,#journey,#brief,#lesson,#result{background:#faf8f0f2;border-radius:20px;padding:clamp(16px,3vw,32px)}.learning-reference{background:#e7eee2;padding:14px;border-radius:14px;color:#244435}.learning-reference canvas{width:140px;height:110px;display:block;margin:auto}.learning-reference strong{display:block}.play-panel{background:#fffdf5;border-radius:20px;padding:24px}.stage{background:#fffdf5}.freeplay>p{color:#344b43}button.primary{background:#365f50;color:#fffdf5}.practice-controls select{width:100%;background:#fffdf5}.practice-controls label{display:block;margin:14px 0}.practice-controls input[type=checkbox]{width:auto}.rule-primer button{width:100%}@media(max-width:600px){main{padding:12px}.hero{padding:20px}.top{padding:12px}.hero-art{max-height:260px;overflow:hidden}.home-bottom{display:grid;grid-template-columns:1fr;gap:16px}.practice-presets .tool{flex:1;min-width:120px}.learning-reference canvas{height:100px;width:120px}}

.top nav{display:flex;flex-wrap:wrap;gap:8px}.top nav button{padding:10px 14px;min-height:44px}.rule-primer{box-shadow:0 8px 32px #48694a0a}.learning-reference p{line-height:1.5}

.top nav button{white-space:nowrap}@media(max-width:600px){.top nav{width:100%;justify-content:flex-start}.top nav button{padding:9px 12px}.hero h1{font-size:2.65rem;line-height:1.04}.platform-preview-notice{background:#fffdf5;color:#244435;padding:12px;border-radius:12px}}

/* Gameplay owns the available viewport. Only the scene/details scroll;
   the answer dock stays in normal flex flow, clear of browser and safe areas. */
body[data-screen=play]{padding-bottom:0}
body[data-screen=play] .top{display:none}
body[data-screen=play] main{width:100%;max-width:1240px;padding:12px;min-width:0}
body[data-screen=play] .play-view{width:100%;max-width:none;height:calc(100dvh - 24px);min-height:0;padding:16px;display:flex;flex-direction:column;overflow:hidden}
.play-top,.play-rule,.response-area,.keyboard-help{flex-shrink:0;min-width:0}
.play-top{flex-wrap:wrap;gap:6px}
.play-top p{overflow-wrap:anywhere}
.play-rule{margin:8px 0;gap:8px;flex-wrap:wrap}
.play-rule .fine{white-space:normal}
.play-layout{flex:1 1 0;min-height:0;min-width:0;width:100%;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);overflow:auto;border-radius:14px}
.play-layout>.stage{aspect-ratio:auto;min-width:0;min-height:0;height:100%}
.play-layout>.play-panel{min-width:0;min-height:0;overflow:auto;overflow-wrap:anywhere;padding:20px;justify-content:safe center}
.play-panel h2{font-size:clamp(20px,2.4vw,28px)}
.play-panel .memory-slots{flex-wrap:wrap}
.play-panel .round-progress{min-height:5px}
.play-panel .learning-reference{flex-shrink:0}
.keyboard-help{width:100%;max-height:25dvh;overflow:auto;margin:8px 0 0;padding:0 12px}
.keyboard-help summary{padding:9px 0;font-size:12px;min-height:36px}
.response-area{position:static;width:min(760px,100%);max-width:100%;margin:8px auto 0;padding:0 0 env(safe-area-inset-bottom);border:0;background:transparent;backdrop-filter:none;z-index:auto}
.response-area>p{min-height:0;margin:0 0 8px;font-size:13px;line-height:1.4}
.answers{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.answers .answer{min-width:0;min-height:52px;padding:12px 16px;overflow-wrap:anywhere}
.stage-tools{flex-wrap:wrap;justify-content:flex-end;max-width:calc(100% - 16px);top:8px;right:8px}
@media(max-width:650px){
 body[data-screen=play] main{padding:6px}
 body[data-screen=play] .play-view{height:calc(100dvh - 12px);padding:10px;border-radius:14px}
 .play-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(100px,1fr) auto}
 .play-layout>.play-panel{max-height:25dvh;padding:12px;border-left:0;border-top:1px solid var(--line);border-radius:0;display:block}
 .play-panel h2{font-size:21px;margin-bottom:8px}
 .play-panel>p{margin-bottom:8px;font-size:12px}
 .play-panel>.fine{font-size:10px}
 .play-panel .round-progress{margin:8px 0}
 .play-panel .learning-reference{padding:8px;display:grid;grid-template-columns:80px minmax(0,1fr);align-items:center;gap:8px}
 .learning-reference canvas{width:80px;height:65px}
 .learning-reference p{font-size:11px;margin:0}
 .response-area{margin-top:6px}
 .answers .answer{padding:12px;min-height:52px;font-size:13px}
 .play-top .back,.play-top .tool{min-height:36px;padding-block:6px}
 .play-rule .eyebrow,.play-rule .fine{font-size:10px}
}
@media(max-height:560px){
 body[data-screen=play] .play-view{padding:8px}
 .play-top .back,.play-top .tool{min-height:30px;padding-block:4px}
 .play-rule{margin:4px 0}
 .keyboard-help{margin-top:4px;max-height:18dvh}
 .keyboard-help summary{padding:5px 0;min-height:28px}
 .response-area>p{font-size:12px;margin-bottom:4px}
 .answers .answer{min-height:44px;padding-block:8px}
 .play-layout>.play-panel{padding:10px}
 .play-panel h2{font-size:19px;margin-bottom:6px}
 .play-panel>p{font-size:11px;margin-bottom:6px}
}
body[data-screen=play] .platform-preview-notice{display:none}

/* Reserved save-health line: storage errors never move the answer buttons. */
.response-area>#play-save-note{block-size:2.4em;min-height:0;overflow:auto;margin:0 0 4px;font-size:11px;line-height:1.2;color:#82472e;flex-shrink:0}

.simple-example{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0;margin:16px 0}.simple-example li{min-width:0;padding:12px;background:#edf2e8;border:1px solid #c5d3c0;border-radius:10px}.simple-example li>b,.simple-example span{display:block;font-size:13px;line-height:1.5}.simple-example li>b{color:#2d5143}.simple-reassurance{font-size:13px!important;margin-bottom:0}.more-modes{padding:18px 24px;background:#faf8f0f2;border:1px solid #cad6c8;border-radius:18px;margin-top:24px}.more-modes>summary{font-size:16px;font-weight:700;padding:8px 0;min-height:44px}.more-modes>p{margin-top:18px}.hero-actions>#simple-start{font-size:16px}.hero .hero-actions{align-items:center}.hero .hero-actions>#resume{flex-basis:100%}@media(max-width:650px){.simple-example{grid-template-columns:1fr}.simple-example li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px}.simple-example li>b,.simple-example span{font-size:12px}.more-modes{padding:14px}.hero .hero-actions>.text-button{text-align:center;justify-content:center}.rule-primer{padding:16px}.hero h1{font-size:2.7rem}}

body[data-screen=home] .top nav button:not(.account-trigger):not(#open-settings){display:none}.optional-navigation{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.hero .hero-actions{margin-block:18px 8px}

/* Living water / paper / pigment. Transform-only feedback leaves the answer dock fixed. */
:root{--accent:#b5c8bd;--paper:#fcf8ef;--ink:#294b48;--line:#b7cbc2}
body{background:#b7ccc9}.top{background:#faf7edeb;border-color:#ffffff70;border-radius:0 0 20px 20px}.brand{font-weight:500}.hero{background:linear-gradient(120deg,#fcf9f0ed,#f9f6eee6 57%,#e1e9e0a8);border-color:#fff7dfbd;box-shadow:0 24px 90px #234e4d19}.hero h1 em{color:#4c776e}.rule-primer{background:#fffdf4db;border-color:#b8cdbd}.hero-art{border:9px solid #f9f3e3;outline:1px solid #ded6bf;box-shadow:0 18px 46px #234d4930;transform:rotate(-1deg);transition:transform .65s cubic-bezier(.2,.8,.2,1),box-shadow .65s}.hero-art:hover{transform:translateY(-5px) rotate(.6deg);box-shadow:0 25px 55px #234d4938}.hero-art figcaption{background:#f4eedfe8;color:#3d5e52;border-color:#d1d4bc}.primary{transition:box-shadow .25s,transform .25s,background .25s}button.primary{background:#315f56;box-shadow:0 5px 20px #35675b1c}button.primary:hover{background:#3b7462;box-shadow:0 6px 25px #5b9c7c38}.play-view{box-shadow:0 18px 70px #274e4930}.stage{border-radius:14px;box-shadow:inset 0 0 60px #c1d1b52b}.answers .answer{transition:transform .16s,box-shadow .2s}.answers .answer:hover:not(:disabled){box-shadow:0 5px 22px #547c6d24;transform:translateY(-2px)}.answers .answer:active:not(:disabled){transform:scale(.98)}.round-progress{gap:8px;align-items:center;min-height:12px}.round-progress i{height:7px;border-radius:70% 25% 65% 30%;background:#d7ded3;transition:background .35s,transform .35s}.round-progress i.done{background:linear-gradient(120deg,#589384,#b0bf8c 65%,#ddb4bf);transform:scaleY(1.4)}.round-progress i.now{background:#d8b5c2;outline-color:#b395b0}
.answer-bloom{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 70% 82%,#eac8d578,transparent 62%),radial-gradient(ellipse at 20% 30%,#d6deb45c,transparent 60%);animation:pigment-arrives .85s ease-out both}.answer-garden{position:absolute;right:12px;bottom:12px;width:min(38%,180px);padding:5px;background:#fff8e9e8;border:1px solid #e2dbc8;box-shadow:0 6px 23px #2a565c25;pointer-events:none;animation:garden-arrives .55s cubic-bezier(.2,.8,.2,1) both;transform:rotate(-2deg);border-radius:5px}.answer-garden canvas{width:100%;height:auto;aspect-ratio:320/210;border-radius:2px}.answer-garden span{display:block;padding:5px 2px 1px;font:10px/1.3 Georgia,serif;color:#34554a;text-align:center}.pause-overlay{z-index:3}.result-art{border:9px solid #f9f3e3;box-shadow:0 16px 45px #2e5a5430}.result-art canvas{animation:painting-reveal 1s cubic-bezier(.2,.7,.2,1) both}.result-art figcaption{background:#f7f1e6;border-color:#d2d9c5}.collection-card{background:#fff8e9;box-shadow:0 8px 24px #31584d0d}.more-modes{background:#faf8edf0;border-color:#f8f4dfaa}.simple-example li{background:#eaf0e2a8}
@keyframes pigment-arrives{0%{opacity:0;transform:scale(.98)}30%{opacity:1}100%{opacity:.5;transform:scale(1)}}@keyframes garden-arrives{from{opacity:0;transform:translateY(12px) rotate(-5deg)}to{opacity:1;transform:translateY(0) rotate(-2deg)}}@keyframes painting-reveal{from{opacity:.35;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
body[data-motion=false] .answer-bloom,body[data-motion=false] .answer-garden,body[data-motion=false] .result-art canvas{animation:none}body[data-motion=false] .hero-art{transition:none}body[data-motion=false] .hero-art:hover{transform:rotate(-1deg)}@media(prefers-reduced-motion:reduce){.answer-bloom,.answer-garden,.result-art canvas{animation:none}.hero-art{transition:none}.hero-art:hover{transform:rotate(-1deg)}.answers .answer,.round-progress i{transition:none}.answers .answer:hover:not(:disabled){transform:none}}
@media(max-width:650px){.hero-art{border-width:7px}.answer-garden{right:8px;bottom:8px;width:34%;padding:4px}.answer-garden span{font-size:9px}.result-art{border-width:7px}}

body[data-motion=false] .answers .answer,body[data-motion=false] .round-progress i{transition:none}body[data-motion=false] .answers .answer:hover:not(:disabled){transform:none}