:root { --buzz: #FFD400; }
html { scroll-behavior: smooth; }
body { background: #050505; }
.grid-bg {
  background-image: linear-gradient(rgba(255,212,0,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,212,0,.06) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: radial-gradient(ellipse at 30% 20%, black 30%, transparent 75%);
}
.nav-btn {
  display: flex; align-items: center; gap: .5rem; width: 100%;
  padding: .6rem .8rem; border-radius: .6rem; color: #d4d4d8;
  border: 1px solid transparent; font-weight: 500;
}
.nav-btn:hover { background: #161616; color: #fff; }
.nav-btn.active { background: #161616; border-color: rgba(255,212,0,.4); color: var(--buzz); }
.kpi { background: #101010; border: 1px solid #27272a; border-radius: .9rem; padding: 1rem 1.2rem; }
.kpi-num { font-family: "Space Grotesk", sans-serif; font-size: 1.8rem; font-weight: 700; }
.kpi-label { font-size: 11px; color: #a1a1aa; text-transform: uppercase; letter-spacing: .08em; margin-top: 2px; }
.how { background: #101010; border: 1px solid #27272a; border-radius: .9rem; padding: 1rem; color: #a1a1aa; }
.how strong { display: block; color: #fff; margin: .3rem 0; }
.how span { font-size: 1.3rem; }
.track-card { background: #101010; border: 1px solid #27272a; border-radius: 1rem; padding: 1.25rem; transition: .15s; }
.track-card:hover { border-color: rgba(255,212,0,.6); box-shadow: 0 0 24px rgba(255,212,0,.18); transform: translateY(-2px); }
.track-icon { display: inline-flex; width: 30px; height: 30px; color: var(--buzz); flex-shrink: 0; }
.track-icon.lg { width: 34px; height: 34px; }
.track-icon svg { width: 100%; height: 100%; }
.nav-ico { display: inline-flex; width: 16px; justify-content: center; color: var(--buzz); font-family: "JetBrains Mono", monospace; }
.res-ico { display: inline-flex; width: 26px; height: 26px; align-items: center; justify-content: center; border: 1px solid #3f3f46; border-radius: 7px; font-size: 13px; color: var(--buzz); flex-shrink: 0; }
.res-ico.done { background: var(--buzz); color: #000; border-color: var(--buzz); font-weight: 700; }
.chip { font-size: 10px; font-family: "JetBrains Mono", monospace; border: 1px solid #3f3f46; color: #d4d4d8; padding: 2px 8px; border-radius: 999px; }
.chip-hot { border-color: rgba(255,212,0,.6); color: var(--buzz); }
.phase-btn { width: 100%; text-align: left; background: #0a0a0a; border: 1px solid #27272a; border-radius: .7rem; padding: .8rem 1rem; display: flex; gap: .8rem; align-items: center; }
.phase-btn:hover { border-color: var(--buzz); }
.res-row { display: flex; align-items: center; gap: .7rem; background: #0a0a0a; border: 1px solid #27272a; border-radius: .7rem; padding: .7rem .9rem; }
.res-row:hover { border-color: rgba(255,212,0,.5); }
.fchip { font-size: 11px; font-family: "JetBrains Mono", monospace; border: 1px solid #3f3f46; color: #d4d4d8; padding: 5px 12px; border-radius: 999px; background: #0a0a0a; }
.fchip:hover { border-color: var(--buzz); color: var(--buzz); }
.fchip.active { background: var(--buzz); color: #000; border-color: var(--buzz); font-weight: 700; }
select.fchip option { background: #000; }
.star { font-size: 18px; color: #71717a; padding: 2px 6px; border-radius: 8px; }
.star:hover { color: var(--buzz); }
.star.on { color: var(--buzz); }
.quiz-opt { display: flex; align-items: center; gap: .6rem; background: #101010; border: 1px solid #27272a; border-radius: .6rem; padding: .55rem .8rem; font-size: 13px; cursor: pointer; }
.quiz-opt:hover { border-color: rgba(255,212,0,.5); }
.modal-pop { animation: pop .18s ease-out; }
@keyframes pop { from { transform: scale(.96) translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
input[type="checkbox"].tick { width: 18px; height: 18px; accent-color: #FFD400; }
#sidebar.open { display: flex !important; position: fixed; top: 0; bottom: 0; left: 0; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #3f3f46; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: var(--buzz); }
:focus-visible { outline: 2px solid var(--buzz); outline-offset: 2px; }