:root{--bg:#f4f7fb;--surface:#fff;--surface-2:#f8fbfe;--ink:#172033;--muted:#657286;--faint:#8c98aa;--line:#dce5ef;--line-strong:#c9d6e4;--blue:#2563eb;--blue-soft:#eaf1ff;--teal:#00a88f;--teal-soft:#e6f8f4;--amber:#d97706;--amber-soft:#fff4df;--red:#d14343;--red-soft:#fff0f0;--shadow:0 18px 42px #1c273b14;--radius:8px;color:var(--ink);background:var(--bg);letter-spacing:0;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:15px;line-height:1.5}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:linear-gradient(180deg, #ffffffd6, #f4f7fbfa 42%), var(--bg);min-width:320px;overflow-x:hidden}button,select,input{font:inherit;letter-spacing:0}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}.is-disabled{pointer-events:none;opacity:.5}code{font-family:SFMono-Regular,Consolas,Liberation Mono,monospace}.user-shell{grid-template-columns:238px minmax(0,1fr);min-height:100vh;display:grid}.portal-login{background:linear-gradient(135deg,#111827f0,#1d4ed8d1),#111827;place-items:center;min-height:100vh;padding:28px;display:grid}.portal-login-card{border-radius:var(--radius);background:var(--surface);border:1px solid #ffffff29;grid-template-columns:minmax(280px,.9fr) minmax(320px,1fr);width:min(960px,100%);display:grid;overflow:hidden;box-shadow:0 28px 80px #00000042}.login-visual{color:#fff;background:linear-gradient(160deg,#7ef5e224,#58a6ff1a),#111827;flex-direction:column;justify-content:flex-end;gap:14px;min-height:450px;padding:34px;display:flex}.login-visual h1,.portal-login-form h2{margin:0}.login-visual h1{font-size:36px;line-height:1.08}.login-visual p{color:#eff8ffb8;max-width:360px;margin:0}.portal-login-form{gap:15px;padding:38px;display:grid}.portal-login-form h2{font-size:28px}.portal-login-form label{gap:6px;display:grid}.portal-login-form label span{color:var(--faint);font-size:12px;font-weight:760}.portal-login-form input{border:1px solid var(--line);border-radius:var(--radius);width:100%;height:40px;color:var(--ink);background:#fff;outline:0;padding:0 10px}.login-demo{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface-2);gap:5px;padding:12px;display:grid}.login-error{border-radius:var(--radius);color:#8a2432;background:#fff1f2;border:1px solid #fecdd3;padding:10px 12px;font-size:13px;font-weight:720}.login-error.neutral{color:#075569;background:#ecfeff;border-color:#bae6fd}.login-demo span{color:var(--faint);font-size:12px}.login-demo code{color:var(--blue);overflow-wrap:anywhere}.user-sidebar{color:#eff8ff;background:#111827;border-right:1px solid #ffffff14;min-width:0;height:100vh;padding:22px 16px;position:sticky;top:0}.user-brand{align-items:center;gap:12px;padding:4px 6px 18px;display:flex}.brand-mark{border-radius:var(--radius);color:#06211e;background:linear-gradient(135deg,#7ef5e2,#58a6ff);place-items:center;width:42px;height:42px;display:grid;box-shadow:0 12px 28px #2563eb42}.user-brand strong{font-size:18px;line-height:1.1;display:block}.user-brand span{color:#eff8ff9e;font-size:12px}.user-nav{flex-direction:column;gap:6px;min-width:0;display:flex}.user-nav button{border-radius:var(--radius);color:#eff8ffb8;text-align:left;background:0 0;border:1px solid #0000;align-items:center;gap:10px;width:100%;min-height:42px;padding:0 12px;display:flex}.user-nav button:hover,.user-nav button.selected{color:#fff;background:#2563eb2e;border-color:#7ef5e247}.user-workspace{min-width:0;padding:20px 24px 34px}.user-topbar{justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px;display:flex}.user-topbar h1{margin:0;font-size:27px;font-weight:800;line-height:1.15}.user-topbar p{color:var(--muted);margin:4px 0 0}.topbar-actions,.hero-actions,.metric-row,.country-cell,.iphone-actions{align-items:center;gap:10px;display:flex}.account-switch{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);gap:2px;min-width:168px;padding:7px 32px 7px 12px;display:grid;position:relative}.account-switch span{color:var(--faint);font-size:12px}.account-switch select{appearance:none;color:var(--teal);background:0 0;border:0;outline:0;font-weight:750}.account-switch svg{color:var(--faint);position:absolute;bottom:11px;right:10px}.account-display{padding-right:12px}.account-display strong{color:var(--teal)}.portal-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;display:grid}.span-12{grid-column:span 12}.span-8{grid-column:span 8}.span-7{grid-column:span 7}.span-5{grid-column:span 5}.span-4{grid-column:span 4}.hero-panel,.panel,.quota-panel,.plan-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.hero-panel{color:#fff;background:linear-gradient(135deg,#14b8a6e0,#2563ebf0),#1d4ed8;justify-content:space-between;align-items:flex-end;gap:20px;min-height:210px;padding:28px;display:flex}.hero-panel h2{margin:12px 0 8px;font-size:42px;line-height:1.04}.hero-panel p{color:#ffffffd1;max-width:620px;margin:0}.state-dot{background:#ffffff24;border:1px solid #ffffff3d;border-radius:999px;align-items:center;gap:8px;height:28px;padding:0 10px;font-size:13px;font-weight:760;display:inline-flex}.state-dot:before{content:"";background:#7ef5e2;border-radius:50%;width:7px;height:7px}.panel,.quota-panel,.plan-card{padding:18px}.quota-number{margin:10px 0 8px;font-size:38px;font-weight:850;line-height:1}.progress{background:#e9eef5;border-radius:999px;height:9px;overflow:hidden}.progress span{border-radius:inherit;background:linear-gradient(90deg, var(--teal), var(--blue));max-width:100%;height:100%;display:block}.panel-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.panel-header>div{align-items:center;gap:8px;min-width:0;display:flex}.panel-header svg{color:var(--blue)}.panel-header h2,.page-intro h2{margin:0;font-size:18px;line-height:1.2}.panel-header span{color:var(--muted);white-space:nowrap;font-size:12px}.page-intro{justify-content:space-between;align-items:end;gap:20px;padding:3px 2px;display:flex}.page-intro p{max-width:780px;color:var(--muted);margin:0}.filter-row{flex-wrap:wrap;gap:10px;margin-bottom:2px;display:flex}.filter-row select,.filter-row input,.pagination-bar select{border:1px solid var(--line);border-radius:var(--radius);height:38px;color:var(--ink);background:#fff;outline:0;padding:0 10px}.filter-row input{min-width:260px}.pagination-bar{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;display:flex}.pagination-bar>div{flex-wrap:wrap;gap:8px;display:flex}.pagination-bar span{color:var(--muted);font-size:13px;font-weight:720}.metric{flex:1;min-width:0;padding-top:12px}.metric span,.detail span,.feature span{color:var(--faint);font-size:12px;display:block}.metric strong,.detail strong,.feature strong{color:var(--ink);overflow-wrap:anywhere;font-size:14px;display:block}.detail-list{gap:12px;display:grid}.detail,.feature{gap:3px;display:grid}.primary-btn,.ghost-btn,.icon-btn{border-radius:var(--radius);border:1px solid #0000;justify-content:center;align-items:center;gap:7px;min-height:38px;font-weight:760;text-decoration:none;display:inline-flex}.primary-btn{color:#fff;background:var(--blue);padding:0 14px;box-shadow:0 10px 24px #2563eb33}.ghost-btn{color:var(--ink);background:var(--surface);border-color:var(--line);padding:0 14px}.hero-panel .ghost-btn{color:#fff;background:#ffffff1f;border-color:#ffffff3d}.icon-btn{width:38px;color:var(--ink);background:var(--surface);border-color:var(--line);padding:0}.link-cards,.link-grid,.plans-row{gap:12px;display:grid}.compact-links{max-height:310px;overflow:auto}.link-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.link-grid.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}.link-grid.one-col{grid-template-columns:1fr}.link-card,.sub-card{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface-2)}.link-card{text-align:left;width:100%;min-height:64px;color:var(--ink);justify-content:space-between;align-items:center;gap:10px;padding:11px 12px;display:flex}.link-card strong,.link-card small{display:block}.link-card small,.sub-card span,.plan-subtitle{color:var(--muted);font-size:12px}.sub-card{grid-template-columns:minmax(0,1fr) auto;gap:12px;min-height:184px;padding:15px;display:grid;position:relative}.sub-card-main{gap:10px;min-width:0;display:grid}.sub-card strong{font-size:18px;display:block}.sub-card code,.token-line code{text-overflow:ellipsis;white-space:nowrap;color:#075985;background:#eef8ff;border:1px solid #cfeeff;border-radius:6px;max-width:100%;padding:9px;display:block;overflow:hidden}.sub-card-actions{grid-column:1/-1;justify-content:flex-end;display:flex}.qr-box{width:132px;color:var(--muted);align-content:start;justify-items:center;gap:6px;font-size:11px;font-weight:720;display:grid}.qr-box img,.qr-box>span{border:1px solid var(--line);background:#fff;border-radius:6px;width:96px;height:96px}.qr-box img{display:block}.qr-box>span{place-items:center;display:grid}.qr-box.disabled{opacity:.5}.sub-card.disabled{background:#f7f9fb}.sub-card.disabled strong,.sub-card.disabled span,.sub-card.disabled code{color:var(--faint)}.token-line{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;display:grid}.token-line span{color:var(--muted);font-size:13px}.iphone-actions{flex-direction:column;align-items:stretch}.inline-actions{flex-flow:wrap;margin-top:14px}.qr-strip{flex-wrap:wrap;gap:12px;margin-top:14px;display:flex}.iphone-actions button{width:100%}.inline-actions button{width:auto}.ikev2-phone-card{border-radius:var(--radius);border:1px solid var(--line);background:#f7f9fc;display:grid;overflow:hidden}.ikev2-field{border-bottom:1px solid var(--line);background:var(--surface);grid-template-columns:120px minmax(0,1fr);align-items:center;gap:14px;min-height:48px;padding:0 16px;display:grid}.ikev2-field span{color:var(--ink);font-weight:720}.ikev2-field strong{min-width:0;color:var(--muted);overflow-wrap:anywhere;font-weight:680}.mono-text{font-family:SFMono-Regular,Consolas,Liberation Mono,monospace}.ikev2-section-label{color:var(--faint);background:#f7f9fc;padding:14px 16px 8px;font-size:12px}.iphone-note{border-radius:var(--radius);color:#065f46;background:var(--teal-soft);border:1px solid #c5efe6;gap:9px;margin-top:14px;padding:12px;display:flex}.iphone-note span{font-size:13px}.iphone-note.warning{color:#854d0e;background:#fff7ed;border-color:#fed7aa}.ikev2-guide{border-radius:var(--radius);border:1px solid var(--line);background:#fbfdff;gap:10px;margin-top:14px;padding:14px;display:grid}.ikev2-guide strong{color:var(--ink);font-size:14px}.ikev2-guide ol{gap:8px;margin:0;padding-left:20px;display:grid}.ikev2-guide li{color:#334155;font-size:13px;line-height:1.55}.table-shell{overflow-x:auto}.empty-state{min-height:180px;color:var(--muted);text-align:center;border:1px dashed var(--line);border-radius:var(--radius);background:var(--surface-2);place-items:center;gap:8px;padding:24px;display:grid}.empty-state strong{color:var(--ink)}.empty-state span{max-width:420px;font-size:13px}.mini-empty{border:1px dashed var(--line);border-radius:var(--radius);color:var(--muted);background:var(--surface-2);padding:12px;font-size:13px}.proxy-code-btn{color:#075985;background:#eaf7ff;border:1px solid #bfdbfe;border-radius:6px;padding:3px 7px;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:12px;font-weight:740}.proxy-code-btn:hover{border-color:var(--blue);background:#dbeafe}.modal-backdrop{z-index:80;background:#0f172a6b;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.usage-modal{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);width:min(720px,100%);max-height:min(760px,100vh - 40px);padding:18px;overflow:auto;box-shadow:0 28px 80px #0f172a3d}.modal-head,.usage-snippet-head,.usage-ok{align-items:center;display:flex}.modal-head{justify-content:space-between;gap:14px;margin-bottom:14px}.modal-head span{color:var(--faint);font-size:12px;font-weight:760}.modal-head strong{font-size:22px;display:block}.usage-ok{color:#065f46;background:var(--teal-soft);border-radius:var(--radius);border:1px solid #c5efe6;gap:9px;margin-bottom:14px;padding:10px 12px;font-size:13px}.usage-snippets{gap:10px;margin-top:14px;display:grid}.usage-snippet{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-2);overflow:hidden}.usage-snippet-head,.usage-snippet-head>div{align-items:center;display:flex}.usage-snippet-head{border-bottom:1px solid var(--line);justify-content:space-between;gap:10px;padding:9px 10px}.usage-snippet-head>div{gap:8px;min-width:0}.usage-snippet-head strong{margin-right:auto}.usage-snippet-body{grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:12px;padding:12px;display:grid}.usage-snippet pre{white-space:pre-wrap;color:#0f172a;margin:0;font-size:12px}table{border-collapse:collapse;width:100%;min-width:720px}th,td{border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;padding:12px 10px}th{color:var(--faint);background:var(--surface-2);font-size:12px;font-weight:760}td{color:var(--ink)}td code{color:#075985}.country-cell{color:var(--muted);justify-content:flex-start}.protocol{color:#065f46;background:var(--teal-soft);border:1px solid #c5efe6;border-radius:6px;align-items:center;min-height:24px;padding:0 8px;font-size:12px;font-weight:760;display:inline-flex}.chart-bars{grid-template-columns:repeat(7,minmax(0,1fr));align-items:end;gap:10px;min-height:220px;display:grid}.bar-item{color:var(--muted);justify-items:center;gap:6px;font-size:12px;display:grid}.bar-track{background:#e8eef6;border-radius:999px;width:100%;height:150px;position:relative;overflow:hidden}.bar-track span{border-radius:inherit;background:linear-gradient(180deg, var(--blue), var(--teal));position:absolute;bottom:0;left:0;right:0}.plans-row{grid-template-columns:repeat(3,minmax(0,1fr))}.plan-card{gap:14px;display:grid}.plan-card.current{border-color:#2563eb57;box-shadow:0 18px 42px #2563eb1f}.plan-card-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.plan-card h2{margin:0;font-size:21px}.plan-card-head strong{color:var(--blue);font-size:19px}.feature-list{gap:10px;display:grid}.loading-state{min-height:360px;color:var(--muted);place-items:center;gap:12px;display:grid}.loading-state svg{animation:1s linear infinite spin}.user-toast{z-index:20;border-radius:var(--radius);color:#fff;background:#111827;padding:11px 14px;position:fixed;bottom:22px;right:22px;box-shadow:0 18px 44px #11182733}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=1180px){.span-8,.span-7,.span-5,.span-4{grid-column:span 12}.link-grid,.plans-row{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=840px){.user-shell,.portal-login-card{grid-template-columns:1fr}.login-visual{min-height:220px}.user-sidebar{max-width:100vw;height:auto;padding:12px;position:static}.user-brand{padding:2px 4px 10px}.user-nav{flex-direction:row;width:100%;max-width:100%;padding-bottom:4px;overflow-x:auto}.user-nav button{flex:none;width:auto}.user-workspace{padding:16px}.user-topbar,.hero-panel,.page-intro,.token-line{flex-direction:column;align-items:stretch}.topbar-actions{width:100%}.account-switch{flex:1}.hero-panel{min-height:230px;padding:22px}.hero-panel h2{font-size:34px}.hero-actions{flex-wrap:wrap}.ikev2-field{grid-template-columns:90px minmax(0,1fr);min-height:46px;padding:0 12px}.inline-actions{flex-direction:column}.inline-actions button{width:100%}.filter-row,.pagination-bar{flex-direction:column;align-items:stretch}.filter-row select,.filter-row input,.pagination-bar select{width:100%;min-width:0}.link-grid,.link-grid.two-col,.plans-row,.sub-card,.usage-snippet-body{grid-template-columns:1fr}.qr-box{width:100%}.chart-bars{min-width:560px}.panel:has(.chart-bars){overflow-x:auto}}