:root{--bg:#000;--panel:#0b0b0b;--line:#2b2b29;--muted:#858580;--text:#f4f4f1;--blue:#4796e3;--purple:#7859ae;--cyan:#6ee7ff;--orange:#da7756;--red:#f85149;--green:#54c980;--mono:"DM Mono",ui-monospace,monospace;--sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:#000;color:var(--text);font-family:var(--sans);font-size:14px}.app-shell{min-height:100vh;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:32px 32px;user-select:none}.topbar{height:64px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 32px;background:rgba(0,0,0,.9);position:sticky;top:0;z-index:10;backdrop-filter:blur(14px)}.brand{display:flex;gap:10px;align-items:center;color:var(--text);text-decoration:none;font:500 16px var(--mono)}.brand small{color:var(--muted);font-size:9px;letter-spacing:.09em;text-transform:uppercase;border-left:1px solid var(--line);padding-left:10px}.brand-mark{width:21px;height:20px;display:flex;align-items:end;gap:3px}.brand-mark i{display:block;width:5px;background:var(--blue);box-shadow:0 0 10px rgba(71,150,227,.75)}.brand-mark i:nth-child(1){height:9px}.brand-mark i:nth-child(2){height:16px;background:var(--purple)}.brand-mark i:nth-child(3){height:12px;background:var(--orange)}.topbar-actions{display:flex;gap:18px;align-items:center;font:11px var(--mono)}.topbar-actions a{color:#d6d6d1;text-decoration:none}.topbar-actions a:hover{color:var(--blue)}.local-badge{color:#b8b8b2;border:1px solid #33332f;border-radius:5px;padding:6px 8px}.local-badge i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);margin-right:5px}.workspace{max-width:1480px;margin:0 auto;padding:26px 32px 56px}.tabs{height:42px;display:flex;align-items:stretch;border-bottom:1px solid var(--line);gap:4px;margin-bottom:31px;overflow:auto}.tab{border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);font:12px var(--mono);padding:0 13px;cursor:pointer;white-space:nowrap}.tab:hover{color:var(--text)}.tab.active{border-color:var(--blue);color:#fff}.tab em,.beta{font:9px var(--mono);font-style:normal;color:var(--cyan);border:1px solid rgba(110,231,255,.36);border-radius:4px;padding:2px 4px;margin-left:4px}.tab b{font:9px var(--mono);color:#111;background:var(--orange);border-radius:9px;padding:2px 5px;margin-left:3px}.panel{display:none}.panel.active{display:block}.page-heading{display:flex;justify-content:space-between;gap:22px;align-items:flex-end;margin-bottom:24px}.eyebrow{margin:0 0 8px;color:#777772;font:10px var(--mono);letter-spacing:.12em}.page-heading h1{font-size:30px;letter-spacing:-.035em;margin:0 0 7px;font-weight:600}.page-heading>div>p:not(.eyebrow){margin:0;color:var(--muted);font-size:13px}.heading-actions{display:flex;gap:8px;align-items:center}.primary-button,.ghost-button,.danger-button,.refresh-button,.icon-button{border-radius:6px;border:1px solid transparent;height:34px;padding:0 12px;font:11px var(--mono);cursor:pointer;transition:.18s ease}.primary-button{background:#e8e8e2;color:#090909}.primary-button:hover{background:#fff;box-shadow:0 0 16px rgba(255,255,255,.16)}.ghost-button{background:#121210;color:#d1d1cb;border-color:#343430}.ghost-button:hover{border-color:#676762;color:#fff}.danger-button{background:rgba(248,81,73,.11);color:#ff918b;border-color:rgba(248,81,73,.4)}.danger-button:hover{background:rgba(248,81,73,.21)}.quota-summary{display:grid;grid-template-columns:repeat(3,minmax(100px,1fr)) auto;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:7px;overflow:hidden;margin-bottom:20px}.quota-summary>div,.refresh-button{background:var(--panel);padding:14px 16px}.quota-summary span{display:block;color:var(--muted);font:10px var(--mono);margin-bottom:6px}.quota-summary strong{font:500 16px var(--mono)}.refresh-button{height:auto;color:#d9eaff}.refresh-button:hover{background:#151d24}.quota-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.quota-card{position:relative;min-height:191px;background:linear-gradient(145deg,#121211,#080808);border:1px solid #30302e;border-radius:8px;padding:16px;overflow:hidden;cursor:pointer;transition:border-color .2s,transform .2s,box-shadow .2s}.quota-card:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 8px 26px color-mix(in srgb,var(--accent) 17%,transparent)}.quota-card.selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 30%,transparent),0 0 24px color-mix(in srgb,var(--accent) 16%,transparent)}.quota-card::after{content:"";position:absolute;width:130px;height:130px;right:-65px;bottom:-70px;border-radius:50%;background:var(--accent);opacity:.075;filter:blur(22px)}.quota-card-head{display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:1}.provider-name{display:flex;gap:9px;align-items:center;font:12px var(--mono)}.provider-mark{width:25px;height:25px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--accent) 50%,#333);border-radius:5px;color:var(--accent);font:11px var(--mono);background:color-mix(in srgb,var(--accent) 10%,#0b0b0b)}.quota-state{font:9px var(--mono);color:var(--green);background:rgba(84,201,128,.1);border:1px solid rgba(84,201,128,.25);border-radius:4px;padding:4px 5px}.quota-state.warning{color:#f4c972;background:rgba(244,201,114,.09);border-color:rgba(244,201,114,.2)}.account-id{margin:17px 0 9px;color:#aaa9a2;font:10px var(--mono)}.quota-value{display:flex;align-items:baseline;gap:6px;position:relative;z-index:1}.quota-value strong{font:600 28px var(--mono)}.quota-value span{color:#8e8e88;font:10px var(--mono)}.meter{height:5px;border-radius:6px;background:#282825;overflow:hidden;margin-top:12px;position:relative;z-index:1}.meter i{display:block;height:100%;border-radius:inherit;background:var(--accent);box-shadow:0 0 10px var(--accent)}.card-footer{position:absolute;left:16px;right:16px;bottom:14px;display:flex;justify-content:space-between;color:#787873;font:9px var(--mono)}.dot{width:8px;height:8px;border-radius:50%;display:inline-block}.ag{background:var(--blue);box-shadow:0 0 9px var(--blue)}.codex{background:#f4f4f1;box-shadow:0 0 9px #fff}.claude{background:var(--orange);box-shadow:0 0 9px var(--orange)}.copilot{background:var(--red);box-shadow:0 0 9px var(--red)}.usage-layout,.remote-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.8fr);gap:14px}.usage-chart-card,.usage-breakdown,.tunnel-card,.remote-options,.route-list,.route-canvas,.route-inspector,.settings-card,.danger-zone{border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:18px}.card-title{display:flex;justify-content:space-between;align-items:center;font:11px var(--mono);color:#b7b7b1}.card-title strong{font-weight:500;color:#f5f5f0}.chart{height:250px;display:flex;align-items:end;gap:10px;padding:24px 3px 7px;border-bottom:1px solid #2a2a27;background:repeating-linear-gradient(to bottom,transparent 0,transparent 61px,rgba(255,255,255,.045) 62px)}.chart i{flex:1;min-width:18px;border-radius:4px 4px 1px 1px;background:linear-gradient(to top,var(--blue),var(--purple));box-shadow:0 0 14px rgba(71,150,227,.26);transition:height .35s}.chart i:hover{filter:brightness(1.32)}.chart-labels{display:flex;justify-content:space-between;color:#75756f;font:9px var(--mono);padding-top:10px}.provider-row{display:grid;grid-template-columns:12px 1fr auto;align-items:center;border-top:1px solid #292926;padding:17px 0;font:11px var(--mono)}.provider-row:first-of-type{margin-top:12px}.provider-row b{font-weight:400;color:#ddd}.status-pill{border:1px solid rgba(248,81,73,.35);background:rgba(248,81,73,.09);color:#ff9893;border-radius:5px;padding:7px 9px;font:10px var(--mono);white-space:nowrap}.status-pill i{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:5px}.status-pill.online{border-color:rgba(84,201,128,.35);background:rgba(84,201,128,.09);color:#72d59a}.tunnel-card{min-height:288px;background:linear-gradient(135deg,#101010,#080808);position:relative;overflow:hidden}.tunnel-card::before{content:"";position:absolute;inset:auto -20% -80% 30%;height:200px;background:radial-gradient(circle,rgba(71,150,227,.15),transparent 64%);pointer-events:none}.tunnel-card code{display:block;border:1px solid #30302d;background:#050505;padding:10px;border-radius:5px;color:#a6d7ff;font:11px var(--mono);margin-top:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tunnel-visual{height:114px;display:flex;align-items:center;justify-content:center;gap:8px;position:relative}.local-node,.cloud-node{border:1px solid #454541;border-radius:6px;background:#0a0a09;padding:10px 13px;text-align:center;color:#a9a9a2;font:10px var(--mono);line-height:1.45}.local-node b{color:var(--blue)}.cloud-node b{color:var(--cyan)}.tunnel-visual>i{width:34px;height:1px;background:var(--blue);box-shadow:0 0 8px var(--blue)}.tunnel-visual>i:nth-of-type(2){background:var(--cyan);box-shadow:0 0 8px var(--cyan)}.remote-actions{display:flex;gap:8px;position:relative;z-index:1}.remote-options{padding:8px 16px}.remote-options .card-title{padding:10px 0 9px}.remote-options small{font:9px var(--mono);color:#777770}.provider-option{width:100%;display:grid;grid-template-columns:30px 1fr 14px;text-align:left;align-items:center;gap:10px;border:0;border-top:1px solid #292926;background:transparent;padding:15px 0;color:#d9d9d3;cursor:pointer}.provider-option:hover,.provider-option.active{color:#fff}.provider-option>i{height:7px;width:7px;border:1px solid #60605b;border-radius:50%}.provider-option.active>i{border:2px solid var(--cyan);box-shadow:0 0 9px rgba(110,231,255,.7)}.option-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:5px;background:#22221f;color:#ddd;font:10px var(--mono)}.option-icon.cloudflare{color:#f89b5b}.option-icon.ngrok{color:#c894f5}.option-icon.tailscale{color:#63a8ff}.provider-option b,.provider-option small{display:block;font:11px var(--mono)}.provider-option small{margin-top:4px}.notice{display:flex;gap:10px;border-left:2px solid var(--orange);color:#9c9c96;font:11px var(--mono);padding:12px 13px;margin-top:14px;background:rgba(218,119,86,.06)}.notice b{color:#e5b197;font-weight:400}.routing-layout{display:grid;grid-template-columns:190px minmax(440px,1fr) 220px;gap:12px}.route-list,.route-inspector{padding:10px}.route-list>p{color:#777770;font:10px var(--mono);padding:4px 8px;margin:0 0 8px}.route-profile{width:100%;display:block;text-align:left;border:1px solid transparent;background:transparent;color:#b1b1ab;padding:11px 10px;border-radius:6px;cursor:pointer}.route-profile:hover{background:#151513}.route-profile.active{border-color:rgba(110,231,255,.35);background:rgba(110,231,255,.07);color:#e9ffff}.route-profile b,.route-profile small{display:block;font:11px var(--mono)}.route-profile small{font-size:9px;color:#75756f;margin-top:4px}.route-canvas{min-height:355px;overflow:hidden;background-image:radial-gradient(rgba(110,231,255,.14) 1px,transparent 1px);background-size:18px 18px}.canvas-caption{display:grid;grid-template-columns:1fr 2fr 1fr;color:#777770;font:9px var(--mono);letter-spacing:.06em}.canvas-caption span:nth-child(2){text-align:center}.canvas-caption span:last-child{text-align:right}.route-graph{height:265px;display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative}.route-graph::before{content:"";height:1px;position:absolute;left:15%;right:15%;top:50%;background:linear-gradient(90deg,var(--blue),var(--purple),var(--orange));opacity:.56;box-shadow:0 0 13px rgba(110,231,255,.33)}.request-node,.response-node,.route-node{position:relative;z-index:1;border:1px solid #484843;background:#0b0b0a;border-radius:7px;font:10px var(--mono);text-align:center}.request-node,.response-node{padding:14px 10px;color:#c2c2bd}.request-node b{color:var(--blue)}.response-node b{color:var(--green)}.chain{display:flex;gap:9px;align-items:center;position:relative;z-index:1}.route-node{padding:11px 8px;min-width:83px;cursor:pointer;transition:.18s}.route-node:hover,.route-node.selected{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 0 17px color-mix(in srgb,var(--accent) 18%,transparent)}.route-node span,.route-node b{display:block}.route-node span{font-size:9px;color:#898983;margin-bottom:5px}.route-node b{font-weight:500;color:var(--accent)}.canvas-help{margin:0;color:#73736d;text-align:center;font:9px var(--mono)}.route-inspector.empty{display:grid;place-items:center;color:#777770;font:10px var(--mono);text-align:center}.inspector-head{border-bottom:1px solid #2c2c28;padding:6px 4px 13px;margin-bottom:12px}.inspector-head span{display:block;color:#7f7f79;font:9px var(--mono);margin-bottom:6px}.inspector-head b{font:12px var(--mono);color:var(--accent)}.inspector-row{padding:10px 4px;border-bottom:1px solid #252522;font:10px var(--mono)}.inspector-row span{color:#787872;display:block;margin-bottom:4px}.inspector-row b{font-weight:400}.compact-heading{align-items:center}.log-toolbar{display:flex;gap:7px;align-items:center;border:1px solid var(--line);border-bottom:0;border-radius:8px 8px 0 0;background:#0c0c0b;padding:10px}.log-filter{border:1px solid #31312e;border-radius:4px;background:#121210;color:#979791;padding:5px 7px;font:9px var(--mono);cursor:pointer}.log-filter.active{border-color:var(--blue);color:#bde0ff}.log-toolbar span{margin-left:auto;color:#787872;font:9px var(--mono)}.log-console{min-height:336px;max-height:480px;overflow:auto;border:1px solid var(--line);border-radius:0 0 8px 8px;background:#050505;padding:8px}.log-line{display:grid;grid-template-columns:82px 48px 1fr;gap:8px;padding:7px 8px;border-bottom:1px solid rgba(255,255,255,.035);color:#aaa9a3;font:10px var(--mono)}.log-line time{color:#6f6f6a}.log-line b{font-weight:400}.log-line.info b{color:var(--blue)}.log-line.warn b{color:#f4c972}.log-line.error b{color:var(--red)}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.settings-card,.danger-zone{min-height:102px;display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.settings-card b,.settings-card small,.danger-zone b,.danger-zone small{display:block}.settings-card b,.danger-zone b{font:12px var(--mono);color:#e4e4de;margin-bottom:8px}.settings-card small,.danger-zone small{font:10px var(--mono);color:#85857f;line-height:1.5;max-width:420px}.switch{display:block;position:relative;width:34px;height:20px;flex:0 0 auto}.switch input{opacity:0;width:0;height:0}.switch i{position:absolute;inset:0;border-radius:11px;background:#292925;border:1px solid #44443f;cursor:pointer;transition:.2s}.switch i::after{content:"";position:absolute;width:12px;height:12px;left:3px;top:3px;border-radius:50%;background:#a3a39d;transition:.2s}.switch input:checked+i{background:rgba(71,150,227,.28);border-color:var(--blue)}.switch input:checked+i::after{transform:translateX(14px);background:#ddecff;box-shadow:0 0 8px var(--blue)}.danger-zone{margin-top:12px;border-color:rgba(248,81,73,.23);background:rgba(248,81,73,.045);align-items:center}.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.73);backdrop-filter:blur(6px);z-index:50;padding:18px}.modal.open{display:flex}.modal-card{width:min(420px,100%);position:relative;border:1px solid #42423d;border-radius:8px;background:#10100f;padding:23px;box-shadow:0 24px 65px rgba(0,0,0,.55)}.modal-card h2{margin:0 0 9px;font-size:20px;letter-spacing:-.03em}.modal-card>p:not(.eyebrow){margin:0;color:#92928c;font-size:12px;line-height:1.55}.modal-close{position:absolute;right:13px;top:12px;border:0;background:transparent;color:#85857f;font:17px var(--mono);cursor:pointer}.modal-close:hover{color:white}.add-options{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}.add-options button{display:flex;align-items:center;gap:9px;border:1px solid #343430;border-radius:5px;padding:12px;background:#151513;color:#d8d8d2;text-align:left;font:11px var(--mono);cursor:pointer}.add-options button:hover{border-color:#72726c;color:white}.diagnostic-list{border-top:1px solid #2b2b27;margin:17px 0}.diagnostic-list>div{display:grid;grid-template-columns:8px 1fr auto;gap:9px;align-items:center;border-bottom:1px solid #292925;padding:12px 1px;font:10px var(--mono)}.diagnostic-list span{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}.diagnostic-list b{font-weight:400}.diagnostic-list small{font-size:9px;color:#8e8e88}.diagnostic-list .warn span{background:#f4c972;box-shadow:0 0 8px #f4c972}.wide-button{width:100%}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:21px}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,18px);opacity:0;pointer-events:none;border:1px solid #3a3a35;border-radius:6px;background:#171715;color:#e3e3dc;padding:10px 13px;font:11px var(--mono);box-shadow:0 9px 25px rgba(0,0,0,.38);transition:.22s;z-index:60}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:900px){.quota-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.routing-layout{grid-template-columns:160px minmax(390px,1fr)}.route-inspector{display:none}.routing-layout{overflow:auto}.route-canvas{min-width:510px}}@media(max-width:620px){.topbar{padding:0 17px}.brand small,.local-badge{display:none}.workspace{padding:19px 16px 40px}.tabs{margin-bottom:24px}.page-heading{display:block}.page-heading h1{font-size:27px}.heading-actions{margin-top:15px;flex-wrap:wrap}.quota-summary{grid-template-columns:1fr 1fr}.quota-summary>div:nth-child(3){border-top:1px solid var(--line)}.refresh-button{border-top:1px solid var(--line)}.quota-grid,.settings-grid,.usage-layout,.remote-layout{grid-template-columns:1fr}.quota-card{min-height:174px}.chart{height:190px}.page-heading .status-pill{display:inline-block;margin-top:14px}.notice{line-height:1.45}.route-list{display:none}.routing-layout{display:block;overflow:visible}.route-canvas{min-width:0;overflow:auto}.route-graph{min-width:500px}.remote-options{padding:8px 14px}.log-line{grid-template-columns:66px 40px 1fr;font-size:9px}.danger-zone{align-items:center}.topbar-actions{gap:12px}}