/* Dron4ik • Blue glass. A presentation layer; no billing or API decisions. */
:root{
  --bg:#080f19;--panel:rgba(20,34,51,.68);--panel2:rgba(30,47,67,.72);--input:rgba(6,16,28,.64);
  --line:rgba(167,207,241,.16);--line-soft:rgba(167,207,241,.10);
  --text:#f0f6fd;--muted:#a7b8ce;--dim:#8296af;
  --accent:#88d3ff;--accent-hover:#bae9ff;--accent-soft:rgba(112,194,247,.10);
  --radius:22px;--ease:cubic-bezier(.2,.8,.2,1);
}
body{background:var(--bg);isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:
  radial-gradient(ellipse at 7% 4%,rgba(72,131,196,.22),transparent 47%),
  radial-gradient(ellipse at 96% 43%,rgba(45,100,153,.17),transparent 44%),
  radial-gradient(ellipse at 50% 108%,rgba(55,94,157,.13),transparent 42%)}
.site-header{height:69px;background:rgba(10,19,31,.76);border-bottom-color:rgba(167,207,241,.12);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%)}
.header-inner{height:68px}.brand-mark{color:#9fddff}
.header-link{border-radius:11px;transition:color .2s,background .2s,box-shadow .2s}
.header-link.selected{background:linear-gradient(130deg,rgba(135,214,255,.15),rgba(68,135,193,.07));box-shadow:inset 0 1px 0 rgba(208,239,255,.12),inset 0 0 0 1px rgba(116,194,245,.14)}
.language-label,.tag,.badge{border-radius:7px}.header-actions .icon-button{border-radius:10px}
.header-menu{top:76px;padding:14px;background:rgba(22,36,54,.94);border:1px solid rgba(178,220,246,.22);border-radius:19px;box-shadow:0 24px 60px #0007,inset 0 1px 0 #ffffff0d;backdrop-filter:blur(20px)}
.menu-links a{border-radius:10px}.menu-user{padding:14px 10px 5px}.content{padding-top:34px}
.panel,.settings-page>.page-head,.referral-link-box,.hero-art,.price-preview{
  background:linear-gradient(135deg,rgba(34,53,77,.56),rgba(16,28,44,.66));
  border:1px solid var(--line);border-radius:22px;
  box-shadow:inset 0 1px 0 rgba(234,247,255,.055),0 10px 32px rgba(0,0,0,.09);
  backdrop-filter:blur(12px) saturate(130%);-webkit-backdrop-filter:blur(12px) saturate(130%);
}
.inset-card,.model-family,.key-list-panel,.domain-option,.range-panel,.muted-box{
  background:rgba(9,20,34,.36);border-color:var(--line-soft);border-radius:16px;box-shadow:inset 0 1px 0 #ffffff04;
}
.tinted,.balance-highlight{background:linear-gradient(135deg,rgba(51,100,136,.31),rgba(19,43,65,.50));border-color:rgba(135,213,255,.20)}
.overview-cards>.panel,.invitation-strip,.channel-strip{transition:border-color .22s,box-shadow .22s}
@media(hover:hover){.overview-cards>.panel:hover,.invitation-strip:hover,.channel-strip:hover{border-color:rgba(151,217,255,.3);box-shadow:inset 0 1px 0 #ffffff13,0 12px 34px #0002}}
.card-icon,.heading-icon{border-radius:13px;background:rgba(175,216,250,.05);border-color:rgba(175,216,250,.14);box-shadow:inset 0 1px 0 #ffffff07}
.card-icon.accent,.balance-highlight .card-icon{background:rgba(127,204,250,.11);border-color:rgba(155,220,255,.20)}
button,.button{border-radius:11px;transition:background .18s,border-color .18s,color .18s,box-shadow .18s,transform .18s}
button:active:not(:disabled),.button:active{transform:scale(.975)}
.primary{color:#071a29;background:linear-gradient(165deg,#b3e5ff,#73c5f8);border-color:rgba(190,236,255,.40);box-shadow:inset 0 1px 0 #ffffff5a,0 6px 20px rgba(27,112,171,.13)}
.primary:hover{background:linear-gradient(165deg,#cef0ff,#91d5ff);box-shadow:inset 0 1px 0 #ffffff75,0 8px 24px rgba(48,143,207,.18)}
.primary:disabled{color:#163549;background:linear-gradient(165deg,#b3e5ff,#73c5f8)}
.icon-button{border-radius:9px}.full-width{min-height:42px}
.copy-field{background:rgba(4,13,24,.43);border-color:rgba(149,199,230,.16);border-radius:13px;padding:12px 15px}
.copy-field:focus-within{border-color:rgba(140,215,255,.55)}
.support-button{border-radius:15px;background:rgba(21,36,53,.88);backdrop-filter:blur(18px);padding:8px 16px 8px 8px;box-shadow:0 8px 28px #0005}
.support-button>span{border-radius:10px;background:linear-gradient(145deg,#b0e6ff,#77c9f8)}
.support-button:hover{transform:translateY(-2px)}
.dashboard-greeting h1{letter-spacing:-.045em}.dashboard-greeting{border-color:var(--line-soft)}
.chart-panel{overflow:hidden}.chart-panel>.section-title{background:rgba(126,194,244,.025)}
.segmented{border-radius:13px;background:rgba(4,15,27,.44);padding:4px;border-color:var(--line-soft)}
.segmented button{border-radius:9px;min-height:34px}.segmented button.selected{background:rgba(137,211,253,.18);color:#b6e7ff;box-shadow:inset 0 0 0 1px rgba(144,215,255,.25),0 2px 6px #0002}
.no-requests-label{font:500 11px "Segoe UI",sans-serif;letter-spacing:0;color:var(--muted);display:block;max-width:86px}
.bar{height:7px;background:rgba(132,183,224,.075)}.bar>span{background:linear-gradient(90deg,#70c1ef,#b1e6ff);transition:width .35s var(--ease)}
.chart-line{stroke:#9addff;filter:drop-shadow(0 0 3px #7acaff44)}
.family-models{background:rgba(4,14,24,.35);border-color:var(--line-soft)}.model-family{overflow:hidden}
.model-family summary{padding:15px}.model-family[open] summary{background:var(--accent-soft)}
details[open]>.family-models,details[open]>.picker-body,details[open]>p{animation:small-reveal .2s var(--ease)}
.model-family summary>svg:last-child{transition:transform .2s}.model-family .family-models{border-radius:0 0 15px 15px}
.table-wrap,.endpoint-directory{border-radius:16px;border-color:var(--line)}
table{background:rgba(10,22,36,.4)}th{background:rgba(39,62,88,.28)}td{border-color:var(--line-soft)}tbody tr:hover{background:rgba(125,193,238,.04)}
input,select,textarea{border-radius:12px;background:rgba(5,16,29,.46);border-color:rgba(169,210,243,.18);min-height:46px;padding:12px 14px;transition:border-color .18s,box-shadow .18s,background .18s}
input:hover,select:hover,textarea:hover{border-color:rgba(145,204,244,.32)}
input:focus,select:focus,textarea:focus{outline:0;border-color:rgba(145,218,255,.65);box-shadow:0 0 0 3px rgba(135,209,251,.10);background:rgba(8,23,38,.75)}
input[type=checkbox]{min-height:16px;padding:0;border-radius:4px}
label{font-weight:550;color:#d7e7f7;line-height:1.5;margin:0 0 8px}
.form-field{display:grid;gap:0;margin:17px 0}.form-field>input{margin:0}
.form-field:first-child{margin-top:0}
.inset-card>form,.panel>form{margin-top:18px}
.inset-card h3{font-size:15px}.inset-card p{font-size:13px;line-height:1.7}.inset-card>.small{font-size:12px}
.inset-card .form-field{padding:0}.inset-card+.inset-card{margin-top:22px}
.settings-left>.panel,.settings-right>.panel{padding:22px}.settings-columns{gap:22px}
.settings-left>.panel>h2{font-size:18px;margin-bottom:24px}
.key-volume{border-radius:14px;background:rgba(3,13,24,.40)}.key-volume small{font-size:11px}.key-volume>div{padding:19px}
.key-tags{gap:8px}.key-icon-actions .icon-button{padding:7px;min-height:34px;width:32px}.key-row{padding:22px}
.model-picker{border:0;background:none;margin:8px 0 19px}
.model-picker-trigger{width:100%;justify-content:flex-start;gap:12px;padding:14px 16px;min-height:66px;border:1px solid rgba(136,198,240,.21);background:linear-gradient(110deg,rgba(114,187,235,.07),rgba(12,28,45,.40));border-radius:14px}
.model-picker-trigger>span:nth-child(2){flex:1;text-align:left}.model-picker-trigger b{display:block;font-size:13px}
.model-picker-trigger small{display:block;font-weight:400;font-size:11px;color:var(--muted);margin-top:3px}
.model-picker-trigger>.ui-icon:first-child{width:23px;height:23px;color:var(--accent)}
.model-picker-trigger:hover{background:rgba(131,204,249,.10);border-color:rgba(144,219,255,.40)}
.selection-caption{font-size:12px;margin:14px 0 0}
.model-all-option{margin:0 0 18px;padding:17px 18px;background:linear-gradient(110deg,rgba(79,153,204,.18),rgba(37,78,110,.13));border:1px solid #80cfff35;border-radius:16px;gap:12px}
.model-all-option>span{flex:1}.model-all-option b{display:block;color:var(--text)}.model-all-option small{display:block;font-size:11px;margin-top:4px}
.model-search-field{display:flex;gap:10px;align-items:center;padding:0 14px;border:1px solid var(--line);background:var(--input);border-radius:12px}
.model-search-field input{border:0;background:none;box-shadow:none;padding-left:0}.model-search-field>.ui-icon{color:var(--muted)}
.model-filters{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0}.model-filters button{font-size:11px;border-radius:20px;min-height:30px;padding:5px 11px;background:none}
.model-filters button.selected{background:var(--accent-soft);border-color:#88d3ff44;color:var(--accent)}
.model-selection-list{max-height:min(340px,40dvh);overflow:auto;display:grid;gap:8px;scrollbar-gutter:stable;padding:2px}
.model-choice{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid var(--line-soft);border-radius:13px;cursor:pointer;min-height:65px;margin:0;background:rgba(8,18,30,.32)}
.model-choice:hover{background:rgba(108,182,237,.055)}.model-choice:has(input:checked){border-color:rgba(130,210,255,.44);background:var(--accent-soft)}
.model-choice-icon{display:grid;place-items:center;width:34px;height:34px;background:#9cdcff0a;border-radius:10px;color:var(--accent)}
.model-choice>span:nth-last-child(2){flex:1;min-width:0}.model-choice code{display:block;font-size:10px;color:var(--muted);margin-top:3px}.model-price{font-family:Consolas,monospace;color:var(--accent);font-size:12px}
.all-selected .model-choice{opacity:.58}.all-selected .model-choice:hover{opacity:1}
.modal-open{overflow:hidden;scrollbar-gutter:stable}
dialog.glass-dialog{
  opacity:1;transform:none;transition:none;padding:0;width:min(600px,calc(100% - 28px));max-height:90dvh;
  border:1px solid rgba(190,229,255,.24);border-radius:26px;
  background:linear-gradient(140deg,rgba(27,44,64,.96),rgba(13,25,41,.97));
  box-shadow:0 30px 100px #0009,inset 0 1px 0 #ffffff12;
  backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%);
}
dialog.dialog-wide{width:min(700px,calc(100% - 28px))}
dialog::backdrop{background:rgba(2,8,18,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.modal-head{display:flex;gap:20px;justify-content:space-between;align-items:center;padding:26px 28px 22px;border-bottom:1px solid rgba(177,218,246,.11);background:rgba(163,219,255,.035);position:sticky;top:0;z-index:2;backdrop-filter:blur(28px)}
.modal-head h2{font-size:23px;letter-spacing:-.035em;line-height:1.2}.modal-eyebrow{font-size:9px;letter-spacing:.17em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:8px}
.modal-close{border:1px solid rgba(190,230,255,.12);border-radius:50%;width:32px;height:32px;min-height:32px;background:rgba(7,18,31,.26);color:var(--muted)}
.modal-body{padding:24px 28px 28px}.modal-intro{margin:0 0 22px;font-size:13px;color:#b3c4d8;line-height:1.7}
.modal-body>p{font-size:13px}.modal-body form{animation:none}.modal-body form>p:first-child{padding:14px 16px;margin:0 0 20px;background:rgba(139,200,248,.035);border:1px solid var(--line-soft);border-radius:12px}
.modal-body>.footer-actions{margin-top:22px}.footer-actions{padding-top:20px;margin:22px 0 0;border-top:1px solid rgba(166,209,240,.12);gap:10px}
.footer-actions button{min-height:42px;padding:10px 20px}.modal-bottom{display:flex;justify-content:flex-end;padding-top:18px}
dialog h3{margin:0;font-size:14px}.modal-body .notice{border-radius:12px}.modal-body .error{font-size:12px;border-radius:12px}
dialog.is-closing{pointer-events:none}dialog[data-submitting=true] [data-close]{opacity:.4;pointer-events:none}
.billing-parts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}
.billing-part{display:flex;gap:12px;padding:17px 16px;border:1px solid var(--line);border-radius:17px;background:rgba(8,21,35,.30)}
.part-icon{display:grid;place-items:center;width:33px;height:33px;flex:none;border-radius:10px;color:var(--accent);background:rgba(143,205,249,.07)}
.billing-part h3 small{display:block;font-size:10px;color:var(--dim);margin-top:4px;font-weight:400;letter-spacing:.015em}.billing-part p{font-size:11px;line-height:1.7;margin:10px 0 0}
.calculation-card{border:1px solid rgba(139,209,251,.20);border-radius:18px;background:linear-gradient(125deg,rgba(116,185,234,.07),rgba(7,18,31,.38));padding:20px}
.calculation-card>header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.calculation-card .eyebrow{margin:0;font-size:9px}.calculation-card .detail-list{margin:0;row-gap:11px;font-size:12px}
.calculation-total{display:flex;justify-content:space-between;gap:18px;align-items:end;border-top:1px solid var(--line);padding-top:16px;margin-top:18px;font-size:12px}
.calculation-total strong{font-size:25px;color:#c4ebff;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.calculation-total small{font-size:11px;font-weight:400}
.formula-details{margin-top:14px;border:1px solid var(--line-soft);border-radius:13px;overflow:hidden}.formula-details summary{padding:14px;font-size:12px;font-weight:500;display:flex;gap:8px;align-items:center;list-style:none}
.formula-details .code-window{margin:0;border-radius:0;border-inline:0;border-bottom:0}
.info-inline{display:flex;gap:11px;align-items:start;margin-top:20px;color:var(--accent)}.info-inline p{font-size:11px;margin:0;color:var(--muted)}.info-inline svg{width:16px;height:16px;margin-top:2px}
.amount-section{border:1px solid var(--line);border-radius:18px;background:rgba(5,16,29,.24);padding:20px}
.amount-section .section-title{margin:0 0 14px}.amount-section label{margin:0;font-size:12px;font-weight:500}.live-caption{display:flex;align-items:center;gap:5px;font-size:9px;color:#9ebad0}
.live-caption i{width:5px;height:5px;background:var(--accent);border-radius:50%;box-shadow:0 0 7px #86d4ff55}
.amount-input-wrap{display:flex;align-items:center;border:1px solid rgba(162,210,244,.15);border-radius:13px;background:rgba(4,13,25,.3);padding:0 16px;gap:8px}
.amount-input-wrap:focus-within{border-color:#88d3ff77;box-shadow:0 0 0 3px #88d3ff09}
.amount-input-wrap input{padding:11px 0;background:none;border:0;outline:0;box-shadow:none;min-height:64px;font-size:35px;font-weight:650;letter-spacing:-.05em;font-variant-numeric:tabular-nums;appearance:textfield}
.amount-input-wrap input::-webkit-inner-spin-button{appearance:none}.amount-input-wrap>span{font-size:24px;color:var(--muted);font-weight:400}
.range-control{margin:15px 0 12px}
input[type=range].amount-range{-webkit-appearance:none;appearance:none;width:100%;height:28px;min-height:28px;padding:0;margin:0;background:transparent;border:0;cursor:pointer;box-shadow:none}
.amount-range::-webkit-slider-runnable-track{height:7px;border-radius:10px;background:linear-gradient(to right,#9cddff 0%,#78caff var(--fill,2.69%),rgba(140,184,219,.16) var(--fill,2.69%),rgba(140,184,219,.16) 100%);border:1px solid #ffffff09}
.amount-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:21px;height:21px;margin-top:-8px;border-radius:50%;background:linear-gradient(130deg,#f2fbff,#a9dbfa);border:2px solid #ccedff;box-shadow:0 2px 10px #0006,0 0 0 5px rgba(128,203,250,.09)}
.amount-range:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.amount-range::-moz-range-track{height:7px;border-radius:10px;background:rgba(140,184,219,.16)}
.amount-range::-moz-range-progress{height:7px;border-radius:10px;background:#90d5ff}.amount-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#d9f1ff;border:2px solid #ccedff;box-shadow:0 0 0 5px #88d3ff16}
.range-labels{display:flex;justify-content:space-between;font-size:10px;color:var(--dim);margin-top:4px}
.amount-presets{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin:12px 0 0}
.amount-presets button{font-size:10px;padding:7px 5px;min-height:33px;border:1px solid transparent;background:rgba(107,160,201,.07);font-weight:500;white-space:nowrap}
.amount-presets button.selected{background:rgba(140,210,255,.15);border-color:rgba(150,220,255,.30);color:#c3ebff}
.field-feedback{font-size:11px;color:var(--warn);margin:8px 0 0;min-height:0}.field-feedback:empty{display:none}
.quote-card{padding:22px;border:1px solid #82c7f12b;border-radius:18px;margin-top:14px;background:radial-gradient(ellipse at 100% 0%,rgba(99,177,226,.13),transparent 70%),rgba(12,30,47,.45)}
.quote-card .section-title{margin-bottom:13px}.quote-card .section-title>span:first-child{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px}.quote-card .section-title>span .ui-icon{width:16px;height:16px}
.quote-token-value{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap;margin-bottom:22px}.quote-token-value strong{font-size:38px;letter-spacing:-.065em;line-height:1.2;color:#c9eeff;font-variant-numeric:tabular-nums}.quote-token-value>span{font-size:12px;color:var(--muted)}
.quote-details{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);padding-top:15px;gap:15px}
.quote-details>div{display:grid;gap:5px}.quote-details span{font-size:10px;color:var(--muted)}.quote-details b{font-size:14px;font-variant-numeric:tabular-nums;font-weight:550}
.quote-card>p{font-size:10px;margin:16px 0 0;color:var(--dim)}.payment-note{display:flex;gap:12px;align-items:start;margin:18px 0 0;padding:0 3px}
.payment-note>.ui-icon{color:var(--muted);margin-top:1px;flex:none;width:16px;height:16px}.payment-note b{font-size:11px;font-weight:550;color:var(--text)}.payment-note p{font-size:11px;color:var(--dim);margin:4px 0 0;line-height:1.6}
.payment-history-link{display:flex;margin:15px auto 0;font-size:11px}.payment-history-link .ui-icon{width:14px}
.code-window{border:1px solid rgba(166,208,239,.16);border-radius:18px;overflow:hidden;background:rgba(5,13,24,.83);box-shadow:0 12px 35px #0002,inset 0 1px 0 #ffffff04}
.code-titlebar{display:flex;align-items:center;gap:12px;padding:13px 16px;background:linear-gradient(180deg,rgba(52,71,95,.30),rgba(26,42,60,.24));border-bottom:1px solid #abcfff15;min-height:48px}
.traffic-lights{display:flex;gap:6px;flex:none}.traffic-lights i{width:9px;height:9px;border-radius:50%;background:#fd807b;box-shadow:inset 0 1px 0 #ffffff33}.traffic-lights i:nth-child(2){background:#edc16f}.traffic-lights i:nth-child(3){background:#6ac59b}
.code-filename{font-family:Consolas,monospace;font-size:11px;color:#a1b4ca;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.code-language{font-size:9px;letter-spacing:.06em;color:#7089a4}
.code-titlebar button{min-height:28px;padding:4px 8px;background:transparent;border:1px solid #ffffff0b;font-size:10px;color:var(--muted);border-radius:7px}.code-titlebar button .ui-icon{width:13px;height:13px}
.code-window pre{background:transparent;border:0;border-radius:0;margin:0;padding:22px 20px;color:#c7d6e9;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}
.code-window pre>code{font-size:12px;line-height:inherit;color:inherit;font-weight:400}
.code-comment{color:#708ba5}.code-string{color:#c1dca1}.code-keyword{color:#9fcbff}.code-number{color:#d5b18a}.code-variable{color:#b7a7e5}
.referral-page{display:grid;gap:22px}.referral-hero{position:relative;grid-template-columns:1.18fr 1fr;gap:55px;padding:48px;border-radius:28px;margin:0;background:radial-gradient(ellipse at 5% 5%,rgba(112,188,239,.12),transparent 58%),linear-gradient(120deg,rgba(31,55,79,.62),rgba(14,29,47,.62));border-color:#acd9fb26;backdrop-filter:blur(16px)}
.referral-copy>.eyebrow{font-size:10px;letter-spacing:.13em;display:flex;align-items:center;gap:8px;margin-bottom:24px}.referral-copy .eyebrow .ui-icon{width:17px}
.referral-hero h1{font-size:clamp(32px,3vw,46px);line-height:1.08;letter-spacing:-.055em;max-width:640px}.referral-hero h1 span{color:#99aec8}
.referral-copy>p{font-size:14px;max-width:415px;margin:20px 0 0;line-height:1.8}
.referral-reward{display:flex;gap:24px;align-items:center;margin-top:30px}.referral-reward>strong{font-size:86px;letter-spacing:-.075em;line-height:.95;font-weight:650;color:#bce9ff}.referral-reward>strong>span{font-size:.45em;margin-left:6px;font-weight:400;letter-spacing:-.03em}
.referral-reward>div{font-size:12px;color:#d4e7f5;line-height:1.6}.referral-reward small{display:block;max-width:165px;font-size:10px;color:var(--dim);margin-top:4px}
.referral-link-box{display:flex;flex-direction:column;align-items:center;text-align:center;padding:30px;box-shadow:inset 0 1px 0 #ffffff0c,0 20px 60px #0002;background:rgba(5,19,33,.35)}
.share-symbol{width:64px;height:64px;display:grid;place-items:center;border:1px solid #b5e4ff30;background:linear-gradient(140deg,#abe3ff1a,#53a4e004);border-radius:20px;box-shadow:inset 0 1px 0 #dcf3ff16;margin-bottom:20px;color:var(--accent)}
.share-symbol .ui-icon{width:30px;height:30px}.referral-link-box h2{font-size:17px;line-height:1.3}.referral-link-box p{font-size:12px;margin:11px 0 20px}
.referral-link-box .copy-field{width:100%;min-height:54px;text-align:left;padding:12px}.referral-link-box .copy-field code{font-size:11px;font-weight:400}
.referral-link-box>.primary{margin:12px 0 0;min-height:45px}.share-security{display:flex;align-items:start;justify-content:center;gap:7px;margin-top:18px;font-size:9px;color:var(--dim);max-width:280px;text-align:left}.share-security .ui-icon{width:12px;height:12px;flex:none;margin-top:2px}
.referral-steps{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:rgba(29,45,64,.28)}
.referral-steps>div{position:relative;padding:23px 24px;border-right:1px solid var(--line)}.referral-steps>div:last-child{border:0}.step-index{font-size:10px;letter-spacing:.12em;color:var(--dim)}.step-icon{float:right;color:var(--accent)}.referral-steps h3{font-size:14px;margin:15px 0 7px}.referral-steps p{font-size:11px;margin:0;line-height:1.8;max-width:270px}
.referral-body{grid-template-columns:1.35fr 1fr;gap:22px}.referral-history{min-height:265px}.referral-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:176px;text-align:center}.referral-empty>.ui-icon{width:28px;height:28px;color:var(--dim);margin-bottom:14px}.referral-empty h3{font-size:13px;color:#b6c7dc}.referral-empty p{font-size:11px;margin:8px 0 0}.referral-stats{gap:14px}.referral-stats>.panel{padding:21px}.referral-stats .section-title>span{font-size:11px;color:var(--muted)}.referral-stats strong{font-size:31px;font-weight:600}
.instructions-page>.page-head{margin-bottom:24px}.instructions-page .page-head h1{font-size:32px;margin:0}.instructions-page .page-head p{font-size:13px;max-width:660px}
.instruction-main,.instruction-aside{gap:20px}.instruction-aside{top:90px}.instructions-columns{gap:22px;grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr)}
.setup-wizard{padding:0;overflow:hidden}.wizard-heading{padding:24px 26px;background:rgba(128,195,245,.03);border-bottom:1px solid var(--line)}.wizard-heading h2{font-size:19px}.wizard-heading p{font-size:12px;margin:7px 0 0}
.wizard-step{padding:23px 26px;border-bottom:1px solid var(--line-soft)}.wizard-step:last-child{border:0}.wizard-step-head{display:flex;gap:12px;align-items:start;margin-bottom:16px}.wizard-number{width:25px;height:25px;display:grid;place-items:center;border-radius:9px;color:var(--accent);background:#8bcefa09;border:1px solid #8bcefa26;font-size:10px;flex:none}.wizard-step-head h3{font-size:14px;margin:1px 0 4px}.wizard-step-head p{font-size:11px;margin:0}
.wizard-step .option-buttons{gap:8px}.wizard-step .option-buttons>button{border-radius:11px;background:rgba(10,24,40,.4);padding:9px 13px;font-size:12px;min-height:41px;border-color:var(--line)}
.wizard-step .option-buttons>button.selected{background:rgba(133,208,254,.105);box-shadow:inset 0 1px 0 #ffffff08;border-color:rgba(142,215,255,.4);color:#c0eaff}
.wizard-step .app-options{margin-top:15px;padding-top:15px;border-top:1px solid var(--line-soft)}.os-option .ui-icon{width:15px;height:15px}
.guide-output>.section-title h2{font-size:17px}.guide-output{padding:22px 24px}.guide-status{display:flex;gap:10px;align-items:start;margin:18px 0;font-size:11px;color:var(--muted);padding:12px 14px;background:#7dbfff05;border:1px solid var(--line-soft);border-radius:11px}
.guide-status>.ui-icon{width:15px;height:15px;color:var(--accent);margin-top:2px;flex:none}.guide-status p{margin:0;font-size:11px;color:var(--muted)}.guide-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:15px 0 0}.guide-actions button{font-size:11px;min-height:35px;padding:7px 12px}.guide-actions>small{font-size:10px}
.restore-note{margin-top:20px;border-top:1px solid var(--line);padding-top:15px}.restore-note summary{font-size:11px;font-weight:500}.restore-note p{font-size:11px}
.endpoint-panel .section-title>button{white-space:nowrap}.endpoint-panel .copy-field{min-height:48px;border-radius:11px}.endpoint-panel label{font-size:11px;margin-top:16px}.domain-option{background:rgba(114,189,239,.06);padding:12px;border-radius:12px;gap:8px}.domain-option code{font-size:11px}.domain-option+small{display:block;margin-top:8px;font-size:10px;color:var(--dim)}
.catalog-family h3{font-size:12px}.catalog-model{padding:14px 0}.catalog-model code{font-size:10px}.catalog-model strong{font-size:12px}.faq-panel>h2{font-size:18px}.faq-panel summary small{font-size:9px}
.docs-hero{padding:12px 0 30px}.docs-hero h1{font-size:40px;line-height:1.1;max-width:850px}.docs-hero>p{font-size:14px}.docs-section>h2{font-size:26px}.endpoint-article{padding:24px;margin:18px 0 24px}.endpoint-article>h3{font-size:21px;margin:19px 0 8px}.endpoint-article>p{line-height:1.8;font-size:13px;margin-bottom:22px}.endpoint-directory-row{background:rgba(10,23,38,.30)}.doc-toc{padding:19px 20px;border:1px solid var(--line);border-radius:17px;background:rgba(12,25,42,.35)}
.admin-shell .settings-layout{gap:22px}.admin-shell .page-head{margin-bottom:24px}.admin-shell .settings-section .grid.two>label{grid-column:auto}.settings-section>.grid.two>.form-field{margin:12px 0 0}
.chat-composer{border-radius:20px;background:rgba(25,44,64,.40);border-color:#c7e8ff20;box-shadow:0 12px 40px #0002}.composer-row>textarea{border-radius:0}.chat-history{background:rgba(18,32,48,.5)}.chat-toolbar{background:rgba(12,23,37,.3)}.message.user>div{border-radius:16px}.chat-main{padding-bottom:25px}
#toast{background:rgba(27,48,68,.94);border:1px solid rgba(144,209,249,.28);backdrop-filter:blur(16px);border-radius:14px;box-shadow:0 12px 40px #0005;padding:13px 20px;animation:toast-in .2s var(--ease)}
.route-loading .site-header::after{content:"";height:2px;position:absolute;bottom:-1px;left:0;width:25%;background:linear-gradient(90deg,transparent,#a3e5ff,transparent);animation:route-progress 1.1s ease-in-out infinite;pointer-events:none}
.route-loading #main{opacity:.70;transition:opacity .14s}#main{transition:opacity .14s}
.skeleton{border-radius:18px;background:linear-gradient(90deg,#18294055,#49709333,#18294055);background-size:200% 100%}
@keyframes route-progress{0%{transform:translateX(-100%)}100%{transform:translateX(500%)}}
@keyframes small-reveal{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
@keyframes toast-in{from{opacity:0;bottom:17px}to{opacity:1;bottom:24px}}
@supports not (backdrop-filter:blur(1px)){.panel,.referral-link-box,.price-preview,.hero-art{background:#142235}.site-header{background:#0c1725}dialog.glass-dialog{background:#152338}.header-menu{background:#172638}}
@media(max-width:1100px){.referral-hero{padding:32px;gap:28px}.referral-hero h1{font-size:36px}.referral-reward>strong{font-size:76px}.referral-link-box{padding:24px}.instructions-columns{grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr)}}
@media(max-width:900px){.referral-hero{grid-template-columns:1fr 1fr;padding:28px;gap:24px}.referral-hero h1{font-size:30px}.referral-hero p{font-size:12px}.referral-reward{gap:14px}.referral-reward>strong{font-size:67px}.share-symbol{width:50px;height:50px;border-radius:16px}.referral-link-box h2{font-size:15px}.referral-link-box p{font-size:11px}.referral-link-box{padding:20px}.wizard-step,.wizard-heading{padding:20px}.guide-output{padding:20px}.live-caption{font-size:8px}}
@media(max-width:760px){
  .content{padding-top:25px}.site-header{height:65px}.header-inner{height:64px}.header-menu{top:71px}
  .panel{border-radius:19px}.settings-columns,.instructions-columns{grid-template-columns:1fr}
  .referral-hero{grid-template-columns:1fr;padding:30px 24px;gap:28px;border-radius:24px}.referral-hero h1{font-size:38px}.referral-copy>p{font-size:13px}.referral-reward>strong{font-size:90px}
  .referral-link-box{padding:26px}.referral-link-box h2{font-size:17px}.referral-link-box p{font-size:12px}.referral-body{grid-template-columns:1fr}.referral-steps{grid-template-columns:1fr;border-radius:18px}.referral-steps>div{border-right:0;border-bottom:1px solid var(--line-soft);padding:20px 24px}.referral-steps h3{margin-top:8px}.referral-steps p{max-width:none}.referral-steps>div:last-child{border:0}
  dialog.glass-dialog{width:calc(100% - 24px);max-height:92dvh;border-radius:23px}.modal-head{padding:21px 22px 18px}.modal-head h2{font-size:22px}.modal-body{padding:20px 22px 23px}
  .quote-token-value strong{font-size:35px}.amount-section,.quote-card{padding:17px}.amount-presets button{font-size:9px}.calculation-total strong{font-size:23px}
  .guide-actions{flex-wrap:wrap}.code-window pre{padding:18px 15px}.code-window pre>code{font-size:11px}.code-filename{font-size:10px}.code-titlebar{padding:12px}.code-language{display:none}
  .billing-part{padding:14px 12px;gap:9px}.part-icon{width:29px;height:29px}.billing-part p{font-size:11px}.billing-parts{gap:10px}
  .instructions-page .page-head h1{font-size:29px}.instruction-aside{position:static}
}
@media(max-width:420px){
  .content{padding-inline:14px}.referral-hero h1{font-size:30px}.referral-hero{padding:24px 20px}.referral-reward>strong{font-size:78px}.referral-reward>div{font-size:11px}.referral-link-box{padding:22px 18px}
  .referral-stats>.panel{padding:18px}.referral-stats strong{font-size:27px}.billing-parts{grid-template-columns:1fr}.billing-part p{font-size:11px;margin-top:7px}
  .modal-body{padding:18px 17px 20px}.modal-head{padding:20px 18px 16px}.modal-head h2{font-size:21px}.amount-input-wrap input{font-size:31px;min-height:59px}.amount-section .live-caption{max-width:90px;font-size:8px;line-height:1.5}
  .amount-presets{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.amount-presets button{font-size:10px}.quote-token-value strong{font-size:30px}
  .model-choice{padding:11px;gap:8px}.model-choice b{font-size:11px}.model-choice code{font-size:9px}.model-choice-icon{display:none}.model-modal-form .footer-actions button{padding-inline:14px}.model-all-option{padding:15px}
  .wizard-step,.wizard-heading,.guide-output{padding:19px 17px}.wizard-step .option-buttons>button{font-size:11px;padding:9px 11px}
  .key-volume>div{padding:13px}.key-volume strong{font-size:15px}.settings-left>.panel,.settings-right>.panel{padding:17px}.code-titlebar{gap:8px}.traffic-lights i{width:8px;height:8px}
  .support-button{font-size:11px;border-radius:13px}.support-button>span{width:30px;height:30px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .route-loading #main{opacity:1}.route-loading .site-header::after{animation:none;width:100%;background:#84cfff44}
}
@media(prefers-contrast:more){:root{--muted:#c2d2e5;--dim:#aabbce;--line:rgba(211,235,255,.4)}.panel,dialog.glass-dialog{background:#142235;backdrop-filter:none}}

/* Instruction wizard refinements. Keep the flow calm and scannable on small screens. */
.wizard-step .option-buttons>button{position:relative}
.wizard-step .option-buttons>button .option-hint,.wizard-step .option-buttons>button small.option-hint{
  display:block;margin-top:3px;font-size:9px;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);font-weight:600
}
.guide-model-trigger{width:100%;justify-content:flex-start;gap:12px;text-align:left}
.guide-model-trigger>span:nth-child(2){flex:1;min-width:0}
.guide-model-trigger b,.guide-model-trigger small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.guide-model-trigger small{margin-top:4px;color:var(--muted);font-size:10px;font-weight:400}
.guide-model-trigger>.ui-icon:first-child{color:var(--accent);width:22px;height:22px}
.guide-model-trigger>.ui-icon:last-child{color:var(--dim);width:15px;height:15px}
.guide-model-trigger:disabled{opacity:.65}
.model-choice input[type=radio],.model-choice input[type=checkbox]{
  flex:0 0 17px;width:17px;height:17px;min-height:17px;margin:0;padding:0;accent-color:var(--accent);box-shadow:none
}
.model-choice>span:nth-last-child(2){min-width:0}
.model-choice code{overflow-wrap:anywhere}
.guide-mode{max-width:300px;margin:0 0 15px}
.guide-status{min-height:42px}
.guide-status p{line-height:1.6}
.guide-output{border:1px solid rgba(155,213,246,.18);border-radius:18px;background:rgba(6,17,29,.22)}
.guide-output>.section-title{align-items:flex-start}
.guide-output>.section-title>div:first-child{min-width:0}
.guide-output .guide-actions{margin:0;justify-content:flex-end}
.guide-output #guide-code .code-window{margin-top:17px}
.guide-output .code-window pre{min-height:138px}
.guide-output .code-titlebar{background:linear-gradient(180deg,rgba(76,110,142,.28),rgba(28,47,68,.22))}
.guide-output .code-titlebar .code-filename{color:#c7d7e8}
.guide-output .code-titlebar .code-language{color:#8db4d0}
.guide-output .primary:disabled{filter:saturate(.55)}
.faq-panel .section-title{align-items:flex-start}
.faq-panel .section-title p{max-width:420px}
.faq-panel #faq-list details{border-color:var(--line-soft);padding:15px 0}
.faq-panel #faq-list details:first-child{border-top:1px solid var(--line-soft)}
.faq-panel #faq-list details summary{display:flex;justify-content:space-between;gap:14px;align-items:center}
.faq-panel #faq-list details summary small{flex:none}
.endpoint-panel .copy-field code{max-width:calc(100% - 42px)}
.topup-form{display:grid;grid-template-columns:1.05fr 1fr;gap:16px;align-items:stretch}
.topup-form .quote-card{margin:0;min-width:0;padding:20px}
.topup-form .amount-section{padding:20px;min-width:0}
.topup-form .amount-presets{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.topup-form .amount-presets button{min-height:36px}
.topup-form .quote-token-value{display:block;margin:25px 0}
.topup-form .quote-token-value strong{font-size:34px;display:block}
.topup-form .quote-token-value>span{display:block;margin-top:8px}
.topup-form .quote-details{grid-template-columns:1fr;gap:15px}
.topup-form .quote-details>div{display:flex;justify-content:space-between;align-items:center;gap:8px}
.topup-form .quote-details b{margin:0}.topup-form .quote-card .section-title{flex-wrap:wrap;gap:10px}
.topup-form .payment-note,.topup-form .footer-actions{grid-column:1/-1;margin-top:0}
.topup-form .footer-actions{padding-top:17px}
@media(max-width:760px){
  .guide-output{padding:18px 16px}
  .guide-output>.section-title{display:grid;gap:12px}
  .guide-output .guide-actions{justify-content:flex-start;margin:0}
  .guide-mode{max-width:none}
}
@media(max-width:580px){
  .topup-form{grid-template-columns:1fr;gap:14px}
  .topup-form .quote-token-value{margin:18px 0}.topup-form .quote-token-value strong{font-size:32px}
  .topup-form .quote-token-value>span{display:inline}
  .topup-form .quote-details{grid-template-columns:1fr 1fr}
  .topup-form .quote-details>div{display:grid;gap:5px}
  .topup-form .quote-card,.topup-form .amount-section{padding:17px}
}
