body.dashboard-page {
  --dash-bg: #080a0f;
  --dash-surface: #10141c;
  --dash-surface-2: #171c27;
  --dash-surface-3: #1d2431;
  --dash-line: #2b3342;
  --dash-line-strong: #424d63;
  --dash-text: #f5f7fa;
  --dash-muted: #adb6c6;
  --dash-subtle: #96a2b6;
  --dash-purple: #b4a6ff;
  --dash-cyan: #69d4e7;
  --dash-kids: #f4b86a;
  --dash-green: #55d6a5;
  --dash-warning: #f5c675;
  --dash-danger: #ff91a6;
  --dash-sidebar: 248px;
  --dash-sidebar-collapsed: 76px;
  --dash-radius: 20px;
  --bg: var(--dash-bg);
  --panel: var(--dash-surface);
  --panel2: var(--dash-surface-2);
  --text: var(--dash-text);
  --muted: var(--dash-muted);
  --line: var(--dash-line);
  --dash-charcoal: var(--dash-surface);
  --workspace-surface: var(--dash-surface);
  --workspace-raised: var(--dash-surface-2);
  --workspace-border: var(--dash-line);
  --workspace-muted: var(--dash-muted);
  min-height: 100vh;
  margin: 0;
  background: radial-gradient(ellipse at 65% 0, #9d8cff0d, transparent 45%), var(--dash-bg) !important;
  color: var(--dash-text);
  font: 14px/1.8 Vazirmatn, Tahoma, sans-serif;
  overflow-x: clip;
}
body.dashboard-page *, body.dashboard-page *::before, body.dashboard-page *::after { box-sizing: border-box; }
body.dashboard-page [hidden] { display: none !important; }
body.dashboard-page .app-shell { display: block; min-height: 100vh; background: transparent !important; }
body.dashboard-page :is(button,input,select,textarea) { font-family: inherit; }
body.dashboard-page :is(button,a,input,select,textarea):focus-visible { outline: 2px solid var(--dash-cyan) !important; outline-offset: 3px; }
body.dashboard-page button:focus:not(:focus-visible) { outline: none; }
body.dashboard-page button:disabled { cursor: not-allowed; opacity: .55; }
body.dashboard-page :is(.muted,.section-header p) { color: var(--dash-muted); }
body.dashboard-page :is(.primary-btn,.primary-button,.secondary-btn,.secondary-button,.text-btn,.dev-button,.media-action,.plan-purchase-button,.billing-head-cta) { min-height: 44px; padding: 10px 16px; border-radius: 12px; font-size: 13px; line-height: 1.7; }
body.dashboard-page :is(.primary-btn,.primary-button,.creation-quick-button,.billing-head-cta,.dev-button.primary,.plan-purchase-button,.balance-topup,.settings-save) { border: 1px solid transparent !important; background: linear-gradient(120deg,#c3b8ff,#8bddeb) !important; color: #121525 !important; font-weight: 800; box-shadow: none !important; }
body.dashboard-page :is(.secondary-btn,.secondary-button,.text-btn,.dev-button,.media-action) { border: 1px solid var(--dash-line) !important; background: var(--dash-surface-2) !important; color: var(--dash-text) !important; box-shadow: none; }
body.dashboard-page :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),select,textarea) { min-height: 44px; padding: 10px 12px; border: 1px solid var(--dash-line-strong) !important; border-radius: 11px; background: var(--dash-bg) !important; color: var(--dash-text) !important; font-size: 14px !important; box-shadow: none !important; }
body.dashboard-page :is(input,textarea)::placeholder { color: var(--dash-subtle); opacity: 1; }
body.dashboard-page input:is([type=checkbox],[type=radio],[type=range]) { accent-color: var(--dash-purple); }
body.dashboard-page :is(.panel,.settings-card,.billing-plans-section,.billing-ledger,.notification-center-shell,.ticket-hero,.ticket-summary article,.ticket-workspace,.creation-hub-intro,.creation-hub-card,.creation-choice,.creation-future-card) { border: 1px solid var(--dash-line) !important; border-radius: var(--dash-radius); background: var(--dash-surface) !important; box-shadow: none !important; }

body.dashboard-page .sidebar { position: fixed !important; z-index: 80; inset: 0 0 0 auto; display: flex; flex-direction: column; width: var(--dash-sidebar) !important; height: 100dvh; padding: 18px 14px; overflow: hidden; border: 0; border-left: 1px solid var(--dash-line); background: #0c1018 !important; box-shadow: none; transition: width .2s, transform .2s; }
body.dashboard-page .sidebar .brand { display: flex; align-items: center; flex: none; min-height: 46px; padding: 4px 10px; background: transparent; }
body.dashboard-page .sidebar .podly-logo { width: 92px; height: 29px; background: url('/assets/brand/podly-white.webp') center/contain no-repeat; filter: none; }
body.dashboard-page .sidebar .brand>div { display: none; }
body.dashboard-page .workspace-switcher { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 10px; flex: none; margin: 16px 0; padding: 10px; border: 1px solid var(--dash-line); border-radius: 14px; background: var(--dash-surface-2); }
body.dashboard-page .workspace-switcher .avatar { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: #b4a6ff; color: #17152b; font-weight: 800; }
body.dashboard-page .workspace-switcher small { color: var(--dash-subtle); font-size: 12px; }
body.dashboard-page .workspace-switcher strong { color: var(--dash-text); font-size: 12px; }
body.dashboard-page .main-nav { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; gap: 3px; padding: 2px 1px 10px; overflow: hidden auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #635a8c transparent; }
body.dashboard-page .sidebar .nav-label { flex: none; margin: 12px 0 4px; padding: 0 10px; color: var(--dash-subtle); font-size: 12px; }
body.dashboard-page .sidebar :is(.nav-item,.developer-sidebar-link) { position: relative; display: grid; grid-template-columns: 24px minmax(0,1fr) auto; grid-template-rows: 1fr; align-items: center; flex: none; gap: 10px; width: 100%; min-height: 44px; margin: 0; padding: 9px 10px; overflow: hidden; border: 1px solid transparent; border-radius: 11px; background: transparent !important; color: var(--dash-muted); text-align: right; text-decoration: none; box-shadow: none; transform: none; }
body.dashboard-page .sidebar :is(.nav-item,.developer-sidebar-link):hover { border-color: var(--dash-line); background: var(--dash-surface-2) !important; color: var(--dash-text); }
body.dashboard-page .sidebar :is(.nav-item,.developer-sidebar-link).active { border-color: #7668b0; background: #25233c !important; color: var(--dash-text); box-shadow: none; }
body.dashboard-page .sidebar :is(.nav-item,.developer-sidebar-link)::before, body.dashboard-page .sidebar :is(.nav-item,.developer-sidebar-link)::after { content: none; }
body.dashboard-page .sidebar .nav-icon { grid-column: 1; grid-row: 1; display: grid; place-items: center; width: 24px; height: 24px; margin: 0; border: 0; border-radius: 0; background: transparent !important; color: var(--dash-subtle); }
body.dashboard-page .sidebar .active .nav-icon { color: var(--dash-purple); }
body.dashboard-page .sidebar .nav-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; }
body.dashboard-page .sidebar :is(.nav-item,.developer-sidebar-link) b { grid-column: 2; grid-row: 1; min-width: 0; color: inherit; font-size: 13px; font-weight: 650; line-height: 1.6; }
body.dashboard-page .sidebar :is(.nav-item,.developer-sidebar-link) small { display: none; }
body.dashboard-page .sidebar :is(.nav-notification-count,.nav-branding-badge) { position: static; grid-column: 3; grid-row: 1; margin: 0; }
body.dashboard-page .sidebar-bottom { flex: none; margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--dash-line); background: #0c1018; }
body.dashboard-page .developer-sidebar-section { margin: 0 0 7px; }
body.dashboard-page .sidebar .sidebar-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; width: 100%; margin: 0; }
body.dashboard-page .sidebar .sidebar-action { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; min-width: 0; min-height: 44px; padding: 8px; border: 1px solid var(--dash-line); border-radius: 11px; background: var(--dash-surface-2); color: var(--dash-muted); text-decoration: none; }
body.dashboard-page .sidebar .sidebar-action>b { display: block; font-size: 12px; }
body.dashboard-page .sidebar .sidebar-action>span { display: grid; place-items: center; width: 20px; color: var(--dash-purple); }
body.dashboard-page .sidebar-backdrop { display: none; }
body.dashboard-page .sidebar-collapse { position: static; z-index: auto; flex: none; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--dash-line); border-radius: 9px; background: var(--dash-surface-2); color: var(--dash-muted); }
body.dashboard-page .main-content { width: auto !important; min-width: 0; min-height: 100vh; margin-right: var(--dash-sidebar); padding: 0 32px 60px; background: transparent !important; transition: margin-right .2s; }
body.dashboard-page .topbar { position: sticky; z-index: 60; top: 0; display: flex; align-items: center; min-height: 80px; height: auto; gap: 16px; margin: 0 -32px 24px; padding: 12px 32px; border: 0; border-bottom: 1px solid var(--dash-line); background: #080a0ff2; backdrop-filter: blur(20px); }
body.dashboard-page .breadcrumb { position: relative; display: grid; gap: 0; padding: 0; background: transparent; border: 0; }
body.dashboard-page .breadcrumb::before { content: none; }
body.dashboard-page .breadcrumb span { color: var(--dash-subtle); font-size: 12px; }
body.dashboard-page .breadcrumb strong { color: var(--dash-text); font-size: 16px; }
body.dashboard-page .top-actions { display: flex; align-items: center; gap: 12px; margin-right: auto; }
body.dashboard-page :is(.top-primary-actions,.top-account-actions) { display: flex; align-items: center; gap: 8px; padding: 0; border: 0; }
body.dashboard-page .top-actions :is(.icon-button,.user-menu,.dashboard-minimal-native), body.dashboard-page .hero-credit-trigger { min-height: 44px !important; height: 44px !important; border: 1px solid var(--dash-line) !important; border-radius: 12px !important; background: var(--dash-surface) !important; color: var(--dash-text) !important; box-shadow: none !important; }
body.dashboard-page .dashboard-circle-shortcut { color: var(--dash-purple) !important; }
body.dashboard-page .top-account-actions .dashboard-circle-mobile { display: none !important; }
body.dashboard-page .top-actions svg { width: 21px; height: 21px; }
/* Labels in header actions share one horizontal row with their icon. */
body.dashboard-page .top-actions :is(.icon-button,.user-menu,.dashboard-create-shortcut) { width: 44px !important; min-width: 44px !important; max-width: 44px !important; }
body.dashboard-page .top-actions .hero-credit-trigger { display: inline-flex; flex-direction: row; align-items: center; justify-content: center; gap: 8px; width: auto !important; min-width: 0 !important; max-width: none !important; padding: 0 12px !important; line-height: 1; }
body.dashboard-page .top-actions .hero-credit-trigger > span { display: grid !important; place-items: center; flex: none; width: 21px; height: 21px; }
body.dashboard-page .top-actions .hero-credit-trigger > strong { display: block !important; font-size: 13px; line-height: 1.4; font-variant-numeric: tabular-nums; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; direction: ltr; unicode-bidi: isolate; }
body.dashboard-page .top-actions .hero-credit-trigger > i { display: none !important; }
body.dashboard-page .top-actions :is(.dashboard-circle-shortcut,.dashboard-circle-mobile) { display: inline-flex; flex-direction: row; align-items: center; justify-content: center; gap: 7px; width: auto !important; min-width: 0 !important; max-width: none !important; padding: 0 10px !important; text-decoration: none; }
body.dashboard-page .top-actions :is(.dashboard-circle-shortcut,.dashboard-circle-mobile) > .circle-name { display: block; width: auto; height: auto; font-size: 12px; font-weight: 700; line-height: 1.4; color: inherit; }
body.dashboard-page .top-actions :is(.dashboard-circle-shortcut,.dashboard-circle-mobile) > .circle-logo { flex: none; width: 21px; height: 21px; }
body.dashboard-page .mobile-menu { display: none; }
body.dashboard-page .main-content>.view, body.dashboard-page .podly-dashboard-boot { width: 100%; max-width: 1480px; min-width: 0; margin-inline: auto; padding: 8px 0 40px; }
body.dashboard-page :is(.section-header,.library-toolbar,.billing-page-head,.user-settings-heading,.notification-center-head) { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 18px; margin: 0 0 24px; padding: 0; border: 0; background: transparent; }
body.dashboard-page :is(.section-header,.library-toolbar,.billing-page-head,.user-settings-heading,.notification-center-head) h1 { margin: 0; color: var(--dash-text); font-size: clamp(26px,2.5vw,36px); line-height: 1.5; }
body.dashboard-page :is(.section-header,.library-toolbar,.billing-page-head,.user-settings-heading,.notification-center-head) p { margin: 6px 0 0; font-size: 14px; color: var(--dash-muted); }
body.dashboard-page :is(.eyebrow,.overview-kicker) { color: var(--dash-purple); font-size: 12px; }

body.dashboard-page #overview .overview-hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.48fr); align-items: center; gap: 24px; min-height: 0; margin: 0 0 20px; padding: 28px; overflow: hidden; border: 1px solid #3b3555; border-radius: 24px; background: radial-gradient(ellipse at 70% 0,#9d8cff1c,transparent 60%),var(--dash-surface) !important; }
body.dashboard-page #overview .overview-hero::before, body.dashboard-page #overview .overview-hero::after { content: none; }
body.dashboard-page #overview h1 { margin: 8px 0; font-size: clamp(26px,2.8vw,40px); line-height: 1.5; }
body.dashboard-page #overview h1 span { color: var(--dash-cyan); }
body.dashboard-page #overview .overview-hero .muted { margin: 0; font-size: 14px; }
body.dashboard-page #overviewRewards { min-height: 0; padding: 18px; border: 1px solid var(--dash-line); border-radius: 16px; background: var(--dash-surface-2); box-shadow: none; }
body.dashboard-page #overview .overview-primary-grid { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 20px; margin: 0 0 20px; }
body.dashboard-page #overview .overview-primary-grid>.panel { min-height: 0; margin: 0; padding: 24px; }
body.dashboard-page #overview .creation-quick-panel { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; background: radial-gradient(ellipse at 100% 0,#9d8cff1f,transparent 70%),var(--dash-surface) !important; }
body.dashboard-page #overview .creation-quick-panel h2 { margin: 8px 0; max-width: 460px; font-size: clamp(24px,2.2vw,32px); line-height: 1.6; }
body.dashboard-page #overview .creation-quick-panel p { margin: 0; color: var(--dash-muted); font-size: 14px; }
body.dashboard-page #overview .creation-quick-button { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 48px; padding: 12px 20px; border-radius: 12px; }
body.dashboard-page #overview .creation-quick-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
body.dashboard-page #overview .panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin: 0 0 18px; }
body.dashboard-page #overview .panel-heading h2 { margin: 4px 0; font-size: 20px; }
body.dashboard-page #overview .panel-heading p { margin: 0; font-size: 12px; color: var(--dash-muted); }
body.dashboard-page #overview .activity-list { display: grid; gap: 8px; }
body.dashboard-page #overview .activity { display: grid; grid-template-columns: 24px minmax(0,1fr) auto; align-items: center; gap: 10px; min-width: 0; min-height: 72px; padding: 10px 12px; border: 1px solid var(--dash-line); border-radius: 12px; background: var(--dash-surface-2); }
body.dashboard-page #overview .activity-main { display: flex; align-items: center; gap: 8px; min-width: 0; }
body.dashboard-page #overview .activity-main strong { flex: 1; }
body.dashboard-page #overview .activity-status { flex: none; font-size: 12px; color: var(--dash-muted); }
body.dashboard-page #overview .activity-order { color: var(--dash-subtle); font-size: 12px; }
body.dashboard-page #overview .activity-action { min-height: 44px; padding: 8px 10px; border: 1px solid var(--dash-line); border-radius: 10px; background: var(--dash-surface); color: var(--dash-purple); white-space: nowrap; }
body.dashboard-page #overview .activity-copy small { display: block; margin-top: 3px; color: var(--dash-subtle); }
body.dashboard-page #overview .activity :is(b,strong) { font-size: 13px; }
body.dashboard-page #overview .activity :is(p,small,time,button,a) { font-size: 12px; }
body.dashboard-page #overview .activity>div { min-width: 0; }
body.dashboard-page #overview .activity :is(b,strong) { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.dashboard-page #overview .overview-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 0 0 20px; }
body.dashboard-page #overview .stat-card { display: flex; align-items: center; gap: 14px; min-height: 0; padding: 16px 20px; border: 1px solid var(--dash-line); border-radius: 16px; background: var(--dash-surface) !important; box-shadow: none; }
body.dashboard-page #overview .stat-icon { width: 40px; height: 40px; border-radius: 12px; background: #9d8cff19; color: var(--dash-purple); }
body.dashboard-page #overview .stat-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
body.dashboard-page #overview .stat-card :is(span,small) { color: var(--dash-muted); font-size: 12px; }
body.dashboard-page #overview .stat-card strong { font-size: 22px; color: var(--dash-text); }
body.dashboard-page #overview .overview-secondary-grid { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 20px; }
body.dashboard-page #overview .overview-secondary-grid>.panel { grid-column: span 4; min-height: 0; margin: 0; padding: 24px; }
body.dashboard-page #overview .overview-secondary-grid>.kids-spotlight { grid-column: span 7; display: grid; grid-template-columns: minmax(0,1fr) 100px; align-items: center; gap: 20px; border-color: #675039 !important; background: radial-gradient(ellipse at 0 50%,#f4b86a19,transparent 65%),#1b1820 !important; }
body.dashboard-page #overview .kids-spotlight img { width: 100px; height: 100px; border-radius: 24px; }
body.dashboard-page #overview .product-spotlight-copy>span { color: var(--dash-kids); font-size: 13px; font-weight: 800; }
body.dashboard-page #overview .overview-secondary-grid>.social-spotlight { grid-column: span 5; border-color: #305365 !important; background: radial-gradient(ellipse at 0 0,#69d4e717,transparent 65%),var(--dash-surface) !important; }
body.dashboard-page #overview .overview-secondary-grid h2 { margin: 8px 0; font-size: 22px; line-height: 1.6; }
body.dashboard-page #overview .overview-secondary-grid p { margin: 0 0 16px; font-size: 14px; color: var(--dash-muted); }
body.dashboard-page #overview .overview-secondary-grid a { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--dash-line-strong); border-radius: 11px; color: var(--dash-purple); font-size: 13px; text-decoration: none; }
body.dashboard-page #overview .product-spotlight-actions { display: flex; flex-wrap: wrap; gap: 8px; }
body.dashboard-page #overview .kids-spotlight .product-spotlight-actions a:first-child { border-color: transparent; background: var(--dash-kids); color: #261b10; font-weight: 800; }
body.dashboard-page #overview :is(.feedback-panel,.tip-panel) { display: block; }
body.dashboard-page #overview :is(.feedback-panel::after,.tip-panel::after,.feedback-orb,.tip-glow) { display: none; }
body.dashboard-page #overview :is(.usage-meta,.usage-progress-heading) { font-size: 12px; color: var(--dash-muted); }

body.dashboard-page #create[data-mode=choose] :is(.creation-hub-catalog,.creation-hub-intro,.creation-hub-selection,.creation-hub-grid,.creation-future-grid) { width: 100%; max-width: none; margin-inline: 0; }
body.dashboard-page #create .creation-hub-intro { min-height: 0; padding: 28px; margin-bottom: 20px; }
body.dashboard-page #create :is(.creation-hub-grid,.creation-future-grid) { gap: 16px; }
body.dashboard-page #create :is(.creation-choice,.creation-hub-card,.creation-future-card) { padding: 22px; }
body.dashboard-page #create :is(.creation-choice,.creation-hub-card) p { font-size: 14px; color: var(--dash-muted); }
body.dashboard-page #create :is(.creation-choice,.creation-hub-card) h3 { font-size: 20px; }

body.dashboard-page #projects :is(.library-shell,.library-grid,.library-summary,.library-toolbar,.library-controlbar) { width: 100%; max-width: none; margin-inline: 0; }
body.dashboard-page #projects .library-shell::before { content: none; }
body.dashboard-page #projects .library-summary { gap: 12px; margin-bottom: 20px; }
body.dashboard-page #projects .library-summary button { min-height: 76px; border: 1px solid var(--dash-line); border-radius: 14px; background: var(--dash-surface); color: var(--dash-muted); box-shadow: none; }
body.dashboard-page #projects .library-summary button.active { border-color: #7668b0; background: #25233c; color: var(--dash-text); }
body.dashboard-page #projects .library-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(min(100%,300px),1fr)); grid-auto-rows: auto; align-items: start; gap: 20px; }
body.dashboard-page #projects .library-card { position: relative; display: flex; flex-direction: column; align-self: start; width: 100%; max-width: none; height: auto; min-height: 0; margin: 0; padding: 16px; overflow: hidden; border: 1px solid var(--dash-line); border-radius: 18px; background: var(--dash-surface) !important; box-shadow: none; }
body.dashboard-page #projects .library-card:hover { border-color: #7668b0; transform: none; }
body.dashboard-page #projects .card-accent { inset: 0 22px auto; height: 2px; }
body.dashboard-page #projects .library-card-image { position: relative; display: grid; place-items: center; width: 100%; height: auto; min-height: 0; aspect-ratio: 16/9; margin: 0 0 16px; padding: 0; overflow: hidden; border: 1px solid var(--dash-line); border-radius: 12px; background: linear-gradient(135deg,#1e263d,#172333); box-shadow: none; }
body.dashboard-page #projects .library-card-image::before { content: none; }
body.dashboard-page #projects .library-cover { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; border: 0; border-radius: 0; object-fit: cover; }
body.dashboard-page #projects .library-card-image:has(.library-cover:not(.is-loading):not(.is-unavailable)) .library-card-placeholder { visibility: hidden; }
body.dashboard-page #projects .library-card-placeholder { width: 40px; height: 40px; color: var(--dash-purple); }
body.dashboard-page #projects .library-card-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; padding: 0; }
body.dashboard-page #projects .library-type { display: inline-flex; align-items: center; gap: 6px; padding: 0; background: transparent; color: var(--dash-muted); font-size: 12px; }
body.dashboard-page #projects .library-card-tags { display: flex; align-items: center; gap: 8px; }
body.dashboard-page #projects .library-card :is(time,.library-branding-tag) { font-size: 12px; color: var(--dash-subtle); }
body.dashboard-page #projects .library-card-body { display: flex; flex-direction: column; flex: none; padding: 0; }
body.dashboard-page #projects .library-card h3 { height: auto; min-height: 0; margin: 0 0 10px; color: var(--dash-text); font-size: 18px; line-height: 1.8; }
body.dashboard-page #projects .card-title-action { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; width: 100%; min-height: 44px; margin: 0; padding: 0; overflow: hidden; border: 0; background: transparent; color: inherit; font: inherit; text-align: inherit; white-space: normal; overflow-wrap: anywhere; }
body.dashboard-page #projects .card-state-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
body.dashboard-page #projects .card-status { padding: 4px 9px; border: 1px solid #326b58; border-radius: 99px; background: #112c26; color: #87e5bc; font-size: 12px; }
body.dashboard-page #projects .card-status.pending { border-color: #3d6c7a; background: #142c38; color: #90def1; }
body.dashboard-page #projects .card-status.review { border-color: #77663d; background: #302a1d; color: var(--dash-warning); }
body.dashboard-page #projects .card-status.failed { border-color: #7d4056; background: #321c29; color: var(--dash-danger); }
body.dashboard-page #projects .card-description { min-height: 0; margin: 12px 0; color: var(--dash-muted); font-size: 13px; line-height: 1.8; }
body.dashboard-page #projects .library-details { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0,1fr); gap: 0; margin: 0; padding: 12px 0; border-block: 1px solid var(--dash-line); }
body.dashboard-page #projects .library-detail { display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 0; padding: 6px 8px; border: 0; border-inline-start: 1px solid var(--dash-line); border-radius: 0; background: transparent; box-shadow: none; text-align: center; }
body.dashboard-page #projects .library-detail:first-child { border-inline-start: 0; }
body.dashboard-page #projects .library-detail>i { color: var(--dash-cyan); background: transparent; }
body.dashboard-page #projects .library-detail :is(small,strong) { display: block; font-size: 12px; line-height: 1.7; white-space: normal; overflow-wrap: anywhere; }
body.dashboard-page #projects .library-detail small { color: var(--dash-subtle); }
body.dashboard-page #projects .library-detail strong { color: var(--dash-text); }
body.dashboard-page #projects .card-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; min-height: 0; margin-top: 16px; padding: 0; border: 0; }
body.dashboard-page #projects :is(.card-main-action,.card-secondary-actions) { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
body.dashboard-page #projects :is(.card-icon-button,.card-delete,.card-listen,.community-publish-button) { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; width: 44px; height: 44px; border: 1px solid var(--dash-line); border-radius: 11px; background: var(--dash-surface-2); color: var(--dash-muted); box-shadow: none; }
body.dashboard-page #projects .card-listen { border-color: #7668b0; background: #30294a; color: #e1daff; }
body.dashboard-page #projects .card-delete { width: 32px; min-width: 32px; height: 44px; border: 0; background: transparent; }
body.dashboard-page #projects .card-delete:hover { color: var(--dash-danger); }
body.dashboard-page #projects .card-review.card-primary-action { width: auto; padding: 8px 14px; gap: 8px; color: var(--dash-warning); }
body.dashboard-page #projects .project-pipeline { margin-top: 12px; padding: 12px; border: 1px solid var(--dash-line); border-radius: 12px; background: var(--dash-surface-2); }
body.dashboard-page #projects .project-pipeline header { display: flex; justify-content: space-between; font-size: 12px; }
body.dashboard-page #projects .project-pipeline ol { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 5px; margin: 12px 0 0; padding: 0; list-style: none; }
body.dashboard-page #projects .project-pipeline li { display: grid; justify-items: center; gap: 6px; color: var(--dash-muted); font-size: 12px; }
body.dashboard-page #projects .project-pipeline li i { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--dash-line-strong); border-radius: 50%; }
body.dashboard-page #projects .project-pipeline li.done { color: var(--dash-green); }
body.dashboard-page #projects .project-pipeline li.current { color: var(--dash-cyan); }

body.dashboard-page #branding .branding-dashboard-shell { min-height: 0; padding: 0; border: 0; background: transparent !important; }
body.dashboard-page #branding .brand-profiles-head { padding: 24px; margin-bottom: 20px; border: 1px solid var(--dash-line); border-radius: 18px; background: var(--dash-surface) !important; box-shadow: none; }
body.dashboard-page #branding .brand-profiles-head h2 { font-size: 28px; }
body.dashboard-page #branding .brand-profiles-head p { font-size: 14px; color: var(--dash-muted); }
body.dashboard-page #branding .brand-profiles-layout { display: block; margin: 0; }
body.dashboard-page #branding .brand-profile-list { display: grid; grid-template-columns: repeat(auto-fill,minmax(min(100%,290px),1fr)); gap: 20px; }
body.dashboard-page #branding .brand-profile-item { min-height: 0; height: auto; border-color: var(--dash-line); background: var(--dash-surface) !important; box-shadow: none; }
body.dashboard-page #branding .brand-profile-item.active { border-color: #7668b0; }
body.dashboard-page #branding .brand-profile-item h3 { font-size: 18px; }
body.dashboard-page #branding .brand-profile-item :is(p,small,.brand-profile-description,.brand-profile-toggle) { color: var(--dash-muted); font-size: 13px; }
body.dashboard-page #branding .brand-profile-actions { padding: 12px 16px; border-color: var(--dash-line); background: var(--dash-surface-2); }
body.dashboard-page #branding :is(.brand-profile-actions button,.brand-profiles-head button,.brand-profile-editor button,.brand-logo-file) { min-height: 44px; padding: 8px 14px; border: 1px solid var(--dash-line-strong); border-radius: 10px; background: var(--dash-surface-2); color: var(--dash-text); font-size: 13px; }
body.dashboard-page #branding .brand-profile-dialog, body.dashboard-page #branding .brand-profile-dialog .brand-profile-editor { background: var(--dash-surface) !important; border-color: var(--dash-line-strong); color: var(--dash-text); }
body.dashboard-page #branding .brand-profile-editor>header, body.dashboard-page #branding .brand-profile-editor>footer { background: var(--dash-surface-2); border-color: var(--dash-line); }
body.dashboard-page #branding :is(.brand-visual-identity,.brand-font-identity) { padding: 18px; border-color: var(--dash-line); border-radius: 14px; background: var(--dash-bg); }
body.dashboard-page #branding .brand-profile-fields :is(label,strong) { font-size: 14px; color: var(--dash-text); }
body.dashboard-page #branding .brand-profile-fields :is(small,p) { color: var(--dash-muted); font-size: 12px; }
body.dashboard-page #branding .brand-logo-surface[data-logo-surface=light] :is(strong,small) { color: #263139; }

body.dashboard-page #settings { width: 100%; max-width: 1240px; margin-inline: auto; }
body.dashboard-page #settings :is(.user-settings-shell,.user-settings-layout) { width: 100%; max-width: none; margin-inline: 0; }
body.dashboard-page #settings .user-settings-layout { grid-template-columns: 240px minmax(0,1fr); gap: 20px; }
body.dashboard-page #settings .user-settings-content { min-height: 0; }
body.dashboard-page #settings :is(.user-settings-nav,.settings-content-head,.settings-card) { border: 1px solid var(--dash-line); background: var(--dash-surface) !important; box-shadow: none; }
body.dashboard-page #settings .user-settings-nav button.active { background: #25233c; border-color: #7668b0; box-shadow: none; }
body.dashboard-page #settings :is(.settings-meta-row>div,.settings-switch,.settings-duration-options label>span) { background: var(--dash-surface-2); border-color: var(--dash-line); }
body.dashboard-page #settings :is(label,.settings-content-head p,.settings-field-label,.settings-switch strong,.user-settings-nav strong) { font-size: 14px; }
body.dashboard-page #settings :is(small,.settings-meta-row span,.settings-meta-row strong,.settings-content-head>div>span) { color: var(--dash-muted); font-size: 12px; }
body.dashboard-page #settings .settings-card { max-width: 100%; }
body.dashboard-page #settings .settings-content-head h2 { font-size: 22px; }
body.dashboard-page #settings .settings-meta-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
body.dashboard-page #settings .settings-meta-row>div { min-width: 0; flex-wrap: wrap; gap: 8px; }
body.dashboard-page #settings .settings-content-head { padding: 22px 24px; }
body.dashboard-page #settings .settings-card { padding: 22px 24px; }
body.dashboard-page #settings .settings-security-head .settings-security-badge.safe { display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border: 1px solid #315c4d; border-radius: 999px; background: #172820; color: #7fe0b8; }
body.dashboard-page #settings :is(.settings-security-head .settings-security-badge.safe>i,.settings-security-state>i,.settings-device-status>i) { width: 7px; height: 7px; border-radius: 50%; background: #61d6a5; box-shadow: 0 0 0 4px #61d6a51a; }
body.dashboard-page #settings .settings-session-overview { display: grid; grid-template-columns: 50px minmax(0,1fr) auto; align-items: center; gap: 14px; margin-top: 14px; padding: 18px 20px; border: 1px solid #314039; border-radius: 14px; background: linear-gradient(135deg,#18231f,#151c1a); }
body.dashboard-page #settings .settings-session-overview-icon { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #315746; border-radius: 12px; background: #1c3028; color: #74d8ae; }
body.dashboard-page #settings .settings-session-overview-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.dashboard-page #settings .settings-session-overview :is(span,strong,small) { display: block; }
body.dashboard-page #settings .settings-session-overview strong { margin-top: 3px; color: var(--dash-text); font-size: 17px; }
body.dashboard-page #settings .settings-session-overview small { margin-top: 4px; color: var(--dash-muted); font-size: 12px; }
body.dashboard-page #settings .settings-security-state { display: inline-flex !important; align-items: center; gap: 7px; padding: 7px 10px; border: 1px solid #315746; border-radius: 999px; background: #1c3028; color: #80dcb6; font-size: 11px; font-weight: 800; }
body.dashboard-page #settings .settings-devices-card { margin-top: 14px; padding: 0; overflow: hidden; }
body.dashboard-page #settings .settings-devices-card>header, body.dashboard-page #settings .settings-devices-card>footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; }
body.dashboard-page #settings .settings-devices-card>header { border-bottom: 1px solid var(--dash-line); }
body.dashboard-page #settings .settings-devices-card>footer { border-top: 1px solid var(--dash-line); background: var(--dash-surface-2); }
body.dashboard-page #settings .settings-devices-card :is(h3,p) { margin: 0; }
body.dashboard-page #settings .settings-devices-card header p, body.dashboard-page #settings .settings-devices-card footer small { display: block; margin-top: 4px; color: var(--dash-muted); font-size: 12px; }
body.dashboard-page #settings .settings-device-list { display: grid; }
body.dashboard-page #settings .settings-device-row { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; align-items: center; gap: 14px; min-height: 94px; padding: 16px 20px; border-bottom: 1px solid var(--dash-line); background: var(--dash-surface); }
body.dashboard-page #settings .settings-device-row:last-child { border-bottom: 0; }
body.dashboard-page #settings .settings-device-row.current { background: linear-gradient(90deg,#1a2822,var(--dash-surface) 55%); box-shadow: inset -3px 0 #5fc999; }
body.dashboard-page #settings .settings-device-icon { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--dash-line-strong); border-radius: 11px; background: var(--dash-surface-3); color: var(--dash-muted); }
body.dashboard-page #settings .settings-device-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
body.dashboard-page #settings .settings-device-title { display: flex; align-items: center; gap: 8px; }
body.dashboard-page #settings .settings-current-device { padding: 3px 7px; border: 1px solid #315746; border-radius: 999px; background: #1d3028; color: #78d4ad; font-size: 10px; font-weight: 800; }
body.dashboard-page #settings .settings-device-main p { margin: 4px 0 7px; color: var(--dash-muted); font-size: 12px; }
body.dashboard-page #settings .settings-device-meta { display: flex; flex-wrap: wrap; gap: 8px 16px; color: var(--dash-muted); font-size: 11px; }
body.dashboard-page #settings .settings-device-status { display: inline-flex; align-items: center; gap: 7px; color: #79d1ac; font-size: 11px; font-weight: 800; }
body.dashboard-page #settings .settings-device-revoke { min-height: 38px; padding: 8px 12px; border: 1px solid #744956; border-radius: 9px; background: #312127; color: #f1acb9; cursor: pointer; }
body.dashboard-page #settings .settings-private-badge { padding: 5px 9px; border: 1px solid #3e5d70; border-radius: 999px; background: #182a35; color: #8fd7ef; font-size: 11px; }
body.dashboard-page #settings :is(.settings-export-card,.settings-danger-card)>header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
body.dashboard-page #settings :is(.settings-export-card,.settings-danger-card)>header :is(h3,p) { margin: 0; }
body.dashboard-page #settings :is(.settings-export-card,.settings-danger-card)>header p { margin-top: 5px; color: var(--dash-muted); font-size: 12px; line-height: 1.8; }
body.dashboard-page #settings .settings-export-empty, body.dashboard-page #settings .settings-export-result { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px; border: 1px solid var(--dash-line); border-radius: 13px; background: var(--dash-surface-2); }
body.dashboard-page #settings .settings-export-empty>span { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 12px; background: #27213d; color: var(--dash-purple); font-size: 12px; font-weight: 900; }
body.dashboard-page #settings :is(.settings-export-empty,.settings-export-result) :is(strong,small) { display: block; }
body.dashboard-page #settings :is(.settings-export-empty,.settings-export-result) small { margin-top: 4px; color: var(--dash-muted); }
body.dashboard-page #settings .settings-export-result.ready { border-color: #315746; background: #17241f; }
body.dashboard-page #settings .settings-export-result.error { border-color: #714654; background: #2b1d23; }
body.dashboard-page #settings .settings-export-progress { padding: 16px; border: 1px solid var(--dash-line); border-radius: 13px; background: var(--dash-surface-2); }
body.dashboard-page #settings .settings-export-progress>div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
body.dashboard-page #settings .settings-export-progress progress { width: 100%; height: 8px; margin: 13px 0 8px; overflow: hidden; border: 0; border-radius: 99px; accent-color: var(--dash-purple); }
body.dashboard-page #settings .settings-export-progress small { color: var(--dash-muted); }
body.dashboard-page #settings .settings-export-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 16px; }
body.dashboard-page #settings .settings-export-actions small { color: var(--dash-muted); }
body.dashboard-page #settings .settings-danger-card { margin-top: 16px; border-color: #65404b; }
body.dashboard-page #settings .settings-danger-card>header>span { padding: 5px 9px; border: 1px solid #744956; border-radius: 999px; background: #312127; color: #f1acb9; font-size: 11px; white-space: nowrap; }
body.dashboard-page #settings .settings-danger-warning { padding: 14px 16px; border: 1px solid #65404b; border-radius: 12px; background: #291c21; }
body.dashboard-page #settings .settings-danger-warning :is(strong,small) { display: block; }
body.dashboard-page #settings .settings-danger-warning small { margin-top: 5px; color: #c99ca6; }
body.dashboard-page #settings .settings-delete-step { display: flex; align-items: center; gap: 14px; margin-top: 16px; }
body.dashboard-page #settings [data-delete-account] { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--dash-line); }
body.dashboard-page #settings .settings-danger-confirm { display: flex; align-items: center; gap: 10px; margin-top: 15px; }
body.dashboard-page #settings .settings-danger-confirm input { width: 18px; height: 18px; margin: 0; accent-color: #d76982; }
body.dashboard-page #settings .danger-btn { min-height: 42px; padding: 9px 15px; border: 1px solid #804b59; border-radius: 10px; background: #482631; color: #ffd5dd; font: inherit; font-weight: 800; cursor: pointer; }
body.dashboard-page #settings .danger-btn:hover:not(:disabled) { border-color: #a85d70; background: #5b2d3a; }
body.dashboard-page #settings :is(.danger-btn,.primary-btn,.secondary-btn):disabled { opacity: .5; cursor: not-allowed; }

body.dashboard-page #notifications-center :is(.notification-center-shell,.notification-center-head,.notification-center-toolbar,.notification-center-list) { width: 100%; max-width: none; margin-inline: 0; }
body.dashboard-page #notifications-center .notification-center-toolbar { padding: 14px; border: 1px solid var(--dash-line); border-radius: 14px; background: var(--dash-surface); }
body.dashboard-page #notifications-center .notification-center-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; gap: 16px; }
body.dashboard-page #notifications-center .notification-center-item { padding: 22px; border: 1px solid var(--dash-line); border-radius: 16px; background: var(--dash-surface) !important; box-shadow: none; }
body.dashboard-page #notifications-center .notification-center-item.unread { border-inline-start: 3px solid var(--dash-purple); background: #16192a !important; }
body.dashboard-page #notifications-center .notification-center-item :is(strong,h3) { color: var(--dash-text); font-size: 16px; }
body.dashboard-page #notifications-center .notification-center-item :is(p,.notification-message) { color: var(--dash-muted); font-size: 14px; line-height: 1.9; }
body.dashboard-page #notifications-center .notification-center-item :is(time,small) { font-size: 12px; color: var(--dash-subtle); }
body.dashboard-page #notifications-center button { min-height: 44px; font-size: 13px; }

body.dashboard-page #billing :is(.billing-overview,.billing-plan-grid,.billing-page-head,.billing-plans-section,.billing-ledger) { width: 100%; max-width: none; margin-inline: 0; }
body.dashboard-page #billing :is(.billing-balance-hero,.summary-card,.billing-plan-card,.invoice-row,.ledger-row) { border: 1px solid var(--dash-line); border-radius: 16px; background: var(--dash-surface) !important; box-shadow: none; }
body.dashboard-page #billing .billing-plan-card.featured { border-color: #7668b0; background: linear-gradient(150deg,#25233c,var(--dash-surface)) !important; }
body.dashboard-page #billing :is(.balance-details>div,.plan-gem,.invoice-mark) { background: var(--dash-surface-2); border-color: var(--dash-line); }
body.dashboard-page #billing :is(.billing-rate,.billing-plan-card p,.billing-plan-card li,.billing-trust-row,.summary-card small,.summary-card span) { color: var(--dash-muted); font-size: 13px; }
body.dashboard-page #billing .plan-price strong { font-size: clamp(22px,2vw,30px); overflow-wrap: anywhere; }
body.dashboard-page #billing .plan-purchase-button { width: 100%; font-size: 13px; }

body.dashboard-page #developers .dev-portal { width: 100%; max-width: none; padding: 28px; border: 1px solid var(--dash-line); border-radius: 20px; background: var(--dash-surface); }
body.dashboard-page #developers .dev-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
body.dashboard-page #developers :is(.dev-card,.dev-stat,.dev-step>div) { min-width: 0; }
body.dashboard-page #developers .dev-tabs { min-width: 0; max-width: 100%; }
body.dashboard-page #developers :is(.dev-card,.dev-stat,.dev-code,.dev-notice) { border-color: var(--dash-line); background: var(--dash-surface-2); box-shadow: none; }
body.dashboard-page #developers :is(.dev-card p,.dev-hero p,.dev-notice) { font-size: 14px; color: var(--dash-muted); }
body.dashboard-page #developers :is(.dev-stat small,.dev-step b,.dev-tabs button) { font-size: 13px; }
body.dashboard-page #developers .dev-code { max-width: 100%; overflow: auto; background: var(--dash-bg); color: #d4dbed; font-size: 13px; }
body.dashboard-page #rewards :is(.rewards-panel,.reward-mission,.reward-play,.reward-achievement) { border-color: var(--dash-line); background-color: var(--dash-surface); box-shadow: none; }
body.dashboard-page #rewards .rewards-panel { width: 100%; max-width: none; }
body.dashboard-page #affiliate :is(.affiliate-shell,.affiliate-card,.affiliate-hero,.affiliate-share-card,.affiliate-stat,.affiliate-reward-note) { border-color: var(--dash-line); background: var(--dash-surface) !important; box-shadow: none; }
body.dashboard-page #affiliate :is(.affiliate-shell,.affiliate-card) { width: 100%; max-width: none; }
body.dashboard-page #affiliate .promotion-panel { --promo-bg: var(--dash-surface); --promo-field: var(--dash-bg); --promo-line: var(--dash-line); --promo-text: var(--dash-text); --promo-muted: var(--dash-muted); --promo-accent: var(--dash-purple); width: 100%; max-width: none; border-color: var(--dash-line); background: var(--dash-surface); box-shadow: none; }
body.dashboard-page #affiliate :is(.promotion-stats article,.affiliate-share-card,.affiliate-reward-note,.affiliate-advanced,.promotion-rules) { border-color: var(--dash-line); background: var(--dash-surface-2); }
body.dashboard-page #affiliate :is(p,label,.promotion-stats small) { color: var(--dash-muted); font-size: 14px; }
body.dashboard-page #affiliate :is(button,.promotion-panel .promotion-primary) { min-height: 44px; font-size: 13px; }
body.dashboard-page #affiliate .promotion-panel button { border-color: var(--dash-line-strong); background: var(--dash-surface-2); color: var(--dash-text); }
body.dashboard-page #affiliate .promotion-panel .promotion-primary { border-color: #7668b0; background: #30294a; color: #e1daff; }
body.dashboard-page #tickets-center :is(.ticket-row,.ticket-thread,.ticket-list,.ticket-composer,.ticket-form-card) { border-color: var(--dash-line); background: var(--dash-surface); }
body.dashboard-page :is(.notifications-panel,.profile-menu,.hero-credit-popover) { border-color: var(--dash-line-strong); background: var(--dash-surface); color: var(--dash-text); }

body.dashboard-page :is(dialog,.media-dialog,.review-dialog,.billing-confirm-dialog) { border: 1px solid var(--dash-line-strong); background: var(--dash-surface); color: var(--dash-text); box-shadow: 0 24px 90px #0008; }
body.dashboard-page dialog::backdrop, body.dashboard-page .media-backdrop { background: #050812cc; backdrop-filter: blur(10px); }
body.dashboard-page .media-dialog { width: min(1180px,100%); border-radius: 20px; }
body.dashboard-page :is(.media-header,.media-tabs,.media-workspace-panel,.media-player,.media-action,.media-detail-facts>div,.media-text-wrap,.project-music-panel,.billing-confirm-inner,.billing-confirm-plan,.billing-confirm-total) { border-color: var(--dash-line); background: var(--dash-surface-2); box-shadow: none; }
body.dashboard-page .media-dialog :is(.media-tab,.media-section-tab) { border-color: var(--dash-line); background: var(--dash-surface-2); color: var(--dash-muted); }
body.dashboard-page .media-dialog [role=tab][aria-selected=true] { border-color: #7668b0; background: #25233c; color: var(--dash-purple); box-shadow: none; }
body.dashboard-page .media-dialog :is(h1,h2,h3,strong) { color: var(--dash-text); }
body.dashboard-page .media-dialog :is(p,small,time,.media-subtitle) { color: var(--dash-muted); font-size: 13px; }
body.dashboard-page .media-dialog :is(button,a) { min-height: 44px; font-size: 13px; }
body.dashboard-page .media-player { background: var(--dash-bg); }
body.dashboard-page .media-player input[type=range] { background: var(--dash-surface-3); }
body.dashboard-page .media-close { border-color: var(--dash-line); background: var(--dash-surface-2); color: var(--dash-text); }
body.dashboard-page .media-section-nav>button { border-color: var(--dash-line); background: var(--dash-surface-2); color: var(--dash-muted); }
body.dashboard-page .media-section-nav>button:is(:hover,.active) { border-color: #7668b0; background: #25233c; color: var(--dash-purple); box-shadow: none; }
body.dashboard-page .media-audio-panel .media-player { background: var(--dash-bg); border-color: var(--dash-line); }
body.dashboard-page :is(.media-panel-actions,.media-text-actions) .media-action { border-color: var(--dash-line); background: var(--dash-surface-2); color: var(--dash-text); }
body.dashboard-page .media-dialog :is(.podly-music-details,.media-fact) { background: var(--dash-surface); border-color: var(--dash-line); }
body.dashboard-page #projectReviewDialog { border-color: var(--dash-line-strong); background: var(--dash-surface); }
body.dashboard-page #projectReviewDialog :is(.review-dialog-head,.review-dialog-actions) { background: var(--dash-surface-2); border-color: var(--dash-line); }
body.dashboard-page #projectReviewDialog .review-dialog-head .secondary-btn { border-color: var(--dash-line-strong) !important; background: var(--dash-surface-2) !important; color: var(--dash-text) !important; }
body.dashboard-page #projectReviewDialog .review-dialog-form textarea { border-color: var(--dash-line-strong) !important; background: var(--dash-bg) !important; color: var(--dash-text) !important; }
body.dashboard-page #projectReviewDialog .review-dialog-actions [data-approve] { background: linear-gradient(120deg,#c3b8ff,#8bddeb) !important; color: #121525 !important; border-color: transparent !important; }
body.dashboard-page .beta-label { padding: 2px 7px; border: 1px solid #7668b0; border-radius: 99px; color: var(--dash-purple); font-size: 12px; font-style: normal; }
body.dashboard-page .field-help { display: block; margin-top: 7px; color: var(--dash-muted); font-size: 12px; }
body.dashboard-page .workspace-team-soon { opacity: .6; cursor: not-allowed; }
body.dashboard-page .podly-skeleton { background: var(--dash-surface-3); }
body.dashboard-page :is(.podly-project-boot-card,.podly-project-boot-summary>div,.podly-dashboard-boot-generic>span) { background: var(--dash-surface); border-color: var(--dash-line); }
body.dashboard-page .podly-project-boot-card { min-height: 420px; }
body.dashboard-page .toast { position: fixed !important; z-index: 220; right: auto; left: 24px; top: auto; bottom: 24px; width: auto; max-width: min(420px,calc(100vw - 48px)); min-height: 0; padding: 14px 18px; border: 1px solid #326b58; border-radius: 14px; background: #10271f; color: #d9f8eb; box-shadow: 0 18px 50px #0007; }
body.dashboard-page .toast strong { font-size: 14px; }
body.dashboard-page .toast small { color: inherit; font-size: 12px; }
body.dashboard-page .toast.error { border-color: #7d4056; background: #321c29; color: #ffd9e0; }
body.dashboard-page .toast.error>span { color: var(--dash-danger); }

@media(min-width:761px) {
  html.sidebar-collapsed body.dashboard-page .sidebar { width: var(--dash-sidebar-collapsed) !important; }
  html.sidebar-collapsed body.dashboard-page .main-content { margin-right: var(--dash-sidebar-collapsed); }
  html.sidebar-collapsed body.dashboard-page .topbar { padding-inline: 32px; }
  html.sidebar-collapsed body.dashboard-page .sidebar :is(.brand,.workspace-switcher>.workspace-copy,.workspace-switcher .chevron,.nav-label,.nav-item b,.nav-item small,.nav-item em,.developer-sidebar-link b,.sidebar-action b) { display: none; }
  html.sidebar-collapsed body.dashboard-page .workspace-switcher { grid-template-columns: 1fr; padding: 4px; }
  html.sidebar-collapsed body.dashboard-page .sidebar :is(.nav-item,.developer-sidebar-link) { grid-template-columns: 1fr; justify-items: center; padding: 8px; }
  html.sidebar-collapsed body.dashboard-page .sidebar-actions { grid-template-columns: 1fr; }
}
@media(max-width:1180px) {
  body.dashboard-page #overview .overview-hero { grid-template-columns: 1fr; }
  body.dashboard-page #overview .overview-primary-grid { grid-template-columns: 1fr; }
  body.dashboard-page #overview .overview-secondary-grid>.panel { grid-column: span 6; }
  body.dashboard-page #overview .overview-secondary-grid>.kids-spotlight { grid-column: 1/-1; }
  body.dashboard-page #settings .user-settings-layout { grid-template-columns: 220px minmax(0,1fr); }
}

@media(max-width:760px) {
  body.dashboard-page #settings { max-width: 100%; }
  body.dashboard-page #settings .settings-content-head, body.dashboard-page #settings .settings-card { padding: 16px; }
  body.dashboard-page #settings :is(.settings-export-card,.settings-danger-card)>header, body.dashboard-page #settings :is(.settings-export-empty,.settings-export-result,.settings-export-actions,.settings-delete-step) { align-items: stretch; flex-direction: column; }
  body.dashboard-page #settings .settings-export-result .primary-btn, body.dashboard-page #settings .settings-export-actions .primary-btn, body.dashboard-page #settings .settings-delete-step .danger-btn { width: 100%; text-align: center; }
  body.dashboard-page #settings .settings-session-overview { grid-template-columns: 44px minmax(0,1fr); padding: 14px; }
  body.dashboard-page #settings .settings-security-state { grid-column: 1/-1; justify-self: stretch; justify-content: center; }
  body.dashboard-page #settings .settings-device-row { grid-template-columns: 40px minmax(0,1fr); gap: 10px; padding: 14px; }
  body.dashboard-page #settings :is(.settings-device-status,.settings-device-revoke) { grid-column: 1/-1; justify-self: stretch; justify-content: center; width: 100%; }
  body.dashboard-page #settings .settings-device-meta { align-items: flex-start; flex-direction: column; gap: 5px; }
  body.dashboard-page #settings .settings-devices-card>footer { align-items: stretch; flex-direction: column; }
  body.dashboard-page #settings .settings-devices-card>footer [data-revoke-sessions] { width: 100%; }
}
@media(min-width:761px) and (max-width:1050px) {
  body.dashboard-page #settings .user-settings-layout { grid-template-columns: 1fr; }
  body.dashboard-page #settings .user-settings-nav { position: static; grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width:1050px) {
  body.dashboard-page #developers .dev-grid { grid-template-columns: minmax(0,1fr); }
}
@media(max-width:760px) {
  body.dashboard-page .main-content { width: 100% !important; margin-right: 0 !important; padding: 0 16px 40px; }
  body.dashboard-page .sidebar { width: min(336px,90vw) !important; padding: 16px 14px max(14px,env(safe-area-inset-bottom)); transform: translateX(105%); }
  body.dashboard-page .sidebar.open { transform: none; }
  body.dashboard-page .sidebar-backdrop.open { display: block; position: fixed; inset: 0; z-index: 75; width: 100%; height: 100dvh; padding: 0; border: 0; background: #03050bb8; backdrop-filter: blur(5px); }
  html.sidebar-scroll-locked { overflow: hidden; }
  html.sidebar-scroll-locked body.dashboard-page { position: fixed; inset-inline: 0; top: var(--sidebar-lock-offset,0); width: 100%; }
  body.dashboard-page .sidebar-mobile-close { display: grid; place-items: center; position: absolute; top: 19px; left: 14px; width: 44px; height: 44px; border: 1px solid var(--dash-line); border-radius: 12px; background: var(--dash-surface-2); }
  body.dashboard-page .sidebar-mobile-close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
  body.dashboard-page .sidebar-collapse { display: none; }
  body.dashboard-page .sidebar .nav-item { min-height: 46px; }
  body.dashboard-page .topbar { min-height: 72px; gap: 10px; margin: 0 -16px 16px; padding: 10px 16px; }
  body.dashboard-page .mobile-menu { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border: 1px solid var(--dash-line); border-radius: 11px; background: var(--dash-surface); color: var(--dash-text); }
  body.dashboard-page .breadcrumb { min-width: 0; }
  body.dashboard-page .breadcrumb span { display: none; }
  body.dashboard-page .breadcrumb strong { font-size: 14px; }
  body.dashboard-page .top-primary-actions { display: none !important; }
  body.dashboard-page .top-actions { gap: 5px; }
  body.dashboard-page .top-account-actions { gap: 5px; }
  body.dashboard-page .top-actions :is(.icon-button,.user-menu,.dashboard-create-shortcut) { width: 44px !important; min-width: 44px !important; padding: 0 !important; }
  body.dashboard-page .top-actions .hero-credit-trigger { gap: 5px; max-width: clamp(76px,calc(100vw - 300px),140px) !important; padding-inline: 7px !important; }
  body.dashboard-page .top-actions .hero-credit-trigger > strong { font-size: 12px; }
  body.dashboard-page .top-account-actions .dashboard-circle-mobile { display: inline-flex !important; height: 44px; border-color: var(--dash-line); background: var(--dash-surface); }
  body.dashboard-page :is(.section-header,.library-toolbar,.billing-page-head,.user-settings-heading,.notification-center-head) { align-items: flex-start; gap: 14px; }
  body.dashboard-page #overview :is(.overview-primary-grid,.overview-secondary-grid) { grid-template-columns: 1fr; gap: 16px; }
  body.dashboard-page #overview .overview-secondary-grid>.panel { grid-column: auto; padding: 20px; }
  body.dashboard-page #overview .overview-hero { padding: 20px; gap: 20px; }
  body.dashboard-page #overview .overview-primary-grid>.panel { padding: 20px; }
  body.dashboard-page #overview .overview-stats { grid-template-columns: 1fr; gap: 8px; }
  body.dashboard-page #overview .stat-card { padding: 12px 16px; }
  body.dashboard-page #overview .stat-card small { display: none; }
  body.dashboard-page #overview .kids-spotlight { grid-template-columns: minmax(0,1fr) 64px; gap: 12px; }
  body.dashboard-page #overview .kids-spotlight img { width: 64px; height: 64px; border-radius: 16px; }
  body.dashboard-page #overview .overview-secondary-grid h2 { font-size: 20px; }
  body.dashboard-page #overview .panel-heading { flex-wrap: wrap; }
  body.dashboard-page #overview .activity { grid-template-columns: 20px minmax(0,1fr); }
  body.dashboard-page #overview .activity-action { grid-column: 2; justify-self: start; }
  body.dashboard-page #overview .activity-main { display: block; }
  body.dashboard-page #projects .library-summary { gap: 8px; }
  body.dashboard-page #projects .library-grid { grid-template-columns: 1fr; gap: 16px; }
  body.dashboard-page #settings .user-settings-layout { grid-template-columns: 1fr; }
  body.dashboard-page #notifications-center .notification-center-list { grid-template-columns: 1fr; }
  body.dashboard-page #developers .dev-portal { padding: 20px; }
  body.dashboard-page .media-dialog { max-height: calc(100dvh - 20px); border-radius: 16px; }
  body.dashboard-page .toast { right: 14px; left: 14px; top: 84px; bottom: auto; width: auto; max-width: none; }
}
@media(prefers-reduced-motion:reduce) {
  body.dashboard-page *, body.dashboard-page *::before, body.dashboard-page *::after { scroll-behavior: auto !important; transition: none !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* The desktop toggle lives in the header, never over the sidebar boundary. */
body.dashboard-page .topbar .sidebar-collapse { border-color: var(--dash-line); border-radius: 12px; background: var(--dash-surface); color: var(--dash-muted); padding: 10px; transform: none; }
body.dashboard-page .sidebar-collapse svg { display: block; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.dashboard-page .sidebar-collapse.is-collapsed svg { transform: scaleX(-1); }
body.dashboard-page .topbar .sidebar-collapse:hover { color: var(--dash-text); border-color: var(--dash-purple); background: var(--dash-surface-2); }
/* Mobile places toasts near the header, so a translated hidden toast is insufficient. */
body.dashboard-page .toast:not(.show) { visibility: hidden; opacity: 0; pointer-events: none; }
body.dashboard-page .toast.show { visibility: visible; opacity: 1; transform: none; }

/* Settings control center */
body.dashboard-page #settings {
  --settings-accent: #a997ff;
  --settings-accent-soft: #26223d;
  --settings-cyan-soft: #132a31;
  --settings-green-soft: #142b23;
  max-width: 1320px;
}
body.dashboard-page #settings .user-settings-shell { position: relative; }
body.dashboard-page #settings .user-settings-heading { position: relative; min-height: 118px; margin-bottom: 22px; padding: 24px 28px; overflow: hidden; border: 1px solid var(--dash-line); border-radius: 22px; background: radial-gradient(circle at 8% 10%,#44357455,transparent 36%),linear-gradient(135deg,#151a26,#0e121a); }
body.dashboard-page #settings .user-settings-heading::after { content: ''; position: absolute; inset: auto -8% -55% auto; width: 320px; aspect-ratio: 1; border: 1px solid #a997ff1f; border-radius: 50%; box-shadow: 0 0 0 42px #a997ff0a,0 0 0 84px #69d4e708; }
body.dashboard-page #settings .user-settings-heading>div { position: relative; z-index: 1; }
body.dashboard-page #settings .user-settings-heading .eyebrow { margin: 0 0 4px; color: var(--dash-purple); font-size: 12px; font-weight: 800; }
body.dashboard-page #settings .user-settings-heading h1 { margin: 0; font-size: clamp(26px,3vw,36px); letter-spacing: -.04em; }
body.dashboard-page #settings .user-settings-heading .muted { max-width: 620px; margin: 5px 0 0; font-size: 14px; }
body.dashboard-page #settings .settings-heading-art { position: absolute; z-index: 1; inset: 24px auto auto 28px; display: flex; align-items: end; gap: 8px; height: 66px; padding: 12px 15px; border: 1px solid #ffffff12; border-radius: 18px; background: #0b0f17aa; backdrop-filter: blur(12px); }
body.dashboard-page #settings .settings-heading-art span { width: 8px; border-radius: 99px; background: linear-gradient(#b9adff,#62d4e8); box-shadow: 0 0 18px #9b8cf366; }
body.dashboard-page #settings .settings-heading-art span:nth-child(1) { height: 22px; }
body.dashboard-page #settings .settings-heading-art span:nth-child(2) { height: 42px; }
body.dashboard-page #settings .settings-heading-art span:nth-child(3) { height: 30px; }
body.dashboard-page #settings .user-settings-layout { display: grid; grid-template-columns: 260px minmax(0,1fr); gap: 22px; align-items: start; }
body.dashboard-page #settings .user-settings-nav { position: sticky; top: 92px; display: grid; gap: 6px; padding: 9px; border-radius: 19px; }
body.dashboard-page #settings .user-settings-nav button { position: relative; display: grid; grid-template-columns: 40px minmax(0,1fr) 14px; align-items: center; gap: 11px; width: 100%; min-height: 68px; padding: 10px 11px; border: 1px solid transparent; border-radius: 13px; background: transparent; color: var(--dash-muted); text-align: right; transition: border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease; }
body.dashboard-page #settings .user-settings-nav button:hover { border-color: var(--dash-line); background: var(--dash-surface-2); color: var(--dash-text); transform: translateX(-2px); }
body.dashboard-page #settings .user-settings-nav button.active { border-color: #7567af; background: linear-gradient(135deg,#2c2947,#201f34); color: #fff; box-shadow: inset -3px 0 var(--settings-accent); }
body.dashboard-page #settings .user-settings-nav svg { width: 21px; height: 21px; margin: auto; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
body.dashboard-page #settings .user-settings-nav button>span { min-width: 0; }
body.dashboard-page #settings .user-settings-nav :is(strong,small) { display: block; }
body.dashboard-page #settings .user-settings-nav strong { color: inherit; font-size: 13px; }
body.dashboard-page #settings .user-settings-nav small { margin-top: 2px; overflow: hidden; color: var(--dash-subtle); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
body.dashboard-page #settings .user-settings-nav button>i { color: var(--dash-subtle); font-size: 19px; font-style: normal; }
body.dashboard-page #settings .settings-nav-dot { position: absolute; top: 10px; left: 10px; width: 7px; height: 7px; border-radius: 50%; background: var(--dash-warning); box-shadow: 0 0 0 4px #f5c67517; opacity: 0; transform: scale(.5); transition: .18s; }
body.dashboard-page #settings [data-settings-tab].is-dirty .settings-nav-dot { opacity: 1; transform: scale(1); }
body.dashboard-page #settings .user-settings-mobile-nav { display: none; }
body.dashboard-page #settings .user-settings-content { min-width: 0; }
body.dashboard-page #settings .settings-content-head { position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 126px; gap: 22px; margin-bottom: 14px; padding: 24px 26px; overflow: hidden; border-radius: 19px; background: radial-gradient(circle at 0 0,#43326755,transparent 43%),var(--dash-surface) !important; }
body.dashboard-page #settings .settings-content-head::after { content: ''; position: absolute; inset: 0 auto 0 0; width: 4px; background: linear-gradient(var(--settings-accent),var(--dash-cyan)); }
body.dashboard-page #settings .settings-content-head>div:first-child { position: relative; z-index: 1; min-width: 0; }
body.dashboard-page #settings .settings-content-head>div>span { color: var(--dash-purple); font-size: 12px; font-weight: 800; }
body.dashboard-page #settings .settings-content-head h2 { margin: 4px 0; color: var(--dash-text); font-size: clamp(22px,2.2vw,28px); line-height: 1.5; }
body.dashboard-page #settings .settings-content-head h2:focus { outline: none; }
body.dashboard-page #settings .settings-content-head p { max-width: 670px; margin: 0; color: var(--dash-muted); font-size: 13px; line-height: 1.9; }
body.dashboard-page #settings .settings-profile-mark { display: grid; place-items: center; flex: none; width: 66px; height: 66px; border: 1px solid #a997ff55; border-radius: 21px; background: linear-gradient(145deg,#9c75f2,#5437a2); color: #fff; font-size: 21px; font-weight: 900; box-shadow: 0 14px 34px #6f42c74d; }
body.dashboard-page #settings .settings-head-badge { display: inline-flex; align-items: center; flex: none; padding: 8px 12px; border: 1px solid #4b456f; border-radius: 999px; background: #24213a; color: #d5cdfd; font-size: 11px; font-weight: 800; }
body.dashboard-page #settings .settings-head-badge.private { border-color: #315969; background: #152832; color: #8cd8e8; }
body.dashboard-page #settings .settings-card { padding: 24px 26px; border-radius: 19px; }
body.dashboard-page #settings .settings-card-title { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
body.dashboard-page #settings .settings-card-title.compact { margin-bottom: 18px; }
body.dashboard-page #settings .settings-card-title>div { min-width: 0; }
body.dashboard-page #settings .settings-card-title :is(h3,p) { margin: 0; }
body.dashboard-page #settings .settings-card-title h3 { color: var(--dash-text); font-size: 16px; }
body.dashboard-page #settings .settings-card-title p { margin-top: 3px; color: var(--dash-muted); font-size: 12px; line-height: 1.8; }
body.dashboard-page #settings .settings-card-icon { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border: 1px solid #55477c; border-radius: 14px; background: var(--settings-accent-soft); color: #d6ccff; font-size: 16px; font-style: normal; font-weight: 900; }
body.dashboard-page #settings .settings-card-icon.creation { border-color: #315767; background: var(--settings-cyan-soft); color: #8dd9e8; }
body.dashboard-page #settings .settings-card-icon.voice { border-color: #5a4c35; background: #2d2619; color: #f0c878; }
body.dashboard-page #settings .settings-card-icon.export { border-color: #315767; background: var(--settings-cyan-soft); color: #8dd9e8; }
body.dashboard-page #settings .settings-card-icon.danger { border-color: #704550; background: #301e24; color: #ff9eb0; }
body.dashboard-page #settings .settings-form-grid { gap: 16px; }
body.dashboard-page #settings .settings-card label { color: #d3d9e4; font-size: 13px; font-weight: 650; }
body.dashboard-page #settings .settings-card label>small { margin-top: 6px; color: var(--dash-subtle); font-size: 11px; font-weight: 400; }
body.dashboard-page #settings .settings-card :is(input,select,textarea) { margin-top: 7px; }
body.dashboard-page #settings .settings-readonly-field { display: grid; align-content: start; min-height: 91px; padding: 13px 14px; border: 1px dashed #3b4556; border-radius: 12px; background: #0b1018; }
body.dashboard-page #settings .settings-readonly-field>span { color: #d3d9e4; font-size: 13px; font-weight: 650; }
body.dashboard-page #settings .settings-readonly-field>strong { margin-top: 7px; color: var(--dash-text); font-size: 14px; }
body.dashboard-page #settings .settings-readonly-field>small { margin-top: 3px; color: var(--dash-subtle); font-size: 11px; }
body.dashboard-page #settings .settings-meta-row { margin-top: 18px; gap: 12px; }
body.dashboard-page #settings .settings-meta-row>div { min-height: 58px; padding: 12px 14px; border-radius: 12px; }
body.dashboard-page #settings .settings-card>footer { position: sticky; z-index: 3; bottom: 12px; justify-content: space-between; margin: 24px -8px -8px; padding: 14px; border: 1px solid #3a4353; border-radius: 14px; background: #131923ed; backdrop-filter: blur(16px); box-shadow: 0 12px 35px #0005; }
body.dashboard-page #settings .settings-save-copy { min-width: 0; }
body.dashboard-page #settings .settings-save-copy>strong { display: block; color: var(--dash-text); font-size: 12px; }
body.dashboard-page #settings .settings-inline-state { display: block; min-height: 19px; margin-top: 1px; color: var(--dash-warning); font-size: 11px; }
body.dashboard-page #settings .settings-inline-state.error { color: var(--dash-danger); }
body.dashboard-page #settings .settings-form-actions { display: flex; align-items: center; gap: 8px; }
body.dashboard-page #settings .settings-form-actions button { min-width: 112px; }
body.dashboard-page #settings .settings-subsection+.settings-subsection { margin-top: 26px; padding-top: 26px; }
body.dashboard-page #settings .settings-duration-options { gap: 10px; }
body.dashboard-page #settings .settings-duration-options label>span { position: relative; min-height: 102px; padding: 15px; border-radius: 14px; }
body.dashboard-page #settings .settings-duration-options label>span>i { display: block; margin-bottom: 8px; color: var(--dash-purple); font-size: 19px; font-style: normal; }
body.dashboard-page #settings .settings-duration-options strong { font-size: 13px; }
body.dashboard-page #settings .settings-duration-options small { font-size: 11px; }
body.dashboard-page #settings .settings-duration-options input:checked+span { border-color: #806fc2; background: linear-gradient(145deg,#302b4b,#201f31); box-shadow: inset 0 0 0 1px #a997ff33; }
body.dashboard-page #settings .settings-feature-switch { margin-top: 18px; padding: 15px 16px; border-radius: 14px; background: linear-gradient(135deg,#171d29,#141923); }
body.dashboard-page #settings .settings-switch-icon.automation { border-color: #315767; background: #17303a; color: #7ed8e9; }
body.dashboard-page #settings .settings-notification-form { display: grid; gap: 16px; padding: 0; border: 0 !important; background: transparent !important; }
body.dashboard-page #settings .settings-notification-group { padding: 20px; border: 1px solid var(--dash-line); border-radius: 18px; background: var(--dash-surface); }
body.dashboard-page #settings .settings-notification-group+ .settings-notification-group { margin-top: 0; padding-top: 20px; }
body.dashboard-page #settings .settings-notification-group>header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
body.dashboard-page #settings .settings-notification-group>header :is(h3,p) { margin: 0; }
body.dashboard-page #settings .settings-notification-group>header h3 { font-size: 16px; }
body.dashboard-page #settings .settings-notification-group>header p { margin-top: 3px; color: var(--dash-muted); font-size: 12px; }
body.dashboard-page #settings .settings-notification-group>header button { min-height: 36px; padding: 7px 11px; border: 1px solid var(--dash-line); border-radius: 9px; background: var(--dash-surface-2); color: var(--dash-muted); font-size: 11px; }
body.dashboard-page #settings .settings-notification-item { min-height: 76px; margin-top: 9px; padding: 13px 14px; border-radius: 13px; cursor: pointer; transition: border-color .18s ease,background .18s ease,transform .18s ease; }
body.dashboard-page #settings .settings-notification-item:hover { border-color: #4b566b; background: #1a202c; transform: translateY(-1px); }
body.dashboard-page #settings .settings-notification-form>footer { position: sticky; bottom: 12px; margin: 0; }
body.dashboard-page #settings .settings-session-overview { border-radius: 17px; }
body.dashboard-page #settings .settings-devices-card { border-radius: 17px; }
body.dashboard-page #settings .settings-device-row { min-height: 104px; }
body.dashboard-page #settings .settings-device-meta span { padding: 3px 7px; border-radius: 7px; background: #0b1017; }
body.dashboard-page #settings .settings-note { border-radius: 13px; }
body.dashboard-page #settings .settings-export-card>header { align-items: center; }
body.dashboard-page #settings .settings-export-card>header .settings-card-title { margin: 0; }
body.dashboard-page #settings .settings-export-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 0 0 18px; padding: 0; list-style: none; }
body.dashboard-page #settings .settings-export-steps li { position: relative; display: flex; align-items: center; gap: 8px; min-width: 0; padding: 9px 10px; border: 1px solid var(--dash-line); border-radius: 11px; background: #0d121a; color: var(--dash-subtle); font-size: 11px; }
body.dashboard-page #settings .settings-export-steps li i { display: grid; place-items: center; flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--dash-surface-2); color: var(--dash-muted); font-style: normal; }
body.dashboard-page #settings .settings-export-steps li.active { border-color: #405b6a; background: #12222a; color: #b9e8f1; }
body.dashboard-page #settings .settings-export-steps li.active i { background: #244b58; color: #a8e8f4; }
body.dashboard-page #settings :is(.settings-export-empty,.settings-export-result,.settings-export-progress) { min-height: 92px; border-radius: 14px; }
body.dashboard-page #settings .settings-danger-card { padding: 0; overflow: hidden; }
body.dashboard-page #settings .settings-danger-summary { display: grid; grid-template-columns: 46px minmax(0,1fr) auto; align-items: center; gap: 14px; width: 100%; padding: 18px 20px; border: 0; background: transparent; color: var(--dash-text); text-align: right; cursor: pointer; }
body.dashboard-page #settings .settings-danger-summary>span:nth-child(2) { min-width: 0; }
body.dashboard-page #settings .settings-danger-summary :is(strong,small) { display: block; }
body.dashboard-page #settings .settings-danger-summary strong { font-size: 15px; }
body.dashboard-page #settings .settings-danger-summary small { margin-top: 3px; color: #c89aa4; font-size: 11px; line-height: 1.8; }
body.dashboard-page #settings .settings-danger-summary>i { color: #d58a99; font-size: 20px; font-style: normal; transition: transform .18s ease; }
body.dashboard-page #settings .settings-danger-summary[aria-expanded=true]>i { transform: rotate(180deg); }
body.dashboard-page #settings .settings-danger-content { padding: 0 20px 20px; border-top: 1px solid #5e3b45; }
body.dashboard-page #settings .settings-danger-warning { margin-top: 18px; }
body.dashboard-page #settings .settings-error { display: grid; justify-items: center; gap: 8px; padding: 40px 24px; border: 1px solid var(--dash-line); border-radius: 18px; background: var(--dash-surface); text-align: center; }
body.dashboard-page #settings .settings-error>span { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: #352028; color: var(--dash-danger); font-size: 22px; font-weight: 900; }
body.dashboard-page #settings .settings-error :is(strong,p) { margin: 0; }
body.dashboard-page #settings .settings-error p { color: var(--dash-muted); }

@media(max-width:980px) {
  body.dashboard-page #settings .user-settings-layout { grid-template-columns: 220px minmax(0,1fr); gap: 16px; }
  body.dashboard-page #settings .user-settings-nav small { display: none; }
  body.dashboard-page #settings .user-settings-nav button { min-height: 58px; }
}
@media(max-width:760px) {
  body.dashboard-page #settings { padding-bottom: 28px; }
  body.dashboard-page #settings .user-settings-heading { min-height: 0; margin-bottom: 12px; padding: 18px; border-radius: 18px; }
  body.dashboard-page #settings .user-settings-heading h1 { font-size: 26px; }
  body.dashboard-page #settings .user-settings-heading .muted { max-width: 290px; font-size: 12px; line-height: 1.9; }
  body.dashboard-page #settings .settings-heading-art { display: none; }
  body.dashboard-page #settings .user-settings-mobile-nav { position: sticky; z-index: 12; top: 72px; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 5px; width: calc(100% + 30px); margin: 0 -15px 12px; padding: 8px 15px; border-block: 1px solid var(--dash-line); background: #0b0f16ed; backdrop-filter: blur(18px); }
  body.dashboard-page #settings .user-settings-mobile-nav button { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 4px; min-width: 0; min-height: 58px; padding: 6px 3px; border: 1px solid var(--dash-line); border-radius: 11px; background: var(--dash-surface); color: var(--dash-muted); text-align: center; }
  body.dashboard-page #settings .user-settings-mobile-nav button.active { border-color: #7668b0; background: #292540; color: #fff; }
  body.dashboard-page #settings .user-settings-mobile-nav svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  body.dashboard-page #settings .user-settings-mobile-nav button>span { min-width: 0; width: 100%; }
  body.dashboard-page #settings .user-settings-mobile-nav strong { display: block; overflow: hidden; font-size: 9px; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
  body.dashboard-page #settings .user-settings-mobile-nav button>i { display: none; }
  body.dashboard-page #settings .user-settings-mobile-nav .settings-nav-dot { top: 4px; left: 4px; }
  body.dashboard-page #settings .user-settings-nav { display: none !important; }
  body.dashboard-page #settings .user-settings-layout { display: block; }
  body.dashboard-page #settings .settings-content-head { min-height: 0; padding: 18px; border-radius: 16px; }
  body.dashboard-page #settings .settings-content-head h2 { font-size: 21px; }
  body.dashboard-page #settings .settings-content-head p { font-size: 12px; }
  body.dashboard-page #settings .settings-profile-mark { width: 50px; height: 50px; border-radius: 16px; font-size: 17px; }
  body.dashboard-page #settings .settings-head-badge { display: none; }
  body.dashboard-page #settings .settings-content-head>.secondary-btn { width: auto; min-width: 44px; padding-inline: 12px; font-size: 11px; }
  body.dashboard-page #settings .settings-card { padding: 17px; border-radius: 16px; }
  body.dashboard-page #settings .settings-card-title { align-items: flex-start; margin-bottom: 17px; }
  body.dashboard-page #settings .settings-card-title p { font-size: 11px; }
  body.dashboard-page #settings .settings-form-grid,body.dashboard-page #settings .settings-meta-row { grid-template-columns: minmax(0,1fr) !important; }
  body.dashboard-page #settings .settings-duration-options { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
  body.dashboard-page #settings .settings-duration-options label>span { min-height: 98px; padding: 12px 8px; text-align: center; }
  body.dashboard-page #settings .settings-card>footer,body.dashboard-page #settings .settings-notification-form>footer { bottom: 8px; display: grid; gap: 10px; margin: 20px -5px -5px; padding: 11px; }
  body.dashboard-page #settings .settings-form-actions { width: 100%; }
  body.dashboard-page #settings .settings-form-actions button { flex: 1; min-width: 0; }
  body.dashboard-page #settings .settings-notification-group { padding: 15px; border-radius: 16px; }
  body.dashboard-page #settings .settings-notification-group>header { align-items: flex-start; }
  body.dashboard-page #settings .settings-notification-group>header button { flex: none; max-width: 110px; white-space: normal; }
  body.dashboard-page #settings .settings-notification-item { grid-template-columns: 38px minmax(0,1fr) auto; min-height: 82px; padding: 12px; }
  body.dashboard-page #settings .settings-session-overview { grid-template-columns: 42px minmax(0,1fr); padding: 15px; }
  body.dashboard-page #settings .settings-session-overview-icon { width: 42px; height: 42px; }
  body.dashboard-page #settings .settings-security-state { grid-column: 1/-1; justify-content: center; }
  body.dashboard-page #settings .settings-device-row { grid-template-columns: 40px minmax(0,1fr); align-items: start; padding: 15px; }
  body.dashboard-page #settings .settings-device-status,body.dashboard-page #settings .settings-device-revoke { grid-column: 2; justify-self: start; }
  body.dashboard-page #settings .settings-device-meta { gap: 6px; }
  body.dashboard-page #settings .settings-devices-card>header,body.dashboard-page #settings .settings-devices-card>footer { align-items: flex-start; padding: 15px; }
  body.dashboard-page #settings .settings-export-card>header { align-items: flex-start; }
  body.dashboard-page #settings .settings-private-badge { display: none; }
  body.dashboard-page #settings .settings-export-steps { gap: 5px; }
  body.dashboard-page #settings .settings-export-steps li { justify-content: center; padding: 8px 4px; }
  body.dashboard-page #settings .settings-export-steps li span { display: none; }
  body.dashboard-page #settings .settings-export-actions { align-items: stretch; flex-direction: column-reverse; }
  body.dashboard-page #settings .settings-export-actions .primary-btn { width: 100%; }
  body.dashboard-page #settings .settings-danger-summary { grid-template-columns: 42px minmax(0,1fr) auto; padding: 16px; }
  body.dashboard-page #settings .settings-danger-content { padding: 0 16px 16px; }
  body.dashboard-page #settings .settings-delete-step { align-items: stretch; flex-direction: column; }
}
@media(max-width:390px) {
  body.dashboard-page #settings .settings-duration-options { grid-template-columns: minmax(0,1fr) !important; }
  body.dashboard-page #settings .settings-duration-options label>span { min-height: 78px; text-align: right; }
  body.dashboard-page #settings .settings-duration-options label>span>i { display: inline-block; margin: 0 0 0 8px; }
  body.dashboard-page #settings .settings-content-head { align-items: flex-start; }
  body.dashboard-page #settings .settings-content-head>.secondary-btn { grid-column: 1/-1; width: 100%; }
}

@media (max-width: 380px) {
  body.dashboard-page .topbar { padding-inline: 8px; }
  body.dashboard-page .top-account-actions { gap: 4px; }
  body.dashboard-page .top-actions .dashboard-circle-mobile { padding-inline: 7px !important; gap: 5px; }
  body.dashboard-page .top-actions .hero-credit-trigger > strong { font-size: 11px; }
}