*{box-sizing:border-box}
:root{--line:#7a9c90;--character:#78add4;--npc:#df967b;--gold:#e7c089;--muted:#bbc8c4}body{margin:0;min-height:100vh;font-family:"Segoe UI",system-ui,sans-serif;background:radial-gradient(circle at top,#29413c,#111b1a 62%);color:#f4eee3}main{width:min(1180px,calc(100% - 28px));margin:38px auto 70px}.hero{text-align:center;max-width:880px;margin:0 auto 25px}.eyebrow,.step{color:var(--gold);font-weight:800;letter-spacing:.14em;font-size:.75rem;text-transform:uppercase}.hero h1{font-size:clamp(2rem,5vw,3.6rem);line-height:1;text-transform:uppercase;margin:.25rem 0}.hero p{color:var(--muted);line-height:1.5}.hero a,.note a{color:#b3e6d3}.legend{display:flex;justify-content:center;gap:25px;flex-wrap:wrap;color:var(--muted);margin-bottom:26px}.legend b{display:inline-block;width:13px;height:13px;margin-right:7px;border-radius:50%;background:var(--gold)}.legend .char{background:var(--character)}.legend .npc{background:var(--npc)}.flow{display:grid;justify-items:center}.node{width:100%;min-width:0;max-width:810px;padding:17px 21px;border:1px solid #4e7167;border-left:6px solid var(--gold);border-radius:10px;background:#202d2b;box-shadow:0 11px 20px #0004}.node h2,.node h3{margin:4px 0 7px;line-height:1.2}.node h2{font-size:1.2rem}.node h3{font-size:1.06rem}.node p,.node li{color:var(--muted);line-height:1.47}.node p{margin:4px 0}.node ul{padding-left:20px;margin:5px 0}.node li+li{margin-top:5px}.node strong{color:#f4eee3}.node.character{border-left-color:var(--character)}.node.npc{border-left-color:var(--npc)}.node.decision{border:2px solid var(--gold);background:#393629;text-align:center}.node.start,.node.finish{text-align:center}.arrow{height:32px;width:2px;background:var(--gold);position:relative}.arrow:after{content:"";position:absolute;bottom:-8px;left:-5px;border:6px solid transparent;border-top-color:var(--gold)}.branches{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:38px 0 20px}.branch{border:1px solid #48665b;background:#15211f;padding:20px;border-radius:11px;display:grid;align-content:start;gap:12px}.branch>h2{font-size:.89rem;letter-spacing:.12em;color:var(--gold);margin:0;text-transform:uppercase}.branch .node{box-shadow:none;min-width:0;max-width:100%}.merge{font-size:.8rem;letter-spacing:.1em;color:var(--gold);text-align:center;text-transform:uppercase;margin:1px 0}.phase{width:100%;max-width:930px;margin:18px 0 10px;padding:13px 18px;border-top:1px solid #6b8c7c;border-bottom:1px solid #6b8c7c;color:var(--gold);font-size:.86rem;letter-spacing:.1em;font-weight:800;text-align:center}.note{max-width:930px;margin:25px auto 0;padding:17px 21px;border:1px dashed #9db2a7;border-radius:8px;background:#1c2b27;color:var(--muted);line-height:1.5}.note h2{margin:0;color:var(--gold);font-size:1.05rem}.note p{margin:.4rem 0}@media(max-width:780px){.branches{grid-template-columns:1fr;gap:18px}.branch{padding:14px}main{width:min(100% - 18px,1180px)}}