/* ==========================================================================
   CEG TOOLS: shared chrome for /media-kit/, /rate-calculator/ and
   /package-builder/. Fixed light "terminal utility" palette, independent of
   the marketing site's dark/light toggle (matches the design handoff's
   tool-page tokens). Sits between the real site header and footer, see
   site-chrome.css, as a self-contained workspace, not the whole page.
   ========================================================================== */
.ceg-tool {
  --t-bg:#F4F1EA; --t-panel:#FFFFFF; --t-ink:#111111; --t-border:#DAD8D0; --t-border-soft:#ECEBE7;
  --t-muted:#55524A; --t-dim:#8A877E; --t-dim2:#C9C6BE; --t-accent:#FF4A00; --t-accent-hover:#E64300; --t-lime:#D8FF3A;
  background:var(--t-bg); color:var(--t-ink);
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
}
.ceg-tool * { box-sizing:border-box; }
.ceg-tool a { color:var(--t-ink); }
.ceg-tool a:hover { color:var(--t-muted); }
.ceg-tool ::-webkit-scrollbar { width:12px; height:12px; }
.ceg-tool ::-webkit-scrollbar-track { background:var(--t-bg); }
.ceg-tool ::-webkit-scrollbar-thumb { background:var(--t-accent); border:3px solid var(--t-bg); }
.ceg-tool ::-webkit-scrollbar-thumb:hover { background:var(--t-accent-hover); }
.ceg-tool { scrollbar-color:var(--t-accent) var(--t-bg); scrollbar-width:thin; }

.t-wrap { max-width:1400px; margin:0 auto; padding:48px 40px 100px; }
@media (max-width:720px) { .t-wrap { padding:32px 18px 72px; } }

.t-eyebrow { font-family:"Space Mono", monospace; font-size:11px; letter-spacing:0.2em; color:var(--t-accent); font-weight:700; }
.t-intro { display:flex; flex-direction:column; gap:8px; max-width:720px; margin-bottom:40px; }
.t-intro h1 { font-family:"Space Mono", monospace; font-size:clamp(26px,4vw,36px); font-weight:700; letter-spacing:-1px; margin:0; color:var(--t-ink); }
.t-intro p { font-size:15px; color:var(--t-muted); line-height:1.6; margin:0; }
.t-intro p.small { font-size:13px; color:var(--t-dim); }
.t-intro a { font-weight:700; text-decoration:underline; }

.t-coffee-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:18px; }
.t-coffee { display:inline-flex; align-items:center; gap:8px; font-family:"Space Mono", monospace; font-size:12px; font-weight:700; color:var(--t-ink); background:var(--t-panel); border:1px solid var(--t-ink); padding:9px 14px; text-decoration:none; white-space:nowrap; }
.t-coffee:hover { background:var(--t-ink); color:var(--t-bg); opacity:1; }
.t-coffee-note { font-family:"Space Mono", monospace; font-size:11px; color:var(--t-dim); }

.t-panel-head-btn { cursor:pointer; user-select:none; font-family:"Space Mono", monospace; font-size:10.5px; font-weight:700; letter-spacing:0.06em; color:#fff; background:var(--t-accent); border:1px solid var(--t-accent); padding:5px 10px; white-space:nowrap; }
.t-panel-head-btn:hover { background:var(--t-accent-hover); border-color:var(--t-accent-hover); }

.t-panel { border:1px solid var(--t-ink); background:var(--t-panel); }
.t-panel-head { display:flex; align-items:center; gap:8px; padding:10px 14px; border-bottom:1px solid var(--t-ink); background:var(--t-ink); }
.t-panel-head .dots { display:flex; gap:5px; }
.t-panel-head .dots span { width:8px; height:8px; border-radius:50%; display:inline-block; background:var(--t-dim); }
.t-panel-head .dots span:first-child { background:var(--t-accent); }
.t-panel-head .path { font-family:"Space Mono", monospace; font-size:11px; color:var(--t-dim); }

.t-field { display:flex; flex-direction:column; gap:8px; }
.t-field label { font-family:"Space Mono", monospace; font-size:11px; letter-spacing:0.08em; color:var(--t-dim); }
.t-field label .opt { color:var(--t-dim2); }
.t-field input[type="text"], .t-field input[type="email"], .t-field input[type="number"], .t-field select, .t-field textarea {
  font-family:"Space Mono", monospace; font-size:13px; padding:10px 12px; border:1px solid var(--t-border);
  background:var(--t-bg); color:var(--t-ink); outline:none; width:100%;
}
.t-field textarea { resize:vertical; }
.t-field input:focus, .t-field select:focus, .t-field textarea:focus { border-color:var(--t-ink); }
.t-row { display:flex; gap:16px; }
.t-row > * { flex:1; min-width:0; }
.t-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }

.t-chip-row { display:flex; flex-wrap:wrap; gap:8px; }
.t-chip { cursor:pointer; user-select:none; font-size:12px; font-weight:700; padding:7px 12px; border:1px solid var(--t-border); background:transparent; color:var(--t-muted); }
.t-chip.active { border-color:var(--t-ink); background:var(--t-ink); color:var(--t-bg); }
.t-chip-sm { font-size:11px; padding:6px 10px; }

.t-seg { display:flex; gap:10px; }
.t-seg-opt { cursor:pointer; user-select:none; flex:1; text-align:center; padding:10px 8px; border:1px solid var(--t-border); background:transparent; color:var(--t-muted); font-family:"Space Mono", monospace; font-size:10.5px; letter-spacing:0.04em; }
.t-seg-opt.active { border-color:var(--t-ink); background:var(--t-ink); color:var(--t-bg); }

.om-gradient-row { display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; }
.om-gradient-swatch { cursor:pointer; user-select:none; width:34px; height:34px; border-radius:50%; border:2px solid transparent; box-shadow:0 0 0 1px var(--t-border); flex-shrink:0; }
.om-gradient-swatch.active { border-color:var(--t-accent); box-shadow:0 0 0 1px var(--t-bg), 0 0 0 3px var(--t-accent); }
.om-gradient-custom { display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:700; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,0.35); }
.om-gradient-custom-wrap { display:flex; flex-direction:column; align-items:center; gap:4px; }
.om-gradient-custom-label { font-family:"Space Mono", monospace; font-size:9px; letter-spacing:0.08em; color:var(--t-accent); font-weight:700; }

.t-check { cursor:pointer; user-select:none; display:flex; align-items:center; gap:10px; }
.t-check .box { width:16px; height:16px; border:1px solid var(--t-ink); background:transparent; flex-shrink:0; }
.t-check.on .box { background:var(--t-accent); }
.t-check .lbl { font-family:"Space Mono", monospace; font-size:12.5px; color:var(--t-ink); line-height:1.3; }

.t-hair { height:1px; background:var(--t-border); margin:4px 0; }
.t-note { font-family:"Space Mono", monospace; font-size:10px; letter-spacing:0.1em; color:var(--t-dim); }

.t-remove-x { cursor:pointer; font-family:"Space Mono", monospace; font-size:11px; color:var(--t-dim); }
.t-remove-x:hover { color:var(--t-ink); }
.t-add-link { cursor:pointer; user-select:none; font-family:"Space Mono", monospace; font-size:11px; color:var(--t-dim); width:fit-content; }
.t-add-link:hover { color:var(--t-ink); }

.t-cta-btn { cursor:pointer; user-select:none; text-align:center; font-family:"Space Mono", monospace; font-size:13px; font-weight:700; color:var(--t-bg); background:var(--t-ink); padding:14px; border:none; width:100%; }
.t-cta-btn:hover { background:#000; }
.t-cta-btn.ghost { background:var(--t-bg); color:var(--t-ink); border:1px solid var(--t-ink); }

input[type="color"].t-swatch { cursor:pointer; width:44px; height:44px; padding:0; border:2px solid var(--t-ink); background:none; }
input[type="range"].t-range { width:100%; accent-color:var(--t-accent); }

.t-hazard { height:8px; background:repeating-linear-gradient(-45deg, var(--t-accent) 0 7px, var(--t-bg) 7px 14px); }

.t-foot-cta { border:1px solid var(--t-ink); background:var(--t-panel); padding:24px 28px; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.t-foot-cta .h { font-family:"Space Mono", monospace; font-size:11px; letter-spacing:0.1em; color:var(--t-accent); font-weight:700; margin-bottom:6px; }
.t-foot-cta .b { font-size:14px; color:var(--t-muted); }
.t-foot-cta .go { font-family:"Space Mono", monospace; font-size:12px; font-weight:700; color:var(--t-bg); background:var(--t-ink); padding:12px 18px; text-decoration:none; white-space:nowrap; border:none; cursor:pointer; }
.t-foot-cta .go:hover { background:#000; color:var(--t-lime); }
.t-foot-cta .go.orange { background:var(--t-accent); color:#fff; }
.t-foot-cta .go.orange:hover { background:var(--t-accent-hover); color:#fff; }

.t-cta-btn-accent { background:var(--t-accent); color:#fff; margin-top:10px; }
.t-cta-btn-accent:hover { background:var(--t-accent-hover); }

.ceg-tool [data-logo] { background-size:contain; background-repeat:no-repeat; background-position:center; display:inline-block; }
.ceg-tool [hidden] { display:none !important; }
.ceg-tool [role="button"]:focus-visible { outline:2px solid var(--t-accent); outline-offset:2px; }

/* -------------------------------------------------------------------- *
 * Chat / intro pop-out modal, shared across all three tool pages.
 * -------------------------------------------------------------------- */
.t-modal-overlay { position:fixed; inset:0; z-index:200; background:rgba(10,10,10,0.72); display:flex; align-items:flex-start; justify-content:center; padding:40px 20px; overflow-y:auto; }
.t-modal-overlay[hidden] { display:none; }
.t-modal { background:var(--t-bg); border:1px solid var(--t-ink); max-width:640px; width:100%; margin:auto; }
.t-modal-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 20px; border-bottom:1px solid var(--t-ink); background:var(--t-ink); position:sticky; top:0; }
.t-modal-title { font-family:"Space Mono", monospace; font-size:11.5px; letter-spacing:0.1em; color:var(--t-dim); }
.t-modal-close { cursor:pointer; background:transparent; border:none; color:var(--t-dim); font-size:22px; line-height:1; padding:0 2px; }
.t-modal-close:hover { color:var(--t-bg); }
.t-modal-body { padding:26px; }
.t-modal-lead { font-size:13.5px; color:var(--t-muted); line-height:1.6; margin:0 0 20px; }
.t-modal-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.t-modal-full { grid-column:1/-1; }
@media (max-width:560px) { .t-modal-grid { grid-template-columns:1fr; } .t-modal-overlay { padding:0; } .t-modal { max-width:none; min-height:100%; border-left:none; border-right:none; } }
.t-modal-body input, .t-modal-body select, .t-modal-body textarea {
  font-family:"Space Mono", monospace; font-size:13px; padding:10px 12px; border:1px solid var(--t-border);
  background:var(--t-panel); color:var(--t-ink); outline:none; width:100%; box-sizing:border-box;
}
.t-modal-body textarea { min-height:90px; resize:vertical; }
.t-modal-submit-row { display:flex; align-items:center; gap:16px; margin-top:22px; flex-wrap:wrap; }
.t-modal-err { font-family:"Space Mono", monospace; font-size:12px; color:#C0392B; margin:0; }
.t-modal-hint { font-family:"Space Mono", monospace; font-size:11px; color:var(--t-dim); margin-top:18px; }
.t-modal-done { font-family:"Space Mono", monospace; font-size:13px; color:var(--t-ink); line-height:1.9; }
body.t-modal-open { overflow:hidden; }