:root {
  --ink: #171f39;
  --forest: #151d39;
  --forest-2: #222e54;
  --forest-3: #354875;
  --cream: #f4f3f0;
  --paper: #fbfbfa;
  --white: #fff;
  --clay: #ed8545;
  --clay-soft: #fff0e6;
  --sage: #8fa1b5;
  --sage-soft: #e9eef4;
  --gold: #c6954d;
  --gold-soft: #f4ead8;
  --red: #a94436;
  --red-soft: #f7e1dc;
  --muted: #6d7975;
  --muted-2: #89938f;
  --line: #dedbd3;
  --line-soft: #ece9e2;
  --shadow: 0 24px 70px rgba(18, 42, 42, .12);
  --radius: 20px;
  color-scheme: light;
}

/* Manual bank statement import and rent assignment */
.statement-import-panel { margin-bottom: 22px; padding: 24px; overflow: hidden; }
.statement-import-heading { display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.statement-import-heading > div:first-child { min-width: 0; display: flex; align-items: center; gap: 15px; }
.statement-import-heading h2 { margin: 3px 0 7px; }
.statement-import-heading p, .statement-entries-heading p { margin: 0; color: var(--muted); }
.statement-import-symbol { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; flex: 0 0 auto; color: #fff; font-size: 1.3rem; font-weight: 850; line-height: 1; background: linear-gradient(145deg, var(--forest-3), var(--forest)); box-shadow: 0 12px 25px rgba(21,29,57,.2); }
.statement-import-actions { display: flex; align-items: center; justify-content: flex-end; gap: 9px; flex-wrap: wrap; }
.statement-import-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 20px 0; }
.statement-import-stat { min-width: 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--cream); }
.statement-import-stat small, .statement-import-stat strong { display: block; }
.statement-import-stat small { color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.statement-import-stat strong { margin-top: 6px; font-size: 18px; }
.statement-list { display: grid; gap: 9px; }
.statement-card { padding: 15px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--cream); }
.statement-card-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.statement-card-header > div { min-width: 0; }
.statement-card strong, .statement-card small { display: block; }
.statement-card small { margin-top: 4px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.statement-card-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.statement-format-badge { padding: 5px 8px; border-radius: 999px; color: var(--forest-3); background: var(--sage-soft); font-size: 9px; font-weight: 900; letter-spacing: .08em; }
.statement-entries-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.statement-entries-heading h3 { margin: 0 0 4px; }
.statement-entry-list { display: grid; gap: 9px; margin-top: 14px; }
.statement-entry { display: grid; grid-template-columns: minmax(190px, 1fr) auto minmax(290px, auto); align-items: center; gap: 16px; padding: 14px 15px; border: 1px solid var(--line); border-radius: 13px; background: var(--white); }
.statement-entry.assigned { border-color: color-mix(in srgb, var(--sage) 60%, var(--line)); background: color-mix(in srgb, var(--sage-soft) 55%, var(--white)); }
.statement-entry-copy { min-width: 0; display: grid; gap: 3px; }
.statement-entry-copy small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.statement-entry > strong { font-size: 14px; white-space: nowrap; }
.statement-entry-match { min-width: 290px; display: flex; align-items: center; gap: 7px; }
.statement-entry-match select { min-width: 0; flex: 1; }
.statement-assigned-payment { min-width: 230px; display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.statement-assigned-payment span { min-width: 0; color: var(--forest-3); font-size: 11px; font-weight: 750; text-align: right; }
.statement-match-note { display: block; margin-top: 4px; color: var(--forest-3); font-size: .75rem; }
.statement-empty { margin: 0; padding: 18px; color: var(--muted); text-align: center; }
.statement-upload-dialog, .statement-entry-dialog { width: min(680px, calc(100% - 28px)); max-height: min(90dvh, 880px); overflow: auto; }

@media (max-width: 860px) {
  .statement-import-heading, .statement-entries-heading { align-items: flex-start; flex-direction: column; }
  .statement-import-actions { justify-content: flex-start; width: 100%; }
  .statement-entry { grid-template-columns: minmax(0, 1fr) auto; }
  .statement-entry > :last-child { grid-column: 1 / -1; }
  .statement-entry-match, .statement-assigned-payment { width: 100%; min-width: 0; }
  .statement-assigned-payment { justify-content: flex-start; }
  .statement-assigned-payment span { text-align: left; }
}

@media (max-width: 520px) {
  .statement-import-panel { padding: 17px; }
  .statement-import-heading > div:first-child { align-items: flex-start; }
  .statement-import-actions .button { width: 100%; }
  .statement-import-summary { grid-template-columns: 1fr; }
  .statement-card-header { align-items: flex-start; flex-direction: column; }
  .statement-card-actions { width: 100%; justify-content: flex-start; }
  .statement-entry { grid-template-columns: 1fr; }
  .statement-entry > strong { justify-self: start; }
  .statement-entry-match, .statement-assigned-payment { align-items: stretch; flex-direction: column; }
  .statement-assigned-payment .button { width: 100%; }
}

html[data-theme="dark"] {
  --ink: #eef2fa;
  --forest: #0e162d;
  --forest-2: #1d294b;
  --forest-3: #334874;
  --cream: #111725;
  --paper: #171e2e;
  --white: #151c2b;
  --clay: #f09a64;
  --clay-soft: #492f25;
  --sage: #8da0b8;
  --sage-soft: #253148;
  --gold: #d4a65f;
  --gold-soft: #443824;
  --red: #ef9a87;
  --red-soft: #472b28;
  --muted: #a8b3ae;
  --muted-2: #82908a;
  --line: #354540;
  --line-soft: #283632;
  --shadow: 0 28px 80px rgba(0, 0, 0, .3);
  color-scheme: dark;
}

.forgot-password-link { align-self: flex-start; border: 0; background: transparent; color: var(--forest-2); font: inherit; font-weight: 750; padding: 2px 0; cursor: pointer; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; }
.forgot-password-link:hover, .forgot-password-link:focus-visible { text-decoration-color: currentColor; }
.mail-settings-layout { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(310px, .88fr); gap: 22px; align-items: start; }
.mail-settings-form { padding: 22px; display: grid; gap: 18px; }
.mail-tutorial-column { display: grid; gap: 18px; position: sticky; top: 18px; }
.password-reset-dialog .dialog-form { width: min(520px, calc(100vw - 32px)); }
.password-reset-sent { display: flex; align-items: center; gap: 12px; background: var(--sage-soft); border: 1px solid color-mix(in srgb, var(--sage) 45%, transparent); border-radius: 14px; padding: 13px 15px; color: var(--ink); }
.password-reset-sent span { display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%; background: var(--forest-2); color: white; font-weight: 800; }
.password-reset-sent p { margin: 0; font-size: .9rem; line-height: 1.45; }
.account-email-input { margin-top: 6px; min-width: 205px; padding: 7px 9px; font-size: .78rem; border-radius: 9px; }
.account-email-input:disabled { opacity: .65; cursor: not-allowed; }

@media (max-width: 980px) {
  .mail-settings-layout { grid-template-columns: 1fr; }
  .mail-tutorial-column { position: static; }
}

html[data-site-design="halloween"] {
  --forest: #24152f;
  --forest-2: #452650;
  --forest-3: #653470;
  --cream: #fbf3e8;
  --paper: #fffaf2;
  --clay: #df6c20;
  --clay-soft: #f9dfc7;
  --sage: #929d54;
  --sage-soft: #eef0d8;
  --gold: #d49a38;
  --gold-soft: #f8ebcf;
  --line: #e4d6c7;
  --line-soft: #efe5da;
}

html[data-theme="dark"][data-site-design="halloween"] {
  --ink: #f3ece4;
  --forest: #160d1e;
  --forest-2: #4e2b58;
  --forest-3: #75437d;
  --cream: #130f16;
  --paper: #211923;
  --white: #1d171f;
  --clay: #f18a3c;
  --clay-soft: #4b2b1c;
  --sage: #aeb875;
  --sage-soft: #303523;
  --gold: #e1ad51;
  --gold-soft: #49391f;
  --line: #443546;
  --line-soft: #332936;
}

html[data-site-design="christmas"] {
  --forest: #12372d;
  --forest-2: #1e5543;
  --forest-3: #2f6e57;
  --cream: #f7f3ea;
  --paper: #fffdf8;
  --clay: #b94842;
  --clay-soft: #f4deda;
  --sage: #7e9e8b;
  --sage-soft: #dfeae2;
  --gold: #c49a47;
  --gold-soft: #f4e9cc;
  --line: #dbd7cc;
  --line-soft: #ece8df;
}

html[data-theme="dark"][data-site-design="christmas"] {
  --ink: #edf1ec;
  --forest: #0c251d;
  --forest-2: #245846;
  --forest-3: #36735c;
  --cream: #101713;
  --paper: #18231d;
  --white: #162019;
  --clay: #dc7169;
  --clay-soft: #472a28;
  --sage: #91ad9c;
  --sage-soft: #24382d;
  --gold: #dab963;
  --gold-soft: #463d25;
  --line: #34453b;
  --line-soft: #29372f;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
html[data-site-design="halloween"] body::before,
html[data-site-design="christmas"] body::before { content: ""; position: fixed; inset: 0 0 auto; height: 6px; z-index: 1000; pointer-events: none; }
html[data-site-design="halloween"] body::before { background: repeating-linear-gradient(90deg, #ef842e 0 42px, #4e2a59 42px 84px, #a9b66a 84px 104px); box-shadow: 0 2px 15px rgba(69,38,80,.25); }
html[data-site-design="christmas"] body::before { background: repeating-linear-gradient(120deg, #aa3b38 0 20px, #f5efe1 20px 32px, #1e6049 32px 52px, #d1aa53 52px 57px); box-shadow: 0 2px 15px rgba(18,55,45,.22); }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
[hidden] { display: none !important; }

.public-site { min-height: 100vh; background: var(--cream); }
.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, .95fr) minmax(480px, 1.05fr); }
.brand-panel { position: relative; overflow: hidden; min-height: 100vh; padding: clamp(34px, 5vw, 76px); display: flex; flex-direction: column; justify-content: space-between; color: #fff; background: radial-gradient(circle at 110% 15%, rgba(202,130,86,.55), transparent 35%), linear-gradient(145deg, var(--forest), #173f3d 70%, #23514d); }
.brand-property-backdrop { position: absolute; z-index: 0; inset: 0; pointer-events: none; background: url('/raumdesk-property-hero.jpg') 62% center / cover no-repeat; transform: scale(1.015); }
.brand-property-backdrop::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,18,25,.96) 0%, rgba(8,29,35,.88) 38%, rgba(8,27,34,.56) 68%, rgba(7,20,28,.34) 100%), linear-gradient(0deg, rgba(5,16,22,.66), transparent 48%); }
.brand-panel::before, .brand-panel::after { content: ""; position: absolute; z-index: 1; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; pointer-events: none; }
.brand-panel::before { width: 430px; height: 430px; right: -180px; top: 18%; }
.brand-panel::after { width: 270px; height: 270px; right: -70px; top: 29%; }
.wordmark { position: relative; z-index: 3; display: flex; align-items: center; gap: 12px; font-size: 12px; letter-spacing: .18em; font-weight: 800; }
.brand-mark { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid currentColor; border-radius: 11px; font-family: Georgia, serif; font-size: 21px; letter-spacing: 0; }
.brand-copy { position: relative; z-index: 2; max-width: 620px; }
.eyebrow { margin: 0 0 13px; text-transform: uppercase; letter-spacing: .16em; font-size: 10px; font-weight: 850; color: var(--clay); }
.brand-copy .eyebrow { color: #efb69a; }
.brand-copy h1 { margin: 0; max-width: 580px; font: 500 clamp(46px, 6.4vw, 84px)/.98 Georgia, "Times New Roman", serif; letter-spacing: -.045em; }
.brand-copy > p:last-of-type { max-width: 520px; margin: 30px 0 0; color: rgba(255,255,255,.72); font-size: 17px; line-height: 1.7; }
.proof { position: relative; z-index: 2; display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,.72); font-size: 13px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #85cf9b; box-shadow: 0 0 0 5px rgba(133,207,155,.12); }
.login-panel { display: grid; place-items: center; padding: clamp(28px, 8vw, 110px); background: linear-gradient(120deg, #f6f2e9, #fffdf9); }
.login-panel { position: relative; }
.login-card { width: min(100%, 460px); padding: 44px; border: 1px solid rgba(33,55,53,.09); border-radius: 26px; background: rgba(255,255,255,.78); box-shadow: var(--shadow); backdrop-filter: blur(18px); }
.season-badge { width: fit-content; margin: 0 0 16px; padding: 7px 11px; border: 1px solid color-mix(in srgb, var(--clay) 35%, var(--line)); border-radius: 999px; color: var(--clay); background: color-mix(in srgb, var(--clay-soft) 72%, transparent); font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.season-badge-compact { margin: 0; white-space: nowrap; }
html[data-site-design="halloween"] .brand-panel { background: radial-gradient(circle at 84% 24%, rgba(232,112,34,.32), transparent 28%), radial-gradient(circle at 102% 92%, rgba(155,169,86,.18), transparent 31%), linear-gradient(145deg, #170d1e, #2f1837 68%, #49254d); }
html[data-site-design="christmas"] .brand-panel { background: radial-gradient(circle at 88% 16%, rgba(201,166,80,.27), transparent 27%), radial-gradient(circle at 110% 90%, rgba(185,72,66,.23), transparent 34%), linear-gradient(145deg, #0c2a21, #164838 68%, #245a46); }
html[data-site-design="halloween"] .brand-property-backdrop::after { background: linear-gradient(90deg, rgba(24,8,27,.97), rgba(41,14,43,.84) 54%, rgba(39,16,40,.5)), linear-gradient(0deg, rgba(20,8,24,.72), transparent 48%); }
html[data-site-design="christmas"] .brand-property-backdrop::after { background: linear-gradient(90deg, rgba(5,29,22,.97), rgba(10,53,40,.84) 54%, rgba(18,59,45,.46)), linear-gradient(0deg, rgba(5,28,22,.7), transparent 48%); }
html[data-site-design="halloween"] .brand-mark { color: #f39a4f; border-color: rgba(243,154,79,.65); box-shadow: 0 0 28px rgba(239,132,46,.2); }
html[data-site-design="christmas"] .brand-mark { color: #f0d483; border-color: rgba(240,212,131,.7); box-shadow: 0 0 28px rgba(240,212,131,.16); }
html[data-site-design="halloween"] .app-shell { background: #faf5ec; }
html[data-site-design="christmas"] .app-shell { background: #f8f5ee; }
html[data-theme="dark"][data-site-design="halloween"] .app-shell,
html[data-theme="dark"][data-site-design="christmas"] .app-shell { background: var(--cream); }
html[data-site-design="halloween"] .sidebar { background: linear-gradient(180deg, #1a0f22, #2e1735 68%, #38203b); }
html[data-site-design="christmas"] .sidebar { background: linear-gradient(180deg, #0d2d24, #123e30 68%, #173c31); }
html[data-site-design="halloween"] .pricing-card.featured { box-shadow: 0 26px 70px rgba(79,40,85,.18); }
html[data-site-design="christmas"] .pricing-card.featured { box-shadow: 0 26px 70px rgba(23,79,59,.17); }
.login-card h2 { margin: 0 0 10px; font: 500 38px/1.1 Georgia, serif; letter-spacing: -.025em; }
.muted { color: var(--muted); line-height: 1.55; }
.login-card form { margin-top: 34px; }
label { display: block; color: #334441; font-size: 12px; font-weight: 750; }
label input, label select, label textarea { margin-top: 8px; }
input, select, textarea { width: 100%; min-height: 48px; padding: 0 14px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: var(--paper); outline: none; transition: border-color .2s, box-shadow .2s; }
textarea { min-height: 100px; padding-top: 12px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--forest-2); box-shadow: 0 0 0 4px rgba(23,66,67,.1); }
.login-card label { margin-top: 18px; }
.button { min-height: 45px; padding: 0 17px; border: 0; border-radius: 11px; font-size: 13px; font-weight: 780; cursor: pointer; display: inline-flex; justify-content: center; align-items: center; gap: 8px; transition: transform .18s, background .18s, box-shadow .18s; }
.button:hover { transform: translateY(-1px); }
.button:disabled { opacity: .55; cursor: wait; transform: none; }
.button.primary { color: white; background: var(--forest); box-shadow: 0 8px 20px rgba(16,47,48,.17); }
.button.primary:hover { background: var(--forest-2); }
.button.secondary { border: 1px solid var(--line); background: var(--white); }
.button.danger { color: white; background: var(--red); box-shadow: 0 8px 20px rgba(169,68,54,.16); }
.button.danger:hover { background: #91372d; }
.button.ghost { background: transparent; color: var(--muted); }
.button.full { width: 100%; min-height: 54px; margin-top: 26px; }
.theme-toggle { min-height: 44px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: var(--white); display: inline-flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 750; cursor: pointer; transition: color .18s, background .18s, border-color .18s, transform .18s; }
.theme-toggle:hover { color: var(--ink); border-color: var(--muted-2); transform: translateY(-1px); }
.theme-toggle:focus-visible { outline: 3px solid color-mix(in srgb, var(--clay) 45%, transparent); outline-offset: 2px; }
.theme-icon { width: 20px; height: 20px; display: inline-grid; place-items: center; font: 600 16px/1 "Segoe UI Symbol", sans-serif; text-align: center; }
.theme-picker { position: relative; padding-right: 9px; }
.theme-picker::after { content: "⌄"; margin-left: -13px; color: var(--muted-2); font-size: 10px; pointer-events: none; }
.theme-picker select { width: auto; min-width: 108px; min-height: 42px; margin: 0; padding: 0 20px 0 0; border: 0; border-radius: 0; color: inherit; background: transparent; box-shadow: none; appearance: none; font-size: 10px; font-weight: 750; cursor: pointer; }
.theme-picker select:focus { border: 0; box-shadow: none; }
.theme-picker:focus-within { outline: 3px solid color-mix(in srgb, var(--clay) 45%, transparent); outline-offset: 2px; }
.theme-picker .theme-icon { pointer-events: none; }
.login-theme-toggle { position: absolute; right: 28px; top: 26px; z-index: 3; }
.form-message, .dialog-message { min-height: 20px; margin: 11px 0 0; color: var(--red); font-size: 12px; }
.security-note { margin: 20px 0 0; color: var(--muted-2); font-size: 11px; text-align: center; }
.security-note span { color: #71aa82; }
.portal-access-status { margin: 16px 0 2px; padding: 13px 14px; border: 1px solid #dfc98e; border-radius: 12px; color: #76591f; background: #fbf3dc; }
.portal-access-status.mode-offline { border-color: #e4b9b3; color: #8c3d34; background: #fbeae7; }
.portal-access-status strong, .portal-access-status span, .portal-access-status small { display: block; }
.portal-access-status strong { font-size: 11px; }
.portal-access-status span { margin-top: 5px; font-size: 9px; line-height: 1.5; }
.portal-access-status small { margin-top: 7px; font-size: 8px; font-weight: 800; }

.capabilities-section { min-height: 100vh; padding: clamp(72px, 9vw, 124px) clamp(24px, 7vw, 100px); display: flex; align-items: center; background: linear-gradient(155deg, var(--paper) 0%, var(--cream) 58%, color-mix(in srgb, var(--sage-soft) 42%, var(--cream)) 100%); scroll-margin-top: 16px; }
.capabilities-shell { width: min(1180px, 100%); margin: 0 auto; }
.capabilities-heading { margin-bottom: clamp(34px, 5vw, 58px); display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); align-items: end; gap: clamp(28px, 6vw, 80px); }
.capabilities-heading h2 { max-width: 760px; margin: 0; font: 500 clamp(38px, 5vw, 64px)/1.02 Georgia, serif; letter-spacing: -.042em; text-wrap: balance; }
.capabilities-heading h2 em { color: var(--clay); font-style: normal; }
.capabilities-heading > p { margin: 0 0 5px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.capabilities-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; }
.capability-card { position: relative; min-height: 270px; grid-column: span 4; overflow: hidden; padding: 25px; border: 1px solid var(--line); border-radius: 22px; background: color-mix(in srgb, var(--paper) 92%, transparent); box-shadow: 0 16px 44px rgba(18,42,42,.07); display: flex; flex-direction: column; }
.capability-card-featured { grid-column: span 7; background: linear-gradient(145deg, var(--forest), var(--forest-2)); color: #fff; }
.capability-card-featured + .capability-card { grid-column: span 5; }
.capability-card-wide { min-height: 220px; grid-column: span 12; }
.capability-card::after { content: ""; position: absolute; width: 180px; height: 180px; right: -95px; bottom: -115px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--sage) 22%, transparent), transparent 68%); pointer-events: none; }
.capability-card-top { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.capability-number { color: var(--muted-2); font-size: 9px; font-weight: 850; letter-spacing: .16em; }
.capability-icon { width: 43px; height: 43px; flex: 0 0 43px; border: 1px solid var(--line); border-radius: 13px; color: var(--forest-2); background: var(--cream); display: grid; place-items: center; }
.capability-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.capability-card h3 { position: relative; z-index: 1; margin: 38px 0 10px; font: 500 25px/1.12 Georgia, serif; letter-spacing: -.02em; }
.capability-card p { position: relative; z-index: 1; max-width: 540px; margin: 0 0 24px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.capability-tag { position: relative; z-index: 1; width: fit-content; margin-top: auto; padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted-2); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.capability-card-featured .capability-number, .capability-card-featured p { color: rgba(255,255,255,.7); }
.capability-card-featured .capability-icon { border-color: rgba(255,255,255,.18); color: #fff; background: rgba(255,255,255,.09); }
.capability-card-featured .capability-tag { border-color: rgba(255,255,255,.18); color: rgba(255,255,255,.78); }
.capabilities-cta { margin-top: 18px; padding: 22px 24px; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); box-shadow: var(--shadow-soft); display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.capabilities-cta > div { display: flex; align-items: center; gap: 12px; }
.capabilities-cta p { margin: 0; color: var(--muted); font-size: 12px; }
.capabilities-cta p strong { color: var(--ink); }
.capabilities-cta .button { min-height: 48px; margin: 0; text-decoration: none; }

.pricing-section { padding: clamp(70px, 9vw, 120px) clamp(24px, 7vw, 100px); background: var(--cream); }
.pricing-heading { width: min(1180px, 100%); margin: 0 auto 42px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); align-items: end; gap: 50px; }
.pricing-heading h2 { max-width: 700px; margin: 0; font: 500 clamp(38px, 5vw, 62px)/1.02 Georgia, serif; letter-spacing: -.035em; }
.pricing-heading > p { margin: 0 0 4px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.billing-cycle-switch { width: max-content; margin: -18px auto 24px; padding: 4px; border: 1px solid var(--line); border-radius: 999px; background: color-mix(in srgb, var(--paper) 88%, transparent); display: flex; gap: 3px; box-shadow: var(--shadow-soft); }
.billing-cycle-switch button { min-width: 116px; min-height: 40px; padding: 9px 18px; border: 0; border-radius: 999px; background: transparent; color: var(--muted); font: 800 10px/1 inherit; letter-spacing: .035em; cursor: pointer; transition: background .18s ease, color .18s ease, box-shadow .18s ease; }
.billing-cycle-switch button.active { background: var(--forest); color: #fff; box-shadow: 0 5px 14px rgba(26, 58, 44, .2); }
.billing-cycle-switch button:focus-visible { outline: 3px solid color-mix(in srgb, var(--clay) 55%, transparent); outline-offset: 2px; }
.seasonal-offer-banner { width: min(1180px, 100%); margin: -18px auto 34px; padding: 17px 20px; border: 1px solid color-mix(in srgb, var(--clay) 44%, var(--line)); border-radius: 17px; background: linear-gradient(110deg, color-mix(in srgb, var(--clay-soft) 76%, var(--paper)), var(--paper)); display: flex; align-items: center; gap: 14px; box-shadow: 0 14px 36px rgba(18,42,42,.07); }
.seasonal-offer-banner > span { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 13px; color: white; background: var(--clay); display: grid; place-items: center; font-size: 18px; }
.seasonal-offer-banner strong, .seasonal-offer-banner small { display: block; }
.seasonal-offer-banner strong { font: 500 17px Georgia, serif; }
.seasonal-offer-banner small { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.pricing-grid { width: min(1180px, 100%); margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 20px; }
.pricing-card { position: relative; min-height: 520px; padding: 30px; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); box-shadow: 0 16px 48px rgba(18,42,42,.07); display: flex; flex-direction: column; }
.pricing-card.featured { border-color: color-mix(in srgb, var(--clay) 58%, var(--line)); transform: translateY(-10px); box-shadow: 0 26px 70px rgba(18,42,42,.14); }
.plan-badge { position: absolute; top: -14px; right: 24px; padding: 7px 12px; border-radius: 999px; color: #fff; background: var(--clay); font-size: 9px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.plan-kicker { color: var(--clay); font-size: 10px; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; }
.pricing-card h3 { margin: 10px 0 8px; font: 500 29px/1.1 Georgia, serif; }
.pricing-card > div > p { min-height: 45px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.plan-price { margin: 28px 0 25px; padding-bottom: 24px; border-bottom: 1px solid var(--line-soft); display: flex; align-items: baseline; gap: 8px; }
.plan-price strong { font: 600 38px/1 Georgia, serif; letter-spacing: -.025em; }
.plan-price strong:has(del) { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.plan-price strong del { color: var(--muted-2); font: 500 18px/1 Georgia, serif; text-decoration-thickness: 1px; }
.plan-price strong > span { color: var(--clay); font: 600 38px/1 Georgia, serif; }
.plan-price span { color: var(--muted); font-size: 11px; }
.pricing-card.seasonal-discounted { border-color: color-mix(in srgb, var(--clay) 50%, var(--line)); }
.pricing-card ul { margin: 0 0 30px; padding: 0; display: grid; gap: 15px; list-style: none; }
.pricing-card li { position: relative; padding-left: 26px; color: var(--ink); font-size: 12px; line-height: 1.5; }
.pricing-card li::before { content: "✓"; position: absolute; left: 0; top: -1px; width: 18px; height: 18px; border-radius: 50%; color: #377552; background: var(--sage-soft); display: grid; place-items: center; font-size: 9px; font-weight: 900; }
.plan-button { margin-top: auto; }
.pricing-trust { width: min(1180px, 100%); margin: 30px auto 0; color: var(--muted); display: flex; justify-content: center; flex-wrap: wrap; gap: 16px 34px; font-size: 10px; font-weight: 750; }
.public-footer { min-height: 108px; padding: 26px clamp(24px, 7vw, 100px); border-top: 1px solid var(--line); background: var(--paper); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.public-footer > div { display: flex; align-items: center; gap: 12px; }
.public-footer strong, .public-footer small { display: block; }
.public-footer strong { font: 500 15px Georgia, serif; }
.public-footer small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.public-footer nav { min-width: 0; display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px 20px; }
.public-footer a { min-height: 44px; display: inline-flex; align-items: center; color: var(--forest-2); font-size: 10px; font-weight: 800; line-height: 1.35; text-underline-offset: 4px; white-space: nowrap; }
.subscription-dialog { width: min(760px, calc(100% - 32px)); max-height: min(92dvh, 980px); overflow: auto; }
.billing-recovery-dialog { width: min(540px, calc(100% - 28px)); }
.billing-recovery-account { margin: 20px 0 12px; padding: 15px 17px; border-left: 3px solid var(--forest-3); border-radius: 11px; background: var(--sage-soft); }
.billing-recovery-account span, .billing-recovery-account strong, .billing-recovery-account small { display: block; }
.billing-recovery-account span { color: var(--muted-2); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.billing-recovery-account strong { margin-top: 6px; font-size: 14px; }
.billing-recovery-account small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.billing-recovery-plan-picker { margin: 0 0 14px; padding: 16px 17px; border: 1px solid var(--line); border-radius: 14px; background: var(--cream); }
.billing-recovery-choice-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(130px, .55fr); gap: 12px; }
.billing-recovery-plan-picker label { color: var(--muted-2); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.billing-recovery-plan-picker select { margin-top: 8px; font-size: 13px; font-weight: 750; }
.billing-recovery-plan-picker small { display: block; margin-top: 7px; color: var(--clay); font-size: 9px; font-weight: 800; }
.billing-recovery-plan-picker select:disabled { opacity: .72; cursor: not-allowed; }
.billing-recovery-copy { margin: 0 2px 14px; color: var(--muted); font-size: 10px; line-height: 1.6; }
.billing-recovery-notice { margin-top: 4px; }
.subscription-selection { margin: 22px 0 16px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--cream); display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 18px; }
.subscription-selection span { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.subscription-selection strong { grid-column: 1; font: 500 24px/1.1 Georgia, serif; }
.subscription-selection small { grid-column: 2; grid-row: 1 / span 2; color: var(--clay); font-size: 11px; font-weight: 800; }
.subscription-notice { padding: 17px; border: 1px solid #dfc98e; border-radius: 14px; color: #76591f; background: #fbf3dc; display: grid; grid-template-columns: 34px 1fr; gap: 12px; }
.subscription-notice > span { width: 34px; height: 34px; border-radius: 10px; background: rgba(198,149,77,.18); display: grid; place-items: center; font-size: 20px; }
.subscription-notice strong { font-size: 11px; }
.subscription-notice p { margin: 5px 0 0; font-size: 9px; line-height: 1.6; }
.subscription-copy { margin: 16px 2px 0; font-size: 10px; }
.subscription-checkout-fields { display: grid; gap: 13px; }
.checkout-form-section { padding: 17px; border: 1px solid var(--line-soft); border-radius: 15px; background: var(--white); }
.checkout-form-section > label, .checkout-form-section > .form-row { margin-top: 14px; }
.checkout-form-heading { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 11px; }
.checkout-form-heading > span { width: 32px; height: 32px; border-radius: 10px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font-size: 10px; font-weight: 900; }
.checkout-form-heading strong, .checkout-form-heading small { display: block; }
.checkout-form-heading strong { font-size: 11px; }
.checkout-form-heading small { margin-top: 3px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.optional-label { color: var(--muted-2); font-size: 8px; font-weight: 650; }
.business-data-note { margin: 14px 0 0; padding: 11px 12px; border-radius: 10px; color: var(--muted); background: var(--cream); font-size: 8px; line-height: 1.55; }
.subscription-consent { padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: var(--cream); display: grid; grid-template-columns: 18px 1fr; align-items: start; gap: 10px; cursor: pointer; }
.subscription-consent input { width: 17px; height: 17px; min-height: 17px; margin: 1px 0 0; accent-color: var(--forest-2); }
.subscription-consent span { color: var(--muted); font-size: 9px; font-weight: 600; line-height: 1.5; }
.stripe-secure-note { margin: 16px 0 0; color: var(--muted-2); font-size: 9px; text-align: center; }
.stripe-secure-note span { color: #635bff; }
.checkout-return-status { margin: 16px 0 2px; padding: 13px 14px; border: 1px solid #b8d9c2; border-radius: 12px; color: #2f6d48; background: #edf7f0; font-size: 10px; line-height: 1.55; }
.checkout-return-status.pending { border-color: #dfc98e; color: #76591f; background: #fbf3dc; }
.checkout-return-status.error { border-color: #e4b9b3; color: #8c3d34; background: #fbeae7; }
.account-settings-heading { align-items: center; }
.account-private-badge { padding: 8px 11px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); background: var(--white); font-size: 8px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.account-settings-content { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 16px; }
.account-settings-panel { min-width: 0; padding: 23px; }
.account-settings-panel.subscription-panel { grid-row: span 2; }
.account-panel-heading { margin-bottom: 19px; display: flex; align-items: flex-start; gap: 12px; }
.account-panel-icon { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 12px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font: 700 17px Georgia, serif; }
.account-panel-heading h2 { margin: 1px 0 0; font: 500 22px Georgia, serif; }
.account-panel-heading p { margin: 5px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.account-identity { padding: 16px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--cream); display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; }
.account-identity-avatar { width: 42px; height: 42px; border-radius: 50%; color: #fff; background: var(--forest-2); display: grid; place-items: center; font: 700 15px Georgia, serif; }
.account-identity strong, .account-identity small { display: block; overflow-wrap: anywhere; }
.account-identity small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.account-password-row { margin-top: 12px; padding: 14px 15px; border: 1px solid var(--line-soft); border-radius: 12px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.account-password-row span, .account-password-row strong, .account-password-row small { display: block; }
.account-password-row span { color: var(--muted-2); font-size: 7px; font-weight: 850; text-transform: uppercase; }
.account-password-row strong { margin-top: 5px; letter-spacing: .16em; }
.account-password-row small { margin-top: 5px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.account-two-factor { margin-top: 12px; padding: 14px 15px; border: 1px solid var(--line-soft); border-radius: 12px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; background: color-mix(in srgb, var(--cream) 45%, transparent); }
.account-two-factor.active { border-color: color-mix(in srgb, var(--sage) 45%, var(--line-soft)); background: color-mix(in srgb, var(--sage-soft) 55%, var(--paper)); }
.account-two-factor-symbol { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; color: var(--forest); background: var(--cream); font-size: 10px; font-weight: 900; }
.account-two-factor.active .account-two-factor-symbol { color: #fff; background: var(--forest-3); font-size: 17px; }
.account-two-factor span, .account-two-factor strong, .account-two-factor small { display: block; }
.account-two-factor > div > span { color: var(--muted-2); font-size: 7px; font-weight: 850; text-transform: uppercase; }
.account-two-factor strong { margin-top: 3px; font-size: 11px; }
.account-two-factor small { margin-top: 4px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.two-factor-dialog .dialog-form { width: min(590px, calc(100vw - 32px)); }
.two-factor-intro, .two-factor-warning { margin: 15px 0; padding: 13px 14px; border: 1px solid var(--line-soft); border-radius: 12px; display: grid; grid-template-columns: auto 1fr; gap: 11px; align-items: start; background: var(--cream); }
.two-factor-intro > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; background: var(--forest); color: #fff; font-weight: 850; }
.two-factor-intro p, .two-factor-warning p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.two-factor-warning { grid-template-columns: 1fr; border-color: color-mix(in srgb, var(--gold) 42%, var(--line-soft)); }
.two-factor-warning strong { font-size: 11px; }
.two-factor-qr { margin: 16px 0; padding: 16px; border: 1px solid var(--line-soft); border-radius: 14px; display: grid; grid-template-columns: 180px minmax(0, 1fr); align-items: center; gap: 18px; }
.two-factor-qr img { width: 180px; max-width: 100%; aspect-ratio: 1; border-radius: 10px; background: #fff; }
.two-factor-qr span, .two-factor-qr code, .two-factor-qr small { display: block; }
.two-factor-qr span { color: var(--muted-2); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.two-factor-qr code { margin-top: 8px; padding: 9px; border-radius: 8px; background: var(--cream); color: var(--text); font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.two-factor-qr small { margin-top: 7px; color: var(--muted); font-size: 8px; }
.two-factor-recovery-codes { margin: 15px 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.two-factor-recovery-codes code { padding: 10px 12px; border: 1px solid var(--line-soft); border-radius: 9px; background: var(--cream); color: var(--text); text-align: center; font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.account-plan-hero { padding: 20px; border-radius: 16px; color: #fff; background: radial-gradient(circle at 105% 0, rgba(226,138,104,.65), transparent 40%), linear-gradient(145deg, var(--forest), var(--forest-2)); }
.account-plan-hero-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.account-plan-hero span, .account-plan-hero strong, .account-plan-hero small { display: block; }
.account-plan-hero span { color: rgba(255,255,255,.62); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.account-plan-hero strong { margin-top: 8px; font: 500 31px Georgia, serif; }
.account-plan-hero small { margin-top: 6px; color: rgba(255,255,255,.68); font-size: 9px; }
.account-plan-status { padding: 6px 9px; border-radius: 999px; color: #d8eee4; background: rgba(255,255,255,.12); font-size: 8px; font-weight: 850; }
.account-plan-status.cancelled { color: #ffe0b0; background: rgba(181,123,40,.25); }
.account-subscription-facts { margin: 13px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.account-subscription-facts div { padding: 12px; border: 1px solid var(--line-soft); border-radius: 11px; background: var(--cream); }
.account-subscription-facts dt { color: var(--muted-2); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.account-subscription-facts dd { margin: 6px 0 0; font-size: 9px; font-weight: 800; }
.account-subscription-alert { margin-top: 12px; padding: 12px 13px; border: 1px solid #dfc98e; border-radius: 11px; color: #76591f; background: #fbf3dc; font-size: 9px; line-height: 1.55; }
.account-upgrades { margin-top: 18px; }
.account-upgrades > strong { display: block; margin-bottom: 9px; font-size: 10px; }
.account-upgrade-list { display: grid; gap: 8px; }
.account-upgrade-option { padding: 12px 13px; border: 1px solid var(--line-soft); border-radius: 11px; background: var(--white); display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.account-upgrade-option strong, .account-upgrade-option small { display: block; }
.account-upgrade-option small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.account-upgrade-option .button { min-height: 38px; font-size: 9px; }
.account-subscription-actions { margin-top: 15px; display: flex; justify-content: flex-end; }
.account-payment-method { min-height: 90px; padding: 16px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--cream); display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 13px; }
.account-payment-symbol { width: 48px; height: 35px; border-radius: 8px; color: #fff; background: linear-gradient(135deg, #635bff, #8a83ff); display: grid; place-items: center; font-size: 10px; font-weight: 900; }
.account-payment-method strong, .account-payment-method span, .account-payment-method small { display: block; }
.account-payment-method span { margin-top: 4px; font: 700 12px ui-monospace, SFMono-Regular, Consolas, monospace; }
.account-payment-method small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.account-payment-actions { margin-top: 12px; }
.account-payment-actions .button { width: 100%; }
.account-business-hero { padding: 15px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--cream); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.account-business-hero span, .account-business-hero strong, .account-business-hero small { display: block; }
.account-business-hero > div > span { color: var(--muted-2); font-size: 7px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.account-business-hero strong { margin-top: 5px; font: 500 17px Georgia, serif; }
.account-business-hero small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.account-business-country { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 11px; color: var(--forest-2); background: var(--sage-soft); display: grid !important; place-items: center; font-size: 9px; font-weight: 900; }
.account-business-details { margin: 10px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.account-business-details > div { min-width: 0; padding: 11px 12px; border: 1px solid var(--line-soft); border-radius: 11px; }
.account-business-details > div:first-child { grid-column: 1 / -1; }
.account-business-details dt { color: var(--muted-2); font-size: 7px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.account-business-details dd { margin: 5px 0 0; overflow-wrap: anywhere; font-size: 8px; font-weight: 700; line-height: 1.55; }
.imprint-settings-status { margin-bottom: 18px; padding: 14px 16px; border: 1px solid #dfc98e; border-radius: 13px; color: #76591f; background: #fbf3dc; font-size: 9px; line-height: 1.55; }
.imprint-settings-status.complete { border-color: #b8d9c2; color: #2f6d48; background: #edf7f0; }
.imprint-settings-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr); gap: 20px; align-items: start; }
.imprint-settings-form { padding: 23px; }
.imprint-editor-intro { margin: 0; padding: 13px 14px; border-radius: 12px; color: var(--muted); background: var(--cream); font-size: 9px; line-height: 1.6; }
.imprint-form-section { margin-top: 20px; padding-top: 19px; border-top: 1px solid var(--line-soft); }
.imprint-form-section h3 { margin: 0 0 14px; font: 500 17px Georgia, serif; }
.imprint-form-section > label, .imprint-form-section > .form-row { margin-top: 13px; }
.imprint-form-actions { margin-top: 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.imprint-form-actions > span { max-width: 390px; color: var(--muted); font-size: 8px; line-height: 1.5; }
.imprint-admin-preview { position: sticky; top: 18px; padding: 23px; }
.imprint-dialog { width: min(720px, calc(100% - 28px)); max-height: min(90dvh, 900px); overflow: auto; }
.imprint-public-content { min-height: 220px; }
.imprint-document { display: grid; gap: 18px; }
.imprint-document-header { padding: 18px; border-radius: 15px; color: #fff; background: linear-gradient(145deg, var(--forest), var(--forest-2)); }
.imprint-document-header span, .imprint-document-header strong { display: block; }
.imprint-document-header span { color: rgba(255,255,255,.65); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.imprint-document-header strong { margin-top: 7px; font: 500 23px Georgia, serif; }
.imprint-block { padding: 14px 15px; border: 1px solid var(--line-soft); border-radius: 12px; background: var(--white); }
.imprint-block h3 { margin: 0 0 8px; font: 500 15px Georgia, serif; }
.imprint-block p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.7; overflow-wrap: anywhere; }
.imprint-block p + p { margin-top: 6px; }
.imprint-block a { color: var(--forest-2); }
.imprint-additional { white-space: pre-line; }
.imprint-incomplete { padding: 15px; border: 1px solid #dfc98e; border-radius: 12px; color: #76591f; background: #fbf3dc; font-size: 9px; line-height: 1.6; }
.account-promotion-list { display: grid; gap: 8px; }
.account-promotion-item { padding: 13px; border: 1px solid var(--line-soft); border-radius: 11px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.account-promotion-item strong, .account-promotion-item span, .account-promotion-item small { display: block; }
.account-promotion-item strong { font: 750 12px ui-monospace, SFMono-Regular, Consolas, monospace; }
.account-promotion-item span { margin-top: 5px; font-size: 9px; }
.account-promotion-item small { margin-top: 5px; color: var(--muted); font-size: 8px; }
.account-promotion-state { height: fit-content; padding: 5px 7px; border-radius: 999px; color: var(--muted); background: var(--cream); font-size: 7px; font-weight: 850; }
.account-promotion-state.active { color: #2f6d48; background: var(--sage-soft); }
.account-settings-empty { padding: 16px; border: 1px dashed var(--line); border-radius: 12px; color: var(--muted); background: var(--cream); font-size: 9px; line-height: 1.6; }
.account-usage-panel { grid-column: 1 / -1; }
.account-quota-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.account-quota-item { padding: 14px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--cream); }
.account-quota-item > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.account-quota-item span, .account-quota-item strong, .account-quota-item small { display: block; }
.account-quota-item > div > span { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.account-quota-item strong { font-size: 11px; text-align: right; }
.account-quota-item strong small { margin-top: 2px; color: var(--muted); font-size: 7px; font-weight: 600; }
.account-quota-track { height: 7px; margin-top: 12px; overflow: hidden; border-radius: 999px; background: var(--line); }
.account-quota-track > span { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--forest-3), var(--clay)); }
.account-feature-row { margin-top: 12px; padding: 13px 14px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--paper); display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 9px; }
.account-feature-row strong { padding: 5px 8px; border-radius: 999px; font-size: 8px; }
.account-feature-row .included { color: #2b6e47; background: var(--sage-soft); }
.account-feature-row .not-included { color: var(--muted); background: var(--cream); }
.account-data-rights-copy { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.7; }
.account-data-rights-actions { margin-top: 15px; display: flex; flex-wrap: wrap; gap: 9px; }
.account-data-rights-actions .button { flex: 1 1 185px; text-align: center; }
.subscription-upgrade-dialog { width: min(560px, calc(100% - 28px)); }
.subscription-upgrade-preview { margin-top: 20px; }
.upgrade-plan-route { padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: var(--cream); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.upgrade-plan-route > span { color: var(--clay); font-size: 18px; }
.upgrade-plan-route div:last-child { text-align: right; }
.upgrade-plan-route small, .upgrade-plan-route strong { display: block; }
.upgrade-plan-route small { color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.upgrade-plan-route strong { margin-top: 6px; font: 500 20px Georgia, serif; }
.upgrade-cost { margin-top: 11px; padding: 14px 15px; border-radius: 12px; color: #fff; background: var(--forest); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.upgrade-cost span, .upgrade-cost strong, .upgrade-cost small { display: block; }
.upgrade-cost span { font-size: 9px; }
.upgrade-cost strong { font: 600 22px Georgia, serif; text-align: right; }
.upgrade-cost small { margin-top: 3px; color: rgba(255,255,255,.65); font-size: 7px; text-align: right; }
.subscription-upgrade-safety { margin-top: 12px; padding: 13px; border: 1px solid #b8d9c2; border-radius: 11px; color: #2f6d48; background: #edf7f0; display: grid; grid-template-columns: auto 1fr; gap: 9px; }
.subscription-upgrade-safety p { margin: 0; font-size: 8px; line-height: 1.55; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 238px minmax(0, 1fr); background: #f7f5f0; }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 28px 18px 20px; color: rgba(255,255,255,.72); background: var(--forest); display: flex; flex-direction: column; z-index: 20; }
.sidebar-header { margin-bottom: 30px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sidebar .wordmark { padding: 0 11px; color: #fff; }
.sidebar-close, .sidebar-backdrop { display: none; }
.sidebar .brand-mark { border-color: rgba(255,255,255,.5); }
.sidebar nav { min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.2) transparent; display: grid; gap: 5px; }
.nav-item { width: 100%; min-height: 48px; padding: 0 10px; border: 0; border-radius: 10px; color: rgba(255,255,255,.65); background: transparent; display: grid; grid-template-columns: 32px 1fr auto; align-items: center; gap: 8px; text-align: left; font-size: 13px; font-weight: 650; cursor: pointer; }
.nav-item:hover { color: white; background: rgba(255,255,255,.06); }
.nav-item.active { color: white; background: rgba(255,255,255,.11); box-shadow: inset 3px 0 var(--clay); }
.nav-icon { width: 28px; height: 28px; border: 1px solid rgba(255,255,255,.09); border-radius: 8px; color: rgba(255,255,255,.82); background: rgba(255,255,255,.055); display: inline-grid; place-items: center; font: 700 14px/1 "Segoe UI Symbol", "Noto Sans Symbols 2", sans-serif; text-align: center; box-shadow: inset 0 1px rgba(255,255,255,.05); }
.nav-item:hover .nav-icon, .nav-item.active .nav-icon, .nav-dropdown-toggle:hover .nav-icon, .nav-dropdown.contains-active > .nav-dropdown-toggle .nav-icon { color: #fff; border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.11); }
.nav-badge { min-width: 21px; padding: 3px 6px; border-radius: 20px; color: #fff; background: var(--clay); font-size: 10px; text-align: center; }
.provider-nav-item { font-size: 11px; }
.nav-divider { height: 1px; margin: 13px 11px 9px; background: rgba(255,255,255,.12); }
.admin-nav-item { color: rgba(255,255,255,.82); }
.admin-nav-badge { padding: 3px 6px; border: 1px solid rgba(239,182,154,.38); border-radius: 5px; color: #efb69a; font-size: 7px; font-weight: 900; letter-spacing: .07em; }
.nav-dropdown { display: grid; gap: 3px; }
.nav-dropdown[hidden] { display: none; }
.nav-dropdown-toggle { width: 100%; min-height: 48px; padding: 0 10px; border: 0; border-radius: 10px; color: rgba(255,255,255,.82); background: transparent; display: grid; grid-template-columns: 32px 1fr auto; align-items: center; gap: 8px; text-align: left; font-size: 13px; font-weight: 750; cursor: pointer; }
.nav-dropdown-toggle:hover, .nav-dropdown.contains-active > .nav-dropdown-toggle { color: white; background: rgba(255,255,255,.06); }
.nav-dropdown-toggle:focus-visible { outline: 2px solid var(--clay-soft); outline-offset: -2px; }
.nav-dropdown-chevron { width: 22px; height: 22px; display: inline-grid; place-items: center; font: 700 15px/1 "Segoe UI Symbol", sans-serif; transition: transform .18s ease; }
.nav-dropdown-toggle[aria-expanded="true"] .nav-dropdown-chevron { transform: rotate(180deg); }
.nav-dropdown-menu { margin-left: 16px; padding: 3px 0 4px 10px; border-left: 1px solid rgba(255,255,255,.14); display: grid; gap: 3px; }
.nav-dropdown-menu[hidden] { display: none; }
.nav-dropdown-menu .nav-item { min-height: 42px; padding-right: 9px; font-size: 11px; }
.nav-dropdown-menu .nav-icon { width: 24px; height: 24px; border-radius: 7px; font-size: 11px; }
.nav-dropdown-menu .admin-nav-badge { padding: 2px 4px; font-size: 6px; }
.demo-nav-item { margin-top: 4px; color: rgba(255,255,255,.88); border: 1px solid rgba(255,255,255,.11); background: rgba(255,255,255,.045); }
.demo-nav-item:hover { background: rgba(255,255,255,.1); }
.demo-nav-item[aria-pressed="true"] { color: #fff; border-color: rgba(239,182,154,.42); background: rgba(183,104,74,.2); box-shadow: inset 3px 0 var(--clay); }
.demo-nav-badge { padding: 3px 6px; border-radius: 5px; color: #d8eee4; background: rgba(122,174,147,.18); font-size: 7px; font-weight: 900; letter-spacing: .07em; }
.demo-nav-item[aria-pressed="true"] .demo-nav-badge { color: #fff; background: var(--clay); }
.password-link { margin-top: auto; padding: 10px 11px; border: 0; color: rgba(255,255,255,.48); background: transparent; text-align: left; font-size: 10px; cursor: pointer; }
.password-link:hover { color: white; }
.sidebar-footer { margin-top: auto; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sidebar-legal-link { margin-top: auto; padding: 12px 10px; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.65); display: flex; align-items: center; gap: 9px; font-size: 9px; font-weight: 750; text-decoration: none; }
.sidebar-legal-link:hover, .sidebar-legal-link:focus-visible { color: #fff; }
.sidebar-legal-link + .sidebar-footer { margin-top: 0; }
.sidebar-legal-links { margin-top: auto; display: grid; border-top: 1px solid rgba(255,255,255,.1); }
.sidebar-legal-links .sidebar-legal-link { margin: 0; padding-block: 8px; border: 0; }

.legal-admin-notice { display: flex; gap: 12px; margin-bottom: 16px; padding: 15px 17px; border: 1px solid #d9b96f; border-radius: 14px; background: #fff8e8; color: #71551b; }
.legal-admin-notice p { margin: 0; color: inherit; }
.legal-editor-tabs { display: flex; gap: 8px; margin-bottom: 12px; overflow-x: auto; }
.legal-editor-tabs button { padding: 10px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); color: var(--muted); font: inherit; font-weight: 750; white-space: nowrap; cursor: pointer; }
.legal-editor-tabs button.active { border-color: var(--green); background: var(--green); color: #fff; }
.legal-document-form { margin-bottom: 18px; padding: 24px; }
.legal-document-form textarea { min-height: 520px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; line-height: 1.55; }
.legal-document-dialog { width: min(900px, calc(100% - 28px)); max-height: min(92dvh, 1000px); overflow: auto; }
.legal-public-content { max-height: min(70dvh, 760px); padding-right: 6px; overflow: auto; }
.legal-document > header { margin-bottom: 24px; padding: 20px; border-radius: 16px; background: var(--sage-soft); }
.legal-document > header span, .legal-document > header small { display: block; color: var(--muted); font-size: 11px; }
.legal-document > header h2 { margin: 5px 0 8px; }
.legal-document-body { display: grid; gap: 20px; }
.legal-document-body section h3 { margin: 0 0 7px; font-size: 16px; }
.legal-document-body p { margin: 0; white-space: pre-line; line-height: 1.7; color: var(--muted); }
.legal-document > footer { margin-top: 26px; padding-top: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; }
.legal-checkout-consents { display: grid; gap: 9px; }
.legal-checkout-consents a { color: var(--green); font-weight: 800; }
.cancellation-admin-panel { margin-top: 18px; padding: 22px; }
.cancellation-admin-list { display: grid; gap: 12px; }
.cancellation-request { padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); }
.cancellation-request > div:first-child { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cancellation-request > div:first-child small { margin-left: auto; color: var(--muted); }
.cancellation-request dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 15px 0; }
.cancellation-request dl div { min-width: 0; padding: 10px; border-radius: 10px; background: var(--cream); }
.cancellation-request dt { color: var(--muted); font-size: 10px; }
.cancellation-request dd { margin: 4px 0 0; overflow-wrap: anywhere; font-weight: 750; }
.cancellation-request > label { display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.contract-cancellation-dialog { width: min(680px, calc(100% - 28px)); max-height: min(92dvh, 900px); overflow: auto; }
.cancellation-success { padding: 28px 18px; text-align: center; }
.cancellation-success > span { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 12px; border-radius: 50%; background: var(--green); color: #fff; font-size: 24px; }
.cancellation-success code { display: inline-block; padding: 10px 14px; border-radius: 10px; background: var(--cream); color: var(--ink); font-size: 14px; font-weight: 850; }
.cancellation-success pre { max-height: 220px; margin: 16px 0; padding: 14px; overflow: auto; border: 1px solid var(--line); border-radius: 12px; background: var(--cream); color: var(--ink); text-align: left; white-space: pre-wrap; font: 11px/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; }
.password-link + .sidebar-footer { margin-top: 4px; }
.user-chip { display: flex; align-items: center; gap: 10px; min-width: 0; }
.user-chip > span { flex: 0 0 35px; height: 35px; display: grid; place-items: center; border-radius: 50%; color: var(--forest); background: #e8d7c7; font: 700 13px Georgia, serif; }
.user-chip div { min-width: 0; }
.user-chip strong, .user-chip small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-chip strong { color: #fff; font-size: 11px; }
.user-chip small { margin-top: 3px; font-size: 10px; color: rgba(255,255,255,.46); }
.logout-button { width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.08); border-radius: 9px; color: rgba(255,255,255,.68); background: rgba(255,255,255,.035); cursor: pointer; font-size: 16px; }
.logout-button:hover { color: white; background: rgba(255,255,255,.08); }
.main-column { min-width: 0; }
.topbar { min-height: 83px; padding: 16px clamp(24px, 4vw, 55px); border-bottom: 1px solid var(--line-soft); background: rgba(255,255,255,.78); backdrop-filter: blur(16px); display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 15; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.topbar .eyebrow { margin: 0 0 4px; }
.today-label { margin: 0; color: var(--muted); font-size: 12px; }
.menu-button { display: none; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 11px; color: var(--forest-2); background: white; font-size: 18px; }
.content { width: min(1480px, 100%); margin: 0 auto; padding: 42px clamp(24px, 4vw, 55px) 70px; outline: none; }
.page { display: none; }
.page.active-page { display: block; animation: pageIn .26s ease; }
@keyframes pageIn { from { opacity: 0; transform: translateY(4px); } }
.page-heading { margin-bottom: 28px; display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.page-heading h1 { margin: 0; font: 500 clamp(34px, 4vw, 50px)/1.05 Georgia, serif; letter-spacing: -.035em; }
.page-heading > div > p:last-child { margin: 10px 0 0; color: var(--muted); font-size: 14px; }

.summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.summary-card { min-height: 148px; padding: 22px; border: 1px solid var(--line-soft); border-radius: 16px; background: var(--white); box-shadow: 0 10px 32px rgba(32,47,43,.035); display: flex; flex-direction: column; justify-content: space-between; }
.summary-top { display: flex; justify-content: space-between; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.summary-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; color: var(--forest-2); background: var(--sage-soft); font-family: Georgia, serif; font-size: 16px; }
.summary-card strong { font: 500 31px/1 Georgia, serif; letter-spacing: -.025em; }
.summary-card small { color: var(--muted-2); font-size: 11px; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(260px, .65fr); gap: 15px; margin-top: 15px; }
.lower-grid { grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr); }
.dashboard-heading h1 { font-family: Inter, "Segoe UI", sans-serif; font-weight: 760; color: #141d39; }
html[data-theme="dark"] .dashboard-heading h1 { color: var(--ink); }
.dashboard-heading-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.dashboard-editor { margin-bottom: 16px; padding: 22px; border: 1px solid #dfe2e8; border-radius: 18px; background: #fff; box-shadow: 0 16px 42px rgba(25, 32, 58, .07); display: grid; grid-template-columns: minmax(210px, .7fr) minmax(0, 2fr) auto; align-items: center; gap: 20px; }
.dashboard-editor[hidden] { display: none; }
.dashboard-editor h2 { margin: 2px 0 5px; color: #151d39; font: 760 18px/1.2 Inter, "Segoe UI", sans-serif; }
.dashboard-editor p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.dashboard-widget-library { display: grid; grid-template-columns: repeat(3, minmax(140px, 1fr)); gap: 8px; }
.dashboard-widget-library button { min-width: 0; min-height: 72px; padding: 10px 11px; border: 1px solid #e2e4e9; border-radius: 12px; color: #151d39; background: #f8f8f7; display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 2px 8px; text-align: left; cursor: pointer; }
.dashboard-widget-library button:hover:not(:disabled), .dashboard-widget-library button:focus-visible { border-color: #ec8a4b; background: #fff7f1; }
.dashboard-widget-library button:disabled { opacity: .48; cursor: default; }
.dashboard-widget-library button > span { grid-row: 1 / 3; width: 28px; height: 28px; border-radius: 8px; color: #dc6f31; background: #fff0e7; display: grid; place-items: center; font-weight: 850; }
.dashboard-widget-library strong, .dashboard-widget-library small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-widget-library strong { font-size: 10px; }
.dashboard-widget-library small { color: var(--muted); font-size: 7px; }
.dashboard-custom-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-flow: dense; gap: 16px; align-items: stretch; }
.dashboard-widget { position: relative; min-width: 0; grid-column: span 6; }
.dashboard-widget-summary { grid-column: 1 / -1; }
.dashboard-widget-rent { grid-column: span 8; }
.dashboard-widget-occupancy { grid-column: span 4; }
.dashboard-widget-properties { grid-column: span 7; }
.dashboard-widget-tickets { grid-column: span 5; }
.dashboard-widget-payments, .dashboard-widget-calendar { grid-column: span 6; }
.dashboard-widget-quick-actions { grid-column: span 4; }
.dashboard-widget > .panel { height: 100%; border-radius: 18px; border-color: #e4e5e9; box-shadow: 0 12px 34px rgba(25, 32, 58, .055); }
.dashboard-widget .panel h2 { color: #161e39; font-family: Inter, "Segoe UI", sans-serif; font-weight: 760; }
html[data-theme="dark"] .dashboard-widget .panel h2 { color: var(--ink); }
.dashboard-widget.is-editing { border: 2px dashed rgba(236, 126, 65, .5); border-radius: 20px; background: rgba(255, 241, 232, .34); cursor: grab; }
.dashboard-widget.is-editing:active { cursor: grabbing; }
.dashboard-widget.is-editing > .panel { padding-top: 65px; }
.dashboard-widget-summary.is-editing { padding-top: 56px; }
.dashboard-widget.is-dragging { opacity: .38; transform: scale(.985); }
.dashboard-widget.is-drag-target { outline: 3px solid rgba(236, 126, 65, .35); outline-offset: 4px; }
.dashboard-widget-controls { position: absolute; z-index: 12; top: 12px; right: 12px; height: 38px; padding: 4px; border: 1px solid #dedfe4; border-radius: 11px; background: #fff; box-shadow: 0 9px 24px rgba(20, 28, 53, .13); display: flex; align-items: center; gap: 3px; }
.dashboard-drag-handle, .dashboard-widget-controls button { width: 30px; height: 30px; border: 0; border-radius: 8px; color: #60687c; background: transparent; display: grid; place-items: center; font: 800 14px/1 "Segoe UI Symbol", sans-serif; }
.dashboard-drag-handle { cursor: grab; font-size: 18px; }
.dashboard-widget-controls button { cursor: pointer; }
.dashboard-widget-controls button:hover { color: #151d39; background: #f0f1f3; }
.dashboard-widget-controls button[data-dashboard-remove]:hover { color: #a43d30; background: #fff0ec; }
.dashboard-payment-list, .dashboard-appointment-list { margin-top: 18px; display: grid; }
.dashboard-payment-row, .dashboard-appointment-row { min-width: 0; min-height: 57px; padding: 10px 0; border-top: 1px solid var(--line-soft); display: grid; align-items: center; gap: 11px; }
.dashboard-payment-row { grid-template-columns: auto minmax(0, 1fr) auto; }
.dashboard-appointment-row { grid-template-columns: 76px minmax(0, 1fr); }
.dashboard-payment-row:first-child, .dashboard-appointment-row:first-child { border-top: 0; }
.dashboard-payment-row > div, .dashboard-appointment-row > div { min-width: 0; }
.dashboard-payment-row strong, .dashboard-payment-row small, .dashboard-appointment-row strong, .dashboard-appointment-row small { display: block; }
.dashboard-payment-row > strong { color: #151d39; font-size: 11px; }
.dashboard-payment-row small, .dashboard-appointment-row small { margin-top: 4px; color: var(--muted); font-size: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-appointment-row time { padding: 8px 7px; border-radius: 9px; color: #c65f27; background: #fff0e7; font-size: 9px; font-weight: 850; text-align: center; }
.dashboard-quick-actions > div:last-child { margin-top: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.dashboard-quick-button { min-height: 78px; padding: 11px; border: 1px solid #e3e4e8; border-radius: 13px; color: #171f39; background: #fafafa; display: flex; align-items: flex-start; flex-direction: column; justify-content: space-between; gap: 9px; text-align: left; font: 750 9px/1.35 Inter, "Segoe UI", sans-serif; cursor: pointer; }
.dashboard-quick-button:hover { border-color: #ef9a62; background: #fff7f1; }
.dashboard-quick-button span { width: 28px; height: 28px; border-radius: 9px; color: #d76b2e; background: #fff0e7; display: grid; place-items: center; font-size: 13px; }
.dashboard-empty { grid-column: 1 / -1; min-height: 320px; padding: 42px 24px; border: 2px dashed var(--line); border-radius: 20px; color: var(--muted); background: var(--white); display: grid; place-items: center; align-content: center; text-align: center; }
.dashboard-empty > span { width: 52px; height: 52px; border-radius: 15px; color: #d66c30; background: #fff0e7; display: grid; place-items: center; font-size: 25px; }
.dashboard-empty h2 { margin: 16px 0 5px; color: var(--ink); }
.dashboard-empty p { margin: 0; max-width: 440px; font-size: 11px; line-height: 1.6; }
html[data-theme="dark"] .dashboard-editor, html[data-theme="dark"] .dashboard-widget-library button,
html[data-theme="dark"] .dashboard-widget-controls, html[data-theme="dark"] .dashboard-quick-button { border-color: var(--line); color: var(--ink); background: var(--white); }
html[data-theme="dark"] .dashboard-editor h2, html[data-theme="dark"] .dashboard-widget-library button,
html[data-theme="dark"] .dashboard-payment-row > strong { color: var(--ink); }
html[data-theme="dark"] .dashboard-widget-library button:hover:not(:disabled), html[data-theme="dark"] .dashboard-quick-button:hover { border-color: var(--clay); background: var(--clay-soft); }
html[data-theme="dark"] .dashboard-widget-controls button:hover { color: var(--ink); background: var(--cream); }
.panel { padding: 23px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--white); box-shadow: 0 12px 34px rgba(32,47,43,.035); }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.panel h2 { margin: 2px 0 0; font: 500 21px/1.2 Georgia, serif; }
.kicker { margin: 0 0 7px; color: var(--muted-2); font-size: 9px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.legend { color: var(--muted); font-size: 10px; display: flex; align-items: center; gap: 7px; }
.legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--clay); }
.rent-chart { height: 220px; padding: 25px 8px 0; display: flex; align-items: end; gap: clamp(12px, 4vw, 40px); border-bottom: 1px solid var(--line-soft); }
.chart-column { flex: 1; height: 100%; min-width: 24px; display: flex; flex-direction: column; justify-content: end; align-items: center; gap: 9px; position: relative; }
.chart-bar { width: min(42px, 72%); min-height: 3px; border-radius: 7px 7px 2px 2px; background: linear-gradient(180deg, #d88564, var(--clay)); position: relative; transition: height .4s ease; }
.chart-bar::before { content: attr(data-value); position: absolute; top: -20px; left: 50%; transform: translateX(-50%); white-space: nowrap; color: var(--muted); font-size: 9px; opacity: 0; transition: opacity .15s; }
.chart-bar:hover::before { opacity: 1; }
.chart-column small { position: absolute; bottom: -24px; color: var(--muted-2); font-size: 9px; text-transform: uppercase; }
.empty-chart { width: 100%; align-self: center; color: var(--muted); text-align: center; font-size: 13px; }
.interactive-rent-panel { min-height: 440px; overflow: hidden; }
.rent-chart-toolbar { margin-top: 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.rent-chart-legend { display: flex; align-items: center; gap: 14px; color: var(--muted); font-size: 9px; font-weight: 750; }
.rent-chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.rent-chart-legend i { width: 18px; height: 3px; border-radius: 3px; }
.rent-chart-legend i.paid { background: var(--clay); }
.rent-chart-legend i.target { background: repeating-linear-gradient(90deg, var(--sage) 0 4px, transparent 4px 7px); }
.rent-range-switch { padding: 3px; border: 1px solid var(--line); border-radius: 10px; background: var(--cream); display: flex; }
.rent-range-switch button { min-width: 40px; height: 30px; padding: 0 8px; border: 0; border-radius: 7px; color: var(--muted); background: transparent; font: 800 9px Inter, sans-serif; cursor: pointer; transition: color .16s ease, background .16s ease, box-shadow .16s ease; }
.rent-range-switch button:hover { color: var(--ink); }
.rent-range-switch button[aria-pressed="true"] { color: #fff; background: var(--forest); box-shadow: 0 5px 12px rgba(23, 48, 45, .16); }
.rent-insight-summary { margin-top: 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.rent-insight-summary > div { min-width: 0; padding: 10px 12px; border: 1px solid var(--line-soft); border-radius: 11px; background: var(--cream); }
.rent-insight-summary span, .rent-insight-summary strong { display: block; }
.rent-insight-summary span { color: var(--muted); font-size: 7px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.rent-insight-summary strong { margin-top: 5px; color: var(--ink); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rent-insight-chart { position: relative; height: 230px; margin-top: 16px; border-bottom: 1px solid var(--line); }
.rent-line-chart { isolation: isolate; }
.rent-grid-lines { position: absolute; z-index: 0; inset: 18px 0 34px; display: grid; grid-template-rows: repeat(4, 1fr); pointer-events: none; }
.rent-grid-lines i { border-top: 1px solid var(--line-soft); }
.rent-line-svg { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.rent-line-area { fill: color-mix(in srgb, var(--clay) 13%, transparent); }
.rent-line-target, .rent-line-paid { fill: none; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; }
.rent-line-target { stroke: var(--sage); stroke-width: 2; stroke-dasharray: 6 6; opacity: .85; }
.rent-line-paid { stroke: var(--clay); stroke-width: 3; filter: drop-shadow(0 5px 5px rgba(237, 133, 69, .18)); }
.rent-line-selection { stroke: var(--clay); stroke-width: 1; stroke-dasharray: 3 5; opacity: .4; vector-effect: non-scaling-stroke; }
.rent-line-node { fill: var(--white); stroke: var(--clay); stroke-width: 3; vector-effect: non-scaling-stroke; }
.rent-line-hit-grid { position: absolute; z-index: 3; inset: 0; display: grid; }
.rent-line-hit-grid.range-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rent-line-hit-grid.range-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.rent-line-hit-grid.range-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.rent-line-hit-button { position: relative; min-width: 0; padding: 0 1px 32px; border: 0; border-radius: 8px 8px 0 0; color: var(--muted); background: transparent; cursor: pointer; transition: background .16s ease; }
.rent-line-hit-button:hover, .rent-line-hit-button.selected { background: linear-gradient(180deg, color-mix(in srgb, var(--clay) 7%, transparent), transparent 76%); }
.rent-line-hit-button:focus-visible { outline: 2px solid var(--clay); outline-offset: -2px; }
.rent-line-month { position: absolute; right: 0; bottom: 8px; left: 0; color: inherit; font-size: 8px; font-weight: 800; letter-spacing: .02em; text-align: center; text-transform: uppercase; }
.rent-line-hit-button.selected .rent-line-month { color: var(--clay); }
.rent-line-tooltip { position: absolute; z-index: 4; top: 9px; left: 50%; padding: 8px 9px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: var(--white); box-shadow: 0 10px 24px rgba(20, 39, 36, .14); opacity: 0; pointer-events: none; transform: translate(-50%, -4px); transition: opacity .16s ease, transform .16s ease; white-space: nowrap; }
.rent-line-tooltip strong, .rent-line-tooltip small { display: block; }
.rent-line-tooltip strong { font-size: 10px; }
.rent-line-tooltip small { margin-top: 3px; color: var(--muted); font-size: 7px; }
.rent-line-hit-button:hover .rent-line-tooltip, .rent-line-hit-button:focus-visible .rent-line-tooltip { opacity: 1; transform: translate(-50%, 0); }
.rent-line-empty { position: absolute; z-index: 2; top: 47%; left: 50%; margin: 0; padding: 7px 10px; border: 1px solid var(--line-soft); border-radius: 999px; color: var(--muted); background: color-mix(in srgb, var(--white) 88%, transparent); font-size: 8px; font-weight: 750; text-align: center; transform: translate(-50%, -50%); pointer-events: none; white-space: nowrap; }
.rent-axis-direction { margin-top: 6px; color: var(--muted-2); display: flex; justify-content: space-between; gap: 12px; font-size: 7px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.rent-selected-detail { margin-top: 14px; padding: 13px 14px; border-left: 3px solid var(--clay); border-radius: 0 12px 12px 0; background: var(--cream); display: grid; grid-template-columns: minmax(150px, 1fr) auto; align-items: center; gap: 15px; }
.rent-selected-detail span, .rent-selected-detail strong { display: block; }
.rent-selected-detail span { color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.rent-selected-detail > div > strong { margin-top: 5px; color: var(--ink); font-size: 12px; }
.rent-selected-detail dl { margin: 0; display: grid; grid-template-columns: repeat(3, auto); gap: 18px; }
.rent-selected-detail dt { color: var(--muted); font-size: 7px; text-transform: uppercase; }
.rent-selected-detail dd { margin: 4px 0 0; color: var(--ink); font-size: 10px; font-weight: 800; text-align: right; }
.focus-panel { color: white; background: radial-gradient(circle at 110% 0, rgba(201,109,75,.38), transparent 46%), var(--forest); border-color: transparent; }
.focus-panel .kicker { color: rgba(255,255,255,.5); }
.occupancy-wrap { min-height: 185px; display: grid; place-items: center; }
.occupancy-ring { --value: 0%; width: 142px; height: 142px; border-radius: 50%; background: conic-gradient(var(--clay) var(--value), rgba(255,255,255,.1) 0); display: grid; place-items: center; position: relative; }
.occupancy-ring::after { content: ""; position: absolute; inset: 11px; border-radius: 50%; background: var(--forest); }
.occupancy-ring strong, .occupancy-ring span { position: absolute; z-index: 1; }
.occupancy-ring strong { margin-top: -13px; font: 500 30px Georgia, serif; }
.occupancy-ring span { margin-top: 30px; color: rgba(255,255,255,.55); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }
.focus-copy { margin: 0; color: rgba(255,255,255,.62); font-size: 11px; line-height: 1.55; text-align: center; }
.text-button { padding: 4px; border: 0; color: var(--clay); background: transparent; font-size: 11px; font-weight: 750; cursor: pointer; }
.property-list, .ticket-list { margin-top: 18px; }
.property-row, .ticket-row { padding: 14px 0; border-top: 1px solid var(--line-soft); display: grid; align-items: center; gap: 12px; }
.property-row { grid-template-columns: 42px minmax(0, 1fr) auto; }
.property-avatar { width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; color: var(--forest); background: var(--sage-soft); font: 600 18px Georgia, serif; }
.row-main strong, .row-main small { display: block; }
.row-main strong { font-size: 12px; }
.row-main small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.row-meta { text-align: right; }
.row-meta strong { display: block; font: 500 14px Georgia, serif; }
.row-meta small { color: var(--muted); font-size: 9px; }
.ticket-row { grid-template-columns: 8px minmax(0, 1fr) auto; }
.priority-line { width: 4px; height: 34px; border-radius: 4px; background: var(--sage); }
.priority-line.high { background: var(--clay); }
.priority-line.medium { background: var(--gold); }
.empty-state { padding: 34px 18px; color: var(--muted); text-align: center; }
.empty-state strong { display: block; margin-bottom: 7px; color: var(--ink); font: 500 17px Georgia, serif; }

.cards-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 19px; }
.property-card { min-height: 390px; padding: 0; overflow: hidden; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--white); box-shadow: 0 16px 38px rgba(32,47,43,.06); display: flex; flex-direction: column; transition: transform .22s, box-shadow .22s; }
.property-card:not(.add-card):hover { transform: translateY(-3px); box-shadow: 0 23px 46px rgba(24,45,40,.11); }
.property-card-media { position: relative; height: 176px; overflow: hidden; color: white; background: radial-gradient(circle at 82% 8%, rgba(226,138,104,.48), transparent 30%), linear-gradient(145deg, #1b4b48, #0f2d2d); }
.property-card-media img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .5s ease; }
.property-card:hover .property-card-media img { transform: scale(1.025); }
.property-card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,22,21,.06), rgba(8,22,21,.55)); pointer-events: none; }
.property-media-placeholder { position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255,255,255,.9); }
.property-media-placeholder span { width: 70px; height: 70px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.34); border-radius: 22px; background: rgba(255,255,255,.08); font: 500 34px Georgia, serif; backdrop-filter: blur(8px); }
.property-card-badges { position: absolute; z-index: 2; left: 14px; right: 14px; top: 14px; display: flex; justify-content: space-between; gap: 8px; }
.image-count { height: 26px; padding: 0 9px; border-radius: 20px; color: white; background: rgba(9,29,28,.62); display: inline-flex; align-items: center; gap: 5px; font-size: 9px; font-weight: 750; backdrop-filter: blur(8px); }
.property-card-body { flex: 1; padding: 20px 21px 19px; display: flex; flex-direction: column; }
.property-card h2 { margin: 0 0 5px; font: 500 22px/1.2 Georgia, serif; }
.property-card address { color: var(--muted); font-size: 10px; font-style: normal; line-height: 1.5; }
.occupancy-pill { height: 26px; padding: 0 9px; border-radius: 20px; color: var(--forest-2); background: var(--sage-soft); display: inline-flex; align-items: center; font-size: 9px; font-weight: 750; white-space: nowrap; }
.property-card-media .occupancy-pill { color: #d8f0df; background: rgba(16,47,48,.75); backdrop-filter: blur(8px); }
.property-card-stats { margin-top: auto; padding-top: 18px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.property-card-stats strong, .property-card-stats small { display: block; }
.property-card-stats strong { font: 500 16px Georgia, serif; }
.property-card-stats small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.property-card-footer { margin-top: 17px; padding-top: 14px; border-top: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.property-card-footer strong { font: 500 15px Georgia, serif; }
.property-card-footer small { display: block; margin-top: 3px; color: var(--muted); font-size: 8px; }
.property-card-actions, .table-action-group { display: flex; align-items: center; gap: 6px; }
.card-icon-action { width: 34px; height: 34px; padding: 0; border: 1px solid var(--line); border-radius: 9px; color: var(--forest-2); background: transparent; display: inline-grid; place-items: center; cursor: pointer; font-size: 15px; line-height: 1; }
.card-icon-action:hover { background: var(--sage-soft); }
.card-icon-action.danger, .table-action.danger { color: var(--red); }
.card-icon-action.danger:hover { background: var(--red-soft); }
.details-button { min-height: 35px; padding: 0 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--forest-2); background: transparent; font-size: 9px; font-weight: 800; cursor: pointer; }
.details-button:hover { background: var(--sage-soft); }
.add-card { padding: 28px; border: 1px dashed #c9c7bf; background: transparent; align-items: center; justify-content: center; text-align: center; cursor: pointer; }
.add-card:hover { background: rgba(255,255,255,.5); }
.add-card span { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; color: white; background: var(--forest); font-size: 22px; }
.add-card strong { margin-top: 15px; font: 500 17px Georgia, serif; }
.add-card small { margin-top: 5px; color: var(--muted); }

.table-panel { padding: 0; overflow: hidden; }
.table-toolbar { min-height: 72px; padding: 14px 20px; border-bottom: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.table-toolbar input { width: min(330px, 100%); min-height: 40px; background: #faf9f5; }
.payment-table-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) auto auto; }
.payment-search { position: relative; }
.payment-table-toolbar .payment-search input { width: 100%; padding-left: 38px; }
.payment-search > span { position: absolute; left: 13px; top: 10px; z-index: 1; color: var(--muted); font: 18px/1 Georgia, serif; pointer-events: none; }
.count-label { color: var(--muted); font-size: 11px; }
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 760px; }
th { padding: 13px 20px; color: var(--muted-2); background: #faf9f5; font-size: 9px; letter-spacing: .1em; text-align: left; text-transform: uppercase; }
td { padding: 16px 20px; border-top: 1px solid var(--line-soft); font-size: 11px; vertical-align: middle; }
td strong, td small { display: block; }
td small { margin-top: 4px; color: var(--muted); }
.status-pill { min-height: 25px; padding: 0 9px; border-radius: 20px; display: inline-flex; align-items: center; gap: 6px; font-size: 9px; font-weight: 750; }
.status-pill::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.status-paid, .status-active { color: #386b4a; background: var(--sage-soft); }
.status-open { color: #826225; background: var(--gold-soft); }
.status-overdue { color: var(--red); background: var(--red-soft); }
.status-notice, .status-in_progress { color: #876326; background: var(--gold-soft); }
.status-scheduled { color: #35667b; background: #e5f1f5; }
.status-ended, .status-closed, .status-resolved { color: var(--muted); background: #ececea; }
.table-action { padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--forest-2); font-size: 9px; font-weight: 750; cursor: pointer; }
.payment-action-group { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.payment-paid-action { color: #377552; }
.payment-reopen-action { color: var(--red); background: var(--red-soft); border-color: color-mix(in srgb, var(--red) 24%, var(--line)); }
.mini-summary { margin-bottom: 16px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.mini-stat { padding: 18px 20px; border: 1px solid var(--line-soft); border-radius: 15px; background: var(--white); }
.mini-stat small, .mini-stat strong { display: block; }
.mini-stat small { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .09em; }
.mini-stat strong { margin-top: 8px; font: 500 23px Georgia, serif; }
.filter-tabs { display: flex; gap: 5px; padding: 4px; border-radius: 10px; background: #f2f0e9; }
.filter { min-height: 32px; padding: 0 12px; border: 0; border-radius: 7px; color: var(--muted); background: transparent; font-size: 10px; font-weight: 700; cursor: pointer; }
.filter.active { color: var(--ink); background: white; box-shadow: 0 2px 7px rgba(20,35,31,.08); }

.calculator-layout { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: 18px; align-items: start; }
.calculator-form { display: grid; gap: 14px; }
.calc-section { padding: 23px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--white); box-shadow: 0 12px 34px rgba(32,47,43,.035); }
.calc-property-picker { background: linear-gradient(145deg, var(--white), var(--sage-soft)); }
.calc-section-heading { margin-bottom: 20px; display: flex; align-items: flex-start; gap: 12px; }
.calc-section-heading > span { flex: 0 0 31px; height: 31px; border-radius: 9px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font: 500 11px Georgia, serif; }
.calc-section-heading h2 { margin: 0; font: 500 20px/1.2 Georgia, serif; }
.calc-section-heading p { margin: 5px 0 0; color: var(--muted); font-size: 10px; }
.calc-fields { margin-top: 15px; display: grid; gap: 13px; }
.calc-fields.two-cols { grid-template-columns: 1fr 1fr; }
.calc-fields label, .calc-section > label { color: var(--muted); }
.calc-section input, .calc-section select { background: var(--paper); }
.range-field output { float: right; color: var(--ink); font: 500 13px Georgia, serif; }
.range-field input[type="range"] { min-height: 28px; height: 28px; padding: 0; border: 0; box-shadow: none; background: transparent; accent-color: var(--clay); cursor: pointer; }
.calculator-results { position: sticky; top: 101px; display: grid; gap: 14px; }
.profit-result-card { min-height: 235px; padding: 27px; overflow: hidden; position: relative; border-radius: var(--radius); color: white; background: radial-gradient(circle at 100% 0, rgba(226,138,104,.52), transparent 38%), linear-gradient(145deg, #123735, #0d2929); box-shadow: 0 20px 48px rgba(15,43,42,.2); }
.profit-result-card.loss { background: radial-gradient(circle at 100% 0, rgba(239,154,135,.42), transparent 38%), linear-gradient(145deg, #3d2927, #241c1b); }
.profit-result-card::after { content: ""; position: absolute; width: 210px; height: 210px; right: -110px; bottom: -125px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; }
.profit-result-card .kicker { color: rgba(255,255,255,.52); }
.profit-result-card > strong { display: block; margin-top: 30px; font: 500 clamp(38px, 5vw, 55px)/.95 Georgia, serif; letter-spacing: -.035em; }
.profit-result-card > span { display: block; margin-top: 7px; color: rgba(255,255,255,.58); font-size: 10px; }
.profit-annual { margin-top: 25px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.13); display: flex; align-items: center; justify-content: space-between; }
.profit-annual span { color: rgba(255,255,255,.55); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }
.profit-annual strong { font: 500 18px Georgia, serif; }
.profit-status { margin-top: 14px; display: inline-flex; align-items: center; gap: 7px; color: rgba(255,255,255,.7); font-size: 9px; font-weight: 750; }
.profit-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #9aa7a2; }
.profit-status.positive::before { background: #8fd0a3; }
.profit-status.negative::before { background: #ef9a87; }
.result-panel { padding: 21px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--white); }
.cashflow-breakdown { margin-top: 19px; display: grid; gap: 13px; }
.cashflow-row { display: grid; grid-template-columns: minmax(110px, 1fr) minmax(100px, 1.25fr) auto; align-items: center; gap: 10px; }
.cashflow-row > span { color: var(--muted); font-size: 9px; }
.cashflow-row > strong { min-width: 82px; font: 500 12px Georgia, serif; text-align: right; }
.cashflow-track { height: 7px; overflow: hidden; border-radius: 8px; background: var(--line-soft); }
.cashflow-bar { height: 100%; min-width: 2px; border-radius: inherit; background: var(--sage); }
.cashflow-row.negative .cashflow-bar { background: var(--clay); }
.cashflow-row.total { padding-top: 12px; border-top: 1px solid var(--line-soft); }
.cashflow-row.total > span, .cashflow-row.total > strong { color: var(--ink); font-weight: 800; }
.cashflow-row.total .cashflow-bar { background: var(--forest-3); }
.return-metrics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.return-metric { min-height: 96px; padding: 16px; border: 1px solid var(--line-soft); border-radius: 14px; background: var(--white); }
.return-metric strong, .return-metric small { display: block; }
.return-metric strong { font: 500 22px Georgia, serif; }
.return-metric small { margin-top: 7px; color: var(--muted); font-size: 8px; letter-spacing: .06em; text-transform: uppercase; }
.result-list { margin: 18px 0 0; }
.result-list div { padding: 10px 0; border-top: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.result-list dt { color: var(--muted); font-size: 9px; }
.result-list dd { margin: 0; font: 500 12px Georgia, serif; text-align: right; }
.calculator-disclaimer { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--line-soft); color: var(--muted-2); font-size: 8px; line-height: 1.65; }
.calculator-disclaimer a { color: var(--clay); }

.ticket-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; align-items: start; }
.ticket-column { min-height: 260px; padding: 14px; border-radius: 18px; background: #eeece6; }
.ticket-column-heading { padding: 4px 4px 14px; display: flex; justify-content: space-between; align-items: center; }
.ticket-column-heading strong { font: 500 16px Georgia, serif; }
.ticket-column-heading span { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 20px; display: grid; place-items: center; color: var(--muted); background: white; font-size: 9px; }
.ticket-card { margin-top: 10px; padding: 17px; border: 1px solid rgba(26,47,44,.05); border-radius: 13px; background: white; box-shadow: 0 8px 20px rgba(32,47,43,.04); }
.ticket-card:first-of-type { margin-top: 0; }
.ticket-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.priority-pill { padding: 4px 7px; border-radius: 6px; color: var(--muted); background: #ececea; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.priority-pill.high { color: var(--red); background: var(--red-soft); }
.priority-pill.medium { color: #856128; background: var(--gold-soft); }
.ticket-card h3 { margin: 13px 0 7px; font: 500 16px/1.3 Georgia, serif; }
.ticket-card p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.ticket-card-footer { margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ticket-card-footer small { color: var(--muted-2); font-size: 8px; }
.ticket-next { border: 0; color: var(--forest-2); background: transparent; font-size: 9px; font-weight: 750; cursor: pointer; }

.calendar-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(290px, 340px); gap: 15px; align-items: start; }
.calendar-heading-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.calendar-sync-status { margin: -6px 0 16px; padding: 17px 19px; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(120deg, var(--paper), color-mix(in srgb, var(--sage-soft) 35%, var(--paper))); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 15px; }
.calendar-sync-status.active { border-color: color-mix(in srgb, var(--sage) 60%, var(--line)); }
.calendar-sync-icon { width: 45px; height: 45px; border-radius: 13px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font-size: 18px; font-weight: 850; }
.calendar-sync-status.active .calendar-sync-icon { color: #fff; background: var(--forest-2); }
.calendar-sync-copy { min-width: 0; }
.calendar-sync-copy > div:first-child { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.calendar-sync-copy strong { font-size: 11px; }
.calendar-sync-copy p { margin: 5px 0 0; color: var(--muted); font-size: 9px; }
.calendar-sync-live { padding: 4px 8px; border-radius: 20px; color: var(--forest-2); background: var(--sage-soft); font-size: 7px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.calendar-sync-live i { width: 6px; height: 6px; margin-right: 3px; border-radius: 50%; background: #52a66f; display: inline-block; }
.calendar-platforms { margin-top: 9px; display: flex; flex-wrap: wrap; gap: 5px; }
.calendar-platform-chip { padding: 4px 8px; border: 1px solid var(--line-soft); border-radius: 20px; color: var(--muted); background: var(--white); font-size: 7px; font-weight: 780; }
.calendar-sync-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.calendar-disconnect { color: var(--red); }
.calendar-panel { padding: 0; overflow-x: auto; }
.calendar-toolbar { min-width: 760px; min-height: 76px; padding: 16px 18px; border-bottom: 1px solid var(--line-soft); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.calendar-toolbar > div { display: flex; align-items: center; gap: 6px; }
.calendar-toolbar h2 { margin: 0; font-size: 22px; text-align: center; text-transform: capitalize; }
.calendar-toolbar > .count-label { justify-self: end; }
.calendar-nav-button, .calendar-today-button { min-height: 36px; border: 1px solid var(--line); border-radius: 9px; color: var(--forest-2); background: var(--white); cursor: pointer; font-size: 11px; font-weight: 800; }
.calendar-nav-button { width: 36px; }
.calendar-today-button { padding: 0 12px; }
.calendar-nav-button:hover, .calendar-today-button:hover { background: var(--sage-soft); }
.calendar-weekdays { min-width: 760px; display: grid; grid-template-columns: repeat(7, 1fr); }
.calendar-weekdays span { padding: 10px 8px; border-right: 1px solid var(--line-soft); color: var(--muted-2); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.calendar-grid { min-width: 760px; display: grid; grid-template-columns: repeat(7, 1fr); }
.calendar-day { min-height: 122px; padding: 8px; border-top: 1px solid var(--line-soft); border-right: 1px solid var(--line-soft); background: var(--white); cursor: pointer; outline: none; }
.calendar-day:nth-child(7n) { border-right: 0; }
.calendar-day:hover, .calendar-day:focus-visible { background: color-mix(in srgb, var(--sage-soft) 42%, var(--white)); }
.calendar-day.outside { background: color-mix(in srgb, var(--cream) 62%, var(--white)); }
.calendar-day.outside .calendar-day-number { color: var(--muted-2); opacity: .55; }
.calendar-day-number { width: 25px; height: 25px; color: var(--muted); display: grid; place-items: center; font-size: 9px; font-weight: 800; }
.calendar-day.today .calendar-day-number { border-radius: 50%; color: white; background: var(--clay); }
.calendar-day-events { margin-top: 4px; display: grid; gap: 4px; }
.calendar-day-events > small { color: var(--muted-2); font-size: 7px; text-align: center; }
.calendar-event { width: 100%; min-height: 25px; padding: 4px 6px; border: 0; border-left: 3px solid var(--forest-2); border-radius: 5px; overflow: hidden; color: var(--forest-2); background: var(--sage-soft); display: block; font-size: 7px; font-weight: 750; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.calendar-event > span { margin-right: 4px; opacity: .7; font-weight: 600; }
.calendar-event.category-repair { color: var(--red); border-left-color: var(--red); background: var(--red-soft); }
.calendar-event.category-handover, .calendar-event.category-deadline { color: #856128; border-left-color: var(--gold); background: var(--gold-soft); }
.calendar-event.status-completed { opacity: .55; text-decoration: line-through; }
.calendar-event.status-cancelled { opacity: .42; text-decoration: line-through; }
.calendar-agenda { position: sticky; top: 99px; }
.calendar-upcoming-list { margin-top: 15px; display: grid; }
.calendar-agenda-item { width: 100%; padding: 12px 0; border: 0; border-top: 1px solid var(--line-soft); color: var(--ink); background: transparent; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 11px; text-align: left; cursor: pointer; }
.calendar-agenda-item:first-child { border-top: 0; }
.calendar-agenda-item:hover .calendar-agenda-copy strong { color: var(--forest-2); }
.calendar-agenda-date { width: 40px; height: 44px; border-radius: 10px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; align-content: center; }
.calendar-agenda-item.category-repair .calendar-agenda-date { color: var(--red); background: var(--red-soft); }
.calendar-agenda-item.category-handover .calendar-agenda-date, .calendar-agenda-item.category-deadline .calendar-agenda-date { color: #856128; background: var(--gold-soft); }
.calendar-agenda-date strong, .calendar-agenda-date small { display: block; }
.calendar-agenda-date strong { font: 600 15px Georgia, serif; }
.calendar-agenda-date small { font-size: 7px; text-transform: uppercase; }
.calendar-agenda-copy { min-width: 0; }
.calendar-agenda-copy > small, .calendar-agenda-copy > strong, .calendar-agenda-copy > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-agenda-copy > small { color: var(--muted-2); font-size: 7px; }
.calendar-agenda-copy > strong { margin-top: 4px; font-size: 10px; }
.calendar-agenda-copy > span { margin-top: 4px; color: var(--muted); font-size: 8px; }
.calendar-connect-dialog .dialog-form { width: min(620px, calc(100vw - 32px)); }
.calendar-connect-intro { padding: 15px; border-radius: 14px; background: var(--sage-soft); display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 12px; }
.calendar-connect-intro > span { width: 36px; height: 36px; border-radius: 10px; color: #fff; background: var(--forest-2); display: grid; place-items: center; font-size: 17px; }
.calendar-connect-intro strong { font-size: 11px; }
.calendar-connect-intro p { margin: 5px 0 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.calendar-provider-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.calendar-provider-button { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 13px; color: var(--ink); background: var(--white); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px; text-decoration: none; transition: transform .18s, border-color .18s; }
.calendar-provider-button:hover { border-color: var(--sage); transform: translateY(-1px); }
.calendar-provider-mark { width: 30px; height: 30px; border-radius: 9px; color: #fff; background: #333; display: grid; place-items: center; font-size: 10px; font-weight: 900; }
.calendar-provider-button.google .calendar-provider-mark { background: #4285f4; }
.calendar-provider-button.outlook .calendar-provider-mark { background: #1473e6; }
.calendar-provider-button strong, .calendar-provider-button small { display: block; }
.calendar-provider-button strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.calendar-provider-button small { margin-top: 3px; color: var(--muted-2); font-size: 7px; }
.calendar-provider-button b { color: var(--muted-2); font-size: 11px; }
.calendar-feed-box { padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--paper); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.calendar-feed-box > span { grid-column: 1 / -1; color: var(--muted-2); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.calendar-feed-box code { min-width: 0; padding: 10px; border-radius: 9px; overflow: hidden; color: var(--forest-2); background: var(--sage-soft); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.calendar-security-note { padding: 12px 14px; border-left: 3px solid var(--gold); border-radius: 8px; background: var(--gold-soft); }
.calendar-security-note strong { color: var(--ink); font-size: 9px; }
.calendar-security-note p, .calendar-refresh-note { margin: 4px 0 0; color: var(--muted); font-size: 8px; line-height: 1.55; }
.calendar-refresh-note { margin: -4px 0 0; }
.appointment-dialog { width: min(700px, calc(100% - 28px)); max-height: min(92vh, 900px); overflow: auto; }
.appointment-all-day { min-height: 69px; margin-top: 0; padding: 0 13px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); display: flex; align-items: center; gap: 9px; cursor: pointer; }
.appointment-all-day input { width: 18px; min-height: 18px; height: 18px; margin: 0; accent-color: var(--forest-2); }
.appointment-time-fields { transition: opacity .18s; }
.appointment-time-fields.disabled { opacity: .4; }
.appointment-delete-button { margin-right: auto; }

.provider-summary-grid { margin-bottom: 15px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.provider-summary-card { min-height: 116px; padding: 18px; border: 1px solid var(--line-soft); border-radius: 16px; background: var(--white); display: flex; align-items: center; gap: 14px; }
.provider-summary-icon { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 12px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font: 700 16px Georgia, serif; }
.provider-summary-card small, .provider-summary-card strong, .provider-summary-card p { display: block; }
.provider-summary-card small { color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.provider-summary-card strong { margin-top: 7px; font: 500 25px Georgia, serif; }
.provider-summary-card p { margin: 3px 0 0; color: var(--muted-2); font-size: 8px; line-height: 1.35; }
.provider-directory-panel { padding: 0; overflow: hidden; }
.provider-toolbar { min-height: 78px; padding: 14px 18px; border-bottom: 1px solid var(--line-soft); display: grid; grid-template-columns: minmax(260px, 1fr) 190px 170px auto; align-items: end; gap: 10px; }
.provider-search { position: relative; }
.provider-search input { min-height: 45px; padding-left: 40px; }
.provider-search-icon { position: absolute; left: 14px; top: 13px; z-index: 1; color: var(--muted); font: 19px/1 Georgia, serif; pointer-events: none; }
.provider-filter-label > span { margin: 0 0 6px 3px; color: var(--muted-2); display: block; font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
.provider-filter-label select { min-height: 45px; margin-top: 0; }
.provider-toolbar .count-label { align-self: center; min-width: 58px; text-align: right; }
.provider-grid { padding: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.provider-card { min-width: 0; padding: 19px; border: 1px solid var(--line-soft); border-radius: 17px; background: var(--paper); box-shadow: 0 9px 26px rgba(32,47,43,.035); }
.provider-card.recommended { border-color: color-mix(in srgb, var(--gold) 55%, var(--line)); box-shadow: inset 0 3px var(--gold), 0 9px 26px rgba(32,47,43,.035); }
.provider-card-top { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: start; gap: 12px; }
.provider-avatar { width: 44px; height: 44px; border-radius: 13px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font: 600 20px Georgia, serif; }
.provider-title { min-width: 0; }
.provider-title h2 { margin: 7px 0 0; overflow: hidden; text-overflow: ellipsis; font: 500 18px/1.2 Georgia, serif; white-space: nowrap; }
.provider-title > p { margin: 4px 0 0; color: var(--muted); font-size: 9px; }
.provider-badges { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
.provider-trade, .provider-recommended, .provider-emergency { padding: 4px 7px; border-radius: 20px; font-size: 7px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.provider-trade { color: var(--forest-2); background: var(--sage-soft); }
.provider-recommended { color: #815d20; background: var(--gold-soft); }
.provider-emergency { color: var(--red); background: var(--red-soft); }
.provider-availability { padding: 6px 8px; border-radius: 20px; color: var(--muted); background: var(--cream); display: inline-flex; align-items: center; gap: 5px; font-size: 7px; font-weight: 850; text-transform: uppercase; white-space: nowrap; }
.provider-availability i { width: 6px; height: 6px; border-radius: 50%; background: var(--muted-2); }
.provider-availability.available { color: #377552; background: var(--sage-soft); }
.provider-availability.available i { background: #4b9a64; }
.provider-availability.limited { color: #856128; background: var(--gold-soft); }
.provider-availability.limited i { background: var(--gold); }
.provider-contact-grid { margin-top: 17px; padding: 13px; border-radius: 12px; background: var(--cream); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.provider-contact-grid > div { min-width: 0; }
.provider-contact-grid small, .provider-contact-grid strong, .provider-contact-grid a { display: block; }
.provider-contact-grid small { margin-bottom: 4px; color: var(--muted-2); font-size: 7px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.provider-contact-grid strong, .provider-contact-grid a { overflow: hidden; color: var(--ink); font-size: 9px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.provider-contact-grid a { color: var(--forest-2); text-decoration: none; }
.provider-contact-grid a:hover { text-decoration: underline; }
.provider-commercial { padding: 13px 2px; border-bottom: 1px solid var(--line-soft); display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.provider-commercial small, .provider-commercial strong { display: block; }
.provider-commercial small { color: var(--muted-2); font-size: 7px; text-transform: uppercase; letter-spacing: .06em; }
.provider-commercial strong { margin-top: 5px; font-size: 9px; }
.provider-rating { color: var(--gold); letter-spacing: .05em; }
.provider-notes { margin: 12px 0 0; color: var(--muted); display: -webkit-box; overflow: hidden; font-size: 9px; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.provider-card-actions { margin-top: 15px; display: flex; align-items: center; gap: 7px; }
.provider-card-actions .button { min-height: 36px; padding: 0 11px; font-size: 9px; text-decoration: none; }
.provider-delete { width: 34px; height: 34px; margin-left: auto; border: 1px solid var(--line); border-radius: 9px; color: var(--red); background: transparent; font-size: 17px; cursor: pointer; }
.provider-delete:hover { border-color: var(--red); background: var(--red-soft); }
.provider-empty { min-height: 350px; grid-column: 1 / -1; display: grid; place-items: center; align-content: center; text-align: center; }
.provider-empty > span { width: 55px; height: 55px; border-radius: 16px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font: 700 22px Georgia, serif; }
.provider-empty h2 { margin: 16px 0 7px; }
.provider-empty p { max-width: 430px; margin: 0 0 17px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.provider-dialog { width: min(760px, calc(100% - 28px)); max-height: min(92vh, 960px); overflow: auto; }
.provider-check-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.provider-check { min-height: 58px; padding: 11px; border: 1px solid var(--line); border-radius: 11px; display: flex; align-items: center; gap: 10px; cursor: pointer; }
.provider-check input { width: 18px; min-height: 18px; height: 18px; margin: 0; flex: 0 0 18px; accent-color: var(--forest-2); }
.provider-check strong, .provider-check small { display: block; }
.provider-check strong { color: var(--ink); font-size: 9px; }
.provider-check small { margin-top: 3px; color: var(--muted); font-size: 8px; }

.admin-heading { align-items: center; }
.admin-role-chip { padding: 8px 11px; border: 1px solid var(--line); border-radius: 20px; color: var(--forest-2); background: var(--white); font-size: 9px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.admin-section-tabs { margin-bottom: 20px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.admin-section-tab { min-height: 76px; padding: 12px 14px; border: 1px solid var(--line-soft); border-radius: 15px; color: var(--text); background: var(--white); display: flex; align-items: center; gap: 11px; text-align: left; cursor: pointer; transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease; }
.admin-section-tab:hover { transform: translateY(-2px); border-color: var(--sage); }
.admin-section-tab.active { color: white; border-color: var(--forest-2); background: var(--forest-2); box-shadow: 0 10px 28px rgba(20,66,64,.15); }
.admin-section-tab > span:last-child, .admin-section-tab strong, .admin-section-tab small { display: block; }
.admin-section-tab strong { font-size: 10px; }
.admin-section-tab small { margin-top: 4px; color: var(--muted-2); font-size: 8px; line-height: 1.3; }
.admin-section-tab.active small { color: rgba(255,255,255,.7); }
.admin-tab-icon { width: 35px; height: 35px; flex: 0 0 35px; border-radius: 10px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font-size: 12px; font-weight: 900; }
.admin-section-tab.active .admin-tab-icon { color: white; background: rgba(255,255,255,.14); }
.admin-section[hidden] { display: none !important; }
.admin-section-heading { margin: 4px 0 16px; }
.admin-section-heading h2 { margin: 3px 0 6px; font: 500 24px Georgia, serif; }
.admin-section-heading p:last-child { margin: 0; color: var(--muted); font-size: 10px; }
.admin-accounts-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.admin-health { min-height: 74px; margin-bottom: 15px; padding: 15px 18px; border: 1px solid #cfe2d3; border-radius: 15px; background: #edf6ef; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.admin-health > div { display: flex; align-items: center; gap: 12px; }
.admin-health-dot { width: 12px; height: 12px; flex: 0 0 12px; border-radius: 50%; background: #4b9a64; box-shadow: 0 0 0 7px rgba(75,154,100,.12); }
.admin-health strong, .admin-health small { display: block; }
.admin-health strong { font: 500 15px Georgia, serif; }
.admin-health small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.admin-health-status { padding: 5px 8px; border-radius: 20px; color: #2b6e47; background: #dcecdf; font-size: 8px; font-weight: 900; letter-spacing: .08em; }
.admin-health.mode-maintenance { border-color: #dfc98e; background: #fbf3dc; }
.admin-health.mode-maintenance .admin-health-dot { background: #c49433; box-shadow: 0 0 0 7px rgba(196,148,51,.12); }
.admin-health.mode-maintenance .admin-health-status { color: #76591f; background: #f0dfad; }
.admin-health.mode-offline { border-color: #e4b9b3; background: #fbeae7; }
.admin-health.mode-offline .admin-health-dot { background: #b9574b; box-shadow: 0 0 0 7px rgba(185,87,75,.12); }
.admin-health.mode-offline .admin-health-status { color: #8c3d34; background: #f1d3ce; }
.admin-runtime-panel { margin-bottom: 15px; padding: 20px 22px; display: grid; grid-template-columns: minmax(240px,.75fr) minmax(420px,1.25fr); gap: 28px; align-items: center; }
.admin-runtime-copy h2 { margin: 4px 0 7px; font: 500 22px Georgia, serif; }
.admin-runtime-copy > p:last-child { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.admin-runtime-state { display: flex; align-items: flex-start; gap: 11px; }
.runtime-state-icon { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 10px; display: grid; place-items: center; color: #2b6e47; background: #dcecdf; font-size: 10px; }
.runtime-state-icon.mode-maintenance { color: #76591f; background: #f0dfad; }
.runtime-state-icon.mode-offline { color: #8c3d34; background: #f1d3ce; }
.admin-runtime-state strong, .admin-runtime-state small { display: block; }
.admin-runtime-state strong { font-size: 11px; }
.admin-runtime-state small { margin-top: 4px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.runtime-access-readiness { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; display: flex; align-items: center; gap: 10px; }
.runtime-access-readiness > span { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 9px; display: grid; place-items: center; font-size: 11px; font-weight: 900; }
.runtime-access-readiness strong, .runtime-access-readiness small { display: block; }
.runtime-access-readiness strong { font-size: 9px; }
.runtime-access-readiness small { margin-top: 3px; color: var(--muted); font-size: 8px; line-height: 1.45; overflow-wrap: anywhere; }
.runtime-access-readiness.is-ready { border-color: #cfe2d3; background: #edf6ef; }
.runtime-access-readiness.is-ready > span { color: #2b6e47; background: #dcecdf; }
.runtime-access-readiness.is-blocked { border-color: #e4b9b3; background: #fbeae7; }
.runtime-access-readiness.is-blocked > span { color: #8c3d34; background: #f1d3ce; }
.runtime-message-label { margin-top: 13px; display: block; }
.runtime-message-label > span { color: var(--muted); font-size: 8px; font-weight: 800; }
.runtime-message-label textarea { min-height: 56px; margin-top: 6px; padding: 9px 11px; resize: vertical; font-size: 9px; }
.admin-runtime-actions { margin-top: 10px; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.admin-runtime-actions .button { min-height: 39px; padding: 0 10px; border: 1px solid var(--line); font-size: 8px; }
.runtime-start { color: #2b6e47; background: #edf6ef; }
.runtime-maintenance { color: #76591f; background: #fbf3dc; }
.runtime-stop { color: #8c3d34; background: #fbeae7; }
.admin-runtime-actions .button:not(:disabled):hover { transform: translateY(-1px); border-color: currentColor; }
.season-design-status { margin-bottom: 15px; padding: 17px 19px; border: 1px solid var(--line); border-radius: 16px; background: var(--white); display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.season-design-status > div { display: flex; align-items: center; gap: 12px; }
.season-status-mark { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 13px; color: white; background: var(--forest-2); display: grid; place-items: center; font-size: 17px; }
.season-design-status strong, .season-design-status small { display: block; }
.season-design-status strong { font: 500 16px Georgia, serif; }
.season-design-status small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.season-status-pill { padding: 6px 10px; border-radius: 999px; color: var(--forest-2); background: var(--sage-soft); font-size: 8px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.season-design-form { padding: 24px; }
.season-design-fieldset { margin: 0 0 22px; padding: 0; border: 0; }
.season-design-fieldset legend { margin-bottom: 12px; color: var(--ink); font: 500 18px Georgia, serif; }
.season-design-options { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.season-design-option { min-height: 116px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 13px; cursor: pointer; transition: transform .18s, border-color .18s, box-shadow .18s; }
.season-design-option:hover { transform: translateY(-2px); border-color: var(--sage); }
.season-design-option:has(input:checked) { border-color: var(--clay); box-shadow: 0 0 0 3px color-mix(in srgb, var(--clay) 16%, transparent); }
.season-design-option input { width: 17px; min-height: 17px; height: 17px; margin: 0; accent-color: var(--clay); }
.season-design-option > span:last-child, .season-design-option strong, .season-design-option small { display: block; }
.season-design-option strong { font-size: 11px; }
.season-design-option small { margin-top: 5px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.season-preview-mark { grid-column: 1 / -1; width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; color: white; font: 700 18px Georgia, serif; }
.season-preview-standard .season-preview-mark { background: linear-gradient(145deg, #123534, #2f655f); }
.season-preview-halloween .season-preview-mark { background: linear-gradient(145deg, #21102b, #d96b22); }
.season-preview-christmas .season-preview-mark { background: linear-gradient(145deg, #123d2f, #b64842 72%, #d4ad58); }
.season-mode-options { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.season-mode-options label { min-height: 76px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 12px; cursor: pointer; }
.season-mode-options label:has(input:checked) { border-color: var(--forest-3); background: var(--sage-soft); }
.season-mode-options input { width: 17px; min-height: 17px; height: 17px; margin: 0; accent-color: var(--forest-2); }
.season-mode-options strong, .season-mode-options small { display: block; }
.season-mode-options strong { font-size: 10px; }
.season-mode-options small { margin-top: 4px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.season-schedule-fields { margin-bottom: 22px; padding: 18px; border: 1px solid var(--line-soft); border-radius: 15px; background: var(--cream); display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.season-schedule-fields label > span { display: block; margin-bottom: 7px; }
.season-schedule-fields input { margin: 0; }
.season-schedule-fields > p { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: 8px; line-height: 1.5; }
.season-schedule-fields.disabled { opacity: .48; }
.season-design-actions { display: flex; align-items: center; gap: 14px; }
.season-design-actions .dialog-message { margin: 0; }
.admin-summary-grid { margin-bottom: 15px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.admin-summary-card { min-height: 128px; padding: 18px; border: 1px solid var(--line-soft); border-radius: 16px; background: var(--white); display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.admin-summary-card span, .admin-summary-card strong, .admin-summary-card small { display: block; }
.admin-summary-card div > span { color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.admin-summary-card strong { margin-top: 17px; font: 500 27px Georgia, serif; }
.admin-summary-card small { margin-top: 5px; color: var(--muted-2); font-size: 8px; }
.admin-summary-icon, .admin-panel-icon { display: grid; place-items: center; color: var(--forest-2); background: var(--sage-soft); font-weight: 800; }
.admin-summary-icon { min-width: 34px; height: 34px; padding: 0 7px; border-radius: 10px; font-size: 10px; }
.admin-management-grid { margin-bottom: 15px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.admin-accounts-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.admin-control-panel { min-height: 290px; }
.admin-panel-icon { width: 34px; height: 34px; border-radius: 10px; }
.admin-account-row { padding: 13px; border-radius: 12px; background: var(--sage-soft); display: flex; align-items: center; gap: 11px; }
.admin-account-avatar { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; display: grid; place-items: center; color: white; background: var(--forest-2); font: 700 11px Georgia, serif; }
.admin-account-row strong, .admin-account-row small { display: block; }
.admin-account-row strong { font-size: 11px; }
.admin-account-row small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.admin-control-actions { margin-top: 16px; display: grid; gap: 8px; }
.admin-control-actions .button { width: 100%; min-height: 39px; font-size: 10px; }
.admin-control-note { margin: 13px 0 0; color: var(--muted-2); font-size: 8px; line-height: 1.55; }
.admin-policy-list { display: grid; gap: 10px; }
.admin-policy-list > div { padding: 11px; border: 1px solid var(--line-soft); border-radius: 12px; display: flex; align-items: center; gap: 11px; }
.admin-policy-mark { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 9px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font-size: 9px; font-weight: 900; }
.admin-policy-list strong, .admin-policy-list small { display: block; }
.admin-policy-list strong { font-size: 9px; }
.admin-policy-list small { margin-top: 3px; color: var(--muted); font-size: 8px; line-height: 1.35; }
.admin-role-list { display: grid; gap: 7px; }
.admin-role-list > div { min-height: 43px; padding: 8px 0; border-top: 1px solid var(--line-soft); display: grid; grid-template-columns: 88px 1fr; align-items: center; gap: 10px; }
.admin-role-list > div:first-child { border-top: 0; }
.admin-role-list small { color: var(--muted); font-size: 8px; line-height: 1.35; }
.account-role { width: fit-content; padding: 5px 8px; border-radius: 7px; font-size: 7px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.role-user { color: var(--muted); background: var(--cream); }
.role-moderator { color: #856128; background: var(--gold-soft); }
.role-admin { color: var(--forest-2); background: var(--sage-soft); }
.role-superadmin { color: var(--red); background: var(--red-soft); }
.admin-users-panel { margin-top: 15px; padding: 0; overflow: hidden; }
.admin-users-panel > .panel-heading { margin: 0; padding: 20px 22px; }
.admin-account-list-tools { display: flex; align-items: center; gap: 12px; }
.admin-account-list-tools .filter { min-height: 31px; }
.admin-users-table { min-width: 1320px; }
.admin-users-table td { vertical-align: middle; }
.admin-users-table td > small { margin-top: 5px; color: var(--muted); display: block; font-size: 7px; }
.admin-users-table tr.account-row-archived td { background: color-mix(in srgb, var(--cream) 72%, transparent); }
.admin-users-table tr.account-row-archived .admin-user-identity { opacity: .72; }
.admin-user-identity { display: flex; align-items: center; gap: 10px; }
.admin-user-identity > span { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 10px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font: 700 10px Georgia, serif; }
.admin-user-identity strong, .admin-user-identity small { display: block; }
.admin-user-identity small { margin-top: 3px; }
.account-role-select { width: 138px; min-height: 37px; margin: 0; padding: 0 9px; font-size: 9px; }
.account-active-toggle { color: var(--ink); display: inline-flex; align-items: center; gap: 7px; cursor: pointer; }
.account-active-toggle input { width: 16px; min-height: 16px; height: 16px; margin: 0; accent-color: var(--forest-2); }
.account-active-toggle span { font-size: 9px; }
.account-save-button { min-height: 34px; padding: 0 10px; font-size: 9px; }
.account-row-actions { max-width: 255px; display: flex; flex-wrap: wrap; gap: 6px; }
.account-row-actions .button { min-height: 32px; padding: 0 9px; font-size: 8px; }
.account-archive-status { padding: 5px 8px; border-radius: 999px; display: inline-flex; align-items: center; font-size: 8px; font-weight: 850; }
.account-archive-status.active { color: #2f6d48; background: #e7f3eb; }
.account-archive-status.archived { color: #76591f; background: #f6ead0; }
.account-restore-button { border-color: #a9ccb5; color: #2f6d48; }
.account-subscription-button { color: var(--forest-2); border-color: var(--sage); background: var(--sage-soft); }
.subscription-plan-badge { width: fit-content; padding: 5px 8px; border-radius: 7px; display: block; color: var(--forest-2); background: var(--sage-soft); font-size: 7px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.subscription-plan-badge.plan-professional { color: #76591f; background: var(--gold-soft); }
.subscription-plan-badge.plan-portfolio { color: white; background: var(--forest-2); }
.subscription-plan-badge.plan-none { color: var(--muted); background: var(--cream); }
.subscription-availability strong, .subscription-availability small { display: block; }
.subscription-availability small { margin-top: 4px; color: var(--muted); font-size: 7px; }
.account-subscription-dialog { width: min(680px, calc(100vw - 24px)); }
.subscription-current-card { margin-bottom: 18px; padding: 15px; border: 1px solid var(--line-soft); border-radius: 14px; background: var(--cream); display: grid; gap: 14px; }
.subscription-current-card > div { display: flex; align-items: center; gap: 10px; }
.account-subscription-avatar { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 11px; color: white; background: var(--forest-2); display: grid; place-items: center; font: 700 11px Georgia, serif; }
.subscription-current-card strong, .subscription-current-card small { display: block; }
.subscription-current-card small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.subscription-current-card dl { margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.subscription-current-card dl > div { padding: 9px; border-radius: 9px; background: var(--white); }
.subscription-current-card dt { color: var(--muted); font-size: 7px; font-weight: 800; }
.subscription-current-card dd { margin: 4px 0 0; font-size: 8px; font-weight: 800; }
.subscription-expiry-preview { min-height: 37px; margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; color: var(--forest-2); background: var(--sage-soft); font-size: 9px; font-weight: 800; }
.subscription-dialog-actions > span { flex: 1; }
.current-account-lock { padding: 5px 7px; border-radius: 6px; color: var(--forest-2); background: var(--sage-soft); font-size: 7px; font-weight: 850; text-transform: uppercase; }
.admin-data-list, .admin-service-list { display: grid; }
.admin-data-list > div, .admin-service-list > div { min-height: 43px; padding: 8px 0; border-top: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.admin-data-list > div:first-child, .admin-service-list > div:first-child { border-top: 0; }
.admin-data-list span, .admin-service-list span { color: var(--muted); font-size: 9px; }
.admin-data-list strong, .admin-service-list strong { font-size: 9px; text-align: right; }
.service-dot { width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; display: inline-block; background: var(--muted-2); }
.service-dot.online { background: #4b9a64; box-shadow: 0 0 0 3px rgba(75,154,100,.1); }
.service-dot.maintenance { background: #c49433; box-shadow: 0 0 0 3px rgba(196,148,51,.1); }
.service-dot.offline { background: #b9574b; box-shadow: 0 0 0 3px rgba(185,87,75,.1); }
.admin-portal-link { margin-top: 14px; padding: 11px 12px; border-radius: 10px; color: var(--forest-2); background: var(--sage-soft); display: block; font-size: 9px; font-weight: 800; text-align: center; text-decoration: none; }
.admin-audit-panel { padding: 0; overflow: hidden; }
.admin-audit-panel > .panel-heading { padding: 20px 22px; margin: 0; }
.admin-audit-table { min-width: 900px; }
.admin-audit-table code { padding: 3px 6px; border-radius: 5px; color: var(--muted); background: var(--sage-soft); font: 8px ui-monospace, SFMono-Regular, Consolas, monospace; }
.access-security-toolbar { margin-bottom: 15px; padding: 13px 14px; display: grid; grid-template-columns: auto minmax(250px, 1fr) auto; align-items: center; gap: 12px; }
.access-range-filter { min-width: max-content; padding: 4px; border-radius: 11px; background: var(--cream); display: flex; gap: 4px; }
.access-range-filter .filter { min-height: 38px; }
.access-search { position: relative; }
.access-search input { min-height: 46px; margin: 0; padding-left: 42px; background: var(--paper); }
.access-search-icon { position: absolute; z-index: 1; top: 50%; left: 14px; width: 20px; height: 20px; color: var(--muted); display: grid; place-items: center; font: 600 17px/1 "Segoe UI Symbol", sans-serif; transform: translateY(-50%); pointer-events: none; }
.access-security-toolbar > .button { min-height: 44px; white-space: nowrap; }
.access-summary-grid { margin-bottom: 15px; }
.access-summary-alert { color: var(--red); background: var(--red-soft); }
.access-insight-grid { margin-bottom: 15px; display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(270px, .65fr); align-items: start; gap: 15px; }
.access-log-panel, .access-top-panel { padding: 0; overflow: hidden; }
.access-panel-heading, .access-top-panel > .panel-heading { margin: 0; padding: 20px 22px; }
.access-panel-heading p:last-child { margin: 5px 0 0; color: var(--muted); font-size: 9px; line-height: 1.45; }
.access-visits-table { min-width: 1040px; }
.access-visits-table code { padding: 4px 7px; border-radius: 7px; color: var(--forest-3); background: var(--sage-soft); font: 8px ui-monospace, SFMono-Regular, Consolas, monospace; white-space: nowrap; }
.access-device-cell { min-width: 235px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 10px; }
.access-device-icon { width: 34px; height: 34px; border: 1px solid var(--line-soft); border-radius: 10px; color: var(--forest-3); background: var(--sage-soft); display: grid; place-items: center; font: 900 15px/1 "Segoe UI Symbol", sans-serif; }
.access-device-icon.device-mobile, .access-device-icon.device-tablet { color: #826225; background: var(--gold-soft); }
.access-device-icon.device-bot { color: var(--muted); background: var(--cream); }
.access-device-cell > div { min-width: 0; }
.access-device-cell strong, .access-device-cell small, .access-mac-status { display: block; }
.access-device-cell strong { font-size: 9px; }
.access-device-cell small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.access-mac-status { margin-top: 4px; color: var(--muted-2); font-size: 7px; font-style: normal; }
.access-kind-pill, .access-status-pill { min-height: 25px; padding: 0 8px; border-radius: 999px; display: inline-flex; align-items: center; font-size: 8px; font-weight: 850; white-space: nowrap; }
.access-kind-pill { color: var(--forest-3); background: var(--sage-soft); }
.access-status-pill.success { color: #386b4a; background: color-mix(in srgb, var(--sage-soft) 78%, #dcecdf); }
.access-status-pill.warning { color: #826225; background: var(--gold-soft); }
.access-status-pill.failed { color: var(--red); background: var(--red-soft); }
.access-loading-state { min-height: 136px; padding: 24px; color: var(--muted); display: grid; place-items: center; align-content: center; gap: 8px; text-align: center; }
.access-loading-state.compact { min-height: 170px; }
.access-loading-state > span { width: 32px; height: 32px; border-radius: 10px; color: var(--forest-3); background: var(--sage-soft); display: grid; place-items: center; font-weight: 850; }
.access-loading-state p { margin: 0; font-size: 9px; }
.access-privacy-note { margin: 0 18px 18px; padding: 12px 13px; border: 1px solid var(--line-soft); border-radius: 12px; color: var(--muted); background: var(--cream); display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 10px; }
.access-privacy-note > span { width: 24px; height: 24px; border-radius: 8px; color: var(--forest-3); background: var(--sage-soft); display: grid; place-items: center; font-size: 9px; font-weight: 900; }
.access-privacy-note p { margin: 0; font-size: 8px; line-height: 1.55; }
.access-privacy-note strong { color: var(--ink); }
.access-privacy-note.is-paused { border-color: color-mix(in srgb, var(--gold) 45%, var(--line)); background: var(--gold-soft); }
.access-top-list { padding: 0 20px 18px; display: grid; }
.access-top-ip { min-height: 68px; padding: 11px 0; border-top: 1px solid var(--line-soft); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.access-top-ip:first-child { border-top: 0; }
.access-top-rank { width: 28px; height: 28px; border-radius: 9px; color: var(--forest-3); background: var(--sage-soft); display: grid; place-items: center; font-size: 8px; font-weight: 900; }
.access-top-ip div { min-width: 0; }
.access-top-ip code, .access-top-ip small { display: block; }
.access-top-ip code { overflow: hidden; color: var(--ink); font: 8px ui-monospace, SFMono-Regular, Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.access-top-ip small { margin-top: 5px; color: var(--muted); font-size: 7px; }
.access-top-ip > strong { font-size: 9px; white-space: nowrap; }
.access-top-ip > .trusted-ip-badge { grid-column: 2 / -1; justify-self: start; }
.trusted-ip-panel { padding: 22px; }
.trusted-ip-heading, .trusted-ip-list-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.trusted-ip-heading h2 { margin: 4px 0 7px; font: 500 24px Georgia, serif; }
.trusted-ip-heading p:last-child { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.trusted-current-ip { max-width: 310px; padding: 7px 10px; border: 1px solid var(--line-soft); border-radius: 999px; color: var(--forest-3); background: var(--sage-soft); overflow: hidden; font: 8px ui-monospace, SFMono-Regular, Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.trusted-ip-warning { margin: 18px 0; padding: 14px 15px; border: 1px solid color-mix(in srgb, var(--gold) 45%, var(--line)); border-radius: 14px; color: var(--ink); background: color-mix(in srgb, var(--gold-soft) 62%, var(--white)); display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 12px; }
.trusted-ip-warning > span { width: 34px; height: 34px; border-radius: 10px; color: #76591f; background: var(--gold-soft); display: grid; place-items: center; font-size: 12px; font-weight: 900; }
.trusted-ip-warning strong { display: block; font-size: 10px; }
.trusted-ip-warning p { margin: 5px 0 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.trusted-ip-form { padding: 17px; border: 1px solid var(--line-soft); border-radius: 15px; background: var(--cream); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: 13px; }
.trusted-ip-form label > span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 8px; font-weight: 800; }
.trusted-ip-form input { min-height: 44px; margin: 0; background: var(--white); }
.trusted-ip-form-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 8px; }
.trusted-ip-message { grid-column: 1 / -1; min-height: 0; margin: 0; }
.trusted-ip-list-heading { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--line-soft); align-items: center; }
.trusted-ip-list-heading h3 { margin: 4px 0 0; font: 500 18px Georgia, serif; }
.trusted-ip-list { margin-top: 10px; display: grid; gap: 9px; }
.trusted-ip-entry { min-height: 80px; padding: 13px 14px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--paper); display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 14px; }
.trusted-ip-entry-main { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; }
.trusted-ip-entry-icon { width: 38px; height: 38px; border-radius: 11px; color: #386b4a; background: color-mix(in srgb, var(--sage-soft) 78%, #dcecdf); display: grid; place-items: center; font-size: 12px; font-weight: 900; }
.trusted-ip-entry-main > div { min-width: 0; }
.trusted-ip-entry strong, .trusted-ip-entry code, .trusted-ip-entry small { display: block; }
.trusted-ip-entry strong { font-size: 10px; }
.trusted-ip-entry code { margin-top: 5px; overflow: hidden; color: var(--forest-3); font: 8px ui-monospace, SFMono-Regular, Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.trusted-ip-entry small { margin-top: 5px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.trusted-ip-entry-meta { min-width: 130px; text-align: right; }
.trusted-ip-entry-meta span, .trusted-ip-entry-meta small { display: block; }
.trusted-ip-entry-meta span { color: var(--forest-3); font-size: 9px; font-weight: 850; }
.trusted-ip-entry .button.compact { min-height: 35px; padding: 0 10px; font-size: 8px; }
.trusted-ip-badge { min-height: 25px; padding: 0 8px; border-radius: 999px; color: #386b4a; background: color-mix(in srgb, var(--sage-soft) 78%, #dcecdf); display: inline-flex; align-items: center; font-size: 8px; font-weight: 850; }
.trusted-ip-badge.standard { color: var(--muted); background: var(--cream); }

@media (max-width: 1100px) {
  .access-security-toolbar { grid-template-columns: minmax(0, 1fr) auto; }
  .access-range-filter { grid-column: 1 / -1; width: fit-content; }
  .access-insight-grid { grid-template-columns: 1fr; }
  .access-top-list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
  .trusted-ip-form { grid-template-columns: 1fr 1fr; }
  .trusted-ip-form label:last-of-type { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .access-security-toolbar { padding: 12px; grid-template-columns: 1fr; }
  .access-range-filter { grid-column: auto; width: 100%; overflow-x: auto; }
  .access-range-filter .filter { flex: 1 0 auto; min-width: 94px; }
  .access-security-toolbar > .button { width: 100%; }
  .access-panel-heading, .access-top-panel > .panel-heading { padding: 17px; }
  .access-log-panel, .access-top-panel { padding: 0; }
  .access-privacy-note { margin: 0 12px 12px; }
  .access-visits-table { min-width: 0; }
  .access-visits-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  .access-visits-table tbody { padding: 0 12px 12px; display: grid; gap: 10px; }
  .access-visits-table tr { padding: 13px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--paper); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; }
  .access-visits-table td { padding: 0; border: 0; display: block; }
  .access-visits-table td::before { content: attr(data-label); margin-bottom: 5px; color: var(--muted-2); display: block; font-size: 7px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
  .access-visits-table td:nth-child(2), .access-visits-table td:nth-child(3), .access-visits-table td:nth-child(4) { grid-column: 1 / -1; }
  .access-visits-table td:nth-child(5) { grid-column: 2; grid-row: 1; text-align: right; }
  .access-visits-table code { white-space: normal; overflow-wrap: anywhere; }
  .access-device-cell { min-width: 0; }
  .access-top-list { padding: 0 17px 15px; grid-template-columns: 1fr; }
  .trusted-ip-panel { padding: 17px; }
  .trusted-ip-heading { flex-direction: column; }
  .trusted-current-ip { max-width: 100%; }
  .trusted-ip-form { padding: 14px; grid-template-columns: 1fr; }
  .trusted-ip-form label:last-of-type { grid-column: auto; }
  .trusted-ip-form-actions { grid-column: auto; flex-direction: column; }
  .trusted-ip-form-actions .button { width: 100%; }
  .trusted-ip-message { grid-column: auto; }
  .trusted-ip-entry { grid-template-columns: 1fr auto; }
  .trusted-ip-entry-meta { grid-column: 1; text-align: left; }
  .trusted-ip-entry .button { grid-column: 2; grid-row: 1 / span 2; }
}

@media (max-width: 480px) {
  .access-range-filter .filter { min-width: 82px; padding-inline: 9px; font-size: 9px; }
  .access-privacy-note, .trusted-ip-warning { grid-template-columns: 1fr; }
  .trusted-ip-list-heading { align-items: flex-start; flex-direction: column; }
  .trusted-ip-entry { grid-template-columns: 1fr; }
  .trusted-ip-entry-main { grid-template-columns: 1fr; }
  .trusted-ip-entry .button { grid-column: auto; grid-row: auto; width: 100%; }
}
.admin-changelog-panel { padding: 22px; }
.admin-changelog-list { display: grid; }
.admin-changelog-entry { position: relative; display: grid; grid-template-columns: 62px 1fr; gap: 15px; }
.admin-changelog-entry:not(:last-child)::before { content: ""; position: absolute; top: 35px; bottom: 0; left: 30px; width: 1px; background: var(--line); }
.admin-changelog-marker { position: relative; z-index: 1; }
.admin-changelog-marker span { width: 62px; min-height: 30px; border: 1px solid var(--line); border-radius: 20px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font-size: 8px; font-weight: 900; }
.admin-changelog-content { margin-bottom: 18px; padding: 14px 16px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--white); }
.admin-changelog-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.admin-changelog-heading h3 { margin: 0; font: 500 15px Georgia, serif; }
.admin-changelog-heading time { color: var(--muted-2); font-size: 8px; }
.admin-changelog-content ul { margin: 10px 0 0; padding-left: 17px; color: var(--muted); font-size: 9px; line-height: 1.65; }

.stripe-settings-nav-item .nav-icon { color: #fff; background: #635bff; border-radius: 5px; font-size: 8px; font-weight: 900; }
.stripe-settings-heading { align-items: center; }
.stripe-admin-status { min-height: 78px; margin-bottom: 16px; padding: 17px 19px; border: 1px solid var(--line); border-radius: 15px; background: var(--white); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; }
.stripe-status-icon { width: 42px; height: 42px; border-radius: 12px; color: #fff; background: #8c86ff; display: grid; place-items: center; font-weight: 900; }
.stripe-admin-status.ready { border-color: #b8d9c2; background: #edf7f0; }
.stripe-admin-status.ready .stripe-status-icon { background: #3d8a59; }
.stripe-admin-status strong, .stripe-admin-status small { display: block; }
.stripe-admin-status strong { font-size: 11px; }
.stripe-admin-status small { margin-top: 5px; color: var(--muted); font-size: 8px; line-height: 1.5; }
.stripe-mode-badge { padding: 7px 10px; border-radius: 8px; color: #635bff; background: #efedff; font-size: 8px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.stripe-admin-status.ready .stripe-mode-badge { color: #2f6d48; background: #dcefe2; }
.stripe-admin-layout { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, .72fr); align-items: start; gap: 16px; }
.stripe-settings-form, .stripe-tutorial, .stripe-webhook-card { padding: 22px; }
.stripe-panel-mark, .stripe-help-mark { width: 36px; height: 36px; border-radius: 11px; color: #fff; background: #635bff; display: grid; place-items: center; font-weight: 900; }
.stripe-help-mark { color: #635bff; background: #efedff; }
.stripe-settings-intro, .stripe-tutorial-lead { margin: -2px 0 18px; color: var(--muted); font-size: 9px; line-height: 1.6; }
.stripe-field-section { margin-top: 14px; padding: 16px; border: 1px solid var(--line-soft); border-radius: 14px; background: var(--cream); display: grid; gap: 12px; }
.stripe-field-heading { margin-bottom: 2px; display: flex; align-items: center; gap: 11px; }
.stripe-field-heading > span { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 9px; color: #635bff; background: #efedff; display: grid; place-items: center; font-size: 8px; font-weight: 900; }
.stripe-field-heading h3, .stripe-field-heading p { margin: 0; }
.stripe-field-heading h3 { font-size: 11px; }
.stripe-field-heading p { margin-top: 3px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.stripe-field-section input, .stripe-confirm-section input { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .02em; }
.stripe-confirm-section { margin-top: 14px; padding: 16px; border-left: 3px solid var(--gold); border-radius: 10px; background: var(--gold-soft); }
.stripe-form-actions { margin-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.stripe-form-actions > span { max-width: 320px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.stripe-tutorial-column { display: grid; gap: 16px; }
.stripe-webhook-card { background: linear-gradient(145deg, var(--forest), #1f4b4a); color: #fff; }
.stripe-webhook-card .kicker { color: rgba(255,255,255,.58); }
.stripe-webhook-card h2 { margin: 5px 0 14px; font: 500 19px Georgia, serif; }
.stripe-webhook-card code { margin-bottom: 13px; padding: 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; color: #d9ece4; background: rgba(0,0,0,.16); display: block; overflow-wrap: anywhere; font: 8px/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; }
.stripe-webhook-card .button { border-color: rgba(255,255,255,.18); color: #fff; background: rgba(255,255,255,.08); }
.stripe-tutorial details { border-top: 1px solid var(--line-soft); }
.stripe-tutorial summary { min-height: 51px; list-style: none; display: flex; align-items: center; gap: 10px; font-size: 9px; font-weight: 850; cursor: pointer; }
.stripe-tutorial summary::-webkit-details-marker { display: none; }
.stripe-tutorial summary > span { width: 25px; height: 25px; flex: 0 0 25px; border-radius: 8px; color: #635bff; background: #efedff; display: grid; place-items: center; font-size: 8px; }
.stripe-tutorial summary::after { content: "+"; margin-left: auto; color: var(--muted-2); font-size: 15px; font-weight: 400; }
.stripe-tutorial details[open] summary::after { content: "−"; }
.stripe-tutorial details > div { padding: 0 5px 16px 35px; color: var(--muted); font-size: 8px; line-height: 1.65; }
.stripe-tutorial ol, .stripe-tutorial ul { margin: 0; padding-left: 16px; }
.stripe-tutorial li + li { margin-top: 4px; }
.stripe-tutorial a { color: var(--forest-2); font-weight: 850; }
.stripe-tutorial details p { margin: 8px 0 0; }
.stripe-event-list { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.stripe-safety-note { margin-top: 16px; padding: 13px; border: 1px solid #dfc98e; border-radius: 11px; background: var(--gold-soft); }
.stripe-safety-note strong { color: #76591f; font-size: 8px; letter-spacing: .06em; text-transform: uppercase; }
.stripe-safety-note p { margin: 5px 0 0; color: var(--muted); font-size: 8px; line-height: 1.55; }
.pricing-settings-status { min-height: 72px; margin-bottom: 16px; padding: 16px 18px; border: 1px solid #dfc98e; border-radius: 15px; background: #fbf3dc; display: flex; align-items: center; gap: 13px; }
.pricing-settings-status > span { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 11px; color: #76591f; background: #f0dfad; display: grid; place-items: center; font-weight: 900; }
.pricing-settings-status.ready { border-color: #b8d9c2; background: #edf7f0; }
.pricing-settings-status.ready > span { color: white; background: #3d8a59; }
.pricing-settings-status strong, .pricing-settings-status small { display: block; }
.pricing-settings-status strong { font-size: 11px; }
.pricing-settings-status small { margin-top: 5px; color: var(--muted); font-size: 8px; }
.pricing-settings-layout { display: grid; grid-template-columns: minmax(360px,.78fr) minmax(520px,1.22fr); gap: 16px; align-items: start; }
.pricing-management-form { padding: 23px; }
.plan-settings-form { grid-column: 1 / -1; }
.pricing-management-intro { margin: -2px 0 20px; color: var(--muted); font-size: 9px; line-height: 1.6; }
.base-price-grid { display: grid; gap: 11px; }
.base-price-grid > article { padding: 13px 14px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--cream); display: grid; gap: 10px; }
.base-price-grid > article > strong { font-size: 11px; }
.base-price-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.base-price-grid label { display: grid; gap: 5px; color: var(--muted-2); font-size: 8px; font-weight: 750; }
.base-price-grid input { margin: 0; text-align: right; font-weight: 800; }
.base-price-grid small, .pricing-password-confirm small { color: var(--muted); font-size: 8px; font-weight: 500; }
.pricing-password-confirm { margin-top: 18px; }
.pricing-management-form > .button { width: 100%; margin-top: 4px; }
.plan-settings-editors { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.plan-settings-editor { min-width: 0; padding: 17px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
.plan-settings-editor-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.plan-settings-editor-heading > div { min-width: 0; display: flex; align-items: center; gap: 10px; }
.plan-settings-editor-heading > div > span { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 11px; color: white; background: var(--forest-2); display: grid; place-items: center; font: 700 15px Georgia, serif; }
.plan-settings-editor-heading strong, .plan-settings-editor-heading small { display: block; }
.plan-settings-editor-heading strong { font-size: 10px; }
.plan-settings-editor-heading small { color: var(--muted); font-size: 7px; line-height: 1.4; }
.plan-settings-editor-heading > small { text-align: right; }
.plan-limit-fields { margin-top: 15px; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.plan-limit-fields label { color: var(--muted); font-size: 8px; }
.plan-limit-fields input { min-height: 42px; margin-top: 6px; font-size: 9px; }
.plan-feature-toggle { margin-top: 12px; padding: 12px; border: 1px solid var(--line-soft); border-radius: 12px; background: var(--cream); display: flex; align-items: center; gap: 10px; cursor: pointer; }
.plan-feature-toggle input { width: 18px; min-height: 18px; height: 18px; margin: 0; flex: 0 0 18px; accent-color: var(--forest-2); }
.plan-feature-toggle strong, .plan-feature-toggle small { display: block; }
.plan-feature-toggle strong { font-size: 9px; }
.plan-feature-toggle small { margin-top: 3px; color: var(--muted); font-size: 7px; line-height: 1.4; }
.seasonal-discount-editors { display: grid; gap: 12px; }
.seasonal-design-group { padding: 15px; border: 1px solid var(--line-soft); border-radius: 18px; background: var(--cream); }
.seasonal-design-group.design-standard { border-left: 4px solid var(--forest-2); }
.seasonal-design-group.design-halloween { border-left: 4px solid #df6c20; }
.seasonal-design-group.design-christmas { border-left: 4px solid #b94842; }
.seasonal-design-group-heading { margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.seasonal-design-group-heading > span { width: 36px; height: 36px; border-radius: 11px; color: #fff; background: var(--forest-2); display: grid; place-items: center; font-weight: 850; }
.seasonal-design-group-heading strong, .seasonal-design-group-heading small { display: block; }
.seasonal-design-group-heading strong { font-size: 11px; }
.seasonal-design-group-heading small { margin-top: 3px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.seasonal-interval-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.seasonal-discount-editor { padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); transition: opacity .18s, border-color .18s; }
.seasonal-discount-editor.disabled { opacity: .66; }
.seasonal-discount-heading { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 11px; }
.seasonal-discount-heading > span { width: 38px; height: 38px; border-radius: 12px; color: white; background: var(--forest-2); display: grid; place-items: center; font-size: 16px; }
.seasonal-discount-heading strong, .seasonal-discount-heading small { display: block; }
.seasonal-discount-heading strong { font-size: 10px; }
.seasonal-discount-heading small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.seasonal-discount-toggle { color: var(--ink); display: flex; align-items: center; gap: 7px; cursor: pointer; }
.seasonal-discount-toggle input { width: 17px; min-height: 17px; height: 17px; margin: 0; accent-color: var(--clay); }
.seasonal-discount-toggle span { font-size: 8px; }
.seasonal-discount-fields { margin-top: 15px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.seasonal-discount-fields label { font-size: 8px; }
.seasonal-discount-fields input, .seasonal-discount-fields select { min-height: 42px; margin-top: 6px; font-size: 9px; }
.seasonal-discount-editor > p { margin: 12px 0 0; color: var(--muted); font-size: 8px; line-height: 1.45; }
.subscription-seasonal-offer { margin-top: 16px; padding: 13px 14px; border: 1px solid color-mix(in srgb, var(--clay) 40%, var(--line)); border-radius: 12px; background: color-mix(in srgb, var(--clay-soft) 65%, var(--paper)); }
.subscription-seasonal-offer strong, .subscription-seasonal-offer span { display: block; }
.subscription-seasonal-offer strong { color: var(--clay); font-size: 10px; }
.subscription-seasonal-offer span { margin-top: 4px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.promotion-codes-nav-item .nav-icon { color: #ffe7a4; background: rgba(255,231,164,.12); border-radius: 5px; font-size: 9px; font-weight: 900; }
.promotion-heading { align-items: center; }
.promotion-summary-grid { margin-bottom: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.promotion-summary-card { min-height: 112px; padding: 17px; border: 1px solid var(--line-soft); border-radius: 15px; background: var(--white); display: flex; align-items: flex-start; gap: 13px; }
.promotion-summary-card > span { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 11px; color: #635bff; background: #efedff; display: grid; place-items: center; font: 700 15px Georgia, serif; }
.promotion-summary-card small, .promotion-summary-card strong { display: block; }
.promotion-summary-card small { color: var(--muted-2); font-size: 8px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.promotion-summary-card strong { margin-top: 8px; font: 500 24px Georgia, serif; }
.promotion-summary-card p { margin: 4px 0 0; color: var(--muted); font-size: 8px; }
.promotion-workspace { padding: 0; overflow: hidden; }
.promotion-workspace > .panel-heading { margin: 0; padding: 20px 22px; border-bottom: 1px solid var(--line-soft); }
.promotion-list { padding: 13px; background: color-mix(in srgb, var(--cream) 50%, var(--white)); display: grid; gap: 9px; }
.promotion-card { min-height: 130px; padding: 17px; border: 1px solid var(--line-soft); border-radius: 14px; background: var(--white); display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 18px; }
.promotion-card.inactive { opacity: .65; }
.promotion-code-line { display: flex; align-items: center; gap: 8px; }
.promotion-code-line button { padding: 6px 9px; border: 1px dashed #8c86ff; border-radius: 8px; color: #5148c8; background: #efedff; font: 850 9px ui-monospace, SFMono-Regular, Consolas, monospace; cursor: pointer; }
.promotion-code-line button span { margin-left: 4px; font-family: sans-serif; }
.promotion-status { padding: 5px 7px; border-radius: 7px; font-size: 7px; font-weight: 850; text-transform: uppercase; }
.promotion-status.active { color: #2f6d48; background: #e4f2e8; }
.promotion-status.inactive { color: var(--muted); background: var(--cream); }
.promotion-card h2 { margin: 9px 0 4px; font: 500 17px Georgia, serif; }
.promotion-card-main > p { margin: 0; color: var(--forest-2); font-size: 9px; font-weight: 800; }
.promotion-tags { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 5px; }
.promotion-tags span { padding: 4px 7px; border: 1px solid var(--line-soft); border-radius: 7px; color: var(--muted); font-size: 7px; }
.promotion-card-stats { display: flex; gap: 18px; }
.promotion-card-stats div { min-width: 74px; }
.promotion-card-stats small, .promotion-card-stats strong { display: block; text-align: center; }
.promotion-card-stats small { color: var(--muted-2); font-size: 7px; text-transform: uppercase; }
.promotion-card-stats strong { margin-top: 7px; font: 500 17px Georgia, serif; }
.promotion-status-button { min-width: 100px; }
.promotion-card-actions { min-width: 112px; display: grid; gap: 7px; }
.promotion-card-actions .button { width: 100%; min-height: 36px; padding: 8px 12px; }
.promotion-card-actions .danger-link { border-color: color-mix(in srgb, var(--red) 40%, var(--line)); color: var(--red); }
.promotion-card-actions .danger-link:hover { background: var(--red-soft); }
.delete-warning { padding: 15px 16px; border: 1px solid color-mix(in srgb, var(--red) 28%, var(--line)); border-radius: 13px; background: var(--red-soft); display: grid; gap: 5px; }
.delete-warning strong { color: var(--red); font-size: 13px; }
.delete-warning span { color: var(--muted); font-size: 9px; line-height: 1.5; }
.promotion-empty { min-height: 310px; display: grid; place-items: center; align-content: center; text-align: center; }
.promotion-empty > span { width: 54px; height: 54px; border-radius: 16px; color: #635bff; background: #efedff; display: grid; place-items: center; font: 700 19px Georgia, serif; }
.promotion-empty h2 { margin: 14px 0 5px; }
.promotion-empty p { margin: 0 0 16px; color: var(--muted); font-size: 9px; }
.promotion-code-dialog { width: min(720px, calc(100% - 28px)); max-height: min(92vh, 900px); overflow: auto; }
.promotion-code-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 9px; }
.promotion-code-row .button { min-height: 43px; margin-bottom: 1px; }
.promotion-password-confirm { margin-top: 13px; padding: 14px; border-left: 3px solid var(--gold); border-radius: 10px; background: var(--gold-soft); }
.promotion-referral-fields { margin-top: 10px; padding: 14px; border: 1px solid color-mix(in srgb, #635bff 30%, var(--line)); border-radius: 13px; background: color-mix(in srgb, #efedff 55%, var(--white)); }
.promotion-referral-heading { margin-bottom: 11px; display: flex; align-items: center; gap: 9px; }
.promotion-referral-heading > span { width: 31px; height: 31px; border-radius: 9px; color: #5148c8; background: #e2dfff; display: grid; place-items: center; font-weight: 900; }
.promotion-referral-heading strong, .promotion-referral-heading small { display: block; }
.promotion-referral-heading small { margin-top: 2px; color: var(--muted); font-size: 8px; }
.referrals-nav-item .nav-icon { color: #d8d3ff; background: rgba(216,211,255,.12); border-radius: 5px; font-size: 9px; font-weight: 900; }
#referral-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.referral-info { margin-bottom: 16px; padding: 18px; display: flex; align-items: center; gap: 14px; }
.referral-info > span { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 12px; color: #5148c8; background: #efedff; display: grid; place-items: center; font-weight: 900; }
.referral-info h2 { margin: 0 0 4px; font-size: 14px; }
.referral-info p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.referral-code-list { display: grid; gap: 12px; }
.referral-code-card { padding: 20px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, auto); align-items: center; gap: 20px; }
.referral-code-card.inactive { opacity: .68; }
.referral-code-main h2 { margin: 10px 0 5px; font: 500 18px Georgia, serif; }
.referral-code-main > p { margin: 0; color: var(--muted); font-size: 9px; }
.referral-code-metrics { display: grid; grid-template-columns: repeat(2, minmax(120px, 1fr)); gap: 8px; }
.referral-code-metrics > div { padding: 12px; border: 1px solid var(--line-soft); border-radius: 11px; background: var(--cream); }
.referral-code-metrics small, .referral-code-metrics strong { display: block; }
.referral-code-metrics small { color: var(--muted-2); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.referral-code-metrics strong { margin-top: 5px; font-size: 10px; }
.checkout-promo-box { padding: 13px; border: 1px dashed #8c86ff; border-radius: 12px; background: #f7f6ff; }
.checkout-promo-box label > span { color: var(--muted-2); font-size: 7px; font-weight: 650; }
.checkout-promo-input { margin-top: 7px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.checkout-promo-input input { margin: 0; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; text-transform: uppercase; }
.checkout-promo-input .button { min-height: 42px; }
.promo-validation-status, #checkout-promo-status { min-height: 16px; margin: 7px 0 0; color: var(--muted); font-size: 8px; font-weight: 750; }
.promo-validation-status.valid, #checkout-promo-status.valid { color: #2f6d48; }
.promo-validation-status.error, #checkout-promo-status.error { color: var(--red); }

.todo-heading { align-items: center; }
.todo-summary-grid { margin-bottom: 15px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.todo-summary-card { min-height: 118px; padding: 18px; border: 1px solid var(--line-soft); border-radius: 16px; background: var(--white); display: flex; align-items: flex-start; gap: 13px; }
.todo-summary-icon { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 11px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font: 700 16px Georgia, serif; }
.todo-summary-card:nth-child(3) .todo-summary-icon { color: var(--red); background: var(--red-soft); }
.todo-summary-card small, .todo-summary-card strong { display: block; }
.todo-summary-card small { color: var(--muted-2); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.todo-summary-card strong { margin-top: 10px; font: 500 25px Georgia, serif; }
.todo-summary-card p { margin: 5px 0 0; color: var(--muted); font-size: 8px; }
.todo-workspace { padding: 0; overflow: hidden; }
.todo-toolbar { min-height: 76px; padding: 14px 18px; border-bottom: 1px solid var(--line-soft); display: grid; grid-template-columns: minmax(220px, 1fr) auto auto; align-items: center; gap: 13px; }
.todo-search { position: relative; max-width: 420px; }
.todo-search > span { position: absolute; left: 13px; top: 50%; z-index: 1; color: var(--muted-2); transform: translateY(-50%); }
.todo-search input { min-height: 42px; margin: 0; padding-left: 36px; background: var(--paper); }
.todo-filters { padding: 4px; border-radius: 10px; background: var(--cream); display: flex; gap: 2px; }
.todo-filter { min-height: 34px; padding: 0 10px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; font-size: 8px; font-weight: 800; cursor: pointer; }
.todo-filter.active { color: var(--forest-2); background: var(--white); box-shadow: 0 2px 8px rgba(18,42,42,.06); }
.todo-list { padding: 13px; background: color-mix(in srgb, var(--cream) 50%, var(--white)); display: grid; gap: 9px; }
.todo-card { position: relative; min-height: 125px; padding: 17px; border: 1px solid var(--line-soft); border-radius: 15px; background: var(--white); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 14px; }
.todo-card.status-done { opacity: .68; }
.todo-card.status-done h2 { text-decoration: line-through; }
.todo-card.overdue { border-left: 3px solid var(--red); }
.todo-check { width: 27px; height: 27px; padding: 0; border: 2px solid var(--line); border-radius: 50%; color: white; background: transparent; display: grid; place-items: center; cursor: pointer; }
.todo-check span { font-size: 10px; font-weight: 900; }
.todo-card.status-done .todo-check { border-color: var(--forest-2); background: var(--forest-2); }
.todo-card-body { min-width: 0; }
.todo-card-meta { display: flex; flex-wrap: wrap; gap: 5px; }
.todo-category, .todo-priority, .todo-status { padding: 4px 7px; border-radius: 6px; font-size: 7px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.todo-owner { padding: 4px 7px; border-radius: 6px; color: var(--forest-2); background: var(--sage-soft); font-size: 7px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.todo-category { color: var(--forest-2); background: var(--sage-soft); }
.todo-category.category-design { color: #856128; background: var(--gold-soft); }
.todo-category.category-security { color: var(--red); background: var(--red-soft); }
.todo-priority { color: var(--muted); background: var(--cream); }
.todo-priority.priority-high, .todo-priority.priority-urgent { color: var(--red); background: var(--red-soft); }
.todo-status { color: var(--muted); border: 1px solid var(--line); background: transparent; }
.todo-status.status-in_progress { color: #856128; border-color: color-mix(in srgb, var(--gold) 45%, var(--line)); }
.todo-status.status-done { color: var(--forest-2); border-color: color-mix(in srgb, var(--sage) 55%, var(--line)); }
.todo-card h2 { margin: 10px 0 0; font: 500 17px/1.25 Georgia, serif; }
.todo-card-body > p { max-width: 900px; margin: 7px 0 0; color: var(--muted); font-size: 9px; line-height: 1.55; white-space: pre-line; }
.todo-card-footer { margin-top: 13px; display: flex; flex-wrap: wrap; gap: 7px 16px; color: var(--muted-2); font-size: 7px; }
.todo-due { color: var(--muted); font-weight: 750; }
.todo-due.overdue { color: var(--red); }
.todo-card-actions { display: flex; gap: 5px; }
.todo-card-actions button { width: 33px; height: 33px; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); background: transparent; cursor: pointer; }
.todo-card-actions button:hover { color: var(--forest-2); border-color: var(--sage); background: var(--sage-soft); }
.todo-card-actions button.danger:hover { color: var(--red); border-color: var(--red); background: var(--red-soft); }
.todo-locked { width: 33px; height: 33px; border: 1px solid var(--line-soft); border-radius: 9px; color: var(--muted-2); display: grid; place-items: center; }
.todo-empty { min-height: 330px; display: grid; place-items: center; align-content: center; text-align: center; }
.todo-empty > span { width: 54px; height: 54px; border-radius: 16px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font-size: 20px; }
.todo-empty h2 { margin: 15px 0 6px; }
.todo-empty p { margin: 0 0 16px; color: var(--muted); font-size: 10px; }
.todo-dialog { width: min(680px, calc(100% - 28px)); max-height: min(92vh, 900px); overflow: auto; }

.field-hint { margin-top: 5px; color: var(--muted-2); display: block; font-size: 8px; font-weight: 500; }
.account-role-hint { margin-top: 3px; padding: 12px 13px; border-left: 3px solid var(--gold); border-radius: 8px; background: var(--gold-soft); }
.account-role-hint strong { color: var(--ink); font-size: 9px; }
.account-role-hint p { margin: 4px 0 0; color: var(--muted); font-size: 8px; line-height: 1.45; }
.permissions-nav-item { color: rgba(255,255,255,.82); }
.permission-summary { margin-bottom: 18px; }
.permission-layout { display: grid; grid-template-columns: minmax(230px, .34fr) minmax(0, 1fr); align-items: start; gap: 16px; }
.permission-role-panel, .permission-editor-panel, .permission-accounts-panel { padding: 22px; }
.permission-role-list { display: grid; gap: 8px; }
.permission-role-card { width: 100%; min-height: 74px; padding: 13px; border: 1px solid var(--line-soft); border-radius: 13px; color: var(--ink); background: var(--cream); display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 5px 10px; text-align: left; cursor: pointer; }
.permission-role-card:hover, .permission-role-card.active { border-color: var(--sage); background: var(--sage-soft); }
.permission-role-card .account-role { grid-row: 1 / span 2; }
.permission-role-card > strong { justify-self: end; font-size: 10px; }
.permission-role-card > small { grid-column: 2; justify-self: end; color: var(--muted); font-size: 8px; }
.permission-editor-heading, .permission-account-editor-heading { margin-bottom: 18px; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.permission-editor-heading h2, .permission-account-editor-heading h3 { margin: 3px 0 5px; font: 500 27px/1.1 Georgia, serif; }
.permission-editor-heading p:last-child, .permission-account-editor-heading p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.permission-role-meta { margin-bottom: 18px; display: grid; grid-template-columns: .6fr 1fr; gap: 10px; }
.permission-matrix { max-height: 620px; padding-right: 5px; overflow: auto; display: grid; gap: 14px; scrollbar-width: thin; }
.permission-matrix.compact { max-height: 330px; margin-top: 18px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--cream); }
.permission-group { border: 1px solid var(--line-soft); border-radius: 14px; overflow: hidden; }
.permission-group-heading { min-height: 39px; padding: 9px 12px; background: var(--cream); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.permission-group-heading strong { font-size: 10px; }
.permission-group-heading span { color: var(--muted); font-size: 8px; }
.permission-group-items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.permission-item { min-height: 68px; padding: 12px; border-top: 1px solid var(--line-soft); display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: start; gap: 10px; cursor: pointer; }
.permission-item:nth-child(even) { border-left: 1px solid var(--line-soft); }
.permission-item input { width: 17px; height: 17px; min-height: 17px; margin: 1px 0 0; accent-color: var(--forest-2); }
.permission-item strong, .permission-item small { display: block; }
.permission-item strong { font-size: 9px; }
.permission-item small { margin-top: 4px; color: var(--muted); font-size: 7px; font-weight: 500; line-height: 1.45; }
.permission-editor-actions { margin-top: 18px; padding-top: 15px; border-top: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.permission-editor-actions > span { margin-right: auto; color: var(--muted); font-size: 8px; line-height: 1.4; }
.permission-accounts-panel { margin-top: 16px; }
.permission-accounts-panel > .panel-heading p { max-width: 670px; margin: 5px 0 0; color: var(--muted); font-size: 9px; }
.permission-account-list { padding-bottom: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.permission-account-card { min-height: 68px; padding: 11px; border: 1px solid var(--line-soft); border-radius: 13px; color: var(--ink); background: var(--cream); display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 10px; text-align: left; cursor: pointer; }
.permission-account-card:hover, .permission-account-card.active { border-color: var(--sage); background: var(--sage-soft); }
.permission-account-card:disabled { opacity: .62; cursor: not-allowed; }
.permission-account-avatar { width: 38px; height: 38px; border-radius: 11px; color: var(--forest-2); background: var(--white); display: grid; place-items: center; font: 700 10px Georgia, serif; }
.permission-account-card strong, .permission-account-card small { display: block; }
.permission-account-card strong { font-size: 9px; }
.permission-account-card small { margin-top: 4px; color: var(--muted); font-size: 7px; }
.permission-account-card b { color: var(--muted); font-size: 7px; }
.permission-account-editor { padding-top: 18px; border-top: 1px solid var(--line-soft); }
.permission-account-editor-heading label { width: min(260px, 100%); }
.permission-override-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px; }
.permission-override-grid > section { border: 1px solid var(--line-soft); border-radius: 13px; overflow: hidden; }
.permission-override-grid h4 { margin: 0; padding: 10px 12px; background: var(--cream); font-size: 10px; }
.permission-override-row { min-height: 61px; padding: 9px 11px; border-top: 1px solid var(--line-soft); display: grid; grid-template-columns: minmax(0, 1fr) 160px; align-items: center; gap: 12px; }
.permission-override-row strong, .permission-override-row small { display: block; }
.permission-override-row strong { font-size: 8px; }
.permission-override-row small { margin-top: 3px; color: var(--muted); font-size: 7px; }
.permission-override-row select { min-height: 35px; margin: 0; padding: 0 8px; font-size: 8px; }
.permission-role-dialog { width: min(820px, calc(100% - 28px)); }
.no-access-panel { min-height: 62vh; padding: 40px; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; box-shadow: var(--shadow); }
.no-access-panel > span { width: 62px; height: 62px; margin-bottom: 22px; border-radius: 18px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font-size: 27px; }
.no-access-panel h1 { max-width: 720px; margin: 0; font: 500 clamp(32px, 5vw, 52px)/1.08 Georgia, serif; }
.no-access-panel > p:not(.eyebrow) { max-width: 560px; margin: 18px 0 26px; color: var(--muted); line-height: 1.7; }
.account-created-dialog { width: min(540px, calc(100% - 28px)); }
.account-success-icon { width: 55px; height: 55px; margin: 0 auto; border-radius: 17px; color: #377552; background: var(--sage-soft); display: grid; place-items: center; font-size: 23px; font-weight: 900; }
.account-created-heading { margin: 17px 0 20px; text-align: center; }
.account-created-heading .eyebrow { margin-bottom: 7px; }
.account-created-heading h2 { margin: 0; font: 500 29px Georgia, serif; }
.account-created-heading > p:last-child { max-width: 410px; margin: 9px auto 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.credential-box { margin-top: 9px; padding: 13px 15px; border: 1px solid var(--line); border-radius: 12px; background: var(--cream); }
.credential-box > span, .credential-box > strong, .credential-box > code { display: block; }
.credential-box > span { color: var(--muted-2); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.credential-box > strong, .credential-box > code { margin-top: 7px; color: var(--ink); font-size: 14px; }
.credential-box.password code { padding: 11px; border-radius: 8px; background: var(--white); font: 700 16px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .06em; overflow-wrap: anywhere; }
.credential-box.password .button { width: 100%; min-height: 38px; margin-top: 10px; font-size: 9px; }
.copy-account-status { min-height: 18px; margin: 8px 0 0; color: #377552; font-size: 9px; text-align: center; }
.admin-password-reset-dialog { width: min(620px, calc(100% - 28px)); }
.admin-password-reset-account { margin: 16px 0; padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--cream); display: flex; align-items: center; gap: 12px; }
.admin-password-reset-account > span { width: 42px; height: 42px; border-radius: 12px; color: var(--forest-2); background: var(--white); display: grid; place-items: center; font: 700 14px Georgia, serif; }
.admin-password-reset-account strong, .admin-password-reset-account small { display: block; }
.admin-password-reset-account strong { font-size: 10px; }
.admin-password-reset-account small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.admin-password-reset-warning { margin-bottom: 16px; padding: 14px 15px; border-left: 3px solid #c68c35; border-radius: 11px; color: #76591f; background: #fbf3dc; }
.admin-password-reset-warning strong { font-size: 9px; }
.admin-password-reset-warning p { margin: 5px 0 0; font-size: 8px; line-height: 1.55; }
.admin-password-reset-actions { margin-top: 18px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; }

dialog { width: min(560px, calc(100% - 28px)); padding: 0; border: 0; border-radius: 22px; background: var(--paper); box-shadow: 0 35px 100px rgba(13,30,29,.28); }
dialog::backdrop { background: rgba(9,29,29,.58); backdrop-filter: blur(4px); }
.wide-dialog { width: min(1060px, calc(100% - 28px)); max-height: min(90vh, 920px); overflow: auto; }
.property-detail-shell { min-height: 500px; }
.property-detail-hero { min-height: 245px; padding: 28px; position: relative; overflow: hidden; color: white; background: radial-gradient(circle at 85% 10%, rgba(226,138,104,.52), transparent 31%), linear-gradient(145deg, #194a47, #0e2b2b); display: flex; flex-direction: column; justify-content: space-between; }
.property-detail-hero.has-image { min-height: 320px; }
.property-detail-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.property-detail-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5,18,18,.25), rgba(6,20,19,.78)); }
.property-detail-hero > *:not(img) { position: relative; z-index: 1; }
.property-detail-toolbar { display: flex; justify-content: flex-end; gap: 8px; }
.hero-button { min-height: 38px; padding: 0 12px; border: 1px solid rgba(255,255,255,.3); border-radius: 10px; color: white; background: rgba(9,29,28,.55); display: inline-flex; align-items: center; gap: 7px; font-size: 10px; font-weight: 750; cursor: pointer; backdrop-filter: blur(10px); }
.hero-button.hero-danger { border-color: rgba(255,170,153,.35); color: #ffd4ca; }
.hero-button.hero-danger:hover { background: rgba(137,42,30,.55); }
.hero-close { width: 38px; padding: 0; justify-content: center; font-size: 20px; }
.property-detail-title h2 { margin: 0 0 8px; font: 500 clamp(30px, 5vw, 48px)/1 Georgia, serif; }
.property-detail-title p { margin: 0; color: rgba(255,255,255,.72); font-size: 12px; }
.property-detail-body { padding: 27px; }
.property-kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; }
.property-kpi { padding: 15px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--white); }
.property-kpi-alert strong { color: var(--clay); }
.property-kpi strong, .property-kpi small { display: block; }
.property-kpi strong { font: 500 18px Georgia, serif; }
.property-kpi small { margin-top: 5px; color: var(--muted); font-size: 8px; letter-spacing: .07em; text-transform: uppercase; }
.detail-section { margin-top: 29px; }
.detail-section-heading { margin-bottom: 14px; display: flex; align-items: end; justify-content: space-between; gap: 15px; }
.detail-section-heading h3 { margin: 0; font: 500 22px Georgia, serif; }
.detail-section-heading p { margin: 5px 0 0; color: var(--muted); font-size: 10px; }
.unit-detail-list { display: grid; gap: 9px; }
.unit-detail-row { padding: 16px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--white); display: grid; grid-template-columns: minmax(150px, 1.15fr) repeat(5, minmax(70px, .65fr)) auto; align-items: center; gap: 11px; }
.unit-name strong, .unit-name small, .unit-metric strong, .unit-metric small { display: block; }
.unit-name strong { font-size: 12px; }
.unit-name small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.unit-metric strong { font: 500 14px Georgia, serif; }
.unit-metric small { margin-top: 3px; color: var(--muted-2); font-size: 8px; }
.protocol-list, .tenant-history-list { display: grid; gap: 10px; }
.protocol-entry { padding: 17px; border: 1px solid var(--line-soft); border-radius: 14px; background: var(--white); display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 14px; }
.protocol-marker { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; color: var(--forest-2); background: var(--sage-soft); font: 700 17px Georgia, serif; }
.protocol-damage .protocol-marker { color: var(--red); background: var(--red-soft); }
.protocol-maintenance .protocol-marker { color: #856128; background: var(--gold-soft); }
.protocol-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.protocol-type { color: var(--muted-2); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .11em; }
.protocol-main h4 { margin: 4px 0 0; font: 500 16px/1.3 Georgia, serif; }
.protocol-main > p { margin: 9px 0 0; color: var(--muted); font-size: 10px; line-height: 1.6; white-space: pre-line; }
.protocol-badges, .protocol-meta, .protocol-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.protocol-meta { margin-top: 11px; color: var(--muted-2); font-size: 8px; }
.protocol-meta span + span::before { content: "·"; margin-right: 7px; }
.protocol-actions { margin-top: 13px; }
.severity-pill { padding: 5px 8px; border-radius: 20px; color: var(--muted); background: var(--sage-soft); font-size: 8px; font-weight: 800; }
.severity-high { color: var(--red); background: var(--red-soft); }
.severity-medium { color: #856128; background: var(--gold-soft); }
.button.compact { min-height: 31px; padding: 0 10px; font-size: 9px; border-radius: 8px; }
.tenant-history-row { padding: 14px 16px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--white); display: grid; grid-template-columns: minmax(180px, 1.35fr) minmax(150px, 1fr) minmax(100px, .7fr) auto auto; align-items: center; gap: 14px; }
.tenant-history-person { display: flex; align-items: center; gap: 10px; min-width: 0; }
.tenant-history-avatar { flex: 0 0 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; color: var(--forest-2); background: var(--sage-soft); font: 700 10px Georgia, serif; }
.tenant-history-row strong, .tenant-history-row small { display: block; }
.tenant-history-row strong { font-size: 10px; }
.tenant-history-row small { margin-bottom: 3px; color: var(--muted-2); font-size: 8px; }
.tenant-file-button { white-space: nowrap; }
.tenant-file-dialog { width: min(1100px, calc(100% - 28px)); }
.tenant-file-hero { min-height: 185px; padding: 30px; color: white; background: radial-gradient(circle at 88% 0, rgba(226,138,104,.42), transparent 34%), linear-gradient(140deg, #173f3d, #0d2928); display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.tenant-file-hero h2 { margin: 0 0 8px; font: 500 clamp(30px, 5vw, 46px)/1 Georgia, serif; }
.tenant-file-hero p { margin: 0; color: rgba(255,255,255,.7); font-size: 11px; }
.tenant-file-hero .eyebrow { margin-bottom: 12px; color: #efb69a; }
.tenant-file-hero-actions { align-self: flex-start; display: flex; gap: 8px; }
.tenant-file-body { padding: 27px; }
.tenant-file-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.tenant-file-kpis > div { padding: 15px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--white); }
.tenant-file-kpis strong, .tenant-file-kpis small { display: block; }
.tenant-file-kpis strong { font: 500 18px Georgia, serif; }
.tenant-file-kpis small { margin-top: 5px; color: var(--muted); font-size: 8px; letter-spacing: .07em; text-transform: uppercase; }
.tenant-file-section { margin-top: 30px; }
.tenant-profile-form { padding: 20px; border: 1px solid var(--line-soft); border-radius: 15px; background: var(--white); }
.tenant-profile-form > label { margin-top: 15px; }
.tenant-profile-form .form-row:first-of-type { margin-top: 0; }
.profile-actions { margin-top: 18px; display: flex; justify-content: flex-end; }
.document-checklist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.document-check { min-height: 60px; padding: 11px 13px; border: 1px solid var(--line-soft); border-radius: 12px; background: var(--white); display: flex; align-items: center; gap: 11px; }
.document-check > span { width: 27px; height: 27px; flex: 0 0 27px; border-radius: 50%; display: grid; place-items: center; color: var(--muted-2); background: var(--sage-soft); font-weight: 800; }
.document-check.complete > span { color: #2b6e47; background: #dcecdf; }
.document-check strong, .document-check small { display: block; }
.document-check strong { font-size: 10px; }
.document-check small { margin-top: 3px; color: var(--muted-2); font-size: 8px; }
.tenant-documents-list { display: grid; gap: 9px; }
.tenant-document-card { padding: 14px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--white); display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 13px; }
.pdf-symbol, .template-icon { display: grid; place-items: center; border-radius: 10px; color: var(--red); background: var(--red-soft); font-size: 8px; font-weight: 900; letter-spacing: .04em; }
.pdf-symbol { width: 44px; height: 52px; }
.tenant-document-main > span { color: var(--clay); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.tenant-document-main strong, .tenant-document-main small { display: block; }
.tenant-document-main strong { margin-top: 3px; font: 500 14px Georgia, serif; }
.tenant-document-main small { margin-top: 5px; color: var(--muted-2); font-size: 8px; }
.tenant-document-main p { margin: 6px 0 0; color: var(--muted); font-size: 9px; }
.tenant-document-actions { display: flex; align-items: center; gap: 7px; }
.document-delete { width: 31px; height: 31px; border: 1px solid var(--line); border-radius: 8px; color: var(--red); background: transparent; cursor: pointer; font-size: 17px; }
.template-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.template-card { min-height: 76px; padding: 13px; border: 1px solid var(--line-soft); border-radius: 13px; color: inherit; background: var(--white); display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 11px; text-decoration: none; transition: transform .18s, border-color .18s; }
.template-card:hover { transform: translateY(-1px); border-color: var(--sage); }
.template-icon { width: 42px; height: 48px; }
.template-card strong, .template-card small { display: block; }
.template-card strong { font-size: 10px; }
.template-card small { margin-top: 4px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.template-card > span:last-child { color: var(--forest-2); font-size: 9px; font-weight: 800; }
.template-disclaimer, .document-security-note { color: var(--muted-2); font-size: 8px; line-height: 1.55; }
.template-disclaimer { margin: 12px 0 0; }
.document-security-note { margin: 13px 0 0; }
.gallery-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.gallery-item { min-height: 150px; margin: 0; position: relative; overflow: hidden; border-radius: 13px; background: var(--sage-soft); }
.gallery-item img { width: 100%; height: 100%; min-height: 150px; display: block; object-fit: cover; }
.gallery-caption { position: absolute; inset: auto 0 0; padding: 28px 11px 10px; color: white; background: linear-gradient(transparent, rgba(7,21,20,.85)); font-size: 9px; }
.gallery-delete { position: absolute; right: 8px; top: 8px; width: 29px; height: 29px; border: 0; border-radius: 50%; color: white; background: rgba(8,23,22,.65); cursor: pointer; backdrop-filter: blur(7px); }
.rent-preview { margin-top: 15px; padding: 12px 14px; border: 1px solid var(--line-soft); border-radius: 11px; color: var(--muted); background: var(--sage-soft); font-size: 10px; line-height: 1.5; }
.recurring-rent-hint { margin-top: 12px; padding: 13px 14px; border: 1px solid color-mix(in srgb, var(--sage) 42%, var(--line)); border-radius: 12px; background: color-mix(in srgb, var(--sage-soft) 58%, var(--white)); display: grid; grid-template-columns: 31px minmax(0, 1fr); align-items: center; gap: 11px; }
.recurring-rent-hint > span, .recurring-rent-status > span { width: 31px; height: 31px; border-radius: 10px; color: var(--forest-2); background: var(--sage-soft); display: grid; place-items: center; font-size: 17px; font-weight: 850; }
.recurring-rent-hint p, .recurring-rent-status p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.recurring-rent-hint strong, .recurring-rent-status strong { margin-bottom: 3px; color: var(--ink); display: block; font-size: 10px; }
.recurring-rent-status { margin-bottom: 12px; padding: 14px; border: 1px solid color-mix(in srgb, var(--sage) 42%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--sage-soft) 48%, var(--white)); display: grid; grid-template-columns: 31px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.recurring-rent-status.ended { border-color: var(--line-soft); background: var(--cream); }
.recurring-rent-status.scheduled { border-color: color-mix(in srgb, #5b8da0 38%, var(--line)); background: color-mix(in srgb, #e5f1f5 56%, var(--white)); }
.recurring-rent-inline, .recurring-payment-note { margin-top: 5px; color: var(--forest-3); font-size: 8px; font-weight: 800; }
.recurring-payment-note { color: var(--clay); }
.upload-dropzone { min-height: 200px; margin-bottom: 18px; position: relative; overflow: hidden; border: 1px dashed var(--sage); border-radius: 15px; background: var(--sage-soft); cursor: pointer; }
.upload-dropzone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.upload-preview { min-height: 200px; padding: 20px; display: grid; place-items: center; align-content: center; gap: 7px; text-align: center; background-position: center; background-size: cover; }
.upload-preview.has-preview { color: white; text-shadow: 0 1px 12px rgba(0,0,0,.6); }
.upload-preview.has-preview::before { content: ""; position: absolute; inset: 0; background: rgba(7,22,21,.3); }
.upload-preview strong, .upload-preview small { position: relative; z-index: 1; }
.upload-preview strong { font: 500 20px Georgia, serif; }
.upload-preview small { color: var(--muted); font-size: 10px; }
.upload-preview.has-preview small { color: rgba(255,255,255,.8); }
.dialog-form { padding: 28px; }
.dialog-heading { margin-bottom: 24px; display: flex; justify-content: space-between; align-items: flex-start; }
.dialog-heading h2 { margin: 0; font: 500 28px Georgia, serif; }
.dialog-context { margin: -8px 0 15px; padding: 11px 13px; border-radius: 10px; color: var(--muted); background: var(--sage-soft); font-size: 10px; }
.delete-dialog { width: min(470px, calc(100% - 28px)); }
.delete-warning-icon { width: 48px; height: 48px; margin: 0 auto 16px; border-radius: 50%; display: grid; place-items: center; color: var(--red); background: var(--red-soft); font: 700 22px Georgia, serif; }
.delete-copy { text-align: center; }
.delete-copy h2 { margin: 0; font: 500 28px Georgia, serif; }
.delete-copy > p:not(.eyebrow) { margin: 11px auto 0; max-width: 350px; color: var(--muted); font-size: 10px; line-height: 1.6; }
.delete-copy > strong { margin-top: 13px; padding: 9px 12px; border-radius: 9px; background: var(--sage-soft); display: inline-block; font-size: 11px; }
.delete-warning-note { margin: 16px 0 0; color: var(--red); font-size: 9px; font-weight: 750; text-align: center; }
.tenant-rental-form > label:first-of-type { margin-top: 0; }
.close-button { width: 34px; height: 34px; border: 0; border-radius: 50%; color: var(--muted); background: #eeece6; cursor: pointer; font-size: 22px; line-height: 1; }

/* Einheitliches Icon-System */
:where(.summary-icon, .account-panel-icon, .account-two-factor-symbol, .account-payment-symbol, .statement-import-symbol,
  .calendar-sync-icon, .calendar-provider-mark, .provider-summary-icon, .admin-tab-icon, .runtime-state-icon,
  .season-status-mark, .season-preview-mark, .admin-summary-icon, .admin-panel-icon, .admin-policy-mark,
  .stripe-status-icon, .stripe-panel-mark, .stripe-help-mark, .todo-summary-icon, .protocol-marker,
  .pdf-symbol, .template-icon, .delete-warning-icon, .account-success-icon, .password-reset-sent > span,
  .seasonal-offer-banner > span, .subscription-notice > span, .two-factor-intro > span,
  .property-media-placeholder span, .add-card > span, .calc-section-heading > span, .calendar-connect-intro > span,
  .provider-empty > span, .stripe-field-heading > span, .stripe-tutorial summary > span,
  .pricing-settings-status > span, .seasonal-discount-heading > span, .promotion-summary-card > span,
  .promotion-empty > span, .promotion-referral-heading > span, .referral-info > span, .todo-check,
  .todo-locked, .todo-empty > span, .no-access-panel > span, .document-check > span) {
  box-sizing: border-box;
  display: inline-grid;
  place-items: center;
  align-content: center;
  justify-content: center;
  overflow: hidden;
  font-family: "Segoe UI Symbol", "Noto Sans Symbols 2", Arial, sans-serif;
  font-style: normal;
  font-variant-emoji: text;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
  vertical-align: middle;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 10%, transparent), 0 5px 14px rgba(16,52,50,.055);
}

:where(.card-icon-action, .provider-delete, .document-delete, .gallery-delete, .todo-card-actions button,
  .close-button, .logout-button, .menu-button, .sidebar-close, .calendar-nav-button, .hero-close) {
  box-sizing: border-box;
  display: inline-grid;
  place-items: center;
  align-content: center;
  justify-content: center;
  padding: 0;
  font-family: "Segoe UI Symbol", "Noto Sans Symbols 2", Arial, sans-serif;
  font-style: normal;
  font-variant-emoji: text;
  line-height: 1;
  text-align: center;
  vertical-align: middle;
  transition: color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

:where(.card-icon-action, .provider-delete, .document-delete, .todo-card-actions button, .close-button,
  .logout-button, .menu-button, .sidebar-close, .calendar-nav-button):hover { transform: translateY(-1px); }
:where(.card-icon-action, .provider-delete, .document-delete, .todo-card-actions button, .close-button,
  .logout-button, .menu-button, .sidebar-close, .calendar-nav-button):focus-visible { outline: 2px solid var(--clay); outline-offset: 2px; }

.provider-search-icon { width: 22px; height: 22px; top: 11px; display: inline-grid; place-items: center; font: 600 17px/1 "Segoe UI Symbol", sans-serif; text-align: center; }
.top-action > span, .add-card > span { display: inline-grid; place-items: center; line-height: 1; }
.dialog-form > label, .form-row { margin-top: 15px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.dialog-actions { margin-top: 20px; display: flex; justify-content: flex-end; gap: 8px; }
.password-hint { margin: 13px 0 0; font-size: 10px; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 100; max-width: 360px; padding: 13px 17px; border-radius: 11px; color: white; background: var(--forest); box-shadow: var(--shadow); font-size: 12px; opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .2s, transform .2s; }
.toast.show { opacity: 1; transform: translateY(0); }

html[data-theme="dark"] .login-panel { background: radial-gradient(circle at 85% 10%, rgba(55,114,109,.16), transparent 34%), linear-gradient(130deg, #101817, #141e1c); }
html[data-theme="dark"] .login-card { border-color: rgba(255,255,255,.07); background: rgba(22,33,31,.88); }
html[data-theme="dark"] .pricing-card { box-shadow: 0 20px 54px rgba(0,0,0,.22); }
html[data-theme="dark"] .subscription-notice { border-color: #725f32; color: #e7d08c; background: #302917; }
html[data-theme="dark"] .legal-admin-notice { border-color: #725f32; color: #e7d08c; background: #302917; }
html[data-theme="dark"] .checkout-return-status { border-color: #2e503c; color: #a7d2b5; background: #1c3026; }
html[data-theme="dark"] .checkout-return-status.pending { border-color: #725f32; color: #e7d08c; background: #302917; }
html[data-theme="dark"] .checkout-return-status.error { border-color: #70443e; color: #efb0a8; background: #301d1b; }
html[data-theme="dark"] label { color: var(--ink); }
html[data-theme="dark"] .app-shell { background: #101817; }
html[data-theme="dark"] .topbar { background: rgba(16,24,23,.85); }
html[data-theme="dark"] .button.secondary,
html[data-theme="dark"] .table-action,
html[data-theme="dark"] .menu-button { background: var(--white); }
html[data-theme="dark"] .table-toolbar input,
html[data-theme="dark"] th { background: #131d1b; }
html[data-theme="dark"] .filter-tabs { background: #101817; }
html[data-theme="dark"] .filter.active { background: #25322f; }
html[data-theme="dark"] .add-card:hover { background: rgba(255,255,255,.025); }
html[data-theme="dark"] .ticket-column { background: #111b19; }
html[data-theme="dark"] .ticket-card { background: var(--white); }
html[data-theme="dark"] .close-button { background: #26322f; }
html[data-theme="dark"] .status-ended,
html[data-theme="dark"] .status-closed,
html[data-theme="dark"] .status-resolved { background: #26322f; }
html[data-theme="dark"] .occupancy-pill { color: #b8d8c4; }
html[data-theme="dark"] .status-paid,
html[data-theme="dark"] .status-active { color: #a7d2b5; }
html[data-theme="dark"] .status-scheduled { color: #a9d3e3; background: #1c3540; }
html[data-theme="dark"] .property-avatar { color: #c7e1d2; }
html[data-theme="dark"] .details-button { color: #b9d8cd; }
html[data-theme="dark"] .upload-dropzone { background: #13211e; }
html[data-theme="dark"] .calc-property-picker { background: linear-gradient(145deg, var(--white), #1a2a25); }
html[data-theme="dark"] .cashflow-row.total .cashflow-bar { background: #5c9890; }
html[data-theme="dark"] .admin-health { border-color: #2e503c; background: #1c3026; }
html[data-theme="dark"] .admin-health-status { color: #a7d2b5; background: #254535; }
html[data-theme="dark"] .admin-health.mode-maintenance, html[data-theme="dark"] .portal-access-status.mode-maintenance { border-color: #725f32; color: #e7d08c; background: #302917; }
html[data-theme="dark"] .admin-health.mode-maintenance .admin-health-status { color: #e7d08c; background: #4a3e20; }
html[data-theme="dark"] .admin-health.mode-offline, html[data-theme="dark"] .portal-access-status.mode-offline { border-color: #70443e; color: #efb0a8; background: #301d1b; }
html[data-theme="dark"] .admin-health.mode-offline .admin-health-status { color: #efb0a8; background: #4d2925; }
html[data-theme="dark"] .runtime-access-readiness.is-ready { border-color: #2e503c; background: #1c3026; }
html[data-theme="dark"] .runtime-access-readiness.is-ready > span { color: #a7d2b5; background: #254535; }
html[data-theme="dark"] .runtime-access-readiness.is-blocked { border-color: #70443e; background: #301d1b; }
html[data-theme="dark"] .runtime-access-readiness.is-blocked > span { color: #efb0a8; background: #4d2925; }
html[data-theme="dark"] .trusted-ip-warning { border-color: #725f32; background: #302917; }
html[data-theme="dark"] .trusted-ip-warning > span { color: #e7d08c; background: #4a3e20; }
html[data-theme="dark"] .trusted-ip-badge.trusted,
html[data-theme="dark"] .trusted-ip-entry-icon,
html[data-theme="dark"] .access-status-pill.success { color: #a7d2b5; background: #254535; }
html[data-theme="dark"] .trusted-current-ip,
html[data-theme="dark"] .access-visits-table code { color: #c8d6f0; }
html[data-theme="dark"] .document-check.complete > span { color: #a7d2b5; background: #254535; }
html[data-theme="dark"] .stripe-admin-status.ready { border-color: #2e503c; background: #1c3026; }
html[data-theme="dark"] .stripe-mode-badge, html[data-theme="dark"] .stripe-field-heading > span, html[data-theme="dark"] .stripe-tutorial summary > span, html[data-theme="dark"] .stripe-help-mark { color: #c8c0ff; background: #2b2847; }
html[data-theme="dark"] .stripe-admin-status.ready .stripe-mode-badge { color: #a7d2b5; background: #254535; }
html[data-theme="dark"] .pricing-settings-status { border-color: #725f32; background: #302917; }
html[data-theme="dark"] .pricing-settings-status.ready { border-color: #2e503c; background: #1c3026; }
html[data-theme="dark"] .stripe-webhook-card { background: linear-gradient(145deg, #142b2a, #203d3a); }
html[data-theme="dark"] .stripe-safety-note { border-color: #725f32; background: #302917; }
html[data-theme="dark"] .stripe-safety-note strong { color: #e7d08c; }
html[data-theme="dark"] .promotion-summary-card > span, html[data-theme="dark"] .promotion-code-line button, html[data-theme="dark"] .promotion-empty > span { color: #c8c0ff; background: #2b2847; }
html[data-theme="dark"] .promotion-status.active { color: #a7d2b5; background: #254535; }
html[data-theme="dark"] .checkout-promo-box { border-color: #5d5791; background: #211f34; }
html[data-theme="dark"] .promotion-referral-fields { background: #211f34; }
html[data-theme="dark"] .promotion-referral-heading > span, html[data-theme="dark"] .referral-info > span { color: #c8c0ff; background: #2b2847; }
html[data-theme="dark"] .account-subscription-alert { border-color: #725f32; color: #e7d08c; background: #302917; }
html[data-theme="dark"] .imprint-settings-status, html[data-theme="dark"] .imprint-incomplete { border-color: #725f32; color: #e7d08c; background: #302917; }
html[data-theme="dark"] .imprint-settings-status.complete { border-color: #2e503c; color: #a7d2b5; background: #1c3026; }
html[data-theme="dark"] .account-archive-status.active { color: #a7d2b5; background: #1c3026; }
html[data-theme="dark"] .account-archive-status.archived, html[data-theme="dark"] .admin-password-reset-warning { color: #e7d08c; background: #302917; }
html[data-theme="dark"] .subscription-upgrade-safety { border-color: #2e503c; color: #a7d2b5; background: #1c3026; }

@media (max-width: 1100px) {
  .dashboard-editor { grid-template-columns: 1fr; align-items: stretch; }
  .dashboard-editor > .button { width: 100%; }
  .dashboard-widget-library { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .imprint-settings-layout { grid-template-columns: 1fr; }
  .imprint-admin-preview { position: static; }
  .pricing-settings-layout { grid-template-columns: 1fr; }
  .plan-settings-form { grid-column: auto; }
  .plan-settings-editors { grid-template-columns: 1fr; }
  .account-settings-content { grid-template-columns: 1fr; }
  .account-settings-panel.subscription-panel { grid-row: auto; }
  .permission-layout { grid-template-columns: 1fr; }
  .permission-role-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .permission-account-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-grid { grid-template-columns: 1fr; max-width: 690px; }
  .pricing-card { min-height: 0; }
  .pricing-card.featured { transform: none; }
  .summary-grid { grid-template-columns: repeat(2, 1fr); }
  .cards-grid { grid-template-columns: repeat(2, 1fr); }
  .admin-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .todo-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .todo-toolbar { grid-template-columns: 1fr auto; }
  .todo-search { max-width: none; }
  .todo-filters { grid-column: 1 / -1; grid-row: 2; width: fit-content; }
  .calendar-layout { grid-template-columns: 1fr; }
  .calendar-agenda { position: static; }
  .provider-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .provider-toolbar { grid-template-columns: minmax(240px, 1fr) 170px 160px; }
  .provider-toolbar .count-label { display: none; }
  .admin-section-tabs { grid-template-columns: repeat(2, 1fr); }
  .season-design-options { grid-template-columns: 1fr; }
  .stripe-admin-layout { grid-template-columns: 1fr; }
  .promotion-card { grid-template-columns: minmax(0, 1fr) auto; }
  .referral-code-card { grid-template-columns: 1fr; }
  .promotion-card-stats { grid-column: 1; grid-row: 2; justify-content: flex-start; }
  .admin-runtime-panel { grid-template-columns: 1fr; gap: 18px; }
  .admin-management-grid { grid-template-columns: 1fr 1fr; }
  .dashboard-grid, .lower-grid { grid-template-columns: 1fr; }
  .focus-panel { min-height: 280px; }
  .property-kpi-grid { grid-template-columns: repeat(3, 1fr); }
  .unit-detail-row { grid-template-columns: minmax(150px, 1fr) repeat(3, minmax(80px, .7fr)) auto; }
  .unit-detail-row .unit-metric:nth-of-type(5), .unit-detail-row .unit-metric:nth-of-type(6) { display: none; }
  .tenant-history-row { grid-template-columns: minmax(180px, 1.2fr) 1fr auto auto; }
  .tenant-history-row > div:nth-of-type(3) { display: none; }
  .tenant-file-kpis { grid-template-columns: repeat(2, 1fr); }
  .calculator-layout { grid-template-columns: 1fr; }
  .calculator-results { position: static; grid-template-columns: 1fr 1fr; }
  .profit-result-card, .tax-panel { grid-row: span 2; }
}
@media (max-width: 820px) {
  .dashboard-heading { align-items: flex-start; }
  .dashboard-heading-actions { width: 100%; justify-content: flex-start; }
  .dashboard-custom-grid { grid-template-columns: minmax(0, 1fr); }
  .dashboard-widget, .dashboard-widget-summary, .dashboard-widget-rent, .dashboard-widget-occupancy,
  .dashboard-widget-properties, .dashboard-widget-tickets, .dashboard-widget-payments,
  .dashboard-widget-calendar, .dashboard-widget-quick-actions { grid-column: 1 / -1; }
  .dashboard-widget .summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-account-list-heading, .admin-account-list-tools { align-items: stretch; flex-direction: column; }
  .admin-account-list-tools .filter-tabs { width: fit-content; max-width: 100%; overflow-x: auto; }
  .permission-override-grid { grid-template-columns: 1fr; }
  .login-shell { grid-template-columns: 1fr; }
  .brand-panel { min-height: 44vh; padding: 28px; }
  .brand-copy h1 { font-size: clamp(42px, 11vw, 64px); }
  .brand-copy > p:last-of-type { margin-top: 18px; }
  .proof { display: none; }
  .login-panel { padding: 26px 18px 48px; }
  .login-theme-toggle { position: relative; right: auto; top: auto; width: 44px; min-height: 44px; margin: 0 0 12px; padding: 0; justify-self: end; justify-content: center; }
  .login-theme-toggle::after { display: none; }
  .login-theme-toggle select { position: absolute; inset: 0; width: 100%; min-width: 0; min-height: 100%; padding: 0; opacity: 0; }
  .login-card { margin-top: 0; position: relative; z-index: 2; padding: 30px 24px; }
  .capabilities-section { min-height: auto; }
  .capabilities-heading { grid-template-columns: 1fr; gap: 18px; }
  .capability-card, .capability-card-featured, .capability-card-featured + .capability-card, .capability-card-wide { grid-column: span 6; }
  .capabilities-cta { align-items: flex-start; flex-direction: column; }
  .capabilities-cta > div:last-child { width: 100%; }
  .capabilities-cta .button { flex: 1 1 0; }
  .pricing-heading { grid-template-columns: 1fr; gap: 18px; }
  .pricing-section { padding-top: 64px; }
  .app-shell { grid-template-columns: 1fr; }
  body.mobile-menu-open { overflow: hidden; }
  .sidebar { position: fixed; inset: 0 auto 0 0; width: min(86vw, 300px); height: 100dvh; padding-top: max(22px, env(safe-area-inset-top)); overflow-y: auto; overscroll-behavior: contain; transform: translateX(-105%); transition: transform .24s ease; box-shadow: 18px 0 55px rgba(0,0,0,.28); }
  .app-shell.menu-open .sidebar { transform: translateX(0); }
  .sidebar-header { margin-bottom: 22px; }
  .sidebar-close { width: 44px; height: 44px; flex: 0 0 44px; border: 1px solid rgba(255,255,255,.16); border-radius: 12px; color: #fff; background: rgba(255,255,255,.08); display: grid; place-items: center; font-size: 25px; line-height: 1; cursor: pointer; }
  .sidebar-backdrop { position: fixed; inset: 0; z-index: 19; border: 0; background: rgba(5,18,18,.58); backdrop-filter: blur(3px); display: block; opacity: 0; pointer-events: none; transition: opacity .24s ease; }
  .app-shell.menu-open .sidebar-backdrop { opacity: 1; pointer-events: auto; }
  .menu-button { min-width: 44px; height: 44px; color: var(--ink); background: var(--white); display: block; cursor: pointer; }
  .nav-item, .nav-dropdown-toggle { min-height: 52px; }
  .nav-dropdown-menu .nav-item { min-height: 48px; }
  .topbar { justify-content: flex-start; gap: 14px; }
  .top-action { margin-left: auto; }
  .content { padding-top: 30px; }
  .ticket-board { grid-template-columns: 1fr; }
  .provider-toolbar { grid-template-columns: 1fr 1fr; }
  .payment-table-toolbar { grid-template-columns: 1fr; align-items: stretch; }
  .payment-table-toolbar .filter-tabs { width: fit-content; max-width: 100%; overflow-x: auto; }
  .payment-table-toolbar .count-label { display: none; }
  .provider-search { grid-column: 1 / -1; }
  .provider-grid { grid-template-columns: 1fr; }
  .admin-management-grid { grid-template-columns: 1fr; }
  .stripe-tutorial-column { grid-template-columns: 1fr 1fr; }
  .promotion-summary-grid { grid-template-columns: repeat(3, 1fr); }
  #referral-summary { grid-template-columns: repeat(2, 1fr); }
  .admin-accounts-grid { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .property-detail-body { padding: 20px; }
  .property-kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .unit-detail-row { grid-template-columns: 1fr 1fr auto; }
  .unit-detail-row .unit-metric:nth-of-type(n+3) { display: none; }
  .tenant-history-row { grid-template-columns: 1fr auto; }
  .tenant-history-row > div:nth-of-type(n+2), .tenant-history-row > span:last-child { display: none; }
  .tenant-file-hero { min-height: 210px; padding: 22px; }
  .document-checklist, .template-grid { grid-template-columns: 1fr; }
  .calculator-results { grid-template-columns: 1fr; }
  .profit-result-card, .tax-panel { grid-row: auto; }
}
@media (max-width: 620px) {
  .dashboard-heading-actions { display: grid; grid-template-columns: 1fr; }
  .dashboard-heading-actions .button { width: 100%; }
  .dashboard-editor { padding: 17px; }
  .dashboard-widget-library { grid-template-columns: 1fr; }
  .dashboard-widget-library button { min-height: 66px; }
  .dashboard-widget .summary-grid { grid-template-columns: 1fr; }
  .dashboard-widget.is-editing > .panel { padding-top: 62px; }
  .dashboard-drag-handle { display: none; }
  .dashboard-widget-controls { left: 12px; right: 12px; justify-content: flex-end; }
  .dashboard-quick-actions > div:last-child { grid-template-columns: 1fr; }
  .cancellation-request dl { grid-template-columns: 1fr 1fr; }
  .legal-document-form { padding: 17px; }
  .admin-password-reset-actions { align-items: stretch; flex-direction: column; }
  .admin-password-reset-actions .button { width: 100%; }
  .public-footer { width: 100%; padding: 28px 20px calc(28px + env(safe-area-inset-bottom)); align-items: flex-start; flex-direction: column; gap: 22px; }
  .public-footer > div { width: 100%; min-width: 0; }
  .public-footer nav { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .public-footer nav a { width: 100%; min-width: 0; min-height: 48px; padding: 11px 10px; border: 1px solid var(--line); border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--cream); font-size: 11px; line-height: 1.35; text-align: center; text-decoration: none; white-space: normal; overflow-wrap: anywhere; }
  .public-footer nav a:last-child { grid-column: 1 / -1; }
  .imprint-settings-heading { align-items: stretch; }
  .imprint-settings-heading .button { width: 100%; }
  .imprint-settings-form, .imprint-admin-preview { padding: 17px; }
  .imprint-form-actions { align-items: stretch; flex-direction: column; }
  .imprint-form-actions .button { width: 100%; }
  .account-quota-list { grid-template-columns: 1fr; }
  .account-usage-panel { grid-column: auto; }
  .plan-limit-fields { grid-template-columns: 1fr; }
  .seasonal-offer-banner { align-items: flex-start; margin-top: -10px; }
  .base-price-fields { grid-template-columns: 1fr; }
  .base-price-grid input { text-align: left; }
  .seasonal-discount-heading { grid-template-columns: auto minmax(0,1fr); }
  .seasonal-discount-toggle { grid-column: 1 / -1; }
  .seasonal-discount-fields { grid-template-columns: 1fr; }
  .seasonal-interval-grid { grid-template-columns: 1fr; }
  .account-settings-heading { align-items: flex-start; }
  .account-settings-panel { padding: 17px; }
  .account-password-row, .account-two-factor, .account-upgrade-option { grid-template-columns: 1fr; }
  .account-password-row .button, .account-two-factor .button, .account-upgrade-option .button { width: 100%; }
  .account-two-factor-symbol { width: 34px; height: 34px; }
  .two-factor-qr { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .two-factor-recovery-codes { grid-template-columns: 1fr; }
  .account-subscription-facts { grid-template-columns: 1fr; }
  .account-business-details { grid-template-columns: 1fr; }
  .account-business-details > div:first-child { grid-column: auto; }
  .account-subscription-actions .button { width: 100%; }
  .permission-role-panel, .permission-editor-panel, .permission-accounts-panel { padding: 16px; }
  .stripe-settings-form, .stripe-tutorial, .stripe-webhook-card { padding: 17px; }
  .stripe-tutorial-column { grid-template-columns: 1fr; }
  .stripe-admin-status { grid-template-columns: auto minmax(0, 1fr); }
  .stripe-mode-badge { grid-column: 1 / -1; width: fit-content; }
  .stripe-form-actions { align-items: stretch; flex-direction: column; }
  .stripe-form-actions .button { width: 100%; }
  .promotion-summary-grid { grid-template-columns: 1fr; }
  #referral-summary { grid-template-columns: 1fr; }
  .promotion-card { grid-template-columns: 1fr; align-items: stretch; }
  .promotion-card-stats { grid-column: auto; grid-row: auto; }
  .promotion-card-stats small, .promotion-card-stats strong { text-align: left; }
  .promotion-status-button { width: 100%; }
  .promotion-card-actions { width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .promotion-code-row, .checkout-promo-input { grid-template-columns: 1fr; }
  .referral-code-metrics { grid-template-columns: 1fr; }
  .promotion-code-row .button { width: 100%; }
  .permission-role-list, .permission-account-list { grid-template-columns: 1fr; }
  .permission-group-items { grid-template-columns: 1fr; }
  .permission-item:nth-child(even) { border-left: 0; }
  .permission-role-meta { grid-template-columns: 1fr; }
  .permission-editor-heading, .permission-account-editor-heading { flex-direction: column; }
  .permission-account-editor-heading label { width: 100%; }
  .permission-override-row { grid-template-columns: 1fr; }
  .permission-editor-actions { align-items: stretch; flex-direction: column; }
  .permission-editor-actions > span { margin: 0; }
  .permission-editor-actions .button { width: 100%; }
  .brand-property-backdrop { background-position: 68% center; }
  .brand-property-backdrop::after { background: linear-gradient(90deg, rgba(5,18,25,.96), rgba(7,24,31,.82)), linear-gradient(0deg, rgba(5,16,22,.76), transparent 55%); }
  .capabilities-section { padding: 66px 14px 74px; }
  .capabilities-heading { margin-bottom: 30px; }
  .capabilities-heading h2 { font-size: clamp(36px, 10.5vw, 44px); }
  .capabilities-heading > p { font-size: 13px; }
  .capabilities-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .capability-card, .capability-card-featured, .capability-card-featured + .capability-card, .capability-card-wide { min-height: 250px; grid-column: 1; padding: 22px 20px; border-radius: 19px; }
  .capability-card h3 { margin-top: 30px; font-size: 24px; }
  .capabilities-cta { padding: 20px; }
  .capabilities-cta > div:last-child { align-items: stretch; flex-direction: column; }
  .capabilities-cta .button { width: 100%; flex-basis: auto; }
  .pricing-section { padding: 58px 14px 72px; }
  .pricing-heading { margin-bottom: 32px; }
  .pricing-heading h2 { font-size: 39px; }
  .pricing-card { padding: 24px 20px; border-radius: 20px; }
  .pricing-card h3 { font-size: 27px; }
  .plan-price strong { font-size: 34px; }
  .pricing-trust { align-items: flex-start; flex-direction: column; padding: 0 8px; }
  .billing-cycle-switch { width: min(100%, 330px); margin-top: -10px; }
  .billing-cycle-switch button { min-width: 0; flex: 1; }
  .billing-recovery-choice-grid { grid-template-columns: 1fr; }
  .subscription-selection { grid-template-columns: 1fr; }
  .subscription-selection small { grid-column: 1; grid-row: auto; }
  .admin-runtime-panel { padding: 17px; }
  .admin-runtime-actions { grid-template-columns: 1fr; }
  .season-design-status { align-items: flex-start; flex-direction: column; }
  .season-mode-options, .season-schedule-fields { grid-template-columns: 1fr; }
  .season-schedule-fields > p { grid-column: auto; }
  .season-design-actions { align-items: stretch; flex-direction: column; }
  .season-design-actions .button { width: 100%; }
  .calendar-heading-actions { width: 100%; justify-content: stretch; }
  .calendar-heading-actions .button { flex: 1; }
  .calendar-sync-status { grid-template-columns: auto minmax(0, 1fr); }
  .calendar-sync-status > .button, .calendar-sync-actions { grid-column: 1 / -1; width: 100%; }
  .calendar-sync-actions .button { flex: 1; }
  .calendar-provider-grid { grid-template-columns: 1fr; }
  .calendar-feed-box { grid-template-columns: 1fr; }
  .calendar-feed-box .button { width: 100%; }
  .topbar { min-height: 68px; padding: 10px 13px; }
  .topbar > .topbar-copy { display: none; }
  .topbar-actions { margin-left: auto; }
  .top-action { min-width: 44px; width: 44px; padding: 0; font-size: 0; }
  .top-action span { font-size: 19px; }
  .topbar .theme-picker { width: 44px; min-height: 44px; padding: 0; justify-content: center; }
  .topbar .theme-picker::after { display: none; }
  .topbar .theme-picker select { position: absolute; inset: 0; width: 100%; min-width: 0; min-height: 100%; padding: 0; opacity: 0; }
  .topbar .season-badge { max-width: 42px; height: 42px; padding: 0; display: grid; place-items: center; overflow: hidden; font-size: 0; }
  .topbar .season-badge::first-letter { font-size: 15px; }
  .content { padding: 22px 12px calc(55px + env(safe-area-inset-bottom)); }
  .page-heading { align-items: flex-start; flex-direction: column; }
  .page-heading { margin-bottom: 20px; gap: 15px; }
  .page-heading h1 { font-size: clamp(31px, 10vw, 40px); }
  .page-heading > div > p:last-child { font-size: 12px; line-height: 1.5; }
  .page-heading .button { width: 100%; }
  .button, .filter, .todo-filter, .calendar-nav-button, .calendar-today-button { min-height: 44px; }
  .summary-grid, .cards-grid, .mini-summary { grid-template-columns: 1fr; }
  .admin-summary-grid { grid-template-columns: 1fr; }
  .todo-summary-grid { grid-template-columns: 1fr 1fr; }
  .todo-toolbar { grid-template-columns: 1fr; }
  .todo-filters { grid-column: auto; grid-row: auto; width: 100%; overflow-x: auto; }
  .todo-filter { flex: 0 0 auto; }
  .todo-toolbar .count-label { display: none; }
  .todo-card { grid-template-columns: auto minmax(0, 1fr); }
  .todo-card-actions { grid-column: 2; }
  .provider-summary-grid { grid-template-columns: 1fr; }
  .provider-toolbar { grid-template-columns: 1fr; }
  .provider-search { grid-column: auto; }
  .provider-grid { padding: 12px; }
  .provider-card-top { grid-template-columns: 40px minmax(0, 1fr); }
  .provider-availability { grid-column: 1 / -1; justify-self: start; }
  .provider-contact-grid, .provider-commercial, .provider-check-grid { grid-template-columns: 1fr; }
  .provider-card-actions { flex-wrap: wrap; }
  .admin-section-tabs { grid-template-columns: 1fr; }
  .admin-accounts-heading { align-items: stretch; flex-direction: column; }
  .admin-accounts-heading .button { width: 100%; }
  .admin-health { align-items: flex-start; }
  .admin-health-status { display: none; }
  .subscription-current-card dl { grid-template-columns: 1fr 1fr; }
  .subscription-dialog-actions { display: flex; }
  .subscription-dialog-actions > span { display: none; }
  .summary-card { min-height: 125px; }
  .panel { padding: 18px; }
  .table-panel, .admin-users-panel, .admin-audit-panel { padding: 0; }
  .table-wrap { overscroll-behavior-x: contain; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
  .table-toolbar { padding: 13px; }
  .payment-table-toolbar .filter-tabs { width: 100%; }
  .payment-table-toolbar .filter { flex: 0 0 auto; min-width: 76px; }
  .calendar-layout { gap: 12px; }
  .calendar-panel { overflow: hidden; }
  .calendar-toolbar, .calendar-weekdays, .calendar-grid { min-width: 0; }
  .calendar-toolbar { min-height: 104px; padding: 11px; grid-template-columns: 1fr auto; gap: 8px; }
  .calendar-toolbar h2 { grid-column: 1 / -1; grid-row: 1; font-size: 18px; }
  .calendar-toolbar > div { grid-column: 1; grid-row: 2; }
  .calendar-toolbar > .count-label { grid-column: 2; grid-row: 2; }
  .calendar-weekdays span { padding: 8px 1px; font-size: 6px; }
  .calendar-day { min-height: 82px; padding: 3px; }
  .calendar-day-number { width: 22px; height: 22px; font-size: 8px; }
  .calendar-day-events { margin-top: 2px; gap: 2px; }
  .calendar-event { min-height: 22px; padding: 3px 2px; border-left-width: 2px; border-radius: 4px; font-size: 6px; }
  .calendar-event > span { display: none; }
  .calendar-day-events > small { font-size: 6px; }
  .calendar-agenda-item { min-height: 68px; grid-template-columns: 40px minmax(0, 1fr) 16px; }
  .chart-panel { overflow: hidden; }
  .rent-chart { gap: 7px; }
  .interactive-rent-panel { min-height: 0; }
  .rent-chart-toolbar { align-items: stretch; }
  .rent-chart-legend { width: 100%; }
  .rent-range-switch { width: 100%; }
  .rent-range-switch button { min-height: 38px; flex: 1; }
  .rent-insight-summary { grid-template-columns: 1fr; }
  .rent-insight-chart { height: 210px; margin-inline: -5px; }
  .rent-line-tooltip { display: none; }
  .rent-line-month { font-size: 7px; }
  .rent-line-empty { max-width: calc(100% - 28px); white-space: normal; }
  .rent-selected-detail { grid-template-columns: 1fr; }
  .rent-selected-detail dl { width: 100%; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .rent-selected-detail dd { text-align: left; }
  .recurring-rent-status { grid-template-columns: 31px minmax(0, 1fr); align-items: start; }
  .recurring-rent-status .button { grid-column: 1 / -1; width: 100%; }
  .form-row { grid-template-columns: 1fr; }
  dialog { width: 100% !important; max-width: none; max-height: 92dvh; margin: auto 0 0; border-radius: 22px 22px 0 0; overflow: auto; overscroll-behavior: contain; }
  dialog::backdrop { background: rgba(5,18,18,.68); }
  .dialog-form { padding: 22px 17px calc(18px + env(safe-area-inset-bottom)); }
  .dialog-heading { align-items: center; }
  .close-button { width: 44px; height: 44px; flex: 0 0 44px; }
  .dialog-actions { position: sticky; bottom: calc(-18px - env(safe-area-inset-bottom)); z-index: 3; margin: 18px -17px 0; padding: 12px 17px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line-soft); background: var(--paper); flex-wrap: wrap; }
  .dialog-actions .button { flex: 1 1 130px; }
  input, select, textarea { font-size: 16px; }
  .property-detail-hero { min-height: 260px; padding: 18px; }
  .property-detail-toolbar { flex-wrap: wrap; }
  .property-kpi-grid, .gallery-grid { grid-template-columns: 1fr; }
  .unit-detail-row { grid-template-columns: 1fr auto; }
  .unit-detail-row .unit-metric { display: none !important; }
  .detail-section-heading { align-items: flex-start; flex-direction: column; }
  .detail-section-heading .button { width: 100%; }
  .protocol-entry { grid-template-columns: 1fr; }
  .protocol-top { flex-direction: column; }
  .tenant-file-body { padding: 19px; }
  .tenant-file-kpis { grid-template-columns: 1fr 1fr; }
  .tenant-file-hero { align-items: flex-end; }
  .tenant-document-card { grid-template-columns: 40px minmax(0, 1fr); }
  .tenant-document-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .template-card { grid-template-columns: 40px minmax(0, 1fr); }
  .template-card > span:last-child { grid-column: 2; }
  .calc-fields.two-cols, .return-metrics { grid-template-columns: 1fr; }
  .cashflow-row { grid-template-columns: minmax(95px, 1fr) minmax(75px, 1fr) auto; }
  .toast { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); left: 12px; max-width: none; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Serverweite Auswahl zwischen klassischem und räumlichem Layout */
.hero-3d-stage { display: none; }
.wordmark > small { display: none; }
.brand-copy h1 em { font-style: normal; }
.hero-actions { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 10px; }
.hero-actions .button { margin-top: 0; }
.hero-ghost-cta { color: rgba(255,255,255,.86); border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.07); text-decoration: none; }
.proof b { display: none; }
.visual-mode-intro { max-width: 760px; margin: -7px 0 14px; color: var(--muted); font-size: 10px; line-height: 1.6; }
.visual-mode-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.visual-mode-option { min-height: 104px; padding: 15px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 14px; cursor: pointer; transition: border-color .18s, box-shadow .18s, transform .18s; }
.visual-mode-option:hover { border-color: var(--forest-3); transform: translateY(-1px); }
.visual-mode-option:has(input:checked) { border-color: var(--forest-3); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sage-soft) 70%, transparent); }
.visual-mode-option input { position: absolute; opacity: 0; pointer-events: none; }
.visual-mode-option strong, .visual-mode-option small { display: block; }
.visual-mode-option strong { font-size: 12px; }
.visual-mode-option small { margin-top: 5px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.visual-mode-preview { position: relative; width: 76px; height: 58px; overflow: hidden; border-radius: 12px; background: #f1eee6; box-shadow: inset 0 0 0 1px var(--line); }
.visual-mode-preview i { position: absolute; display: block; border-radius: 5px; background: #fff; box-shadow: 0 3px 8px rgba(20,35,31,.09); }
.visual-mode-preview i:nth-child(1) { inset: 8px 36px 8px 8px; background: var(--forest); }
.visual-mode-preview i:nth-child(2) { left: 45px; right: 8px; top: 8px; height: 18px; }
.visual-mode-preview i:nth-child(3) { left: 45px; right: 8px; bottom: 8px; height: 18px; }
.visual-mode-spatial .visual-mode-preview { background: linear-gradient(145deg, #07101f, #142440); box-shadow: inset 0 0 0 1px rgba(112,242,210,.24), 0 8px 18px rgba(7,16,31,.16); perspective: 120px; }
.visual-mode-spatial .visual-mode-preview i { background: linear-gradient(145deg, rgba(112,242,210,.82), rgba(155,135,255,.62)); box-shadow: 6px 7px 12px rgba(0,0,0,.3); transform: rotateY(-13deg) rotateX(5deg); }
.visual-mode-spatial .visual-mode-preview i:nth-child(1) { background: linear-gradient(145deg, #17364a, #0d182b); }
@media (max-width: 620px) {
  .visual-mode-options { grid-template-columns: 1fr; }
  .visual-mode-option { min-height: 94px; grid-template-columns: 68px minmax(0, 1fr); }
  .visual-mode-preview { width: 68px; }
}
