/* ApiOid product UI — calm technical system inspired by high-quality AI infrastructure sites */
:root{--p-bg:#080a0f;--p-surface:#0f1219;--p-surface2:#141822;--p-line:#262b37;--p-text:#f5f6f8;--p-muted:#9da5b4;--p-accent:#b9ff66;--p-accent2:#67e8f9;--p-danger:#ff8178;--p-radius:18px;--p-shadow:0 22px 70px rgba(0,0,0,.28)}
html{background:var(--p-bg)}body{background:radial-gradient(900px 520px at 70% -80px,rgba(103,232,249,.08),transparent 65%),radial-gradient(760px 480px at 10% 20%,rgba(185,255,102,.06),transparent 70%),var(--p-bg)!important;color:var(--p-text)!important;font-family:Inter,Manrope,system-ui,-apple-system,"Segoe UI",sans-serif!important}.wrap{width:min(1180px,calc(100% - 48px));max-width:none!important}.top{height:72px!important;border:1px solid var(--p-line)!important;border-top:0!important;background:rgba(8,10,15,.82)!important;backdrop-filter:blur(20px);padding:0 18px!important;position:sticky!important;top:0!important;z-index:100!important}.brand{display:flex;align-items:center;gap:10px;font-weight:800!important;letter-spacing:-.03em}.brand:before{display:none!important}.brand img{width:34px;height:34px;border-radius:10px}.nav a{color:var(--p-muted)!important;border-radius:10px}.nav a:hover,.nav a.active{color:var(--p-text)!important;background:var(--p-surface2)}.nav a.primary{color:#0a0c10!important;background:var(--p-accent)!important}.hero{padding:92px 0 70px!important}.hero h1,.section h2,.doc h1{font-family:Inter,Manrope,system-ui,sans-serif!important;font-weight:660!important;letter-spacing:-.065em!important}.hero h1{font-size:clamp(58px,8vw,112px)!important;line-height:.86!important}.hero p,.section-copy,.muted{color:var(--p-muted)!important}.eyebrow,.kicker{color:var(--p-accent)!important}.eyebrow:before{background:var(--p-accent)!important}.btn{border:1px solid var(--p-line)!important;border-radius:12px!important;color:var(--p-text)!important;background:var(--p-surface)!important;transition:transform .18s ease,border-color .18s ease,background .18s ease}.btn:hover{transform:translateY(-2px);border-color:#434b5c!important}.btn.primary{color:#0a0c10!important;background:var(--p-accent)!important;border-color:var(--p-accent)!important}.hero-panel,.event{background:linear-gradient(145deg,#121722,#0e1118)!important;border:1px solid var(--p-line)!important;border-radius:var(--p-radius)!important;box-shadow:var(--p-shadow)}.hero-panel{color:var(--p-text)!important}.section{border-color:var(--p-line)!important}.benefits,.models,.ranks,.start-grid{background:transparent!important;gap:14px!important}.benefit,.model,.rank,.start-card,.card,.auth,.code,.endpoint,.callout,.chat{background:var(--p-surface)!important;border:1px solid var(--p-line)!important;border-radius:var(--p-radius)!important;color:var(--p-text)!important}.benefit:hover,.model:hover,.rank:hover,.start-card:hover{border-color:#42495a!important}.benefit h3,.start-card h3,.card h2{font-family:Inter,Manrope,system-ui,sans-serif!important}.model-note,.small,.field,.updated,.lead{color:var(--p-muted)!important}.status-wrap{border:1px solid var(--p-line)!important;border-radius:var(--p-radius);overflow:hidden!important}.status-wrap table,table{background:var(--p-surface)!important;color:var(--p-text)!important}.status-wrap th,.status-wrap td,th,td{border-color:var(--p-line)!important}.state.ok,.connected{color:var(--p-accent)!important}.state.bad,.status{color:var(--p-danger)!important}.footer{border-color:var(--p-line)!important;color:var(--p-muted)!important}.input,.text,select{background:#0b0e14!important;color:var(--p-text)!important;border:1px solid var(--p-line)!important;border-radius:12px!important;outline:none}.input:focus,.text:focus,select:focus{border-color:var(--p-accent2)!important;box-shadow:0 0 0 3px rgba(103,232,249,.08)}.tabs{border-color:var(--p-line)!important}.tabs button{color:var(--p-muted)!important}.tabs .on{color:var(--p-text)!important;border-color:var(--p-accent)!important}.key,.pill{background:#0a0d13!important;color:#dfe5ef!important;border:1px solid var(--p-line);border-radius:9px}.metric{font-family:Inter,system-ui!important;font-weight:700}.auth-shell{display:grid;grid-template-columns:minmax(0,.9fr) minmax(300px,.7fr);gap:20px;align-items:stretch}.auth-intro{padding:34px;border:1px solid var(--p-line);border-radius:var(--p-radius);background:linear-gradient(145deg,rgba(185,255,102,.09),rgba(103,232,249,.04));display:flex;flex-direction:column;justify-content:space-between}.auth-intro h2{font-size:clamp(30px,4vw,50px);line-height:1;letter-spacing:-.05em;margin:0 0 16px}.auth-intro ul{padding:0;margin:30px 0 0;list-style:none;display:grid;gap:10px;color:var(--p-muted)}.auth-intro li:before{content:'✓';color:var(--p-accent);margin-right:10px}.profile-head{display:flex;justify-content:space-between;align-items:end;gap:24px}.profile-badge{display:inline-flex;padding:7px 10px;border:1px solid var(--p-line);border-radius:999px;color:var(--p-accent);font:12px ui-monospace,monospace}.events-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.event-card{padding:24px;background:var(--p-surface);border:1px solid var(--p-line);border-radius:var(--p-radius)}.event-card h3{margin:0 0 8px}.event-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;color:var(--p-muted);font-size:12px}.event-meta span{padding:6px 8px;border:1px solid var(--p-line);border-radius:8px}.model-search{display:flex;align-items:center;gap:12px;min-width:min(100%,460px);color:var(--p-muted);font-size:12px}.model-search .input{min-width:280px;padding:11px 13px}.empty-state{padding:28px;border:1px dashed var(--p-line);border-radius:var(--p-radius);color:var(--p-muted)}
@media(max-width:760px){.model-search{width:100%;align-items:stretch;flex-direction:column}.model-search .input{min-width:0;width:100%}.wrap{width:auto!important;margin-left:16px!important;margin-right:16px!important}.auth-shell{grid-template-columns:1fr}.auth-intro{padding:24px}.events-grid{grid-template-columns:1fr}.profile-head{display:block}.top{border-left:0!important;border-right:0!important;border-radius:0!important}.hero{padding-top:48px!important}.hero h1{font-size:clamp(47px,14vw,66px)!important}.cards{gap:12px!important}.card{border-radius:14px!important}}
@media(prefers-reduced-motion:reduce){.btn{transition:none}.btn:hover{transform:none}}