:root{--color-forest: #245c43;--color-forest-hover: #1c4a36;--color-leaf: #4d8b61;--color-soft-green: #a8c98a;--color-cream: #f4e9d6;--color-terracotta: #c77d52;--color-ochre: #d7b77a;--color-white: #ffffff;--color-bg: #f6f8f4;--color-text: #26362d;--color-text-secondary: #6b766d;--color-border: #dde5dc;--color-border-strong: #c7d3c6;--color-correct-bg: #edf5e8;--color-correct-border: #8fbb83;--color-correct-text: #1f5139;--color-learn-bg: #fbf4e6;--color-learn-border: #e2c58c;--color-learn-text: #6b4e1f;--color-learn-accent: #b07a2a;--color-focus: #245c43;--font-sans: "Noto Sans", "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, system-ui, sans-serif;--text-title: clamp(1.75rem, 1.35rem + 1.6vw, 2.5rem);--text-heading: clamp(1.375rem, 1.2rem + .7vw, 1.75rem);--text-question: clamp(1.25rem, 1.1rem + .6vw, 1.625rem);--text-answer: clamp(1rem, .96rem + .2vw, 1.125rem);--text-body: 1rem;--text-explain: .9375rem;--text-helper: .8125rem;--leading-tight: 1.25;--leading-body: 1.55;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--radius-button: 12px;--radius-answer: 16px;--radius-card: 22px;--radius-panel: 16px;--radius-pill: 999px;--shadow-card: 0 1px 2px rgba(38, 54, 45, .05), 0 8px 24px rgba(38, 54, 45, .06);--shadow-raised: 0 1px 2px rgba(38, 54, 45, .08), 0 4px 12px rgba(38, 54, 45, .08);--content-max: 1200px;--touch-min: 44px;--progress-height: 8px;--ease-out: cubic-bezier(.22, .61, .36, 1);--dur-select: .15s;--dur-feedback: .2s;--dur-highlight: .26s;--dur-progress: .3s;--dur-reveal: .34s}@media(prefers-reduced-motion:reduce){:root{--dur-select: 0ms;--dur-feedback: 0ms;--dur-highlight: 0ms;--dur-progress: 0ms;--dur-reveal: 0ms}}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;min-height:100vh;background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);font-size:var(--text-body);line-height:var(--leading-body);-webkit-font-smoothing:antialiased}h1,h2,h3,p,figure,ul,ol{margin:0}ul,ol{padding:0}img,svg{display:block;max-width:100%}button{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}[tabindex="-1"]:focus{outline:none}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.skip-link{position:absolute;left:var(--space-4);top:-100px;z-index:10;padding:var(--space-2) var(--space-4);background:var(--color-forest);color:var(--color-white);border-radius:var(--radius-button);text-decoration:none;font-weight:600}.skip-link:focus{top:var(--space-2)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--touch-min);padding:var(--space-3) var(--space-6);border-radius:var(--radius-button);border:1px solid transparent;font-size:1rem;font-weight:600;line-height:1.2;cursor:pointer;text-decoration:none;transition:background-color var(--dur-select) var(--ease-out),border-color var(--dur-select) var(--ease-out),color var(--dur-select) var(--ease-out)}.btn--primary{background:var(--color-forest);color:var(--color-white)}.btn--primary:hover{background:var(--color-forest-hover)}.btn--large{min-height:52px;padding:var(--space-3) var(--space-8);font-size:1.0625rem}.btn--secondary{background:var(--color-white);color:var(--color-forest);border-color:var(--color-border-strong)}.btn--secondary:hover{border-color:var(--color-forest)}.btn--text{min-height:var(--touch-min);padding:var(--space-2) var(--space-3);background:transparent;color:var(--color-text-secondary);font-weight:500;font-size:.9375rem}.btn--text:hover{color:var(--color-forest);text-decoration:underline;text-underline-offset:3px}.btn--learn{background:var(--color-white);color:var(--color-learn-text);border-color:var(--color-learn-border)}.btn--learn:hover{border-color:var(--color-learn-accent)}.btn svg{width:18px;height:18px;flex:none}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:var(--color-white);border-bottom:1px solid var(--color-border)}.app-header__inner{max-width:var(--content-max);margin:0 auto;padding:var(--space-3) var(--space-6);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3) var(--space-4);flex-wrap:wrap;min-height:64px}.app-header__exit{flex:none;margin-left:auto}.brand{display:flex;align-items:center;gap:var(--space-3);min-width:0;flex:1 1 0}.brand__mark{width:36px;height:36px;flex:none}.brand__text{display:flex;flex-direction:column;min-width:0}.brand__name{font-weight:700;font-size:1rem;color:var(--color-forest);line-height:1.2}.brand__tag{font-size:var(--text-helper);color:var(--color-text-secondary);line-height:1.3}.exit-confirm{margin-left:auto;display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}.exit-confirm__text{font-size:.875rem;color:var(--color-text-secondary)}.app-main{flex:1;width:100%;max-width:var(--content-max);margin:0 auto;padding:var(--space-6)}.app-footer{border-top:1px solid var(--color-border);background:var(--color-white)}.app-footer p{max-width:var(--content-max);margin:0 auto;padding:var(--space-4) var(--space-6);font-size:var(--text-helper);color:var(--color-text-secondary)}.card{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-card)}.scene-card{padding:var(--space-3)}.eyebrow{font-size:var(--text-helper);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--color-leaf)}.chip{display:inline-flex;align-items:center;padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);background:var(--color-cream);color:#6b4e1f;font-size:var(--text-helper);font-weight:600}.content-error{padding:var(--space-8);max-width:640px;margin:var(--space-10) auto}.content-error h1{font-size:var(--text-heading);color:var(--color-forest);margin-bottom:var(--space-3)}.welcome{display:flex;flex-direction:column;gap:var(--space-10)}.welcome__hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--space-6);align-items:center}.welcome__intro{padding:var(--space-8);display:flex;flex-direction:column;gap:var(--space-4)}.welcome__title{font-size:var(--text-title);line-height:1.15;color:var(--color-forest);letter-spacing:-.01em}.welcome__subtitle{font-size:1.125rem;color:var(--color-text-secondary)}.welcome__scene{display:flex;flex-direction:column;gap:var(--space-3)}.welcome__scene .village-scene{width:100%}.scene-legend{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2) var(--space-4);padding:var(--space-2) var(--space-3) var(--space-3)}.scene-legend li{display:flex;gap:var(--space-2);align-items:baseline;font-size:var(--text-helper);color:var(--color-text-secondary)}.scene-legend strong{color:var(--color-text);font-weight:600}.scene-legend__dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--color-leaf);transform:translateY(-1px)}.steps{list-style:none;display:grid;gap:var(--space-3);margin:var(--space-2) 0}.steps__item{display:flex;gap:var(--space-3);align-items:flex-start;font-size:.9375rem}.steps__num{flex:none;width:26px;height:26px;border-radius:50%;background:var(--color-correct-bg);color:var(--color-forest);font-weight:700;font-size:.8125rem;display:grid;place-items:center;margin-top:1px}.welcome__actions{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-2)}.welcome__meta{font-size:var(--text-helper);color:var(--color-text-secondary)}.best-chip{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2);padding:var(--space-2) var(--space-2) var(--space-2) var(--space-4);border-radius:var(--radius-button);background:var(--color-bg);border:1px solid var(--color-border);font-size:.9375rem}.best-chip>svg{width:20px;height:20px;color:var(--color-terracotta);fill:none;stroke:currentColor}.best-chip__reset{margin-left:auto}.best-chip__confirm{display:inline-flex;align-items:center;gap:var(--space-1);margin-left:auto;font-size:.875rem;color:var(--color-text-secondary)}.future__head{margin-bottom:var(--space-4)}.future__title{font-size:var(--text-heading);color:var(--color-text)}.future__sub{color:var(--color-text-secondary);font-size:.9375rem}.future__grid{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4)}.future-card{display:flex;flex-direction:column;background:var(--color-white);border:1px dashed var(--color-border-strong);border-radius:var(--radius-answer);overflow:hidden}.future-card__art{background:var(--color-bg);display:grid;place-items:center;padding:var(--space-4)}.future-card__icon{width:72px;height:72px;opacity:.85}.future-card__body{padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-1)}.future-card__badge{align-self:flex-start;font-size:.75rem;font-weight:600;color:var(--color-text-secondary);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-pill);padding:2px var(--space-2)}.future-card__title{font-size:1rem;margin-top:var(--space-1)}.future-card__text{font-size:.875rem;color:var(--color-text-secondary)}.play{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--space-6);align-items:start}.play__scene{position:sticky;top:var(--space-6)}.play__card{padding:var(--space-6)}.results{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--space-6);align-items:start}.results__summary{padding:var(--space-8);display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-4)}.results__title{font-size:var(--text-heading);color:var(--color-forest);line-height:var(--leading-tight)}.results__message{font-size:1.0625rem}.results__helper{font-size:var(--text-helper);color:var(--color-text-secondary);margin-top:calc(-1 * var(--space-2))}.score-ring{position:relative;width:168px;height:168px}.score-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.score-ring__track{fill:none;stroke:var(--color-border);stroke-width:10}.score-ring__value{fill:none;stroke:var(--color-forest);stroke-width:10;stroke-linecap:round;transition:stroke-dasharray .6s var(--ease-out)}.score-ring__label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1}.score-ring__label strong{font-size:3rem;color:var(--color-forest)}.score-ring__label span{font-size:.875rem;color:var(--color-text-secondary)}.best-note{display:flex;gap:var(--space-3);align-items:flex-start;text-align:left;width:100%;padding:var(--space-4);border-radius:var(--radius-panel);background:var(--color-bg);border:1px solid var(--color-border)}.best-note>svg{width:24px;height:24px;flex:none;color:var(--color-terracotta)}.best-note--new{background:var(--color-cream);border-color:var(--color-ochre)}.best-note__value{font-weight:600}.best-note__text{font-size:.9375rem;color:var(--color-text-secondary)}.results__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3);margin-top:var(--space-2)}.results__side{display:flex;flex-direction:column;gap:var(--space-6)}.takeaways{padding:var(--space-6)}.takeaways__title{font-size:1.25rem;margin-bottom:var(--space-3)}.takeaways__list{list-style:none;display:grid;gap:var(--space-3)}.takeaways__list li{display:flex;gap:var(--space-3);align-items:flex-start;font-size:var(--text-explain)}.takeaways__icon{flex:none;width:24px;height:24px;border-radius:50%;background:var(--color-correct-bg);color:var(--color-forest);display:grid;place-items:center}.takeaways__icon svg{width:14px;height:14px}@media(max-width:1023px){.welcome__hero,.results{grid-template-columns:minmax(0,1fr)}.welcome__scene{order:-1}.play{grid-template-columns:minmax(0,1fr);gap:var(--space-4)}.play__scene{position:static}.future__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.app-main{padding:var(--space-4)}.app-header__inner{padding:var(--space-2) var(--space-4)}.brand__tag{display:none}.brand__name{font-size:.9375rem}.brand__mark{width:32px;height:32px}.scene-legend{grid-template-columns:minmax(0,1fr)}.welcome__intro,.results__summary{padding:var(--space-6) var(--space-5)}.play__card{padding:var(--space-5) var(--space-4)}.scene-card{padding:var(--space-2)}.welcome__start,.results__actions .btn{width:100%}.future__grid{grid-template-columns:minmax(0,1fr)}.future-card{flex-direction:row}.future-card__art{flex:none;width:92px;padding:var(--space-3)}.future-card__icon{width:56px;height:56px}.app-footer p{padding:var(--space-4)}}.question-card{display:flex;flex-direction:column;gap:var(--space-4)}.question-card__top{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-3);font-size:.9375rem;color:var(--color-text-secondary)}.question-card__top strong{color:var(--color-text)}.question-card__score strong{color:var(--color-forest)}.question-card__meta{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2) var(--space-3)}.question-card__mode{font-size:var(--text-helper);color:var(--color-text-secondary)}.question-card__text{font-size:var(--text-question);line-height:1.3;font-weight:650;color:var(--color-text)}.progress{height:var(--progress-height);border-radius:var(--radius-pill);background:var(--color-border);overflow:hidden}.progress__fill{height:100%;border-radius:inherit;background:var(--color-forest);transition:width var(--dur-progress) var(--ease-out)}.prompt-art{border-radius:var(--radius-answer);background:var(--color-bg);border:1px solid var(--color-border);overflow:hidden}.prompt-art--icon{display:grid;place-items:center;padding:var(--space-3)}.prompt-art__icon{width:96px;height:96px}.prompt-art__scenario{width:100%;height:auto}.interaction{display:flex;flex-direction:column;gap:var(--space-3)}.interaction__instruction{font-size:var(--text-helper);color:var(--color-text-secondary)}.answer-list{list-style:none;display:grid;gap:var(--space-3)}.answer-list--tile{grid-template-columns:repeat(3,minmax(0,1fr))}.answer-list__item{display:flex}.answer{width:100%;min-height:56px;display:flex;flex-direction:column;text-align:left;padding:var(--space-3) var(--space-4);border-radius:var(--radius-answer);border:1.5px solid var(--color-border);background:var(--color-white);cursor:pointer;transition:border-color var(--dur-select) var(--ease-out),background-color var(--dur-select) var(--ease-out),box-shadow var(--dur-select) var(--ease-out),transform var(--dur-select) var(--ease-out)}.answer:hover:not(:disabled){border-color:var(--color-leaf);box-shadow:var(--shadow-raised)}.answer:active:not(:disabled){transform:scale(.99)}.answer:disabled{cursor:default}.answer__body{display:flex;align-items:flex-start;gap:var(--space-3)}.answer__letter{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--color-bg);border:1px solid var(--color-border);color:var(--color-forest);font-weight:700;font-size:.875rem;transition:background-color var(--dur-select) var(--ease-out),color var(--dur-select) var(--ease-out)}.answer__letter svg{width:16px;height:16px}.answer__text{font-size:var(--text-answer);line-height:1.4;padding-top:3px;display:flex;flex-direction:column;gap:2px}.answer__status{font-size:var(--text-helper);font-weight:600}.answer--tile{align-items:stretch;padding:var(--space-3);gap:var(--space-3)}.answer__art{display:grid;place-items:center;border-radius:12px;background:var(--color-bg);padding:var(--space-2)}.answer__icon{width:100%;max-width:104px;aspect-ratio:1;height:auto}.answer--tile .answer__body{flex-direction:column;align-items:flex-start;gap:var(--space-2)}.answer--tile .answer__letter{width:26px;height:26px;font-size:.8125rem}.answer--tile .answer__text{font-size:.9375rem;padding-top:0}.answer--correct{border-color:var(--color-correct-border);background:var(--color-correct-bg)}.answer--correct .answer__letter{background:var(--color-forest);border-color:var(--color-forest);color:var(--color-white)}.answer--correct .answer__status{color:var(--color-correct-text)}.answer--incorrect{border-color:var(--color-learn-border);background:var(--color-learn-bg)}.answer--incorrect .answer__letter{background:var(--color-learn-bg);border-color:var(--color-learn-border);color:var(--color-learn-accent)}.answer--incorrect .answer__status{color:var(--color-learn-text)}.answer--tried{background:var(--color-bg);border-style:dashed}.answer--tried .answer__text,.answer--locked .answer__text,.answer--tried .answer__letter{color:var(--color-text-secondary)}.answer--tried .answer__icon,.answer--locked .answer__icon{opacity:.55}.feedback{border-radius:var(--radius-panel);padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-3);border:1px solid;animation:feedback-in var(--dur-feedback) var(--ease-out)}@keyframes feedback-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.feedback--correct{background:var(--color-correct-bg);border-color:var(--color-correct-border)}.feedback--learn{background:var(--color-learn-bg);border-color:var(--color-learn-border)}.feedback__head{display:flex;align-items:center;gap:var(--space-3)}.feedback__badge{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center}.feedback__badge svg{width:20px;height:20px}.feedback--correct .feedback__badge{background:var(--color-forest);color:var(--color-white)}.feedback--learn .feedback__badge{background:var(--color-white);color:var(--color-learn-accent);border:1px solid var(--color-learn-border)}.feedback__title{font-size:1.25rem;line-height:var(--leading-tight)}.feedback--correct .feedback__title{color:var(--color-correct-text)}.feedback--learn .feedback__title{color:var(--color-learn-text)}.feedback__text{font-size:var(--text-explain)}.feedback__hint{font-size:var(--text-explain);color:var(--color-learn-text)}.feedback__meta{font-size:var(--text-helper);color:var(--color-correct-text)}.feedback__actions{display:flex;margin-top:var(--space-1)}@media(max-width:600px){.answer-list--tile{grid-template-columns:minmax(0,1fr)}.answer--tile{flex-direction:row;align-items:center}.answer--tile .answer__art{flex:none;width:76px}.answer--tile .answer__body{flex-direction:row;align-items:center}.feedback__actions .btn{width:100%}.prompt-art__icon{width:80px;height:80px}}@media(prefers-reduced-motion:reduce){.feedback{animation:none}.answer:active:not(:disabled){transform:none}}.village-scene{display:flex;flex-direction:column;gap:var(--space-3)}.village-scene__svg{width:100%;height:auto;aspect-ratio:16 / 9;border-radius:16px;background:#f3eedf}.scene-overlay{opacity:0;transform:translateY(8px) scale(.92);transform-box:fill-box;transform-origin:50% 100%;transition:opacity var(--dur-reveal) var(--ease-out),transform var(--dur-reveal) var(--ease-out)}.scene-overlay.is-visible{opacity:1;transform:none}.scene-overlay--highlight{transform:none;transition:opacity var(--dur-highlight) var(--ease-out)}.village-scene__caption{display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-2) var(--space-1);font-size:var(--text-helper);color:var(--color-text-secondary)}.village-scene__meter{display:inline-flex;gap:3px;flex:none}.village-scene__pip{width:10px;height:10px;border-radius:50%;background:var(--color-border);transition:background-color var(--dur-reveal) var(--ease-out)}.village-scene__pip.is-on{background:var(--color-leaf)}@media(max-width:600px){.village-scene__caption{flex-direction:column;align-items:flex-start;gap:var(--space-1)}.village-scene__pip{width:8px;height:8px}}@media(prefers-reduced-motion:reduce){.scene-overlay,.scene-overlay.is-visible{transform:none;transition:none}}