/* draft-strategy.css — per-route styles for /draft-strategy
   Extracted from inline <style> 2026-06-03 (subpage-css-phase2).
   Rules that duplicate tokens.css/:root definitions, base resets,
   and chrome-owned .sidebar/.nav-item have been dropped. */

/* tap-target sweep: primary controls >=44px at mobile (HIG) */
@media(max-width:880px){.tab-btn,.press-btn,select,input[type=text],input[type=search]{min-height:44px;}.tab-btn,.press-btn{display:inline-flex;align-items:center;justify-content:center;}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}.stagger-in{opacity:1!important;}}
/* layout */
.content{flex:1;padding:0;min-width:0;}
.page-header{background:linear-gradient(135deg,#0d0d0d 0%,#1a0a0e 100%);border-bottom:1px solid var(--border);padding:28px 32px 24px;}
.page-eyebrow{font-size:16px;font-weight:800;letter-spacing:2px;color:var(--red-primary);text-transform:uppercase;}
.page-title{font-size:28px;font-weight:900;letter-spacing:-0.5px;margin-top:4px;}
.page-subtitle{font-size:16px;color:var(--text-muted);margin-top:4px;}
.page-body{padding:24px 32px;}
/* cards & containers */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px;}
.card-sm{padding:14px;}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
/* animation */
@keyframes fadeInUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
@keyframes helmetFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
.stagger-in{opacity:0;}
.lift{transition:transform .18s,box-shadow .18s;}
.lift:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.4);}
/* tabs */
.tab-bar{display:flex;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:4px;border-bottom:1px solid var(--border);margin-bottom:20px;}
.tab-bar::-webkit-scrollbar{display:none;}
.tab-btn{padding:10px 18px;background:none;border:none;border-bottom:2px solid transparent;color:#888;font-size:16px;font-weight:700;letter-spacing:.5px;cursor:pointer;transition:color .15s,border-color .15s;white-space:nowrap;flex:0 0 auto;}
.tab-btn.active{color:#fff;border-bottom-color:var(--red-primary);}
.tab-panel{display:none;}.tab-panel.active{display:block;}
/* form controls */
.ctrl-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;margin-bottom:20px;}
select,input[type=text]{background:var(--surface2);border:1px solid var(--border);border-radius:6px;color:var(--text);padding:8px 12px;font-size:16px;outline:none;cursor:pointer;}
select:focus,input[type=text]:focus{border-color:var(--red-primary);}
label{font-size:16px;font-weight:700;color:var(--text-muted);letter-spacing:.5px;display:block;margin-bottom:4px;}
.ctrl-group{display:flex;flex-direction:column;}
/* stat boxes */
.stat-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border);}
.stat-row:last-child{border-bottom:none;}
.stat-lbl{font-size:16px;color:var(--text-muted);font-weight:600;}
.stat-val{font-size:16px;font-weight:700;}
/* badges */
.badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:4px;font-size:16px;font-weight:800;letter-spacing:.5px;}
.badge-green{background:rgba(61,186,110,.15);color:#3dba6e;}
.badge-red{background:rgba(200,16,46,.15);color:#e05070;}
.badge-gold{background:rgba(255,45,45,.12);border:1px solid rgba(255,45,45,.25);color:var(--text-primary,#F5F5F5);}
.badge-blue{background:rgba(50,130,220,.15);color:#6ab0f5;}
/* press button */
.press-btn{background:var(--surface2);border:1px solid var(--border);border-radius:6px;color:#aaa;font-size:16px;font-weight:700;letter-spacing:.5px;padding:8px 14px;cursor:pointer;transition:background .15s,color .15s,border-color .15s;}
.press-btn.active,.press-btn:hover{background:rgba(200,16,46,.15);border-color:var(--red-primary);color:#fff;}
/* SVG scatter */
.scatter-wrap{position:relative;width:100%;}
.scatter-wrap svg{width:100%;height:320px;overflow:visible;}
/* empty state */
.empty-state{text-align:center;padding:60px 20px;color:var(--text-muted);}
.empty-state .es-icon{font-size:48px;margin-bottom:16px;animation:helmetFloat 3s ease-in-out infinite;}
/* mobile nav */
#mob-nav-toggle{display:none;}
.mob-nav-burger{display:none;position:fixed;top:14px;left:14px;z-index:200;cursor:pointer;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:6px;color:#aaa;}
.mob-nav-scrim{display:none;}
@media(max-width:767px){
  .app{grid-template-columns:1fr;}
  .mob-nav-burger{display:flex;}
  .mob-nav-scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99;opacity:0;pointer-events:none;transition:opacity .25s;}
  #mob-nav-toggle:checked~.mob-nav-scrim{opacity:1;pointer-events:auto;}
  .content{margin-left:0;}
  .page-header{padding:20px 16px 16px;}
  .page-title{font-size:22px;}
  .page-body{padding:16px;}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr 1fr;}
}
@media(max-width:480px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}
}
@media(max-width:359px){
  .page-body{padding:12px 10px;}
  .page-title{font-size:18px;}
  .hide-320{display:none;}
}

/* draft-strategy-specific */
.ds-row{display:flex;align-items:center;padding:8px 12px;border-bottom:1px solid var(--border);font-size:16px;gap:10px;}
.ds-row:hover{background:var(--surface2);}
.ds-rank{font-size:16px;font-weight:800;color:var(--text-muted);width:28px;text-align:center;}
.ds-name{flex:1;font-weight:600;}
.ds-pos{font-size:16px;padding:2px 6px;border-radius:3px;font-weight:800;}
.ds-val{font-size:16px;font-weight:700;text-align:right;min-width:60px;}
.scarcity-bar{height:10px;border-radius:5px;background:var(--red-primary);}