*{margin:0;padding:0;box-sizing:border-box}body{background:#0a0a0a;color:#e0e0e0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;min-height:100vh;display:flex;justify-content:center;padding:48px 24px}.network-tip{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:20;max-width:190px;padding:10px 12px;border:1px solid #2d3c47;border-radius:10px;background:#0d1418f0;color:#b7c4ce;font-size:.72rem;line-height:1.45;box-shadow:0 10px 28px #0000003d}#app{max-width:1120px;width:100%}h1{font-size:2rem;font-weight:700;margin-bottom:8px;text-align:center}h1 .dim{color:#4fc3f7;font-weight:400}.tagline{font-size:1rem;color:#888;margin-bottom:8px;text-align:center}.description{font-size:.85rem;color:#666;line-height:1.7;max-width:760px;margin:0 auto 40px;text-align:center}.description code{background:#1a1a1a;padding:1px 6px;border-radius:4px;font-family:ui-monospace,SFMono-Regular,SF Mono,Consolas,monospace;font-size:.78rem;color:#4fc3f7}.framing-card{background:#111;border:1px solid #222;border-radius:12px;padding:22px 24px;margin:0 0 32px}.framing-card h2{font-size:.78rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#ffa726;margin-bottom:12px}.framing-card p{color:#b0b0b0;font-size:.86rem;line-height:1.65;margin-bottom:10px}.framing-card strong{color:#f5f5f5}.tradeoff-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}.tradeoff-grid>div{background:#0b0b0b;border:1px solid #1c1c1c;border-radius:10px;padding:14px 16px}.tradeoff-grid strong{display:block;font-size:.78rem;margin-bottom:8px}.tradeoff-grid ul{margin-left:16px;color:#8d8d8d;font-size:.78rem;line-height:1.55}.headline{background:#0d1418;border:1px solid #1a2832;border-radius:12px;padding:24px;margin-bottom:32px}.headline h2{font-size:.78rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#4fc3f7;margin-bottom:16px}.headline-note{margin:-4px 0 14px;color:#8a96a3;font-size:.78rem;line-height:1.5}.headline-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:baseline;padding:8px 0;border-bottom:1px solid #16222a;font-size:.85rem}.headline-row:last-child{border-bottom:0}.headline-row .label{color:#999}.headline-row .value{color:#fff;font-family:ui-monospace,SFMono-Regular,monospace;font-weight:600;text-align:right;white-space:nowrap}.headline-row .value.win{color:#66bb6a}.headline-row .value.lose{color:#ffa726}.headline-row .value.measuring{color:#8a96a3}.metric-source{color:#55616d;border:1px solid #25333e;border-radius:999px;padding:1px 6px;font-size:.62rem;text-transform:uppercase;letter-spacing:.04em}.demos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:40px}.demo-card{background:#141414;border:1px solid #222;border-radius:12px;padding:28px 24px;text-decoration:none;color:inherit;transition:all .2s;display:flex;flex-direction:column;gap:10px}.demo-card:hover{border-color:#4fc3f7;transform:translateY(-2px);box-shadow:0 8px 24px #4fc3f714}.demo-icon{font-size:1.5rem;line-height:1}.demo-title{font-size:1.05rem;font-weight:600}.demo-desc{font-size:.78rem;color:#888;line-height:1.6}.demo-tag{font-size:.66rem;padding:2px 8px;border-radius:8px;font-weight:600;align-self:flex-start;background:#4fc3f71f;color:#4fc3f7;text-transform:uppercase;letter-spacing:.04em}.demo-tag.tradeoffs{background:#ffa7261f;color:#ffa726}.links{display:flex;justify-content:center;gap:24px;font-size:.85rem}.links a{color:#4fc3f7;text-decoration:none}.links a:hover{text-decoration:underline}@media (max-width: 900px){.demos{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.network-tip{display:none}.headline-row{grid-template-columns:1fr;gap:4px}.tradeoff-grid{grid-template-columns:1fr}.headline-row .value{text-align:left;white-space:normal}.metric-source{width:max-content}.demos{grid-template-columns:1fr}}