@import url('./components.css');
/* Candidate presentation adapter over the real Creator. Rules and controls stay in creator.js. */
body.creator-walkthrough{--bg:#0b1116;--panel:#121c23;--surface:#121c23;--line:#314955;--border:#314955;--text:#ecf3f4;--muted:#adbdc7;--accent:#87dddb;--orange:#87dddb;--cyan:#87dddb;background:var(--bg);font:14px/1.6 var(--vf-body-font)}
body.creator-walkthrough>header{padding:16px 28px;min-height:72px;gap:18px;background:#0e171e;border-color:var(--line)}
.creator-walkthrough>header b{font-size:15px;font-weight:500}.creator-walkthrough>header small{font-size:9px;letter-spacing:.18em;color:var(--cyan)}
.creator-walkthrough>header a{color:var(--muted);font-size:12px}.creator-walkthrough #autosave-status{font-size:11px;margin-left:0;color:var(--cyan)}.creator-walkthrough #progress{color:var(--text);font-size:12px}
.walk-intro{position:relative;max-width:1300px;margin:24px auto 0;padding:22px 30px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:linear-gradient(90deg,#12232af5 10%,#0b1727ac 63%,#10202a25),url('../assets/home/adventures.png') right 47%/cover}
.walk-intro>p{max-width:65ch;margin:5px 0;font-size:12px;color:#c0d4da}.walk-intro strong{font-size:16px;font-weight:600;color:var(--text)}.walk-intro span{display:inline-block;color:var(--cyan);font-size:9px;letter-spacing:.14em;margin-bottom:7px}
body.creator-walkthrough>main{max-width:1356px;padding:22px 28px 40px;display:grid;grid-template-columns:215px minmax(0,1fr);gap:0 22px;align-items:start}
.creator-walkthrough #steps{grid-column:1;grid-row:1 / span 2;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;background:#0e1921;padding:8px;position:sticky;top:16px;max-height:calc(100dvh - 32px);overflow:auto;gap:3px}
.creator-walkthrough #steps button{display:flex;align-items:center;gap:11px;padding:10px 9px;min-height:40px;border:1px solid transparent;background:none;color:var(--muted);font-size:11px;text-align:left;line-height:1.35;border-radius:6px;flex-shrink:0;width:100%}
.creator-walkthrough #steps button>span:first-child{display:grid;place-items:center;width:22px;height:22px;border-radius:5px;border:1px solid #3c5561;flex-shrink:0;color:#9ebbc6;font-size:10px}
.creator-walkthrough #steps button.active{background:#1b343e;border-color:#3c6670;color:#e3f7f5;box-shadow:inset 2px 0 var(--cyan)}.creator-walkthrough #steps button.active>span:first-child{background:var(--cyan);color:#0d2229;border-color:var(--cyan)}.creator-walkthrough #steps button.done{color:#c1d5d9}
.creator-walkthrough #panel{grid-column:2;grid-row:1;border:1px solid var(--line);border-radius:12px 12px 0 0;padding:30px;min-width:0;min-height:410px;background:linear-gradient(140deg,#172630,#101c24)}
.creator-walkthrough #panel h1{font:600 32px/1.15 var(--vf-body-font);letter-spacing:-.035em;margin:0 0 14px}.creator-walkthrough #panel h2{font:600 20px/1.3 var(--vf-body-font)}.creator-walkthrough #panel>p{max-width:76ch}.creator-walkthrough #panel :is(input,select,textarea){border-radius:7px;border-color:#496370;background:#0e1a22;font-size:14px}.creator-walkthrough #panel :is(input[type=radio],input[type=checkbox]){accent-color:var(--cyan)}.creator-walkthrough #panel label{line-height:1.55}.creator-walkthrough #panel .choice-grid>label{padding:15px;background:#152933;border-color:var(--line)}
.creator-walkthrough #panel :is(fieldset,.ready,.issues,.generation-summary){border-radius:8px}.creator-walkthrough #panel button{min-height:40px;font-size:12px}.creator-walkthrough #panel details{margin-top:16px}.creator-walkthrough #panel summary{cursor:pointer;color:var(--cyan)}
.creator-walkthrough main>footer{grid-column:2;grid-row:2;position:sticky;bottom:0;z-index:5;margin:0;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:18px 22px;border:1px solid var(--line);border-top:1px solid #42606a;border-radius:0 0 12px 12px;background:#11202bee;backdrop-filter:blur(16px)}
.creator-walkthrough main>footer button{font-size:12px;min-height:44px;border-radius:7px}.creator-walkthrough #next{margin-left:auto;background:var(--cyan);border-color:var(--cyan);color:#0b2027;font-weight:650;min-width:125px}.creator-walkthrough #next:hover{background:#b1f0eb;box-shadow:0 4px 22px #87dddb25}.creator-walkthrough #save-later{color:#c0d4dc;background:transparent}
.creator-walkthrough :is(button,a,input,select,textarea,summary):focus-visible{outline:2px solid var(--cyan);outline-offset:3px}.creator-walkthrough button{transition:background .15s,border-color .15s,box-shadow .15s}.creator-walkthrough #toast{z-index:20}
@media(max-width:1380px){.walk-intro{margin:22px 28px 0}}
@media(max-width:800px){body.creator-walkthrough>main{grid-template-columns:1fr;padding:16px}.walk-intro{margin:16px 16px 0;padding:20px}.creator-walkthrough #steps{grid-column:1;grid-row:1;position:static;display:flex;flex-direction:row;overflow:auto;max-width:100%;margin-bottom:14px}.creator-walkthrough #steps button{width:160px;min-width:160px}.creator-walkthrough #panel{grid-column:1;grid-row:2;padding:22px}.creator-walkthrough main>footer{grid-column:1;grid-row:3;padding:14px}.creator-walkthrough>header{flex-wrap:wrap}.creator-walkthrough>header div{order:-1;width:100%}.creator-walkthrough #save-later{max-width:155px}.creator-walkthrough #next{min-width:90px}}
@media(prefers-reduced-motion:reduce){.creator-walkthrough *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.creator-walkthrough #steps{max-height:max(260px,calc(100dvh - 300px))}
@media(min-width:801px){.creator-walkthrough #steps{max-height:max(260px,calc(100dvh - 300px))}}

/* Walkthrough revision: one coherent midnight/cyan surface, compact help. */
body.creator-walkthrough{background:radial-gradient(ellipse at 80% 0,#18364a66,transparent 48%),#080e17;--cyan:#7fe7ed;--accent:#7fe7ed;--orange:#7fe7ed;--muted:#a9bfce}
.creator-walkthrough .walk-intro{min-height:160px;border-color:#375367;background-position:right 45%;box-shadow:0 15px 50px #0005}
.creator-walkthrough #panel{background:linear-gradient(145deg,#152333f5,#0c1725);border-color:#344b60;box-shadow:0 18px 50px #0003}
.creator-walkthrough #panel>:is(.ohp-evaluation,.creation-discovery){--ohp-accent:#7fe7ed;--ohp-ink:#e5f1f8;margin:20px 0;background:#101e2e;border:1px solid #354d63;border-radius:12px;overflow:hidden}
.creator-walkthrough #panel :is(.ohp-file-header,.ohp-subject,.ohp-question,.ohp-chapter,.ohp-open,.ohp-body,.ohp-answers label){background:#122337;border-color:#344d65;color:#dbeaf4}
.creator-walkthrough #panel .ohp-evaluation :is(p,label,small){color:#adc4d6}
.creator-walkthrough #panel .ohp-evaluation :is(button,summary){color:#b2eff3;border-color:#41677b;background:#142b3d}
.creator-walkthrough #panel .ohp-evaluation .ohp-file-header{background:linear-gradient(110deg,#153046,#142235)}
.creator-walkthrough #panel .walk-help{margin:0 0 24px;border:1px solid #3a5267;border-radius:9px;background:#132335}
.creator-walkthrough .walk-help>summary{padding:13px 18px;list-style-position:inside;font-size:13px}
.creator-walkthrough #panel .creation-guide{border:0;background:transparent;padding:16px 20px;margin:0}
.creator-walkthrough .guide-top small{color:#9fbfd6}.creator-walkthrough .guide-copy p{color:#bed0df}
.creator-walkthrough .lineage-browser{padding:20px;background:#0b1726;border:1px solid #344d65;border-radius:12px}
.creator-walkthrough .lineage-browser-heading p{color:#a9bfd2;font-size:13px}
.creator-walkthrough .lineage-browser-heading :is(small,b),.creator-walkthrough .lineage-card>b{color:#80e3ee}
.creator-walkthrough .lineage-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:650px;gap:12px;scrollbar-color:#48687f #101d2b}
.creator-walkthrough #panel .lineage-card{position:relative;min-width:0;min-height:240px;border:1px solid #385168;border-radius:12px;background:linear-gradient(135deg,#1a2e43,#111f30);padding:20px;gap:12px;align-content:start}
.creator-walkthrough #panel .lineage-card:hover{transform:translateY(-2px);border-color:#77d5e8;box-shadow:0 8px 25px #0004}
.creator-walkthrough #panel .lineage-card.selected{border-color:#81e9ef;background:linear-gradient(135deg,#1b3b4c,#152b42);box-shadow:inset 3px 0 #81e9ef}
.creator-walkthrough .lineage-card strong{font-size:20px;letter-spacing:-.02em}.creator-walkthrough .lineage-card span small{color:#9bb9ce}
.creator-walkthrough .lineage-card-description{font-size:16px;line-height:1.6;color:#cfdfeb;margin:0;display:block;overflow:visible}
.creator-walkthrough .lineage-player-intro{background:#102437;border-color:#69cfdf;gap:.4rem;overflow-wrap:anywhere}
.creator-walkthrough .lineage-player-intro p{font-size:16px;line-height:1.6;margin:0 0 .8rem}
.creator-walkthrough .lineage-cost-lines{border-top:1px solid #385168;padding-top:10px;opacity:.88}.creator-walkthrough .lineage-cost-lines small{font-size:11px;color:#aac0cf}.creator-walkthrough .lineage-cost-lines b{color:#82c3d7}
.creator-walkthrough #panel .lineage-nutshell{border:1px solid #4e798d;border-radius:10px;background:linear-gradient(120deg,#183348,#142638);padding:22px;margin:16px 0}
.creator-walkthrough .lineage-nutshell :is(small,h4){color:#9adce9}.creator-walkthrough .lineage-nutshell p{color:#d3e2ee}.creator-walkthrough .lineage-nutshell h4{margin:16px 0 0}
.creator-walkthrough #panel :is(.choices button,.talent-grid button,.gift-choice,.power-choice,.ready,.super-row){background:#112235;border-color:#38576e;border-radius:10px}
.creator-walkthrough #panel :is(.choices button.selected,.talent-grid button.selected,button[aria-pressed="true"]){background:#193c4b;border-color:#7fe7ed;color:#e7fcff;box-shadow:inset 0 0 0 1px #7fe7ed}
.creator-walkthrough #panel .issues{background:#30242b;border-color:#c8917e;color:#f5d3c8}
.creator-walkthrough #panel .super-row>legend{font-size:18px;font-weight:600;letter-spacing:-.02em}
.creator-walkthrough #panel .super-row{padding:24px;gap:18px}.creator-walkthrough .access-path-explanation{color:#b5ccdc}
.creator-walkthrough #panel>h1{animation:creator-arrive .35s ease-out both}
@keyframes creator-arrive{from{opacity:.3;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(max-width:800px){.creator-walkthrough .lineage-card-grid{grid-template-columns:1fr;max-height:none}.creator-walkthrough .walk-intro{min-height:140px}.creator-walkthrough #panel .super-row{padding:16px}.creator-walkthrough .lineage-browser{padding:14px}}