@import url(/fonts/fonts.css);
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:#F5F5F7;color:#1D1D1F;font:15px/1.45 'Geist',-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#0066CC}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid #0071E3;outline-offset:2px}
.top{position:sticky;top:0;z-index:5;background:rgba(255,255,255,.85);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);box-shadow:0 1px 0 rgba(0,0,0,.07)}
.top div{max-width:900px;margin:0 auto;padding:0 20px;min-height:52px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px}
.brand{display:flex;align-items:center;gap:8px;margin-right:auto;font-weight:600;letter-spacing:-.02em;color:inherit;text-decoration:none}
.top a:not(.brand),.linkbtn{font-size:14px;color:#1D1D1F;opacity:.75;text-decoration:none;background:none;border:0;padding:4px;cursor:pointer}
main{max-width:900px;margin:0 auto;padding:28px 20px 80px}
h1{margin:0 0 4px;font-size:30px;line-height:1.1;letter-spacing:-.035em;overflow-wrap:anywhere}
h2{margin:0 0 4px;font-size:18px;letter-spacing:-.02em}
.muted{color:#6E6E73;margin:0}
.small{font-size:13px}
.card{background:#fff;border-radius:18px;padding:20px;margin-top:12px;box-shadow:0 0 0 1px rgba(0,0,0,.03)}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.grow{flex:1 1 200px;min-width:0;overflow-wrap:anywhere}
.btn{min-height:38px;padding:0 15px;border:0;border-radius:980px;background:#EDEDF0;font-size:14px;font-weight:500;cursor:pointer;text-decoration:none;color:#1D1D1F;display:inline-flex;align-items:center;white-space:nowrap;transition:background-color .15s,transform .14s cubic-bezier(.23,1,.32,1)}
.btn:hover{background:#E2E2E7}.btn:active{transform:scale(.96)}
.btn.p{background:#0071E3;color:#fff}.btn.p:hover{background:#0066CC}
.btn.d{color:#C4271C}
.btn[disabled]{opacity:.55;cursor:default}
input{height:40px;padding:0 13px;border:1px solid #D2D2D7;border-radius:10px;background:#fff;min-width:0;font-size:16px}
label.f{display:flex;flex-direction:column;gap:3px;font-size:12.5px;color:#6E6E73;flex:1 1 170px;min-width:0}
label.f input{width:100%;color:#1D1D1F}
.err{color:#C4271C;font-size:14px;margin:8px 0 0}
.err:empty{display:none}
.item{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:11px 0;border-top:1px solid #F0F0F2}
.dot{flex:none;width:10px;height:10px;border-radius:50%;background:#C7C7CC}
.dot.up{background:#34C759}.dot.slow{background:#FF9F0A}.dot.down{background:#FF3B30}
.tag{font-size:12px;padding:2px 9px;border-radius:980px;background:#F5F5F7;color:#6E6E73}
.tag.warn{background:#FFF5E0;color:#5A3B00}.tag.good{background:#E9F8EE;color:#0F5A2A}
.mt{margin-top:12px}
.signin{max-width:400px;margin:9vh auto 0}
.signin form{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.code{font:600 26px/1 'Geist Mono',ui-monospace,monospace;letter-spacing:.35em;text-align:center;height:58px}
.panelgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:16px}
.panelcard{display:flex;flex-direction:column;gap:6px;background:#fff;border-radius:18px;padding:18px;color:inherit;text-decoration:none;box-shadow:0 0 0 1px rgba(0,0,0,.03);transition:transform .25s cubic-bezier(.23,1,.32,1)}
@media (hover:hover){.panelcard:hover{transform:translateY(-3px)}}
.panelcard b{font-size:17px;letter-spacing:-.02em;overflow-wrap:anywhere}
.share{font:14px 'Geist Mono',ui-monospace,monospace;background:#F5F5F7;border-radius:10px;padding:10px 12px;overflow-wrap:anywhere}
.tabs{display:flex;flex-wrap:wrap;gap:5px;margin:12px 0}
.tabs button{min-height:32px;padding:0 11px;border:0;border-radius:980px;background:#F0F0F2;font-size:13px;cursor:pointer}
.tabs button[aria-selected=true]{background:#1D1D1F;color:#fff}
pre{position:relative;margin:8px 0 0;padding:14px;border-radius:12px;background:#1D1D1F;color:#F5F5F7;font:13px/1.55 'Geist Mono',ui-monospace,monospace;overflow:auto;white-space:pre}
ol.steps{margin:8px 0 0;padding-left:20px}
ol.steps li{margin:5px 0}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:8px;border-top:1px solid #F0F0F2;overflow-wrap:anywhere}
th{color:#6E6E73;font-weight:500;font-size:12.5px;border-top:0}
.scroll{overflow-x:auto}
.toast{position:fixed;z-index:20;left:50%;bottom:22px;transform:translateX(-50%);padding:10px 18px;border-radius:980px;background:#1D1D1F;color:#fff;font-size:14px;max-width:90vw}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:14px}
.check{display:flex;flex-direction:column;gap:6px;min-width:0;padding:16px;border:1px solid #E5E5EA;border-left:5px solid #C7C7CC;border-radius:14px;background:#FBFBFD}
.check.up{border-left-color:#34C759}.check.slow{border-left-color:#FF9F0A}.check.down{border-left-color:#FF3B30}
.check b{font-size:16px;letter-spacing:-.02em;overflow-wrap:anywhere}
.check .ms{font-size:26px;font-weight:700;letter-spacing:-.03em;line-height:1.1}
.check .ms small{font-size:13px;font-weight:600}
.check .btn{align-self:flex-start;margin-top:auto}
.addbox{margin-top:14px;padding:14px;border:1.5px dashed #D2D2D7;border-radius:14px}
.key{background:#E9F8EE;border-radius:12px;padding:14px;margin-top:12px}
code{font-family:'Geist Mono',ui-monospace,monospace;font-size:.92em;overflow-wrap:anywhere}

/* ---------- panel page: header, setup checklist, tabs ---------- */
h3{margin:0 0 4px;font-size:16px;letter-spacing:-.015em}
.phead{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 16px}
.phead .muted.row{gap:7px;margin-top:4px}
.setup{border:1px solid #DCEBFF}
.progress{height:5px;border-radius:5px;background:#EDEDF0;margin:10px 0 4px;overflow:hidden}
.progress b{display:block;height:100%;background:#0071E3;transform-origin:0 50%;transition:transform .5s cubic-bezier(.23,1,.32,1)}
.steplist{list-style:none;margin:6px 0 0;padding:0}
.steplist li{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid #F0F0F2}
.steplist li:first-child{border-top:0}
.steplist li .grow{display:flex;flex-direction:column}
.steplist .num{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#EDEDF0;font-size:13px;font-weight:600}
.steplist li.done .num{background:#34C759;color:#fff}
.steplist li.done b{color:#6E6E73;text-decoration:line-through;text-decoration-color:#C7C7CC}
.ptabs{position:sticky;top:52px;z-index:4;display:flex;gap:2px;margin:18px -20px 0;padding:6px 20px;overflow-x:auto;scrollbar-width:none;background:rgba(245,245,247,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.ptabs::-webkit-scrollbar{display:none}
.ptabs a{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 13px;border-radius:980px;color:#1D1D1F;text-decoration:none;font-size:14px;font-weight:500;opacity:.7;transition:background-color .15s,opacity .15s}
.ptabs a:hover{opacity:1;background:#EBEBEF}
.ptabs a[aria-selected=true]{opacity:1;background:#1D1D1F;color:#fff}
.ptabs .count{font-size:11.5px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;display:inline-grid;place-items:center;background:rgba(0,0,0,.08)}
.ptabs a[aria-selected=true] .count{background:rgba(255,255,255,.22)}
.tabbody{animation:tabin .25s cubic-bezier(.23,1,.32,1)}
@keyframes tabin{from{opacity:0;transform:translateY(4px)}}

/* ---------- overview ---------- */
.choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin-top:12px}
.choice{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;padding:16px;border:1px solid #E5E5EA;border-radius:14px;background:#FBFBFD;cursor:pointer;transition:border-color .15s,transform .2s cubic-bezier(.23,1,.32,1)}
.choice .ico{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;margin-bottom:8px;background:#EAF2FF;color:#0071E3}
.choice .ico.bot{background:#EEEFFE;color:#5865F2}.choice .ico.data{background:#E9F8EE;color:#1A7F3C}
.choice b{font-size:15px}
@media (hover:hover){.choice:hover{border-color:#0071E3;transform:translateY(-2px)}}
.wlist{margin-top:10px}
.wrow{display:flex;align-items:center;gap:12px;width:100%;padding:12px 8px;border:0;border-top:1px solid #F0F0F2;background:none;text-align:left;cursor:pointer;border-radius:8px}
.wrow:first-child{border-top:0}
.wrow:hover{background:#F7F7F9}
.wrow .grow{display:flex;flex-direction:column}
.wval{font:600 15px 'Geist Mono',ui-monospace,monospace;white-space:nowrap}
.wval.down{color:#C4271C}.wval.slow{color:#A05A00}
.dot.pulse{background:#0071E3;animation:dotpulse 1.4s ease-in-out infinite}
@keyframes dotpulse{50%{opacity:.3}}

/* ---------- forms ---------- */
.addbox h3{margin-bottom:6px}
details.more{margin-top:10px}
details.more summary{cursor:pointer;font-size:13.5px;color:#0066CC;width:max-content}
.card .linkbtn{background:none;border:0;padding:4px;color:#0066CC;cursor:pointer}
.panelcard .tag{align-self:flex-start}

/* ---------- bots ---------- */
.setupbox h3{font-size:18px}
ol.steps.big{padding-left:22px;margin-top:14px}
ol.steps.big li{margin:0 0 16px;padding-left:4px}
ol.steps.big li::marker{font-weight:700}
.waitline{display:flex;align-items:center;gap:8px;margin:6px 0 12px;padding:12px 14px;border-radius:12px;background:#F0F6FF;color:#0B3D91;font-size:14px;font-weight:500}
.waitline.ok{background:#E9F8EE;color:#0F5A2A}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:2px 0}
.facts div{background:#F2F2F5;border-radius:9px;padding:6px 8px}
.facts dt{font-size:11.5px;color:#6E6E73}
.facts dd{margin:0;font-weight:600;font-size:14px;font-variant-numeric:tabular-nums}
.minibars{display:flex;gap:2px;height:22px;margin:4px 0 2px}
.minibars span{flex:1;min-width:0;border-radius:2px;background:#E5E5EA}
.minibars span.up{background:#34C759}.minibars span.slow{background:#FF9F0A}.minibars span.down{background:#FF3B30}
.hero{max-width:620px;margin:6vh auto 0}
.hero h1{font-size:36px}
ol.how{list-style:none;counter-reset:n;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:22px 0 6px;padding:0}
ol.how li{counter-increment:n;background:#fff;border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:3px;box-shadow:0 0 0 1px rgba(0,0,0,.03)}
ol.how li::before{content:counter(n);width:24px;height:24px;border-radius:50%;background:#0071E3;color:#fff;display:grid;place-items:center;font-size:13px;font-weight:600;margin-bottom:4px}
ol.how li span{font-size:13px;color:#6E6E73}
@media (max-width:600px){.ptabs{position:static;margin:14px -20px 0}h1{font-size:26px}}
@media (prefers-reduced-motion:reduce){.tabbody,.dot.pulse{animation:none}}

/* ---------- dark mode ---------- */
html[data-theme=dark]{color-scheme:dark}
html[data-theme=dark] body{background:#0E0E10;color:#F5F5F7}
html[data-theme=dark] a{color:#4DA3FF}
html[data-theme=dark] svg rect[fill="#1D1D1F"]{fill:#2C2C2E}
html[data-theme=dark] .top{background:rgba(22,22,24,.82);box-shadow:0 1px 0 rgba(255,255,255,.08)}
html[data-theme=dark] .top a:not(.brand),html[data-theme=dark] .top .linkbtn{color:#F5F5F7}
html[data-theme=dark] .muted,html[data-theme=dark] label.f,html[data-theme=dark] th,html[data-theme=dark] ol.how li span,html[data-theme=dark] .facts dt{color:#98989D}
html[data-theme=dark] .card,html[data-theme=dark] .panelcard,html[data-theme=dark] ol.how li{background:#1C1C1E;box-shadow:0 0 0 1px rgba(255,255,255,.06)}
html[data-theme=dark] .btn{background:#2C2C2E;color:#F5F5F7}
html[data-theme=dark] .btn:hover{background:#3A3A3C}
html[data-theme=dark] .btn.p{background:#0A84FF;color:#fff}html[data-theme=dark] .btn.p:hover{background:#2E95FF}
html[data-theme=dark] .btn.d,html[data-theme=dark] .err{color:#FF6B5E}
html[data-theme=dark] input{background:#141416;border-color:#3A3A3C;color:#F5F5F7}
html[data-theme=dark] label.f input{color:#F5F5F7}
html[data-theme=dark] .item,html[data-theme=dark] th,html[data-theme=dark] td,html[data-theme=dark] .steplist li,html[data-theme=dark] .wrow{border-color:#2C2C2E}
html[data-theme=dark] .tag,html[data-theme=dark] .share,html[data-theme=dark] .facts div,html[data-theme=dark] .tabs button{background:#2C2C2E;color:#C7C7CC}
html[data-theme=dark] .tag.warn{background:#3A2C0C;color:#FFD27A}
html[data-theme=dark] .tag.good{background:#0F2E1A;color:#7EE2A0}
html[data-theme=dark] .tabs button[aria-selected=true]{background:#F5F5F7;color:#1D1D1F}
html[data-theme=dark] pre{background:#000;box-shadow:0 0 0 1px #2C2C2E}
html[data-theme=dark] .toast{background:#F5F5F7;color:#1D1D1F}
html[data-theme=dark] .check,html[data-theme=dark] .choice{background:#232325;border-color:#2C2C2E}
html[data-theme=dark] .check{border-left-color:#48484A}
html[data-theme=dark] .check.up{border-left-color:#30D158}html[data-theme=dark] .check.slow{border-left-color:#FF9F0A}html[data-theme=dark] .check.down{border-left-color:#FF453A}
html[data-theme=dark] .check span[style*="C4271C"]{color:#FF6B5E!important}
html[data-theme=dark] .addbox{border-color:#3A3A3C}
html[data-theme=dark] .key{background:#0F2E1A}
html[data-theme=dark] .setup{background:#17191E;border-color:#22324A}
html[data-theme=dark] .progress,html[data-theme=dark] .steplist .num,html[data-theme=dark] .minibars span{background:#2C2C2E}
html[data-theme=dark] .minibars span.up{background:#30D158}html[data-theme=dark] .minibars span.slow{background:#FF9F0A}html[data-theme=dark] .minibars span.down{background:#FF453A}
html[data-theme=dark] .progress b{background:#0A84FF}
html[data-theme=dark] .steplist li.done .num{background:#30D158;color:#000}
html[data-theme=dark] .steplist li.done b{color:#98989D;text-decoration-color:#48484A}
html[data-theme=dark] .ptabs{background:rgba(14,14,16,.88)}
html[data-theme=dark] .ptabs a{color:#F5F5F7}
html[data-theme=dark] .ptabs a:hover{background:#2C2C2E}
html[data-theme=dark] .ptabs a[aria-selected=true]{background:#F5F5F7;color:#1D1D1F}
html[data-theme=dark] .ptabs .count{background:rgba(255,255,255,.14)}
html[data-theme=dark] .ptabs a[aria-selected=true] .count{background:rgba(0,0,0,.12)}
html[data-theme=dark] .wrow:hover{background:#232325}
html[data-theme=dark] .wval.down{color:#FF6B5E}html[data-theme=dark] .wval.slow{color:#FFB340}
html[data-theme=dark] .choice .ico{background:#13263F;color:#4DA3FF}
html[data-theme=dark] .choice .ico.bot{background:#1E2147;color:#8C95FF}
html[data-theme=dark] .choice .ico.data{background:#0F2E1A;color:#5FD38A}
@media (hover:hover){html[data-theme=dark] .choice:hover{border-color:#0A84FF}}
html[data-theme=dark] .waitline{background:#0F1D33;color:#8AB8FF}
html[data-theme=dark] .waitline.ok{background:#0F2E1A;color:#7EE2A0}
html[data-theme=dark] .dot{background:#48484A}
html[data-theme=dark] .dot.up{background:#30D158}html[data-theme=dark] .dot.slow{background:#FF9F0A}html[data-theme=dark] .dot.down{background:#FF453A}html[data-theme=dark] .dot.pulse{background:#0A84FF}
html[data-theme=dark] .card .linkbtn,html[data-theme=dark] details.more summary{color:#4DA3FF}
html[data-theme=dark] .top .brand{color:#F5F5F7}

/* clear history */
.clearbox{display:contents}
.clearmenu{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px;border-radius:12px;background:#F2F2F5}
html[data-theme=dark] .clearmenu{background:#2C2C2E}
html[data-theme=dark] .clearmenu .btn{background:#3A3A3C}
.check .row .btn{margin-top:0}
