:root { --ink:#10161a; --panel:#171f1b; --panel-2:#1c2620; --paper:#ede6d6; --text:#f5efdf; --sage:#8fa396; --sage-dark:#5b6b62; --brick:#b5502f; --gold:#c9a227; --success:#6fa287; --line:#2a342e; --red:#d16b55; }
* { box-sizing:border-box; }
html { background:var(--ink); }
body { margin:0; min-width:320px; color:var(--text); background:radial-gradient(ellipse at 72% -15%, #26382d 0, var(--ink) 42rem); font-family:Georgia, "Times New Roman", serif; line-height:1.5; }
a { color:var(--gold); text-underline-offset:3px; }
button, input { font:inherit; }
.shell { width:min(100% - 2rem, 1060px); margin-inline:auto; }
.site-header { border-bottom:1px solid var(--line); background:rgba(16,22,26,.9); backdrop-filter:blur(12px); position:sticky; top:0; z-index:10; }
.nav-wrap { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.wordmark { color:var(--paper); text-decoration:none; letter-spacing:-1.5px; font-size:1.5rem; font-weight:bold; white-space:nowrap; }
.wordmark span { color:var(--gold); }.wordmark small { color:var(--sage); font-size:.65rem; letter-spacing:0; }
nav { display:flex; align-items:center; gap:12px; font:600 .78rem/1 ui-monospace,Consolas,monospace; text-transform:uppercase; letter-spacing:.04em; }
nav a { color:var(--sage); text-decoration:none; } nav a:hover { color:var(--paper); }.nav-cta { color:var(--ink); background:var(--gold); padding:7px 9px; }.inline-form { display:inline; }.nav-button { border:0; background:transparent; padding:0; color:var(--sage); cursor:pointer; font:inherit; text-transform:inherit; }.nav-button:hover { color:var(--paper); }
main { min-height:calc(100vh - 130px); padding-block:2.4rem 3rem; }.site-footer { border-top:1px solid var(--line); padding-block:1rem 2rem; color:var(--sage-dark); font: .73rem ui-monospace,Consolas,monospace; }
.flash { padding:12px 14px; margin-bottom:20px; font: .85rem ui-monospace,Consolas,monospace; border-left:3px solid; }.flash-error { background:#321e19; border-color:var(--red); }.flash-success { background:#1e3025; border-color:var(--success); }
.eyebrow { margin:0 0 .55rem; color:var(--gold); font:700 .75rem ui-monospace,Consolas,monospace; letter-spacing:.12em; text-transform:uppercase; }.hero { padding:clamp(2.5rem,8vw,6.8rem) 0 4rem; max-width:740px; }.hero h1,.page-heading h1,.auth-card h1 { margin:0; font-size:clamp(2.7rem,9vw,6.5rem); line-height:.93; letter-spacing:-.065em; }.hero h1 em { color:var(--gold); font-weight:normal; }.hero-copy { max-width:560px; color:var(--sage); margin:1.5rem 0 2rem; font-size:1.1rem; }.hero-actions,.result-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:18px; border:0; padding:13px 17px; text-decoration:none; cursor:pointer; font:700 .83rem ui-monospace,Consolas,monospace; letter-spacing:.04em; text-transform:uppercase; transition:transform .15s,background .15s; }.button:hover { transform:translateY(-2px); }.button-primary { background:var(--brick); color:var(--paper); }.button-primary:hover { background:#9c4327; }.button-quiet { color:var(--sage); border:1px solid var(--sage-dark); }.button-quiet:hover { color:var(--paper); border-color:var(--sage); }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }.feature-grid article { min-height:205px; padding:1.5rem 1.2rem 1.5rem 0; border-bottom:1px solid var(--line); }.feature-grid article+article { border-left:1px solid var(--line); padding-left:1.2rem; }.feature-num { color:var(--brick); font:700 .75rem ui-monospace,Consolas,monospace; }.feature-grid h2,.model-note h2,.explanation h2,.category-section h2 { font-size:1.25rem; margin:.7rem 0; }.feature-grid p,.model-note p { color:var(--sage); margin:0; font-size:.96rem; }.model-note { margin-top:3.8rem; max-width:720px; border-left:3px solid var(--gold); padding:3px 0 3px 18px; }
.page-heading { margin-bottom:1.8rem; }.page-heading h1 { font-size:clamp(2.5rem,7vw,4.4rem); }.page-heading > p:last-child { margin:1rem 0 0; color:var(--sage); }.trainer-heading { display:flex; flex-direction:column; }.trainer-heading .eyebrow { order:-1; }
.scenario-panel { background:var(--panel); padding:clamp(1rem,4vw,1.6rem); border:1px solid var(--line); }.stage-badge { color:var(--gold); font:700 .75rem ui-monospace,Consolas,monospace; letter-spacing:.08em; }.card-groups { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:1rem 0 1.3rem; }.card-group > p { color:var(--sage); margin:0 0 7px; font: .7rem ui-monospace,Consolas,monospace; }.cards { display:flex; gap:6px; flex-wrap:wrap; }.card { display:inline-flex; align-items:center; justify-content:center; flex-direction:column; width:45px; height:59px; background:var(--paper); color:#1b2420; border-radius:3px; font:700 1.2rem/1 ui-monospace,Consolas,monospace; box-shadow:0 2px 0 #bcb5a8; }.card b { font-size:.9rem; }.card.red { color:var(--brick); }.money-grid,.explanation-grid,.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); background:var(--panel-2); }.money-grid > div,.explanation-grid > div,.stat-grid > div { padding:12px; min-width:0; }.money-grid span,.explanation-grid span,.stat-grid span { display:block; color:var(--sage); font:.65rem ui-monospace,Consolas,monospace; text-transform:uppercase; }.money-grid strong,.explanation-grid strong,.stat-grid strong { display:block; font:700 .98rem ui-monospace,Consolas,monospace; margin-top:3px; }
.answer-form { max-width:760px; margin:1.8rem auto 0; }.fields-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px; }.answer-form label,.auth-card label { color:var(--sage); display:block; font: .78rem ui-monospace,Consolas,monospace; }.field-hint { color:var(--sage-dark); }.answer-form input,.auth-card input { width:100%; color:var(--paper); background:var(--panel-2); border:1px solid var(--line); border-radius:0; outline:0; margin-top:6px; padding:12px; font:1rem ui-monospace,Consolas,monospace; }.answer-form input:focus,.auth-card input:focus { border-color:var(--gold); }.decision-field { border:0; padding:0; margin:1.2rem 0; }.decision-field legend { color:var(--sage); font:.78rem ui-monospace,Consolas,monospace; margin-bottom:7px; }.decision-buttons { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.decision { color:var(--sage); background:var(--panel-2); border:1px solid var(--line); padding:13px; cursor:pointer; font:700 1rem ui-monospace,Consolas,monospace; }.decision.selected { color:var(--ink); background:var(--gold); border-color:var(--gold); }.submit { width:100%; }.formula-sheet { margin:1rem auto; max-width:760px; border:1px solid var(--line); color:var(--sage); font:.85rem ui-monospace,Consolas,monospace; }.formula-sheet summary { padding:11px; cursor:pointer; color:var(--paper); }.formula-sheet div { padding:0 11px 8px; }.formula-sheet p { margin:.35rem 0; }
.result-heading { text-align:center; }.result-table-wrap { overflow:auto; border:1px solid var(--line); }.result-table { width:100%; min-width:590px; border-collapse:collapse; background:var(--panel); font:.85rem ui-monospace,Consolas,monospace; }.result-table th,.result-table td { padding:14px; text-align:left; border-bottom:1px solid var(--line); }.result-table th { color:var(--sage); font-weight:normal; }.result-table thead th { color:var(--paper); background:var(--panel-2); font-size:.72rem; text-transform:uppercase; }.status { display:inline-block; padding:3px 7px; font-size:.72rem; font-weight:bold; }.status-good { background:#213a2a; color:#a9d8b8; }.status-bad { background:#3c231e; color:#eea18c; }.explanation { background:var(--panel); margin-top:1.5rem; padding:clamp(1rem,4vw,1.6rem); }.explanation h2 { margin-top:0; }.decision-line { color:var(--gold); }.explanation-grid { grid-template-columns:repeat(3,1fr); }.caution { margin:1.2rem 0 0; color:var(--sage); font-size:.85rem; }.result-actions { margin-top:1.4rem; justify-content:center; }
.auth-card { width:min(100%,470px); margin:clamp(1rem,7vw,4rem) auto; background:var(--panel); padding:clamp(1.3rem,6vw,2.5rem); border:1px solid var(--line); }.auth-card h1 { font-size:3rem; }.auth-card > p { color:var(--sage); }.auth-card form { display:grid; gap:15px; margin-top:1.5rem; }.auth-card form .button { margin-top:4px; }.auth-card > p:last-child { margin:1.5rem 0 0; font-size:.9rem; }
.history-list { border-top:1px solid var(--line); }.history-row { color:var(--paper); text-decoration:none; display:flex; justify-content:space-between; align-items:center; gap:15px; padding:15px 0; border-bottom:1px solid var(--line); }.history-row:hover { background:var(--panel); }.history-row strong,.history-row span { display:block; }.history-row div:last-child { display:flex; align-items:center; gap:12px; }.history-row div:first-child span { color:var(--sage); font:.75rem ui-monospace,Consolas,monospace; margin-top:2px; }.score-chip { color:var(--gold); font:700 .8rem ui-monospace,Consolas,monospace; }.history-decision { color:var(--sage); font:.75rem ui-monospace,Consolas,monospace; }.empty-state { background:var(--panel); padding:2rem; }.empty-state p { color:var(--sage); }
.stat-grid { grid-template-columns:repeat(5,1fr); }.stat-grid > div { border-right:1px solid var(--line); }.stat-grid strong { color:var(--gold); font-size:1.55rem; }.category-section { margin-top:2rem; }.category-list { border-top:1px solid var(--line); }.category-row { display:grid; grid-template-columns:minmax(150px,1fr) minmax(100px,2fr) 48px; align-items:center; gap:15px; padding:12px 0; border-bottom:1px solid var(--line); }.category-row span { display:block; color:var(--sage); font:.72rem ui-monospace,Consolas,monospace; }.category-row > strong { text-align:right; color:var(--gold); font:.85rem ui-monospace,Consolas,monospace; }.meter { height:7px; background:var(--panel-2); }.meter i { display:block; height:100%; background:var(--success); }
@media (max-width:700px) { .shell { width:min(100% - 1.2rem,1060px); } main { padding-top:1.5rem; }.nav-wrap { min-height:57px; }.wordmark { font-size:1.3rem; } nav { gap:9px; font-size:.68rem; }.nav-cta { padding:6px; }.feature-grid { grid-template-columns:1fr; }.feature-grid article,.feature-grid article+article { min-height:auto; padding:1.2rem 0; border-left:0; }.card-groups { gap:12px; }.money-grid { grid-template-columns:1fr 1fr; }.money-grid > div { border-bottom:1px solid var(--line); }.fields-grid { grid-template-columns:1fr; }.explanation-grid { grid-template-columns:1fr 1fr; }.explanation-grid > div { border-bottom:1px solid var(--line); }.stat-grid { grid-template-columns:1fr 1fr; }.stat-grid > div { border-bottom:1px solid var(--line); }.stat-grid > div:last-child { grid-column:span 2; }.category-row { grid-template-columns:minmax(110px,1fr) minmax(70px,1.2fr) 42px; gap:9px; }.site-footer { font-size:.65rem; } }