/* Data's Alpha Circle trading tools: shared shell. Tokens from the live site CSS. */
:root{
  --bg:#05070d;--bg-2:#0b1220;--bg-3:#0f1a2e;--card:rgba(13,20,35,.78);--card-solid:#0d1423;--line:rgba(148,163,184,.16);--line-2:rgba(148,163,184,.28);
  --text:#e8eef7;--muted:#a7b3c6;--dim:#7d8aa0;--cyan:#67e8f9;--cyan-2:#22d3ee;--ink:#031319;--blue:#3b82f6;--green:#4ade80;--red:#fb7185;--amber:#fbbf24;
  --radius:14px;--radius-sm:10px;--wrap:1200px;
  --font:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.6 var(--font);overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(900px 500px at 15% -10%,rgba(34,211,238,.10),transparent 60%),radial-gradient(800px 600px at 110% 10%,rgba(59,130,246,.10),transparent 60%)}
img,svg{max-width:100%}
a{color:var(--cyan)}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--cyan);color:var(--ink);padding:10px 14px;border-radius:8px;font-weight:700}
.skip:focus{left:12px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.tk-wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.tk-num,.tk-mono{font-variant-numeric:tabular-nums}
.tk-mono{font-family:var(--mono)}

/* header */
.tk-header{position:sticky;top:0;z-index:50;background:rgba(5,7,13,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.tk-header-row{display:flex;align-items:center;gap:20px;min-height:64px}
.tk-brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:800;letter-spacing:-.01em;white-space:nowrap}
.tk-brand img{width:34px;height:auto}
.tk-nav{display:flex;gap:4px;margin-left:auto;overflow-x:auto;scrollbar-width:none}
.tk-nav::-webkit-scrollbar{display:none}
.tk-nav a{color:var(--muted);text-decoration:none;font-size:14px;font-weight:600;padding:8px 10px;border-radius:8px;white-space:nowrap}
.tk-nav a:hover,.tk-nav a[aria-current="page"]{color:var(--text);background:rgba(103,232,249,.08)}
.tk-nav a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--cyan)}
@media (max-width:900px){.tk-nav{display:none}.tk-header-cta{margin-left:auto}}
/* One header on every page (QA bug 10): the same name size everywhere and a one-line button. The button rules are
   scoped to .tk-header because .tk-btn comes later in this file and would win at equal specificity. */
.tk-header .tk-header-cta{white-space:nowrap}
@media (max-width:480px){.tk-header .tk-header-cta{font-size:14px;padding:0 14px}}
@media (max-width:374px){.tk-header-row{gap:8px}.tk-brand{font-size:13px;gap:6px}.tk-brand img{width:26px}.tk-header .tk-header-cta{font-size:13px;padding:0 10px}}

/* buttons */
.tk-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:10px;font:700 15px/1 var(--font);text-decoration:none;cursor:pointer;border:1px solid transparent;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s}
.tk-btn-solid{background:var(--cyan);color:var(--ink);box-shadow:0 0 0 0 rgba(103,232,249,.4),0 8px 24px -8px rgba(34,211,238,.55)}
.tk-btn-solid:hover{transform:translateY(-1px);box-shadow:0 0 0 4px rgba(103,232,249,.15),0 12px 28px -8px rgba(34,211,238,.7)}
.tk-btn-ghost{background:transparent;color:var(--text);border-color:var(--line-2)}
.tk-btn-ghost:hover{border-color:var(--cyan);color:var(--cyan)}
.tk-btn-sm{min-height:36px;padding:0 12px;font-size:13px;border-radius:8px}

/* hero */
/* top and bottom only: a padding shorthand here zeroed .tk-wrap's 20px sides and hero text ran to the screen edge */
.tk-hero{padding-top:48px;padding-bottom:18px;text-align:center}
.tk-eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);padding:8px 12px;border:1px solid rgba(103,232,249,.25);border-radius:8px;background:rgba(103,232,249,.06)}
.tk-hero h1{font-size:clamp(32px,5vw,56px);line-height:1.08;letter-spacing:-.03em;margin:0 auto 14px;max-width:900px;font-weight:800}
.tk-hero p.lead{color:var(--muted);font-size:clamp(16px,2vw,19px);max-width:720px;margin:0 auto}
.tk-hero-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 18px;margin-top:18px;color:var(--dim);font-size:13px}
.tk-hero-meta span{display:inline-flex;align-items:center;gap:6px}
.tk-hero-meta svg{color:var(--green)}

/* calculator layout */
.tk-calc{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:20px;align-items:start;margin:22px auto 0}
@media (max-width:980px){.tk-calc{grid-template-columns:1fr}}
.tk-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;position:relative}
.tk-card-glow{box-shadow:0 0 0 1px rgba(103,232,249,.08),0 30px 80px -40px rgba(34,211,238,.35)}
.tk-card h2,.tk-card h3{margin:0 0 4px;font-size:18px;letter-spacing:-.01em}
.tk-card .sub{color:var(--dim);font-size:13px;margin:0 0 14px}
.tk-inputs{position:sticky;top:80px}
@media (max-width:980px){.tk-inputs{position:static}}

/* form fields */
.tk-field{display:block;margin:0 0 12px;min-width:0}
.tk-calc>*,.tk-results>*{min-width:0}
.tk-field>span.lbl{display:flex;justify-content:space-between;gap:8px;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:6px}
.tk-field>span.lbl small{color:var(--dim);font-weight:500}
.tk-input{position:relative;display:flex;align-items:center}
.tk-input input{width:100%;min-width:0;min-height:46px;background:var(--bg-2);border:1px solid #5b6b84;border-radius:10px;color:var(--text);font:600 16px/1 var(--font);font-variant-numeric:tabular-nums;padding:0 14px;transition:border-color .2s,box-shadow .2s}
.tk-input input:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 3px rgba(103,232,249,.15)}
.tk-input .pre,.tk-input .suf{position:absolute;color:var(--dim);font-weight:600;font-size:14px;pointer-events:none}
.tk-input .pre{left:12px}.tk-input .pre+input{padding-left:26px}
.tk-input .suf{right:12px}.tk-input input:has(+.suf){padding-right:40px}
.tk-field[data-invalid] input{border-color:var(--red);box-shadow:0 0 0 3px rgba(251,113,133,.12)}
.tk-err{display:none;color:var(--red);font-size:12.5px;margin-top:5px}
.tk-field[data-invalid] .tk-err{display:block}
.tk-row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.tk-row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
@media (max-width:420px){.tk-row3{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tk-help{color:var(--dim);font-size:12.5px;margin:-4px 0 12px}

/* segmented control (radio inputs, no JS needed) */
.tk-seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--bg-2);border:1px solid #5b6b84;border-radius:10px;padding:3px;margin:0 0 12px}
.tk-seg input{position:absolute;opacity:0;pointer-events:none}
.tk-seg label{display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;border-radius:8px;font:700 14px/1 var(--font);color:var(--muted);cursor:pointer;transition:background .2s,color .2s}
.tk-seg input:checked+label{background:var(--bg-3);color:var(--text);box-shadow:inset 0 0 0 1px var(--line-2)}
.tk-seg input:checked+label.is-long,.tk-seg input:checked+label[data-tone="long"]{color:var(--green);box-shadow:inset 0 0 0 1px rgba(74,222,128,.35);background:rgba(74,222,128,.08)}
.tk-seg input:checked+label[data-tone="short"]{color:var(--red);box-shadow:inset 0 0 0 1px rgba(251,113,133,.35);background:rgba(251,113,133,.08)}
.tk-seg input:focus-visible+label{outline:2px solid var(--cyan);outline-offset:1px}

/* chips (rounded rectangles, never pills) */
.tk-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.tk-chip{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 10px;border-radius:8px;border:1px solid #5b6b84;background:var(--bg-2);color:var(--muted);font:600 13px/1 var(--font);cursor:pointer;transition:border-color .2s,color .2s,transform .2s var(--ease)}
.tk-chip:hover{border-color:var(--cyan);color:var(--text);transform:translateY(-1px)}
.tk-chip[aria-pressed="true"]{border-color:var(--cyan);color:var(--text);background:rgba(103,232,249,.08)}
.tk-chip img{width:18px;height:18px;border-radius:50%}

/* results */
.tk-results{display:grid;gap:14px}
.tk-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:700px){.tk-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tk-kpi{background:linear-gradient(180deg,rgba(15,26,46,.9),rgba(11,18,32,.9));border:1px solid var(--line);border-radius:12px;padding:14px;min-width:0;position:relative;overflow:hidden}
.tk-kpi::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(103,232,249,.07) 50%,transparent 70%);transform:translateX(-100%);pointer-events:none}
.tk-kpi.flash::after{animation:tk-sheen .9s var(--ease)}
@keyframes tk-sheen{to{transform:translateX(100%)}}
.tk-kpi .k{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--muted)}
.tk-kpi .k svg{color:var(--cyan);flex:none}
.tk-kpi .v{font:800 clamp(20px,2.6vw,28px)/1.15 var(--font);letter-spacing:-.02em;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.tk-kpi .n{font-size:12px;color:var(--dim);margin-top:4px}
.tk-kpi.hero{grid-column:1/-1;padding:18px;border-color:rgba(103,232,249,.25);background:radial-gradient(600px 160px at 0% 0%,rgba(103,232,249,.10),transparent 70%),linear-gradient(180deg,rgba(15,26,46,.95),rgba(11,18,32,.95))}
.tk-kpi.hero .v{font-size:clamp(30px,4.6vw,46px)}
.pos{color:var(--green)}.neg{color:var(--red)}.warn{color:var(--amber)}.cy{color:var(--cyan)}

/* odometer */
.odo{display:inline-flex;align-items:flex-end;line-height:1.15;height:1.15em;overflow:hidden;vertical-align:bottom}
.odo-col{display:inline-block;height:1.15em;overflow:hidden;width:.62em;text-align:center}
.odo-reel{display:flex;flex-direction:column;transition:transform 1s var(--ease)}
.odo-reel span{display:block;height:1.15em;line-height:1.15}
.odo-ch{display:inline-block;height:1.15em;line-height:1.15}

/* visual frame */
.tk-visual{background:linear-gradient(180deg,rgba(11,18,32,.96),rgba(5,7,13,.96));border:1px solid rgba(103,232,249,.18);border-radius:var(--radius);padding:14px;position:relative;overflow:hidden}
.tk-visual-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;font:700 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.tk-visual-head .live{display:inline-flex;align-items:center;gap:6px;color:var(--green)}
.tk-visual-head .live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(74,222,128,.6);animation:tk-ping 1.8s infinite}
@keyframes tk-ping{70%{box-shadow:0 0 0 8px rgba(74,222,128,0)}100%{box-shadow:0 0 0 0 rgba(74,222,128,0)}}
.tk-visual svg{display:block;width:100%;height:auto}
.tk-visual .caption{font-size:12px;color:var(--dim);margin:8px 2px 0}

/* warnings */
.tk-warn{display:none;gap:10px;align-items:flex-start;border:1px solid rgba(251,191,36,.35);background:rgba(251,191,36,.07);color:#fde68a;border-radius:12px;padding:12px 14px;font-size:14px}
.tk-warn.on{display:flex}
.tk-warn.bad{border-color:rgba(251,113,133,.4);background:rgba(251,113,133,.08);color:#fecdd3}
.tk-warn svg{flex:none;margin-top:2px}
.tk-warn ul{margin:0;padding-left:18px}

/* tables */
.tk-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.tk-table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.tk-table th,.tk-table td{padding:10px 12px;text-align:right;border-bottom:1px solid var(--line);white-space:nowrap}
.tk-table th:first-child,.tk-table td:first-child{text-align:left}
.tk-table th{color:var(--dim);font-weight:600;font-size:12.5px;background:rgba(15,26,46,.6)}
.tk-table tr:last-child td{border-bottom:0}
.tk-table tr.is-near td{background:rgba(103,232,249,.06)}
.tk-bar{display:inline-block;height:8px;border-radius:4px;background:linear-gradient(90deg,var(--cyan-2),var(--blue));transform-origin:left;transition:width .8s var(--ease)}

/* actions */
.tk-actions{display:flex;flex-wrap:wrap;gap:8px}
.tk-toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%) translateY(20px);opacity:0;background:var(--bg-3);border:1px solid var(--line-2);color:var(--text);padding:10px 14px;border-radius:10px;font-size:14px;transition:all .3s var(--ease);z-index:80;pointer-events:none}
.tk-toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

/* content sections */
.tk-section{padding:56px 0 8px}
.tk-section h2{font-size:clamp(24px,3.2vw,34px);letter-spacing:-.02em;line-height:1.15;margin:0 0 10px}
.tk-section p,.tk-section li{color:var(--muted)}
.tk-section .narrow{max-width:820px}
.tk-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:18px}
.tk-step{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}
.tk-step b{display:flex;align-items:center;gap:8px;color:var(--text);margin-bottom:6px}
.tk-step .no{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:7px;background:rgba(103,232,249,.12);color:var(--cyan);font:800 13px/1 var(--mono)}
.tk-formula{font-family:var(--mono);font-size:14px;background:var(--bg-2);border:1px solid var(--line);border-radius:10px;padding:12px 14px;overflow-x:auto;color:#cffafe;white-space:pre}
.tk-faq details{border:1px solid var(--line);border-radius:12px;background:var(--card);margin-bottom:10px}
.tk-faq summary{cursor:pointer;list-style:none;padding:16px 18px;font-weight:700;display:flex;justify-content:space-between;gap:12px}
.tk-faq summary::-webkit-details-marker{display:none}
.tk-faq summary::after{content:"+";color:var(--cyan);font-weight:800;transition:transform .3s var(--ease)}
.tk-faq details[open] summary::after{transform:rotate(45deg)}
.tk-faq details>div{padding:0 18px 16px;color:var(--muted)}

/* CTA band */
.tk-cta{margin:56px auto 0;border:1px solid rgba(103,232,249,.25);border-radius:18px;padding:32px 24px;text-align:center;background:radial-gradient(600px 200px at 50% 0%,rgba(34,211,238,.14),transparent 70%),var(--card-solid);position:relative;overflow:hidden}
.tk-cta h2{margin:0 0 8px;font-size:clamp(24px,3vw,32px);letter-spacing:-.02em}
.tk-cta p{color:var(--muted);max-width:640px;margin:0 auto 18px}
.tk-proof{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 18px;margin-top:14px;color:var(--muted);font-size:13px}
.tk-proof img{height:18px;width:auto;vertical-align:middle}
.tk-disclaimer{color:var(--dim);font-size:12.5px;text-align:center;margin:16px auto 0;max-width:760px}

/* tools hub cards */
.tk-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:22px}
.tk-tool{display:block;text-decoration:none;color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;transition:border-color .2s,transform .2s var(--ease)}
.tk-tool:hover{border-color:rgba(103,232,249,.45);transform:translateY(-2px)}
.tk-tool svg{color:var(--cyan)}
.tk-tool b{display:block;font-size:17px;margin:10px 0 4px}
.tk-tool span{color:var(--muted);font-size:14px}

/* sticky mobile CTA */
.tk-sticky{display:none}
@media (max-width:767px){
  body{padding-bottom:76px}
  .tk-sticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(5,7,13,.92);backdrop-filter:blur(12px);border-top:1px solid var(--line)}
  .tk-sticky .tk-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* stale results while inputs are invalid (still readable, clearly not current) */
.tk-results[data-stale] .tk-kpi .v,.tk-results[data-stale] .tk-visual svg,.tk-results[data-stale] .tk-table{opacity:.45;filter:saturate(.3)}
.tk-btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}

.tk-cta-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 22px;margin:4px auto 0}
.tk-cta-link{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--cyan);font-weight:700;text-decoration:none}
.tk-cta-link:hover{text-decoration:underline;text-underline-offset:4px}
.tk-eyebrow{display:none!important}
.tk-cta{margin-bottom:72px}

/* All Calculators section (every page) and the hub grid */
.cx-section{padding:64px 0 8px}
.cx-section h2{font-size:clamp(26px,3.4vw,38px);letter-spacing:-.02em;line-height:1.12;margin:0 0 8px}
.cx-lead{color:var(--muted);margin:0;max-width:680px;font-size:17px}
.cx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:24px}
@media (max-width:1060px){.cx-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:660px){.cx-grid{grid-template-columns:minmax(0,1fr)}}
.cx-card{display:flex;flex-direction:column;gap:10px;min-width:0;text-decoration:none;color:var(--text);background:linear-gradient(180deg,rgba(15,26,46,.94),rgba(8,13,24,.94));border:1px solid var(--line);border-radius:16px;padding:18px;position:relative;transition:border-color .25s,box-shadow .25s}
.cx-card:hover,.cx-card:focus-visible{border-color:rgba(103,232,249,.55)}
.cx-card[data-here]{border-color:rgba(103,232,249,.5);background:radial-gradient(420px 180px at 0% 0%,rgba(103,232,249,.10),transparent 70%),linear-gradient(180deg,rgba(15,26,46,.96),rgba(8,13,24,.96))}
.cx-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.cx-icon{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:12px;background:rgba(103,232,249,.09);border:1px solid rgba(103,232,249,.28);color:var(--cyan)}
.cx-here{display:inline-flex;align-items:center;gap:7px;color:var(--cyan);font-weight:700;font-size:13px}
.cx-here i{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 0 rgba(103,232,249,.6);animation:tk-ping 1.8s infinite}
.cx-preview{border-radius:12px;background:#060a12;border:1px solid rgba(148,163,184,.12);padding:8px;overflow:hidden}
.cx-preview svg{display:block;width:100%;height:auto}
.cx-card h3{font-size:19px;letter-spacing:-.01em;margin:6px 0 0;line-height:1.25}
.cx-q{color:var(--muted);margin:0;font-size:14.5px;line-height:1.5}
.cx-out{list-style:none;padding:0;margin:2px 0 0;display:grid;gap:7px;font-size:14px;color:#cbd5e1}
.cx-out li{position:relative;padding-left:18px}
.cx-out li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:2px;background:linear-gradient(135deg,var(--cyan),var(--blue))}
.cx-ex{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
.cx-ex img{width:22px;height:22px;border-radius:50%}
.cx-ex span{color:var(--dim);font-size:12.5px}
.cx-ex b{margin-left:auto;font:800 18px/1.15 var(--mono);font-variant-numeric:tabular-nums;color:var(--text)}
.cx-open{display:inline-flex;align-items:center;gap:6px;color:var(--cyan);font-weight:700;font-size:14px}
.cx-open svg{transition:transform .25s var(--ease)}
.cx-card:hover .cx-open svg{transform:translateX(4px)}
/* hub: the cards are the page */
.tk-hub .cx-section{padding-top:8px}
.tk-hub .cx-section>h2,.tk-hub .cx-lead{display:none}
.tk-hub .cx-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.tk-hub .cx-card{padding:22px}
.tk-hub .cx-card:first-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:auto auto auto auto 1fr auto;column-gap:28px}
.tk-hub .cx-card:first-child .cx-preview{grid-column:1;grid-row:1/7;align-self:stretch;display:flex;align-items:center}
.tk-hub .cx-card:first-child>*:not(.cx-preview){grid-column:2}
.tk-hub .cx-card h3{font-size:22px}
@media (max-width:860px){.tk-hub .cx-grid{grid-template-columns:minmax(0,1fr)}.tk-hub .cx-card:first-child{display:flex}}
/* calculator pages: last row centers instead of leaving an empty cell */
body:not(.tk-hub) .cx-grid{display:flex;flex-wrap:wrap;justify-content:center}
body:not(.tk-hub) .cx-card{flex:0 1 calc((100% - 32px) / 3)}
@media (max-width:1060px){body:not(.tk-hub) .cx-card{flex-basis:calc((100% - 16px) / 2)}}
@media (max-width:660px){body:not(.tk-hub) .cx-card{flex-basis:100%}}
/* no mouse-tracking effects anywhere (owner, Nov 1): neutralize any tilt or spotlight that could come back */
[data-tilt]{transform:none!important}[data-tilt]::after{display:none!important}

/* Nov 3 2026 8:05 AM AST owner: "the calculators were good earlier, I was just saying to make the top nav and footer the same". Only the tab row under the new nav is added. */
/* calculator tabs: a secondary row under the fixed site nav */
.tk-tabs{position:relative;margin-top:var(--nn-h0,68px);background:var(--bg);border-bottom:1px solid var(--line)}
.tk-tabs-row{position:relative;display:flex;align-items:stretch;gap:2px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tk-tabs-row::-webkit-scrollbar{display:none}
.tk-tab{position:relative;display:inline-flex;align-items:center;gap:9px;flex:none;min-height:54px;padding:0 14px;color:var(--muted);font-size:14px;font-weight:600;letter-spacing:-.005em;text-decoration:none;white-space:nowrap;transition:color .3s var(--ease)}
.tk-tab:first-child{padding-left:0}
.tk-tab svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;color:#5b6b84;transition:color .3s var(--ease)}
.tk-tab:hover{color:var(--text)}
.tk-tab:hover svg,.tk-tab[aria-current] svg{color:var(--cyan)}
.tk-tab[aria-current]{color:var(--text)}
.tk-tab[aria-current]::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;border-radius:2px;background:var(--cyan);box-shadow:0 0 12px #22d3ee80}
.tk-tab:first-child[aria-current]::after{left:0}
.tk-tab:focus-visible{outline-offset:-4px}
.tk-tabs-sep{flex:none;width:1px;margin:16px 10px;background:var(--line)}
@media (max-width:767px){
  .tk-tabs-row{width:100%;padding:0 20px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
  .tk-tab{min-height:50px;padding:0 12px;font-size:13.5px;gap:8px}
  .tk-tab::after{left:12px!important;right:12px}
  .tk-tab:first-child[aria-current]::after{left:0!important}
  .tk-tabs-row>.tk-tab:last-child{margin-right:24px}
  .tk-tabs-sep{margin:14px 6px}
}
/* closing CTA trust row: the site's trust line (official logos + stars) on one line, disclaimer below */
.tk-cta .dac-trust-line.tk-trust{margin-top:22px;justify-content:center}
.tk-cta .tk-disclaimer{display:block;margin-top:14px}
/* The tab row keeps the .tk-nav hook dac-tools.js uses; neutralize the old header-nav rules on it (they hid it under 900px). */
.tk-tabs.tk-nav{display:block;margin-left:0;gap:0;overflow:visible}
@media (max-width:900px){.tk-tabs.tk-nav{display:block}}
.tk-tabs.tk-nav a.tk-tab{padding:0 14px;border-radius:0;background:none;box-shadow:none;font-size:14px;color:var(--muted)}
.tk-tabs.tk-nav a.tk-tab:first-child{padding-left:0}
.tk-tabs.tk-nav a.tk-tab:hover,.tk-tabs.tk-nav a.tk-tab[aria-current]{color:var(--text);background:none;box-shadow:none}
@media (max-width:767px){.tk-tabs.tk-nav a.tk-tab{padding:0 12px;font-size:13.5px}}
/* Nov 3 12:09 PM AST owner: "make the FAQ match the style on the home page" (cx-08 Questions Before You Join look),
   "these make all full width" (Worked Example, Formula, FAQ use the full calculator width), and the closing block at the
   bottom matches the new site's closing (dac-final-cta, styled by dac-site.css). */
body .tk-section .narrow{max-width:none}
.tk-faq .tk-q{--ln:#94a3b821;--tx:#e8eef7;--cy:#67e8f9;--gl:inset 0 0 0 1px #67e8f9,0 0 28px #22d3ee4d;--ez:cubic-bezier(.16,1,.3,1);margin-top:28px}
.tk-faq .cx-sh{padding:5px;border-radius:17px;background:linear-gradient(#ffffff14,#ffffff04 30%);box-shadow:0 0 0 1px #ffffff0d,0 40px 90px -30px #000e}
.tk-faq .cx-co{position:relative;border-radius:12px;background:linear-gradient(#0f1a2e,#0a101c);box-shadow:inset 0 1px #ffffff12,inset 0 0 0 1px #94a3b81c;overflow:hidden;isolation:isolate}
.tk-faq .cx-co::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(#94a3b833 1px,#0000 0) 0 0/24px 24px;-webkit-mask:linear-gradient(#000,#0000 70%);mask:linear-gradient(#000,#0000 70%)}
.tk-faq .tk-q details{position:relative;margin:0;border:0;border-radius:0;background:none;box-shadow:inset 0 -1px var(--ln);transition:background .6s var(--ez)}
.tk-faq .tk-q details:last-child{box-shadow:none}
.tk-faq .tk-q details[open]{background:linear-gradient(90deg,#67e8f90f,#0000 60%)}
.tk-faq .tk-q summary{position:relative;display:flex;align-items:center;justify-content:flex-start;gap:18px;min-height:80px;padding:16px 64px 16px 90px;color:var(--tx);font-size:18px;font-weight:600;cursor:pointer;list-style:none;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2044%2044%22%3E%3Crect%20x%3D%22.5%22%20y%3D%22.5%22%20width%3D%2243%22%20height%3D%2243%22%20rx%3D%2212%22%20fill%3D%22%230d2a35%22%20stroke%3D%22rgba%28103%2C232%2C249%2C.25%29%22/%3E%3Cg%20transform%3D%22translate%2810%2010%29%22%20fill%3D%22none%22%20stroke%3D%22%2367e8f9%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22/%3E%3Cpath%20d%3D%22M9.6%209.4a2.5%202.5%200%201%201%203.4%202.4c-.6.3-1%20.8-1%201.5v.6M12%2016.9h.01%22/%3E%3C/g%3E%3C/svg%3E") no-repeat 28px center/44px 44px}
.tk-faq .tk-q details[open] summary{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2044%2044%22%3E%3Crect%20x%3D%22.5%22%20y%3D%22.5%22%20width%3D%2243%22%20height%3D%2243%22%20rx%3D%2212%22%20fill%3D%22%230d2a35%22%20stroke%3D%22%2367e8f9%22/%3E%3Cg%20transform%3D%22translate%2810%2010%29%22%20fill%3D%22none%22%20stroke%3D%22%23a5f3fc%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22/%3E%3Cpath%20d%3D%22M9.6%209.4a2.5%202.5%200%201%201%203.4%202.4c-.6.3-1%20.8-1%201.5v.6M12%2016.9h.01%22/%3E%3C/g%3E%3C/svg%3E")}
.tk-faq .tk-q summary::-webkit-details-marker{display:none}
.tk-faq .tk-q summary::before,.tk-faq .tk-q summary::after{content:"";position:absolute;top:50%;right:30px;width:14px;height:2px;background:#a7b3c6;transition:transform .6s var(--ez);color:transparent}
.tk-faq .tk-q summary::after{transform:rotate(90deg)}
.tk-faq .tk-q details[open] summary::after{transform:none}
.tk-faq .tk-q details>div{padding:0 40px 26px 90px;color:var(--muted);font-size:15px}
.tk-faq .tk-q details a{color:var(--cy)}
@media (max-width:767px){.tk-faq .tk-q summary{gap:14px;padding:14px 48px 14px 70px;font-size:16px;background-position:16px center;background-size:40px 40px}.tk-faq .tk-q summary::before,.tk-faq .tk-q summary::after{right:20px}.tk-faq .tk-q details>div{padding:0 18px 22px}}
.acc{color:var(--cyan)}
.tk-final{margin-top:104px}
.tk-final h2 .acc{color:var(--cyan)}
body .tk-final .final-join{transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s ease}
body .tk-final .final-join:hover{border-color:#a5f3fc}
.tk-final .final-disclaimer{max-width:62ch;margin:20px auto 0;color:var(--muted);font-size:12px;line-height:1.8}
@media (max-width:767px){.tk-final{margin-top:72px}.tk-final .final-disclaimer{font-size:11px}}
/* .tk-section's padding shorthand zeroed .tk-wrap's side padding, so on phones those sections touched the screen edge. */
.tk-section.tk-wrap{padding-left:20px;padding-right:20px}
/* Nov 3 12:18 PM AST owner: "fix the nav for inner page, it currently shows 2". The calculator tab row is gone; one
   site nav like every other page. Content clears the fixed nav instead of the tab row doing it. */
/* (old calculator header is back and sits in the page flow, so no fixed-nav offset) */
/* Nov 3 2:31 PM AST owner: "inner pages should have the same logo": the calculator nav brand is the site wordmark. */
.tk-brand .wm06{font-size:22px;font-weight:800}
/* Review fix (Astra P0-1): at 390 px the wordmark plus the Join button needed ~431 px inside a 350 px content box and the
   button clipped. Phones get a smaller logo and wordmark, a tighter row, and a brand that can shrink; the button never does. */
.tk-header .tk-header-cta{flex:none}
@media (max-width:480px){
  .tk-header-row{gap:10px}
  .tk-brand{min-width:0;overflow:hidden;gap:8px}
  .tk-brand img{width:28px;flex:none}
  .tk-brand .wm06{font-size:clamp(13px,4.4vw,19px);letter-spacing:.02em}
  .tk-header .tk-header-cta{font-size:13px;padding:0 12px;min-height:40px}
}

/* CryptoData Nov 4: the site's own nav on every page; the calculator tabs sit in a bar under it. */
.tk-subnav{padding-top:68px;border-bottom:1px solid #94a3b829;background:#05070d}
.tk-subnav .tk-header-row{justify-content:center;min-height:52px}
.tk-subnav .tk-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}