:root{font-family:Space Grotesk,Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;background-color:#080b12;color:#f8fafc}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#0f172acc,#020617)}.app-shell{max-width:1200px;margin:0 auto;padding:2rem;display:flex;flex-direction:column;gap:1.5rem}.hero{display:flex;justify-content:space-between;gap:1.5rem;align-items:flex-start;background:linear-gradient(120deg,#0f172acc,#0c4a6eb3);padding:1.5rem;border-radius:1.25rem;border:1px solid rgba(148,163,184,.2)}.hero h1{margin:0;font-size:2rem}.hero p{margin:.5rem 0 0;color:#cbd5f5;line-height:1.5}.sizing-card{background:#0284c733;padding:1rem 1.25rem;border-radius:1rem;min-width:180px;text-align:right;border:1px solid rgba(14,165,233,.3)}.sizing-card .label{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:#bae6fd}.sizing-card strong{display:block;font-size:2rem;margin-top:.25rem}.sizing-card .version{font-size:.85rem;color:#7dd3fc}.content{display:flex;flex-direction:column;gap:1.25rem}.position-tabs{display:flex;gap:.75rem}.position-tabs button{flex:1;border:none;border-radius:999px;padding:.75rem 1rem;background:#1e293bcc;color:#e2e8f0;font-size:1rem;cursor:pointer;transition:all .2s ease;border:1px solid transparent}.position-tabs button.active{background:linear-gradient(120deg,#0284c7,#0ea5e9);color:#0f172a;font-weight:600;border-color:#0ea5e9cc}.preset-section{background:#0f172ab3;padding:1rem;border-radius:1rem;border:1px solid rgba(30,64,175,.4)}.preset-bar{display:flex;gap:.75rem;flex-wrap:wrap}.preset-chip{border-radius:999px;padding:.5rem .85rem;border:1px solid rgba(148,163,184,.4);background:#0f172acc;color:#cbd5f5;font-size:.9rem;cursor:pointer;transition:all .2s ease}.preset-chip.active{background:#10b98133;border-color:#10b981cc;color:#34d399;box-shadow:0 0 15px #10b9814d}.grid-section{background:#020617e6;padding:1.5rem;border-radius:1.25rem;border:1px solid rgba(148,163,184,.1);box-shadow:inset 0 0 30px #0f172a99}.range-grid{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:4px}.grid-cell{position:relative;padding-top:100%;border-radius:.4rem;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;color:#0f172a;font-size:.7rem;font-weight:600}.grid-cell .combo{font-size:.75rem}.grid-cell .mix{font-size:.65rem}.diff-badge{position:absolute;top:4px;right:6px;font-size:.7rem}.notes-panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.notes-card{background:#0f172ad9;border-radius:.9rem;border:1px solid rgba(99,102,241,.4);padding:1rem}.notes-card h3{margin:0 0 .5rem;font-size:1rem;color:#c4b5fd}.notes-card ul{list-style:none;padding:0;margin:0;color:#e2e8f0}.notes-card li{padding:.25rem 0;border-bottom:1px solid rgba(148,163,184,.15)}.loading,.error-banner{padding:.75rem 1rem;border-radius:.75rem;text-align:center;margin-bottom:1rem}.loading{background:#3b82f61a;color:#60a5fa}.error-banner{background:#ef444426;color:#fca5a5;border:1px solid rgba(239,68,68,.4)}@media (max-width: 768px){.hero{flex-direction:column}.range-grid{grid-template-columns:repeat(13,1fr);gap:2px}}