@font-face{font-family:'Open Runde';src:url('./OpenRunde-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Open Runde';src:url('./OpenRunde-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Open Runde';src:url('./OpenRunde-Semibold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Open Runde';src:url('./OpenRunde-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
:root{color-scheme:light;--bg:#f5f6fa;--surface:#fff;--surface2:#eceff5;--ink:#151923;--muted:#535d70;--line:#dce2ed;--blue:#0866ff;--blue-soft:#e1edff;--mint:#007a43;--mint-soft:#d4f5e3;--coral:#c63718;--coral-soft:#ffe2d6;--purple:#6b2dde;--purple-soft:#ede1ff;--shadow:0 3px 16px #1b254005}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.45 'Open Runde',sans-serif;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:var(--blue);text-decoration:none}button{border:0;color:inherit;background:none}button:disabled{cursor:not-allowed;opacity:.42}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--blue);outline-offset:4px}h1,h2,h3,p{margin:0}h1,h2,.number,.price{font-family:'Open Runde',sans-serif}h1{font-size:32px;letter-spacing:-1.15px;line-height:1.15;font-weight:700}h2{font-size:21px;line-height:1.25;letter-spacing:-.5px;font-weight:700}h3{font-size:16px;letter-spacing:-.2px}small,.small{font-size:14px}.muted{color:var(--muted)}.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.shell{max-width:1080px;margin:auto;padding:24px 32px 36px}.row{display:flex;align-items:center;gap:10px}.between{justify-content:space-between}.channel{display:flex;align-items:center;gap:18px;margin-bottom:25px}.avatar{width:76px;height:76px;border-radius:26px;object-fit:cover;background:#222;box-shadow:0 0 0 5px var(--surface)}.channel-meta{display:flex;gap:10px;align-items:center;margin-top:8px;flex-wrap:wrap;font-size:14px}.dot{width:3px;height:3px;background:var(--muted);border-radius:50%}.source-mark{font-size:14px;color:var(--muted);background:var(--surface);padding:5px 9px;border-radius:20px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px}.segments{display:flex;gap:4px;background:var(--surface2);border-radius:24px;padding:4px}.nav{background:var(--surface);padding:5px}.segments button{border-radius:20px;min-height:36px;padding:7px 17px;font-weight:600;font-size:14px;white-space:nowrap;transition:background .18s,color .18s}.segments button.active{background:var(--blue);color:#fff}.nav button.active{background:var(--blue);color:#fff}.period button.active{background:var(--surface);color:var(--ink);box-shadow:0 2px 5px #0000000b}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}.metric{border-radius:25px;padding:18px 20px;position:relative;text-align:left;min-width:0;border:2px solid transparent}.metric.blue{--metric-color:#0866ff;background:var(--metric-color);--accent:#fff}.metric.mint{--metric-color:#32d478;background:var(--metric-color);--accent:#fff}.metric.coral{--metric-color:#ff693c;background:var(--metric-color);--accent:#fff}.metric.purple{--metric-color:#ac7aff;background:var(--metric-color);--accent:#fff}button.metric:hover{border-color:var(--accent)}button.metric.selected{border-color:var(--accent)}.metric-label{font-size:14px;font-weight:600;color:var(--accent);display:flex;align-items:center;gap:7px}.metric-label .icon{width:17px;height:17px}.number{font-size:32px;font-weight:700;letter-spacing:-1.2px;line-height:1.2;margin:13px 0 3px}.metric-note{color:var(--muted);font-size:14px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:18px;align-items:start}.card{background:var(--surface);border-radius:28px;padding:23px;box-shadow:var(--shadow)}.card+.card{margin-top:16px}.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:18px}.section-head p{font-size:14px;color:var(--muted);margin-top:5px}.chip{border-radius:18px;background:var(--surface2);font-size:14px;padding:7px 10px;color:var(--muted);white-space:nowrap}.chart-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px}.chart-controls .segments button{font-size:14px;padding:6px 10px;min-height:30px}.toggle{display:flex;align-items:center;gap:7px;cursor:pointer;font-size:14px;color:var(--muted);white-space:nowrap}.toggle input{appearance:none;width:52px;height:24px;flex:0 0 52px;background:#7a8598;border-radius:99px;position:relative;margin:0;cursor:pointer;transition:background .2s}.toggle input:before{content:'';position:absolute;width:28px;height:18px;left:3px;top:3px;border-radius:99px;background:#fff;box-shadow:0 1px 3px #12243933;transition:transform .2s}.toggle input:checked{background:#25cf70;box-shadow:inset 0 0 0 1px #008f45}.toggle input:checked:before{transform:translateX(18px)}.chart-area{position:relative;padding-left:33px;margin:8px 0 0}.axis{position:absolute;left:0;top:0;bottom:0;display:flex;flex-direction:column;justify-content:space-between;font-size:14px;color:var(--muted)}.bars{height:180px;display:flex;align-items:end;gap:5px;position:relative;background:repeating-linear-gradient(to top,transparent 0,transparent calc(50% - 1px),var(--line) calc(50% - 1px),var(--line) 50%)}.bar{height:100%;flex:1;min-width:3px;position:relative;border-radius:6px;display:flex;align-items:end;padding:0;z-index:1}.bar span{height:var(--height);width:100%;border-radius:5px 5px 3px 3px;background:var(--blue);opacity:1;min-height:3px;transition:height .25s,opacity .15s}.bar:hover span,.bar.selected span{opacity:1}.bars.coral .bar span{background:#ff5b2e}.median-line{position:absolute;left:0;right:0;border-top:1px dashed var(--muted);bottom:var(--median);pointer-events:none;z-index:2;opacity:.6}.dates{display:flex;justify-content:space-between;font-size:14px;color:var(--muted);margin:9px 0 14px;padding-left:33px}.legend{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--muted);margin-bottom:17px}.dash{width:15px;border-top:1px dashed var(--muted)}.post-detail{background:var(--surface2);border-radius:17px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 15px;min-height:60px}.post-detail b{font-size:14px;display:block}.post-detail p{font-size:14px;color:var(--muted);margin-top:3px}.link-button{display:inline-flex;align-items:center;justify-content:center;gap:5px;border-radius:20px;min-height:36px;padding:8px 12px;background:var(--surface);font-size:14px;font-weight:650;white-space:nowrap}.link-button .icon{width:13px;height:13px}.chart-foot{font-size:14px;color:var(--muted);margin-top:14px;line-height:1.5}.mini-header{display:flex;align-items:center;gap:8px;color:var(--mint);font-weight:650;font-size:14px}.price{font-size:38px;font-weight:700;letter-spacing:-1.5px;margin:15px 0 4px;line-height:1.2}.price small{font-size:18px;letter-spacing:-.3px}.primary{border-radius:22px;background:var(--blue);color:white;min-height:44px;padding:11px 18px;font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:center;gap:8px;width:100%}.secondary{background:var(--surface2);color:var(--ink)}.cost-side .primary{background:#32d478;color:#07351b;margin-top:18px}.summary-row{display:flex;justify-content:space-between;font-size:14px;margin-top:13px;gap:8px}.summary-row span{color:var(--muted)}.divider{height:1px;background:var(--line);margin:16px 0}.quality-button{display:flex;width:100%;align-items:center;text-align:left;gap:11px}.quality-button .icon{color:var(--blue)}.quality-button b{font-size:14px;display:block}.quality-button small{font-size:14px;color:var(--muted)}.quality-button>span{flex:1}.quality-button .arrow{font-size:23px;font-weight:300;color:var(--muted)}.quality-body{margin-top:15px;color:var(--muted);font-size:14px;line-height:1.6}.quality-body ul{padding-left:17px;margin:10px 0}.foot{display:flex;align-items:center;justify-content:space-between;margin-top:24px;color:var(--muted);font-size:14px;gap:10px}.foot a{color:var(--muted)}.empty{padding:36px 0;text-align:center;color:var(--muted);font-size:14px}.posts-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.sort-select{border:0;background:var(--surface2);border-radius:18px;padding:10px 14px;color:var(--ink);font-size:14px;max-width:180px}.post-list{display:grid;gap:8px}.post-row{display:flex;align-items:center;gap:12px;padding:12px 13px;background:var(--surface2);border-radius:19px}.post-index{width:33px;height:33px;display:grid;place-items:center;border-radius:12px;background:var(--surface);color:var(--muted);font-weight:600;font-size:14px}.post-info{flex:1;min-width:0}.post-info b{font-size:14px}.post-info small{display:block;color:var(--muted);margin-top:3px}.post-value{text-align:right;font-size:14px;font-weight:700}.post-value small{display:block;font-size:14px;font-weight:400;color:var(--muted);margin-top:3px}.post-row .icon{width:14px}.pagination{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font-size:14px;color:var(--muted)}.pagination button{border-radius:20px;background:var(--surface2);padding:8px 15px;min-height:36px}.calc-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:18px}.calc-hero{background:#32d478;padding:24px;border-radius:24px;margin:20px 0}.calc-hero .price{font-size:51px;color:#07351b}.calc-hero small{color:#07351b}.calc-input{width:100%;border:1px solid var(--line);background:var(--surface2);color:var(--ink);border-radius:18px;padding:13px 16px;min-height:48px;font-weight:650;font-size:18px;outline-offset:2px}.input-wrap{position:relative}.input-wrap span{position:absolute;right:16px;top:14px;color:var(--muted);pointer-events:none}.input-wrap input{padding-right:42px}.input-label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}.range{appearance:none;display:block;width:100%;height:44px;margin:14px 0 8px;background:transparent;cursor:pointer;--progress:0%}.presets{display:flex;gap:7px;flex-wrap:wrap}.presets button{min-height:34px;padding:7px 13px;font-size:14px;border-radius:18px;background:var(--surface2)}.presets button.active{background:var(--mint-soft);color:var(--mint);font-weight:650}.method{font-size:14px;color:var(--muted);margin-top:18px;line-height:1.5}.comparison{border-radius:20px;background:var(--purple-soft);padding:18px;margin-top:18px}.comparison .number{font-size:29px;margin:6px 0;color:var(--purple)}.tag{display:inline-flex;background:var(--mint-soft);color:var(--mint);border-radius:14px;padding:5px 9px;font-size:14px;font-weight:600}.tag.amber{background:var(--coral-soft);color:var(--coral)}.unavailable{padding:14px 0;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font-size:14px}.unavailable:last-child{border:0}.unavailable span{color:var(--muted);font-size:14px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.view{animation:enter .25s ease-out}@keyframes enter{from{opacity:.6;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:760px){.shell{max-width:540px;padding:20px 18px 28px}.channel{gap:14px;margin-bottom:22px}.avatar{width:64px;height:64px;border-radius:22px}h1{font-size:27px;letter-spacing:-.9px}.channel-meta{gap:7px;font-size:14px}.source-mark{display:none}.toolbar{flex-direction:column;align-items:stretch;gap:12px}.toolbar .segments{width:100%}.toolbar .segments button{flex:1}.metrics{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.metric{padding:15px 16px;border-radius:23px}.number{font-size:29px;margin-top:10px}.layout,.calc-layout{grid-template-columns:1fr;gap:14px}.card{padding:20px;border-radius:25px}.card+.card{margin-top:14px}.chart-controls{gap:6px}.chart-controls .segments button{padding:6px 8px}.toggle{font-size:14px}.bars{height:155px;gap:4px}.section-head h2{font-size:19px}.post-detail{padding:12px}.foot{font-size:14px;align-items:flex-start}.cost-side .price{font-size:36px}.cost-side .summary-row{display:none}.post-row{gap:8px;padding:11px}.post-index{width:29px;height:29px}.post-value{font-size:14px}.posts-head h2{font-size:20px}.sort-select{max-width:155px;padding:10px;font-size:14px}.calc-hero .price{font-size:45px}}
@media(max-width:350px){.shell{padding:16px 12px}.card{padding:16px}.channel-meta{font-size:14px}h1{font-size:24px}.metric{padding:14px 12px}.metric-note{font-size:14px}.chart-controls{align-items:start;flex-direction:column}.post-index{display:none}}

/* Readable captions; secondary information stays in the data disclosure. */
.chart-controls{flex-wrap:wrap}.metric-label{line-height:1.4}.metric-note{margin-top:5px}.legend{flex-wrap:wrap}.foot{flex-wrap:wrap;line-height:1.6}.post-detail{flex-wrap:wrap}.quality-button b{font-size:16px}.link-button{min-height:42px}.segments button{min-height:40px}.chart-controls .segments button{min-height:36px}.chip{font-size:14px}.source-mark{font-size:14px}

/* Solid, elongated controls with clear interactive states. */
.toggle{min-height:44px;gap:10px;color:var(--ink);font-weight:550}
.segments button{min-height:44px}
.chart-controls{gap:12px}
.chart-controls .segments button{min-height:40px;padding-inline:12px}
.segments button[data-action="metric:reactions"].active{background:var(--coral)}
.metric .number{color:var(--accent)}
button.metric{display:flex;flex-direction:column;transition:box-shadow .18s,border-color .18s}
button.metric:hover{box-shadow:0 4px 14px #17285012}
button.metric.selected{background:var(--metric-color);border-color:var(--metric-color);box-shadow:inset 0 0 0 2px #fff}
.metric-action{display:flex;align-items:center;justify-content:space-between;gap:6px;width:100%;margin-top:14px;font-size:14px;line-height:1.35;font-weight:650;color:var(--accent)}
.metric-action .icon{width:18px;height:18px;flex:0 0 18px}
.metric.selected .metric-action{font-weight:700}
.metric-note{color:var(--accent)}
.metric-action+*{margin-top:0}
#metric-chart:focus{outline:none}
.range::-webkit-slider-runnable-track{height:12px;border-radius:99px;background:linear-gradient(to right,#25cf70 0 var(--progress),#d0d8e3 var(--progress) 100%)}
.range::-webkit-slider-thumb{appearance:none;width:38px;height:28px;margin-top:-8px;border-radius:99px;background:#fff;border:2px solid var(--mint);box-shadow:0 2px 5px #17382a29}
.range::-moz-range-track{height:12px;border-radius:99px;background:#d0d8e3}
.range::-moz-range-progress{height:12px;border-radius:99px;background:#25cf70}
.range::-moz-range-thumb{width:34px;height:24px;border-radius:99px;background:#fff;border:2px solid var(--mint);box-shadow:0 2px 5px #17382a29}
.presets button{min-height:40px}
.presets button.active{background:#32d478;color:#07351b}
.primary{font-size:15px;min-height:48px}
.section-head,.posts-head{flex-wrap:wrap}
.quality-button>.arrow{flex:0 0 auto;margin-left:auto}
.metric .number{white-space:nowrap}
@media(max-width:350px){.metric .number{font-size:24px}}
@media(max-width:390px){.toolbar .segments button{padding-inline:10px}.metric{padding:14px 12px}.metric-action{gap:4px}.post-row{gap:6px}.post-index{display:none}}

/* Vivid cards retain at least 4.5:1 contrast for their text. */
.metric-action{padding:9px 10px;border-radius:16px;background:#fff;color:#421607}
.metric.blue .metric-action{color:#0758df}
.metric-action .icon{width:16px;height:16px;flex-basis:16px}
.metric-note,.metric-label{opacity:1}
.bar.selected span{background:#003cb8;box-shadow:0 0 0 2px #fff,0 0 0 4px #003cb8}
.bars.coral .bar.selected span{background:#bd300d;box-shadow:0 0 0 2px #fff,0 0 0 4px #bd300d}
.calc-hero{color:#07351b}
.calc-hero .muted,.calc-hero .small,.calc-hero .eyebrow{color:#07351b}
@media(max-width:390px){.metric-action{padding:8px;align-items:center}}

/* Large editorial type, compact controls, and separated chart axes. */
body{font-size:16px}
h1{font-size:44px;font-weight:700;letter-spacing:-1.8px;line-height:1.02}
h2,.section-head h2,.posts-head h2{font-size:32px;font-weight:700;line-height:1.05;letter-spacing:-1px}
h3{font-size:18px;font-weight:700}
.number{font-size:44px;font-weight:700;letter-spacing:-1.5px;line-height:1.06}
.metric .number{font-size:44px;margin-top:18px}
.metric .number .approx{font-size:20px;vertical-align:middle;margin-right:5px;letter-spacing:0}
.metric-label{font-size:16px;font-weight:650}
.metric-note{font-size:15px;margin-top:9px}
.metric-action{margin-top:18px;font-size:15px;min-height:42px}
.metric .number small{font-size:21px;letter-spacing:-.3px}
.section-head p,.mini-header,.section-copy{font-size:16px}
.section-copy{color:var(--muted);margin:14px 0 24px;line-height:1.5}
.chart-area{display:grid;grid-template-columns:68px minmax(0,1fr);gap:12px;position:relative;padding:0;margin-top:20px}
.axis{position:static;min-width:0;font-size:14px;text-align:right;line-height:1;white-space:nowrap;padding:0 0 1px}
.bars{min-width:0;height:210px;gap:5px;align-self:stretch}
.bar{min-width:0}
.bar.selected span{box-shadow:inset 0 0 0 2px #fff,0 0 0 1px #003cb8}
.bars.coral .bar.selected span{box-shadow:inset 0 0 0 2px #fff,0 0 0 1px #bd300d}
.dates{margin:12px 0 22px;padding-left:80px;gap:8px;font-size:14px}
.dates span{white-space:nowrap}
.post-detail{gap:14px}
.post-detail b{font-size:16px}
.post-detail p{font-size:15px;line-height:1.5;margin-top:4px}
.cost-side .price{font-size:46px;font-weight:700;line-height:1.08;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;margin:24px 0 12px}
.amount-prefix{font-size:.58em;align-self:center}
.price .amount-number{min-width:0;overflow-wrap:anywhere}
.price small{font-size:.43em;letter-spacing:0;font-weight:700}
.calc-hero{background:#0866ff;color:#fff;padding:28px;border-radius:28px;margin:24px 0}
.calc-hero .price{font-size:60px;font-weight:700;color:#fff;letter-spacing:-2px;display:flex;align-items:baseline;flex-wrap:wrap;gap:7px;line-height:1.02;margin:28px 0 22px}
.calc-hero small,.calc-hero .mini-header,.calc-hero .muted,.calc-hero .small,.calc-hero .eyebrow{color:#fff}
.calc-hero #formula{display:block;font-size:16px;line-height:1.5;letter-spacing:0;padding-top:18px;border-top:1px solid #ffffff55}
.calc-input{font-size:24px;font-weight:700;min-height:62px;padding:15px 18px;border:2px solid transparent;border-radius:20px}
.calc-input:focus-visible{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px #0866ff20}
.input-wrap input{padding-right:86px}
.input-wrap span{top:50%;right:16px;transform:translateY(-50%);background:#fff;padding:5px 9px;border-radius:10px;font-size:15px;font-weight:650;color:var(--ink)}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}
input[type=number]{appearance:textfield;-moz-appearance:textfield}
.input-label{font-size:16px;font-weight:650}
.input-error{font-size:15px;line-height:1.4;color:#bc231c;margin-top:7px}
.input-error:empty{display:none}
.currency-control{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:24px;font-size:16px;font-weight:650;flex-wrap:wrap}
.select-wrap{position:relative;display:inline-flex;max-width:100%}
.select-wrap select{appearance:none;border:0;border-radius:18px;background:#e5edff;color:#0049be;font:650 16px/1.2 inherit;padding:14px 42px 14px 16px;min-height:48px;max-width:100%;cursor:pointer;font-family:inherit;font-size:16px;font-weight:650}
.select-wrap svg{position:absolute;right:15px;top:50%;transform:translateY(-50%);width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none;color:#0049be}
.comparison{background:#7d3ee2;color:#fff;padding:24px;border-radius:24px;margin-top:24px}
.comparison .number{font-size:38px;line-height:1.1;color:#fff;margin:14px 0;font-weight:700;overflow-wrap:anywhere}
.comparison .small,.comparison .muted{color:#fff;font-size:16px}
.rate-note{font-size:15px;color:var(--muted);margin-top:22px}
.data-facts{margin-top:24px}
.data-facts section{padding:18px 0;border-top:1px solid var(--line)}
.data-facts h3{color:var(--ink);line-height:1.25;margin-bottom:9px}
.data-facts p{font-size:16px;line-height:1.55;color:var(--muted)}
.data-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.data-links a{display:inline-flex;padding:9px 12px;background:var(--blue-soft);border-radius:14px;font-size:15px;font-weight:650}
.period-form{background:var(--surface);border-radius:24px;padding:22px;margin:0 0 20px}
.period-form label{display:block;font-size:18px;font-weight:700;margin-bottom:14px}
.period-entry{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.period-entry input{width:110px;min-height:48px;font:700 24px/1.2 inherit;font-family:inherit;font-size:24px;font-weight:700;border:1px solid var(--line);border-radius:16px;padding:10px 14px;background:var(--surface2)}
.period-entry .primary{width:auto;min-width:120px}
.cancel-period{min-height:44px;padding:8px 16px;color:var(--muted);font-size:16px}
.period-status{padding:12px 16px;border-radius:16px;background:#fff0c2;color:#704600;font-size:15px;font-weight:600;margin-bottom:18px}
@media(max-width:760px){h1{font-size:34px}h2,.section-head h2,.posts-head h2{font-size:28px}.metric .number{font-size:36px}.metric-label{font-size:15px}.metric-action{font-size:14px}.metric-note{font-size:14px}.channel-meta{font-size:15px}.chart-area{grid-template-columns:59px minmax(0,1fr);gap:10px}.bars{height:190px;gap:3px}.dates{padding-left:69px;font-size:14px}.calc-hero{padding:24px}.calc-hero .price{font-size:48px}.cost-side .price{font-size:44px}.period button{padding-inline:9px}.select-wrap select{width:100%}.currency-control{align-items:stretch}.currency-control .select-wrap{width:100%}}
@media(max-width:390px){.toolbar .period button{padding-inline:7px}.metric .number{font-size:32px}.metric .number .approx{font-size:17px;margin-right:3px}.metric-label{font-size:14px}.metric-label .icon{width:15px;height:15px}.metric-action{font-size:14px;padding:8px}.calc-hero .price{font-size:43px}.chart-area{grid-template-columns:54px minmax(0,1fr);gap:9px}.axis{font-size:14px}.dates{padding-left:63px;font-size:14px}}
@media(max-width:350px){h1{font-size:29px}.metric .number{font-size:28px}.metric .number .approx{font-size:14px;margin-right:2px}.metric-label{gap:4px}.metric-label .icon{display:none}.calc-hero{padding:20px}.calc-hero .price{font-size:38px}.bars{gap:2px}.chart-controls .segments button{padding-inline:10px}}

/* Short, optional motion that does not replay on every chart selection. */
@keyframes card-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes bars-arrive{from{transform:scaleY(.82);opacity:.25}to{transform:scaleY(1);opacity:1}}
@keyframes details-arrive{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
.view[data-motion="enter"] .metric,.view[data-motion="enter"] .card{animation:card-arrive .38s cubic-bezier(.2,.7,.2,1) both}
.view[data-motion="enter"] .metric:nth-child(2){animation-delay:35ms}.view[data-motion="enter"] .metric:nth-child(3){animation-delay:70ms}.view[data-motion="enter"] .metric:nth-child(4){animation-delay:105ms}
.view[data-motion="enter"] .bar span,.view[data-motion="chart"] .bar span{animation:bars-arrive .4s cubic-bezier(.2,.7,.2,1) both;transform-origin:bottom}
.data-facts,.period-form{animation:details-arrive .25s ease-out both}
.primary,.presets button,.segments button,.link-button,.metric,.post-row,.currency-control select{transition:background .2s,color .2s,box-shadow .2s,transform .18s,border-color .18s}
@media(hover:hover){.primary:hover,.link-button:hover{transform:translateY(-2px);box-shadow:0 5px 14px #06346f22}.metric:hover{transform:translateY(-2px)}.post-row:hover{background:var(--blue-soft)}.bar:hover span{filter:brightness(1.1)}.toggle input:hover{box-shadow:0 0 0 4px #24cb6c1f}}
.primary:active,.segments button:active,.presets button:active,.metric:active{transform:scale(.98)}
.range::-webkit-slider-thumb{transition:box-shadow .18s,border-color .18s}
.range:active::-webkit-slider-thumb{box-shadow:0 0 0 5px #24cb6c26}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Stable card sizing and matching nested curves. */
.card{border-radius:32px;min-width:0}
.metric{border-radius:38px;padding:18px;container-type:inline-size}
.metric-action{border-radius:18px}
.metric .number{font-size:clamp(24px,23cqw,44px)}
.metric .number .approx{font-size:clamp(14px,9cqw,20px)}
.metric-label{font-size:clamp(14px,8cqw,16px)}
.cost-side{background:#0866ff;color:#fff}
.cost-side .mini-header,.cost-side .price,.cost-side .small,.cost-side .muted{color:#fff}
.cost-side .primary{background:#fff;color:#0758df;border-radius:22px}
.calc-input,.period-entry input,.select-wrap select{border-radius:24px}
.toggle input{transition:background .28s ease,box-shadow .28s ease}
.toggle input:before{transition:transform .28s cubic-bezier(.22,.75,.2,1)}
@media(min-width:761px) and (max-width:980px){.metrics{grid-template-columns:1fr 1fr}.layout{grid-template-columns:1fr}.metric .number{font-size:44px}}
@media(max-width:760px){.metric{padding:14px;border-radius:34px}.metric-action{border-radius:18px}.card{border-radius:30px}.metric .number{font-size:clamp(24px,23cqw,40px)}}

/* One sliding selection surface across tabs, periods and page numbers. */
.segments{position:relative;isolation:isolate}
.segments.pill-track::before{content:'';position:absolute;z-index:0;top:4px;height:calc(100% - 8px);left:var(--pill-left);width:var(--pill-width);border-radius:999px;background:var(--pill-color,#0866ff);box-shadow:0 2px 6px #0d255218;pointer-events:none}
.segments.pill-animate::before{transition:left .34s cubic-bezier(.22,.8,.23,1),width .34s cubic-bezier(.22,.8,.23,1),background-color .25s}
.segments.pill-track button{position:relative;z-index:1;background:transparent!important;box-shadow:none!important}
.segments.pill-track button.active{color:var(--pill-ink,#fff)}
.segments.pill-track button:active{transform:none}
/* Searchable, animated choice sheets replace browser dropdowns. */
.picker-trigger{display:flex;align-items:center;gap:12px;min-height:54px;border:0;background:#e5edff;color:#0758df;border-radius:24px;padding:12px 16px;font-size:16px;font-weight:650;text-align:left;transition:background .2s,transform .2s}
.picker-trigger:hover{background:#d8e6ff}.picker-trigger:active{transform:scale(.985)}
.currency-trigger{width:100%;margin-top:20px;padding:12px 16px;background:#edf3ff}
.currency-trigger>span:not(.currency-badge){flex:1}
.currency-trigger b{display:block;font-size:18px;color:#0758df}
.currency-trigger small{display:block;font-size:15px;color:#4c5e7a;margin-top:2px}
.currency-badge{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;flex:0 0 42px;border-radius:50%;background:var(--coin-color);color:#fff;font-size:25px;font-weight:700;line-height:1}
.picker-trigger>.icon{width:18px;height:18px;flex:0 0 18px}
.sort-trigger{font-size:15px;gap:9px;min-height:46px;padding:10px 14px;border-radius:22px}
.sort-trigger span{white-space:nowrap}
.picker-dialog{border:0;border-radius:32px;background:#fff;padding:26px;width:min(440px,calc(100vw - 32px));max-height:85dvh;color:#151923;box-shadow:0 22px 80px #12285e3d;overflow:hidden}
.picker-dialog::backdrop{background:#1323445c;animation:backdrop-in .22s ease-out both}
.picker-dialog[open]{animation:picker-in .25s cubic-bezier(.2,.8,.2,1) both}
.picker-dialog.picker-closing{animation:picker-out .15s ease-in both}
.picker-dialog.picker-closing::backdrop{animation:backdrop-out .15s ease-in both}
.picker-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}
.picker-header h2{font-size:32px;font-weight:700;letter-spacing:-1px}
.icon-button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;width:44px;height:44px;flex:0 0 44px;padding:0;border-radius:50%;background:#eef1f7;color:#40516d}
.icon-button .icon{width:20px;height:20px}
.picker-search{display:flex;align-items:center;gap:10px;border-radius:20px;background:#eef2f8;padding:13px 15px;margin-bottom:16px;color:#627089}
.picker-search input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:17px}
.picker-search:focus-within{box-shadow:inset 0 0 0 2px #0866ff}
.picker-list{max-height:54dvh;overflow:auto;overscroll-behavior:contain;padding-right:3px}
.picker-group+.picker-group{margin-top:22px}
.picker-group h3{font-size:16px;color:#596980;margin:12px 12px 10px;letter-spacing:0}
.picker-option{display:flex;width:100%;align-items:center;gap:14px;border-radius:22px;padding:12px;margin:4px 0;text-align:left;color:#151923;min-height:68px;transition:background .18s,transform .18s}
.picker-option:hover{background:#eef4ff}.picker-option:active{transform:scale(.98)}
.picker-option>span:not(.currency-badge):not(.sort-icon){flex:1;min-width:0}
.picker-option b{display:block;font-size:18px;font-weight:700}
.picker-option small{display:block;font-size:15px;color:#596980;margin-top:2px}
.picker-option.chosen{background:#0866ff;color:#fff}
.picker-option.chosen small{color:#fff}
.picker-option.chosen .currency-badge{box-shadow:0 0 0 2px #ffffffa6}
.picker-option>.icon:last-child{margin-left:auto;width:22px;height:22px;flex:0 0 22px}
.sort-icon{display:flex;align-items:center;justify-content:center;width:42px;height:42px;background:#e5edff;color:#0866ff;border-radius:15px;flex:0 0 42px}
.picker-empty{padding:24px;text-align:center;color:var(--muted);font-size:17px}
@keyframes picker-in{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
@keyframes picker-out{to{opacity:0;transform:translateY(12px) scale(.98)}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}@keyframes backdrop-out{to{opacity:0}}
.post-row{display:flex;align-items:center;gap:14px;padding:17px 18px;background:#f0f5ff;border:1px solid #e5edff;border-radius:24px;margin-top:9px;color:var(--ink)}
.post-info{flex:1;min-width:0}
.post-info b{font-size:18px;font-weight:700;line-height:1.2}
.post-info small{font-size:15px;color:#586980;margin-top:6px;display:block}
.post-numbers{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.post-views,.post-reactions{display:flex;align-items:center;gap:7px;white-space:nowrap}
.post-views{color:#0758df;font-size:23px;font-weight:700;line-height:1.15}
.post-reactions{color:#bc3b32;font-size:15px;font-weight:600}
.post-numbers .icon{width:17px;height:17px}
.post-open{color:#0758df;display:flex;padding-left:3px}.post-open .icon{width:18px;height:18px}
.pagination{display:flex;justify-content:center;margin-top:22px}
.page-buttons{width:100%;max-width:360px;gap:3px;border-radius:28px;background:#eef3fc;padding:5px}
.page-buttons button{flex:1;min-width:0;min-height:44px;padding:6px 8px;font-size:16px;border-radius:50%;font-weight:700}
.post-detail p{display:flex;gap:14px;flex-wrap:wrap}.post-detail p span{display:inline-flex;align-items:center;gap:6px}.post-detail p .icon{width:17px;height:17px}
.post-detail .link-button{width:44px;height:44px;padding:0;border-radius:50%;background:#0866ff;color:#fff}
.channel-meta{gap:5px 12px}
#view[data-currency="BTC"] .price,#view[data-currency="ETH"] .price{font-size:36px}
@media(max-width:600px){.picker-dialog{position:fixed;inset:auto 0 10px;margin:auto;padding:22px;border-radius:30px;max-height:85dvh}.picker-list{max-height:55dvh}.picker-header{margin-bottom:16px}.picker-header h2{font-size:29px}}
@media(max-width:390px){.post-row{padding:14px 12px;gap:9px}.post-info b{font-size:16px}.post-views{font-size:20px}.post-open{display:none}.page-buttons button{min-height:42px;padding:6px}.picker-dialog{padding:18px}.picker-option{gap:10px}.sort-trigger{font-size:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Larger identity and typography with guarded narrow-screen sizing. */
body{font-size:17px}
.channel{gap:20px;align-items:center}
.channel>div{min-width:0}
.avatar{width:96px;height:96px;border-radius:32px}
h1{font-size:52px;letter-spacing:-2px;line-height:1.03}
.channel-meta{font-size:16px;line-height:1.4;margin-top:10px}
.metric .number{font-size:clamp(26px,24cqw,46px)}
.metric-label{font-size:clamp(15px,8cqw,17px)}
.metric-note{font-size:16px}
.segments button{font-size:16px}
.data-facts p{font-size:17px}
.calc-hero .price{font-size:64px}
@media(max-width:760px){.channel{gap:16px}.avatar{width:80px;height:80px;border-radius:27px}h1{font-size:clamp(30px,9.5vw,40px);letter-spacing:-1.3px}.channel-meta{font-size:16px}.metric-note{font-size:15px}.segments button{font-size:15px}.metric .number{font-size:clamp(25px,24cqw,42px)}.calc-hero .price{font-size:50px}}
@media(max-width:390px){.channel{gap:13px}.channel-meta{font-size:15px}.metric-label{font-size:15px}.metric-note{font-size:14px}.segments button{font-size:14px}.calc-hero .price{font-size:44px}}
@media(max-width:350px){.avatar{width:76px;height:76px;border-radius:26px}h1{font-size:30px}.metric .number{font-size:clamp(24px,24cqw,32px)}.metric-note{font-size:14px}.calc-hero .price{font-size:38px}}

.comparison:empty{display:none}

/* Disclosure keeps its DOM so both directions can animate smoothly. */
.data-card{overflow:hidden}
.quality-button{min-height:44px}
.quality-indicator{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex:0 0 34px!important;border-radius:50%;background:#eef3ff;color:#0866ff;transform:rotate(0deg);transition:transform .34s cubic-bezier(.2,.8,.2,1),background .25s}
.quality-indicator svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.data-card[data-open="true"] .quality-indicator{transform:rotate(45deg);background:#dce9ff}
.data-reveal{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .38s cubic-bezier(.2,.75,.25,1),opacity .25s ease}
.data-reveal-inner{min-height:0;overflow:hidden}
.data-card[data-open="true"] .data-reveal{grid-template-rows:1fr;opacity:1}
.data-reveal .data-facts{animation:none;margin-top:16px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.period-form-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.period-form-head label{margin:0;max-width:460px;font-size:20px;line-height:1.3}.period-entry{align-items:stretch}.period-entry input{flex:1;max-width:220px}.period-form-head .icon-button{margin-top:-3px}

.gram-badge{background:transparent}.gram-badge img{display:block;width:100%;height:100%;border-radius:50%}.currency-trigger b{font-size:20px}.period-form{border-radius:46px;padding:22px}.period-form .primary{border-radius:24px}

/* Calendar affordance and clean switch track. */
.period button[data-action="custom-period"]{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:48px;padding:8px 12px;flex:0 0 auto}
.period button[data-action="custom-period"] .icon{width:21px;height:21px}
.toggle input,.toggle input:checked,.toggle input:hover{border:0;box-shadow:none}
.toggle input:before{box-shadow:none}
.toggle input:focus:not(:focus-visible){outline:none}
.period-form .primary:disabled{opacity:.4;cursor:default;transform:none;box-shadow:none}
#custom-days[aria-invalid="true"]{border-color:#d73630}

/* Horizontal pill dragging keeps vertical page gestures available. */
.segments{touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none}
.segments button{touch-action:pan-y pinch-zoom}
.segments.is-dragging{cursor:grabbing}
.segments.is-dragging button{cursor:grabbing;color:var(--ink)!important}
.segments.is-dragging button.drag-candidate{color:var(--pill-ink,#fff)!important}
.segments.is-dragging::before{transition:none!important;will-change:left,width;box-shadow:0 4px 12px #0d255229}

/* Switch thumbs follow horizontal drags and keep native tap transitions. */
.toggle input{touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none}
.toggle input.is-dragging{cursor:grabbing}
.toggle input.is-dragging::before{transform:translateX(var(--thumb-offset,0px));transition:none;will-change:transform}
.toggle input[data-drag-on="true"]{background:#25cf70}
.toggle input[data-drag-on="false"]{background:#7a8598}

.presets button.active{color:#fff}
.range::-webkit-slider-thumb{border-color:#25cf70}
.range::-moz-range-thumb{border-color:#25cf70}

/* Keep long presses on draggable controls from opening the iOS callout. */
.segments,.segments button,.toggle input{-webkit-touch-callout:none}

.brand-footer{display:flex;justify-content:center;align-items:center;padding:36px 0 8px}.brand-footer img{display:block;width:156px;height:auto;max-width:48%;opacity:.82}

.period-summary{font-size:16px;font-weight:600;margin:0 0 14px;color:#526077}.period-summary span{display:block;margin-top:4px;color:#975000}

.metric.mint{--metric-color:#25ce72}.metric.mint .metric-note{font-size:16px;line-height:1.3}
.subscriber-growth{border-radius:26px;background:#ddf9e9;padding:22px;margin:20px 0 26px;color:#006b38}
.subscriber-growth strong{display:block;font-size:clamp(25px,4vw,40px);line-height:1.15;letter-spacing:-1px}
.subscriber-growth p{margin-top:12px;font-size:17px;line-height:1.45}
.subscriber-growth.negative{background:#fff0e9;color:#b83413}
.subscriber-bars .bar span{background:#25ce72}.subscriber-bars .bar.selected span{background:#008e4a;box-shadow:inset 0 0 0 2px #fff,0 0 0 1px #008e4a}
.subscriber-wait{min-height:180px;display:flex;align-items:center;justify-content:center;gap:16px;color:var(--muted);font-size:18px}
.subscriber-wait .icon{width:32px;height:32px;flex-shrink:0}

body{font-synthesis:none}h1,h2,.number,.price{letter-spacing:-.035em}button{font-weight:600}

.audience-panel,.schedule-panel{margin-top:18px}.audience-value{display:block;color:#008748;font-size:32px;line-height:1.15;margin:18px 0 12px;letter-spacing:-1px}.audience-value.negative{color:#d73e28}.audience-panel .primary{margin-top:20px}.audience-panel .section-copy{font-size:17px}
.schedule-frequency{display:flex;align-items:baseline;gap:12px;margin:20px 0}.schedule-frequency strong{font-size:44px;line-height:1}.schedule-frequency span{font-size:17px;color:var(--muted)}.schedule-modes{margin-bottom:26px;width:100%}.schedule-modes button{flex:1;font-size:16px}
.schedule-bars{height:140px;display:flex;gap:5px;padding-bottom:25px}.schedule-bar{flex:1;min-width:0;position:relative;display:flex;align-items:flex-end;padding:0}.schedule-bar>span{width:100%;background:#b58bff;border-radius:7px;transition:height .3s,background .2s}.schedule-bar.active>span{background:#793bdf}.schedule-bar small{position:absolute;bottom:-25px;width:100%;text-align:center;font-size:12px;font-weight:600;color:var(--muted)}.schedule-detail{display:flex;justify-content:space-between;gap:10px;background:#f0e8ff;padding:15px;border-radius:20px;font-size:16px;margin-top:20px}.schedule-detail span{color:#6334a2}

.audience-schedule{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px;align-items:start}.audience-schedule .card{margin:0}.schedule-bar small{font-size:14px}@media(max-width:700px){.audience-schedule{grid-template-columns:1fr}.schedule-bar small{font-size:12px}}

/* The Mini App uses the same design and interactions as the standalone page. */
[hidden]{display:none!important}
html{color-scheme:light;background:#f4f5f9}
body{padding-top:var(--app-safe-top,0px);padding-right:var(--app-safe-right,0px);padding-bottom:var(--app-safe-bottom,env(safe-area-inset-bottom,0px));padding-left:var(--app-safe-left,0px)}
.startup{max-width:480px;margin:12vh auto;padding:32px;border-radius:36px;background:#fff;text-align:center}
.startup h1{font-size:32px;letter-spacing:-1px;line-height:1.1;margin:16px 0}
.startup p{font-size:18px;line-height:1.5;color:#526077;margin:12px 0 24px}
.startup-mark{display:grid;place-items:center;margin:auto;width:64px;height:64px;border-radius:22px;background:#0866ff;color:white;font-size:34px}
.loading .startup-mark{animation:startup-pulse 1.3s ease-in-out infinite alternate}
.avatar-wrap{position:relative;flex-shrink:0}
.avatar-fallback{display:grid;place-items:center;background:#0866ff;color:#fff;font-size:36px;font-weight:750}
.avatar-wrap .avatar{display:block}
.avatar-wrap .avatar-fallback{display:grid}
.picker-dialog{max-height:min(85dvh,780px)}
@keyframes startup-pulse{to{transform:scale(.92);opacity:.55}}
@media(max-width:540px){.startup{margin:14vh 18px 24px;padding:28px}.startup h1{font-size:30px}.channel h1{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){.loading .startup-mark{animation:none}}