:root{--ink:#103730;--paper:#fff9ec;--mint:#d8f0e9;--line:#b9cec8;--shadow:0 18px 50px #10373018;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:var(--ink);background:#eef4f1}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(135deg,#edf6f2,#fff9ec)}button,a{font:inherit}.skip{position:fixed;left:1rem;top:-5rem;background:#fff;padding:1rem;z-index:9}.skip:focus{top:1rem}header{height:92px;display:flex;align-items:center;gap:24px;padding:16px clamp(18px,5vw,64px);background:#fffdf8;border-bottom:1px solid var(--line)}.brand{display:grid;place-items:center;width:58px;height:58px;border-radius:20px;background:var(--ink);color:white;font-size:30px;font-weight:900;text-decoration:none}.progress{flex:1;max-width:620px;margin:auto}.progress b{display:block;text-align:center;margin-bottom:8px}progress{appearance:none;width:100%;height:11px;border:0;border-radius:20px;overflow:hidden;background:#dce7e3}progress::-webkit-progress-bar{background:#dce7e3}progress::-webkit-progress-value{background:#19836f;border-radius:20px}.reset{border:0;background:transparent;color:var(--ink);font-size:38px;cursor:pointer}main{width:min(1120px,calc(100% - 32px));min-height:calc(100vh - 185px);margin:0 auto;padding:clamp(28px,5vw,72px) 0;display:grid;align-items:center}.scene{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);gap:clamp(28px,6vw,72px);align-items:center;animation:enter .45s ease}.scene.reverse .visual{order:-1}.copy{max-width:680px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-weight:800;color:#55716a}.time{font-size:clamp(18px,2vw,24px)}h1{font-size:clamp(42px,7vw,82px);line-height:.98;margin:.25em 0}h2{font-size:clamp(34px,5vw,60px);line-height:1.04;margin:.25em 0}.lead{font-size:clamp(21px,2.6vw,31px);line-height:1.45}.plain{font-size:clamp(18px,2vw,24px);line-height:1.55}.quote,.lesson,.tip{margin:28px 0;padding:22px 26px;border-left:8px solid var(--ink);background:#fff;border-radius:0 22px 22px 0;font-size:clamp(20px,2.3vw,28px);font-weight:700}.tip{border-color:#ef805f;background:#fff1da}.visual{min-height:390px;border-radius:36px;background:var(--mint);display:grid;place-items:center;overflow:hidden;box-shadow:var(--shadow);position:relative}.visual img{width:100%;height:100%;max-height:520px;object-fit:contain}.visual .symbol{font-size:clamp(90px,15vw,190px)}.cards,.choices,.areas{display:grid;gap:14px;margin-top:26px}.cards,.choices{grid-template-columns:repeat(2,1fr)}.card,.choice{border:2px solid var(--line);border-radius:20px;background:#fff;padding:18px;text-align:left}.card b{font-size:20px}.card span{display:block;margin-top:8px}.choice{cursor:pointer;font-weight:750;font-size:19px}.choice:hover,.choice:focus-visible{border-color:#19836f}.choice[aria-pressed=true]{background:#246f61;color:#fff;border-color:#63d6bf}.feedback{margin-top:18px;padding:18px;border-radius:18px;background:#fff3c9;font-size:20px}.areas{grid-template-columns:repeat(3,1fr)}.area{padding:18px;border-radius:18px;background:#fff;box-shadow:var(--shadow)}.area b{display:block;font-size:22px}.cast{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.cast .card{text-align:center}.cast img{height:130px;width:100%;object-fit:contain}.done{padding:30px;border-radius:28px;background:var(--ink);color:#fff}.done a{color:#a7f1df}nav{position:sticky;bottom:0;display:flex;justify-content:space-between;gap:16px;padding:14px clamp(18px,5vw,64px);background:#fffdf8;border-top:1px solid var(--line)}nav button,dialog button{border:2px solid var(--ink);border-radius:16px;padding:15px 22px;background:white;color:var(--ink);font-weight:850;cursor:pointer}.next{background:var(--ink)!important;color:#fff!important}button:disabled{opacity:.35;cursor:not-allowed}dialog{border:0;border-radius:28px;padding:32px;max-width:480px;color:var(--ink)}dialog::backdrop{background:#082e29aa}dialog div{display:flex;gap:12px;justify-content:flex-end}@keyframes enter{from{opacity:0;transform:translateY(18px)}}@media(max-width:760px){header{height:80px}.brand{width:48px;height:48px;border-radius:16px}.scene{grid-template-columns:1fr}.scene.reverse .visual{order:0}.visual{min-height:260px}.cards,.choices,.areas{grid-template-columns:1fr}main{min-height:calc(100vh - 165px);padding:28px 0 100px}nav{position:fixed;width:100%;z-index:4}nav button{padding:13px 15px}.next{flex:1}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
