/* Cabinet 01 Overview, handoff-4. Keep legacy screens on the same account runtime. */
:root {
  --accent:#42e9bc; --accent-deep:#00c09a; --accent-bright:#9efbda; --accent-soft:#9efbda;
  --accent-glow:rgba(66,233,188,.18); --accent-tint:rgba(66,233,188,.10); --accent-tint-line:rgba(66,233,188,.3);
  --grad-accent:linear-gradient(135deg,#42e9bc,#24cfa9); --grad-text:linear-gradient(100deg,#9efbda,#42e9bc);
  --text-strong:#eef1f6; --text:#c4cbd8; --text-muted:#9aa4b8; --text-dim:#78829a;
  --surface-card:#0c1220; --font-mono:"JetBrains Mono",monospace;
  --shadow-btn:0 8px 24px rgba(66,233,188,.12); --container:1200px;
  color-scheme:dark;
}
body { background:#070a12; font-family:Onest,system-ui,sans-serif; }
::selection { background:#42e9bc40; }
button,input,select,textarea { font-family:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible { outline:2px solid #9efbda; outline-offset:4px; }
button:disabled { cursor:wait; }
.cabinet-icon { width:20px; height:20px; flex:none; object-fit:contain; }
.cabinet-flag { flex:none; width:28px; height:20px; object-fit:cover; border-radius:4px; }
.dashboard-shell { flex-direction:row; }
.sidebar { position:sticky; top:0; height:100vh; border-right:1px solid #ffffff0f; border-bottom:0; width:252px; padding:18px 14px 16px; background:#0a0e19; backdrop-filter:none; }
.brand { padding:2px 6px 24px; gap:10px; flex-wrap:nowrap; }
.brand__mark { width:30px; height:30px; padding:0; background:none; box-shadow:none; border-radius:9px; }
.brand__title { font:600 18px Unbounded,sans-serif; letter-spacing:-.01em; }
.brand__data { margin-left:auto; padding:5px 8px; min-height:29px; border-radius:8px; font:500 11px var(--font-mono); color:#9efbda; background:#42e9bc12; border:1px solid #42e9bc33; box-shadow:none; white-space:nowrap; }
.nav { display:flex; gap:2px; }
.nav__button { min-height:42px; padding:10px 12px; font-size:14px; font-weight:500; border:0; }
.nav__button.is-active { background:#ffffff0e; border-color:transparent; }
.nav__button.is-active .cabinet-icon { filter:brightness(0) saturate(100%) invert(85%) sepia(35%) saturate(879%) hue-rotate(101deg); }
.sidebar__footer { gap:14px; margin-top:auto; }
.status-card { background:#0c1220; border:1px solid #ffffff12; padding:12px 14px; border-radius:16px; gap:12px; }
.status-card__dot { width:9px; height:9px; background:#78829a; border-radius:50%; box-shadow:0 0 0 4px #78829a18; }
.status-card__dot::before,.status-card__dot::after { display:none; }
.status-card--success .status-card__dot { background:#42e9bc; box-shadow:0 0 0 4px #42e9bc26; }
.status-card--danger .status-card__dot { background:#ff826f; box-shadow:0 0 0 4px #ff826f26; }
.status-card__title { font-size:13px; color:#eef1f6; }
.status-card__meta { font-size:12px; color:#78829a; }
.user-summary { padding:14px 6px 0; gap:12px; }
.user-summary .button-link-muted { display:none; }
.avatar { background:#18223a; color:#c4cbd8; border:1px solid #ffffff1a; box-shadow:none; }
.user-summary__name { font-size:13px; }
.user-summary__email { font-size:12px; color:#78829a; }
.main-shell { min-width:0; }
.topbar { flex-wrap:nowrap; min-height:64px; padding:12px 32px; gap:16px; background:#070a12d0; border-bottom:1px solid #ffffff0f; }
.topbar__crumbs { font-size:14px; }
.topbar__actions { width:auto; flex-wrap:nowrap; gap:8px; }
.topbar__updated { font:11px var(--font-mono); color:#78829a; margin-right:4px; }
.topbar .icon-button,.topbar .button-ghost { min-height:40px; height:40px; border:1px solid #ffffff1a; border-radius:12px; background:transparent; color:#eef1f6; box-shadow:none; }
.topbar .icon-button { width:40px; }
.topbar .button-ghost { width:auto; padding:0 14px; font-size:14px; }
.topbar .icon-button:hover,.topbar .button-ghost:hover { background:#ffffff08; }
.cabinet-language-slot { display:flex; align-items:center; }
.topbar .mvpn-locale-switch { position:relative; right:auto; top:auto; bottom:auto; z-index:100; font-family:var(--font-mono); }
.topbar .mvpn-locale-switch button { min-height:40px; padding:0 11px; background:transparent; border:1px solid #ffffff1a; color:#c4cbd8; border-radius:12px; font-size:12px; }
.topbar .mvpn-locale-switch [data-mvpn-lang-list] { position:absolute; top:44px; bottom:auto; right:0; min-width:175px; margin:0; background:#111a2c; border:1px solid #ffffff14; }
.topbar .mvpn-locale-switch .lang-item { min-height:40px; border:0; }
.content { padding:36px 32px 100px; }
.content__inner { width:100%; max-width:1136px; margin:auto; }
.screen__title { font-family:Unbounded,sans-serif; font-size:clamp(24px,2.6vw,32px); line-height:1.2; font-weight:600; letter-spacing:-.03em; }
.screen__subtitle { font-size:15px; line-height:1.55; color:#9aa4b8; }
.screen.is-active.cabinet-overview { display:grid; gap:20px; }
.cabinet-overview .screen__header { margin:0; padding-bottom:6px; }
.cabinet-overview .screen__title { margin:0 0 8px; }
.cabinet-overview .screen__subtitle { margin:0; }
.cabinet-card { min-width:0; background:#0c1220; border:1px solid #ffffff12; border-radius:24px; overflow:hidden; }
.cabinet-summary { display:flex; flex-wrap:wrap; gap:20px; }
.cabinet-summary > .cabinet-status { flex:1.45 1 440px; }
.cabinet-summary > .cabinet-balance { flex:1 1 340px; }
.cabinet-eyebrow { margin:0; color:#78829a; font:400 11px var(--font-mono); letter-spacing:.14em; line-height:1.5; text-transform:uppercase; }
.cabinet-card__heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cabinet-tag { display:inline-flex; align-items:center; width:fit-content; min-height:22px; padding:3px 8px; color:#c4cbd8; font:400 10.5px var(--font-mono); border:1px solid #ffffff14; border-radius:6px; white-space:nowrap; }
.cabinet-status { --status-color:#78829a; --status-rgb:120,130,154; padding:24px 26px 26px; display:grid; gap:22px; align-content:start; background:radial-gradient(ellipse at 100% 0%,rgba(var(--status-rgb),.07),transparent 50%),#0c1220; }
.cabinet-status--on { --status-color:#42e9bc; --status-rgb:66,233,188; }
.cabinet-status--off { --status-color:#ff826f; --status-rgb:255,130,111; }
.cabinet-status--new { --status-color:#9ac8ff; --status-rgb:154,200,255; }
.cabinet-status__heading { display:flex; align-items:center; gap:18px; }
.cabinet-status__heading h2 { margin:0 0 4px; font:600 clamp(21px,2vw,26px)/1.2 Unbounded,sans-serif; letter-spacing:-.025em; }
.cabinet-status__heading p { margin:0; color:#9aa4b8; font-size:14px; line-height:1.55; }
.cabinet-status__signal { display:grid; place-items:center; width:56px; height:56px; flex:none; border-radius:50%; background:rgba(var(--status-rgb),.12); border:1px solid rgba(var(--status-rgb),.35); }
.cabinet-status__signal::before { content:""; width:14px; height:14px; background:var(--status-color); border-radius:50%; box-shadow:0 0 18px rgba(var(--status-rgb),.55); }
.cabinet-status__meta { display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px; margin:0; padding-top:18px; border-top:1px solid #ffffff0f; }
.cabinet-status dt,.cabinet-balance dt { color:#78829a; font-size:12px; line-height:1.5; }
.cabinet-status dd { margin:6px 0 0; color:#eef1f6; font:400 13px/1.6 var(--font-mono); overflow-wrap:anywhere; }
.cabinet-status__next { padding:16px 18px; border:1px solid #ffffff0a; border-radius:18px; background:#070a1240; }
.cabinet-status__next p { margin:0 0 16px; color:#c4cbd8; font-size:14px; line-height:1.55; }
.cabinet-actions { display:flex; gap:10px; flex-wrap:wrap; }
.cabinet-overview .button-secondary,.cabinet-overview .button-ghost { min-height:42px; padding:10px 16px; border:1px solid #ffffff24; background:transparent; border-radius:12px; color:#eef1f6; font-size:13px; font-weight:500; box-shadow:none; }
.cabinet-overview .button-ghost { border-color:transparent; }
.cabinet-overview .button-secondary:hover,.cabinet-overview .button-ghost:hover { background:#ffffff08; }
.cabinet-balance { padding:24px 26px; display:flex; flex-direction:column; gap:22px; }
.cabinet-balance__body { display:flex; align-items:center; gap:24px; }
.cabinet-balance__ring { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; width:148px; height:148px; flex:none; border-radius:50%; background:conic-gradient(from 110deg,#42e9bc 0%,#9ac8ff calc(var(--balance-percent)*1%),#18223a 0); isolation:isolate; }
.cabinet-balance__ring::before { content:""; position:absolute; inset:8px; background:#0c1220; border-radius:50%; z-index:-1; }
.cabinet-balance__ring strong { font:600 clamp(23px,2.5vw,30px)/1.2 Unbounded,sans-serif; letter-spacing:-.04em; }
.cabinet-balance__ring span { color:#9aa4b8; font-size:12px; margin-top:4px; }
.cabinet-balance__ring.is-unavailable { background:#18223a; }
.cabinet-balance__stats { flex:1; min-width:0; margin:0; }
.cabinet-balance__stats > div { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid #ffffff0d; }
.cabinet-balance dt { color:#9aa4b8; font-size:12px; }
.cabinet-balance dd { margin:0; font:400 12px/1.6 var(--font-mono); white-space:nowrap; }
.cabinet-balance__footer { display:flex; align-items:center; gap:18px; margin-top:auto; }
.cabinet-balance__footer p { margin:0; flex:1; color:#78829a; font-size:12px; line-height:1.6; }
.cabinet-balance__footer button { flex:none; }
.cabinet-connect.activation-start { padding:0; margin:0; width:100%; border:1px solid #ffffff14; border-radius:24px; background:#0c1220; box-shadow:none; overflow:hidden; }
.cabinet-connect__header { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding:26px 28px; border-bottom:1px solid #ffffff0f; }
.cabinet-connect #activation-start-title { margin:0 0 8px; font:600 21px/1.3 Unbounded,sans-serif; letter-spacing:-.025em; }
.cabinet-connect .connection-intro { margin:0; max-width:620px; color:#9aa4b8; font-size:14px; line-height:1.65; }
.cabinet-selection { flex:0 1 auto; display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end; max-width:380px; min-width:200px; font:11px/1.6 var(--font-mono); color:#c4cbd8; }
.cabinet-selection > span:nth-child(even) { color:#5f6a82; }
.cabinet-connect .connection-form { margin:0; }
.cabinet-connect .quick-steps { display:grid; grid-template-columns:1fr; margin:0; padding:0; list-style:none; gap:0; }
.cabinet-connect .quick-steps > li { display:grid; grid-template-columns:200px minmax(0,1fr); gap:32px; padding:24px 28px; border:0; border-bottom:1px solid #ffffff0f; }
.cabinet-connect .quick-steps > li:last-child { border-bottom:0; padding-bottom:28px; }
.cabinet-step-label { display:flex; align-items:flex-start; gap:14px; }
.cabinet-connect .quick-step-number { display:grid; place-items:center; flex:none; width:30px; height:30px; padding:0; margin:0; background:#42e9bc; border:1px solid #42e9bc; color:#03140f; font:500 13px var(--font-mono); border-radius:50%; }
.cabinet-connect li:last-child .quick-step-number { background:transparent; color:#42e9bc; border-color:#42e9bc73; }
.cabinet-connect .quick-steps h3 { margin:4px 0; font:600 15px/1.4 Onest,sans-serif; }
.cabinet-step-label p { color:#78829a; font-size:13px; line-height:1.45; margin:0; }
.cabinet-connect .cabinet-platform-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(118px,1fr)); gap:10px; margin:0; }
.cabinet-choice { display:flex; align-items:center; position:relative; min-width:0; cursor:pointer; transition:background .15s,border-color .15s,box-shadow .15s; background:#ffffff04; border:1px solid #ffffff14; border-radius:16px; color:#eef1f6; text-align:left; }
.cabinet-choice:hover { border-color:#ffffff38; background:#ffffff08; }
.cabinet-choice[aria-pressed="true"] { background:linear-gradient(180deg,#42e9bc1f,#42e9bc0a); border-color:#42e9bc8c; box-shadow:0 0 0 4px #42e9bc12,0 16px 36px -20px #42e9bc55; }
.cabinet-choice:focus-visible { outline:2px solid #9efbda; outline-offset:4px; }
.cabinet-choice:disabled { opacity:.55; cursor:wait; }
.cabinet-choice strong { display:block; font:600 14px/1.4 Onest,sans-serif; overflow-wrap:anywhere; }
.cabinet-choice small { display:block; color:#78829a; font-size:11.5px; line-height:1.45; margin-top:3px; }
.cabinet-platform { display:grid; justify-items:center; align-content:center; text-align:center; padding:16px 8px 14px; min-height:112px; gap:10px; }
.cabinet-platform > .cabinet-icon:first-child { width:28px; height:28px; }
.cabinet-platform > .cabinet-icon:last-child { width:14px; height:14px; position:absolute; top:10px; right:10px; opacity:0; }
.cabinet-platform[aria-pressed="true"] > .cabinet-icon { filter:brightness(0) saturate(100%) invert(85%) sepia(35%) saturate(879%) hue-rotate(101deg); }
.cabinet-platform[aria-pressed="true"] > .cabinet-icon:last-child { opacity:1; }
.cabinet-server-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:10px; }
.cabinet-server { flex-direction:column; align-items:flex-start; gap:5px; min-height:148px; padding:16px; }
.cabinet-server > .cabinet-flag { width:34px; height:34px; border-radius:50%; box-shadow:0 0 0 2px #ffffff14; margin-bottom:8px; }
.cabinet-server > .cabinet-icon { margin-bottom:8px; }
.cabinet-server .cabinet-radio { position:absolute; display:block; top:16px; right:16px; }
.cabinet-server[aria-pressed="true"] .cabinet-radio { border-color:#42e9bc; box-shadow:inset 0 0 0 4px #0c1220; background:#42e9bc; }
.cabinet-server strong { font-size:14px; }
.cabinet-server small { margin:0; }
.cabinet-server__badges { display:flex; margin-top:auto; padding-top:8px; min-height:26px; }
.cabinet-server .cabinet-tag { background:#ffffff0a; border:0; font-size:10px; }
.cabinet-app-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.cabinet-client { min-height:74px; padding:14px; gap:12px; margin:0; }
.cabinet-client__icon { flex:none; display:grid; place-items:center; width:38px; height:38px; border-radius:12px; background:#18223a; border:1px solid #ffffff14; }
.cabinet-client__icon--wg { background:#88171a; }
.cabinet-client__icon--wg img { filter:invert(1); width:22px; height:22px; }
.cabinet-radio { width:16px; height:16px; border:1.5px solid #ffffff38; border-radius:50%; margin-left:auto; flex:none; }
.cabinet-client[aria-pressed="true"] .cabinet-radio { border-color:#42e9bc; box-shadow:inset 0 0 0 4px #0c1220; background:#42e9bc; }
.cabinet-install-link { display:inline-flex; align-items:center; min-height:36px; margin-top:10px; color:#42e9bc; font-size:13px; }
.cabinet-connection-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
.cabinet-guide { min-width:0; padding:18px; background:#0a0f1b; border:1px solid #ffffff0f; border-radius:18px; }
.cabinet-guide h4 { margin:0 0 16px; font:600 15px/1.5 Onest,sans-serif; }
.cabinet-guide ol { display:grid; gap:14px; padding-left:22px; margin:0; }
.cabinet-guide li { padding-left:4px; color:#c4cbd8; font-size:13px; line-height:1.65; }
.cabinet-guide li::marker { color:#42e9bc; font:500 12px var(--font-mono); }
.cabinet-guide > p { color:#78829a; font-size:12px; line-height:1.6; margin:16px 0 0; }
.cabinet-connect .quick-config-result { min-width:0; margin:0; padding:18px; border:1px solid #ffffff14; border-radius:18px; background:#0a0f1b; }
.cabinet-connect .quick-config-result.is-ready { border-color:#42e9bc73; }
.cabinet-config__title { display:flex; align-items:center; gap:12px; }
.cabinet-config__title strong { font-size:15px; line-height:1.5; }
.cabinet-config__title small { display:block; color:#78829a; font-size:11px; margin-top:3px; }
.cabinet-config__file { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:16px 0; padding:12px 0; border-block:1px solid #ffffff0f; color:#9aa4b8; font:11px var(--font-mono); }
.cabinet-connect .quick-config-result > p { margin:0 0 16px; color:#9aa4b8; font-size:12px; line-height:1.65; }
.cabinet-connect .connection-primary { width:100%; min-width:0; min-height:46px; padding:12px 16px; border:1px solid #42e9bc; border-radius:12px; background:#42e9bc; color:#03140f; box-shadow:none; font-size:13px; font-weight:600; }
.cabinet-connect .connection-primary:hover { background:#9efbda; }
.cabinet-connect .connection-primary:disabled { background:#263149; border-color:#263149; color:#9aa4b8; cursor:wait; }
.cabinet-config__extras { display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.cabinet-config__extras .sheet-button { display:flex; justify-content:center; gap:6px; flex:1; min-height:40px; padding:8px 10px; font-size:11px; white-space:nowrap; }
.cabinet-config__extras .cabinet-icon { width:16px; height:16px; }
.cabinet-connect .quick-config-result .connection-error { color:#ffad9f; margin:14px 0 0; }
.cabinet-history { display:flex; flex-wrap:wrap; gap:20px; }
.cabinet-history > .cabinet-usage { flex:1 1 340px; }
.cabinet-history > .cabinet-activity { flex:1.1 1 380px; }
.cabinet-usage,.cabinet-activity { padding:24px 26px; }
.cabinet-usage__value { display:flex; align-items:baseline; gap:10px; margin-top:24px; font:500 28px/1.3 Unbounded,sans-serif; letter-spacing:-.025em; }
.cabinet-metric-unit { font:500 15px/1.5 Onest,sans-serif; color:#9aa4b8; letter-spacing:0; }
.cabinet-usage__value > span { color:#78829a; font:12px/1.5 Onest,sans-serif; letter-spacing:0; }
.cabinet-bars { display:flex; align-items:flex-end; gap:7px; height:160px; margin-top:30px; border-bottom:1px solid #ffffff0f; }
.cabinet-bar { position:relative; display:flex; align-items:flex-end; flex:1; min-width:0; height:100%; padding:0; background:transparent; cursor:crosshair; }
.cabinet-bar__fill { width:100%; min-height:2px; height:var(--bar-height); background:#9ac8ff80; border-radius:5px 5px 0 0; }
.cabinet-bar:last-child .cabinet-bar__fill { background:#9ac8ff; }
.cabinet-bar:hover .cabinet-bar__fill,.cabinet-bar:focus-visible .cabinet-bar__fill { background:#42e9bc; }
.cabinet-bar__tooltip { display:none; position:absolute; bottom:calc(var(--bar-height) + 8px); left:50%; z-index:2; transform:translateX(-50%); background:#18223a; border:1px solid #ffffff24; border-radius:8px; padding:8px 10px; color:#eef1f6; font:11px/1.6 var(--font-mono); white-space:nowrap; pointer-events:none; }
.cabinet-bar:hover .cabinet-bar__tooltip,.cabinet-bar:focus-visible .cabinet-bar__tooltip { display:block; }
.cabinet-chart-axis { display:flex; justify-content:space-between; gap:10px; margin-top:12px; font:10px var(--font-mono); color:#78829a; }
.cabinet-activity .cabinet-card__heading h2 { margin:0; font:600 16px/1.5 Onest,sans-serif; }
.cabinet-overview .button-link { color:#42e9bc; font-size:12px; }
.cabinet-activity .table-shell { margin-top:18px; }
.cabinet-activity table { min-width:0; width:100%; border-collapse:collapse; }
.cabinet-activity th { padding:12px 0; background:none; color:#78829a; font:10px var(--font-mono); letter-spacing:.1em; border-bottom:1px solid #ffffff0f; }
.cabinet-activity td { padding:13px 0; font-size:12px; color:#c4cbd8; border-bottom:1px solid #ffffff0d; }
.cabinet-activity td:last-child { font-family:var(--font-mono); white-space:nowrap; }
.cabinet-activity td strong { font-size:12px; font-weight:500; }
.cabinet-activity__location { display:block; color:#78829a; font-size:11px; margin-top:3px; }
.cabinet-activity__note { margin:16px 0 0; color:#78829a; font-size:11px; line-height:1.6; }
.cabinet-empty { display:grid; place-items:center; min-height:160px; padding:20px; color:#9aa4b8; font-size:13px; line-height:1.6; text-align:center; }
.cabinet-inline-error { padding:14px 18px; border:1px solid #ffffff1a; border-radius:14px; color:#c4cbd8; font-size:13px; }
@media (max-width:1199px) {
  .cabinet-balance__footer { flex-wrap:wrap; }
  .cabinet-connect .quick-steps > li { grid-template-columns:160px minmax(0,1fr); gap:20px; }
  .cabinet-server-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cabinet-connection-grid { grid-template-columns:1fr; }
  .cabinet-client { padding:12px; gap:8px; }
  .cabinet-client__icon { width:30px; height:30px; border-radius:9px; }
  .cabinet-radio { display:none; }
}
@media (max-width:999px) {
  .dashboard-shell { display:flex; flex-direction:column; }
  .sidebar { position:static; width:100%; height:auto; padding:0; background:none; border:0; order:0; }
  .sidebar .brand,.sidebar__footer { display:none; }
  .nav-scroller { overflow-x:auto; padding:0; border-bottom:1px solid #ffffff0f; }
  .nav { width:max-content; flex-direction:row; padding:10px 20px; gap:6px; }
  .nav__button { min-height:40px; flex:none; padding:9px 14px; white-space:nowrap; font-size:13px; }
  .nav__button .cabinet-icon { display:none; }
  .main-shell { width:100%; display:contents; }
  .topbar { position:sticky; top:0; order:-1; width:100%; z-index:30; padding:12px 20px; }
  .topbar__updated { display:none; }
  .content { order:1; padding:28px 20px 90px; width:100%; }
  .cabinet-summary { grid-template-columns:1.2fr 1fr; }
  .cabinet-connect__header { flex-direction:column; align-items:flex-start; }
  .cabinet-selection { max-width:none; min-width:0; justify-content:flex-start; }
  .cabinet-history { grid-template-columns:1fr 1fr; }
}
@media (max-width:700px) {
  .topbar { flex-wrap:nowrap; min-height:64px; padding:12px 16px; gap:8px; }
  .topbar__crumbs { font-size:12px; gap:6px; }
  .topbar__actions { gap:6px; }
  .topbar .button-ghost { padding:0 10px; font-size:12px; }
  .topbar .mvpn-locale-switch { position:relative; top:auto; right:auto; bottom:auto; }
  .topbar .mvpn-locale-switch [data-mvpn-lang-list] { top:44px; bottom:auto; }
  .content { padding:26px 16px 90px; }
  .screen__title { font-size:24px; line-height:1.25; }
  .cabinet-overview { gap:16px; }
  .cabinet-overview .screen__subtitle { font-size:14px; }
  .cabinet-summary,.cabinet-history { grid-template-columns:1fr; gap:16px; }
  .cabinet-card,.cabinet-connect.activation-start { border-radius:20px; }
  .cabinet-status,.cabinet-balance,.cabinet-usage,.cabinet-activity { padding:22px 20px; }
  .cabinet-status__heading { gap:14px; }
  .cabinet-status__heading h2 { font-size:21px; }
  .cabinet-status__heading p { font-size:13px; }
  .cabinet-status__signal { width:48px; height:48px; }
  .cabinet-status__meta { gap:10px; }
  .cabinet-status dt { font-size:11px; }
  .cabinet-status dd { font-size:11px; }
  .cabinet-balance__body { flex-direction:row; align-items:center; gap:20px; }
  .cabinet-balance__ring { width:132px; height:132px; }
  .cabinet-balance__ring strong { font-size:25px; }
  .cabinet-balance__stats > div { gap:8px; }
  .cabinet-balance dt { font-size:11px; }
  .cabinet-balance dd { font-size:11px; }
  .cabinet-balance__footer { flex-wrap:nowrap; }
  .cabinet-connect__header { padding:22px 20px; gap:14px; }
  .cabinet-connect #activation-start-title { font-size:19px; }
  .cabinet-connect .quick-steps > li { grid-template-columns:1fr; gap:18px; padding:22px 20px; }
  .cabinet-step-label { max-width:none; }
  .cabinet-connect .quick-steps h3 { margin:0 0 3px; }
  .cabinet-connect .cabinet-platform-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cabinet-platform { padding:14px 12px; min-height:88px; gap:10px; }
  .cabinet-platform > .cabinet-icon:first-child { width:24px; height:24px; }
  .cabinet-choice strong { font-size:13px; }
  .cabinet-choice small { font-size:10.5px; }
  .cabinet-server { min-height:144px; padding:14px; }
  .cabinet-app-grid { grid-template-columns:1fr; }
  .cabinet-radio { display:block; }
  .cabinet-client { padding:14px; }
  .cabinet-client__icon { width:38px; height:38px; }
  .cabinet-connect .quick-config-result { padding:16px; }
  .cabinet-usage__value { flex-wrap:wrap; gap:8px; font-size:25px; }
}
@media (max-width:380px) {
  .topbar__crumbs > span:first-child,.topbar__crumbs > span:nth-child(2) { display:none; }
  .cabinet-status__meta { grid-template-columns:1fr 1fr; }
  .cabinet-balance__body { flex-direction:column; align-items:stretch; }
  .cabinet-balance__ring { align-self:center; }
  .cabinet-balance__footer { flex-wrap:wrap; }
  .cabinet-platform { flex-direction:column; align-items:flex-start; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none!important; transition:none!important; }
}
/* Prevent legacy mobile header widths from forcing the account controls onto a second row. */
.topbar { flex-wrap:nowrap; }
.topbar__actions { width:auto; flex-wrap:nowrap; }
.topbar .button-ghost { width:auto; }
@media (max-width:700px) {
  .topbar__crumbs { flex:1; min-width:0; }
  .topbar__actions { flex:none; }
  .cabinet-status__meta { grid-template-columns:1.3fr 1fr .8fr; }
}
@media (max-width:380px) {
  .cabinet-status__meta { grid-template-columns:1fr 1fr; }
}

/* Cabinet 02 — Plan. Values and purchases remain on the shared account API. */
.screen.is-active.cabinet-plan { display:grid; gap:20px; }
.plan-page-header { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 24px; padding-bottom:6px; }
.plan-page-header .screen__header { flex:1 1 420px; margin:0; }
.plan-page-header .screen__title { margin:0 0 8px; }
.plan-page-header .screen__subtitle { margin:0; padding:0; }
.plan-header-actions { display:flex; flex-wrap:wrap; gap:8px; }
.cabinet-plan .button-secondary,.cabinet-plan .button-ghost { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:42px; padding:10px 16px; border:1px solid #ffffff24; border-radius:12px; background:transparent; color:#eef1f6; font-size:14px; font-weight:500; box-shadow:none; }
.cabinet-plan .button-ghost { border-color:transparent; color:#c4cbd8; }
.cabinet-plan .button-secondary:hover,.cabinet-plan .button-ghost:hover { background:#ffffff08; }
.plan-wallet { --plan-tone:#42e9bc; padding:26px 28px 28px; display:grid; gap:24px; background:radial-gradient(ellipse at 100% 0%,#42e9bc0d,transparent 45%),#0c1220; }
.plan-wallet--low { --plan-tone:#ff826f; background:radial-gradient(ellipse at 100% 0%,#ff826f12,transparent 45%),#0c1220; }
.plan-wallet__heading { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px; }
.plan-wallet__amount { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 12px; margin-top:10px; }
.plan-data-value { display:inline-flex; align-items:baseline; gap:6px; font-family:Unbounded,sans-serif; letter-spacing:-.03em; }
.plan-data-value strong { font-size:26px; font-weight:600; line-height:1.15; }
.plan-data-value > span { font:500 14px Onest,sans-serif; color:#9aa4b8; letter-spacing:0; }
.plan-wallet__amount > .plan-data-value strong { font-size:clamp(40px,4.4vw,56px); letter-spacing:-.04em; line-height:1; }
.plan-wallet__amount > .plan-data-value > span { font:500 23px Unbounded,sans-serif; letter-spacing:-.01em; }
.plan-wallet__amount > span:last-child { color:#9aa4b8; font-size:14px; }
.plan-balance-pill { display:inline-flex; align-items:center; gap:8px; min-height:30px; padding:7px 12px; border-radius:999px; background:color-mix(in srgb,var(--plan-tone) 12%,transparent); color:var(--plan-tone); font:400 11px/1.5 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; }
.plan-balance-pill::before { content:""; flex:none; width:7px; height:7px; border-radius:50%; background:currentColor; }
.plan-balance-pill.is-unavailable { color:#9aa4b8; background:#ffffff0a; }
.plan-funding-flow { display:flex; flex-wrap:wrap; gap:12px; align-items:stretch; }
.plan-funding-card { display:flex; flex-direction:column; gap:14px; flex:1 1 300px; min-width:0; padding:20px; border:1px solid #ffffff0f; border-radius:18px; background:#0a0f1b; }
.plan-funding-card--wallet { border-color:color-mix(in srgb,var(--plan-tone) 22%,transparent); }
.plan-funding-card__heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.plan-funding-card h3 { display:flex; align-items:center; gap:10px; margin:0; font:600 15px/1.5 Onest,sans-serif; }
.plan-source-number { display:grid; place-items:center; flex:none; width:24px; height:24px; border-radius:50%; color:#9ac8ff; background:#9ac8ff24; font:400 11px var(--font-mono); }
.plan-funding-card--wallet .plan-source-number { color:#42e9bc; background:#42e9bc24; }
.plan-funding-order { color:#78829a; font:400 10px var(--font-mono); letter-spacing:.1em; text-transform:uppercase; }
.plan-funding-value { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; }
.plan-funding-value > span:last-child:not(.plan-data-value) { color:#9aa4b8; font-size:14px; }
.plan-funding-card > p { color:#9aa4b8; font-size:13px; line-height:1.6; margin:0; }
.plan-quota-track { height:8px; background:#ffffff0f; border-radius:4px; overflow:hidden; }
.plan-quota-track > span { display:block; height:100%; background:#9ac8ff; border-radius:4px; }
.plan-daily-details { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 16px; margin-top:auto; color:#78829a; font-size:12px; line-height:1.6; }
.plan-daily-details strong { color:#c4cbd8; font:400 11.5px var(--font-mono); }
.plan-flow-arrow { align-self:center; display:grid; place-items:center; flex:none; width:36px; height:36px; border:1px solid #ffffff1a; border-radius:50%; color:#42e9bc; font-size:16px; }
.plan-funding-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; }
.plan-funding-tags > span { display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border-radius:7px; background:#ffffff0d; color:#c4cbd8; font-size:12px; line-height:1.5; }
.plan-funding-tags .cabinet-icon,.plan-benefits .cabinet-icon { width:15px; height:15px; filter:brightness(0) saturate(100%) invert(85%) sepia(35%) saturate(879%) hue-rotate(101deg); }
.plan-low-note { padding:14px 16px; border:1px solid #ff826f40; border-radius:14px; background:#ff826f14; color:#eef1f6; font-size:14px; line-height:1.6; }
.plan-packs { container-type:inline-size; display:grid; gap:16px; padding-top:12px; }
.plan-packs__header { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:12px 24px; }
.plan-packs__header h2 { margin:0 0 8px; font:600 21px/1.4 Unbounded,sans-serif; letter-spacing:-.02em; }
.plan-packs__header p { margin:0; max-width:660px; color:#78829a; font-size:14px; line-height:1.55; }
.plan-benefits { display:flex; flex-wrap:wrap; gap:8px 18px; }
.plan-benefits > span { display:flex; align-items:center; gap:7px; color:#c4cbd8; font-size:13px; }
.plan-pack-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.plan-pack-choice { display:flex; flex-direction:column; position:relative; overflow:hidden; min-width:0; padding:22px 20px 20px; gap:16px; background:#0c1220; border:1px solid #ffffff14; border-radius:24px; color:#eef1f6; text-align:left; cursor:pointer; transition:border-color .2s,box-shadow .2s,background .2s; }
.plan-pack-choice:hover { border-color:#ffffff38; }
.plan-pack-choice[aria-pressed="true"] { border-color:#42e9bccc; background:linear-gradient(180deg,#42e9bc1f,#0c1220 58%); box-shadow:0 0 0 4px #42e9bc12,0 28px 70px -34px #42e9bc99; }
.plan-pack-choice:focus-visible { outline:2px solid #9efbda; outline-offset:4px; }
.plan-pack-choice:disabled { opacity:.55; cursor:wait; }
.plan-pack-choice__header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; min-height:24px; }
.plan-pack-choice__header > strong { font-size:15.5px; font-weight:600; }
.plan-pack-badge { display:inline-flex; align-items:center; width:fit-content; min-height:24px; max-width:100%; padding:4px 9px; border-radius:999px; background:#42e9bc24; color:#42e9bc; font-size:11px; line-height:1.5; font-weight:600; }
.plan-pack-choice--sky .plan-pack-badge { background:#9ac8ff24; color:#9ac8ff; }
.plan-pack-choice__size strong { font-size:42px; letter-spacing:-.04em; line-height:1; }
.plan-pack-choice__size > span { font:500 16px Unbounded,sans-serif; }
.plan-pack-choice__price { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 10px; }
.plan-pack-choice__price > strong { font-size:20px; font-weight:600; }
.plan-pack-choice__price > span { color:#78829a; font:400 11px/1.6 var(--font-mono); }
.plan-pack-choice__price > small { width:fit-content; padding:4px 7px; border-radius:6px; background:#42e9bc1f; color:#42e9bc; font:400 10px/1.5 var(--font-mono); }
.plan-pack-choice__description { min-height:60px; color:#9aa4b8; font-size:13px; line-height:1.55; }
.plan-pack-original { color:#78829a; font-size:12px; text-decoration:line-through; }
.plan-pack-choice__footer { display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:14px; margin-top:auto; border-top:1px solid #ffffff0f; }
.plan-pack-choice__footer > span { display:flex; align-items:center; gap:8px; color:#9aa4b8; font-size:13px; font-weight:500; }
.plan-pack-choice[aria-pressed="true"] .plan-pack-choice__footer > span { color:#42e9bc; }
.plan-pack-radio { display:block; flex:none; width:18px; height:18px; border:1.5px solid #ffffff38; border-radius:50%; }
.plan-pack-choice[aria-pressed="true"] .plan-pack-radio { border-color:#42e9bc; box-shadow:inset 0 0 0 4px #0c1220; background:#42e9bc; }
.plan-order-summary { display:flex; flex-wrap:wrap; align-items:center; gap:18px 28px; padding:20px 24px; background:#0f1626; border:1px solid #ffffff14; border-radius:22px; }
.plan-order-summary > div:first-child { flex:1 1 200px; min-width:0; display:grid; gap:4px; }
.plan-order-summary__name { font-size:16px; line-height:1.5; font-weight:600; }
.plan-order-summary__balance { flex:2 1 280px; min-width:0; display:grid; gap:4px; }
.plan-order-summary__balance > div { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; }
.plan-order-summary__balance .plan-data-value strong { font-size:18px; color:#9aa4b8; }
.plan-order-summary__balance .plan-order-summary__after strong { font-size:22px; color:#42e9bc; }
.plan-order-summary__balance > div > span:not(.plan-data-value) { color:#5f6a82; }
.cabinet-plan .plan-pay-button { display:inline-flex; align-items:center; justify-content:center; flex:none; min-height:50px; max-width:100%; padding:12px 28px; background:#42e9bc; color:#03140f; border:0; border-radius:14px; box-shadow:none; font-size:15px; font-weight:600; }
.cabinet-plan .plan-pay-button:hover { background:#9efbda; }
.cabinet-plan .plan-pay-button:disabled { background:#42e9bc1a; color:#42e9bc; border:1px solid #42e9bc59; cursor:progress; }
.plan-order-summary > p { flex:1 1 100%; margin:0; color:#78829a; font-size:12px; line-height:1.6; }
@container (max-width:939px) { .plan-pack-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@container (max-width:439px) { .plan-pack-grid { grid-template-columns:1fr; } }
@media (max-width:700px) {
  .plan-wallet { padding:22px 20px; border-radius:20px; }
  .plan-wallet__amount > .plan-data-value strong { font-size:40px; }
  .plan-funding-flow { flex-direction:column; }
  .plan-funding-card { flex-basis:auto; padding:18px; }
  .plan-funding-card h3 { font-size:14px; }
  .plan-flow-arrow { transform:rotate(90deg); }
  .plan-order-summary { padding:20px; border-radius:20px; gap:18px; }
  .cabinet-plan .plan-pay-button { width:100%; }
  .plan-header-actions { width:100%; gap:4px; }
  .cabinet-plan .plan-header-actions button { padding:10px 12px; font-size:12px; }
  .plan-balance-pill { font-size:10px; letter-spacing:.04em; }
}

/* Cabinet 03: wallet, one-time checkout and immutable purchase records. */
.screen.is-active.cabinet-billing { display:grid; gap:20px; animation:none; }
.billing-page-header { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 24px; padding-bottom:6px; }
.billing-page-header .screen__header { flex:1 1 460px; margin:0; }
.billing-page-header .screen__title { margin:0 0 8px; }
.billing-page-header .screen__subtitle { margin:0; }
.billing-page-header > button { flex:none; }
.billing-page-header > .button-secondary { background:transparent; color:#eef1f6; box-shadow:none; font-weight:500; }
.billing-summary-grid { display:flex; flex-wrap:wrap; gap:20px; }
.billing-wallet,.billing-details { min-width:0; display:grid; align-content:start; padding:24px 26px 26px; }
.billing-wallet { flex:1.45 1 460px; gap:22px; }
.billing-details { flex:1 1 320px; gap:18px; }
.billing-wallet-content { display:flex; flex-wrap:wrap; align-items:center; gap:22px 28px; }
.billing-wallet-card { position:relative; overflow:hidden; isolation:isolate; flex:1 1 300px; min-width:0; max-width:420px; min-height:232px; padding:22px 24px; border:1px solid #ffffff1a; border-radius:22px; background:radial-gradient(ellipse at 100% 0%,#42e9bc35,transparent 55%),radial-gradient(ellipse at 0% 100%,#9ac8ff20,transparent 45%),#0f1626; box-shadow:0 40px 100px -40px #000e,inset 0 1px 0 #ffffff0f; display:flex; flex-direction:column; justify-content:space-between; gap:20px; }
.billing-wallet-card__brand { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.billing-wallet-card__brand > span:first-child { display:flex; align-items:center; gap:10px; font:600 15px Unbounded,sans-serif; }
.billing-wallet-card__brand > span:last-child { color:#9aa4b8; font:400 10.5px var(--font-mono); letter-spacing:.16em; text-transform:uppercase; }
.billing-wallet-card__balance { display:grid; gap:4px; }
.billing-wallet-card__balance .plan-data-value strong { font-size:44px; letter-spacing:-.04em; line-height:1; }
.billing-wallet-card__balance .plan-data-value > span { color:#9aa4b8; font:500 18px Unbounded,sans-serif; }
.billing-wallet-card__balance > span:last-child { font-size:13px; color:#9aa4b8; }
.billing-wallet-card__footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; }
.billing-wallet-card__footer > div { display:grid; gap:5px; min-width:0; }
.billing-wallet-card__footer > div:last-child { text-align:right; }
.billing-wallet-card__footer .cabinet-eyebrow { font-size:10px; }
.billing-wallet-card__footer strong { color:#eef1f6; font:400 13px/1.5 var(--font-mono); overflow-wrap:anywhere; }
.billing-wallet-breakdown { flex:1 1 220px; min-width:0; display:grid; gap:16px; }
.billing-wallet-meter { display:flex; gap:2px; height:12px; overflow:hidden; background:#ffffff0f; border-radius:6px; }
.billing-wallet-meter > span:first-child { background:#5f6a82; }
.billing-wallet-meter > span:last-child { flex:1; background:linear-gradient(90deg,#9ac8ff,#42e9bc); }
.billing-wallet-breakdown dl,.billing-details dl { margin:0; display:grid; }
.billing-wallet-breakdown dl { gap:12px; }
.billing-wallet-breakdown dl > div { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding-bottom:12px; border-bottom:1px solid #ffffff0f; }
.billing-wallet-breakdown dl > div:last-child { padding:0; border:0; }
.billing-wallet-breakdown dt { display:flex; align-items:center; gap:10px; color:#9aa4b8; font-size:13.5px; }
.billing-wallet-breakdown dt::before { content:""; flex:none; width:10px; height:10px; border-radius:3px; background:#42e9bc; }
.billing-wallet-breakdown dl > div:nth-child(2) dt::before { background:#5f6a82; }
.billing-wallet-breakdown dl > div:last-child dt::before { background:transparent; border:1.5px solid #78829a; }
.billing-wallet-breakdown dd { margin:0; font:400 14px/1.5 var(--font-mono); white-space:nowrap; }
.billing-note { margin:0; color:#78829a; font-size:13px; line-height:1.6; }
.billing-details dl > div { display:grid; gap:4px; padding:12px 0; border-bottom:1px solid #ffffff0f; }
.billing-details dl > div:last-child { padding-bottom:0; border:0; }
.billing-details dt { color:#78829a; font-size:12.5px; }
.billing-details dd { margin:0; font-size:14.5px; line-height:1.55; overflow-wrap:anywhere; }
.billing-details .billing-mono { font-family:var(--font-mono); }
.billing-stripe { display:flex; align-items:center; gap:8px; color:#9aa4b8; }
.billing-stripe::before { content:""; flex:none; width:7px; height:7px; border-radius:50%; background:#78829a; }
.billing-stripe.is-ready { color:#eef1f6; }
.billing-stripe.is-ready::before { background:#42e9bc; box-shadow:0 0 0 3px #42e9bc29; }
.billing-security { display:flex; align-items:flex-start; gap:10px; margin:0; padding:12px 14px; border:1px solid #ffffff0d; border-radius:14px; background:#0a0f1b; color:#9aa4b8; font-size:13px; line-height:1.5; }
.billing-security .cabinet-icon { flex:none; width:16px; height:16px; margin-top:2px; }
.billing-topup { container-type:inline-size; padding:0; overflow:hidden; scroll-margin-top:84px; }
.billing-topup:focus-visible { outline:2px solid #9efbda; outline-offset:4px; }
.billing-topup__header { padding:24px 28px 20px; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:12px 24px; }
.billing-topup__header > div { flex:1 1 380px; }
.billing-topup h2,.billing-history h2 { margin:0; font:600 21px/1.4 Unbounded,sans-serif; letter-spacing:-.02em; }
.billing-topup__header p { margin:8px 0 0; color:#78829a; font-size:14px; line-height:1.55; }
.billing-topup__header .button-link { padding:0; text-align:left; color:#42e9bc; font-weight:500; }
.billing-topup-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:0 28px 24px; }
.billing-pack-choice { display:grid; gap:8px; align-content:start; min-width:0; padding:16px 16px 14px; border:1px solid #ffffff14; border-radius:16px; background:#ffffff04; color:#eef1f6; text-align:left; cursor:pointer; transition:border-color .2s,box-shadow .2s; }
.billing-pack-choice:hover { border-color:#ffffff38; }
.billing-pack-choice[aria-pressed="true"] { border-color:#42e9bc99; background:linear-gradient(180deg,#42e9bc1f,#42e9bc08); box-shadow:0 0 0 4px #42e9bc12,0 18px 40px -22px #42e9bc88; }
.billing-pack-choice:focus-visible { outline:2px solid #9efbda; outline-offset:3px; }
.billing-pack-choice:disabled { cursor:default; opacity:.55; }
.billing-pack-choice__name { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.billing-pack-choice__name strong { color:#c4cbd8; font-size:13px; font-weight:600; }
.billing-pack-choice[aria-pressed="true"] .plan-pack-radio { border-color:#42e9bc; box-shadow:inset 0 0 0 4px #0c1220; background:#42e9bc; }
.billing-pack-choice__size strong { font-size:26px; line-height:1; letter-spacing:-.035em; }
.billing-pack-choice__size > span { color:#9aa4b8; font:500 12px Unbounded,sans-serif; }
.billing-pack-choice__price { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 8px; }
.billing-pack-choice__price strong { font-size:15px; font-weight:600; }
.billing-pack-choice__price > span { color:#78829a; font:400 11.5px/1.6 var(--font-mono); }
.billing-pack-choice__badge { min-height:22px; display:flex; flex-wrap:wrap; gap:4px; }
.billing-pack-choice__badge > span { display:inline-flex; align-items:center; max-width:100%; padding:3px 8px; border-radius:999px; background:#42e9bc24; color:#42e9bc; font-size:11.5px; line-height:1.5; font-weight:600; }
.billing-pack-choice--sky .billing-pack-choice__badge > span { background:#9ac8ff24; color:#9ac8ff; }
.billing-topup-footer { display:flex; flex-wrap:wrap; align-items:center; gap:14px 28px; padding:18px 28px; border-top:1px solid #ffffff0f; background:#0a0f1b; }
.billing-topup-footer > div { flex:1 1 280px; min-width:0; }
.billing-topup-footer h3 { margin:0 0 6px; }
.billing-topup-forecast { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; }
.billing-topup-forecast > .plan-data-value strong,.billing-topup-forecast > .plan-data-value > span { font:600 17px Unbounded,sans-serif; color:#9aa4b8; }
.billing-topup-forecast > .billing-topup-forecast__after strong,.billing-topup-forecast > .billing-topup-forecast__after > span { color:#42e9bc; font-size:21px; }
.billing-topup-forecast > span:not(.plan-data-value) { color:#5f6a82; }
.cabinet-billing .billing-pay-button { display:inline-flex; align-items:center; justify-content:center; flex:none; max-width:100%; min-height:50px; padding:12px 28px; border:0; border-radius:14px; background:#42e9bc; color:#03140f; box-shadow:none; font-size:15.5px; font-weight:600; white-space:normal; text-align:center; }
.cabinet-billing .billing-pay-button:hover { background:#9efbda; }
.cabinet-billing .billing-pay-button:disabled { background:#42e9bc1a; color:#42e9bc; border:1px solid #42e9bc59; cursor:default; }
.billing-topup-footer > p { margin:0; flex-basis:100%; color:#9aa4b8; font-size:13px; }
.billing-catalog-empty { margin:0; padding:0 28px 24px; color:#9aa4b8; line-height:1.6; }
.billing-history { display:grid; gap:12px; padding:24px 18px 20px; min-width:0; }
.billing-history__header { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:8px 16px; padding:0 10px; }
.billing-history__header > span { color:#78829a; font:400 12.5px/1.6 var(--font-mono); }
.billing-history-scroll { overflow-x:auto; max-width:100%; }
.billing-history-scroll:focus-visible { outline:2px solid #9efbda; outline-offset:2px; }
.billing-history table { width:100%; min-width:760px; border-collapse:collapse; table-layout:auto; }
.billing-history th { padding:10px 12px; background:transparent; color:#5f6a82; text-transform:uppercase; letter-spacing:.12em; text-align:left; font:400 11px var(--font-mono); }
.billing-history td { padding:12px; border-top:1px solid #ffffff0d; font:400 13px/1.55 var(--font-mono); white-space:nowrap; }
.billing-history .is-right { text-align:right; }
.billing-history tr:hover { background:#ffffff07; }
.billing-history-name { display:flex; align-items:center; gap:12px; min-width:190px; max-width:290px; color:#eef1f6; font:500 14.5px/1.5 Onest,sans-serif; white-space:normal; overflow-wrap:anywhere; }
.billing-history-icon { display:grid; place-items:center; flex:none; width:36px; height:36px; border-radius:11px; background:#42e9bc19; }
.billing-history-icon .cabinet-icon { width:18px; height:18px; }
.billing-history-icon.is-gift { background:#9ac8ff1f; }
.billing-purchase-status { display:inline-flex; align-items:center; gap:7px; min-height:26px; padding:3px 10px; border-radius:999px; background:#ffffff0f; color:#9aa4b8; font:500 12.5px/1.5 Onest,sans-serif; }
.billing-purchase-status::before { content:""; flex:none; width:6px; height:6px; border-radius:50%; background:currentColor; }
.billing-purchase-status.is-success { background:#42e9bc1f; color:#42e9bc; }
.billing-purchase-status.is-error { background:#ff826f1f; color:#ff826f; }
.billing-purchase-status.is-pending { background:#9ac8ff1f; color:#9ac8ff; }
.billing-history-empty { margin:4px 10px; padding:32px 16px; border:1px dashed #ffffff14; border-radius:14px; color:#78829a; text-align:center; font-size:14px; line-height:1.6; }
.billing-history > .billing-note { margin:4px 10px 0; font-size:12.5px; }
.billing-history .button-link { padding:0; color:#42e9bc; font-size:inherit; }
@container (max-width:759px) { .billing-topup-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@container (max-width:379px) { .billing-topup-grid { grid-template-columns:minmax(0,1fr); } }
@media (max-width:700px) {
  .billing-wallet,.billing-details { padding:22px 20px; }
  .billing-wallet-card { padding:22px 20px; flex-basis:100%; }
  .billing-wallet-card__balance .plan-data-value strong { font-size:38px; }
  .billing-wallet-card__footer > div:last-child { text-align:left; }
  .billing-wallet-breakdown { flex-basis:100%; }
  .billing-topup__header { padding:22px 20px 18px; }
  .billing-topup-grid { padding:0 20px 22px; }
  .billing-topup-footer { padding:18px 20px; }
  .billing-pay-button { width:100%; }
  .billing-topup-forecast > .plan-data-value strong,.billing-topup-forecast > .plan-data-value > span { font-size:15px; }
  .billing-topup-forecast > .billing-topup-forecast__after strong,.billing-topup-forecast > .billing-topup-forecast__after > span { font-size:19px; }
  .billing-history { padding:22px 10px 20px; }
  .billing-history h2,.billing-topup h2 { font-size:19px; }
}

/* Cabinet 04: selecting a saved record never establishes a VPN tunnel. */
.screen.is-active.cabinet-vpn { display:grid; gap:20px; animation:none; }
.cabinet-vpn > .screen__header { display:grid; gap:8px; margin:0; padding-bottom:6px; }
.cabinet-vpn > .screen__header .screen__title,.cabinet-vpn > .screen__header .screen__subtitle { margin:0; }
.cabinet-saved { display:grid; gap:14px; min-width:0; }
.vpn-saved-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:8px 16px; }
.vpn-saved-heading h2 { margin:0; font:600 18px/1.4 Unbounded,sans-serif; letter-spacing:-.02em; }
.vpn-saved-heading > span { color:#78829a; font:400 12.5px/1.6 var(--font-mono); }
.vpn-saved-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr)); gap:12px; }
.vpn-saved-card { display:grid; align-content:start; gap:14px; min-width:0; padding:18px; border:1px solid #ffffff12; border-radius:20px; background:#0c1220; transition:border-color .2s,background .2s; }
.vpn-saved-card.is-selected { border-color:#42e9bc8c; background:linear-gradient(180deg,#42e9bc1a,#0c1220 70%); box-shadow:0 24px 60px -34px #42e9bc99; }
.vpn-saved-card__heading { display:flex; align-items:center; gap:12px; }
.vpn-saved-card__heading > .cabinet-flag { flex:none; width:40px; height:40px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 2px #ffffff14; }
.vpn-saved-card__heading > div { min-width:0; display:grid; gap:2px; }
.vpn-saved-card h3 { margin:0; font:600 15.5px/1.45 Onest,sans-serif; overflow-wrap:anywhere; }
.vpn-saved-card__heading p { margin:0; color:#78829a; font-size:12.5px; }
.vpn-saved-status { display:flex; align-items:flex-start; gap:8px; margin:0; color:#9aa4b8; font-size:12.5px; line-height:1.5; }
.vpn-saved-status::before { content:""; flex:none; width:7px; height:7px; border-radius:50%; margin-top:6px; background:#78829a; }
.vpn-saved-status.is-warn { color:#ffad9f; }
.vpn-saved-status.is-warn::before { background:#ff826f; }
.vpn-saved-use.sheet-button { min-height:42px; width:100%; padding:10px 12px; border:1px solid #ffffff24; border-radius:12px; background:transparent; color:#eef1f6; box-shadow:none; font:500 14px/1.45 Onest,sans-serif; white-space:normal; text-align:center; }
.vpn-saved-use.sheet-button:hover { background:#ffffff0d; }
.vpn-saved-use:disabled { opacity:.5; cursor:default; }
.vpn-saved-selected { display:flex; align-items:center; gap:8px; min-height:42px; margin:0; color:#42e9bc; font-size:14px; font-weight:600; }
.vpn-saved-selected .cabinet-icon { flex:none; width:17px; height:17px; filter:brightness(0) saturate(100%) invert(85%) sepia(35%) saturate(879%) hue-rotate(101deg); }
.vpn-new-server { display:grid; align-content:center; justify-items:center; gap:10px; min-height:172px; min-width:0; padding:18px; border:1.5px dashed #ffffff1f; border-radius:20px; background:transparent; color:#eef1f6; text-align:center; cursor:pointer; }
.vpn-new-server:hover { background:#42e9bc0a; border-color:#42e9bc80; }
.vpn-new-server > .cabinet-icon { width:40px; height:40px; }
.vpn-new-server > strong { font-size:15px; font-weight:600; }
.vpn-new-server > span { display:flex; align-items:center; gap:6px; color:#78829a; font-size:12.5px; line-height:1.5; }
.vpn-new-server .cabinet-flag { flex:none; width:14px; height:14px; border-radius:50%; }
.vpn-new-server:disabled { opacity:.5; cursor:default; }
.vpn-saved-card button:focus-visible,.vpn-new-server:focus-visible { outline:2px solid #9efbda; outline-offset:3px; }
.vpn-saved-empty { padding:32px 16px; border:1.5px dashed #ffffff1a; border-radius:20px; color:#78829a; text-align:center; font-size:14px; line-height:1.6; }
.vpn-saved-note { margin:0; color:#78829a; font-size:12.5px; line-height:1.6; }
.cabinet-saved .button-link { padding:0; color:#42e9bc; font-size:inherit; }
.vpn-other-records { margin:0; }
.vpn-other-records .saved-server-row { background:#0c1220; border-color:#ffffff12; }
.cabinet-vpn #connect { scroll-margin-top:84px; }
.cabinet-vpn #connect:focus-visible { outline:2px solid #9efbda; outline-offset:4px; }
@media (max-width:700px) {
  .vpn-saved-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr)); }
  .vpn-saved-heading h2 { font-size:17px; }
  .vpn-saved-card { padding:18px; }
}
.cabinet-vpn .cabinet-connect__header { flex-wrap:wrap; }
.cabinet-vpn .cabinet-connect__header > div:first-child { flex:1 1 360px; }
.cabinet-vpn .cabinet-selection { min-width:0; max-width:100%; justify-content:flex-start; gap:8px 10px; padding:9px 14px; border:1px solid #ffffff0f; border-radius:14px; background:#0a0f1b; font:500 13px/1.6 Onest,sans-serif; }
.cabinet-vpn .cabinet-selection > span { display:flex; align-items:center; gap:7px; }
.cabinet-vpn .cabinet-selection .cabinet-icon { width:16px; height:16px; flex:none; }
.cabinet-vpn .cabinet-selection .cabinet-flag { width:16px; height:16px; border-radius:50%; object-fit:cover; flex:none; }
.cabinet-vpn .vpn-selection-app { display:grid; place-items:center; width:18px; height:18px; border-radius:5px; background:#18223a; }
.cabinet-vpn .vpn-selection-app.is-wireguard { background:#88171a; }
.cabinet-vpn .vpn-selection-app .cabinet-icon { width:11px; height:11px; }
.cabinet-vpn .cabinet-guide { padding:20px; }
.cabinet-vpn .cabinet-guide h4 { display:flex; align-items:center; gap:10px; }
.cabinet-vpn .cabinet-guide h4 .cabinet-icon { flex:none; width:20px; height:20px; }
.cabinet-vpn .cabinet-config { padding:20px; background:#0f1626; }
.cabinet-vpn .cabinet-config__file { flex-wrap:wrap; }
.cabinet-vpn .cabinet-config__title > .cabinet-flag { flex:none; width:38px; height:38px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 2px #ffffff14; }
.cabinet-vpn .cabinet-config__title small { font-size:12.5px; line-height:1.5; }
@media (max-width:999px) {
  .cabinet-vpn .cabinet-connect__header > div:first-child { flex:0 1 auto; }
}
@media (max-width:700px) {
  .cabinet-vpn .cabinet-connect__header > div:first-child { flex-basis:auto; }
  .cabinet-vpn .cabinet-selection { width:100%; font-size:12px; }
}

/* Cabinet 05 Locations, handoff-8. Geography and saved records are not telemetry. */
.screen.is-active.cabinet-locations { display:grid;gap:20px;animation:none; }
.cabinet-locations .screen__header { display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 24px;margin:0;padding-bottom:6px; }
.cabinet-locations .screen__header > div { flex:1 1 460px;min-width:0; }
.cabinet-locations .screen__title { margin:0 0 8px; }
.cabinet-locations .screen__subtitle { margin:0;text-wrap:pretty; }
.location-count { display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:5px 12px;border:1px solid #ffffff1a;border-radius:10px;color:#c4cbd8;font:12.5px var(--font-mono); }
.location-count i { width:7px;height:7px;border-radius:50%;background:#42e9bc; }
.location-map { position:relative;isolation:isolate;overflow:hidden;height:clamp(260px,32vw,380px);border:1px solid #ffffff12;border-radius:24px;background:#0a0f1b; }
.location-map::before { content:"";position:absolute;inset:0;background-image:radial-gradient(#ffffff0d 1px,transparent 1px);background-size:22px 22px;z-index:-2; }
.location-map::after { content:"";position:absolute;inset:0;background:radial-gradient(ellipse 75% 85% at 50% 50%,transparent 55%,#0a0f1b 100%);pointer-events:none;z-index:-1; }
.location-map__world,.location-map__countries { position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:-2; }
.location-map__countries { pointer-events:none; }
.location-map > h2 { position:absolute;left:22px;top:18px;z-index:2; }
.location-map__point { position:absolute;width:10px;height:10px;transform:translate(-50%,-50%);border-radius:50%;background:#9ac8ff;border:2px solid #070a12;box-shadow:0 0 0 5px #9ac8ff0a;pointer-events:none; }
.location-map__point.is-saved { background:#42e9bc;box-shadow:0 0 0 5px #42e9bc0a; }
.location-map__label { position:absolute;left:var(--map-x);top:var(--map-y);transform:translate(calc(-100% - 8px),-38px);min-height:36px;max-width:calc(100% - 24px);display:flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid transparent;border-radius:9px;background:#0a0f1bb3;color:#eef1f6;cursor:pointer;text-align:left;font:600 13px/1.35 Onest,sans-serif;transition:background .2s,border-color .2s; }
.location-map__label small { font:10.5px var(--font-mono);color:#9aa4b8; }
.location-map__label--de { transform:translate(calc(-100% - 8px),6px); }
.location-map__label--ua { transform:translate(8px,-22px); }
.location-map__label--jp { transform:translate(calc(-100% - 8px),-22px); }
.location-map__label:hover,.location-map__label:focus-visible { border-color:#42e9bc8c;background:#111f29; }
.location-map__legend { position:absolute;left:16px;bottom:14px;right:16px;display:flex;flex-wrap:wrap;gap:6px 16px;width:fit-content;padding:8px 14px;border:1px solid #ffffff12;border-radius:12px;background:#0a0f1bc7;backdrop-filter:blur(10px);color:#c4cbd8;font-size:12.5px; }
.location-map__legend > span { display:flex;align-items:center;gap:7px; }
.location-map__legend i { width:8px;height:8px;border-radius:50%;background:#9ac8ff; }
.location-map__legend i.is-saved { background:#42e9bc; }
.location-catalog { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px; }
.location-card { display:grid;gap:16px;align-content:start;padding:20px;min-width:0;border:1px solid #ffffff12;border-radius:22px;background:#0c1220;color:#eef1f6;text-align:left;cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s,transform .2s; }
.location-card:hover { transform:translateY(-3px);border-color:#42e9bc8c;box-shadow:0 0 0 4px #42e9bc0f; }
.location-card__top { display:flex;align-items:flex-start;justify-content:space-between;gap:10px; }
.location-card__top .cabinet-flag,.location-card__top .cabinet-icon { width:52px;height:52px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px #ffffff12,0 14px 30px -12px #000c; }
.location-card__region { padding:4px 8px;border:1px solid #ffffff14;border-radius:7px;color:#78829a;font:11px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;overflow-wrap:anywhere; }
.location-card__name { display:grid;gap:4px;min-width:0; }
.location-card__name strong { font:600 19px/1.35 Unbounded,sans-serif;letter-spacing:-.02em;overflow-wrap:anywhere; }
.location-card__name > span { color:#c4cbd8;font-size:14.5px;line-height:1.4; }
.location-card__badges { display:flex;flex-wrap:wrap;gap:6px;min-height:24px; }
.location-card__badge { display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:4px 9px;border-radius:7px;background:#ffffff0f;color:#9aa4b8;font-size:12px;line-height:1.4;font-weight:500; }
.location-card__badge.is-saved { color:#42e9bc;background:#42e9bc1f; }
.location-card__badge .cabinet-icon { width:12px;height:12px;filter:brightness(0) saturate(100%) invert(85%) sepia(35%) saturate(879%) hue-rotate(101deg); }
.location-card__footer { display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid #ffffff0f;padding-top:14px;margin-top:auto; }
.location-card__footer > span { color:#78829a;font:12px var(--font-mono); }
.location-card__footer strong { color:#42e9bc;font-size:13.5px;line-height:1.4; }
.location-catalog-note { margin:0;color:#78829a;font-size:12.5px;line-height:1.55;text-wrap:pretty; }
@media (min-width:1000px) and (max-width:1255px) { .location-catalog { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:999px) { .location-catalog { grid-template-columns:repeat(2,minmax(0,1fr)); }.cabinet-locations .screen__header > div { flex:1 1 auto; } }
@media (max-width:600px) {
 .location-catalog { grid-template-columns:minmax(0,1fr); }
 .location-map__label { min-height:36px;font-size:11px;max-width:46%; }
 .location-map__label--nl { left:4%;top:24%;transform:none; }
 .location-map__label--de { left:4%;top:43%;transform:none; }
 .location-map__label--ua { left:51%;top:24%;transform:none; }
 .location-map__label--jp { left:auto;right:4%;top:65%;transform:none; }
 .location-map__legend { left:10px;right:10px;bottom:10px;padding:7px 9px;font-size:11px;gap:6px 12px; }
}
@media (prefers-reduced-motion:reduce) { .location-card,.location-map__label { transition:none; }.location-card:hover { transform:none; } }
/* Keep map labels inside the panel; preserve geographic proportions on narrow screens. */
.location-map__geography { position:absolute;inset:0;z-index:-2; }
.location-map__label--nl { left:max(12px,calc(var(--map-x) - 130px));transform:translateY(-38px); }
.location-map__label--de { left:max(12px,calc(var(--map-x) - 175px));transform:translateY(6px); }
@media (max-width:600px) {
 .location-map__geography { top:50%;bottom:auto;height:auto;aspect-ratio:940/380;transform:translateY(-50%); }
 .location-map__label--nl { left:4%;top:18%;transform:none; }
 .location-map__label--de { left:4%;top:37%;transform:none; }
}
@media (max-width:600px) {
 .location-map__geography { mask-image:radial-gradient(ellipse 90% 95% at 50% 50%,#000 50%,transparent 100%); }
}
@media (max-width:600px) { .location-map__label--jp { top:55%; } }

/* Cabinet 06 Account settings, handoff-9. Security controls stay in the VPN client. */
.screen.is-active.cabinet-settings { display:grid;gap:20px;animation:none; }
.cabinet-settings .screen__header { margin:0;padding-bottom:6px; }
.cabinet-settings .screen__title { margin:0 0 8px;overflow-wrap:anywhere; }
.cabinet-settings .screen__subtitle { margin:0;text-wrap:pretty; }
.settings-profile { position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:24px 40px;padding:26px 28px;background:radial-gradient(ellipse 460px 300px at 0 0,#9ac8ff12,transparent 65%),#0c1220; }
.settings-profile__identity { position:relative;display:flex;align-items:center;gap:18px;flex:1 1 320px;min-width:0; }
.settings-avatar { flex:none;width:76px;height:76px;padding:3px;border-radius:50%;background:linear-gradient(135deg,#42e9bc,#9ac8ff); }
.settings-avatar > span { display:grid;place-items:center;width:100%;height:100%;border:3px solid #0c1220;border-radius:50%;background:#18223a;color:#eef1f6;font:600 22px Unbounded,sans-serif;letter-spacing:-.02em; }
.settings-profile__identity > div { min-width:0; }
.settings-profile__identity h2 { margin:0 0 4px;font:600 22px/1.35 Unbounded,sans-serif;letter-spacing:-.02em;overflow-wrap:anywhere; }
.settings-profile__identity p { margin:0;color:#9aa4b8;font-size:14.5px;line-height:1.5;overflow-wrap:anywhere; }
.settings-profile__meta { position:relative;flex:1 1 380px;min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:12px;margin:0; }
.settings-profile__meta > div { display:grid;align-content:start;gap:8px;padding:16px 18px;border:1px solid #ffffff0f;border-radius:16px;background:#0a0f1b; }
.settings-profile__meta dt { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;color:#78829a;font-size:12.5px; }
.settings-profile__meta dd { display:flex;align-items:center;gap:9px;min-width:0;margin:0;color:#eef1f6;font-size:15px;line-height:1.5;overflow-wrap:anywhere; }
.settings-profile__meta .cabinet-flag { width:20px;height:20px;border-radius:50%; }
.settings-profile__meta .settings-date { font-family:var(--font-mono);font-weight:400; }
.settings-profile__notice { flex:1 1 100%;margin:0;color:#9aa4b8;font-size:13px;line-height:1.55; }
.settings-text-link { display:inline-flex;align-items:center;gap:6px;min-height:32px;max-width:100%;padding:0;background:transparent;border:0;color:#9efbda;font-size:14px;font-weight:500;text-align:left;cursor:pointer; }
.settings-profile__meta .settings-text-link { min-height:20px;font-size:13px; }
.settings-text-link:hover { color:#42e9bc; }
.settings-protection { display:grid;gap:20px;padding:26px 28px; }
.settings-protection__heading { display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px; }
.settings-protection__heading > div { flex:1 1 420px;display:grid;gap:8px;min-width:0; }
.settings-protection__heading > .settings-text-link { flex:none; }
.settings-protection__heading h2 { margin:0;color:#eef1f6;font:600 21px/1.35 Unbounded,sans-serif;letter-spacing:-.02em;overflow-wrap:anywhere; }
.settings-protection__heading > div > p:last-child { margin:0;color:#9aa4b8;font-size:14.5px;line-height:1.55;text-wrap:pretty; }
.settings-protection-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px; }
.settings-protection-grid article { min-width:0;display:grid;gap:12px;align-content:start;padding:18px;border:1px solid #ffffff0f;border-radius:18px;background:#0a0f1b; }
.settings-protection-grid article > div { display:flex;justify-content:space-between;align-items:center;gap:10px; }
.settings-protection-grid h3 { margin:0 0 -8px;font-size:15px;line-height:1.5;font-weight:600; }
.settings-protection-grid p,.settings-protection__note { margin:0;color:#78829a;font-size:13px;line-height:1.55;text-wrap:pretty; }
.settings-protection-grid .cabinet-tag { color:#9aa4b8;white-space:normal; }
.settings-action-icon { display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:12px;background:#18223a; }
.settings-action-icon .cabinet-icon { filter:brightness(0) saturate(100%) invert(86%) sepia(8%) saturate(308%) hue-rotate(181deg); }
.settings-action-icon.is-sky { background:#9ac8ff1f; }
.settings-action-icon.is-sky .cabinet-icon { filter:brightness(0) saturate(100%) invert(79%) sepia(13%) saturate(1338%) hue-rotate(181deg); }
.settings-action-icon.is-mint { background:#42e9bc1a; }
.settings-action-icon.is-mint .cabinet-icon,.settings-action-status .cabinet-icon { filter:brightness(0) saturate(100%) invert(85%) sepia(35%) saturate(879%) hue-rotate(101deg); }
.settings-action-icon.is-coral { background:#ff826f1f; }
.settings-action-icon.is-coral .cabinet-icon { filter:brightness(0) saturate(100%) invert(68%) sepia(33%) saturate(1652%) hue-rotate(314deg); }
.settings-panels { display:flex;flex-wrap:wrap;gap:20px; }
.settings-actions { flex:1 1 380px;min-width:0;display:grid;align-content:start;gap:6px;padding:24px 26px 10px; }
.settings-actions > h2 { padding-bottom:10px; }
.settings-action { display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;padding:16px 0;border-top:1px solid #ffffff0f; }
.settings-action__copy { flex:1 1 200px;min-width:0;display:grid;gap:3px; }
.settings-action h3 { margin:0;color:#eef1f6;font-size:14.5px;line-height:1.5;font-weight:600; }
.settings-action p { margin:0;font-size:13px;line-height:1.5;color:#78829a;overflow-wrap:anywhere;text-wrap:pretty; }
.settings-button { display:inline-flex;align-items:center;justify-content:center;min-height:40px;max-width:100%;padding:8px 16px;border:1px solid #ffffff24;border-radius:12px;background:transparent;color:#eef1f6;font:500 14px/1.4 Onest,sans-serif;text-align:center;cursor:pointer; }
.settings-button:hover { background:#ffffff0d; }
.settings-button:disabled { opacity:.55;cursor:default; }
.settings-button.is-coral { color:#ff826f;border-color:#ff826f66; }
.settings-button.is-coral:hover { background:#ff826f14; }
.settings-button.is-danger { color:#1a0a07;background:#ff826f;border-color:#ff826f;font-weight:600; }
.settings-signout-confirm { display:flex;flex-wrap:wrap;gap:8px; }
.settings-action-status { display:inline-flex;align-items:center;gap:6px;min-height:40px;color:#42e9bc;font-size:13px;line-height:1.5; }
.settings-action-status .cabinet-icon { width:15px;height:15px; }
.settings-action-status.is-muted { color:#9aa4b8; }
.settings-action p.settings-feedback { margin-top:6px;color:#9efbda; }
.settings-action p.settings-feedback.is-error { color:#ff9d8f; }
@media (max-width:600px) {
 .settings-profile,.settings-protection { padding:22px 20px; }
 .settings-profile { gap:22px; }
 .settings-profile__identity { flex:1 1 100%;gap:14px; }
 .settings-avatar { width:60px;height:60px; }
 .settings-profile__identity h2 { font-size:19px; }
 .settings-actions { padding:22px 20px 8px; }
 .settings-action__copy { flex-basis:calc(100% - 56px); }
 .settings-protection__heading > .settings-text-link { flex-shrink:1; }
 .settings-button { min-height:44px; }
}
/* Keep unusually long identities compact while retaining their full accessible text. */
.settings-profile__identity h2,.settings-profile__identity p { display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden; }
@media (min-width:601px) { .settings-action__copy { flex-basis:180px; } }

/* Cabinet 07 Help, handoff-11. Reuses the existing installation support widget. */
.screen.is-active.cabinet-help { display:grid;gap:22px;animation:none; }
.cabinet-help .screen__header { display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 24px;margin:0;padding-bottom:6px; }
.cabinet-help .screen__header > div { flex:1 1 460px;min-width:0; }
.cabinet-help .screen__title { margin:0 0 8px; }
.cabinet-help .screen__subtitle { margin:0;text-wrap:pretty; }
.help-ask { display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;max-width:100%;padding:12px 22px;border:0;border-radius:14px;background:#42e9bc;color:#03140f;font-size:15px;line-height:1.4;font-weight:600;cursor:pointer; }
.help-ask .cabinet-icon { filter:brightness(0); }
.help-ask:hover { background:#80f1cd;box-shadow:0 10px 30px -12px #42e9bc70; }
.help-channels { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px; }
.help-channel { display:grid;gap:14px;align-content:start;min-width:0;padding:20px;border:1px solid #ffffff12;border-radius:22px;background:#0c1220;color:#eef1f6;text-align:left;cursor:pointer;font:inherit;transition:border-color .2s,transform .2s; }
.help-channel:hover,.help-install-card:hover { transform:translateY(-3px);border-color:#42e9bc66;color:#eef1f6; }
.help-channel-icon { display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:#18223a; }
.help-channel-icon .cabinet-icon { width:22px;height:22px;filter:brightness(0) saturate(100%) invert(86%) sepia(8%) saturate(308%) hue-rotate(181deg); }
.help-channel-icon.is-mint { background:#42e9bc1f; }
.help-channel-icon.is-mint .cabinet-icon { filter:brightness(0) saturate(100%) invert(85%) sepia(35%) saturate(879%) hue-rotate(101deg); }
.help-channel-icon.is-sky { background:#9ac8ff1f; }
.help-channel-icon.is-sky .cabinet-icon { filter:brightness(0) saturate(100%) invert(79%) sepia(13%) saturate(1338%) hue-rotate(181deg); }
.help-channel__title { margin:0 0 -10px;color:#eef1f6;font-size:16px;line-height:1.5;font-weight:600; }
.help-channel__meta { color:#9efbda;font:12.5px/1.5 var(--font-mono);overflow-wrap:anywhere; }
.help-channel__description { color:#78829a;font-size:13.5px;line-height:1.5;text-wrap:pretty; }
.cabinet-help h2 { margin:0;color:#eef1f6;font:600 21px/1.35 Unbounded,sans-serif;letter-spacing:-.02em;overflow-wrap:anywhere; }
.help-install,.help-faq { display:grid;gap:14px;padding-top:8px;min-width:0; }
.help-install > div:first-child { display:grid;gap:6px; }
.help-install > div:first-child > p { margin:0;color:#78829a;font-size:14px;line-height:1.55; }
.help-install-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:12px; }
.help-install-card { display:grid;gap:16px;align-content:start;min-width:0;padding:18px;border:1px solid #ffffff12;border-radius:20px;background:#0c1220;color:#eef1f6;transition:transform .2s,border-color .2s; }
.help-install-card > span { display:flex;justify-content:space-between;align-items:center;gap:10px; }
.help-install-card > span > .cabinet-icon { width:32px;height:32px; }
.help-install-card strong { margin:0 0 -12px;color:#eef1f6;font-size:15.5px;line-height:1.5;font-weight:600; }
.help-install-card small { color:#9aa4b8;font-size:13px;line-height:1.5; }
.help-wireguard { display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:8px;background:#88171a; }
.help-wireguard .cabinet-icon { width:15px;height:15px; }
.help-guide { padding:26px 28px;display:grid;gap:22px; }
.help-guide__heading,.help-faq__heading { display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px; }
.help-steps { list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 8px;padding:0;margin:0; }
.help-steps li { position:relative;display:grid;gap:10px;align-content:start;padding-right:12px;min-width:0; }
.help-steps li:not(:last-child)::before { content:"";position:absolute;left:44px;right:0;top:17px;height:1px;background:linear-gradient(90deg,#42e9bc80,#ffffff0f); }
.help-step-number { position:relative;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid #42e9bc80;background:#42e9bc1a;color:#42e9bc;font:13px var(--font-mono); }
.help-steps h3 { margin:0;color:#eef1f6;font-size:15px;line-height:1.5;font-weight:600; }
.help-steps p { margin:0;color:#9aa4b8;font-size:13.5px;line-height:1.55;text-wrap:pretty; }
.help-guide__note { margin:0;padding:14px 16px;border:1px dashed #ffffff1a;border-radius:14px;color:#9aa4b8;font-size:13px;line-height:1.55;text-wrap:pretty; }
.help-search { display:flex;align-items:center;gap:10px;flex:0 1 320px;min-width:0;min-height:44px;padding:0 14px;border:1px solid #ffffff1a;border-radius:12px;background:#0c1220; }
.help-search .cabinet-icon { width:16px;height:16px;filter:brightness(0) saturate(100%) invert(51%) sepia(12%) saturate(734%) hue-rotate(184deg); }
.help-search:focus-within { outline:2px solid #9efbda;outline-offset:3px; }
.help-search input { flex:1;min-width:0;width:100%;height:42px;padding:0;border:0;outline:0;background:transparent;color:#eef1f6;font:14px Onest,sans-serif; }
.help-search input::placeholder { color:#78829a;opacity:1; }
.help-faq-status { margin:0;color:#9aa4b8;font-size:12.5px;line-height:1.5; }
.help-faq-list { display:grid;gap:10px; }
.help-faq-item { overflow:hidden;border:1px solid #ffffff12;border-radius:18px;background:#0c1220; }
.help-faq-item[open] { border-color:#42e9bc4d; }
.help-faq-item summary { display:flex;align-items:center;gap:16px;min-height:60px;padding:16px 20px;list-style:none;color:#eef1f6;font-size:15px;font-weight:600;cursor:pointer; }
.help-faq-item summary::-webkit-details-marker { display:none; }
.help-faq-item summary > span { flex:1;text-wrap:pretty; }
.help-faq-item summary .cabinet-icon { width:28px;height:28px;border-radius:50%;background:#42e9bc12;filter:brightness(0) saturate(100%) invert(85%) sepia(35%) saturate(879%) hue-rotate(101deg);transition:transform .2s; }
.help-faq-item[open] summary .cabinet-icon { transform:rotate(45deg); }
.help-faq-item summary:focus-visible { outline:2px solid #9efbda;outline-offset:-4px;border-radius:18px; }
.help-faq-answer { padding:0 20px 18px;max-width:880px;color:#c4cbd8;font-size:14px;line-height:1.65;text-wrap:pretty; }
.help-faq-empty { padding:28px 16px;border:1px dashed #ffffff1a;border-radius:18px;text-align:center;color:#78829a;font-size:14px; }
.help-faq-empty p { margin:0 0 6px; }
.help-chat-unavailable { margin:0;color:#ffab9c;font-size:13px;line-height:1.55; }
@media (min-width:1000px) and (max-width:1131px),(min-width:500px) and (max-width:879px) { .help-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }.help-steps li:nth-child(2)::before { display:none; } }
@media (max-width:999px) { .cabinet-help .screen__header > div { flex:1 1 auto; } }
@media (max-width:600px) { .help-guide { padding:22px 20px; }.help-search { flex-basis:100%; } }
@media (max-width:499px) { .help-steps { grid-template-columns:minmax(0,1fr); }.help-steps li::before { display:none; } }
@media (prefers-reduced-motion:reduce) { .help-channel,.help-install-card,.help-faq-item summary .cabinet-icon { transition:none; }.help-channel:hover,.help-install-card:hover { transform:none; } }
.help-wireguard .cabinet-icon { filter:brightness(0) invert(1); }