.dashboard.dashboard-page { display:grid; grid-template-columns:190px minmax(0, 1fr); gap:36px; width:calc(100% - 64px); max-width:1160px; margin:0 auto; padding:44px 0 64px; color:var(--text); }
.dashboard .dash-sidebar { display:flex; flex-direction:column; padding:4px 0; min-width:0; }
.dashboard .dash-workspace-label { padding:0 14px; margin-bottom:20px; font-size:11px; font-weight:600; letter-spacing:1.8px; color:var(--muted); }
.dashboard .dash-nav { display:flex; flex-direction:column; gap:6px; }
.dashboard .dash-nav-button { position:relative; display:flex; align-items:center; gap:11px; border:1px solid transparent; background:transparent; color:var(--muted); padding:12px 14px; font:inherit; font-size:13px; border-radius:10px; text-align:left; cursor:pointer; transition:background .18s, color .18s; }
.dashboard .dash-nav-button:hover { background:var(--surface); color:var(--text); }
.dashboard .dash-nav-button.active { background:color-mix(in srgb, var(--accent) 11%, var(--surface)); border-color:color-mix(in srgb, var(--accent) 15%, transparent); color:var(--accent); }
.dashboard .dash-nav-indicator { display:none; }
.dashboard .dash-nav-button.active::after { content:""; width:4px; height:4px; margin-left:auto; border-radius:50%; background:var(--accent); }
.dashboard .dash-sidebar-bottom { margin-top:auto; padding-top:160px; }
.dashboard .dash-sidebar-help { display:flex; align-items:center; gap:9px; color:var(--muted); background:none; border:0; width:100%; padding:12px 14px; font:inherit; font-size:12px; cursor:pointer; }
.dashboard .dash-sidebar-help:hover { color:var(--text); }
.dashboard .dash-sidebar-help .icon:last-child { margin-left:auto; }
.dashboard .dash-user { display:flex; align-items:center; gap:9px; padding:18px 0 0; margin-top:12px; border-top:1px solid var(--border); }
.dashboard .dash-avatar { display:grid; place-items:center; flex:none; width:32px; height:32px; border:1px solid color-mix(in srgb,var(--accent) 35%,transparent); border-radius:50%; background:color-mix(in srgb,var(--accent) 12%,var(--surface)); color:var(--accent); font-size:12px; font-weight:700; }
.dashboard .dash-user > div { min-width:0; }
.dashboard .dash-user strong { display:block; font-size:12px; font-weight:500; }
.dashboard .dash-user div > span { display:block; width:115px; margin-top:4px; color:var(--muted); font-size:9px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.dashboard .dash-user .dash-icon-button { margin-left:auto; }
.dashboard .dash-main { min-width:0; }
.dashboard .dash-page-heading { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:24px; }
.dashboard .dash-kicker { display:block; font-size:10px; letter-spacing:1.7px; font-weight:500; color:var(--muted); }
.dashboard .dash-page-heading h1 { display:flex; flex-wrap:wrap; align-items:center; gap:12px; font-size:29px; line-height:1.4; letter-spacing:-.6px; margin:8px 0 6px; font-weight:650; }
.dashboard .dash-page-heading p { font-size:12px; color:var(--muted); margin:0; }
.dashboard .dash-demo-badge { font-size:9px; letter-spacing:1px; padding:4px 7px; color:var(--muted); background:var(--surface); border:1px solid var(--border); font-weight:500; line-height:1.2; }
.dashboard .dash-account-label { display:flex; align-items:center; gap:6px; font-size:11px; white-space:nowrap; color:var(--muted); }
.dashboard .dash-demo-notice { display:flex; align-items:flex-start; gap:8px; padding:11px 13px; margin-bottom:20px; background:color-mix(in srgb,var(--accent) 4%, var(--surface)); border:1px solid color-mix(in srgb,var(--accent) 12%, var(--border)); border-radius:9px; color:var(--muted); font-size:11px; line-height:1.65; }
.dashboard .dash-demo-notice > .icon { flex:none; margin-top:1px; color:var(--accent); }
.dashboard [data-dash-panel][hidden], .dashboard .dash-node-card[hidden] { display:none; }
.dashboard .dash-card { background:var(--surface); border:1px solid var(--border); border-radius:16px; }
.dashboard .dash-subscription { position:relative; padding:25px 26px 24px; background:radial-gradient(ellipse at 97% 0%, color-mix(in srgb,var(--accent) 9%, transparent), transparent 55%),var(--surface); }
.dashboard .dash-subscription-top { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.dashboard .dash-subscription .dash-kicker { letter-spacing:0; font-size:11px; }
.dashboard .dash-plan-title { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:8px; }
.dashboard .dash-plan-title h2 { margin:0; font-size:21px; font-weight:600; letter-spacing:-.4px; }
.dashboard .dash-active { border:1px solid color-mix(in srgb,var(--green) 16%, transparent); border-radius:5px; padding:3px 6px; color:var(--green); background:color-mix(in srgb,var(--green) 6%, transparent); font-size:9px; }
.dashboard .dash-subscription-top p { color:var(--muted); font-size:11px; margin:7px 0 0; }
.dashboard .dash-plan-icon { display:grid; place-items:center; width:45px; height:45px; border-radius:13px; border:1px solid color-mix(in srgb,var(--accent) 20%, transparent); background:color-mix(in srgb,var(--accent) 8%, transparent); color:var(--accent); }
.dashboard .dash-usage-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-top:25px; }
.dashboard .dash-usage-number { font-size:31px; line-height:1; letter-spacing:-.9px; font-weight:550; font-variant-numeric:tabular-nums; }
.dashboard .dash-usage-unit { color:var(--muted); font-size:12px; }
.dashboard .dash-usage-caption { color:var(--muted); font-size:11px; }
.dashboard .dash-progress { height:6px; border-radius:6px; background:var(--surface-raised); margin-top:15px; overflow:hidden; }
.dashboard .dash-progress > span { display:block; height:100%; border-radius:6px; background:linear-gradient(90deg,var(--accent),var(--purple)); }
.dashboard .dash-usage-foot { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:10px; margin-top:11px; }
.dashboard .dash-usage-foot > span:last-child { display:flex; align-items:center; gap:5px; }
.dashboard .dash-subscription-actions { display:flex; align-items:center; flex-wrap:wrap; gap:9px; margin-top:24px; }
.dashboard .dash-subscription-actions .btn { font-size:11px; min-height:37px; padding:9px 13px; border-radius:8px; }
.dashboard .dash-subscription-actions .dash-text-button { margin-left:auto; }
.dashboard .dash-text-button { display:inline-flex; align-items:center; justify-content:center; gap:6px; color:var(--muted); background:transparent; border:0; padding:8px 0; font:inherit; font-size:11px; cursor:pointer; transition:color .18s; }
.dashboard .dash-text-button:hover { color:var(--accent); }
.dashboard .dash-stat-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:18px 0; }
.dashboard .dash-stat { display:flex; align-items:center; gap:12px; min-width:0; padding:19px 17px; }
.dashboard .dash-stat-icon { display:grid; place-items:center; flex:none; width:37px; height:37px; border-radius:11px; color:var(--accent); background:color-mix(in srgb,var(--accent) 9%, transparent); }
.dashboard .dash-stat-icon.purple { color:var(--purple); background:color-mix(in srgb,var(--purple) 9%, transparent); }
.dashboard .dash-stat-icon.green { color:var(--green); background:color-mix(in srgb,var(--green) 8%, transparent); }
.dashboard .dash-stat > div > span { display:block; font-size:10px; color:var(--muted); }
.dashboard .dash-stat strong { display:block; margin-top:5px; font-size:20px; font-weight:550; letter-spacing:-.4px; line-height:1.2; }
.dashboard .dash-stat strong small { color:var(--muted); font-size:10px; font-weight:400; }
.dashboard .dash-stat-note { margin-left:auto; align-self:flex-start; font-size:8px; color:var(--muted); opacity:.8; }
.dashboard .dash-bottom-grid { display:grid; grid-template-columns:1.45fr 1fr; gap:18px; }
.dashboard .dash-traffic,.dashboard .dash-shortlist { padding:21px 20px 18px; min-width:0; }
.dashboard .dash-section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.dashboard .dash-section-heading h2 { font-size:13px; font-weight:550; margin:0; }
.dashboard .dash-section-heading p { font-size:10px; color:var(--muted); margin:6px 0 0; }
.dashboard .dash-period { display:flex; align-items:center; gap:6px; color:var(--muted); background:var(--surface-raised); border:1px solid var(--border); border-radius:5px; font-size:9px; padding:4px 7px; }
.dashboard .dash-period .icon { transform:rotate(90deg); }
.dashboard .dash-chart { display:flex; gap:10px; height:140px; margin-top:24px; }
.dashboard .dash-chart-y { display:flex; flex-direction:column; justify-content:space-between; flex:none; width:26px; color:var(--muted); font-size:8px; padding:5px 0 21px; }
.dashboard .dash-chart-body { flex:1; min-width:0; }
.dashboard .dash-chart svg { display:block; width:100%; height:115px; overflow:visible; }
.dashboard .dash-chart-grid { stroke:var(--border); stroke-width:1; stroke-dasharray:4 5; fill:none; }
.dashboard .dash-chart-x { display:flex; justify-content:space-between; color:var(--muted); font-size:8px; padding-top:10px; }
.dashboard .dash-chart-summary { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--muted); font-size:9px; margin-top:17px; padding-top:12px; border-top:1px solid var(--border); }
.dashboard .dash-chart-summary > span:first-child { display:flex; align-items:center; gap:5px; }
.dashboard .dash-chart-summary i { display:inline-block; height:5px; width:5px; background:var(--accent); border-radius:50%; }
.dashboard .dash-chart-summary strong { color:var(--text); font-size:10px; font-weight:500; }
.dashboard .dash-icon-button { display:inline-flex; justify-content:center; align-items:center; flex:none; border:0; padding:5px; color:var(--muted); background:transparent; border-radius:5px; cursor:pointer; }
.dashboard .dash-icon-button:hover { background:var(--surface-raised); color:var(--text); }
.dashboard .dash-node-row { display:flex; align-items:center; width:100%; gap:9px; padding:13px 0; border:0; border-bottom:1px solid var(--border); background:transparent; color:var(--text); text-align:left; font:inherit; cursor:pointer; }
.dashboard .dash-node-row:hover .dash-node-name strong { color:var(--accent); }
.dashboard .dash-shortlist .dash-node-row:first-of-type { margin-top:9px; }
.dashboard .dash-shortlist .dash-node-row:nth-last-child(2) { border-bottom:0; }
.dashboard .dash-flag { display:grid; place-items:center; flex:none; width:31px; height:31px; border-radius:50%; background:var(--surface-raised); font-size:19px; }
.dashboard .dash-node-name { min-width:0; }
.dashboard .dash-node-name strong { display:block; font-size:10px; font-weight:500; }
.dashboard .dash-node-name > span { display:block; font-size:8px; color:var(--muted); margin-top:4px; }
.dashboard .dash-latency { display:flex; align-items:center; gap:4px; margin-left:auto; white-space:nowrap; font-size:11px; color:var(--text); }
.dashboard .dash-latency small { color:var(--muted); font-size:8px; }
.dashboard .dash-status-dot { width:4px; height:4px; border-radius:50%; background:var(--green); margin-right:2px; }
.dashboard .dash-node-arrow { display:flex; align-items:center; color:var(--muted); }
.dashboard .dash-view-all { display:flex; align-items:center; justify-content:center; gap:6px; width:100%; padding:11px 0 0; margin-top:4px; border:0; border-top:1px solid var(--border); background:none; color:var(--muted); font:inherit; font-size:10px; cursor:pointer; }
.dashboard .dash-view-all:hover { color:var(--accent); }
.dashboard .dash-help-card { display:flex; align-items:center; gap:14px; padding:19px 21px; margin-top:18px; border:1px solid var(--border); border-radius:12px; background:color-mix(in srgb,var(--surface) 55%,transparent); }
.dashboard .dash-help-icon { display:flex; color:var(--muted); }
.dashboard .dash-help-card strong { display:block; font-size:11px; font-weight:500; }
.dashboard .dash-help-card div > span { display:block; color:var(--muted); font-size:10px; margin-top:5px; }
.dashboard .dash-help-card .dash-text-button { flex:none; margin-left:auto; }
.dashboard .dash-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:29px 0 24px; }
.dashboard .dash-panel-heading h2 { font-size:20px; font-weight:550; margin:0; letter-spacing:-.3px; }
.dashboard .dash-panel-heading p { font-size:11px; color:var(--muted); line-height:1.7; margin:8px 0 0; }
.dashboard .dash-panel-heading .btn { flex:none; font-size:11px; padding:9px 12px; min-height:37px; border-radius:8px; }
.dashboard .dash-region-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:21px; }
.dashboard .dash-region-filters button { display:flex; align-items:center; gap:8px; border:1px solid var(--border); border-radius:7px; background:transparent; padding:8px 12px; font:inherit; font-size:11px; color:var(--muted); cursor:pointer; }
.dashboard .dash-region-filters button.active { color:var(--accent); border-color:color-mix(in srgb,var(--accent) 24%,transparent); background:color-mix(in srgb,var(--accent) 9%,transparent); }
.dashboard .dash-region-filters button > span { color:var(--muted); font-size:9px; }
.dashboard .dash-node-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.dashboard .dash-node-card { display:block; width:100%; text-align:left; padding:19px 21px; font:inherit; color:var(--text); cursor:pointer; transition:border-color .18s,transform .18s; }
.dashboard .dash-node-card:hover { border-color:color-mix(in srgb,var(--accent) 36%,transparent); transform:translateY(-2px); }
.dashboard .dash-node-card-head,.dashboard .dash-node-card-title { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.dashboard .dash-node-card-head .dash-flag { width:37px; height:37px; font-size:23px; }
.dashboard .dash-node-multiplier { font-size:9px; color:var(--muted); background:var(--surface-raised); border:1px solid var(--border); border-radius:5px; padding:4px 7px; }
.dashboard .dash-node-card-title { margin:16px 0 23px; }
.dashboard .dash-node-card-title h3 { font-size:14px; font-weight:500; margin:0 0 5px; }
.dashboard .dash-node-card-title div > span { color:var(--muted); font-size:10px; }
.dashboard .dash-node-card .dash-latency { font-size:15px; }
.dashboard .dash-node-card .dash-latency small { font-size:10px; }
.dashboard .dash-node-load { display:flex; justify-content:space-between; color:var(--muted); font-size:9px; }
.dashboard .dash-node-load strong { color:var(--text); font-weight:500; }
.dashboard .dash-load-line { height:3px; border-radius:3px; margin-top:8px; background:var(--surface-raised); }
.dashboard .dash-load-line > span { display:block; height:3px; border-radius:3px; background:color-mix(in srgb,var(--accent) 65%,var(--purple)); }
.dashboard .dash-node-card-foot { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:18px; color:var(--muted); font-size:9px; }
.dashboard .dash-node-card-foot > span:last-child { display:flex; gap:4px; align-items:center; }
.dashboard .dash-order-list { overflow:hidden; }
.dashboard .dash-order-table-head,.dashboard .dash-order-row { display:grid; grid-template-columns:minmax(160px,1.5fr) 1fr .7fr 1fr 14px; gap:14px; align-items:center; }
.dashboard .dash-order-table-head { padding:15px 20px; color:var(--muted); font-size:10px; background:color-mix(in srgb,var(--surface-raised) 35%,var(--surface)); }
.dashboard .dash-order-row { width:100%; border:0; border-top:1px solid var(--border); background:none; color:var(--text); text-align:left; padding:23px 20px; font:inherit; font-size:11px; cursor:pointer; }
.dashboard .dash-order-row:hover { background:var(--surface-raised); }
.dashboard .dash-order-name strong { display:block; font-size:11px; font-weight:500; }
.dashboard .dash-order-name small { display:block; color:var(--muted); font-size:9px; margin-top:7px; }
.dashboard .dash-order-date { color:var(--muted); font-size:10px; }
.dashboard .dash-order-price { white-space:nowrap; }
.dashboard .dash-order-status { font-size:9px; color:var(--green); white-space:nowrap; }
.dashboard .dash-order-arrow { color:var(--muted); display:flex; }
.dashboard .dash-fineprint { color:var(--muted); font-size:10px; line-height:1.8; margin:17px 3px; }
.dashboard .dash-tutorial-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; }
.dashboard .dash-tutorial-card { text-align:left; padding:23px 18px 20px; color:var(--text); font:inherit; cursor:pointer; transition:border-color .18s,transform .18s; }
.dashboard .dash-tutorial-card:hover { border-color:color-mix(in srgb,var(--accent) 36%,transparent); transform:translateY(-2px); }
.dashboard .dash-device-icon { display:flex; margin-bottom:23px; color:var(--accent); }
.dashboard .dash-tutorial-card h3 { font-size:14px; font-weight:550; margin:0 0 6px; }
.dashboard .dash-tutorial-card > span:not(.dash-device-icon) { color:var(--muted); font-size:9px; }
.dashboard .dash-tutorial-card .dash-tutorial-link { display:flex; align-items:center; justify-content:space-between; gap:4px; margin-top:21px; }
.dashboard .dash-faq-card { padding:23px 24px 10px; margin-top:25px; }
.dashboard .dash-faq-card h3 { font-size:14px; font-weight:550; margin:0 0 15px; }
.dashboard .dash-faq-card details { border-top:1px solid var(--border); }
.dashboard .dash-faq-card summary { font-size:11px; padding:17px 0; cursor:pointer; color:var(--text); line-height:1.8; }
.dashboard .dash-faq-card details p { color:var(--muted); font-size:11px; line-height:1.9; margin:0 0 18px; }
.dashboard.dash-modal-content { color:var(--text); font-size:13px; line-height:1.75; }
.dashboard .dash-loading { padding:22px 0; color:var(--muted); font-size:13px; }
.dashboard .dash-loading[hidden],.dashboard .dash-form-error[hidden],.dashboard .dash-form-success[hidden] { display:none; }
.dashboard .dash-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:160px; padding:26px 18px; text-align:center; gap:11px; }
.dashboard .dash-empty-icon { display:flex; color:var(--accent); opacity:.8; }
.dashboard .dash-empty strong { font-size:14px; font-weight:550; line-height:1.6; }
.dashboard .dash-empty p { margin:0; font-size:11px; color:var(--muted); line-height:1.9; max-width:340px; }
.dashboard .dash-empty .btn { margin-top:8px; }
.dashboard .dash-api-error { display:flex; align-items:flex-start; gap:12px; padding:18px; border:1px solid var(--border); border-radius:10px; color:var(--muted); background:var(--surface); }
.dashboard .dash-api-error > .icon { flex:none; margin-top:2px; }
.dashboard .dash-api-error strong { font-size:12px; color:var(--text); font-weight:550; }
.dashboard .dash-api-error p { font-size:11px; line-height:1.8; margin:5px 0 0; overflow-wrap:anywhere; }
.dashboard .dash-api-error .dash-text-button { flex:none; margin-left:auto; }
.dashboard .dash-active.warning,.dashboard .dash-order-status.pending { color:var(--accent); }
.dashboard .dash-active.muted { color:var(--muted); background:var(--surface-raised); border-color:var(--border); }
.dashboard .dash-subscription-selector { display:flex; align-items:center; flex-wrap:wrap; gap:12px; color:var(--muted); font-size:11px; margin:0 0 18px; }
.dashboard .dash-subscription-selector select { max-width:100%; min-width:0; background:var(--surface-raised); color:var(--text); border:1px solid var(--border); border-radius:8px; font:inherit; padding:9px 12px; }
.dashboard .dash-subscription-foot { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:8px; margin-top:18px; padding-top:13px; border-top:1px solid var(--border); color:var(--muted); font-size:10px; }
.dashboard .dash-subscription-foot .dash-text-button { font-size:10px; }
.dashboard .dash-node-state { margin-left:auto; font-size:10px; color:var(--muted); white-space:nowrap; }
.dashboard .dash-recent { padding:21px 20px 18px; min-width:0; }
.dashboard .dash-recent-order { display:flex; align-items:center; justify-content:space-between; gap:15px; width:100%; padding:16px 0; background:none; border:0; border-bottom:1px solid var(--border); text-align:left; font:inherit; color:var(--text); cursor:pointer; }
.dashboard .dash-recent-order > span { min-width:0; font-size:12px; }
.dashboard .dash-recent-order > span:last-child { flex:none; text-align:right; }
.dashboard .dash-recent-order strong { display:block; font-size:12px; font-weight:500; overflow-wrap:anywhere; }
.dashboard .dash-recent-order small { display:block; margin-top:5px; color:var(--muted); font-size:10px; }
.dashboard .dash-account-shortcuts { display:flex; margin-top:10px; }
.dashboard .dash-order-name small { overflow-wrap:anywhere; }
.dashboard .dash-pagination { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:20px; color:var(--muted); font-size:11px; }
.dashboard .dash-pagination > div { display:flex; align-items:center; gap:12px; }
.dashboard .dash-pagination .btn { padding:8px 12px; font-size:11px; }
.dashboard .dash-settings-form { padding-top:23px; margin-top:20px; border-top:1px solid var(--border); }
.dashboard .dash-settings-form h3 { margin:0 0 15px; font-size:15px; font-weight:550; }
.dashboard .dash-settings-form > label:not(.dash-notification) { display:block; margin:15px 0 7px; color:var(--muted); font-size:12px; }
.dashboard .dash-settings-form > input { display:block; box-sizing:border-box; width:100%; min-width:0; border:1px solid var(--border); background:var(--surface-raised); color:var(--text); border-radius:8px; font:inherit; padding:11px 12px; }
.dashboard .dash-settings-form > .btn { margin-top:18px; font-size:12px; }
.dashboard .dash-settings-description { color:var(--muted); font-size:11px; margin:0 0 12px; line-height:1.8; }
.dashboard .dash-notification { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:12px 0; cursor:pointer; }
.dashboard .dash-notification strong { font-size:12px; font-weight:500; }
.dashboard .dash-notification small { display:block; margin-top:3px; font-size:10px; color:var(--muted); }
.dashboard .dash-notification input { flex:none; width:18px; height:18px; accent-color:var(--accent); cursor:pointer; }
.dashboard .dash-form-error { font-size:12px; color:var(--text); line-height:1.8; border-left:2px solid var(--accent); padding-left:10px; overflow-wrap:anywhere; }
.dashboard .dash-form-success { font-size:12px; color:var(--green); line-height:1.8; }
.dashboard .dash-form-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:12px; margin-top:22px; }
.dashboard .dash-logout { border-top:1px solid var(--border); padding-top:16px; justify-content:space-between; }
.dashboard .dash-modal-copy { margin-top:22px; width:100%; justify-content:center; }
.dashboard button:disabled { cursor:default; opacity:.5; }
.dashboard select:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.dashboard .dash-modal-intro { color:var(--muted); margin:0 0 18px; font-size:12px; }
.dashboard .dash-modal-note { background:color-mix(in srgb,var(--accent) 5%,var(--surface-raised)); border:1px solid var(--border); border-radius:9px; padding:12px 14px; margin-top:20px; color:var(--muted); font-size:11px; line-height:1.8; }
.dashboard .dash-client-tabs { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:22px; }
.dashboard .dash-client-tabs button { border:1px solid var(--border); border-radius:7px; padding:7px 11px; color:var(--muted); background:var(--surface-raised); font:inherit; font-size:11px; cursor:pointer; }
.dashboard .dash-client-tabs button.active { color:var(--accent); border-color:color-mix(in srgb,var(--accent) 25%,transparent); background:color-mix(in srgb,var(--accent) 9%,var(--surface)); }
.dashboard .dash-guide-steps { list-style:none; padding:0; margin:0; display:grid; gap:22px; }
.dashboard .dash-guide-steps li { display:flex; align-items:flex-start; gap:13px; }
.dashboard .dash-guide-steps li > span { flex:none; width:27px; height:27px; display:grid; place-items:center; background:color-mix(in srgb,var(--accent) 9%,var(--surface-raised)); border:1px solid color-mix(in srgb,var(--accent) 16%,transparent); color:var(--accent); border-radius:50%; font-size:11px; }
.dashboard .dash-guide-steps strong { font-size:12px; font-weight:550; }
.dashboard .dash-guide-steps p { color:var(--muted); font-size:11px; margin:5px 0 0; line-height:1.8; }
.dashboard .dash-subscription-input { width:100%; box-sizing:border-box; padding:13px 12px; background:var(--surface-raised); border:1px solid var(--border); color:var(--text); border-radius:8px; font-family:monospace; font-size:11px; }
.dashboard .dash-detail-hero { display:flex; align-items:center; gap:13px; margin-bottom:23px; }
.dashboard .dash-detail-hero .dash-flag { width:43px; height:43px; font-size:25px; }
.dashboard .dash-detail-hero strong { display:block; font-weight:550; }
.dashboard .dash-detail-hero div > span { display:block; color:var(--muted); font-size:11px; }
.dashboard .dash-detail-list { margin:0; }
.dashboard .dash-detail-list > div { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; border-bottom:1px solid var(--border); padding:12px 0; }
.dashboard .dash-detail-list dt { color:var(--muted); font-size:11px; flex:none; }
.dashboard .dash-detail-list dd { color:var(--text); font-size:12px; margin:0; overflow-wrap:anywhere; text-align:right; }
.dashboard .dash-detail-list .dash-order-code { font-size:10px; }
.dashboard button:focus-visible,.dashboard summary:focus-visible,.dashboard input:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media (max-width:1050px) {
  .dashboard.dashboard-page { grid-template-columns:165px minmax(0,1fr); gap:25px; width:calc(100% - 48px); }
  .dashboard .dash-stat { gap:9px; padding:17px 12px; }
  .dashboard .dash-stat-note { display:none; }
  .dashboard .dash-stat-icon { width:32px; height:32px; border-radius:9px; }
  .dashboard .dash-bottom-grid { grid-template-columns:1.3fr 1fr; gap:14px; }
  .dashboard .dash-traffic,.dashboard .dash-shortlist { padding:19px 16px 17px; }
  .dashboard .dash-user div > span { width:96px; }
  .dashboard .dash-tutorial-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard .dash-order-table-head,.dashboard .dash-order-row { grid-template-columns:minmax(148px,1.5fr) .8fr .7fr 1fr 14px; gap:10px; }
}
@media (max-width:800px) {
  .dashboard.dashboard-page { display:block; max-width:640px; padding-top:25px; }
  .dashboard .dash-sidebar { margin-bottom:30px; padding:0; }
  .dashboard .dash-workspace-label,.dashboard .dash-sidebar-bottom { display:none; }
  .dashboard .dash-nav { flex-direction:row; gap:6px; padding:5px; border:1px solid var(--border); border-radius:11px; background:var(--surface); }
  .dashboard .dash-nav-button { flex:1; justify-content:center; padding:10px 6px; gap:7px; font-size:11px; white-space:nowrap; }
  .dashboard .dash-nav-button.active::after { display:none; }
  .dashboard .dash-bottom-grid { grid-template-columns:1.4fr 1fr; }
}
@media (max-width:560px) {
  .dashboard.dashboard-page { width:calc(100% - 36px); padding-top:22px; padding-bottom:36px; }
  .dashboard .dash-sidebar { margin-bottom:26px; }
  .dashboard .dash-nav { gap:3px; padding:4px; }
  .dashboard .dash-nav-button { gap:5px; padding:10px 3px; font-size:10px; }
  .dashboard .dash-nav-button .icon { width:15px; height:15px; }
  .dashboard .dash-page-heading { align-items:flex-start; gap:8px; margin-bottom:20px; }
  .dashboard .dash-page-heading h1 { font-size:24px; gap:9px; margin-top:7px; }
  .dashboard .dash-account-label { font-size:9px; margin-top:29px; gap:4px; }
  .dashboard .dash-account-label .icon { width:13px; height:13px; }
  .dashboard .dash-kicker { font-size:9px; letter-spacing:1.5px; }
  .dashboard .dash-page-heading p { font-size:10px; }
  .dashboard .dash-demo-notice { font-size:10px; padding:10px 11px; margin-bottom:16px; }
  .dashboard .dash-subscription { padding:21px 19px 20px; }
  .dashboard .dash-plan-title h2 { font-size:19px; }
  .dashboard .dash-plan-icon { width:39px; height:39px; border-radius:11px; }
  .dashboard .dash-plan-icon .icon { width:23px; height:23px; }
  .dashboard .dash-usage-heading { margin-top:23px; }
  .dashboard .dash-usage-number { font-size:28px; }
  .dashboard .dash-usage-unit { font-size:11px; }
  .dashboard .dash-usage-caption { font-size:9px; }
  .dashboard .dash-usage-foot { font-size:9px; flex-wrap:wrap; gap:7px; }
  .dashboard .dash-subscription-actions { gap:8px; margin-top:21px; }
  .dashboard .dash-subscription-actions .btn { flex:1; justify-content:center; font-size:11px; padding:9px 11px; }
  .dashboard .dash-subscription-actions .dash-text-button { flex-basis:100%; margin-left:0; padding:5px 0 0; font-size:10px; }
  .dashboard .dash-stat-grid { gap:8px; margin:13px 0; }
  .dashboard .dash-stat { display:block; position:relative; padding:13px 12px 12px; }
  .dashboard .dash-stat-icon { width:27px; height:27px; border-radius:8px; margin-bottom:12px; }
  .dashboard .dash-stat-icon .icon { width:17px; height:17px; }
  .dashboard .dash-stat > div > span { font-size:9px; white-space:nowrap; }
  .dashboard .dash-stat strong { font-size:19px; margin-top:5px; }
  .dashboard .dash-stat strong small { font-size:9px; }
  .dashboard .dash-bottom-grid { grid-template-columns:1fr; gap:13px; }
  .dashboard .dash-traffic,.dashboard .dash-shortlist { padding:20px 19px 18px; }
  .dashboard .dash-recent { padding:20px 19px 18px; }
  .dashboard .dash-usage-heading { flex-wrap:wrap; gap:8px; }
  .dashboard .dash-stat strong { font-size:17px; overflow-wrap:anywhere; }
  .dashboard .dash-subscription-selector select { width:100%; }
  .dashboard .dash-subscription-foot { gap:5px; }
  .dashboard .dash-node-card-foot { flex-wrap:wrap; }
  .dashboard .dash-order-name { min-width:0; }
  .dashboard .dash-pagination .btn { min-height:40px; }
  .dashboard .dash-chart { height:150px; }
  .dashboard .dash-chart svg { height:125px; }
  .dashboard .dash-node-row { padding:14px 0; }
  .dashboard .dash-node-name strong { font-size:11px; }
  .dashboard .dash-node-name > span { font-size:9px; }
  .dashboard .dash-latency { font-size:12px; }
  .dashboard .dash-shortlist .dash-node-arrow { margin-left:8px; }
  .dashboard .dash-help-card { gap:11px; padding:18px 17px; align-items:flex-start; flex-wrap:wrap; }
  .dashboard .dash-help-card strong { font-size:11px; }
  .dashboard .dash-help-card div > span { font-size:9px; }
  .dashboard .dash-help-card .dash-text-button { flex-basis:100%; justify-content:flex-start; margin-left:34px; padding:3px 0 0; font-size:10px; }
  .dashboard .dash-panel-heading { align-items:flex-start; gap:12px; margin:25px 0 21px; }
  .dashboard .dash-panel-heading h2 { font-size:18px; }
  .dashboard .dash-panel-heading p { font-size:10px; }
  .dashboard .dash-panel-heading .btn { font-size:10px; padding:8px 10px; min-height:35px; }
  .dashboard .dash-region-filters { gap:6px; margin-bottom:16px; }
  .dashboard .dash-region-filters button { padding:7px 9px; gap:5px; font-size:10px; }
  .dashboard .dash-node-grid { grid-template-columns:1fr; gap:13px; }
  .dashboard .dash-node-card { padding:20px; }
  .dashboard .dash-order-table-head { display:none; }
  .dashboard .dash-order-row { grid-template-columns:minmax(0,1fr) auto; gap:12px 8px; padding:20px 17px; }
  .dashboard .dash-order-row:first-of-type { border-top:0; }
  .dashboard .dash-order-name { grid-column:1; grid-row:1; }
  .dashboard .dash-order-price { grid-column:2; grid-row:1; font-size:12px; text-align:right; }
  .dashboard .dash-order-date { grid-column:1; grid-row:2; }
  .dashboard .dash-order-status { grid-column:2; grid-row:2; text-align:right; }
  .dashboard .dash-order-arrow { display:none; }
  .dashboard .dash-tutorial-grid { gap:12px; }
  .dashboard .dash-tutorial-card { padding:22px 17px 19px; }
  .dashboard .dash-tutorial-card h3 { font-size:14px; }
  .dashboard .dash-faq-card { padding:20px 19px 7px; margin-top:20px; }
  .dashboard .dash-faq-card h3 { font-size:13px; }
  .dashboard .dash-faq-card summary,.dashboard .dash-faq-card details p { font-size:10px; }
  .dashboard .dash-client-tabs { gap:6px; }
  .dashboard .dash-client-tabs button { padding:7px 9px; font-size:10px; }
}
@media (prefers-reduced-motion:reduce) {
  .dashboard .dash-nav-button,.dashboard .dash-text-button,.dashboard .dash-node-card,.dashboard .dash-tutorial-card { transition:none; }
  .dashboard .dash-node-card:hover,.dashboard .dash-tutorial-card:hover { transform:none; }
}