:root {
    --ac-bg: #090b12;
    --ac-sidebar: #0d1019;
    --ac-surface: #121722;
    --ac-surface-soft: #171d2a;
    --ac-border: rgba(148, 163, 184, 0.13);
    --ac-border-strong: rgba(148, 163, 184, 0.22);
    --ac-text: #f8fafc;
    --ac-muted: #94a3b8;
    --ac-subtle: #64748b;
    --ac-purple: #8b5cf6;
    --ac-purple-light: #c4b5fd;
    --ac-blue: #38bdf8;
    --ac-green: #34d399;
    --ac-amber: #fbbf24;
    --ac-red: #fb7185;
    --ac-shadow: 0 18px 45px rgba(0, 0, 0, 0.22);
}

[hidden] { display: none !important; }
.account-body {
    min-height: 100vh;
    margin: 0;
    color: var(--ac-text);
    background: var(--ac-bg);
    font-family: Tahoma, "Segoe UI", sans-serif;
}
.account-body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(circle at 78% -15%, rgba(124, 58, 237, 0.13), transparent 30%),
        radial-gradient(circle at 12% 82%, rgba(14, 165, 233, 0.06), transparent 27%);
}
.account-body button,
.account-body input,
.account-body textarea { font: inherit; }
.account-body button { color: inherit; }

/* Loading and error states */
.account-loading,
.account-error {
    width: min(520px, calc(100% - 32px));
    min-height: 350px;
    margin: 12vh auto 0;
    padding: 38px;
    border: 1px solid var(--ac-border);
    border-radius: 24px;
    text-align: center;
    background: rgba(18, 23, 34, 0.92);
    box-shadow: var(--ac-shadow);
}
.account-loading { display: grid; place-content: center; justify-items: center; gap: 10px; }
.loading-mark {
    position: relative;
    width: 72px;
    height: 72px;
    margin-bottom: 8px;
    padding: 5px;
    border-radius: 22px;
    background: linear-gradient(135deg, var(--ac-purple), #6d28d9);
    box-shadow: 0 14px 30px rgba(109, 40, 217, 0.3);
}
.loading-mark img { width: 100%; height: 100%; border-radius: 17px; object-fit: cover; }
.account-loading strong { font-size: 1.05rem; }
.account-loading > span { color: var(--ac-muted); font-size: 0.78rem; }
.loading-line { width: 210px; height: 4px; margin-top: 14px; overflow: hidden; border-radius: 999px; background: rgba(148, 163, 184, 0.12); }
.loading-line span { display: block; width: 40%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--ac-purple), var(--ac-blue)); animation: accountLoad 1.15s ease-in-out infinite alternate; }
@keyframes accountLoad { from { transform: translateX(0); } to { transform: translateX(-150%); } }
.account-error { border-color: rgba(251, 113, 133, 0.24); }
.error-symbol { display: grid; place-items: center; width: 68px; height: 68px; margin: 0 auto 18px; border-radius: 20px; color: var(--ac-red); background: rgba(251, 113, 133, 0.1); font-size: 1.6rem; }
.account-error h1 { margin: 0; font-size: 1.35rem; }
.account-error p { margin: 10px auto 24px; color: var(--ac-muted); font-size: 0.8rem; line-height: 1.9; }
.error-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; }

/* Application shell */
.account-app { min-height: 100vh; display: grid; grid-template-columns: 282px minmax(0, 1fr); }
.account-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 18px 16px;
    border-left: 1px solid var(--ac-border);
    background: rgba(13, 16, 25, 0.97);
    box-shadow: -12px 0 36px rgba(0, 0, 0, 0.12);
}
.sidebar-brand { display: flex; align-items: center; gap: 11px; min-height: 52px; padding: 6px 8px 18px; color: var(--ac-text); text-decoration: none; }
.sidebar-brand img { width: 42px; height: 42px; border-radius: 13px; object-fit: cover; box-shadow: 0 0 0 1px rgba(196, 181, 253, 0.25); }
.sidebar-brand span { display: grid; gap: 2px; }
.sidebar-brand strong { font-size: 0.93rem; }
.sidebar-brand small { color: var(--ac-subtle); font-size: 0.67rem; }
.sidebar-user { display: grid; grid-template-columns: 48px minmax(0, 1fr) 30px; align-items: center; gap: 10px; margin: 4px 0 18px; padding: 13px; border: 1px solid var(--ac-border); border-radius: 15px; background: rgba(255, 255, 255, 0.025); }
.user-avatar,
.profile-avatar-large,
.toolbar-avatar { display: grid; place-items: center; overflow: hidden; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #7c3aed, #c026d3); font-weight: 900; }
.user-avatar { width: 48px; height: 48px; border: 2px solid rgba(196, 181, 253, 0.55); font-size: 0.86rem; }
.user-avatar img,
.profile-avatar-large img,
.toolbar-avatar img { width: 100%; height: 100%; object-fit: cover; }
.sidebar-user-copy { min-width: 0; display: grid; gap: 3px; }
.sidebar-user-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.8rem; }
.sidebar-user-copy small { overflow: hidden; color: var(--ac-subtle); font-size: 0.65rem; direction: ltr; text-overflow: ellipsis; white-space: nowrap; }
.profile-shortcut { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--ac-border); border-radius: 9px; color: var(--ac-muted) !important; background: transparent; cursor: pointer; }
.profile-shortcut:hover { color: #fff !important; border-color: rgba(139, 92, 246, 0.45); background: rgba(139, 92, 246, 0.12); }
.desktop-account-nav { display: grid; gap: 4px; }
.nav-caption { padding: 12px 11px 5px; color: #4f5d73; font-size: 0.61rem; font-weight: 900; }
.desktop-account-nav button { display: grid; grid-template-columns: 25px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 8px 11px; border: 1px solid transparent; border-radius: 11px; color: #9da9ba; background: transparent; text-align: right; font-size: 0.76rem; font-weight: 700; cursor: pointer; transition: 0.18s ease; }
.desktop-account-nav button > i { color: #68768b; text-align: center; }
.desktop-account-nav button b { min-width: 23px; padding: 2px 6px; border-radius: 999px; color: #7f8ba0; background: rgba(148, 163, 184, 0.08); font-size: 0.61rem; text-align: center; }
.desktop-account-nav button:hover { color: #e9edf4; background: rgba(148, 163, 184, 0.06); }
.desktop-account-nav button.active { color: #fff; border-color: rgba(139, 92, 246, 0.2); background: linear-gradient(100deg, rgba(124, 58, 237, 0.23), rgba(124, 58, 237, 0.05)); box-shadow: inset -3px 0 0 var(--ac-purple); }
.desktop-account-nav button.active > i { color: var(--ac-purple-light); }
.desktop-account-nav button.active b { color: #ddd6fe; background: rgba(139, 92, 246, 0.18); }
.sidebar-bottom { display: grid; gap: 5px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--ac-border); }
.sidebar-bottom a,
.sidebar-bottom button { display: flex; align-items: center; gap: 10px; min-height: 41px; padding: 9px 11px; border: 0; border-radius: 10px; color: var(--ac-muted); background: transparent; text-decoration: none; font-size: 0.73rem; font-weight: 700; cursor: pointer; }
.sidebar-bottom a:hover { color: #fff; background: rgba(148, 163, 184, 0.06); }
.sidebar-bottom button { color: #fda4af; }
.sidebar-bottom button:hover { background: rgba(244, 63, 94, 0.09); }

/* Main toolbar and content */
.account-main { min-width: 0; }
.account-toolbar { position: sticky; top: 0; z-index: 20; min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px clamp(20px, 4vw, 42px); border-bottom: 1px solid var(--ac-border); background: rgba(9, 11, 18, 0.82); backdrop-filter: blur(18px); }
.toolbar-title span { display: block; color: var(--ac-subtle); font-size: 0.64rem; }
.toolbar-title h1 { margin: 3px 0 0; font-size: 1.12rem; }
.toolbar-actions { display: flex; align-items: center; gap: 8px; }
.toolbar-create,
.toolbar-site { display: inline-flex; align-items: center; justify-content: center; min-height: 39px; border-radius: 10px; text-decoration: none; font-size: 0.73rem; font-weight: 800; }
.toolbar-create { gap: 7px; padding: 8px 12px; color: #fff; background: var(--ac-purple); }
.toolbar-site { width: 39px; color: var(--ac-muted); border: 1px solid var(--ac-border); background: var(--ac-surface); }
.toolbar-create:hover,
.toolbar-site:hover { color: #fff; filter: brightness(1.08); }
.toolbar-avatar,
.mobile-brand { display: none; }
.account-content { width: min(1220px, 100%); margin: 0 auto; padding: 30px clamp(20px, 4vw, 44px) 54px; }
.account-panel { display: none; animation: panelIn 0.2s ease; }
.account-panel.active { display: block; }
@keyframes panelIn { from { opacity: 0; transform: translateY(5px); } }

/* Buttons */
.primary-button,
.ghost-button,
.soft-button,
.danger-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 41px; padding: 9px 14px; border: 1px solid transparent; border-radius: 10px; text-decoration: none; font-size: 0.74rem; font-weight: 800; cursor: pointer; transition: 0.18s ease; }
.primary-button { color: #fff !important; background: linear-gradient(135deg, var(--ac-purple), #7c3aed); box-shadow: 0 9px 20px rgba(124, 58, 237, 0.18); }
.ghost-button { color: #dbe2ed !important; border-color: var(--ac-border); background: var(--ac-surface); }
.soft-button { color: #ddd6fe !important; border-color: rgba(139, 92, 246, 0.2); background: rgba(139, 92, 246, 0.11); }
.danger-button { color: #fecdd3 !important; border-color: rgba(251, 113, 133, 0.2); background: rgba(244, 63, 94, 0.1); }
.primary-button:hover,
.ghost-button:hover,
.soft-button:hover,
.danger-button:hover { transform: translateY(-1px); filter: brightness(1.08); }
.primary-button:disabled,
.ghost-button:disabled,
.soft-button:disabled,
.danger-button:disabled { opacity: 0.55; cursor: not-allowed; transform: none; }
.full-button { width: 100%; }

/* Overview */
.welcome-panel { position: relative; min-height: 230px; display: flex; align-items: center; justify-content: space-between; gap: 22px; overflow: hidden; padding: clamp(25px, 4vw, 42px); border: 1px solid rgba(139, 92, 246, 0.2); border-radius: 22px; background: linear-gradient(125deg, #241442, #171629 52%, #111827); box-shadow: var(--ac-shadow); }
.welcome-panel::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent 45%, rgba(139, 92, 246, 0.07)); }
.welcome-copy { position: relative; z-index: 2; max-width: 620px; }
.welcome-label { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 10px; color: #a7f3d0; font-size: 0.67rem; font-weight: 800; }
.welcome-label i { font-size: 0.6rem; }
.welcome-copy h2 { margin: 0; font-size: clamp(1.45rem, 3vw, 2.15rem); }
.welcome-copy p { max-width: 560px; margin: 10px 0 20px; color: #c1bcd3; font-size: 0.82rem; line-height: 1.9; }
.welcome-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.welcome-visual { position: relative; z-index: 1; width: 185px; height: 185px; flex: 0 0 auto; display: grid; place-items: center; color: #ddd6fe; font-size: 3.8rem; }
.visual-orbit { position: absolute; border: 1px solid rgba(196, 181, 253, 0.18); border-radius: 50%; }
.orbit-one { inset: 10px; }
.orbit-two { inset: 31px; border-style: dashed; transform: rotate(24deg); }
.welcome-visual::before { content: ""; position: absolute; inset: 50px; border-radius: 50%; background: rgba(139, 92, 246, 0.2); filter: blur(2px); }
.welcome-visual i { position: relative; filter: drop-shadow(0 15px 25px rgba(139, 92, 246, 0.4)); }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin: 16px 0; }
.stat-card { display: grid; grid-template-columns: 43px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 125px; padding: 17px; border: 1px solid var(--ac-border); border-radius: 16px; background: var(--ac-surface); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12); }
.stat-icon { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 12px; }
.stat-card div { min-width: 0; }
.stat-card small,
.stat-card em { display: block; color: var(--ac-muted); font-size: 0.65rem; font-style: normal; }
.stat-card strong { display: block; margin: 5px 0 2px; font-size: 1.45rem; line-height: 1; }
.stat-purple .stat-icon { color: #c4b5fd; background: rgba(139, 92, 246, 0.13); }
.stat-amber .stat-icon { color: #fde68a; background: rgba(251, 191, 36, 0.12); }
.stat-blue .stat-icon { color: #7dd3fc; background: rgba(56, 189, 248, 0.12); }
.stat-green .stat-icon { color: #86efac; background: rgba(52, 211, 153, 0.12); }
.overview-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.75fr); gap: 16px; }
.surface-card { border: 1px solid var(--ac-border); border-radius: 18px; background: var(--ac-surface); box-shadow: 0 12px 34px rgba(0, 0, 0, 0.14); }
.card-heading { min-height: 73px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 18px; border-bottom: 1px solid var(--ac-border); }
.card-heading > div { display: flex; align-items: center; gap: 10px; }
.heading-icon { display: grid; place-items: center; width: 37px; height: 37px; flex: 0 0 auto; border-radius: 10px; color: var(--ac-purple-light); background: rgba(139, 92, 246, 0.12); }
.card-heading h3 { margin: 0; font-size: 0.84rem; }
.card-heading p { margin: 4px 0 0; color: var(--ac-muted); font-size: 0.65rem; }
.card-heading > button { border: 0; color: var(--ac-purple-light); background: transparent; font-size: 0.68rem; font-weight: 800; cursor: pointer; }
.activity-list,
.post-list,
.session-list { display: grid; }
.activity-row,
.session-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 11px; min-height: 66px; padding: 12px 18px; border-bottom: 1px solid rgba(148, 163, 184, 0.08); }
.activity-row:last-child,
.session-row:last-child { border-bottom: 0; }
.activity-row > i,
.session-row > i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; color: var(--ac-purple-light); background: rgba(139, 92, 246, 0.1); }
.activity-row strong,
.session-row strong { display: block; overflow: hidden; color: #e9edf4; text-overflow: ellipsis; white-space: nowrap; font-size: 0.73rem; }
.activity-row small,
.session-row small { color: var(--ac-muted); font-size: 0.62rem; }
.status-pill { display: inline-flex; width: max-content; padding: 4px 8px; border-radius: 999px; font-size: 0.6rem; font-weight: 900; }
.status-approved { color: #86efac; background: rgba(52, 211, 153, 0.11); }
.status-pending { color: #fde68a; background: rgba(251, 191, 36, 0.11); }
.status-rejected { color: #fda4af; background: rgba(251, 113, 133, 0.11); }
.quick-grid { display: grid; padding: 8px; }
.quick-grid a,
.quick-grid button { display: grid; grid-template-columns: 39px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; min-height: 63px; padding: 10px; border: 0; border-radius: 11px; color: #dbe2ed; background: transparent; text-align: right; text-decoration: none; cursor: pointer; }
.quick-grid a:hover,
.quick-grid button:hover { background: rgba(148, 163, 184, 0.06); }
.quick-grid > * > span { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 11px; color: var(--ac-purple-light); background: rgba(139, 92, 246, 0.1); }
.quick-grid div { display: grid; gap: 3px; }
.quick-grid strong { font-size: 0.72rem; }
.quick-grid small { color: var(--ac-muted); font-size: 0.61rem; }
.quick-grid > * > i { color: #566278; font-size: 0.65rem; }

/* Inner sections */
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.section-kicker { display: block; margin-bottom: 5px; color: var(--ac-purple-light); font-size: 0.65rem; font-weight: 900; }
.section-heading h2 { margin: 0; font-size: clamp(1.35rem, 2.5vw, 1.8rem); }
.section-heading p { margin: 7px 0 0; color: var(--ac-muted); font-size: 0.76rem; }
.list-surface { overflow: hidden; }
.post-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 15px; padding: 18px 20px; border-bottom: 1px solid rgba(148, 163, 184, 0.08); }
.post-item:last-child { border-bottom: 0; }
.post-item h3 { margin: 0; color: #edf1f7; font-size: 0.82rem; }
.post-item p { margin: 6px 0 0; color: var(--ac-muted); font-size: 0.68rem; }
.post-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 11px; color: #718096; font-size: 0.62rem; }
.post-meta i { color: var(--ac-purple-light); }
.post-item-side { display: flex; }
.favorite-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.favorite-card { overflow: hidden; border: 1px solid var(--ac-border); border-radius: 16px; background: var(--ac-surface); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.13); transition: 0.18s ease; }
.favorite-card:hover { transform: translateY(-3px); border-color: rgba(139, 92, 246, 0.3); }
.favorite-image { height: 140px; overflow: hidden; background: #0d111b; }
.favorite-image img { width: 100%; height: 100%; object-fit: cover; }
.favorite-copy { padding: 14px; }
.favorite-copy strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.78rem; }
.favorite-copy small { display: block; margin-top: 5px; color: var(--ac-muted); font-size: 0.63rem; }
.favorite-actions { display: flex; gap: 8px; margin-top: 13px; }
.favorite-actions a,
.favorite-actions button { flex: 1; min-height: 35px; padding: 7px 9px; font-size: 0.65rem; }
.favorite-actions .secondary-action { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--ac-border); border-radius: 9px; color: #e2e8f0; background: var(--ac-surface-soft); text-decoration: none; }
.favorite-actions .danger-action { border: 1px solid rgba(251, 113, 133, 0.18); border-radius: 9px; color: #fda4af; background: rgba(244, 63, 94, 0.09); cursor: pointer; }
.empty-account { padding: 52px 20px; color: var(--ac-muted); text-align: center; font-size: 0.75rem; }
.empty-account i { display: block; margin-bottom: 12px; color: #655b80; font-size: 2rem; }

/* Profile and forms */
.profile-grid { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 16px; }
.avatar-card { padding: 27px 20px; text-align: center; }
.profile-avatar-large { width: 112px; height: 112px; margin: 0 auto 16px; border: 3px solid rgba(196, 181, 253, 0.6); box-shadow: 0 0 0 7px rgba(139, 92, 246, 0.09); font-size: 1.8rem; }
.avatar-card h3 { margin: 0; font-size: 0.9rem; }
.avatar-card > span { display: block; margin-top: 5px; color: var(--ac-subtle); font-size: 0.66rem; direction: ltr; }
.avatar-card p { margin: 17px 0; color: var(--ac-muted); font-size: 0.65rem; line-height: 1.8; }
.default-avatar-picker { margin: 18px 0; padding: 12px; border: 1px solid rgba(139, 92, 246, 0.22); border-radius: 13px; background: rgba(139, 92, 246, 0.055); text-align: right; }
.default-avatar-heading { display: grid; gap: 3px; margin-bottom: 10px; }
.default-avatar-heading strong { color: #e9ddff; font-size: 0.68rem; }
.default-avatar-heading strong i { margin-left: 5px; color: var(--ac-purple-light); }
.default-avatar-heading small { color: var(--ac-subtle); font-size: 0.58rem; }
.default-avatar-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.default-avatar-option { position: relative; display: grid; place-items: center; aspect-ratio: 1; padding: 3px; border: 1px solid rgba(148, 163, 184, 0.18); border-radius: 10px; color: #cbd5e1; background: #0b0f18; cursor: pointer; transition: 0.18s ease; }
.default-avatar-option:hover { border-color: rgba(196, 181, 253, 0.66); background: rgba(139, 92, 246, 0.13); transform: translateY(-1px); }
.default-avatar-option.active { border-color: var(--ac-purple-light); box-shadow: 0 0 0 2px rgba(139, 92, 246, 0.24); }
.default-avatar-option.active::after { content: "✓"; position: absolute; bottom: -4px; left: -4px; display: grid; place-items: center; width: 17px; height: 17px; border: 2px solid var(--ac-surface); border-radius: 50%; color: #fff; background: var(--ac-green); font-size: 0.6rem; font-weight: 900; }
.default-avatar-option img { width: 100%; height: 100%; border-radius: 7px; object-fit: cover; }
.default-avatar-option:focus-visible { outline: 2px solid #f8fafc; outline-offset: 2px; }
.avatar-buttons { display: flex; justify-content: center; gap: 8px; }
.avatar-buttons label { cursor: pointer; }
.profile-form,
.password-card { display: grid; align-content: start; gap: 17px; padding: 22px; }
.form-heading { display: flex; align-items: center; gap: 11px; padding-bottom: 17px; border-bottom: 1px solid var(--ac-border); }
.form-heading > span { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto; border-radius: 11px; color: var(--ac-purple-light); background: rgba(139, 92, 246, 0.11); }
.form-heading h3 { margin: 0; font-size: 0.85rem; }
.form-heading p { margin: 4px 0 0; color: var(--ac-muted); font-size: 0.64rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field-group { display: grid; gap: 7px; }
.field-group label { color: #dce3ec; font-size: 0.7rem; font-weight: 800; }
.field-group input,
.field-group textarea { width: 100%; padding: 11px 12px; border: 1px solid var(--ac-border-strong); border-radius: 10px; outline: 0; color: #f1f5f9; background: #0b0f18; font-size: 0.75rem; transition: 0.16s ease; }
.field-group input:focus,
.field-group textarea:focus { border-color: rgba(139, 92, 246, 0.7); box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1); }
.field-group input:disabled { color: #7f8ba0; background: rgba(11, 15, 24, 0.6); }
.field-group textarea { min-height: 130px; resize: vertical; line-height: 1.8; }
.field-group small { color: var(--ac-subtle); font-size: 0.61rem; }
.form-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 3px; }
.form-feedback { min-height: 18px; color: var(--ac-muted); font-size: 0.66rem; }
.form-feedback.error { color: var(--ac-red); }
.form-feedback.success { color: var(--ac-green); }
.security-grid { display: grid; grid-template-columns: minmax(300px, 0.78fr) minmax(0, 1.22fr); gap: 16px; }
.password-card .field-group input { min-height: 43px; }
.sessions-card { overflow: hidden; }
.danger-text-button { border: 0; color: #fda4af !important; background: transparent; font-size: 0.65rem; font-weight: 800; cursor: pointer; }
.session-row > i { color: #7dd3fc; background: rgba(56, 189, 248, 0.1); }
.session-current { color: #86efac; font-size: 0.61rem; font-weight: 900; }

/* Toast */
.account-toast { position: fixed; z-index: 100; left: 20px; bottom: 20px; max-width: min(380px, calc(100vw - 40px)); padding: 12px 16px; border: 1px solid rgba(52, 211, 153, 0.25); border-radius: 11px; color: #d1fae5; background: #102d27; box-shadow: 0 15px 40px rgba(0, 0, 0, 0.35); font-size: 0.73rem; opacity: 0; transform: translateY(15px); pointer-events: none; transition: 0.2s ease; }
.account-toast.show { opacity: 1; transform: translateY(0); }
.account-toast.error { color: #ffe4e6; border-color: rgba(251, 113, 133, 0.25); background: #3b1722; }
.mobile-account-nav { display: none; }

/* Tablet and mobile */
@media (max-width: 980px) {
    .account-app { display: block; }
    .account-sidebar { display: none; }
    .account-toolbar { min-height: 66px; padding: 9px 14px; }
    .toolbar-title { display: none; }
    .mobile-brand { display: flex; align-items: center; gap: 9px; }
    .mobile-brand > a { display: block; }
    .mobile-brand img { width: 38px; height: 38px; border-radius: 11px; object-fit: cover; }
    .mobile-brand div { display: grid; gap: 2px; }
    .mobile-brand strong { max-width: 145px; overflow: hidden; font-size: 0.78rem; text-overflow: ellipsis; white-space: nowrap; }
    .mobile-brand small { color: var(--ac-subtle); font-size: 0.58rem; }
    .toolbar-create { width: 38px; padding: 0; }
    .toolbar-create span,
    .toolbar-site { display: none; }
    .toolbar-avatar { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 2px solid rgba(196, 181, 253, 0.48); font-size: 0.68rem; cursor: pointer; }
    .account-content { padding: 18px 14px calc(94px + env(safe-area-inset-bottom)); }
    .overview-grid,
    .profile-grid,
    .security-grid { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mobile-account-nav { position: fixed; right: 10px; bottom: calc(8px + env(safe-area-inset-bottom)); left: 10px; z-index: 50; display: grid; grid-template-columns: repeat(5, 1fr); min-height: 67px; padding: 7px 6px; border: 1px solid rgba(148, 163, 184, 0.18); border-radius: 17px; background: rgba(13, 16, 25, 0.94); box-shadow: 0 18px 50px rgba(0, 0, 0, 0.48); backdrop-filter: blur(18px); }
    .mobile-account-nav button { position: relative; display: grid; place-items: center; align-content: center; gap: 5px; min-width: 0; border: 0; border-radius: 11px; color: #778399; background: transparent; font-size: 0.56rem; font-weight: 800; cursor: pointer; }
    .mobile-account-nav button i { font-size: 1rem; }
    .mobile-account-nav button.active { color: #e9ddff; background: rgba(139, 92, 246, 0.14); }
    .mobile-account-nav button.active::before { content: ""; position: absolute; top: -7px; width: 22px; height: 3px; border-radius: 999px; background: var(--ac-purple); }
    .account-toast { bottom: calc(88px + env(safe-area-inset-bottom)); }
}

@media (max-width: 640px) {
    .account-loading,
    .account-error { min-height: 320px; margin-top: 7vh; padding: 28px 20px; }
    .welcome-panel { min-height: 225px; padding: 23px 19px; }
    .welcome-visual { width: 92px; height: 92px; margin-left: -18px; font-size: 2.1rem; opacity: 0.65; }
    .orbit-one { inset: 2px; }
    .orbit-two { inset: 17px; }
    .welcome-visual::before { inset: 28px; }
    .welcome-copy p { max-width: 300px; font-size: 0.73rem; }
    .welcome-actions { position: relative; z-index: 3; }
    .stats-grid { gap: 9px; margin: 11px 0; }
    .stat-card { grid-template-columns: 36px minmax(0, 1fr); gap: 9px; min-height: 102px; padding: 12px; border-radius: 13px; }
    .stat-icon { width: 36px; height: 36px; border-radius: 10px; }
    .stat-card strong { font-size: 1.2rem; }
    .stat-card em { display: none; }
    .card-heading { padding: 13px; }
    .card-heading p { display: none; }
    .section-heading { align-items: flex-start; flex-direction: column; gap: 13px; margin-bottom: 17px; }
    .section-heading p { max-width: 340px; line-height: 1.75; }
    .post-item { grid-template-columns: 1fr; padding: 15px; }
    .post-item-side { justify-content: flex-start; }
    .favorite-grid { grid-template-columns: 1fr; }
    .favorite-image { height: 155px; }
    .form-row { grid-template-columns: 1fr; }
    .profile-form,
    .password-card { padding: 17px; }
    .form-footer { align-items: stretch; flex-direction: column; }
    .form-footer .primary-button { width: 100%; }
    .sessions-card .card-heading { align-items: flex-start; flex-direction: column; }
    .activity-row,
    .session-row { padding: 11px 13px; }
    .error-actions { flex-direction: column; }
    .error-actions > * { width: 100%; }
}

@media (max-width: 390px) {
    .account-content { padding-right: 10px; padding-left: 10px; }
    .welcome-panel { padding: 21px 16px; }
    .welcome-visual { display: none; }
    .welcome-actions > * { flex: 1; padding-right: 10px; padding-left: 10px; }
    .stat-card { grid-template-columns: 1fr; align-content: center; }
    .stat-icon { width: 32px; height: 32px; }
    .mobile-account-nav { right: 6px; left: 6px; }
    .mobile-account-nav button span { font-size: 0.52rem; }
}

@media (prefers-reduced-motion: reduce) {
    .account-panel,
    .loading-line span { animation: none; }
    .primary-button,
    .ghost-button,
    .soft-button,
    .favorite-card { transition: none; }
}