/* The standalone web cabinet never reserves Telegram header space. */
html[data-ui-style="version3"] {
    --v3-telegram-chrome-top: 0px;
    --v3-safe-top: env(safe-area-inset-top, 0px) !important;
}

:root[data-ui-style="version3"] .v3-topbar {
    position: fixed;
    inset: 0 0 auto;
    z-index: 1300;
    background: var(--v3-surface);
    border-bottom: 1px solid var(--v3-line);
}

:root[data-ui-style="version3"] .v3-topbar-inner {
    width: min(100%, 1440px);
    min-height: calc(68px + var(--v3-safe-top));
    margin: 0 auto;
    padding: calc(10px + var(--v3-safe-top)) 18px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

:root[data-ui-style="version3"] .v3-brand {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: var(--v3-ink);
    text-decoration: none;
}

:root[data-ui-style="version3"] .v3-brand:hover { color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-brand-mark {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    padding: 9px 8px;
    border-radius: 7px;
    background: var(--v3-hero-bg);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 3px;
}
:root[data-ui-style="version3"] .v3-brand-mark span { width: 4px; border-radius: 3px; background: var(--v3-primary); }
:root[data-ui-style="version3"] .v3-brand-mark span:nth-child(1) { height: 9px; }
:root[data-ui-style="version3"] .v3-brand-mark span:nth-child(2) { height: 18px; background: var(--v3-coral); }
:root[data-ui-style="version3"] .v3-brand-mark span:nth-child(3) { height: 13px; }
:root[data-ui-style="version3"] .v3-brand-mark.has-image { padding: 2px; border: 1px solid var(--v3-line); background: var(--v3-surface-2); }
:root[data-ui-style="version3"] .v3-brand-mark img { width: 100%; height: 100%; border-radius: 5px; object-fit: cover; display: block; }
:root[data-ui-style="version3"] .v3-brand-copy { min-width: 0; display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-brand-copy strong { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .96rem; font-weight: 800; line-height: 1.15; }
:root[data-ui-style="version3"] .v3-brand-copy small { color: var(--v3-muted); font-size: .68rem; line-height: 1.3; text-transform: uppercase; }

:root[data-ui-style="version3"] .v3-topbar-actions { display: flex; align-items: center; gap: 8px; }
:root[data-ui-style="version3"] .v3-live-status { min-height: 34px; padding: 7px 10px; border: 1px solid var(--v3-line); border-radius: 999px; display: inline-flex; align-items: center; gap: 7px; color: var(--v3-muted); font-size: .76rem; font-weight: 700; }
:root[data-ui-style="version3"] .v3-live-status > span { width: 7px; height: 7px; border-radius: 50%; background: var(--v3-success); box-shadow: 0 0 0 3px var(--v3-success-soft); }

:root[data-ui-style="version3"] .v3-icon-button,
:root[data-ui-style="version3"] .v3-menu-button {
    width: 44px;
    height: 44px;
    min-width: 44px;
    padding: 0;
    border-radius: 6px;
    border: 1px solid var(--v3-line);
    background: var(--v3-surface);
    color: var(--v3-ink);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    cursor: pointer;
}
:root[data-ui-style="version3"] .v3-icon-button:hover,
:root[data-ui-style="version3"] .v3-menu-button:hover { background: var(--v3-surface-2); border-color: var(--v3-line-strong); }

:root[data-ui-style="version3"] .v3-theme-wrapper,
:root[data-ui-style="version3"] .v3-user-menu { position: relative; }
:root[data-ui-style="version3"] .v3-user-button {
    width: 44px;
    min-height: 44px;
    padding: 4px;
    border: 1px solid var(--v3-line);
    border-radius: 6px;
    background: var(--v3-surface);
    color: var(--v3-ink);
}
:root[data-ui-style="version3"] .v3-user-button .user-avatar { width: 34px; height: 34px; margin: 0; border-radius: 5px; background: var(--v3-primary-soft); color: var(--v3-primary); font-size: .88rem; }

:root[data-ui-style="version3"] .v3-dropdown {
    position: absolute;
    display: none;
    z-index: 1400;
    top: calc(100% + 8px);
    right: 0;
    min-width: 220px;
    padding: 8px;
    border: 1px solid var(--v3-line);
    border-radius: 7px;
    background: var(--v3-surface);
    color: var(--v3-ink);
    box-shadow: var(--v3-shadow-md);
}
:root[data-ui-style="version3"] .v3-dropdown.open,
:root[data-ui-style="version3"] .v3-dropdown.show { display: block; }
:root[data-ui-style="version3"] .v3-dropdown-label { padding: 6px 9px; color: var(--v3-faint); font-size: .7rem; font-weight: 800; text-transform: uppercase; }
:root[data-ui-style="version3"] .v3-dropdown .dropdown-item,
:root[data-ui-style="version3"] .v3-dropdown .theme-dropdown-item { min-height: 42px; padding: 8px 10px; border-radius: 5px; color: var(--v3-ink); display: flex; align-items: center; gap: 10px; }
:root[data-ui-style="version3"] .v3-dropdown .dropdown-item:hover,
:root[data-ui-style="version3"] .v3-dropdown .theme-dropdown-item:hover,
:root[data-ui-style="version3"] .v3-dropdown .theme-dropdown-item.active { background: var(--v3-surface-2); color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-dropdown .text-danger { color: var(--v3-danger); }

:root[data-ui-style="version3"] .v3-menu-button { display: none; }
:root[data-ui-style="version3"] .v3-mobile-menu { display: none; }
:root[data-ui-style="version3"] .v3-auth-actions { display: flex; align-items: center; gap: 8px; }

:root[data-ui-style="version3"] .v3-app-shell {
    width: min(100%, 1440px);
    min-height: calc(100dvh - 68px);
    margin: 0 auto;
    padding: calc(92px + var(--v3-safe-top)) 18px 30px;
    display: grid;
    grid-template-columns: 228px minmax(0, 1fr);
    gap: 28px;
}
:root[data-ui-style="version3"] .v3-app-shell-auth { display: block; max-width: 960px; }
:root[data-ui-style="version3"] .v3-sidebar {
    position: sticky;
    top: calc(92px + var(--v3-safe-top));
    height: calc(100dvh - 116px - var(--v3-safe-top));
    padding-right: 16px;
    border-right: 1px solid var(--v3-line);
    display: flex;
    flex-direction: column;
    gap: 4px;
}
:root[data-ui-style="version3"] .v3-sidebar-label { margin: 0 10px 8px; color: var(--v3-faint); font-size: .68rem; font-weight: 800; text-transform: uppercase; }
:root[data-ui-style="version3"] .v3-side-link {
    min-height: 46px;
    padding: 10px 11px;
    border: 1px solid transparent;
    border-radius: 6px;
    color: var(--v3-muted);
    display: flex;
    align-items: center;
    gap: 11px;
    font-size: .88rem;
    font-weight: 700;
    text-decoration: none;
}
:root[data-ui-style="version3"] .v3-side-link i { width: 20px; font-size: 1.16rem; text-align: center; }
:root[data-ui-style="version3"] .v3-side-link:hover { background: var(--v3-surface-2); color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-side-link.active { border-color: var(--v3-line); background: var(--v3-surface); color: var(--v3-primary); box-shadow: var(--v3-shadow-sm); }
:root[data-ui-style="version3"] .v3-support-panel { margin-top: auto; padding: 14px; border: 1px solid var(--v3-line); border-radius: 7px; background: var(--v3-surface); display: grid; grid-template-columns: 34px 1fr 28px; align-items: center; gap: 9px; }
:root[data-ui-style="version3"] .v3-support-panel > i { width: 34px; height: 34px; border-radius: 5px; display: grid; place-items: center; background: var(--v3-primary-soft); color: var(--v3-primary); }
:root[data-ui-style="version3"] .v3-support-panel div { min-width: 0; display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-support-panel strong { font-size: .78rem; }
:root[data-ui-style="version3"] .v3-support-panel span { color: var(--v3-muted); font-size: .68rem; }
:root[data-ui-style="version3"] .v3-support-panel a { width: 28px; height: 28px; display: grid; place-items: center; color: var(--v3-ink); }

:root[data-ui-style="version3"] .v3-main { min-width: 0; padding: 0; }
:root[data-ui-style="version3"] .v3-content { max-width: 1120px; padding: 0; }
:root[data-ui-style="version3"] .v3-footer { border-top: 1px solid var(--v3-line); background: var(--v3-surface); }
:root[data-ui-style="version3"] .v3-footer p { color: var(--v3-muted); }

:root[data-ui-style="version3"] .v3-flash-container { top: calc(78px + var(--v3-safe-top)); z-index: 1400; }
:root[data-ui-style="version3"] .v3-flash-container .flash { display: flex; align-items: center; gap: 10px; }
:root[data-ui-style="version3"] .v3-flash-container .flash > span { flex: 1; }

/* Dashboard */
:root[data-ui-style="version3"] .v3-dashboard { display: flex; flex-direction: column; gap: 26px; }
:root[data-ui-style="version3"] .v3-page-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
:root[data-ui-style="version3"] .v3-page-intro h1 { margin: 4px 0 7px; font-size: clamp(1.75rem, 4vw, 2.65rem); }
:root[data-ui-style="version3"] .v3-page-intro > div > p:last-child { margin: 0; color: var(--v3-muted); }
:root[data-ui-style="version3"] .v3-eyebrow { margin: 0; color: var(--v3-muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
:root[data-ui-style="version3"] .v3-page-intro .v3-eyebrow { display: flex; align-items: center; gap: 7px; }
:root[data-ui-style="version3"] .v3-page-intro .v3-eyebrow > span { width: 16px; height: 2px; background: var(--v3-coral); }
:root[data-ui-style="version3"] .v3-balance-chip { min-width: 172px; min-height: 56px; padding: 8px 10px; border: 1px solid var(--v3-line); border-radius: 7px; background: var(--v3-surface); color: var(--v3-ink); display: grid; grid-template-columns: 34px 1fr 24px; align-items: center; gap: 9px; text-decoration: none; box-shadow: var(--v3-shadow-sm); }
:root[data-ui-style="version3"] .v3-balance-chip > i:first-child { width: 34px; height: 34px; border-radius: 5px; display: grid; place-items: center; background: var(--v3-primary-soft); color: var(--v3-primary); }
:root[data-ui-style="version3"] .v3-balance-chip span { display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-balance-chip small { color: var(--v3-muted); font-size: .67rem; }
:root[data-ui-style="version3"] .v3-balance-chip strong { font-size: .92rem; font-variant-numeric: tabular-nums; }
:root[data-ui-style="version3"] .v3-balance-chip > i:last-child { color: var(--v3-primary); }

:root[data-ui-style="version3"] .v3-notice { min-height: 46px; padding: 10px 12px; border: 1px solid var(--v3-line); border-radius: 6px; background: var(--v3-surface); display: flex; align-items: center; gap: 9px; color: var(--v3-ink); font-size: .86rem; }
:root[data-ui-style="version3"] .v3-notice > span { flex: 1; }
:root[data-ui-style="version3"] .v3-notice a { margin-left: auto; font-weight: 700; }
:root[data-ui-style="version3"] .v3-notice.is-error { border-color: var(--v3-danger); background: var(--v3-danger-soft); color: var(--v3-danger); }
:root[data-ui-style="version3"] .v3-notice.is-success { border-color: var(--v3-success); background: var(--v3-success-soft); color: var(--v3-success); }

:root[data-ui-style="version3"] .v3-subscription-panel { display: grid; grid-template-columns: minmax(300px, .9fr) minmax(360px, 1.1fr); overflow: hidden; border: 1px solid var(--v3-line); border-radius: var(--v3-radius); background: var(--v3-surface); box-shadow: var(--v3-shadow-sm); }
:root[data-ui-style="version3"] .v3-subscription-primary { min-height: 320px; padding: 24px; background: var(--v3-hero-bg); color: #fff; display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-subscription-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
:root[data-ui-style="version3"] .v3-status-badge { min-height: 30px; padding: 5px 9px; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; display: inline-flex; align-items: center; gap: 7px; color: #f4f7f6; font-size: .72rem; font-weight: 800; }
:root[data-ui-style="version3"] .v3-status-badge > span { width: 7px; height: 7px; border-radius: 50%; background: #54d3a6; }
:root[data-ui-style="version3"] .v3-status-badge.is-warning > span { background: #f4bc55; }
:root[data-ui-style="version3"] .v3-icon-link { width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.24); border-radius: 6px; display: grid; place-items: center; color: #fff; }
:root[data-ui-style="version3"] .v3-plan-copy { margin: auto 0 24px; }
:root[data-ui-style="version3"] .v3-plan-copy p { margin: 0 0 6px; color: rgba(255,255,255,.62); font-size: .75rem; font-weight: 700; }
:root[data-ui-style="version3"] .v3-plan-copy h2 { max-width: 420px; margin: 0 0 8px; color: #fff; font-size: clamp(1.65rem, 4vw, 2.45rem); overflow-wrap: anywhere; }
:root[data-ui-style="version3"] .v3-plan-copy span { color: rgba(255,255,255,.68); font-size: .88rem; }
:root[data-ui-style="version3"] .v3-plan-actions { display: flex; flex-wrap: wrap; gap: 9px; }
:root[data-ui-style="version3"] .v3-subscription-primary .btn-outline { border-color: rgba(255,255,255,.3); background: transparent; color: #fff; }
:root[data-ui-style="version3"] .v3-subscription-primary .btn-outline:hover { background: rgba(255,255,255,.1); color: #fff; }

:root[data-ui-style="version3"] .v3-subscription-metrics { padding: 8px 24px; display: flex; flex-direction: column; justify-content: center; }
:root[data-ui-style="version3"] .v3-metric-row { padding: 20px 0; border-bottom: 1px solid var(--v3-line); }
:root[data-ui-style="version3"] .v3-metric-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
:root[data-ui-style="version3"] .v3-metric-heading > span { display: inline-flex; align-items: center; gap: 8px; color: var(--v3-muted); font-size: .82rem; font-weight: 700; }
:root[data-ui-style="version3"] .v3-metric-heading > span i { color: var(--v3-primary); font-size: 1.1rem; }
:root[data-ui-style="version3"] .v3-metric-heading strong { font-size: .92rem; font-variant-numeric: tabular-nums; text-align: right; }
:root[data-ui-style="version3"] .v3-metric-link {
    min-height: 48px;
    margin: -6px -8px 0;
    padding: 6px 8px;
    border-radius: 6px;
    color: var(--v3-ink);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 20px;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}
:root[data-ui-style="version3"] .v3-metric-link:hover,
:root[data-ui-style="version3"] .v3-metric-link:active { background: var(--v3-surface-2); color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-metric-link > span { min-width: 0; display: inline-flex; align-items: center; gap: 8px; color: var(--v3-muted); font-size: .82rem; font-weight: 700; }
:root[data-ui-style="version3"] .v3-metric-link > span i { color: var(--v3-primary); font-size: 1.1rem; }
:root[data-ui-style="version3"] .v3-metric-link > strong { font-size: .92rem; font-variant-numeric: tabular-nums; text-align: right; }
:root[data-ui-style="version3"] .v3-metric-link > i { color: var(--v3-primary); font-size: 1rem; }
:root[data-ui-style="version3"] .v3-progress { height: 7px; margin-top: 13px; overflow: hidden; border-radius: 999px; background: var(--v3-surface-3); }
:root[data-ui-style="version3"] .v3-progress span { display: block; height: 100%; border-radius: inherit; background: var(--v3-primary); }
:root[data-ui-style="version3"] .v3-text-button { min-height: 36px; margin-top: 10px; padding: 0; border: 0; background: transparent; color: var(--v3-primary); display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 800; cursor: pointer; }
:root[data-ui-style="version3"] .v3-key-row { min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
:root[data-ui-style="version3"] .v3-key-row > span { color: var(--v3-muted); font-size: .82rem; font-weight: 700; }
:root[data-ui-style="version3"] .v3-copy-button { min-height: 40px; padding: 8px 10px; border: 1px solid var(--v3-line-strong); border-radius: 5px; background: var(--v3-surface); color: var(--v3-ink); display: inline-flex; align-items: center; gap: 7px; font-size: .78rem; font-weight: 800; cursor: pointer; }

:root[data-ui-style="version3"] .v3-empty-subscription { padding: 28px; border: 1px solid var(--v3-line); border-left: 4px solid var(--v3-coral); border-radius: var(--v3-radius); background: var(--v3-surface); display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: 18px; }
:root[data-ui-style="version3"] .v3-empty-icon { width: 52px; height: 52px; border-radius: 7px; display: grid; place-items: center; background: var(--v3-coral-soft); color: var(--v3-coral); font-size: 1.45rem; }
:root[data-ui-style="version3"] .v3-empty-subscription h2 { margin: 5px 0 6px; font-size: 1.35rem; }
:root[data-ui-style="version3"] .v3-empty-subscription p:last-child { margin: 0; color: var(--v3-muted); }

:root[data-ui-style="version3"] .v3-section-heading { display: flex; justify-content: space-between; align-items: flex-end; }
:root[data-ui-style="version3"] .v3-section-heading h2 { margin: 5px 0 0; font-size: 1.3rem; }
:root[data-ui-style="version3"] .v3-action-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
:root[data-ui-style="version3"] .v3-action-tile { min-height: 84px; padding: 14px; border: 1px solid var(--v3-line); border-radius: 7px; background: var(--v3-surface); color: var(--v3-ink); display: grid; grid-template-columns: 44px 1fr 24px; align-items: center; gap: 12px; text-decoration: none; box-shadow: var(--v3-shadow-sm); }
:root[data-ui-style="version3"] .v3-action-tile:hover { border-color: var(--v3-line-strong); color: var(--v3-ink); box-shadow: var(--v3-shadow-md); }
:root[data-ui-style="version3"] .v3-action-icon { width: 44px; height: 44px; border-radius: 6px; display: grid; place-items: center; background: var(--v3-primary-soft); color: var(--v3-primary); font-size: 1.2rem; }
:root[data-ui-style="version3"] .v3-action-icon.is-coral { background: var(--v3-coral-soft); color: var(--v3-coral); }
:root[data-ui-style="version3"] .v3-action-icon.is-amber { background: var(--v3-amber-soft); color: var(--v3-amber); }
:root[data-ui-style="version3"] .v3-action-icon.is-ink { background: var(--v3-surface-3); color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-action-tile > span:nth-child(2) { min-width: 0; display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-action-tile strong { font-size: .9rem; }
:root[data-ui-style="version3"] .v3-action-tile small { color: var(--v3-muted); font-size: .74rem; }
:root[data-ui-style="version3"] .v3-action-tile > i { color: var(--v3-faint); }

:root[data-ui-style="version3"] .v3-dashboard-lower { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
:root[data-ui-style="version3"] .v3-service-card { min-height: 180px; padding: 20px; border: 1px solid var(--v3-line); border-radius: 7px; background: var(--v3-surface); display: grid; grid-template-columns: 44px 1fr; align-content: start; gap: 14px; }
:root[data-ui-style="version3"] .v3-service-icon { width: 44px; height: 44px; border-radius: 6px; display: grid; place-items: center; background: var(--v3-primary-soft); color: var(--v3-primary); font-size: 1.2rem; }
:root[data-ui-style="version3"] .v3-service-icon.is-coral { background: var(--v3-coral-soft); color: var(--v3-coral); }
:root[data-ui-style="version3"] .v3-service-card h3 { margin: 5px 0 6px; font-size: 1.05rem; }
:root[data-ui-style="version3"] .v3-service-card p:last-child { margin: 0; color: var(--v3-muted); font-size: .82rem; }
:root[data-ui-style="version3"] .v3-service-card .btn { grid-column: 1 / -1; align-self: end; }

/* Sheets and dashboard dialogs */
:root[data-ui-style="version3"] .v3-modal,
:root[data-ui-style="version3"] .v3-modal-overlay { position: fixed; inset: 0; z-index: 2000; display: none; align-items: center; justify-content: center; padding: 18px; background: rgba(8, 13, 11, .62); backdrop-filter: blur(5px); }
:root[data-ui-style="version3"] .v3-modal.show,
:root[data-ui-style="version3"] .v3-modal-overlay.show { display: flex; }
:root[data-ui-style="version3"] .v3-modal-card,
:root[data-ui-style="version3"] .v3-sheet { width: min(100%, 520px); max-height: min(760px, calc(100dvh - 36px)); overflow: auto; padding: 20px; border: 1px solid var(--v3-line); border-radius: 8px; background: var(--v3-surface); color: var(--v3-ink); box-shadow: var(--v3-shadow-md); }
:root[data-ui-style="version3"] .v3-modal-handle,
:root[data-ui-style="version3"] .v3-sheet-handle { display: none; }
:root[data-ui-style="version3"] .v3-modal-head { margin-bottom: 18px; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
:root[data-ui-style="version3"] .v3-modal-head h3 { margin: 4px 0 0; font-size: 1.25rem; }
:root[data-ui-style="version3"] .v3-modal-head > button,
:root[data-ui-style="version3"] .modal-close { width: 44px; height: 44px; flex: 0 0 44px; border: 1px solid var(--v3-line); border-radius: 6px; background: var(--v3-surface); color: var(--v3-ink); display: grid; place-items: center; cursor: pointer; }
:root[data-ui-style="version3"] .v3-modal-copy { margin: -8px 0 16px; color: var(--v3-muted); font-size: .86rem; }
:root[data-ui-style="version3"] .v3-option-list { display: flex; flex-direction: column; gap: 8px; }
:root[data-ui-style="version3"] .v3-option-list form { margin: 0; }
:root[data-ui-style="version3"] .v3-option { width: 100%; min-height: 68px; padding: 11px 12px; border: 1px solid var(--v3-line); border-radius: 6px; background: var(--v3-surface); color: var(--v3-ink); display: grid; grid-template-columns: 1fr auto 20px; align-items: center; gap: 12px; text-align: left; cursor: pointer; }
:root[data-ui-style="version3"] .v3-option:hover { border-color: var(--v3-line-strong); background: var(--v3-surface-2); }
:root[data-ui-style="version3"] .v3-option > span { display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-option strong { font-size: .88rem; }
:root[data-ui-style="version3"] .v3-option small { color: var(--v3-muted); font-size: .74rem; }
:root[data-ui-style="version3"] .v3-option b { color: var(--v3-primary); font-size: .9rem; white-space: nowrap; }
:root[data-ui-style="version3"] .v3-option.is-selected { border-color: var(--v3-primary); background: var(--v3-primary-soft); }
:root[data-ui-style="version3"] .v3-option.is-selected > i { color: var(--v3-primary); }
:root[data-ui-style="version3"] .v3-option.is-disabled { cursor: default; background: var(--v3-surface-2); color: var(--v3-muted); }
:root[data-ui-style="version3"] .v3-option.is-disabled > a { font-size: .78rem; font-weight: 800; }
:root[data-ui-style="version3"] .v3-device-option-data { display: none !important; }
:root[data-ui-style="version3"] .v3-device-stepper { min-height: 96px; padding: 12px; border: 1px solid var(--v3-line); border-radius: 7px; background: var(--v3-surface-2); display: grid; grid-template-columns: 52px minmax(0, 1fr) 52px; align-items: center; gap: 12px; }
:root[data-ui-style="version3"] .v3-device-stepper > button { width: 52px; height: 52px; border: 1px solid var(--v3-line-strong); border-radius: 6px; background: var(--v3-surface); color: var(--v3-ink); display: grid; place-items: center; font-size: 1.2rem; cursor: pointer; }
:root[data-ui-style="version3"] .v3-device-stepper > button:disabled { opacity: .38; cursor: not-allowed; }
:root[data-ui-style="version3"] .v3-device-stepper > div { min-width: 0; display: flex; align-items: center; flex-direction: column; text-align: center; }
:root[data-ui-style="version3"] .v3-device-stepper small { color: var(--v3-muted); font-size: .72rem; font-weight: 700; }
:root[data-ui-style="version3"] .v3-device-stepper strong { margin: 1px 0; color: var(--v3-primary); font-size: 1.65rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
:root[data-ui-style="version3"] .v3-device-stepper span { color: var(--v3-muted); font-size: .76rem; }
:root[data-ui-style="version3"] .v3-device-price { min-height: 52px; margin-top: 10px; padding: 10px 12px; border: 1px solid var(--v3-line); border-radius: 6px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
:root[data-ui-style="version3"] .v3-device-price span { color: var(--v3-muted); font-size: .8rem; font-weight: 700; }
:root[data-ui-style="version3"] .v3-device-price strong { color: var(--v3-ink); font-size: 1.05rem; font-variant-numeric: tabular-nums; }
:root[data-ui-style="version3"] .v3-modal-actions { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; }
:root[data-ui-style="version3"] .v3-modal-actions > * { flex: 1 1 160px; }
:root[data-ui-style="version3"] .v3-modal-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
:root[data-ui-style="version3"] .v3-modal-stats > div { min-height: 92px; padding: 14px; border: 1px solid var(--v3-line); border-radius: 6px; background: var(--v3-surface-2); display: flex; flex-direction: column; justify-content: center; }
:root[data-ui-style="version3"] .v3-modal-stats span { color: var(--v3-muted); font-size: .74rem; }
:root[data-ui-style="version3"] .v3-modal-stats strong { margin-top: 4px; font-size: 1.35rem; font-variant-numeric: tabular-nums; }
:root[data-ui-style="version3"] .v3-install-steps { margin: 0; padding: 0; list-style: none; counter-reset: install-step; display: flex; flex-direction: column; gap: 8px; }
:root[data-ui-style="version3"] .v3-install-steps li { min-height: 46px; padding: 10px 10px 10px 46px; position: relative; border: 1px solid var(--v3-line); border-radius: 6px; color: var(--v3-muted); font-size: .82rem; display: flex; align-items: center; }
:root[data-ui-style="version3"] .v3-install-steps li::before { counter-increment: install-step; content: counter(install-step); position: absolute; left: 10px; width: 26px; height: 26px; border-radius: 5px; background: var(--v3-primary-soft); color: var(--v3-primary); display: grid; place-items: center; font-size: .75rem; font-weight: 800; }

:root[data-ui-style="version3"] .v3-sheet .theme-options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
:root[data-ui-style="version3"] .v3-sheet .theme-option { min-height: 70px; border: 1px solid var(--v3-line); border-radius: 6px; background: var(--v3-surface); color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-sheet .theme-option[data-theme="auto"] { grid-column: 1 / -1; }
:root[data-ui-style="version3"] .v3-sheet .theme-option.active { border-color: var(--v3-primary); background: var(--v3-primary-soft); }
:root[data-ui-style="version3"] .notifications-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
:root[data-ui-style="version3"] .notifications-title { color: var(--v3-ink); }
:root[data-ui-style="version3"] .notifications-empty { padding: 28px 12px; color: var(--v3-muted); }

/* Version 3 subscription details and partner program. */
:root[data-ui-style="version3"] .v3-detail-page,
:root[data-ui-style="version3"] .v3-partner-page { max-width: 1080px; margin: 0 auto; display: flex; flex-direction: column; gap: 16px; }
:root[data-ui-style="version3"] .v3-inner-header { min-height: 86px; display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: start; gap: 14px; }
:root[data-ui-style="version3"] .v3-inner-header h1 { margin: 4px 0 5px; font-size: clamp(1.55rem, 4vw, 2.25rem); overflow-wrap: anywhere; }
:root[data-ui-style="version3"] .v3-inner-header p:last-child { margin: 0; color: var(--v3-muted); }
:root[data-ui-style="version3"] .v3-back-button { width: 46px; height: 46px; border: 1px solid var(--v3-line); border-radius: 6px; background: var(--v3-surface); color: var(--v3-ink); display: grid; place-items: center; text-decoration: none; font-size: 1.15rem; }
:root[data-ui-style="version3"] .v3-back-button:hover,
:root[data-ui-style="version3"] .v3-back-button:active { border-color: var(--v3-line-strong); background: var(--v3-surface-2); color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-detail-grid,
:root[data-ui-style="version3"] .v3-partner-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
:root[data-ui-style="version3"] .v3-detail-card { min-width: 0; padding: 20px; border: 1px solid var(--v3-line); border-radius: 8px; background: var(--v3-surface); box-shadow: var(--v3-shadow-sm); }
:root[data-ui-style="version3"] .v3-card-head { margin-bottom: 18px; display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
:root[data-ui-style="version3"] .v3-card-head h2 { margin: 4px 0 0; font-size: 1.2rem; overflow-wrap: anywhere; }
:root[data-ui-style="version3"] .v3-card-head p:last-child { margin: 6px 0 0; color: var(--v3-muted); font-size: .84rem; }
:root[data-ui-style="version3"] .v3-card-symbol { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 6px; background: var(--v3-primary-soft); color: var(--v3-primary); display: grid; place-items: center; font-size: 1.2rem; }
:root[data-ui-style="version3"] .v3-state-pill { min-height: 30px; padding: 5px 9px; border: 1px solid var(--v3-line); border-radius: 999px; color: var(--v3-muted); display: inline-flex; align-items: center; gap: 7px; font-size: .73rem; font-weight: 800; white-space: nowrap; }
:root[data-ui-style="version3"] .v3-state-pill > span { width: 7px; height: 7px; border-radius: 50%; background: var(--v3-success); }
:root[data-ui-style="version3"] .v3-state-pill.is-expiring { color: var(--v3-amber); border-color: var(--v3-amber); background: var(--v3-amber-soft); }
:root[data-ui-style="version3"] .v3-state-pill.is-disabled,
:root[data-ui-style="version3"] .v3-state-pill.is-expired { color: var(--v3-danger); border-color: var(--v3-danger); background: var(--v3-danger-soft); }
:root[data-ui-style="version3"] .v3-fact-grid { margin: 0 0 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
:root[data-ui-style="version3"] .v3-fact-grid > div { min-height: 74px; padding: 11px; border: 1px solid var(--v3-line); border-radius: 6px; background: var(--v3-surface-2); }
:root[data-ui-style="version3"] .v3-fact-grid dt,
:root[data-ui-style="version3"] .v3-method-list dt { color: var(--v3-muted); font-size: .72rem; font-weight: 700; }
:root[data-ui-style="version3"] .v3-fact-grid dd,
:root[data-ui-style="version3"] .v3-method-list dd { margin: 4px 0 0; color: var(--v3-ink); font-size: .92rem; font-weight: 800; overflow-wrap: anywhere; }
:root[data-ui-style="version3"] .v3-card-actions { margin-top: 16px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
:root[data-ui-style="version3"] .v3-card-actions form { margin: 0; }
:root[data-ui-style="version3"] .v3-wide-button { width: 100%; }
:root[data-ui-style="version3"] .v3-copy-field { margin-top: 10px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
:root[data-ui-style="version3"] .v3-copy-field input { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:root[data-ui-style="version3"] .v3-devices-section { scroll-margin-top: calc(86px + var(--v3-safe-top)); }
:root[data-ui-style="version3"] .v3-device-count { min-width: 54px; min-height: 34px; padding: 6px 9px; border-radius: 999px; background: var(--v3-primary-soft); color: var(--v3-primary); display: inline-grid; place-items: center; font-size: .82rem; font-weight: 800; font-variant-numeric: tabular-nums; }
:root[data-ui-style="version3"] .v3-device-list { display: flex; flex-direction: column; gap: 8px; }
:root[data-ui-style="version3"] .v3-device-card { min-height: 82px; padding: 12px; border: 1px solid var(--v3-line); border-radius: 7px; background: var(--v3-bg); display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
:root[data-ui-style="version3"] .v3-device-icon { width: 44px; height: 44px; border-radius: 6px; background: var(--v3-primary-soft); color: var(--v3-primary); display: grid; place-items: center; font-size: 1.2rem; }
:root[data-ui-style="version3"] .v3-device-copy { min-width: 0; display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-device-copy strong { font-size: .9rem; overflow-wrap: anywhere; }
:root[data-ui-style="version3"] .v3-device-copy span { color: var(--v3-muted); font-size: .78rem; }
:root[data-ui-style="version3"] .v3-device-copy small { margin-top: 3px; color: var(--v3-faint); font-size: .68rem; word-break: break-all; }
:root[data-ui-style="version3"] .v3-device-card form { margin: 0; }
:root[data-ui-style="version3"] .v3-delete-button { min-width: 44px; min-height: 44px; padding: 9px 11px; border: 1px solid var(--v3-danger); border-radius: 6px; background: var(--v3-danger-soft); color: var(--v3-danger); display: inline-flex; align-items: center; justify-content: center; gap: 7px; font-weight: 800; font-size: .78rem; cursor: pointer; }
:root[data-ui-style="version3"] .v3-empty-inline { min-height: 92px; padding: 16px; border: 1px dashed var(--v3-line-strong); border-radius: 7px; color: var(--v3-muted); display: flex; align-items: center; gap: 12px; }
:root[data-ui-style="version3"] .v3-empty-inline > i { font-size: 1.5rem; color: var(--v3-primary); }
:root[data-ui-style="version3"] .v3-empty-inline div { display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-empty-inline strong { color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-empty-inline span { font-size: .82rem; }
:root[data-ui-style="version3"] .v3-danger-zone { padding: 16px; border: 1px solid var(--v3-danger); border-radius: 8px; background: var(--v3-danger-soft); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
:root[data-ui-style="version3"] .v3-danger-zone > div { display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-danger-zone > div strong { color: var(--v3-danger); }
:root[data-ui-style="version3"] .v3-danger-zone > div span { color: var(--v3-muted); font-size: .8rem; }
:root[data-ui-style="version3"] .v3-danger-zone form { margin: 0; }

:root[data-ui-style="version3"] .v3-partner-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
:root[data-ui-style="version3"] .v3-partner-stats article { min-height: 96px; padding: 14px; border: 1px solid var(--v3-line); border-radius: 7px; background: var(--v3-surface); display: flex; align-items: center; gap: 12px; }
:root[data-ui-style="version3"] .v3-partner-stats article > div { min-width: 0; display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-partner-stats small { color: var(--v3-muted); font-size: .72rem; }
:root[data-ui-style="version3"] .v3-partner-stats strong { font-size: 1.35rem; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
:root[data-ui-style="version3"] .v3-stat-icon { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 6px; background: var(--v3-primary-soft); color: var(--v3-primary); display: grid; place-items: center; font-size: 1.15rem; }
:root[data-ui-style="version3"] .v3-stat-icon.is-coral { background: var(--v3-coral-soft); color: var(--v3-coral); }
:root[data-ui-style="version3"] .v3-stat-icon.is-amber { background: var(--v3-amber-soft); color: var(--v3-amber); }
:root[data-ui-style="version3"] .v3-referral-card { border-left: 4px solid var(--v3-primary); }
:root[data-ui-style="version3"] .v3-referral-links { display: flex; flex-direction: column; gap: 8px; }
:root[data-ui-style="version3"] .v3-referral-row { min-height: 56px; display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; align-items: center; gap: 8px; }
:root[data-ui-style="version3"] .v3-referral-row[hidden],
:root[data-ui-style="version3"] .v3-referral-links > [hidden] { display: none !important; }
:root[data-ui-style="version3"] .v3-link-kind { min-height: 48px; padding: 10px; border-radius: 6px; background: var(--v3-surface-2); color: var(--v3-muted); display: inline-flex; align-items: center; gap: 8px; font-size: .76rem; font-weight: 800; }
:root[data-ui-style="version3"] .v3-link-kind i { color: var(--v3-primary); font-size: 1rem; }
:root[data-ui-style="version3"] .v3-referral-row input { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:root[data-ui-style="version3"] .v3-terms-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; }
:root[data-ui-style="version3"] .v3-terms-list li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 8px; color: var(--v3-muted); font-size: .84rem; }
:root[data-ui-style="version3"] .v3-terms-list i { color: var(--v3-success); font-size: 1.05rem; }
:root[data-ui-style="version3"] .v3-terms-list strong { color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-method-list { margin: 0 0 16px; display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-method-list > div { min-height: 56px; padding: 10px 0; border-bottom: 1px solid var(--v3-line); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
:root[data-ui-style="version3"] .v3-method-list > div:last-child { border-bottom: 0; }
:root[data-ui-style="version3"] .v3-method-list dd { text-align: right; }
:root[data-ui-style="version3"] .v3-partner-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }

/* Automatic platform selection on the installation page. */
:root[data-ui-style="version3"] .v3-install-page { max-width: 960px; margin: 0 auto; display: flex; flex-direction: column; gap: 16px; }
:root[data-ui-style="version3"] .v3-platform-panel { overflow: hidden; border: 1px solid var(--v3-line); border-radius: 8px; background: var(--v3-surface); box-shadow: var(--v3-shadow-sm); }
:root[data-ui-style="version3"] .v3-platform-current { min-height: 94px; padding: 16px; display: flex; align-items: center; gap: 14px; }
:root[data-ui-style="version3"] .v3-platform-current > div { min-width: 0; display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-platform-current small { color: var(--v3-primary); font-size: .7rem; font-weight: 800; text-transform: uppercase; }
:root[data-ui-style="version3"] .v3-platform-current strong { margin-top: 2px; font-size: 1.16rem; }
:root[data-ui-style="version3"] .v3-platform-current > div > span { color: var(--v3-muted); font-size: .8rem; }
:root[data-ui-style="version3"] .v3-platform-icon { width: 54px; height: 54px; flex: 0 0 54px; border-radius: 7px; background: var(--v3-primary-soft); color: var(--v3-primary); display: grid; place-items: center; font-size: 1.55rem; }
:root[data-ui-style="version3"] .v3-platform-toggle { width: 100%; min-height: 50px; padding: 10px 16px; border: 0; border-top: 1px solid var(--v3-line); background: var(--v3-surface-2); color: var(--v3-ink); display: flex; align-items: center; justify-content: space-between; gap: 12px; font-weight: 800; font-size: .82rem; cursor: pointer; }
:root[data-ui-style="version3"] .v3-platform-picker { padding: 8px; border-top: 1px solid var(--v3-line); background: var(--v3-surface); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
:root[data-ui-style="version3"] .v3-platform-picker[hidden] { display: none; }
:root[data-ui-style="version3"] .v3-platform-option { min-height: 50px; padding: 9px 10px; border: 1px solid var(--v3-line); border-radius: 6px; background: var(--v3-surface); color: var(--v3-ink); display: grid; grid-template-columns: 26px minmax(0, 1fr) 20px; align-items: center; gap: 8px; text-align: left; text-decoration: none; cursor: pointer; }
:root[data-ui-style="version3"] .v3-platform-option:hover,
:root[data-ui-style="version3"] .v3-platform-option.is-active { border-color: var(--v3-primary); background: var(--v3-primary-soft); color: var(--v3-ink); }
:root[data-ui-style="version3"] .v3-platform-option > i:first-child { color: var(--v3-primary); font-size: 1.15rem; }
:root[data-ui-style="version3"] .v3-platform-option > i:last-child { color: transparent; }
:root[data-ui-style="version3"] .v3-platform-option.is-active > i:last-child { color: var(--v3-primary); }
:root[data-ui-style="version3"] .v3-platform-apps[hidden] { display: none; }
:root[data-ui-style="version3"] .v3-app-list { display: flex; flex-direction: column; gap: 8px; }
:root[data-ui-style="version3"] .v3-install-app { min-height: 104px; padding: 14px; border: 1px solid var(--v3-line); border-radius: 7px; background: var(--v3-surface); display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: 14px; }
:root[data-ui-style="version3"] .v3-install-app.is-recommended { border-left: 4px solid var(--v3-primary); }
:root[data-ui-style="version3"] .v3-app-logo { width: 52px; height: 52px; overflow: hidden; border: 1px solid var(--v3-line); border-radius: 7px; background: var(--v3-surface-2); color: var(--v3-primary); display: grid; place-items: center; font-size: 1.35rem; }
:root[data-ui-style="version3"] .v3-app-logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
:root[data-ui-style="version3"] .v3-app-copy { min-width: 0; }
:root[data-ui-style="version3"] .v3-app-title-line { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
:root[data-ui-style="version3"] .v3-app-title-line h3 { margin: 0; font-size: 1rem; overflow-wrap: anywhere; }
:root[data-ui-style="version3"] .v3-app-title-line span { padding: 3px 6px; border-radius: 999px; background: var(--v3-primary-soft); color: var(--v3-primary); font-size: .65rem; font-weight: 800; }
:root[data-ui-style="version3"] .v3-app-copy > small { color: var(--v3-primary); font-size: .7rem; font-weight: 700; }
:root[data-ui-style="version3"] .v3-app-copy p { max-width: 600px; margin: 5px 0 0; color: var(--v3-muted); font-size: .76rem; line-height: 1.45; }
:root[data-ui-style="version3"] .v3-app-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
:root[data-ui-style="version3"] .v3-install-guide { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
:root[data-ui-style="version3"] .v3-install-guide li { min-height: 106px; padding: 12px; border: 1px solid var(--v3-line); border-radius: 6px; background: var(--v3-surface-2); display: flex; align-items: flex-start; gap: 10px; }
:root[data-ui-style="version3"] .v3-install-guide li > span { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 5px; background: var(--v3-primary); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: .78rem; }
:root[data-ui-style="version3"] .v3-install-guide li > div { display: flex; flex-direction: column; }
:root[data-ui-style="version3"] .v3-install-guide strong { font-size: .84rem; }
:root[data-ui-style="version3"] .v3-install-guide small { margin-top: 3px; color: var(--v3-muted); font-size: .72rem; }

:root[data-ui-style="version3"] .v3-bottom-nav { display: none; }

@media (max-width: 1080px) {
    :root[data-ui-style="version3"] .v3-app-shell { grid-template-columns: 1fr; padding-bottom: calc(94px + var(--v3-safe-bottom)); }
    :root[data-ui-style="version3"] .v3-sidebar { display: none; }
    :root[data-ui-style="version3"] .v3-menu-button { display: inline-flex; }
    :root[data-ui-style="version3"] .v3-mobile-menu {
        position: fixed;
        top: calc(72px + var(--v3-safe-top));
        left: 12px;
        right: 12px;
        z-index: 1290;
        max-height: calc(100dvh - 160px - var(--v3-safe-top));
        overflow: auto;
        padding: 10px;
        border: 1px solid var(--v3-line);
        border-radius: 7px;
        background: var(--v3-surface);
        box-shadow: var(--v3-shadow-md);
        flex-direction: column;
        gap: 4px;
    }
    :root[data-ui-style="version3"] .v3-mobile-menu.show { display: flex; }
    :root[data-ui-style="version3"] .v3-mobile-menu .nav-link { min-height: 46px; padding: 10px; border-radius: 5px; color: var(--v3-muted); display: flex; align-items: center; gap: 10px; }
    :root[data-ui-style="version3"] .v3-mobile-menu .nav-link.active { background: var(--v3-primary-soft); color: var(--v3-primary); box-shadow: none; }
    :root[data-ui-style="version3"] .v3-bottom-nav { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1250; padding: 5px 8px calc(5px + var(--v3-safe-bottom)); border-top: 1px solid var(--v3-line); background: var(--v3-surface); }
    :root[data-ui-style="version3"] .v3-bottom-nav .bottom-nav-inner { width: min(100%, 720px); min-height: 58px; margin: 0 auto; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; }
    :root[data-ui-style="version3"] .v3-bottom-nav .bottom-nav-item { min-width: 0; min-height: 54px; padding: 6px 2px; border-radius: 5px; background: transparent; color: var(--v3-muted); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; box-shadow: none; transform: none; }
    :root[data-ui-style="version3"] .v3-bottom-nav .bottom-nav-item.active { background: var(--v3-primary-soft); color: var(--v3-primary); box-shadow: none; transform: none; }
    :root[data-ui-style="version3"] .v3-bottom-nav .bottom-nav-icon { font-size: 1.18rem; }
    :root[data-ui-style="version3"] .v3-bottom-nav .bottom-nav-text { max-width: 100%; overflow: hidden; text-overflow: ellipsis; font-size: .62rem; font-weight: 700; white-space: nowrap; }
    :root[data-ui-style="version3"] .v3-footer { display: none; }
}

@media (max-width: 760px) {
    :root[data-ui-style="version3"] .v3-topbar-inner { padding-left: 12px; padding-right: 12px; }
    :root[data-ui-style="version3"] .v3-brand-copy small,
    :root[data-ui-style="version3"] .v3-live-status,
    :root[data-ui-style="version3"] .v3-user-name,
    :root[data-ui-style="version3"] .v3-user-button .dropdown-arrow { display: none; }
    :root[data-ui-style="version3"] .v3-user-button { width: 44px; padding: 4px; }
    :root[data-ui-style="version3"] .v3-user-button .user-avatar { margin: 0; }
    :root[data-ui-style="version3"] .v3-app-shell { padding: calc(84px + var(--v3-safe-top)) 12px calc(86px + var(--v3-safe-bottom)); }
    :root[data-ui-style="version3"] .v3-page-intro { align-items: flex-start; flex-direction: column; }
    :root[data-ui-style="version3"] .v3-balance-chip { width: 100%; }
    :root[data-ui-style="version3"] .v3-subscription-panel { grid-template-columns: 1fr; }
    :root[data-ui-style="version3"] .v3-subscription-primary { min-height: 270px; padding: 20px; }
    :root[data-ui-style="version3"] .v3-subscription-metrics { padding: 2px 18px; }
    :root[data-ui-style="version3"] .v3-empty-subscription { grid-template-columns: 48px 1fr; padding: 20px; }
    :root[data-ui-style="version3"] .v3-empty-subscription .v3-plan-actions { grid-column: 1 / -1; }
    :root[data-ui-style="version3"] .v3-action-grid,
    :root[data-ui-style="version3"] .v3-dashboard-lower { grid-template-columns: 1fr; }
    :root[data-ui-style="version3"] .v3-detail-grid,
    :root[data-ui-style="version3"] .v3-partner-grid { grid-template-columns: 1fr; }
    :root[data-ui-style="version3"] .v3-partner-stats { grid-template-columns: 1fr; }
    :root[data-ui-style="version3"] .v3-partner-stats article { min-height: 78px; }
    :root[data-ui-style="version3"] .v3-referral-row { grid-template-columns: 138px minmax(0, 1fr); }
    :root[data-ui-style="version3"] .v3-referral-row .btn { grid-column: 2; }
    :root[data-ui-style="version3"] .v3-install-app { grid-template-columns: 52px minmax(0, 1fr); }
    :root[data-ui-style="version3"] .v3-app-actions { grid-column: 1 / -1; justify-content: stretch; }
    :root[data-ui-style="version3"] .v3-app-actions > * { flex: 1 1 160px; }
    :root[data-ui-style="version3"] .v3-install-guide { grid-template-columns: 1fr; }
    :root[data-ui-style="version3"] .v3-install-guide li { min-height: 78px; }
    :root[data-ui-style="version3"] .v3-device-card { grid-template-columns: 44px minmax(0, 1fr); }
    :root[data-ui-style="version3"] .v3-device-card form { grid-column: 1 / -1; }
    :root[data-ui-style="version3"] .v3-delete-button { width: 100%; }
    :root[data-ui-style="version3"] .v3-danger-zone { align-items: stretch; flex-direction: column; }
    :root[data-ui-style="version3"] .v3-danger-zone .btn { width: 100%; }
    :root[data-ui-style="version3"] .v3-modal { align-items: flex-end; padding: 0; }
    :root[data-ui-style="version3"] .v3-modal-card,
    :root[data-ui-style="version3"] .v3-sheet { width: 100%; max-height: calc(92dvh - var(--v3-safe-top)); padding: 12px 16px calc(18px + var(--v3-safe-bottom)); border-radius: 8px 8px 0 0; border-bottom: 0; }
    :root[data-ui-style="version3"] #v3DevicesModal { align-items: center; z-index: 5000; padding: calc(12px + var(--v3-safe-top)) 12px calc(82px + var(--v3-safe-bottom)); }
    :root[data-ui-style="version3"] #v3DevicesModal .v3-modal-card { width: min(100%, 480px); max-height: min(620px, calc(100dvh - var(--v3-safe-top) - var(--v3-safe-bottom) - 110px)); padding-bottom: 0; border-radius: 8px; border-bottom: 1px solid var(--v3-line); }
    :root[data-ui-style="version3"] #v3DevicesModal .v3-modal-handle { display: none; }
    :root[data-ui-style="version3"] .v3-device-purchase-actions { position: sticky; bottom: 0; z-index: 2; margin: 14px -16px 0; padding: 12px 16px calc(14px + var(--v3-safe-bottom)); border-top: 1px solid var(--v3-line); background: var(--v3-surface); box-shadow: 0 -10px 24px color-mix(in srgb, var(--v3-bg) 88%, transparent); }
    :root[data-ui-style="version3"] .v3-device-purchase-actions .btn { min-height: 50px; }
    :root[data-ui-style="version3"] .v3-modal-handle,
    :root[data-ui-style="version3"] .v3-sheet-handle { width: 42px; height: 4px; margin: 0 auto 12px; border-radius: 999px; background: var(--v3-line-strong); display: block; }
    :root[data-ui-style="version3"] .theme-modal-overlay,
    :root[data-ui-style="version3"] .notifications-modal-overlay { align-items: flex-end; padding: 0; }
}

@media (max-width: 420px) {
    :root[data-ui-style="version3"] .v3-brand-copy strong { max-width: 105px; }
    :root[data-ui-style="version3"] .v3-topbar-actions { gap: 5px; }
    :root[data-ui-style="version3"] .v3-theme-wrapper { display: none; }
    :root[data-ui-style="version3"] .v3-plan-actions > *,
    :root[data-ui-style="version3"] .v3-plan-actions form,
    :root[data-ui-style="version3"] .v3-plan-actions form .btn { width: 100%; }
    :root[data-ui-style="version3"] .v3-metric-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
    :root[data-ui-style="version3"] .v3-metric-heading strong { text-align: left; }
    :root[data-ui-style="version3"] .v3-metric-link { grid-template-columns: minmax(0, 1fr) auto 18px; }
    :root[data-ui-style="version3"] .v3-metric-link > strong { text-align: right; }
    :root[data-ui-style="version3"] .v3-key-row { align-items: flex-start; flex-direction: column; padding: 12px 0; }
    :root[data-ui-style="version3"] .v3-copy-button { width: 100%; justify-content: center; }
    :root[data-ui-style="version3"] .v3-auth-actions .btn:first-child { display: none; }
    :root[data-ui-style="version3"] .v3-inner-header { grid-template-columns: 44px minmax(0, 1fr); gap: 10px; }
    :root[data-ui-style="version3"] .v3-back-button { width: 44px; height: 44px; }
    :root[data-ui-style="version3"] .v3-detail-card { padding: 16px; }
    :root[data-ui-style="version3"] .v3-card-head { align-items: flex-start; }
    :root[data-ui-style="version3"] .v3-state-pill { white-space: normal; }
    :root[data-ui-style="version3"] .v3-fact-grid { grid-template-columns: 1fr; }
    :root[data-ui-style="version3"] .v3-copy-field { grid-template-columns: 1fr; }
    :root[data-ui-style="version3"] .v3-copy-field .btn { width: 100%; }
    :root[data-ui-style="version3"] .v3-device-count { min-width: 48px; }
    :root[data-ui-style="version3"] .v3-platform-picker { grid-template-columns: 1fr; }
    :root[data-ui-style="version3"] .v3-referral-row { grid-template-columns: 1fr; }
    :root[data-ui-style="version3"] .v3-referral-row .btn { width: 100%; grid-column: auto; }
    :root[data-ui-style="version3"] .v3-install-app { padding: 12px; gap: 10px; }
    :root[data-ui-style="version3"] .v3-app-actions { flex-direction: column; }
    :root[data-ui-style="version3"] .v3-app-actions > * { width: 100%; flex-basis: auto; }
}