/* rawmktg - shared styles for /tools pages.
   Scoped under .toolpage to avoid collisions with site styles.
   Interactive cards use the brand dark-terminal treatment on the paper page;
   prose (method) uses the light paper card. Accents pull from --signal. */

.toolpage .tool-intro{padding:8px 0 26px;}
.toolpage .grid{display:grid;gap:28px;}
.toolpage .grid.calc{grid-template-columns:1.05fr .95fr;}
.toolpage .grid.mix{grid-template-columns:.82fr 1.18fr;}
.toolpage .grid.score{grid-template-columns:1.18fr .82fr;align-items:start;}
.toolpage .grid.zero{grid-template-columns:1.02fr .98fr;}

/* interactive card = dark terminal */
.toolpage .card{background:#1A1815;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:30px;margin:8px 0 0;}
.toolpage .controls{display:flex;flex-direction:column;gap:20px;}

.toolpage .fld .lab,.toolpage .base label,.toolpage .fld label{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-family:var(--f-display);font-weight:600;font-size:15px;color:#fff;margin-bottom:8px;}
.toolpage .fld .val,.toolpage .base .val{font-weight:700;font-size:17px;color:var(--signal);}
.toolpage .hint{font-family:var(--f-mono);font-size:11px;color:rgba(255,255,255,.45);margin-top:8px;line-height:1.55;}

.toolpage input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:5px;background:rgba(255,255,255,.14);border-radius:5px;outline:none;accent-color:var(--signal);margin-top:10px;}
.toolpage input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--signal);border:3px solid #1A1815;cursor:pointer;}
.toolpage input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--signal);border:3px solid #1A1815;cursor:pointer;}

.toolpage .ipt{display:flex;align-items:center;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);border-radius:6px;padding:0 14px;}
.toolpage .ipt .pfx{color:rgba(255,255,255,.4);font-family:var(--f-mono);font-size:16px;margin-right:6px;}
.toolpage .ipt input{flex:1;background:transparent;border:none;outline:none;color:#fff;font-family:var(--f-display);font-weight:600;font-size:20px;padding:13px 0;width:100%;}
.toolpage .ipt input::-webkit-outer-spin-button,.toolpage .ipt input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}

/* toggle switch */
.toolpage .switch{flex:none;width:42px;height:24px;border-radius:12px;border:none;background:rgba(255,255,255,.22);position:relative;cursor:pointer;transition:background .18s;padding:0;}
.toolpage .switch::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .18s;}
.toolpage .switch.on{background:var(--signal);}
.toolpage .switch.on::after{left:21px;}
.toolpage .tactic{border:1px solid rgba(255,255,255,.10);border-radius:6px;padding:15px 16px;transition:opacity .18s;}
.toolpage .tactic.off{opacity:.45;}
.toolpage .trow{display:flex;align-items:center;gap:12px;}
.toolpage .tname{flex:1;font-family:var(--f-display);font-weight:600;font-size:15px;color:#fff;}
.toolpage .band{font-family:var(--f-mono);font-size:12px;font-weight:600;color:var(--signal);}

/* horizontal seg buttons */
.toolpage .seg{display:flex;gap:6px;margin-top:12px;}
.toolpage .seg button{flex:1;font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:9px 6px;border-radius:5px;border:1px solid rgba(255,255,255,.14);background:transparent;color:rgba(255,255,255,.6);cursor:pointer;transition:all .15s;line-height:1.3;}
.toolpage .seg button.sel{background:rgba(188,63,29,.18);border-color:var(--signal);color:#fff;}
.toolpage .seg button b{display:block;font-family:var(--f-display);font-size:14px;color:#fff;}

/* vertical seg (strategy) */
.toolpage .seg-v{display:flex;flex-direction:column;gap:8px;}
.toolpage .seg-v button{text-align:left;font-family:var(--f-display);font-weight:600;font-size:14px;padding:13px 15px;border-radius:6px;border:1px solid rgba(255,255,255,.14);background:transparent;color:rgba(255,255,255,.6);cursor:pointer;transition:all .15s;}
.toolpage .seg-v button small{display:block;font-family:var(--f-mono);font-weight:400;font-size:11px;color:rgba(255,255,255,.4);margin-top:3px;letter-spacing:.03em;}
.toolpage .seg-v button.sel{background:rgba(188,63,29,.16);border-color:var(--signal);color:#fff;}
.toolpage .seg-v button.sel small{color:var(--signal);}

/* output panel */
.toolpage .output{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:24px;display:flex;flex-direction:column;}
.toolpage .o-eyebrow{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5);}
.toolpage .o-lift,.toolpage .o-big{font-family:var(--f-display);font-weight:700;font-size:clamp(40px,8vw,58px);line-height:1;color:#fff;letter-spacing:-.025em;margin:6px 0 3px;}
.toolpage .o-lift{color:var(--signal);}
.toolpage .o-sub{font-family:var(--f-mono);font-size:11px;color:rgba(255,255,255,.5);margin-bottom:20px;}

/* bars */
.toolpage .barrow{display:flex;align-items:center;gap:11px;margin-bottom:12px;}
.toolpage .barrow .l{font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.5);flex:none;}
.toolpage .track{flex:1;height:14px;background:rgba(255,255,255,.10);border-radius:7px;overflow:hidden;}
.toolpage .fill{height:100%;border-radius:7px;transition:width .4s cubic-bezier(.22,.61,.36,1);}
.toolpage .fill.now{background:rgba(255,255,255,.4);}
.toolpage .fill.proj,.toolpage .fill.risk{background:var(--signal);}
.toolpage .barrow b{font-family:var(--f-display);font-weight:700;font-size:16px;color:#fff;text-align:right;flex:none;}

.toolpage .interp{font-family:var(--f-prose);font-size:14px;line-height:1.5;color:rgba(255,255,255,.62);margin-top:10px;min-height:40px;}
.toolpage .interp b{color:#fff;font-weight:600;}
.toolpage .chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px;}
.toolpage .chip{font-family:var(--f-mono);font-size:10.5px;padding:5px 9px;border-radius:5px;background:rgba(188,63,29,.18);border:1px solid rgba(255,255,255,.08);color:var(--signal);}
.toolpage .chip.muted{background:transparent;color:rgba(255,255,255,.45);}
.toolpage .caveat{font-family:var(--f-mono);font-size:10px;line-height:1.6;color:rgba(255,255,255,.38);margin-top:16px;padding-top:14px;border-top:1px dashed rgba(255,255,255,.12);}

/* content-mix output */
.toolpage .stacked{display:flex;height:20px;border-radius:6px;overflow:hidden;margin-bottom:22px;background:rgba(255,255,255,.10);}
.toolpage .stacked span{height:100%;transition:width .4s cubic-bezier(.22,.61,.36,1);}
.toolpage .alloc{display:flex;flex-direction:column;gap:10px;}
.toolpage .arow{display:flex;align-items:center;gap:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:15px 18px;}
.toolpage .arow .swatch{width:5px;height:44px;border-radius:3px;background:var(--c);flex:none;}
.toolpage .arow .meta{flex:1;}
.toolpage .arow .nm{font-family:var(--f-display);font-weight:600;font-size:15px;color:#fff;}
.toolpage .arow .ds{font-family:var(--f-mono);font-size:11px;color:rgba(255,255,255,.45);margin-top:3px;line-height:1.45;}
.toolpage .arow .cnt{text-align:right;flex:none;min-width:74px;}
.toolpage .arow .cnt .c{font-family:var(--f-display);font-weight:700;font-size:28px;color:var(--c);line-height:1;}
.toolpage .arow .cnt .p{font-family:var(--f-mono);font-size:11px;color:rgba(255,255,255,.45);margin-top:2px;}
.toolpage .cadence{display:flex;gap:14px;margin-top:18px;}
.toolpage .cad{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:14px 16px;}
.toolpage .cad .n{font-family:var(--f-display);font-weight:700;font-size:19px;color:#fff;}
.toolpage .cad .n b{color:var(--signal);}
.toolpage .cad .k{font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:4px;line-height:1.4;}

/* scorecard checklist */
.toolpage .cat{margin-bottom:22px;}
.toolpage .cat:last-child{margin-bottom:0;}
.toolpage .cat-h{display:flex;align-items:baseline;justify-content:space-between;font-family:var(--f-display);font-weight:600;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--signal);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.10);}
.toolpage .cat-h span{font-family:var(--f-mono);font-size:11px;color:rgba(255,255,255,.4);}
.toolpage .item{display:flex;align-items:center;gap:14px;padding:9px 0;}
.toolpage .iname{flex:1;font-family:var(--f-prose);font-size:13px;color:rgba(255,255,255,.85);line-height:1.4;}
.toolpage .iseg{display:flex;gap:5px;flex:none;}
.toolpage .iseg button{font-family:var(--f-mono);font-size:11px;padding:7px 11px;border-radius:5px;border:1px solid rgba(255,255,255,.14);background:transparent;color:rgba(255,255,255,.5);cursor:pointer;transition:all .14s;}
.toolpage .iseg button.sel{color:#fff;}
.toolpage .iseg button[data-m="0"].sel{background:rgba(188,63,29,.20);border-color:var(--signal);}
.toolpage .iseg button[data-m="0.5"].sel{background:rgba(138,130,120,.24);border-color:var(--mute);}
.toolpage .iseg button[data-m="1"].sel{background:rgba(62,155,106,.20);border-color:var(--up);}

/* scorecard output */
.toolpage .panel-out{position:sticky;top:24px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:24px;}
.toolpage .scorewrap{display:flex;align-items:baseline;gap:8px;margin:8px 0 6px;}
.toolpage .scorewrap .score{font-family:var(--f-display);font-weight:700;font-size:70px;line-height:1;color:#fff;letter-spacing:-.03em;}
.toolpage .score-d{font-family:var(--f-display);font-weight:600;font-size:22px;color:rgba(255,255,255,.4);}
.toolpage .scoreband{display:inline-block;font-family:var(--f-display);font-weight:700;font-size:13px;padding:6px 12px;border-radius:6px;letter-spacing:.02em;}
.toolpage .gauge{height:10px;border-radius:5px;background:rgba(255,255,255,.10);overflow:hidden;margin:18px 0 6px;position:relative;}
.toolpage .gauge .gfill{height:100%;border-radius:5px;transition:width .4s,background .3s;}
.toolpage .gscale{display:flex;justify-content:space-between;font-family:var(--f-mono);font-size:9px;color:rgba(255,255,255,.4);letter-spacing:.04em;}
.toolpage .gaps{margin-top:22px;}
.toolpage .gaps-h{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:12px;}
.toolpage .gap{display:flex;gap:12px;padding:12px 0;border-top:1px solid rgba(255,255,255,.10);}
.toolpage .gap .rk{font-family:var(--f-display);font-weight:700;font-size:13px;color:var(--signal);flex:none;width:20px;}
.toolpage .gap .gt{font-family:var(--f-display);font-weight:600;font-size:13px;color:#fff;}
.toolpage .gap .ga{font-family:var(--f-mono);font-size:11px;color:rgba(255,255,255,.5);margin-top:3px;line-height:1.45;}
.toolpage .gap .pts{font-family:var(--f-mono);font-size:11px;color:var(--signal);flex:none;}
.toolpage .allset{font-family:var(--f-prose);font-size:14px;color:var(--up);padding:10px 0;}

/* zero-click stats */
.toolpage .statrow{display:flex;gap:14px;margin-top:8px;}
.toolpage .stat{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:14px 16px;}
.toolpage .stat .n{font-family:var(--f-display);font-weight:700;font-size:24px;color:var(--c,#fff);}
.toolpage .stat .k{font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:4px;}

/* method = light prose card */
.toolpage .method{margin:34px 0 0;background:var(--paper-2);border:1px solid var(--rule);border-radius:8px;padding:28px 30px;}
.toolpage .method h2{font-family:var(--f-display);font-weight:700;font-size:19px;color:var(--ink);margin-bottom:14px;}
.toolpage .method p{font-family:var(--f-prose);font-size:14px;line-height:1.7;color:var(--ink-2);margin-bottom:14px;}
.toolpage .method strong{color:var(--ink);}
.toolpage .method a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--signal);}
.toolpage .srcs{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;}
.toolpage .srcs a{font-family:var(--f-mono);font-size:11.5px;color:var(--ink-2);border:1px solid var(--rule);border-radius:6px;padding:8px 12px;text-decoration:none;transition:all .15s;}
.toolpage .srcs a:hover{border-color:var(--signal);color:var(--ink);}

/* /tools hub tiles */
.toolpage .tools-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:8px;}
.toolpage .tool-tile{display:flex;flex-direction:column;border:1px solid var(--rule);border-radius:10px;padding:26px;background:var(--paper-2);transition:border-color .15s;}
.toolpage .tool-tile:hover{border-color:var(--signal);}
.toolpage .tool-tile .tt-cat{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--signal);margin-bottom:12px;}
.toolpage .tool-tile .tt-name{font-family:var(--f-display);font-weight:700;font-size:20px;letter-spacing:-.01em;color:var(--ink);margin-bottom:8px;line-height:1.2;}
.toolpage .tool-tile .tt-desc{font-family:var(--f-prose);font-size:13px;line-height:1.6;color:var(--ink-2);flex:1;}
.toolpage .tool-tile .tt-go{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--signal);margin-top:16px;}

@media(max-width:760px){
  .toolpage .grid{grid-template-columns:1fr !important;}
  .toolpage .panel-out{position:static;}
  .toolpage .item{flex-wrap:wrap;gap:8px;}
}
@media(max-width:680px){.toolpage .tools-grid{grid-template-columns:1fr;}}

/* ============ components for analyzer / matrix / funnel tools ============ */
/* textarea + date/select inputs */
.toolpage textarea.ta{width:100%;min-height:210px;resize:vertical;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);border-radius:6px;color:#fff;font-family:var(--f-mono);font-size:12.5px;line-height:1.6;padding:14px 16px;outline:none;}
.toolpage textarea.ta:focus{border-color:var(--signal);}
.toolpage textarea.ta::placeholder{color:rgba(255,255,255,.32);}
.toolpage select.sel-input,.toolpage input[type=date]{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);border-radius:6px;color:#fff;font-family:var(--f-display);font-weight:600;font-size:15px;padding:12px 14px;outline:none;}
.toolpage input[type=date]{color-scheme:dark;}
.toolpage select.sel-input:focus,.toolpage input[type=date]:focus{border-color:var(--signal);}

/* analyzer metric rows */
.toolpage .metrics{display:flex;flex-direction:column;gap:11px;}
.toolpage .metric{border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:13px 15px;background:rgba(255,255,255,.03);}
.toolpage .metric-top{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.toolpage .metric-name{font-family:var(--f-display);font-weight:600;font-size:13px;color:#fff;}
.toolpage .verdict{font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:4px;font-weight:600;flex:none;}
.toolpage .verdict.good{background:rgba(62,155,106,.20);color:var(--up);}
.toolpage .verdict.warn{background:rgba(255,255,255,.10);color:var(--faint);}
.toolpage .verdict.bad{background:rgba(188,63,29,.20);color:var(--signal);}
.toolpage .metric-bar{height:6px;border-radius:3px;background:rgba(255,255,255,.10);overflow:hidden;margin:10px 0 7px;}
.toolpage .metric-bar i{display:block;height:100%;border-radius:3px;background:var(--signal);transition:width .4s;}
.toolpage .metric-fix{font-family:var(--f-mono);font-size:10.5px;line-height:1.5;color:rgba(255,255,255,.5);}
.toolpage .metric-fix b{color:rgba(255,255,255,.8);font-weight:600;}

/* flagged sections */
.toolpage .flags{display:flex;flex-direction:column;gap:7px;margin-top:8px;}
.toolpage .flag{font-family:var(--f-mono);font-size:11px;line-height:1.5;color:rgba(255,255,255,.72);background:rgba(255,255,255,.04);border-left:2px solid var(--signal);border-radius:0 4px 4px 0;padding:8px 11px;}
.toolpage .flag.ok{border-left-color:var(--up);}

/* platform matrix */
.toolpage .ptoggles{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.toolpage .ptog{font-family:var(--f-mono);font-size:11px;padding:7px 12px;border-radius:6px;border:1px solid rgba(255,255,255,.14);background:transparent;color:rgba(255,255,255,.55);cursor:pointer;transition:all .15s;}
.toolpage .ptog.on{background:rgba(188,63,29,.18);border-color:var(--signal);color:#fff;}
.toolpage .mx-grid{display:flex;flex-direction:column;gap:12px;}
.toolpage .mx-card{border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:16px 18px;background:rgba(255,255,255,.03);}
.toolpage .mx-card.off{display:none;}
.toolpage .mx-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.toolpage .mx-name{font-family:var(--f-display);font-weight:700;font-size:15px;color:#fff;}
.toolpage .mx-badge{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--signal);}
.toolpage .mx-row{display:flex;gap:10px;font-family:var(--f-mono);font-size:11px;line-height:1.55;padding:6px 0;border-top:1px solid rgba(255,255,255,.07);}
.toolpage .mx-row .k{color:rgba(255,255,255,.45);width:92px;flex:none;text-transform:uppercase;letter-spacing:.06em;font-size:9px;padding-top:2px;}
.toolpage .mx-row .v{color:#fff;flex:1;}

/* funnel compare */
.toolpage .funnel-row{margin-bottom:18px;}
.toolpage .funnel-lab{display:flex;justify-content:space-between;font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:7px;}
.toolpage .num-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;}
.toolpage .num-grid .fld .lab{font-size:12px;margin-bottom:6px;}

/* embedded-in-article tool wrapper */
.toolpage.tool-embed{margin:36px 0;}
.tool-embed .embed-head{margin-bottom:14px;}
.tool-embed .embed-eyebrow{font-family:var(--f-mono);font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--signal);margin-bottom:8px;}
.tool-embed .embed-title{font-family:var(--f-display);font-weight:700;font-size:21px;letter-spacing:-.01em;color:var(--ink);margin-bottom:6px;line-height:1.15;}
.tool-embed .embed-deck{font-family:var(--f-prose);font-size:14px;line-height:1.6;color:var(--ink-2);}
.tool-embed .embed-foot{font-family:var(--f-mono);font-size:11px;color:var(--mute);margin-top:12px;}
.tool-embed .embed-foot a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--signal);}
