.gates{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(20px,3vw,40px);align-items:start}.career{position:relative;border-radius:28px;background:linear-gradient(180deg,color-mix(in srgb,var(--purple) 14%,var(--surface)),var(--surface));box-shadow:inset 0 0 0 1px var(--line),var(--shadow);padding:20px}.career svg{width:100%;height:auto;display:block}.career .node{fill:var(--surface);stroke:var(--line-strong);stroke-width:3;transition:fill .4s,stroke .4s}.career .node.on{fill:var(--purple);stroke:var(--purple)}.career .node.gate{stroke:var(--yellow);stroke-width:4}.career text{font-family:var(--font);font-weight:900;font-size:15px;fill:var(--ink)}.career .lbl{font-weight:700;font-size:12px;fill:var(--muted);letter-spacing:.1em}.career .tokn{fill:var(--red);stroke:#fff;stroke-width:4;transition:transform .7s var(--ease-spring)}.meters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.meter{padding:12px 14px;border-radius:16px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);display:grid;gap:6px}.meter span{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.meter b{font-size:24px;font-weight:900;font-variant-numeric:tabular-nums}.scale{display:flex;gap:4px;align-items:end;height:34px}.scale i{flex:1;border-radius:4px;background:var(--line)}.scale i.on{background:var(--yellow)}.scenario{display:grid;gap:16px}.scenario .stage-tag{display:inline-flex;gap:8px;align-items:center;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--purple-ink)}.scenario h3{font-weight:900;font-size:clamp(22px,2.4vw,32px);line-height:1.2}.buddy{display:grid;grid-template-columns:54px 1fr;gap:12px;align-items:center;padding:12px;border-radius:18px;background:color-mix(in srgb,var(--yellow) 18%,var(--surface))}.buddy .b{width:54px;height:54px;border-radius:18px;background:var(--yellow);position:relative}.buddy .b:before,.buddy .b:after{content:"";position:absolute;top:20px;width:8px;height:8px;border-radius:50%;background:#111}.buddy .b:before{left:15px}.buddy .b:after{right:15px}.choices{display:grid;gap:10px}.choice{font:inherit;text-align:left;display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:center;min-height:60px;padding:12px 16px;border-radius:18px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;transition:transform .25s var(--ease-spring),border-color .2s,background-color .3s}.choice:hover{border-color:var(--purple);transform:translate(4px)}.choice .k{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:900;background:var(--bg-2)}.choice.best{background:color-mix(in srgb,var(--green) 20%,var(--surface));border-color:var(--green)}.choice.ok{background:color-mix(in srgb,var(--cyan) 14%,var(--surface));border-color:var(--cyan)}.choice.weak{background:color-mix(in srgb,var(--yellow) 18%,var(--surface));border-color:var(--yellow)}.choice.back{background:color-mix(in srgb,var(--red) 16%,var(--surface));border-color:var(--red)}.choice:disabled{cursor:default;transform:none}.feedback{min-height:52px;font-weight:700}.comp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.comp .panel{display:grid;gap:8px;align-content:start}.comp .ci{width:48px;height:48px;border-radius:14px;background:var(--purple);color:#fff;display:grid;place-items:center;font-weight:900}@media (max-width: 900px){.gates{grid-template-columns:minmax(0,1fr)}.comp{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 560px){.comp{grid-template-columns:minmax(0,1fr)}}
