/* today.css — standalone Today page brutalist-gold theme.
   Distinct from tools.css dark shell (uses --action:#e0b271 gold accent).
   Linked by today.html. */

@font-face{font-family:'Space Grotesk';font-weight:500 700;font-display:swap;src:url('./fonts/space-grotesk-latin.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-weight:400 700;font-display:swap;src:url('./fonts/jetbrains-mono-latin.woff2') format('woff2');}
@font-face{font-family:'Inter';font-weight:400 700;font-display:swap;src:url('./fonts/inter-400.woff2') format('woff2');}

:root{
  --bg:#08090c; --surface:#14161c; --navy:#eef2f8; --action:#e0b271; --slate:#eef2f8;
  --muted:#8893a3; --line:rgba(255,255,255,0.07); --ok:#36e07f;
  --cy:#e0b271; --cy-deep:#c9974f;
  --serif:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --sans:'Inter',-apple-system,system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}
*{box-sizing:border-box;}
html, body{max-width:100%; overflow-x:hidden;}
body{margin:0; background:var(--bg); color:var(--slate); font-family:var(--sans); line-height:1.5; -webkit-font-smoothing: antialiased;}
.wrap{width:100%; max-width:680px; margin:0 auto; padding:40px 24px 80px; overflow:hidden;}
h1{font-family:var(--serif); font-weight:800; color:var(--navy); font-size:clamp(2rem,6vw,3rem); margin:0 0 6px; letter-spacing:-0.02em;}
.sub{color:var(--muted); margin:0 0 28px; font-size:1.05rem; overflow-wrap:anywhere;}
.panel{background:var(--surface); border:1px solid var(--line); border-radius:0; padding:22px; box-shadow:none;}
.panel-mt{margin-top:16px}
.field{margin:0 0 16px;}
.field:last-child{margin-bottom:0;}
.field label{display:flex; justify-content:space-between; font-weight:700; color:var(--navy); margin:0 0 7px; font-size:.92rem; font-family:var(--mono); text-transform:uppercase; letter-spacing:0.05em;}
.field label span{color:var(--action); font-variant-numeric:tabular-nums;}
input[type=range]{-webkit-appearance:none; appearance:none; width:100%; height:8px; border-radius:0; background:rgba(255,255,255,0.07); outline:none;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:24px;height:24px;border-radius:0;background:var(--action);cursor:grab;}
input[type=range]:focus-visible{outline:2px solid var(--action); outline-offset:3px;}
.today-out{margin:28px 0 0; background:var(--surface); border:1px solid var(--line); border-radius:0; padding:clamp(24px,5vw,40px); color:#fff; position:relative;}
.today-out::before { content:""; position:absolute; left:-1px; top:-1px; bottom:-1px; width:4px; background:var(--action); opacity:0.8; }
.readiness-badge{display:flex; align-items:baseline; gap:10px; margin:0 0 14px;}
.readiness-badge span:first-child{font-family:var(--serif); font-weight:800; font-size:clamp(2.6rem,8vw,3.6rem); line-height:1; color:var(--action);}
.readiness-badge .of{color:var(--muted); font-size:.92rem; font-family:var(--mono); text-transform:uppercase;}
.today-line{font-size:clamp(1.15rem,2.4vw,1.4rem); line-height:1.5; margin:0; color:var(--navy); font-weight:600;}
.foot{color:var(--muted); font-size:.8rem; margin-top:26px; line-height:1.5;}
.foot a{color:var(--action);}

/* BRUTALIST TIMELINE & DISCLOSURE */
.summary-card {
  background: var(--surface); border: 2px solid var(--action); border-radius: 0; padding: 18px;
  margin-top: 20px; cursor: pointer; box-shadow: 4px 4px 0 var(--cy-deep); transition: transform 0.1s, box-shadow 0.1s;
}
.summary-card:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--cy-deep); }
.summary-card:active { transform: translate(4px, 4px); box-shadow: 0 0 0 var(--cy-deep); }
.summary-header { display: flex; justify-content: space-between; align-items: center; font-weight: 800; font-size: 1.1rem; color: var(--navy); font-family:var(--serif); }
.summary-pill { padding: 4px 8px; border-radius: 0; background: var(--action); color: #000; font-size: 0.8rem; font-family:var(--mono); font-weight:700; text-transform: uppercase; letter-spacing: 0.05em; }
.summary-drawer { display: none; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 0.95rem; color: var(--muted); }
.summary-drawer.open { display: block; }
@media (prefers-reduced-motion: no-preference) {
  .summary-drawer.open { animation: fadein 0.3s ease; }
}
@keyframes fadein { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }

/* AGFI learned-readiness card */
.learned-readiness{margin-top:22px; padding:18px; background:#0b0d11; border:1px solid var(--line); border-left:3px solid var(--action); border-radius:0;}
.lr-head{display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin:0 0 10px;}
.lr-title{font-family:var(--mono); font-weight:700; font-size:.82rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--navy);}
.lr-beta{font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:0.08em; color:#000; background:var(--action); padding:3px 7px; white-space:nowrap;}
.lr-score{display:flex; align-items:baseline; gap:9px;}
.lr-num{font-family:var(--serif); font-weight:800; font-size:clamp(2.2rem,6vw,2.8rem); line-height:1; color:var(--action);}
.lr-of{color:var(--muted); font-size:.82rem; font-family:var(--mono); text-transform:uppercase; letter-spacing:0.04em;}
.lr-label{font-family:var(--serif); font-weight:700; font-size:1.05rem; margin:6px 0 0; color:var(--action);}
.lr-range{font-family:var(--mono); font-size:.78rem; color:var(--muted); margin-top:7px; text-transform:uppercase; letter-spacing:0.04em; overflow-wrap:anywhere; white-space:normal;}
.lr-drivers{font-family:var(--mono); font-size:.8rem; color:var(--muted); margin-top:8px; text-transform:uppercase; letter-spacing:0.04em; overflow-wrap:anywhere; white-space:normal;}
.lr-note{color:var(--muted); font-size:.72rem; line-height:1.5; margin:12px 0 0; overflow-wrap:anywhere;}

/* AGFI next-load card */
.next-load{margin-top:18px; padding:18px; background:#0b0d11; border:1px solid var(--line); border-left:3px solid var(--ok); border-radius:0;}
.nl-head{display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin:0 0 10px;}
.nl-title{font-family:var(--mono); font-weight:700; font-size:.82rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--navy);}
.nl-beta{font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:0.08em; color:#000; background:var(--ok); padding:3px 7px; white-space:nowrap;}
.nl-score{display:flex; align-items:baseline; gap:9px;}
.nl-num{font-family:var(--serif); font-weight:800; font-size:clamp(2.2rem,6vw,2.8rem); line-height:1;}
.nl-of{color:var(--muted); font-size:.82rem; font-family:var(--mono); text-transform:uppercase; letter-spacing:0.04em;}
.nl-label{font-family:var(--serif); font-weight:700; font-size:1.05rem; margin:6px 0 0;}
.nl-range{font-family:var(--mono); font-size:.78rem; color:var(--muted); margin-top:7px; text-transform:uppercase; letter-spacing:0.04em; overflow-wrap:anywhere; white-space:normal;}
.nl-link{font-family:var(--mono); font-size:.8rem; color:var(--muted); margin-top:8px; text-transform:uppercase; letter-spacing:0.04em; overflow-wrap:anywhere; white-space:normal;}
.nl-note{color:var(--muted); font-size:.72rem; line-height:1.5; margin:12px 0 0; overflow-wrap:anywhere;}

/* Unified AGFI flywheel */
.agfi-frame{margin-top:18px; padding:18px; background:#0b0d11; border:1px solid var(--line); border-left:3px solid var(--action); border-radius:0;}
.agfi-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 12px;}
.agfi-title{font-family:var(--mono); font-weight:700; font-size:.82rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--navy);}
.agfi-beta{font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:0.08em; color:#000; background:var(--action); padding:3px 7px; white-space:nowrap;}
.fw-row{padding:12px 0; border-top:1px solid var(--line);}
.fw-row:first-child{border-top:0; padding-top:0;}
.fw-row-head{display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:6px;}
.fw-row-title{font-family:var(--mono); font-size:.76rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted);}
.fw-badge{font-family:var(--mono); font-size:.58rem; font-weight:700; letter-spacing:0.08em; padding:3px 6px; background:rgba(54,224,127,0.14); color:var(--ok);}
.fw-badge-pop{background:rgba(224,178,113,0.13); color:var(--action);}
.fw-badge-current{background:rgba(54,224,127,0.14); color:var(--ok);}
.fw-score{display:flex; align-items:baseline; gap:8px;}
.fw-num{font-family:var(--serif); font-weight:800; font-size:clamp(1.75rem,5vw,2.3rem); line-height:1; color:var(--action);}
.fw-unit,.fw-range,.fw-flywheel,.fw-support{font-family:var(--mono); font-size:.75rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.04em;}
.fw-label{font-family:var(--serif); font-size:1rem; font-weight:700; color:var(--navy); margin-top:4px;}
.fw-note{color:var(--muted); font-size:.72rem; line-height:1.5; margin:12px 0 0;}
.label-capture{margin-top:16px; padding-top:14px; border-top:1px solid var(--line);}
.label-capture .field{margin-bottom:12px;}
.label-title{font-family:var(--mono); font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--navy); margin-bottom:8px;}
.label-actions{display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.label-actions button{min-height:44px; border:1px solid var(--action); background:var(--action); color:#000; border-radius:0; padding:8px 14px; font-family:var(--mono); font-weight:700; font-size:.78rem; text-transform:uppercase; cursor:pointer;}
.label-actions button:focus-visible{outline:2px solid var(--action); outline-offset:3px;}
.label-status{margin:0; color:var(--muted); font-size:.75rem; line-height:1.45;}

/* Time-budget toggle */
.time-budget-toggle{margin-top:20px; display:flex; justify-content:space-between; align-items:center; background:#0b0d11; padding:12px; border-radius:0; border:1px solid var(--line);}
.tb-label{font-weight:700; font-size:0.9rem; color:var(--navy); font-family:var(--mono); text-transform:uppercase;}
.tb-btn-group{display:flex; gap:8px;}
.tb-btn{min-height:44px; padding:8px 14px; border-radius:0; border:1px solid var(--action); background:transparent; color:var(--action); font-weight:700; font-family:var(--mono); font-size:0.8rem; cursor:pointer; text-transform:uppercase;}
.tb-btn-active{border:1px solid transparent; background:var(--action); color:#000;}

/* Summary drawer rationale */
.rationale-header{margin-top:12px;font-family:var(--mono,'JetBrains Mono',monospace);font-size:0.85rem;color:var(--action);font-weight:600;letter-spacing:0.05em;}
.rationale-text{font-size:0.85rem;margin-bottom:0;color:var(--navy);}

@media (max-width: 480px) {
  .time-budget-toggle{align-items:flex-start !important; gap:12px; flex-wrap:wrap;}
  .time-budget-toggle > div{width:100%; flex-wrap:wrap;}
  .time-budget-toggle button{flex:1 1 130px; white-space:normal;}
}

/* --- UX ratchet 2026-07-22 (additive): reduced-motion guard + missing focus rings + label floors ---
   Guard is a byte-copy of the free_mode.css/consent.css pattern (this page had none). */
@media (prefers-reduced-motion:reduce){ *{transition:none!important; animation:none!important;} }
.tb-btn:focus-visible, .summary-card:focus-visible{outline:2px solid var(--action); outline-offset:3px;}
.lr-beta, .nl-beta, .agfi-beta{font-size:.7rem;}
.fw-badge{font-size:.7rem;}