:root{--bg:#09111b;--bg-elevated:#0c1522c7;--bg-strong:#111d2f;--card-edge:#7aa2ff2e;--card-shadow:#03091273;--text:#f3f5f8;--muted:#9fb0c7;--accent:#f26f3b;--accent-soft:#f26f3b24;--accent-cool:#53d1ff;--success:#6be39c;--danger:#ff7b7b;--font-display:"Avenir Next", "Trebuchet MS", "Gill Sans", "Segoe UI", sans-serif;--font-mono:"SF Mono", "IBM Plex Mono", "Menlo", "Consolas", monospace}*{box-sizing:border-box}html{min-height:100%;color:var(--text);background:radial-gradient(circle at 0 0,#53d1ff29,#0000 28%),radial-gradient(circle at 100% 0,#f26f3b29,#0000 24%),linear-gradient(#0a1018 0%,#09111b 42%,#05090f 100%)}body{min-height:100vh;color:var(--text);font-family:var(--font-display), sans-serif;margin:0}a{color:inherit}button,input{font:inherit}.shell{min-height:100vh;position:relative;overflow:hidden}.shell:before,.shell:after{content:"";z-index:0;filter:blur(50px);opacity:.7;pointer-events:none;border-radius:999px;position:fixed;inset:auto}.shell:before{background:#53d1ff2e;width:18rem;height:18rem;top:6rem;left:-4rem}.shell:after{background:#f26f3b29;width:22rem;height:22rem;bottom:10rem;right:-5rem}.grid{z-index:1;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);align-items:start;gap:1.25rem;padding:2rem;display:grid;position:relative}.panel,.metric,.pull-card{border:1px solid var(--card-edge);background:var(--bg-elevated);box-shadow:0 20px 60px var(--card-shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.hero{border-radius:2rem;flex-direction:column;align-self:start;gap:1.25rem;padding:1.5rem;animation:.48s ease-out both rise;display:flex}.eyebrow{width:fit-content;color:var(--accent-cool);font-family:var(--font-mono), monospace;text-transform:uppercase;letter-spacing:.12em;background:#ffffff0d;border-radius:999px;align-items:center;gap:.55rem;padding:.45rem .7rem;font-size:.78rem;display:inline-flex}.hero h1{letter-spacing:-.04em;max-width:12ch;margin:0;font-size:clamp(3rem,7vw,5.6rem);line-height:.92}.hero p{max-width:56ch;color:var(--muted);margin:0;font-size:1.02rem;line-height:1.6}.hero-note{background:linear-gradient(135deg,#ffffff0a,#ffffff03);border-radius:1.35rem;gap:.75rem;padding:1rem;display:grid}.hero-note strong{font-size:.95rem}.how-it-works{background:linear-gradient(135deg,#ffffff08,#ffffff04);border:1px solid #ffffff14;border-radius:1.35rem;padding:1rem 1.05rem}.how-it-works summary{cursor:pointer;color:var(--text);font-size:.98rem;font-weight:600;list-style:none}.how-it-works summary::-webkit-details-marker{display:none}.how-it-works summary:after{content:"−";float:right;color:var(--accent-cool)}.how-it-works:not([open]) summary:after{content:"+"}.how-it-works p{margin:.85rem 0 0}.how-it-works-list{color:var(--muted);margin:.85rem 0 0;padding-left:1.25rem;line-height:1.55}.how-it-works-list li+li{margin-top:.5rem}.mono{font-family:var(--font-mono), monospace}.controls{border-radius:1.75rem;align-content:start;align-self:start;gap:1rem;padding:1.4rem;animation:.56s ease-out both rise;display:grid}.controls h2,.results h2{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0;font-size:1rem}.stack{gap:.95rem;display:grid}.field{gap:.45rem;display:grid}.field label{color:var(--muted);font-size:.9rem}.field input{width:100%;color:var(--text);background:#ffffff0a;border:1px solid #ffffff1a;border-radius:1rem;padding:.95rem 1rem;transition:border-color .18s,transform .18s,background .18s}.field input:focus{background:#ffffff14;border-color:#53d1ff9e;outline:none;transform:translateY(-1px)}.actions{flex-wrap:wrap;gap:.75rem;display:flex}.button{cursor:pointer;white-space:nowrap;border:0;border-radius:999px;justify-content:center;align-items:center;gap:.65rem;min-height:3rem;padding:.85rem 1.15rem;transition:transform .18s,opacity .18s,box-shadow .18s;display:inline-flex}.button:hover:not(:disabled){transform:translateY(-1px)}.button:disabled{cursor:wait;opacity:.65}.button-primary{background:linear-gradient(135deg, var(--accent) 0%, #ff9b53 100%);color:#111;box-shadow:0 12px 30px #f26f3b47}.button-secondary{color:var(--text);background:#ffffff0f;border:1px solid #ffffff14}.helper{color:var(--muted);font-size:.9rem;line-height:1.5}.status{border-radius:1rem;padding:.9rem 1rem;font-size:.94rem;line-height:1.5}.status-error{color:#ffd5d5;background:#ff7b7b1f;border:1px solid #ff7b7b38}.status-busy{align-items:center;gap:.65rem;display:inline-flex}.status-busy:before{content:"";border:2px solid #53d1ff3d;border-top-color:var(--accent-cool);border-radius:999px;flex:none;width:.85rem;height:.85rem;animation:.7s linear infinite spin}.status-ready{color:#c7f7da;background:#6be39c1a;border:1px solid #6be39c38}.status-idle{color:#ccf5ff;background:#53d1ff14;border:1px solid #53d1ff29}.results{border-radius:2rem;grid-column:1/-1;gap:1rem;padding:1.5rem;animation:.64s ease-out both rise;display:grid}.metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem;display:grid}.metric{border-radius:1.35rem;padding:1rem}.metric-label{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.5rem;font-size:.82rem}.metric-value{font-size:clamp(1.55rem,3vw,2.4rem);line-height:1}.metric-subtle{color:var(--muted);margin-top:.45rem;font-size:.9rem}.pill-row{flex-wrap:wrap;gap:.55rem;display:flex}.pill{color:var(--muted);background:#ffffff0f;border-radius:999px;padding:.5rem .75rem;font-size:.84rem}.pill-details{position:relative}.pill-button{cursor:pointer;-webkit-user-select:none;user-select:none;list-style:none}.pill-button::-webkit-details-marker{display:none}.pill-popover{min-width:12rem;max-width:18rem;color:var(--text);z-index:10;background:#101418f5;border:1px solid #ffffff14;border-radius:1rem;gap:.35rem;padding:.8rem .9rem;font-size:.84rem;display:grid;position:absolute;top:calc(100% + .45rem);left:0;box-shadow:0 18px 40px #00000059}.leaderboard{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.85rem;display:grid}.leader-card{color:var(--text);text-align:left;background:#ffffff0a;border:1px solid #ffffff14;border-radius:1.2rem;gap:.35rem;padding:1rem;display:grid}.leader-card-active{background:linear-gradient(135deg,#53d1ff1f,#ffffff0a);border-color:#53d1ff8c}.leader-name{font-size:1rem}.leader-time{color:var(--accent-cool);font-size:1.2rem}.leader-time-secondary{font-size:1.2rem}.leader-share{color:var(--muted);font-size:.88rem}.leader-share-secondary{opacity:.88;font-size:.82rem}.pull-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;display:grid}.segment-card{border:1px solid var(--card-edge);background:linear-gradient(#ffffff09,#ffffff05);border-radius:1.4rem;gap:1rem;padding:1rem;display:grid}.segment-card-header{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.segment-card-header h3{margin:0;font-size:1rem}.segment-card-header p{color:var(--muted);margin:.35rem 0 0;font-size:.92rem;line-height:1.5}.segment-legend{color:var(--muted);flex-wrap:wrap;gap:.75rem;font-size:.84rem;display:flex}.segment-legend-item{align-items:center;gap:.4rem;display:inline-flex}.segment-legend-swatch{border-radius:999px;width:.8rem;height:.8rem}.segment-legend-swatch-share,.segment-legend-swatch-share-bar{background:var(--accent-cool)}.segment-legend-swatch-dps{background:var(--accent)}.segment-legend-swatch-contribution{background:#f5c451}.segment-chart{width:100%;height:auto;overflow:visible}.segment-chart-wrap{position:relative}.segment-chart-bg{fill:#040a1247}.segment-grid-line{stroke:#ffffff14;stroke-width:1px}.segment-axis-line{stroke:#ffffff2e;stroke-width:1px}.segment-axis-label{fill:var(--muted);font-size:11px;font-family:var(--font-mono), monospace}.segment-line-dps{fill:none;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;stroke:var(--accent)}.segment-line-contribution{fill:none;stroke:#f5c451;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round}.segment-bar-share{fill:#53d1ff80;stroke:#53d1ffe6;stroke-width:1px;cursor:default}.segment-tooltip{z-index:2;min-width:14rem;max-width:24rem;color:var(--text);pointer-events:none;white-space:normal;background:#060c16f0;border:1px solid #53d1ff38;border-radius:.8rem;padding:.7rem .85rem;font-size:.82rem;line-height:1.45;position:absolute;transform:translateY(-100%);box-shadow:0 14px 32px #00000052}.pull-card{border-radius:1.4rem;gap:.7rem;padding:1rem;display:grid}.pull-card header{justify-content:space-between;align-items:start;gap:1rem;display:flex}.pull-card h3{margin:0;font-size:1rem}.pull-card p{color:var(--muted);margin:0;font-size:.92rem;line-height:1.5}.accent{color:var(--accent-cool)}.loading{align-items:center;gap:.65rem;display:inline-flex}.loading:before{content:"";background:linear-gradient(135deg, var(--accent-cool), var(--accent));border-radius:999px;width:.8rem;height:.8rem;animation:.9s ease-in-out infinite pulse}@keyframes rise{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:.8;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width:1100px){.grid{grid-template-columns:1fr}.metrics,.pull-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:720px){.grid{padding:1rem}.hero,.controls,.results{border-radius:1.5rem}.segment-card-header{flex-direction:column}.metrics,.pull-grid{grid-template-columns:1fr}.hero h1{max-width:none}}
