@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#111615;--panel:#1a211f;--line:#35413c;--text:#f3f4ec;--muted:#bac3ba;--gold:#e5c178;--blue:#a5c6df;--rose:#e6b0a7;--green:#b5d3ac;font-family:Manrope,system-ui,sans-serif;font-size:16px;line-height:1.65}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,a{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit;text-underline-offset:4px}button:disabled{cursor:default;opacity:.6}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:5px}button{border:0}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.15;text-wrap:balance}h1{font-size:clamp(2rem,4vw,3.6rem);letter-spacing:-.045em;font-weight:600}h2{font-size:clamp(1.6rem,3vw,2.4rem);letter-spacing:-.03em}h3{font-size:1.3rem}p+p{margin-top:14px}.muted{color:var(--muted)}.eyebrow{font-size:.875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);font-weight:700}.small{font-size:.875rem}.skip{position:fixed;top:-100px;z-index:5;background:var(--gold);color:#151a15;padding:12px}.skip:focus{top:0}.topbar{max-width:1280px;margin:auto;padding:24px 32px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:1.2rem;letter-spacing:.1em;font-weight:800}.brand i{font-family:Georgia,serif;font-style:normal;color:var(--gold);font-size:2rem}.brand small{display:block;font-size:.625rem;letter-spacing:.23em;color:var(--muted);line-height:1}.nav{margin-left:auto;display:flex;gap:24px;align-items:center}.nav a{font-size:.875rem;text-decoration:none;color:var(--muted)}.nav a:hover{color:var(--gold)}.text-btn{padding:8px 0;background:none;color:var(--muted)}.wallet{border:1px solid var(--line);padding:6px 12px;border-radius:30px;font-size:.875rem;color:var(--gold);white-space:nowrap}.shell{max-width:1216px;margin:auto;padding:38px 32px 60px}main:focus{outline:none}.intro{display:grid;grid-template-columns:1.25fr 1fr;gap:60px;align-items:center;margin-bottom:32px}.intro h1{margin:12px 0 20px}.intro p{max-width:650px}.dialogue{border-left:2px solid var(--gold);padding:20px 24px;background:var(--panel)}.dialogue p{margin:10px 0}.dialogue .speaker{font-size:.875rem;color:var(--gold)}.sectionline{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:28px 0 18px}.sectionline h2{font-size:1.2rem;letter-spacing:0}.routes{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.route{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--panel);display:flex;flex-direction:column}.route-image{position:relative;height:178px;overflow:hidden;background:#ddd}.route-image img{width:100%;height:100%;object-fit:cover;object-position:center 43%;filter:saturate(.75)}.route-number{position:absolute;top:12px;left:12px;background:#111615e8;border:1px solid #ffffff40;padding:3px 10px;border-radius:30px;font-size:.875rem}.route-body{padding:22px;display:flex;flex:1;flex-direction:column;gap:12px}.route h3{font-size:1.65rem}.route .route-desc{color:var(--muted);font-size:1rem;flex:1}.route button{width:100%;margin-top:6px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:10px;padding:12px 22px;min-height:48px;background:var(--gold);color:#1a201b;border:1px solid transparent;border-radius:4px;font-weight:700;text-decoration:none}.btn:hover{filter:brightness(1.07)}.btn.secondary{background:transparent;border-color:var(--line);color:var(--text)}.btn.blue{background:var(--blue)}.btn.rose{background:var(--rose)}.progress{height:4px;background:#39413d;border-radius:10px;overflow:hidden;margin:3px 0}.progress span{height:100%;display:block;background:var(--gold)}.hub-bottom{display:flex;justify-content:space-between;gap:22px;margin-top:26px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:.875rem}.hub-bottom a{white-space:nowrap}.journey-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}.journey-top a{text-decoration:none;color:var(--muted);font-size:.875rem}.workspace{display:grid;grid-template-columns:260px minmax(0,1fr);gap:36px}.sidebar{align-self:start}.route-portrait{height:180px;width:100%;object-fit:cover;border-radius:4px;margin:16px 0}.sidebar h2{font-size:1.8rem}.chapters{display:grid;gap:8px;margin-top:20px}.chapter{display:flex;align-items:center;text-align:left;gap:12px;background:none;padding:12px;border:1px solid transparent;border-radius:4px;font-size:.875rem}.chapter.active{background:var(--panel);border-color:var(--line);color:var(--gold)}.chapter span:first-child{flex-shrink:0;width:25px;height:25px;border:1px solid var(--line);border-radius:50%;text-align:center;line-height:23px}.chapter small{display:block;color:var(--muted);font-size:.75rem}.help-open{border:1px solid var(--gold);color:var(--gold);background:none;padding:14px 18px;border-radius:4px;text-align:left;width:100%;margin-top:24px}.help-open b,.help-open span{display:block}.help-open span{font-size:.875rem;color:var(--muted);margin-top:6px}.scene{min-width:0}.client-line{font-size:.875rem;color:var(--gold);margin-bottom:12px}.scene h1{font-size:clamp(1.8rem,3.4vw,2.65rem);margin:8px 0 20px}.quote{font-family:Georgia,serif;font-size:1.4rem;line-height:1.5;margin-bottom:18px}.brief{padding:18px 22px;background:var(--panel);border-left:2px solid var(--gold);margin-bottom:26px}.brief strong{font-size:.875rem;color:var(--gold);display:block;margin-bottom:5px}.steps{display:flex;gap:6px;margin-bottom:20px}.steps span{height:4px;flex:1;background:var(--line)}.steps .done{background:var(--gold)}.step-label{color:var(--muted);font-size:.875rem;margin-bottom:8px}.question{font-size:1.25rem;line-height:1.5;margin-bottom:20px;letter-spacing:0}.choices{display:grid;gap:10px}.choice{background:#1a211f;border:1px solid #4c5950;padding:16px 20px;display:flex;gap:15px;align-items:center;text-align:left;border-radius:4px;min-height:62px}.choice .letter{width:28px;height:28px;line-height:26px;text-align:center;border:1px solid var(--line);border-radius:50%;flex-shrink:0;color:var(--muted);font-size:.875rem}.choice:hover{border-color:var(--gold);background:#252c25}.choice.selected{border-color:var(--gold)}.choice.correct{border-color:var(--green);background:#25332a}.choice:disabled{opacity:1}.choice:disabled:not(.selected){opacity:.45}.result{margin-top:22px;padding:22px;border:1px solid #bba06b;border-radius:4px;background:#28271e}.result.good{border-color:#7c9b77;background:#202d24}.result h3{font-size:1.1rem;margin-bottom:10px}.result p{line-height:1.7}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}.diagram{border:1px solid var(--line);background:#171e1b;border-radius:4px;padding:18px;margin:20px 0}.diagram .caption{color:var(--muted);font-size:.875rem;margin-top:12px}.diagram-row{display:grid;grid-template-columns:100px minmax(0,1fr);align-items:center;gap:14px;margin:10px 0}.diagram-row>span{font-size:.875rem}.bar-track{height:28px;background:#303a32;border-radius:3px;overflow:hidden}.bar{height:100%;background:var(--gold);color:#151b17;text-align:right;font-size:.875rem;font-weight:800;padding-right:8px;transition:width .4s}.bar.goal{background:var(--green)}.tone-scale{display:flex;gap:4px;margin-top:12px}.tone{height:46px;flex:1;display:flex;align-items:center;justify-content:center;border:2px solid transparent;font-weight:800;color:#fff;text-shadow:0 1px 4px #000}.tone.mark{outline:2px solid var(--gold);outline-offset:2px}.edge-diagram{height:100px;display:flex;gap:8px;align-items:flex-start;padding:0 20%;border-bottom:2px dashed var(--gold);margin-bottom:5px}.strand{flex:1;background:var(--gold);max-width:12px;height:100%}.fade-strip{display:flex;height:55px;color:#152017;text-align:center;align-items:stretch}.fade-strip span{display:flex;align-items:center;justify-content:center;flex:1}.mix-strip{display:flex;height:40px;color:#182218;font-weight:700;margin-top:10px}.mix-strip span{display:flex;align-items:center;justify-content:center;min-width:40px}.diagram-label{font-size:.875rem;color:var(--gold);margin-bottom:10px}.completion{max-width:820px;margin:0 auto}.completion h1{margin:16px 0 24px}.achievement{padding:28px;background:var(--panel);border:1px solid var(--line);margin:24px 0}.achievement h2{font-size:1.4rem;margin:12px 0}.achievement ul{padding-left:24px}.achievement li{margin:10px 0}.tag{font-size:.875rem;border:1px solid var(--line);border-radius:30px;padding:4px 12px;display:inline-block;color:var(--gold)}.footer{max-width:1152px;margin:0 auto;padding:20px 0 32px;border-top:1px solid var(--line);color:var(--muted);font-size:.875rem;display:flex;justify-content:space-between;gap:20px}.footer a{font-size:.875rem}.notice{max-width:1152px;margin:12px auto;padding:12px 20px;background:#473922}.notice[hidden]{display:none}dialog{background:#1c2520;color:var(--text);border:1px solid #64705f;border-radius:8px;padding:30px;max-width:620px;width:calc(100% - 32px);max-height:85vh;overflow:auto}dialog::backdrop{background:#050907cc}dialog h2{margin:8px 0 22px;font-size:1.8rem}dialog .tip{padding:16px;background:#2b3429;border-left:2px solid var(--gold);margin:20px 0}dialog form{margin-top:22px}dialog .btn{width:100%}.skills{display:grid;gap:14px}.skills article{padding:16px;border:1px solid var(--line);border-radius:4px}.skills h3{font-size:1.1rem;margin-bottom:8px}.skills p{font-size:.875rem}.hidden{display:none}
@media(max-width:900px){.topbar{padding:18px 24px}.shell{padding:28px 24px 40px}.intro{gap:30px;grid-template-columns:1fr 1fr}.route-body{padding:16px}.route h3{font-size:1.35rem}.workspace{grid-template-columns:210px minmax(0,1fr);gap:26px}.footer{margin:0 24px}.nav{gap:15px}.route-image{height:140px}}
@media(max-width:650px){.topbar{padding:14px 16px;gap:12px;flex-wrap:wrap}.brand{font-size:1rem;gap:8px}.brand i{font-size:1.7rem}.nav{gap:14px}.nav a,.wallet{font-size:.8rem}.nav .skills-link{display:none}.wallet{padding:4px 8px}.shell{padding:24px 16px 36px}.intro{grid-template-columns:1fr;gap:22px}.intro h1{font-size:2.35rem;margin:10px 0 14px}.dialogue{padding:16px 18px}.routes{grid-template-columns:1fr;gap:18px}.route{display:grid;grid-template-columns:105px minmax(0,1fr)}.route-image{height:100%;min-height:215px}.route-image img{object-position:60% center}.route-number{top:10px;left:10px}.route-body{padding:18px}.route h3{font-size:1.5rem}.route .route-desc{font-size:.95rem}.route button{padding:10px 12px}.route-body{gap:9px}.hub-bottom{flex-direction:column}.workspace{grid-template-columns:1fr;gap:24px}.sidebar h2,.route-portrait,.sidebar .eyebrow{display:none}.chapters{display:flex;gap:6px;margin:0}.chapter{flex:1;padding:8px 6px;justify-content:center;font-size:.8rem;gap:6px;align-items:flex-start}.chapter small{display:none}.chapter span:first-child{width:20px;height:20px;line-height:18px;font-size:.75rem}.help-open{margin-top:14px;padding:12px 16px}.help-open span{display:none}.scene h1{font-size:2rem}.brief{padding:16px}.quote{font-size:1.25rem}.journey-top{margin-bottom:20px}.footer{margin:0 16px;flex-wrap:wrap;gap:6px;padding-bottom:20px}.choices{gap:10px}.choice{padding:14px;gap:12px}.result{padding:18px}.actions>.btn{flex:1}.sectionline{align-items:flex-start}.sectionline>.small{max-width:120px;text-align:right}.diagram-row{grid-template-columns:76px minmax(0,1fr);gap:10px}.achievement{padding:20px}.nav .salon-link{display:none}dialog{padding:22px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.dialogue summary{cursor:pointer;color:var(--gold);font-size:1rem}.dialogue[open] summary{margin-bottom:18px}.dialogue .speaker{display:block;margin-top:14px}
@media(max-width:650px){.intro{gap:16px;margin-bottom:24px}.intro h1{font-size:2rem}.intro .muted{font-size:1rem}.dialogue{padding:12px 16px}.sectionline{margin-top:20px}}

@media(max-width:650px){.chapter:not(.active) span:nth-child(2){display:none}.chapter.active{flex:3}.chapter{align-items:center}.chapter span:first-child{flex-shrink:0}}
