:root{
    --cream:#E9F1FB;
    --cream2:#D9E6F7;
    --ink:#0A1A3D;
    --ink2:#16294f;
    --gold:#C9A227;
    --gold-dim:#9c7f22;
    --pitch:#0D2358;
    --pitch2:#173B82;
    --red:#c62839;
    --line:#00204d22;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--cream);
    color:var(--ink);
    font-family:'Georgia','Iowan Old Style',serif;
    min-height:100vh;
  }
  .wrap{max-width:1180px;margin:0 auto;padding:0 24px 60px;}
  header{
    display:flex;align-items:baseline;justify-content:space-between;
    padding:28px 24px 18px;border-bottom:3px solid var(--ink);
  }
  .brand{display:flex;align-items:baseline;gap:16px;}
  .brand h1{
    font-family:'Times New Roman',serif;
    font-weight:900;font-size:44px;letter-spacing:-1px;margin:0;
    color:var(--ink);
  }
  .brand small{font-size:13px;letter-spacing:2px;color:var(--gold-dim);}
  .status-strip{
    display:flex;gap:22px;font-size:13px;letter-spacing:1px;color:var(--ink2);
    align-items:center;
  }
  .status-strip b{color:var(--ink);}
 
  .banner{
    background:linear-gradient(90deg,var(--pitch),var(--pitch2));
    color:#fff;text-align:center;padding:12px;font-size:14px;
    letter-spacing:1px;font-weight:bold;
  }
 
  .layout{display:grid;grid-template-columns:340px 1fr 300px;gap:0;border:1px solid var(--line);margin-top:0;background:#fff;}
  @media (max-width:980px){.layout{grid-template-columns:1fr;}}
 
  .panel-left{padding:26px;border-right:2px solid var(--ink);}
  .panel-mid{padding:26px;border-right:2px solid var(--ink);background:var(--pitch);position:relative;}
  .panel-right{padding:22px 20px;}
 
  h2.section{font-size:12px;letter-spacing:2px;color:var(--gold-dim);margin:0 0 14px;text-transform:uppercase;border-bottom:1px solid var(--line);padding-bottom:8px;}
 
  .team-card{background:var(--ink);color:var(--cream);padding:18px 20px;margin-bottom:16px;}
  .team-card .tag{font-size:11px;letter-spacing:2px;color:var(--gold);}
  .team-card h3{margin:6px 0 2px;font-size:26px;}
  .team-card .year{color:#7fa8ff;font-weight:bold;font-size:15px;}
  .team-card .force{color:var(--gold);font-weight:bold;font-size:13px;margin-top:4px;}
 
  button{
    font-family:inherit;cursor:pointer;border:2px solid var(--ink);
    background:#fff;color:var(--ink);padding:12px 16px;font-size:14px;
    font-weight:bold;letter-spacing:0.5px;
  }
  button:hover:not(:disabled){background:var(--ink);color:var(--cream);}
  button:disabled{opacity:0.35;cursor:default;}
  button.primary{background:var(--ink);color:var(--cream);width:100%;}
  button.primary:hover{background:var(--pitch2);border-color:var(--pitch2);}
  button.ghost{background:transparent;}
 
  .roll-row{display:flex;gap:10px;margin-bottom:18px;}
  .roll-row button{flex:1;}
 
  .reroll-note{font-size:12px;color:var(--ink2);margin-bottom:14px;}
 
  .squad-list{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line);}
  .player-row{
    display:flex;justify-content:space-between;align-items:center;
    padding:11px 4px;border-bottom:1px solid var(--line);
    background:transparent;border-left:none;border-right:none;border-top:none;
    width:100%;text-align:left;font-size:15px;
  }
  .player-row .pname{display:flex;gap:10px;align-items:baseline;}
  .player-row .ppos{font-size:11px;color:var(--gold-dim);width:34px;letter-spacing:1px;}
  .player-row .prating{font-weight:900;font-size:18px;}
  .player-row.taken{opacity:0.3;}
  .player-row.icon99 .prating{color:var(--red);}
 
  .pitch-svg{width:100%;height:auto;display:block;}
  .slot-label{fill:var(--cream);font-size:11px;font-family:Georgia,serif;letter-spacing:1px;text-anchor:middle;}
  .slot-dot{fill:rgba(255,255,255,0.08);stroke:rgba(255,255,255,0.5);stroke-dasharray:3,3;}
  .slot-dot.filled{fill:var(--gold);stroke:var(--gold);stroke-dasharray:none;}
  .slot-name{fill:var(--cream);font-size:9px;text-anchor:middle;font-family:Georgia,serif;}
 
  .box-score-row{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px;}
  .box-score-row .pos{color:var(--gold-dim);font-weight:bold;width:36px;}
  .box-score-row .val{color:var(--ink2);}
  .box-score-row.filled .val{color:var(--ink);font-weight:bold;}
 
  .center-msg{color:var(--cream);text-align:center;padding:60px 20px;}
  .center-msg h3{font-size:22px;margin-bottom:10px;}
  .center-msg p{color:#c7d4f0;font-size:14px;line-height:1.5;}
 
  @keyframes spinpulse{0%{opacity:0.45;transform:scale(0.96);}50%{opacity:1;transform:scale(1.02);}100%{opacity:0.45;transform:scale(0.96);}}
  .spin-card h3{animation:spinpulse 0.28s ease-in-out infinite;color:var(--gold);}
  .spin-card p{color:#9fb6e6;letter-spacing:2px;font-size:12px;text-transform:uppercase;}
 
  .scoreboard{background:var(--ink);color:var(--cream);padding:22px;text-align:center;margin-bottom:18px;}
  .scoreboard .teams{display:flex;justify-content:space-between;align-items:center;font-size:16px;}
  .scoreboard .score{font-size:52px;font-weight:900;letter-spacing:4px;margin:6px 0;}
  .scoreboard .clock{font-size:16px;letter-spacing:3px;color:var(--gold);font-weight:bold;}
  .scoreboard .stage{font-size:12px;letter-spacing:2px;color:#7fa8ff;}
  .scoreboard .sub{font-size:11px;color:#cfd8cf;margin-top:2px;}
 
  .commentary{
    background:#fff;border:1px solid var(--line);max-height:300px;overflow-y:auto;
    padding:14px 16px;font-size:14px;line-height:1.9;
  }
  .commentary .ev{border-bottom:1px dashed var(--line);padding:4px 0;}
  .commentary .ev.goal{color:var(--red);font-weight:bold;}
  .commentary .ev.goal-opp{color:var(--ink2);font-weight:bold;}
  .commentary .ev.moment{color:var(--gold-dim);font-style:italic;}
 
  .pen-modal{
    position:fixed;inset:0;background:rgba(6,12,28,0.85);
    display:flex;align-items:center;justify-content:center;z-index:50;
  }
  .pen-box{background:var(--cream);border:3px solid var(--ink);padding:32px;max-width:420px;text-align:center;}
  .pen-box h3{margin-top:0;color:var(--red);letter-spacing:1px;}
  .pen-choices{display:flex;gap:10px;margin-top:20px;}
  .pen-choices button{flex:1;}
 
  .table-wrap{margin-top:10px;}
  table{width:100%;border-collapse:collapse;font-size:14px;}
  th,td{padding:9px 8px;text-align:left;border-bottom:1px solid var(--line);}
  th{font-size:11px;letter-spacing:1px;color:var(--gold-dim);text-transform:uppercase;}
  tr.you{background:#eaf1ff;font-weight:bold;}
 
  .cta-row{margin-top:18px;display:flex;gap:12px;}
  .end-screen{padding:60px 30px;text-align:center;}
  .end-screen h2{font-size:34px;margin-bottom:6px;}
  .trophy{font-size:60px;}
 
  .bracket{display:flex;gap:24px;margin-top:16px;flex-wrap:wrap;}
  .bracket .round{flex:1;min-width:160px;}
  .bracket .round h4{font-size:12px;letter-spacing:1px;color:#9fb6e6;text-transform:uppercase;margin-bottom:8px;}
  .bracket .tie{background:#fff;border:1px solid var(--line);padding:10px 12px;margin-bottom:10px;font-size:13px;}
  .bracket .tie.win{border-left:4px solid var(--red);}
  .bracket .tie.pending{opacity:0.4;}
 
  .hidden{display:none !important;}
  .small{font-size:12px;color:var(--ink2);}
 
  .nav-tabs{display:flex;gap:8px;}
  .nav-tab{padding:9px 16px;font-size:12px;letter-spacing:1px;border-width:2px;}
  .nav-tab.active{background:var(--ink);color:var(--cream);}
 
  .diff-btn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:14px 16px;}
  .diff-btn .dtitle{font-size:15px;}
  .diff-btn .dsub{font-size:11px;font-weight:normal;letter-spacing:0.5px;opacity:0.75;}
 
  .curio-cats{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 22px;}
  .curio-cat-btn{padding:9px 14px;font-size:12px;}
  .curio-cat-btn.active{background:var(--ink);color:var(--cream);}
  .curio-list{display:flex;flex-direction:column;gap:10px;}
  .curio-item{background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold);padding:13px 16px;font-size:14px;line-height:1.55;}
  .curio-item .cnum{color:var(--gold-dim);font-weight:bold;margin-right:4px;}
  .quiz-card{background:#fff;border:1px solid var(--line);border-top:4px solid var(--gold);padding:22px 20px;max-width:720px;}
  .quiz-meta{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.12em;color:var(--gold-dim);font-weight:bold;margin-bottom:14px;}
  .quiz-q{font-size:19px;line-height:1.4;font-weight:bold;margin-bottom:18px;}
  .quiz-opts{display:flex;flex-direction:column;gap:9px;}
  .quiz-opt{text-align:left;padding:12px 15px;font-size:14px;background:var(--cream);border:1px solid var(--line);cursor:pointer;}
  .quiz-opt:hover:enabled{background:var(--ink);color:var(--cream);}
  .quiz-opt:disabled{cursor:default;opacity:.85;}
  .quiz-opt.correct{background:#1d6b3f;color:#fff;border-color:#1d6b3f;opacity:1;}
  .quiz-opt.wrong{background:#8f2222;color:#fff;border-color:#8f2222;opacity:1;}
  .quiz-feedback{margin-top:16px;padding:12px 14px;font-size:13px;line-height:1.55;border-left:4px solid var(--gold);background:var(--cream);}
  .quiz-feedback.good{border-left-color:#1d6b3f;}
  .quiz-feedback.bad{border-left-color:#8f2222;}
  .quiz-next{margin-top:16px;padding:11px 22px;font-size:12px;letter-spacing:.12em;font-weight:bold;background:var(--ink);color:var(--cream);border:none;cursor:pointer;}
  .quiz-result{text-align:center;}
  .quiz-score-big{font-size:52px;font-weight:bold;letter-spacing:.04em;}
  .quiz-verdict{margin-top:8px;font-size:12px;letter-spacing:.14em;color:var(--gold-dim);font-weight:bold;}

  .shield-layout{display:grid;grid-template-columns:1fr 300px;gap:26px;align-items:start;}
  @media (max-width:980px){.shield-layout{grid-template-columns:1fr;}}
  .shield-editor,.shield-preview{background:#fff;border:1px solid var(--line);padding:20px;}
  .shield-editor h2.section:first-child{margin-top:0;}
  .shield-editor h2.section{margin-top:18px;}
  .shield-opts{display:flex;flex-wrap:wrap;gap:8px;}
  .shield-opt{padding:9px 14px;font-size:12px;letter-spacing:1px;}
  .shield-opt.active{background:var(--ink);color:var(--cream);}
  .shield-swatches{display:flex;flex-wrap:wrap;gap:8px;}
  .shield-swatch{width:34px;height:34px;padding:0;border:2px solid var(--line);}
  .shield-swatch.active{border-color:var(--ink);box-shadow:inset 0 0 0 2px #fff;}
  .shield-canvas{display:flex;justify-content:center;padding:14px 0 20px;}
  #hdr-shield svg{display:block;}

  .pen-box.wide{max-width:520px;}
  .moment-choices{flex-direction:column;}
  .goal-frame{margin-top:18px;background:linear-gradient(180deg,#0D2358,#173B82);border:3px solid #fff;padding:6px;}
  .goal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;}
  .goal-zone{
    padding:24px 6px;font-size:11px;letter-spacing:.06em;line-height:1.2;
    background:rgba(255,255,255,0.10);color:var(--cream);border:1px dashed rgba(255,255,255,0.45);
  }
  .goal-zone:hover:not(:disabled){background:var(--gold);color:var(--ink);border-color:var(--gold);}
  .goal-line{height:6px;background:#fff;margin-top:6px;}
  .scoreboard .teams .team-side{display:inline-flex;align-items:center;gap:8px;}
  .scoreboard .teams .team-side svg{display:block;}

  .scoreboard .score-row{display:flex;align-items:center;justify-content:center;gap:22px;}
  .scoreboard .score-row .score{margin:6px 0;}
  .scoreboard .sb-crest{display:inline-flex;align-items:center;}
  .scoreboard .sb-crest svg{display:block;}

  .team-card .card-crest{margin:8px 0 2px;}
  .team-card .card-crest svg{display:block;}
  .bracket .tie-crest{display:inline-block;vertical-align:middle;margin-right:6px;}
  .bracket .tie-crest svg{display:block;}