.hidden{display:none!important}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}:root{--primary:#171717;--on-primary:#fff;--ink:#171717;--body:#4d4d4d;--mute:#888;--hairline:#ebebeb;--hairline-strong:#a1a1a1;--canvas:#fff;--canvas-soft:#fafafa;--canvas-soft-2:#f5f5f5;--link:#0070f3;--link-deep:#0761d1;--link-bg-soft:#d3e5ff;--success:#0070f3;--error:#e00;--error-soft:#f7d4d6;--warning:#f5a623;--warning-soft:#ffefcf;--violet:#7928ca;--cyan:#50e3c2;--highlight-pink:#ff0080;--gradient-develop-start:#007cf0;--gradient-develop-end:#00dfd8;--gradient-preview-start:#7928ca;--gradient-preview-end:#ff0080;--gradient-ship-start:#ff4d4d;--gradient-ship-end:#f9cb28;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, monospace;--rounded-none:0px;--rounded-xs:4px;--rounded-sm:6px;--rounded-md:8px;--rounded-lg:12px;--rounded-xl:16px;--rounded-pill-sm:64px;--rounded-pill:100px;--rounded-full:9999px;--space-xxs:4px;--space-xs:8px;--space-sm:12px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:40px;--space-3xl:48px;--space-4xl:64px;--space-5xl:96px;--shadow-l1:0 0 0 1px #00000014 inset;--shadow-l2:0px 1px 1px #00000005, 0px 2px 2px #0000000a, 0 0 0 1px #00000014 inset;--shadow-l3:0px 2px 2px #0000000a, 0px 8px 8px -8px #0000000a, 0 0 0 1px #00000014 inset;--shadow-l4:0px 2px 2px #0000000a, 0px 8px 16px -4px #00000014, 0 0 0 1px #00000014 inset;background-color:var(--canvas-soft);color:var(--ink);font-family:var(--font-sans);transition:background-color .3s,color .3s,border-color .3s}html.dark{--primary:#fff;--on-primary:#000;--ink:#ededed;--body:#a1a1a1;--mute:#666;--hairline:#222;--hairline-strong:#444;--canvas:#0a0a0a;--canvas-soft:#000;--canvas-soft-2:#111;--link:#3291ff;--link-deep:#0070f3;--link-bg-soft:#0070f326;--success:#3291ff;--error:#f33;--error-soft:#ff333326;--warning:#f7b955;--warning-soft:#f5a62326;--violet:#8a63d2;--cyan:#79ffe1;--highlight-pink:#ff0080;--shadow-l1:0 0 0 1px #ffffff14 inset;--shadow-l2:0px 1px 1px #0003, 0px 2px 2px #0006, 0 0 0 1px #ffffff14 inset;--shadow-l3:0px 2px 4px #0006, 0px 8px 16px -8px #0006, 0 0 0 1px #ffffff14 inset;--shadow-l4:0px 4px 8px #0006, 0px 16px 24px -4px #0006, 0 0 0 1px #ffffff14 inset}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;flex-direction:column;min-height:100vh;display:flex;overflow-x:hidden}.display-xl{font-family:var(--font-sans);letter-spacing:-1.8px;font-size:36px;font-weight:600;line-height:40px}.display-lg{font-family:var(--font-sans);letter-spacing:-1.28px;font-size:32px;font-weight:600;line-height:40px}.display-md{font-family:var(--font-sans);letter-spacing:-.96px;font-size:24px;font-weight:600;line-height:32px}.display-sm{font-family:var(--font-sans);letter-spacing:-.6px;font-size:20px;font-weight:600;line-height:28px}.body-lg{font-family:var(--font-sans);letter-spacing:0;font-size:18px;font-weight:400;line-height:28px}.body-md{font-family:var(--font-sans);font-size:16px;font-weight:400;line-height:24px}.body-md-strong{font-family:var(--font-sans);font-size:16px;font-weight:500;line-height:24px}.body-sm{font-family:var(--font-sans);letter-spacing:-.28px;font-size:14px;font-weight:400;line-height:20px}.body-sm-strong{font-family:var(--font-sans);letter-spacing:-.28px;font-size:14px;font-weight:500;line-height:20px}.caption{font-family:var(--font-sans);font-size:12px;font-weight:400;line-height:16px}.caption-mono{font-family:var(--font-mono);font-size:12px;font-weight:400;line-height:16px}.code-style{font-family:var(--font-mono);font-size:13px;font-weight:400;line-height:20px}h1,h2,h3,h4{color:var(--ink)}.page-container{width:100%;max-width:1400px;padding:0 var(--space-lg);margin:0 auto}@media (width<=600px){.page-container{padding:0 var(--space-md)}}.nav-bar{background-color:var(--canvas);border-bottom:1px solid var(--hairline);z-index:100;align-items:center;height:64px;transition:background-color .3s,border-color .3s;display:flex;position:sticky;top:0}.nav-bar-content{justify-content:space-between;align-items:center;width:100%;display:flex}.logo-container{align-items:center;gap:var(--space-xs);color:var(--ink);text-decoration:none;display:flex}.logo-img{object-fit:contain;border-radius:var(--rounded-xs);width:32px;height:32px}.logo-text{letter-spacing:-.5px;font-size:18px;font-weight:600}.nav-right{align-items:center;gap:var(--space-md);display:flex}.nav-links{align-items:center;gap:var(--space-xs);display:flex}.nav-link{font-family:var(--font-sans);color:var(--mute);padding:var(--space-xs) var(--space-sm);border-radius:var(--rounded-sm);font-size:14px;font-weight:500;text-decoration:none;transition:color .15s,background-color .15s}.nav-link:hover{color:var(--ink);background-color:var(--canvas-soft-2)}@media (width<=768px){.nav-links{display:none}}.theme-toggle-btn{background:var(--canvas-soft-2);border:1px solid var(--hairline);color:var(--ink);border-radius:var(--rounded-full);cursor:pointer;justify-content:center;align-items:center;width:36px;height:36px;padding:0;transition:background-color .2s,border-color .2s;display:flex}.theme-toggle-btn:hover{background:var(--hairline)}.button-primary{background-color:var(--primary);color:var(--on-primary);font-family:var(--font-sans);border-radius:var(--rounded-pill);padding:8px var(--space-lg);cursor:pointer;box-shadow:var(--shadow-l2);border:none;justify-content:center;align-items:center;font-size:16px;font-weight:500;line-height:24px;transition:opacity .2s,transform .1s;display:inline-flex}.button-primary:hover{opacity:.9}.button-primary:active{transform:scale(.98)}.button-secondary{background-color:var(--canvas);color:var(--ink);font-family:var(--font-sans);border-radius:var(--rounded-pill);padding:6px var(--space-md);border:1px solid var(--hairline);cursor:pointer;box-shadow:var(--shadow-l1);justify-content:center;align-items:center;font-size:14px;font-weight:500;line-height:20px;transition:background-color .2s,transform .1s;display:inline-flex}.button-secondary:hover{background-color:var(--canvas-soft-2);border-color:var(--hairline-strong)}.button-secondary:active{transform:scale(.98)}.hero-band{padding:var(--space-md) 0 var(--space-md) 0;position:relative;overflow:hidden}.mesh-gradient-backdrop{filter:blur(80px);z-index:0;pointer-events:none;background:radial-gradient(circle at 20% 30%,#50e3c226 0%,#0000 40%),radial-gradient(circle at 50% 20%,#007cf01f 0%,#0000 45%),radial-gradient(circle at 80% 40%,#7928ca1f 0%,#0000 40%),radial-gradient(circle at 35% 70%,#ff008014 0%,#0000 40%),radial-gradient(circle at 65% 85%,#ff4d4d14 0%,#0000 35%);width:1400px;height:350px;transition:opacity .5s;position:absolute;top:-150px;left:50%;transform:translate(-50%)}html.dark .mesh-gradient-backdrop{background:radial-gradient(circle at 20% 30%,#50e3c20f 0%,#0000 40%),radial-gradient(circle at 50% 20%,#007cf014 0%,#0000 45%),radial-gradient(circle at 80% 40%,#7928ca14 0%,#0000 40%),radial-gradient(circle at 35% 70%,#ff00800a 0%,#0000 40%),radial-gradient(circle at 65% 85%,#ff4d4d0a 0%,#0000 35%)}.hero-content{z-index:1;text-align:center;max-width:800px;margin:0 auto;position:relative}.hero-badge{background-color:var(--link-bg-soft);color:var(--link);font-family:var(--font-mono);padding:2px var(--space-sm);border-radius:var(--rounded-pill);margin-bottom:var(--space-xs);text-transform:uppercase;letter-spacing:.5px;border:1px solid #0070f31a;font-size:11px;display:inline-block}.hero-title{margin-bottom:var(--space-xs);color:var(--ink);transition:color .3s}.hero-subtitle{color:var(--body);margin-bottom:var(--space-sm);max-width:600px;margin-left:auto;margin-right:auto}.input-panel{background-color:var(--canvas);border:1px solid var(--hairline);border-radius:var(--rounded-lg);padding:var(--space-lg);box-shadow:var(--shadow-l2);gap:var(--space-sm);flex-direction:column;height:480px;transition:background-color .3s,border-color .3s;display:flex}.textarea-container{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}.prompt-textarea{background-color:var(--canvas-soft-2);border:1px solid var(--hairline);border-radius:var(--rounded-sm);width:100%;min-height:0;padding:var(--space-md);color:var(--ink);font-family:var(--font-sans);resize:none;flex:1;font-size:15px;line-height:22px;transition:background-color .2s,border-color .2s}.prompt-textarea:focus{border-color:var(--hairline-strong);background-color:var(--canvas);outline:none}.prompt-textarea-stats{justify-content:flex-end;gap:var(--space-md);padding:var(--space-xs) var(--space-xxs) 0 var(--space-xxs);color:var(--mute);display:flex}.prompt-textarea-footer{padding:var(--space-xs) 0 0 0;justify-content:space-between;align-items:center;display:flex}.textarea-wrapper{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}.textarea-wrapper .prompt-textarea{flex:1;min-height:0}.optimize-btn{top:var(--space-sm);right:var(--space-sm);background:var(--link);color:#fff;border-radius:var(--rounded-pill-sm);font-family:var(--font-sans);letter-spacing:.3px;text-transform:uppercase;cursor:pointer;opacity:.75;z-index:2;border:none;align-items:center;gap:4px;padding:5px 10px;font-size:11px;font-weight:600;transition:opacity .2s,background-color .2s,transform .1s;display:inline-flex;position:absolute;box-shadow:0 1px 4px #0070f34d}.optimize-btn:hover{opacity:1;background:var(--link-deep);transform:scale(1.04)}.optimize-btn:active{transform:scale(.97)}.optimize-btn svg{flex-shrink:0}.optimize-stats{align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm);margin-top:var(--space-xs);background:var(--link-bg-soft);color:var(--link-deep);border:1px solid var(--link);border-radius:var(--rounded-sm);font-family:var(--font-mono);font-size:12px;font-weight:500;line-height:1.5;animation:.3s ease-out statsSlideIn;display:flex}.optimize-stats.hidden{display:none}html.dark .optimize-stats{color:#6cb4ee;background:#0070f31f;border-color:#0070f34d}@keyframes statsSlideIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.input-controls{justify-content:space-between;align-items:center;gap:var(--space-sm);flex-wrap:wrap;display:flex}.sample-buttons{gap:var(--space-xs);flex-wrap:wrap;display:flex}.clear-btn{color:var(--body);border:1px solid var(--hairline-strong);border-radius:var(--rounded-pill);cursor:pointer;background-color:#0000;padding:4px 12px;font-size:12px;transition:background-color .2s,color .2s,border-color .2s}.clear-btn:hover{background-color:var(--error);color:var(--on-primary);border-color:var(--error)}.disclaimer-badge{background-color:var(--canvas-soft-2);border:1px solid var(--hairline);color:var(--mute);padding:2px var(--space-xs);border-radius:var(--rounded-sm);align-items:center;gap:4px;display:inline-flex}.results-table{border-collapse:collapse;width:100%}.results-table-header{background-color:var(--canvas-soft-2);border-bottom:1px solid var(--hairline)}.results-table-header th{padding:var(--space-xs) var(--space-sm);text-align:left;color:var(--mute);font-weight:500}.model-row{border-bottom:1px solid var(--hairline);transition:background-color .2s}.model-row:last-child{border-bottom:none}.model-row:hover{background-color:var(--canvas-soft)}.model-cell-details{padding:var(--space-md) var(--space-sm)}.provider-name{color:var(--mute);margin-bottom:2px}.model-name{color:var(--ink);font-weight:500}.model-cell-tokens{padding:var(--space-md) var(--space-sm)}.token-count-value{color:var(--ink);font-family:var(--font-mono);font-weight:600}.model-cell-cost{padding:var(--space-md) var(--space-sm);text-align:right}.cost-value{color:var(--ink);font-family:var(--font-mono);font-weight:600}.cost-rate{color:var(--mute);font-size:11px}.context-progress-container{padding:0 var(--space-sm) var(--space-md) var(--space-sm);grid-column:span 3}.progress-bar-bg{background-color:var(--canvas-soft-2);border-radius:var(--rounded-full);width:100%;height:6px;position:relative;overflow:hidden}.progress-bar-fill{background-color:var(--ink);border-radius:var(--rounded-full);width:0%;height:100%;transition:width .3s,background-color .3s}.progress-safe{background-color:var(--link)}.progress-warning{background:var(--warning)}.progress-danger{background:var(--error)}.visualizer-placeholder{color:var(--mute);justify-content:center;align-items:center;height:100%;min-height:80px;font-style:italic;display:flex}.token-chip{white-space:pre-wrap;border-radius:2px;padding:2px 0;transition:background-color .2s;display:inline}.token-chip-0{color:#004fb0;background-color:#0070f326}.token-chip-1{color:#0c6953;background-color:#50e3c240}.token-chip-2{color:#4e1987;background-color:#7928ca26}.token-chip-3{color:#a05;background-color:#ff008026}.token-chip-4{color:#b51c1c;background-color:#ff4d4d26}.token-chip-5{color:#9c5c00;background-color:#f5a62333}html.dark .token-chip-0{color:#82baff;background-color:#3291ff40}html.dark .token-chip-1{color:#a3ffeb;background-color:#50e3c233}html.dark .token-chip-2{color:#cbb3ff;background-color:#8a63d240}html.dark .token-chip-3{color:#ff9ecf;background-color:#ff008040}html.dark .token-chip-4{color:#ff9e9e;background-color:#ff4d4d40}html.dark .token-chip-5{color:#ffd699;background-color:#f7b95540}.footer-section{border-top:1px solid var(--hairline);background-color:var(--canvas);padding:var(--space-xl) 0;margin-top:auto;transition:background-color .3s,border-color .3s}.footer-content{justify-content:space-between;align-items:center;gap:var(--space-md);color:var(--mute);font-family:var(--font-sans);flex-wrap:wrap;font-size:14px;font-weight:500;display:flex}.footer-logo{align-items:center;gap:var(--space-xs);display:flex}.footer-logo a{align-items:center;gap:var(--space-xs);color:var(--ink);text-decoration:none;display:flex}.footer-links{gap:var(--space-lg);display:flex}.footer-links a{font-family:var(--font-sans);color:var(--mute);font-size:14px;font-weight:500;text-decoration:none;transition:color .2s}.footer-links a:hover{color:var(--ink)}.tooltip{cursor:help;display:inline-block;position:relative}.tooltip .tooltiptext{visibility:hidden;background-color:var(--primary);width:240px;color:var(--on-primary);text-align:center;border-radius:var(--rounded-sm);padding:var(--space-sm);z-index:10;opacity:0;font-size:11px;line-height:15px;font-family:var(--font-sans);box-shadow:var(--shadow-l4);pointer-events:none;font-weight:400;transition:opacity .2s;position:absolute;bottom:125%;left:50%;transform:translate(-50%)}.tooltip:hover .tooltiptext,.tooltip:focus-within .tooltiptext{visibility:visible;opacity:1}.tooltip .tooltiptext{@media (hover:none){top:125%;bottom:auto}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin-icon{animation:10s linear infinite spin}.model-card{background:var(--canvas-soft-2);border:1px solid var(--hairline);border-radius:var(--rounded-md);padding:var(--space-md);flex-direction:column;gap:6px;transition:transform .15s,box-shadow .15s;display:flex;position:relative}.model-card:hover{box-shadow:var(--shadow-l3);transform:translateY(-2px)}.model-card-reference{box-shadow:0 0 0 1px var(--link), var(--shadow-l3);background:var(--canvas);border:1px solid var(--link)!important}html.dark .model-card-reference{box-shadow:0 0 0 1px var(--link), 0 1px 2px #0000004d, 0 2px 4px #0003;background:var(--canvas);border:1px solid var(--link)!important}.model-card-bestvalue{box-shadow:0 0 0 1px #059669, var(--shadow-l3);background:var(--canvas);border:1px solid #059669!important}html.dark .model-card-bestvalue{background:var(--canvas);box-shadow:0 0 0 1px #34d399,0 1px 2px #0000004d,0 2px 4px #0003;border:1px solid #34d399!important}.model-card-badge{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.5px;border-radius:var(--rounded-xs);align-items:center;gap:4px;width:fit-content;padding:2px 6px;font-size:9px;font-weight:600;display:inline-flex}.badge-openai{color:#0070f3;background-color:#0070f31f}html.dark .badge-openai{color:#3291ff;background-color:#3291ff33}.badge-anthropic{color:#b45309;background-color:#d977061f}html.dark .badge-anthropic{color:#f7b955;background-color:#f7b95533}.badge-meta{color:#7c3aed;background-color:#7c3aed1f}html.dark .badge-meta{color:#a78bfa;background-color:#a78bfa33}.badge-gemini{color:#059669;background-color:#0596691f}html.dark .badge-gemini{color:#34d399;background-color:#34d39933}.badge-deepseek{color:#0891b2;background-color:#0891b21f}html.dark .badge-deepseek{color:#22d3ee;background-color:#22d3ee33}.badge-mistral{color:#c2410c;background-color:#f973161f}html.dark .badge-mistral{color:#fb923c;background-color:#fb923c33}.badge-alibaba{color:#7c2d12;background-color:#7c2d121f}html.dark .badge-alibaba{color:#c2410c;background-color:#c2410c33}.badge-xai{color:#1d4ed8;background-color:#1d4ed81f}html.dark .badge-xai{color:#3b82f6;background-color:#3b82f633}.badge-nvidia{color:#4d7c0f;background-color:#84cc161f}html.dark .badge-nvidia{color:#a3e635;background-color:#a3e63533}.badge-cohere{color:#16a34a;background-color:#39d3531f}html.dark .badge-cohere{color:#4ade80;background-color:#4ade8033}.model-card-name{font-family:var(--font-sans);color:var(--ink);letter-spacing:-.3px;font-size:15px;font-weight:600;line-height:1.2}.model-card-meta{font-family:var(--font-mono);color:var(--mute);justify-content:space-between;align-items:center;font-size:11px;display:flex}.model-card-bar{background:var(--canvas);border-radius:var(--rounded-full);height:4px;overflow:hidden}.model-card-bar-fill{border-radius:var(--rounded-full);height:100%;transition:width .3s,background-color .3s}.model-card-costs{justify-content:space-between;gap:var(--space-xs);margin-top:2px;display:flex}.model-card-cost-item{flex-direction:column;flex:1;gap:1px;display:flex}.model-card-cost-label{font-family:var(--font-sans);color:var(--mute);text-transform:uppercase;letter-spacing:.3px;font-size:10px}.model-card-cost-value{font-family:var(--font-mono);color:var(--ink);font-size:12px;font-weight:500}.model-card-total{border-top:1px solid var(--hairline);justify-content:space-between;align-items:center;margin-top:2px;padding-top:6px;display:flex}.model-card-total-label{font-family:var(--font-sans);color:var(--body);text-transform:uppercase;letter-spacing:.3px;font-size:11px;font-weight:600}.model-card-total-value{font-family:var(--font-mono);color:var(--ink);font-size:14px;font-weight:700}.model-card-savings{border-top:1px solid var(--hairline);text-align:center;font-family:var(--font-mono);padding-top:6px;font-size:11px;font-weight:600}.savings-positive{color:var(--link)}.savings-neutral{color:var(--mute)}.savings-best{color:var(--success)}.savings-best-badge{background:var(--link);color:#fff;border-radius:var(--rounded-xs);text-transform:uppercase;letter-spacing:.3px;margin-left:4px;padding:1px 6px;font-size:9px;font-weight:700;display:inline-block}@media (width<=1024px){.page-container{padding:0 var(--space-md)}.display-xl{font-size:32px;line-height:36px}.display-lg{font-size:28px;line-height:36px}}@media (width<=768px){.nav-bar{height:56px}.logo-text{font-size:16px}.disclaimer-badge{display:none}.hero-band{padding:var(--space-sm) 0}.display-xl{letter-spacing:-1.2px;font-size:28px;line-height:32px}.display-lg{letter-spacing:-.96px;font-size:24px;line-height:30px}.display-md{font-size:20px;line-height:28px}.display-sm{font-size:18px;line-height:24px}.body-lg{font-size:16px;line-height:24px}.footer-content{text-align:center;gap:var(--space-md);flex-direction:column}.footer-logo{justify-content:center}.footer-links{flex-wrap:wrap;justify-content:center}}@media (width<=480px){.page-container{padding:0 var(--space-sm)}.nav-bar-content{gap:var(--space-xs)}.logo-text{letter-spacing:-.3px;font-size:14px}.theme-toggle-btn{width:32px;height:32px}.hero-badge{padding:2px var(--space-xs);font-size:10px}.display-xl{letter-spacing:-.96px;font-size:24px;line-height:28px}.display-lg{font-size:22px;line-height:28px}.body-lg{font-size:15px;line-height:22px}.button-secondary{padding:4px var(--space-sm);font-size:12px}.sample-buttons{gap:4px}.tab-btn{padding:var(--space-xs) var(--space-sm);font-size:12px}.results-table-header th{padding:var(--space-xs) var(--space-xs);font-size:10px}.model-cell-details,.model-cell-tokens,.model-cell-cost{padding:var(--space-sm) var(--space-xs)}.model-card{padding:var(--space-sm)}.model-card-name{font-size:14px}.model-card-cost-value{font-size:11px}.comparison-chart-card{padding:var(--space-sm)}.input-panel,.visualizer-panel{height:350px;padding:var(--space-md)}.input-panel-header,.visualizer-panel-header{padding-bottom:var(--space-sm)}.input-panel-header h2,.visualizer-panel-header h2{font-size:16px}}