/* Reference-matched HolyJournal interface. Loaded after the legacy stylesheet. */
:root,
html[data-theme],
html[data-theme][data-accent] {
    color-scheme: dark;
    --bg: #08070c !important;
    --bg-2: #0d0c11 !important;
    --surface: #111015 !important;
    --surface-2: #1c1b20 !important;
    --surface-3: #26252a !important;
    --border: #302e35 !important;
    --border-soft: #242329 !important;
    --text: #f1f0f2 !important;
    --muted: #908e96 !important;
    --accent: #e9e8eb !important;
    --accent-2: #ffffff !important;
    --accent-soft: rgba(255,255,255,.08) !important;
    --accent-glow: rgba(255,255,255,.08) !important;
    --accent-ink: #111014 !important;
    --green: #35bf70 !important;
    --red: #df4d60 !important;
    --orange: var(--accent) !important;
    --sidebar-w: 220px !important;
    --radius: 7px !important;
    --radius-sm: 5px !important;
    --shadow: none !important;
    --shadow-lg: 0 18px 50px rgba(0,0,0,.55) !important;
}

* { letter-spacing: 0 !important; }
html { background: var(--bg) !important; }
body {
    min-width: 320px;
    color: var(--text) !important;
    background: var(--bg) !important;
    font-family: "Onest", "Segoe UI", system-ui, sans-serif !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}
body::before { display: none !important; }
h1,h2,h3 { color: var(--text) !important; font-family: inherit !important; text-shadow: none !important; }
h1 { font-size: 28px !important; line-height: 1.08 !important; font-weight: 800 !important; }
h2 { font-size: 15px !important; line-height: 1.2 !important; font-weight: 750 !important; }
h3 { font-size: 13px !important; font-weight: 700 !important; }
a { color: #d7d6dc !important; }
.muted,small { color: var(--muted) !important; }
.green { color: var(--green) !important; }
.red { color: var(--red) !important; }
.orange { color: var(--orange) !important; }

/* Compact shell matching the reference. */
.layout { min-height: 100vh !important; background: var(--bg) !important; }
.sidebar {
    width: var(--sidebar-w) !important;
    padding: 0 6px 7px !important;
    gap: 0 !important;
    background: #1a191e !important;
    border-right: 1px solid #343239 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    scrollbar-width: thin;
    scrollbar-color: #55535a transparent;
}
.sidebar-logo {
    min-height: 42px !important;
    margin: 0 0 3px !important;
    padding: 5px 2px !important;
    gap: 0 !important;
    border: 0 !important;
}
.sidebar-logo .logo-mark { display: none !important; }
.logo-text { color:#f3f2f4 !important; font-size:13px !important; line-height:1 !important; font-weight:800 !important; white-space:nowrap; }
.logo-text .beta { display:inline !important; color:#c4c2c8 !important; font-size:10px !important; }
.nav-group { margin: 0 0 8px !important; padding: 0 !important; border:0 !important; background:transparent !important; }
.nav-group-title {
    padding: 5px 2px 3px !important;
    color:#e1e0e3 !important;
    font-size:13px !important;
    line-height:1.1 !important;
    font-weight:800 !important;
    text-transform:none !important;
}
.nav-item {
    min-height: 34px !important;
    margin: 0 !important;
    padding: 7px 9px !important;
    gap: 9px !important;
    border:0 !important;
    border-radius:5px !important;
    color:#d4d2d7 !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:12px !important;
    line-height:1.2 !important;
    font-weight:550 !important;
    transform:none !important;
}
.nav-item:hover { color:#fff !important; background:#35343a !important; opacity:1 !important; }
.nav-item.active { color:#fff !important; background:#5b5a60 !important; }
.nav-item.active::before { display:none !important; }
.nav-item .ico {
    width:18px !important;
    height:18px !important;
    flex:0 0 18px !important;
    border:0 !important;
    border-radius:0 !important;
    color:#c5c3c9 !important;
    background:transparent !important;
    box-shadow:none !important;
}
.nav-item .ico::before { width:17px !important; height:17px !important; }
.nav-group-symbol { display:inline-grid; place-items:center; width:16px; margin-right:4px; color:#d8d6dc; font-size:13px; font-weight:700; }
.nav-item .badge-count,.badge-count {
    min-width:21px !important;
    height:18px !important;
    margin-left:auto !important;
    padding:1px 5px !important;
    border:0 !important;
    border-radius:999px !important;
    color:#151419 !important;
    background:#d7d6da !important;
    font-size:9px !important;
    line-height:16px !important;
    text-align:center;
}
.sidebar-actions {
    display:grid !important;
    gap:5px !important;
    margin:auto 0 6px !important;
    padding-top:7px !important;
}
.sidebar-actions .sidebar-cta {
    width:100% !important;
    min-height:27px !important;
    margin:0 !important;
    padding:5px 7px !important;
    border:1px solid #45434a !important;
    border-radius:5px !important;
    color:#ecebed !important;
    background:#1c1b20 !important;
    box-shadow:0 0 0 3px rgba(255,255,255,.025) !important;
    font-size:9px !important;
    font-weight:650 !important;
}
.sidebar-actions .sidebar-cta:hover { border-color:#69676e !important; background:#28272c !important; }
.sidebar-actions a.sidebar-cta { display:flex; align-items:center; justify-content:center; text-decoration:none; box-sizing:border-box; }
.sidebar-actions .sidebar-role-grant { border-color:rgba(76,175,113,.45) !important; color:#b9f5ca !important; }
.sidebar-actions .sidebar-role-grant.active { background:rgba(76,175,113,.16) !important; border-color:#4caf71 !important; }
.sidebar-profile {
    min-height:36px !important;
    margin:0 !important;
    padding:4px 2px !important;
    gap:6px !important;
    border:0 !important;
    border-top:1px solid #29282d !important;
    border-radius:0 !important;
    color:#fff !important;
    background:transparent !important;
    box-shadow:none !important;
}
.sidebar-profile .avatar { width:22px !important; height:22px !important; flex:0 0 22px !important; border:0 !important; border-radius:5px !important; color:#eee !important; background:#323137 !important; box-shadow:none !important; font-size:9px !important; }
.sidebar-profile .who b { font-size:9px !important; line-height:1.1 !important; }
.sidebar-profile .who small { font-size:8px !important; color:#a8a6ad !important; }
.sidebar-backdrop { display:none; }

.main-area { margin-left:var(--sidebar-w) !important; min-width:0 !important; background:var(--bg) !important; }
.topbar {
    position:fixed !important;
    inset:0 auto auto var(--sidebar-w) !important;
    width:30px !important;
    min-height:30px !important;
    height:30px !important;
    padding:3px !important;
    border:0 !important;
    background:transparent !important;
    backdrop-filter:none !important;
    box-shadow:none !important;
    z-index:60 !important;
    pointer-events:none;
}
.topbar-leading { display:block !important; }
.topbar-title { display:none !important; }
.hamburger {
    display:grid !important;
    width:25px !important;
    height:25px !important;
    min-height:25px !important;
    padding:0 !important;
    border:0 !important;
    border-radius:4px !important;
    color:#d9d8dc !important;
    background:transparent !important;
    pointer-events:auto;
}
.hamburger:hover { background:#242328 !important; }
.hamburger .top-icon { width:14px !important; height:14px !important; }
.hamburger .top-icon::before { width:13px !important; height:13px !important; }
.topbar-actions { display:block !important; pointer-events:auto; }
.topbar-action-btn {
    position:fixed !important;
    top:3px !important;
    width:27px !important;
    height:27px !important;
    min-height:27px !important;
    padding:0 !important;
    border:1px solid #3a383f !important;
    border-radius:5px !important;
    color:#c8c6cc !important;
    background:#212025 !important;
    box-shadow:none !important;
    font-size:0 !important;
    justify-content:center !important;
}
.notif-bell { left:160px !important; }
.password-action { left:190px !important; }
.topbar-actions > form { position:fixed !important; left:190px !important; bottom:7px !important; z-index:62 !important; }
.topbar-actions > form .topbar-action-btn { position:static !important; color:#b8b6bd !important; }
.topbar-action-label,.notif-bell > span:not(.top-icon):not(.notif-dot) { display:none !important; }
.topbar-action-btn .top-icon { display:inline-block !important; width:14px !important; height:14px !important; }
.topbar-action-btn .top-icon::before { width:13px !important; height:13px !important; }
.top-icon-lock { --icon-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 10V7a5 5 0 0 1 10 0v3h2v12H5V10h2Zm2 0h6V7a3 3 0 0 0-6 0v3Zm-2 2v8h10v-8H7Z'/%3E%3C/svg%3E"); }
.top-icon-logout { --icon-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 3h10v2H6v14h8v2H4V3Zm12.6 4.6L21 12l-4.4 4.4-1.4-1.4 2-2H10v-2h7.2l-2-2 1.4-1.4Z'/%3E%3C/svg%3E"); }
.notif-dot { position:absolute !important; right:-3px !important; top:-3px !important; min-width:13px !important; height:13px !important; padding:0 3px !important; border-radius:999px !important; color:#fff !important; background:#c34658 !important; font-size:7px !important; line-height:13px !important; animation:none !important; }
.topbar-action-btn::before,.topbar-action-btn::after { display:none !important; content:none !important; }

.content {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:28px 18px 36px 46px !important;
}
.content > *,.auth-card { animation:none !important; }
.page-head { margin:0 0 16px !important; padding:0 !important; border:0 !important; }
.page-head h1 { margin:0 0 5px !important; }
.page-head p { max-width:800px !important; }

/* Reference surfaces and controls. */
.card,.tile,.auth-card,.modal,.table-wrap,.tabs,.shop-item,.manual-card,.notif-item,.wallet-panel,.mode-section {
    border:1px solid var(--border) !important;
    border-radius:7px !important;
    color:var(--text) !important;
    background:#101015 !important;
    box-shadow:none !important;
}
.card { padding:14px !important; }
.card h2 { margin-bottom:10px !important; }
.card:hover,.tile:hover,.shop-item:hover,.manual-card:hover { border-color:#48464e !important; background:#121117 !important; box-shadow:none !important; transform:none !important; }
.tile { min-height:70px !important; padding:12px !important; }
.tile .label { margin-bottom:5px !important; color:#85838b !important; font-size:9px !important; font-weight:600 !important; }
.tile .value { color:#f0eff1 !important; font-family:inherit !important; font-size:22px !important; line-height:1.05 !important; font-weight:800 !important; }
.tile .sub { margin-top:4px !important; color:#8c8a92 !important; font-size:9px !important; }
.grid { gap:8px !important; }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
.grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
.grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)) !important; }

input,select,textarea,.manual-rich-editor {
    min-height:32px !important;
    padding:7px 9px !important;
    border:1px solid #333139 !important;
    border-radius:5px !important;
    color:#dfdee2 !important;
    background:#17161b !important;
    box-shadow:none !important;
    font-family:inherit !important;
    font-size:10px !important;
    transform:none !important;
}
textarea { min-height:65px !important; }
input:focus,select:focus,textarea:focus,.manual-rich-editor:focus { border-color:#1599f6 !important; box-shadow:0 0 0 2px rgba(21,153,246,.24) !important; outline:0 !important; }
input::placeholder,textarea::placeholder { color:#6f6d75 !important; }
.form { gap:10px !important; }
.form label,.field-row label,.role-map label,.stat-form label { gap:4px !important; color:#c6c4ca !important; font-size:10px !important; font-weight:650 !important; }
.field-row { gap:8px !important; }
.btn {
    min-height:31px !important;
    padding:7px 11px !important;
    border:1px solid #3a383f !important;
    border-radius:5px !important;
    color:#e6e5e8 !important;
    background:#201f24 !important;
    box-shadow:none !important;
    font-family:inherit !important;
    font-size:10px !important;
    line-height:1.1 !important;
    font-weight:700 !important;
    transform:none !important;
}
.btn-sm { min-height:27px !important; padding:5px 9px !important; }
.btn:hover { color:#fff !important; background:#2b2a30 !important; border-color:#56545c !important; filter:none !important; }
.btn-primary { color:#121116 !important; background:#e6e5e8 !important; border-color:#efeff1 !important; }
.btn-primary:hover { color:#08080a !important; background:#fff !important; border-color:#fff !important; }
.btn-danger { color:#e47b89 !important; background:rgba(223,77,96,.09) !important; border-color:rgba(223,77,96,.32) !important; }
.btn::after,.sidebar-cta::after,.tab::after,.chip::after { display:none !important; }
.btn:disabled,button:disabled { opacity:.45 !important; cursor:not-allowed !important; }

.table-wrap { overflow:auto !important; background:#0d0c11 !important; scrollbar-width:thin; scrollbar-color:#55535a #111015; }
table { width:100%; border-collapse:collapse; }
th,td { height:31px !important; padding:6px 9px !important; border-bottom:1px solid #242329 !important; color:#d7d5da !important; font-size:9px !important; white-space:nowrap; }
th { color:#8e8c94 !important; background:#111015 !important; font-size:8px !important; font-weight:700 !important; text-transform:uppercase; }
tbody tr:hover { background:rgba(255,255,255,.025) !important; }
tbody tr:last-child td { border-bottom:0 !important; }
.empty { padding:26px 14px !important; border:0 !important; border-radius:5px !important; color:#85838b !important; background:transparent !important; text-align:center; }

.badge { min-height:20px !important; padding:3px 7px !important; border:1px solid #37353c !important; border-radius:999px !important; color:#d1cfd5 !important; background:#222126 !important; box-shadow:none !important; font-size:8px !important; }
.badge-admin { color:#17161a !important; background:#e2e1e5 !important; border-color:#eeeef0 !important; }
.badge-role { color:#d8d6dc !important; background:#25242a !important; }
.badge-green { color:#50d184 !important; background:rgba(53,191,112,.12) !important; border-color:rgba(53,191,112,.3) !important; }
.badge-red { color:#ec6d7d !important; background:rgba(223,77,96,.12) !important; border-color:rgba(223,77,96,.3) !important; }
.badge-orange { color:var(--accent-hi) !important; background:rgba(var(--accent-rgb),.12) !important; border-color:rgba(var(--accent-rgb),.3) !important; }
.info-plate,.warn-plate,.flash { padding:8px 10px !important; border:1px solid #302e35 !important; border-radius:5px !important; color:#aaa8af !important; background:#111015 !important; font-size:9px !important; box-shadow:none !important; }
.flash-success { color:#79dba2 !important; border-color:rgba(53,191,112,.35) !important; }
.flash-error,.warn-plate { color:#e68592 !important; border-color:rgba(223,77,96,.35) !important; }

.tabs { gap:2px !important; margin-bottom:12px !important; padding:3px !important; overflow-x:auto; flex-wrap:nowrap !important; background:#0e0d12 !important; }
.tab { min-height:27px !important; flex:0 0 auto; padding:5px 8px !important; border:0 !important; border-radius:4px !important; color:#9c9aa2 !important; background:transparent !important; font-size:9px !important; font-weight:650 !important; transform:none !important; }
.tab:hover { color:#fff !important; background:#222126 !important; }
.tab.active { color:#111015 !important; background:#dedde1 !important; }
.tab.active::before,.tab.active::after { display:none !important; }
.tab.active .badge-count { color:#111 !important; background:#bbb9bf !important; }
.chips { gap:6px !important; margin-bottom:12px !important; justify-content:flex-end; }
.chip { min-height:28px; padding:6px 10px !important; border:1px solid #302e35 !important; border-radius:5px !important; color:#d2d0d6 !important; background:#17161b !important; font-size:9px !important; font-weight:650 !important; transform:none !important; }
.chip:hover,.chip.active { color:#111 !important; background:#e5e4e7 !important; border-color:#ededee !important; }

/* Main page: exact asymmetric dashboard from the references. */
.page-main .content {
    display:grid !important;
    grid-template-columns:350px minmax(0,1fr) !important;
    grid-template-rows:130px auto auto !important;
    gap:8px !important;
    padding-top:28px !important;
}
.page-main .page-head { grid-column:1 !important; grid-row:1 !important; align-self:center; margin:0 !important; text-align:center !important; }
.page-main .page-head h1 { font-size:13px !important; font-weight:500 !important; }
.page-main .page-head h1::first-line { font-size:13px !important; }
.page-main .page-head p { margin-top:4px !important; }
.page-main .page-head h1 { color:#d0ced4 !important; }
.page-main .grid-4 { grid-column:1 !important; grid-row:2 !important; display:grid !important; grid-template-columns:1fr !important; gap:6px !important; margin:0 !important; }
.page-main .grid-4 .tile { min-height:46px !important; padding:7px 42px !important; position:relative; text-align:left !important; align-items:start !important; justify-content:center !important; background-color:#111015 !important; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) !important; background-size:18px 18px !important; }
.page-main .grid-4 .tile::before { display:block !important; content:"" !important; position:absolute !important; left:10px !important; top:10px !important; width:24px !important; height:24px !important; border-radius:6px !important; background:rgba(255,255,255,.08) !important; }
.page-main .grid-4 .tile .label { margin:0 !important; font-size:7px !important; text-transform:uppercase; }
.page-main .grid-4 .tile .value { font-size:10px !important; line-height:1.2 !important; }
.page-main .grid-4 .tile .sub { margin:0 !important; }
.page-main .content > .grid-2:nth-of-type(2) { grid-column:2 !important; grid-row:1 !important; align-self:stretch; display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; margin:0 !important; }
.page-main .content > .grid-2:nth-of-type(2) .tile { min-height:130px !important; padding:18px !important; background-color:#111015 !important; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) !important; background-size:18px 18px !important; }
.page-main .content > .grid-2:nth-of-type(2) .tile .label { color:#ecebef !important; font-size:15px !important; text-transform:none !important; }
.page-main .content > .grid-2:nth-of-type(2) .tile .value { margin-top:12px; font-size:34px !important; }
.page-main .content > .grid-2:last-child { display:contents !important; }
.page-main .content > .grid-2:last-child > .card:first-child { grid-column:1 !important; grid-row:3 !important; min-height:300px !important; background-color:#111015 !important; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) !important; background-size:18px 18px !important; }
.page-main .content > .grid-2:last-child > .card:last-child { grid-column:2 !important; grid-row:2 / span 2 !important; min-height:318px !important; display:flex; flex-direction:column; }
.page-main .content > .grid-2:last-child > .card:last-child .empty { flex:1; display:grid; place-items:center; }

/* Account dashboard: three compact reference columns. */
.page-account .content { padding-top:26px !important; }
.page-account .page-head { display:none !important; }
.page-account .content > .info-plate { width:280px !important; margin:0 0 7px !important; }
.page-account .account-layout { display:grid !important; grid-template-columns:280px 280px minmax(320px,1fr) !important; gap:7px !important; align-items:start !important; }
.page-account .account-column { display:contents !important; }
.page-account .account-column-main > .card:first-child { grid-column:1 !important; grid-row:1 !important; min-height:255px !important; }
.page-account .account-top-card { grid-column:2 !important; grid-row:1 !important; min-height:255px !important; }
.page-account .account-progress-card { grid-column:1 !important; grid-row:2 !important; }
.page-account .account-column-main > .card:last-child { grid-column:3 !important; grid-row:1 !important; min-height:255px !important; }
.page-account .account-column-side > .card:first-child { grid-column:2 !important; grid-row:2 !important; }
.page-account .account-column-side > .card:nth-child(2) { grid-column:3 !important; grid-row:2 !important; }
.page-account .account-column-side > .card:nth-child(3) { grid-column:2 !important; grid-row:3 !important; }
.page-account .account-column-side > .card:nth-child(4) { grid-column:3 !important; grid-row:3 !important; }
.page-account .card { padding:12px !important; }
.page-account .account-column-main > .card:first-child h1 { font-size:22px !important; }
.page-account .dl .row { min-height:25px !important; padding:4px 0 !important; border-bottom:1px solid #232228 !important; font-size:9px !important; }
.page-account .circles { display:grid !important; grid-template-columns:1fr !important; gap:6px !important; }
.page-account .circle-widget { min-height:70px !important; }
.page-account .circle-widget svg { width:62px !important; height:62px !important; }
.page-account .norm-calendar { grid-template-columns:repeat(7,minmax(0,1fr)) !important; gap:4px !important; }
.page-account .norm-day { min-height:31px !important; padding:3px !important; border-radius:5px !important; }
.page-account .norm-day small { display:none !important; }
.page-account .field-row { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }

/* Wallet: large centered number and two actions. */
.page-wallet .content { max-width:565px !important; margin:0 auto !important; padding:58px 0 30px !important; text-align:center !important; }
.page-wallet .wallet-head { margin-bottom:8px !important; }
.page-wallet .wallet-head h1 { font-size:34px !important; }
.wallet-balance { display:grid; justify-items:center; margin-bottom:24px; }
.wallet-balance strong { color:#f3f2f4; font-size:86px; line-height:.95; font-weight:850; }
.wallet-balance span { margin-top:5px; color:#727079; font-size:9px; }
.wallet-actions { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px !important; margin-bottom:10px !important; }
.wallet-action-card { min-height:132px !important; padding:0 !important; overflow:hidden; color:#99979f !important; background:#201f24 !important; }
button.wallet-action-card,.wallet-action-submit { width:100%; border:0; color:inherit; background:transparent; font:inherit; cursor:pointer; }
button.wallet-action-card { display:grid; place-items:center; align-content:center; gap:12px; }
.wallet-action-submit { height:132px; display:grid; place-items:center; align-content:center; gap:12px; }
.wallet-action-card b { font-size:10px; font-weight:500; }
.wallet-action-glyph { display:block; width:50px; height:45px; position:relative; color:#aaa8af; }
.wallet-action-transfer::before { content:""; position:absolute; left:8px; top:17px; width:29px; height:19px; border-left:4px solid currentColor; border-top:4px solid currentColor; border-radius:13px 0 0 0; }
.wallet-action-transfer::after { content:""; position:absolute; right:4px; top:6px; width:17px; height:17px; border-top:4px solid currentColor; border-right:4px solid currentColor; transform:rotate(45deg); }
.wallet-action-plus::before,.wallet-action-plus::after { content:""; position:absolute; left:23px; top:5px; width:4px; height:39px; border-radius:2px; background:currentColor; }
.wallet-action-plus::after { transform:rotate(90deg); }
.wallet-note { margin:0 0 25px !important; font-size:9px !important; }
.wallet-store-banner { min-height:120px; margin-bottom:14px; padding:12px !important; position:relative; overflow:visible !important; text-align:left; background:#3b393f !important; }
.wallet-store-copy { padding-left:0; }
.wallet-store-copy h2 { margin:0 0 2px !important; font-size:17px !important; }
.wallet-store-copy .btn { width:100%; margin-top:12px; text-align:center; }
.wallet-history { min-height:90px; margin-top:0; text-align:left; background:#3b393f !important; }
.wallet-history .empty { padding:8px !important; }
.wallet-transfer-modal { text-align:left; }
.wallet-transfer-form { margin-top:12px; }
.wallet-transfer-form label:nth-of-type(3) { grid-column:1 / -1; }

/* Reference page specializations. */
.page-birthdays .content { max-width:315px !important; margin:0 auto !important; padding:16px 0 30px !important; }
.page-birthdays .page-head { text-align:center !important; }
.page-birthdays .page-head h1 { font-size:24px !important; }
.birthday-card { display:grid !important; justify-items:center !important; gap:12px !important; margin-bottom:16px !important; padding:0 !important; overflow:hidden; text-align:center; }
.birthday-card > * { margin:0 !important; }
.birthday-card h2,.birthday-card p { width:100%; padding:14px 12px; border-bottom:1px solid #2b2930; }
.birthday-card .feature-ring { display:none !important; }
.birthday-card form,.birthday-card > .btn { width:calc(100% - 60px); margin:0 30px 15px !important; }
.birthday-card .btn { width:100%; }
.page-birthdays .grid-2 { grid-template-columns:1fr !important; gap:2px !important; margin:-57px 18px 20px !important; position:relative; pointer-events:none; }
.page-birthdays .grid-2 .tile { min-height:18px !important; padding:0 !important; border:0 !important; background:transparent !important; text-align:center; }
.page-birthdays .grid-2 .label { display:none; }
.page-birthdays .grid-2 .value { color:#77757d !important; font-size:8px !important; }

.page-tops .content { max-width:485px !important; margin:0 auto !important; padding-top:15px !important; position:relative; }
.page-tops .page-head { justify-content:center !important; text-align:center; }
.page-tops .page-head h1 { width:100%; font-size:29px !important; }
.page-tops .page-head .btn { position:absolute; right:14px; top:104px; z-index:2; }
.page-tops .info-plate { margin:0 0 4px !important; border:0 !important; background:transparent !important; text-align:center; }
.page-tops .card { margin-top:8px; padding:12px !important; }
.page-tops .main-area::before { content:"ТОПЫ МОДЕРАЦИИ ТОПЫ МОДЕРАЦИИ ТОПЫ МОДЕРАЦИИ"; position:fixed; left:52%; top:120px; width:570px; color:rgba(255,255,255,.045); font-size:48px; line-height:.8; font-weight:900; transform:rotate(-10deg); pointer-events:none; z-index:0; }

.page-workload .content { max-width:none !important; padding:8px 18px 22px 45px !important; }
.page-workload .page-head { display:block !important; text-align:center !important; }
.page-workload .page-head h1 { font-size:24px !important; }
.page-workload .page-head p { display:none; }
.page-workload .page-head form { width:65%; margin:10px auto 0; }
.page-workload .page-head form input { width:100% !important; }
.page-workload .page-head form .btn { display:none; }
.workload-sections { gap:6px !important; }
.workload-section { padding:0 !important; border-radius:5px !important; background:#0b0a0f !important; }
.workload-section .mode-section-head { min-height:34px; margin:0 !important; padding:8px !important; border-bottom:1px solid #29272e; }
.workload-section .mode-section-head p,.workload-section .mode-section-head .badge { display:none !important; }
.workload-scroll { border:0 !important; border-radius:0 !important; max-height:none !important; }
.workload-table th,.workload-table td { height:29px !important; padding:5px 7px !important; font-size:8px !important; }
.page-workload .workload-table .sticky-name { width:100px !important; min-width:100px !important; max-width:100px !important; }
.page-workload .workload-table .sticky-group { left:100px !important; width:55px !important; min-width:55px !important; max-width:55px !important; }
.page-workload .workload-table .day-head,.page-workload .workload-table .day-cell { width:28px !important; min-width:28px !important; max-width:28px !important; text-align:center; }

.page-staff .content { padding-top:16px !important; }
.page-staff .page-head { margin-bottom:8px !important; }
.page-staff .page-head h1 { display:inline; font-size:26px !important; }
.page-staff .page-head form { width:100%; margin-top:10px; }
.page-staff .page-head form input { width:100% !important; }
.page-staff .mode-sections { gap:0 !important; border:1px solid #2c2a31; border-radius:5px; overflow:hidden; }
.page-staff .mode-section { padding:0 !important; border:0 !important; border-radius:0 !important; background:#0b0a0f !important; }
.page-staff .mode-section-head { min-height:32px; margin:0 !important; padding:8px !important; border-bottom:1px solid #242229; }
.page-staff .mode-section-head p,.page-staff .mode-section-head .badge { display:none !important; }
.page-staff .mode-section .table-wrap { border:0 !important; border-radius:0 !important; }
.page-staff .staff-table th,.page-staff .staff-table td { height:30px !important; }

.page-manuals .content { padding-top:24px !important; }
.page-manuals .page-head { text-align:center !important; }
.page-manuals .page-head h1 { font-size:30px !important; }
.page-manuals .chips { margin:12px 0 10px !important; }
.page-manuals .grid-3 { display:grid !important; grid-template-columns:1fr !important; gap:5px !important; padding:8px; border:1px solid #2d2b32; border-radius:6px; }
.page-manuals .manual-card { min-height:94px !important; padding:10px !important; gap:4px !important; position:relative; background:#0d0c11 !important; }
.page-manuals .manual-card h2 { margin:0 !important; font-size:17px !important; }
.page-manuals .manual-card .cat { position:absolute; right:8px; top:8px; }
.page-manuals .manual-meta { margin-top:auto; padding-top:7px; border-top:1px solid #242229; font-size:8px; }

/* Remaining operational pages inherit the same compact system. */
.review-card,.member-row { gap:8px !important; margin-bottom:6px !important; padding:9px !important; }
.review-actions { gap:5px !important; }
.member-list,.notif-list,.mode-sections { gap:7px !important; }
.shop-grid { gap:7px !important; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)) !important; }
.shop-item { min-height:160px; padding:10px !important; }
.notif-item { padding:10px !important; }
.notif-item.unread { border-left:2px solid #d7d6dc !important; }
.modal-overlay { padding:14px !important; background:rgba(0,0,0,.72) !important; backdrop-filter:blur(3px) !important; }
.modal { max-width:460px !important; padding:20px !important; background:#0d0c11 !important; box-shadow:var(--shadow-lg) !important; }
.modal-overlay.open,.modal-overlay.open .modal { animation:none !important; }
.modal .btn-primary { color:#07131c !important; background:#1599f6 !important; border-color:#1599f6 !important; }
.close-x { color:#8e8c94 !important; background:transparent !important; }

/* Authentication uses the same dark panel language. */
.auth-wrap { min-height:100vh !important; padding:18px !important; background:#08070c !important; }
.auth-card { width:min(100%,390px) !important; max-width:390px !important; padding:28px !important; background:#111015 !important; }
.auth-card::before { display:none !important; }
.auth-head { margin-bottom:20px !important; text-align:left !important; }
.auth-head .logo-mark { display:grid !important; width:38px !important; height:38px !important; margin:0 0 16px !important; border:1px solid #45434a !important; border-radius:6px !important; color:#eee !important; background:#26252a !important; box-shadow:none !important; font-size:11px !important; }
.auth-head h1 { font-size:27px !important; }
.auth-alt { margin-top:16px !important; padding-top:14px; border-top:1px solid #29272e; text-align:left !important; }

/* Final reference alignment after the shared legacy page rules. */
@media (min-width:901px) {
    .page-main .content {
        display:block !important;
        position:relative !important;
        min-height:720px !important;
        padding-top:28px !important;
    }
    .page-main .page-head {
        width:350px !important;
        height:68px !important;
        margin:0 0 8px !important;
        display:grid !important;
        align-content:center !important;
        justify-items:center !important;
    }
    body.page-main .content .page-head .main-greeting { margin:0 0 1px !important; color:#d7d5da !important; font-size:10px !important; }
    body.page-main .content .page-head .main-username { margin:0 !important; color:#9b999f !important; font-size:44px !important; line-height:1 !important; font-weight:800 !important; }
    .page-main .grid-4 { width:350px !important; display:grid !important; grid-template-columns:1fr !important; gap:6px !important; margin:0 !important; }
    .page-main .grid-4 .tile { width:350px !important; height:47px !important; min-height:47px !important; max-height:47px !important; padding:5px 42px !important; }
    .page-main .grid-4 .tile::before { top:11px !important; }
    .page-main .content > .grid-4 + .grid-2 {
        position:absolute !important;
        left:404px !important;
        right:18px !important;
        top:28px !important;
        height:130px !important;
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
    .page-main .content > .grid-4 + .grid-2 .tile { height:130px !important; min-height:130px !important; }
    .page-main .content > .grid-4 + .grid-2 + .grid-2 { display:contents !important; }
    .page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child {
        position:absolute !important;
        left:46px !important;
        top:318px !important;
        width:350px !important;
        min-height:330px !important;
    }
    .page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:last-child {
        position:absolute !important;
        left:404px !important;
        right:18px !important;
        top:166px !important;
        height:318px !important;
        min-height:318px !important;
    }

    body .topbar .topbar-actions > form {
        width:22px !important;
        height:22px !important;
        left:194px !important;
        bottom:9px !important;
    }
    body .topbar .topbar-actions > form .topbar-action-btn {
        width:22px !important;
        min-width:22px !important;
        max-width:22px !important;
        height:22px !important;
        min-height:22px !important;
        padding:0 !important;
    }
}

/* Larger controls and restored norm calendar states. */
:root,
html[data-theme],
html[data-theme][data-accent] { --sidebar-w:240px !important; }

body { font-size:13px !important; }
.nav-group-symbol { color:#d8d6dc !important; font-family:"Segoe UI Symbol","Arial Unicode MS",sans-serif !important; font-size:15px !important; }

.sidebar-actions .sidebar-cta {
    min-height:40px !important;
    padding:9px 11px !important;
    border-radius:6px !important;
    font-size:11px !important;
}
.sidebar-profile {
    min-height:54px !important;
    padding:7px 5px !important;
    gap:9px !important;
}
.sidebar-profile .avatar { width:30px !important; height:30px !important; flex-basis:30px !important; font-size:11px !important; }
.sidebar-profile .who b { font-size:11px !important; }
.sidebar-profile .who small { font-size:9px !important; }

input,select,textarea,.manual-rich-editor { min-height:38px !important; padding:9px 11px !important; font-size:12px !important; }
.btn { min-height:37px !important; padding:9px 14px !important; font-size:12px !important; }
.btn-sm { min-height:32px !important; padding:7px 11px !important; }
th,td { height:38px !important; padding:8px 11px !important; font-size:11px !important; }
th { font-size:9px !important; }

.page-account .norm-day {
    min-height:48px !important;
    padding:6px 4px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:3px !important;
    opacity:1 !important;
}
.page-account .norm-day b { font-size:13px !important; line-height:1 !important; }
.page-account .norm-day small {
    display:block !important;
    max-width:100% !important;
    overflow:hidden !important;
    color:inherit !important;
    font-size:8px !important;
    line-height:1.1 !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}
.page-account .norm-day.norm-ok {
    color:#67d99a !important;
    border-color:rgba(53,191,112,.55) !important;
    background:rgba(53,191,112,.16) !important;
}
.page-account .norm-day.norm-fail {
    color:#f06d7e !important;
    border-color:rgba(223,77,96,.55) !important;
    background:rgba(223,77,96,.16) !important;
}
.page-account .norm-day.norm-vacation {
    color:var(--accent-hi) !important;
    border-color:rgba(var(--accent-rgb),.55) !important;
    background:rgba(var(--accent-rgb),.16) !important;
}
.page-account .norm-day.norm-none {
    color:#85838b !important;
    border-color:#302e35 !important;
    background:#18171c !important;
}

@media (min-width:901px) {
    .sidebar { padding:0 9px 9px !important; }
    .sidebar-logo { min-height:50px !important; padding:8px 3px !important; }
    .logo-text { font-size:14px !important; }
    .nav-group { margin-bottom:11px !important; }
    .nav-group-title { padding:7px 3px 5px !important; font-size:14px !important; }
    .nav-item { min-height:38px !important; padding:8px 10px !important; font-size:13px !important; }
    .nav-item .ico { width:20px !important; height:20px !important; flex-basis:20px !important; }
    .nav-item .ico::before { width:19px !important; height:19px !important; }

    .topbar-action-btn {
        width:35px !important;
        min-width:35px !important;
        max-width:35px !important;
        height:35px !important;
        min-height:35px !important;
        border-radius:7px !important;
        background:#29282d !important;
        border-color:#48464d !important;
    }
    .topbar-action-btn:hover { color:#fff !important; background:#38373d !important; border-color:#66646c !important; }
    .topbar-action-btn .top-icon { width:18px !important; height:18px !important; }
    .topbar-action-btn .top-icon::before { width:17px !important; height:17px !important; }
    .notif-bell { left:163px !important; top:7px !important; }
    .password-action { left:201px !important; top:7px !important; }
    body .topbar .topbar-actions > form { left:201px !important; bottom:10px !important; width:30px !important; height:30px !important; }
    body .topbar .topbar-actions > form .topbar-action-btn { width:30px !important; min-width:30px !important; max-width:30px !important; height:30px !important; min-height:30px !important; }

    .content { padding:34px !important; }
    .card { padding:19px !important; }
    .tile { padding:17px !important; }
    h1 { font-size:34px !important; }
    h2 { font-size:18px !important; }
    h3 { font-size:15px !important; }

    body.page-main .content > .grid-4 .tile { height:112px !important; min-height:112px !important; max-height:112px !important; padding:20px 20px 20px 56px !important; }
    body.page-main .content > .grid-4 .tile::before { top:42px !important; width:28px !important; height:28px !important; }
    body.page-main .content > .grid-4 .tile .label { font-size:10px !important; }
    body.page-main .content > .grid-4 .tile .value { font-size:20px !important; }
    body.page-main .content > .grid-4 + .grid-2 .tile { height:142px !important; min-height:142px !important; padding:22px !important; }
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child,
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:last-child { height:350px !important; min-height:350px !important; }

    body.page-account .account-column-main > .card:first-child,
    body.page-account .account-top-card,
    body.page-account .account-column-main > .card:last-child { min-height:360px !important; }
    body.page-account .account-progress-card,
    body.page-account .account-column-side > .card:first-child,
    body.page-account .account-column-side > .card:nth-child(2) { min-height:370px !important; }
    .page-account .progress-card { min-height:94px !important; }
    .page-account .progress-orb { width:68px !important; height:68px !important; }

    .page-wallet .content { max-width:680px !important; }
    .wallet-action-card,.wallet-action-submit { min-height:155px !important; height:155px !important; }
    .wallet-store-banner { min-height:140px !important; }
    .page-manuals .manual-card { min-height:118px !important; padding:15px !important; }
}

.page-account .progress-card {
    min-height:78px !important;
    display:grid !important;
    grid-template-columns:64px minmax(0,1fr) !important;
    align-items:center !important;
    gap:10px !important;
    padding:7px !important;
    border:1px solid #302e35 !important;
    border-radius:6px !important;
    background:#111015 !important;
}
.page-account .progress-orb {
    width:58px !important;
    height:58px !important;
    display:grid !important;
    place-items:center !important;
    position:relative !important;
    border-radius:50% !important;
    background:conic-gradient(#e5e4e7 calc(var(--pct) * 1%),#343239 0) !important;
    box-shadow:0 0 8px rgba(255,255,255,.2) !important;
}
.page-account .progress-orb::before { content:""; position:absolute; inset:5px; border-radius:50%; background:#121116; }
.page-account .progress-orb span { position:relative; z-index:1; color:#fff; font-size:12px; font-weight:800; }
.page-account .progress-info { min-width:0; text-align:left; }
.page-account .progress-track { height:4px !important; margin-top:6px; border-radius:999px; background:#29272e !important; overflow:hidden; }
.page-account .progress-track span { display:block; height:100%; background:#e2e1e4 !important; }

body.page-wallet .content > .wallet-store-banner,
body.page-wallet .content > .wallet-history { background:#3b393f !important; }

body.page-workload .page-head {
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

/* Desktop collapse and responsive behavior. */
html.sidebar-collapsed { --sidebar-w:0px !important; }
html.sidebar-collapsed .sidebar { transform:translateX(-100%) !important; }
html.sidebar-collapsed .main-area { margin-left:0 !important; }
html.sidebar-collapsed .topbar { left:0 !important; }
html.sidebar-collapsed .topbar-actions { display:none !important; }

@media (max-width:1050px) {
    .page-main .content { grid-template-columns:300px minmax(0,1fr) !important; padding-left:34px !important; }
    .page-account .account-layout { grid-template-columns:250px minmax(260px,1fr) !important; }
    .page-account .account-column-main > .card:last-child { grid-column:2 !important; grid-row:2 !important; }
    .page-account .account-column-side > .card:first-child { grid-column:1 !important; grid-row:3 !important; }
    .page-account .account-column-side > .card:nth-child(2) { grid-column:2 !important; grid-row:3 !important; }
    .page-account .account-column-side > .card:nth-child(n+3) { grid-column:auto !important; grid-row:auto !important; }
}

@media (max-width:900px) {
    :root,html[data-theme],html[data-theme][data-accent] { --sidebar-w:240px !important; }
    .sidebar { width:var(--sidebar-w) !important; padding:8px !important; transform:translateX(-102%) !important; transition:transform .18s ease !important; z-index:80 !important; }
    .sidebar.open { transform:translateX(0) !important; }
    .sidebar.open + .sidebar-backdrop { display:block; position:fixed; inset:0; z-index:70; border:0; background:rgba(0,0,0,.68); backdrop-filter:blur(2px); }
    .sidebar-logo { min-height:42px !important; }
    .logo-text { font-size:12px !important; }
    .nav-group-title { font-size:12px !important; padding:7px 5px 4px !important; }
    .nav-item { min-height:34px !important; padding:7px 9px !important; font-size:12px !important; }
    .nav-item .ico { width:18px !important; height:18px !important; flex-basis:18px !important; }
    .sidebar-actions .sidebar-cta { min-height:35px !important; font-size:11px !important; }
    .sidebar-profile { min-height:46px !important; }
    .main-area { margin-left:0 !important; }
    .topbar { position:sticky !important; inset:0 !important; width:100% !important; height:48px !important; min-height:48px !important; padding:8px 10px !important; display:flex !important; justify-content:space-between !important; border-bottom:1px solid #2b2930 !important; background:rgba(8,7,12,.94) !important; backdrop-filter:blur(8px) !important; }
    .topbar-leading { display:flex !important; }
    .hamburger { width:31px !important; height:31px !important; min-height:31px !important; border:1px solid #35333a !important; background:#17161b !important; }
    .topbar-actions { display:flex !important; gap:5px !important; }
    .topbar-action-btn { position:static !important; width:31px !important; height:31px !important; min-height:31px !important; }
    .topbar-actions > form { position:static !important; }
    .content,.page-workload .content { padding:18px 12px 30px !important; }
    .page-main .content { display:block !important; }
    .page-main .content > * { margin-bottom:8px !important; }
    .page-main .grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    .page-main .content > .grid-2:last-child { display:grid !important; grid-template-columns:1fr !important; }
    .page-main .content > .grid-2:last-child > .card { width:100% !important; grid-column:auto !important; grid-row:auto !important; min-height:auto !important; }
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 { display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:8px !important; }
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child,
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:last-child { position:static !important; width:100% !important; height:auto !important; grid-column:1 !important; grid-row:auto !important; min-height:180px !important; }
    .page-account .content > .info-plate { width:100% !important; }
    .page-account .account-layout { display:grid !important; grid-template-columns:1fr !important; }
    .page-account .account-column { display:grid !important; gap:8px !important; }
    .page-account .account-column > .card,.page-account .account-top-card { grid-column:1 !important; grid-row:auto !important; min-height:auto !important; }
    .page-wallet .content,.page-birthdays .content,.page-tops .content { max-width:100% !important; padding:28px 14px !important; }
    .wallet-store-banner { margin-left:0; }
    .page-tops .main-area::before { display:none; }
}

@media (max-width:560px) {
    h1 { font-size:24px !important; }
    .page-main .main-username { font-size:20px !important; color:#f1f0f2 !important; font-weight:750 !important; }
    .grid-2,.grid-3,.grid-4,.page-main .grid-4,.page-main .content > .grid-2:nth-of-type(2) { grid-template-columns:1fr !important; }
    .card,.tile { padding:11px !important; }
    .wallet-balance strong { font-size:66px; }
    .wallet-actions { grid-template-columns:1fr !important; }
    .wallet-action-card,.wallet-action-submit { min-height:105px !important; height:105px; }
    .wallet-store-banner { margin-left:0; }
    .wallet-store-copy { padding-left:38px; }
    .field-row,.page-account .field-row { grid-template-columns:1fr !important; }
    .review-actions { width:100%; flex-direction:column !important; }
    .review-actions > * { width:100% !important; }
    .btn { width:100%; }
    th,td { white-space:nowrap; }
    .auth-card { width:calc(100vw - 28px) !important; padding:22px !important; }
}

@media (prefers-reduced-motion:reduce) {
    *,*::before,*::after { animation-duration:1ms !important; transition-duration:1ms !important; scroll-behavior:auto !important; }
}

/* User-requested alignment pass: equal rows and a larger desktop sidebar. */
.grid > .card,
.grid > .tile { height:100% !important; }

@media (min-width:901px) {
    body.page-main .content {
        display:grid !important;
        grid-template-columns:repeat(4,minmax(0,1fr)) !important;
        grid-template-rows:auto !important;
        gap:12px !important;
        min-height:0 !important;
        padding:30px !important;
    }
    body.page-main .content > .page-head {
        position:static !important;
        width:auto !important;
        height:auto !important;
        grid-column:1 / -1 !important;
        display:flex !important;
        align-items:flex-end !important;
        justify-content:space-between !important;
        margin:0 0 4px !important;
        padding:0 0 16px !important;
        border-bottom:1px solid #27252c !important;
        text-align:left !important;
    }
    body.page-main .content .page-head .main-greeting { margin:0 14px 7px 0 !important; font-size:12px !important; }
    body.page-main .content .page-head .main-username { margin-right:auto !important; color:#b5b3ba !important; font-size:40px !important; }
    body.page-main .content > .grid-4 {
        position:static !important;
        width:auto !important;
        grid-column:1 / -1 !important;
        display:grid !important;
        grid-template-columns:repeat(4,minmax(0,1fr)) !important;
        gap:12px !important;
        margin:0 !important;
    }
    body.page-main .content > .grid-4 .tile {
        width:auto !important;
        height:92px !important;
        min-height:92px !important;
        max-height:92px !important;
        padding:18px 18px 18px 52px !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:flex-start !important;
        justify-content:center !important;
    }
    body.page-main .content > .grid-4 .tile::before { left:15px !important; top:33px !important; }
    body.page-main .content > .grid-4 .tile .label { font-size:9px !important; }
    body.page-main .content > .grid-4 .tile .value { font-size:17px !important; }
    body.page-main .content > .grid-4 + .grid-2 {
        position:static !important;
        width:auto !important;
        height:auto !important;
        grid-column:1 / -1 !important;
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:12px !important;
        margin:0 !important;
    }
    body.page-main .content > .grid-4 + .grid-2 .tile {
        height:118px !important;
        min-height:118px !important;
        padding:18px !important;
    }
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 {
        position:static !important;
        grid-column:1 / -1 !important;
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:12px !important;
    }
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child,
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:last-child {
        position:static !important;
        width:auto !important;
        height:300px !important;
        min-height:300px !important;
        grid-column:auto !important;
        grid-row:auto !important;
    }

    body.page-account .content > .info-plate { width:100% !important; margin-bottom:10px !important; }
    body.page-account .account-layout {
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        grid-auto-rows:auto !important;
        gap:12px !important;
        align-items:stretch !important;
    }
    body.page-account .account-column-main > .card:first-child,
    body.page-account .account-top-card,
    body.page-account .account-column-main > .card:last-child {
        min-height:300px !important;
        height:100% !important;
    }
    body.page-account .account-progress-card,
    body.page-account .account-column-side > .card:first-child,
    body.page-account .account-column-side > .card:nth-child(2) {
        min-height:310px !important;
        height:100% !important;
    }
    body.page-account .account-column-side > .card:nth-child(3),
    body.page-account .account-column-side > .card:nth-child(4) {
        min-height:220px !important;
        height:100% !important;
    }
}

/* Final large-screen sizing: edge-to-edge panels and stable top tables. */
:root,
html[data-theme],
html[data-theme][data-accent] { --sidebar-w:280px !important; }

.page-tops .main-area::before { display:none !important; content:none !important; }
.page-tops .content {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
}
.page-tops .page-head {
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    min-height:44px !important;
    padding-left:42px !important;
    text-align:left !important;
}
.page-tops .page-head h1 { width:auto !important; margin:0 !important; }
.page-tops .page-head .btn { position:static !important; margin:0 !important; }
.page-tops .info-plate { padding:11px 13px !important; border:1px solid #302e35 !important; background:#111015 !important; text-align:left !important; }
.page-tops .card { margin-top:14px !important; }
.page-tops table { table-layout:fixed; }
.page-tops th:nth-child(1),.page-tops td:nth-child(1) { width:110px; }
.page-tops th:nth-child(3),.page-tops td:nth-child(3) { width:150px; }
.page-tops th:nth-child(4),.page-tops td:nth-child(4) { width:180px; }
.page-tops td:nth-child(2) { overflow:hidden; text-overflow:ellipsis; }

.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child table,
.page-account .account-top-card table { table-layout:fixed; }
.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child th:first-child,
.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child td:first-child,
.page-account .account-top-card th:first-child,
.page-account .account-top-card td:first-child { width:54px; }
.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child th:last-child,
.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child td:last-child,
.page-account .account-top-card th:last-child,
.page-account .account-top-card td:last-child { width:120px; }
.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child td:nth-child(2),
.page-account .account-top-card td:nth-child(2) { overflow:hidden; text-overflow:ellipsis; }

@media (min-width:901px) {
    .sidebar { padding:0 12px 12px !important; }
    .sidebar-logo { min-height:56px !important; }
    .logo-text { font-size:15px !important; }
    .nav-group-title { font-size:15px !important; }
    .nav-item { min-height:41px !important; padding:9px 11px !important; font-size:14px !important; }
    .nav-item .ico { width:22px !important; height:22px !important; flex-basis:22px !important; }
    .nav-item .ico::before { width:21px !important; height:21px !important; }
    .sidebar-actions .sidebar-cta { min-height:46px !important; font-size:12px !important; }
    .sidebar-profile { min-height:62px !important; }
    .sidebar-profile .avatar { width:36px !important; height:36px !important; flex-basis:36px !important; }
    .sidebar-profile .who b { font-size:13px !important; }
    .sidebar-profile .who small { font-size:10px !important; }

    .notif-bell { left:198px !important; top:9px !important; }
    .password-action { left:238px !important; top:9px !important; }
    body .topbar .topbar-actions > form { left:240px !important; bottom:15px !important; }

    .content,
    body.page-main .content,
    body.page-account .content,
    body.page-staff .content,
    body.page-workload .content,
    body.page-manuals .content,
    body.page-admin .content,
    body.page-tops .content { padding:16px !important; }

    body.page-main .content { gap:14px !important; }
    body.page-main .content > .page-head { padding:4px 0 18px !important; }
    body.page-main .content .page-head .main-username { font-size:46px !important; }
    body.page-main .content > .grid-4 { gap:14px !important; }
    body.page-main .content > .grid-4 .tile {
        height:135px !important;
        min-height:135px !important;
        max-height:135px !important;
        padding:24px 22px 24px 62px !important;
    }
    body.page-main .content > .grid-4 .tile::before { left:18px !important; top:50px !important; width:32px !important; height:32px !important; }
    body.page-main .content > .grid-4 .tile .label { font-size:11px !important; }
    body.page-main .content > .grid-4 .tile .value { font-size:22px !important; }
    body.page-main .content > .grid-4 + .grid-2 { gap:14px !important; }
    body.page-main .content > .grid-4 + .grid-2 .tile { height:175px !important; min-height:175px !important; padding:26px !important; }
    body.page-main .content > .grid-4 + .grid-2 .tile .label { font-size:14px !important; }
    body.page-main .content > .grid-4 + .grid-2 .tile .value { font-size:36px !important; }
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 { gap:14px !important; }
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:first-child,
    body.page-main .content > .grid-4 + .grid-2 + .grid-2 > .card:last-child { height:420px !important; min-height:420px !important; }

    body.page-account .account-layout { gap:14px !important; }
    body.page-account .account-column-main > .card:first-child,
    body.page-account .account-top-card,
    body.page-account .account-column-main > .card:last-child { min-height:390px !important; }
    body.page-account .account-progress-card,
    body.page-account .account-column-side > .card:first-child,
    body.page-account .account-column-side > .card:nth-child(2) { min-height:410px !important; }

    .page-wallet .content { width:100% !important; max-width:980px !important; padding:34px 16px !important; }
    .wallet-action-card,.wallet-action-submit { min-height:180px !important; height:180px !important; }
    .wallet-history { min-height:300px !important; }
}

/* Manuals and birthdays: full-width, stable layouts after the global scale pass. */
.page-birthdays .content {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    align-content:start;
    gap:14px !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:16px !important;
}
.page-birthdays .page-head,
.page-birthdays .content > .empty,
.page-birthdays .content > .grid-2,
.page-birthdays .birthday-upcoming-card {
    grid-column:1 / -1 !important;
}
.page-birthdays .page-head {
    padding:4px 0 10px !important;
    text-align:left !important;
}
.page-birthdays .page-head h1 { font-size:32px !important; }
.page-birthdays .content > .empty {
    display:flex !important;
    align-items:center;
    justify-content:center;
    min-height:150px;
    margin:0 !important;
    padding:24px !important;
    border:1px solid #302e35 !important;
    border-radius:6px;
    background:#111015;
    text-align:center;
}
.page-birthdays .birthday-card {
    display:flex !important;
    flex-direction:column;
    align-items:flex-start !important;
    justify-content:center;
    min-width:0;
    min-height:220px !important;
    gap:10px !important;
    margin:0 !important;
    padding:24px !important;
    overflow:hidden;
    text-align:left !important;
}
.page-birthdays .birthday-card > * { margin:0 !important; }
.page-birthdays .birthday-card h2,
.page-birthdays .birthday-card p {
    width:auto !important;
    padding:0 !important;
    border:0 !important;
}
.page-birthdays .birthday-card .feature-ring { display:none !important; }
.page-birthdays .birthday-card form,
.page-birthdays .birthday-card > .btn {
    width:auto !important;
    margin-top:6px !important;
}
.page-birthdays .birthday-card .btn { width:auto !important; min-height:42px; }
.page-birthdays .content > .grid-2 {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
    margin:0 !important;
    position:static !important;
    pointer-events:auto !important;
}
.page-birthdays .grid-2 .tile {
    display:flex !important;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    min-width:0;
    min-height:130px !important;
    padding:22px !important;
    border:1px solid #302e35 !important;
    background:#111015 !important;
    text-align:left !important;
}
.page-birthdays .grid-2 .label {
    display:block !important;
    color:#93909a !important;
    font-size:12px !important;
}
.page-birthdays .grid-2 .value {
    margin-top:7px;
    color:#f0eff3 !important;
    font-size:23px !important;
    overflow-wrap:anywhere;
}
.page-birthdays .birthday-upcoming-card {
    min-width:0;
    min-height:260px;
    margin:0 !important;
    padding:24px !important;
}
.page-birthdays .birthday-upcoming-card h2 { font-size:21px !important; }
.page-birthdays .birthday-upcoming-card .empty {
    min-height:150px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.page-manuals .content,
.page-manual_detail .content,
.page-manual_edit .content {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:16px !important;
}
.page-manuals .chips { gap:8px !important; margin:14px 0 !important; }
.page-manuals .chip { min-height:38px; padding:9px 13px !important; }
.page-manuals .grid-3 { gap:8px !important; padding:10px !important; }
.page-manuals .manual-card { min-height:122px !important; padding:16px !important; gap:7px !important; }
.page-manuals .manual-card h2 { padding-right:130px; font-size:19px !important; }
.page-manuals .manual-meta { font-size:11px !important; }

.manual-back-row {
    display:flex;
    align-items:center;
    min-height:38px;
    margin-bottom:12px;
}
.manual-back-row a { font-size:13px; font-weight:700; }
.page-manual_detail .manual-reader-card,
.page-manual_edit .manual-edit-card {
    width:100% !important;
    max-width:none !important;
    min-width:0;
    padding:22px !important;
}
.page-manual_detail .manual-reader-shell,
.page-manual_edit .manual-document-shell {
    grid-template-columns:280px minmax(0,1fr);
    gap:16px;
    width:100%;
    min-width:0;
}
.page-manual_detail .manual-document-outline,
.page-manual_edit .manual-document-outline {
    min-width:0;
    max-height:calc(100vh - 110px);
    overflow-x:hidden;
}
.page-manual_detail .manual-reader-content,
.page-manual_edit .manual-document-workarea,
.page-manual_edit .manual-editor-widget,
.page-manual_edit .form { min-width:0; }
.page-manual_detail .manual-body {
    width:100% !important;
    max-width:900px !important;
    min-width:0;
    margin:0 auto;
    padding:24px !important;
    overflow-wrap:anywhere;
}
.page-manual_detail .manual-body img,
.page-manual_detail .manual-body video,
.page-manual_detail .manual-body iframe {
    max-width:100% !important;
}
.page-manual_detail .manual-body video { height:auto !important; }
.page-manual_detail .manual-copy-field { max-width:100%; min-width:0; }
.page-manual_detail .manual-copy-text { min-width:0; overflow-wrap:anywhere; }
.page-manual_edit .manual-toolbar {
    width:100%;
    max-width:100%;
    align-items:center;
    overflow:visible;
    flex-wrap:wrap;
}
.page-manual_edit .manual-image-panel,
.page-manual_edit .manual-ruler { min-width:0; max-width:100%; }
.page-manual_edit .manual-rich-editor {
    width:100%;
    min-width:0;
    min-height:580px !important;
}

@media (min-width:901px) {
    .page-manual_detail .manual-back-row,
    .page-manual_edit .manual-back-row { padding-left:42px; }
}

@media (max-width:900px) {
    .page-birthdays .content {
        grid-template-columns:1fr !important;
        padding:20px 14px 28px !important;
    }
    .page-birthdays .page-head { text-align:center !important; }
    .page-birthdays .page-head h1 { font-size:26px !important; }
    .page-birthdays .birthday-card,
    .page-birthdays .content > .grid-2,
    .page-birthdays .birthday-upcoming-card { grid-column:1 !important; }
    .page-birthdays .content > .grid-2 { grid-template-columns:1fr !important; }
    .page-birthdays .birthday-card { min-height:190px !important; padding:20px !important; }
    .page-birthdays .grid-2 .tile { min-height:104px !important; padding:18px !important; }
    .page-birthdays .birthday-upcoming-card { min-height:230px; padding:18px !important; }

    .page-manual_detail .manual-reader-shell,
    .page-manual_edit .manual-document-shell { grid-template-columns:1fr !important; }
    .page-manual_detail .manual-document-outline,
    .page-manual_edit .manual-document-outline {
        position:static;
        max-height:190px;
    }
    .page-manual_detail .manual-body { padding:16px !important; }
    .page-manual_edit .manual-rich-editor { min-height:440px !important; padding:16px !important; }
}

@media (max-width:560px) {
    .page-manuals .page-head { text-align:left !important; }
    .page-manuals .manual-card h2 { padding-right:0; padding-top:25px; }
    .page-manuals .manual-card .cat { left:10px; right:auto; }
    .page-manual_detail .manual-reader-card,
    .page-manual_edit .manual-edit-card { padding:14px !important; }
    .page-manual_detail .manual-meta { gap:7px !important; }
    .page-manual_edit .field-row { grid-template-columns:1fr !important; }
    .page-manual_edit .manual-image-panel { grid-template-columns:1fr !important; }
    .page-manual_edit .manual-toolbar { flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; }
}
/* Knowledge base — structure inspired by the supplied manual portal, in HolyJournal's theme. */
.manuals-portal { max-width:1280px; margin:0 auto; }
.manuals-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; padding:20px 0 30px; border-bottom:1px solid #25242b; }
.manuals-hero h1 { margin:7px 0 6px; font-size:42px; letter-spacing:-.04em; }
.manuals-hero p { margin:0; color:#96939f; }
.manuals-kicker { color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.14em; }
.manuals-search { width:min(390px,100%); height:46px; display:flex; align-items:center; gap:10px; padding:0 13px; border:1px solid #302e38; border-radius:11px; background:#111016; color:#77747f; }
.manuals-search:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent); }
.manuals-search input { flex:1; min-width:0; border:0!important; padding:0!important; background:transparent!important; box-shadow:none!important; color:#f2f1f4; }
.manuals-search kbd { padding:3px 6px; border:1px solid #34323a; border-radius:5px; color:#77747f; font:10px inherit; }
.manuals-layout { display:grid; grid-template-columns:220px minmax(0,1fr); gap:34px; padding-top:28px; }
.manuals-categories { position:sticky; top:82px; align-self:start; display:flex; flex-direction:column; gap:5px; }
.manuals-categories-title { padding:0 10px 9px; color:#6f6c77; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.12em; }
.manuals-category { display:flex; justify-content:space-between; gap:10px; padding:10px 11px; border-radius:8px; color:#aaa7b0; text-decoration:none; font-size:13px; font-weight:600; }
.manuals-category:hover,.manuals-category.active { background:#18171d; color:#fff; opacity:1; }
.manuals-category.active { box-shadow:inset 2px 0 var(--accent); }
.manuals-category b { color:#66636d; font-size:11px; }
.manuals-library-head { display:flex; justify-content:space-between; margin-bottom:16px; }
.manuals-library-head h2 { margin:0 0 3px; font-size:22px; }
.manuals-library-head p { margin:0; color:#77747f; font-size:12px; }
.manuals-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.manual-library-card { min-height:154px; display:grid; grid-template-columns:38px minmax(0,1fr) 22px; gap:13px; padding:18px; border:1px solid #25242b; border-radius:12px; background:#0e0d12; color:#f3f2f5; text-decoration:none; transition:border-color .18s,background .18s,transform .18s; }
.manual-library-card:hover { border-color:#45424d; background:#131218; transform:translateY(-2px); opacity:1; }
.manual-library-icon { width:36px; height:36px; display:grid; place-items:center; border:1px solid #302e37; border-radius:9px; background:#18171d; color:var(--accent); font-weight:800; }
.manual-library-category { color:var(--accent); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.manual-library-copy h3 { margin:5px 0 7px; font-size:17px; line-height:1.25; }
.manual-library-copy>p { margin:0; color:#8e8b96; font-size:12px; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.manual-library-meta { display:flex; flex-wrap:wrap; gap:10px; margin-top:13px; color:#65626c; font-size:10px; }
.manual-library-arrow { align-self:center; color:#55525c; font-size:18px; }
.manual-library-card:hover .manual-library-arrow { color:var(--accent); }
.manuals-empty { grid-column:1/-1; padding:35px; border:1px dashed #302e38; border-radius:12px; color:#77747f; text-align:center; }
.manual-reading-progress { position:fixed; z-index:100; top:0; left:0; right:0; height:2px; background:transparent; pointer-events:none; }
.manual-reading-progress span { display:block; width:0; height:100%; background:var(--accent); box-shadow:0 0 8px var(--accent); }
@media (max-width:900px) { .manuals-hero { align-items:stretch; flex-direction:column; gap:20px; } .manuals-search { width:100%; } .manuals-layout { grid-template-columns:1fr; } .manuals-categories { position:static; flex-direction:row; overflow-x:auto; padding-bottom:5px; } .manuals-categories-title { display:none; } .manuals-category { white-space:nowrap; border:1px solid #25242b; } }
@media (max-width:620px) { .manuals-hero h1 { font-size:34px; } .manuals-grid { grid-template-columns:1fr; } .manual-library-card { min-height:0; padding:15px; } .manuals-search kbd { display:none; } }
