/* trade-analyzer.css — per-route styles for /trade-analyzer
   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(--gray-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(--black-card);border:1px solid var(--gray-border);border-radius:10px;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;gap:4px;border-bottom:1px solid var(--gray-border);margin-bottom:20px;}
.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;}
.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(--black-soft);border:1px solid var(--gray-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(--gray-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,.15);color:var(--red-primary,#FF1A1A);}
.badge-blue{background:rgba(50,130,220,.15);color:#6ab0f5;}
/* press button */
.press-btn{background:var(--black-soft);border:1px solid var(--gray-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(--black-card);border:1px solid var(--gray-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;}
}

/* trade-analyzer-specific */

/* Q0136: responsive 3-col trade grid — stacks on mobile */
.ta-trade-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: start;
}
@media (max-width: 600px) {
  .ta-trade-grid {
    grid-template-columns: 1fr;
  }
  /* stack: YOU GIVE → YOU RECEIVE → VERDICT/analyze */
  .ta-trade-grid > :nth-child(2) { order: 3; min-width: 0; }
  .ta-trade-grid > :nth-child(3) { order: 2; }
}

.ta-side{background:var(--black-card);border:1px solid var(--gray-border);border-radius:10px;padding:16px;}
.ta-slot{display:flex;align-items:center;gap:10px;padding:10px;background:var(--black-soft);border:1px solid var(--gray-border);border-radius:6px;margin-bottom:8px;min-height:52px;position:relative;}
.ta-slot-empty{color:var(--text-muted);font-size:16px;font-style:italic;}
.ta-slot-remove{margin-left:auto;background:none;border:none;color:#666;cursor:pointer;font-size:16px;padding:2px 6px;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;}
.ta-slot-remove:hover{color:#e05070;}
.ta-pos-badge{font-size:16px;font-weight:800;padding:2px 6px;border-radius:4px;background:rgba(200,16,46,.15);color:var(--red-primary);}
.ta-value-bar{height:8px;border-radius:4px;transition:width .5s;}
.ta-search-wrap{position:relative;}
.ta-search-results{position:absolute;top:100%;left:0;right:0;background:#1c1c1c;border:1px solid var(--gray-border);border-radius:6px;z-index:200;max-height:200px;overflow-y:auto;display:none;}
.ta-search-result{padding:8px 12px;cursor:pointer;font-size:16px;border-bottom:1px solid var(--gray-border);}
.ta-search-result:hover{background:var(--black-soft);}
.ta-verdict{border-radius:10px;padding:24px;text-align:center;margin-bottom:16px;}
.ta-verdict-grade{font-size:64px;font-weight:900;line-height:1;}
.ta-verdict-label{font-size:16px;font-weight:700;letter-spacing:1px;margin-top:8px;}

/* AUD-12: lightweight usage tips fill the sparse below-the-fold void on
   desktop before first interaction (P3 dead-space finding). */
.ta-tips-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.ta-tip{display:flex;gap:10px;align-items:flex-start;font-size:16px;color:var(--text-muted);line-height:1.4;}
.ta-tip-num{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:rgba(255,26,26,.15);color:var(--red-primary);font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center;}
@media(max-width:767px){.ta-tips-grid{grid-template-columns:1fr;}}