:root {
  --ink: #1d3027;
  --muted: #617168;
  --line: #dde5dc;
  --surface: #ffffff;
  --canvas: #f7f9f5;
  --green: #244c36;
  --green-soft: #e9f2e6;
}

body { color: var(--ink); background: var(--canvas); }
button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid #5c9566;
  outline-offset: 2px;
}
.app-shell { background: var(--canvas); }
.sidebar { width: 218px; background: #173127; padding: 25px 14px 18px; }
.brand { padding: 0 10px; font-size: 21px; }
.sidebar-label { margin: 48px 11px 13px; }
.side-nav { gap: 4px; }
.nav-item { border-radius: 9px; padding: 11px 12px; }
.nav-item.active { background: #d7eabf; color: #1c3b2a; }
.nav-item:hover:not(.active) { background: #284637; }
.sidebar-bottom p { color: #9aafa0; }
.main-content { background: var(--canvas); }
.topbar { height: 62px; border-bottom: 1px solid var(--line); background: var(--canvas); padding: 0 44px; }
.content-wrap { max-width: 1280px; margin: 0; padding: 32px 44px 88px; }
.page-heading { margin-bottom: 23px; align-items: center; }
.page-heading h1 { font-size: clamp(26px, 2.1vw, 32px); margin-bottom: 4px; }
.page-heading p { color: var(--muted); }
.eyebrow { color: #7b8e7f; margin-bottom: 8px; }
.month-control { box-shadow: none; border-color: var(--line); }
.month-control button:hover { background: #f1f5ef; }
.card { border: 1px solid var(--line); border-radius: 12px; box-shadow: none; }
.button { border-radius: 8px; }
.button-dark { background: var(--green); }
.button-dark:hover { background: #306546; }
.button-light { background: var(--green-soft); }
.balance-card { min-height: 148px; padding: 20px; }
.balance-card.main { background: #1d422e; border-color: #1d422e; }
.balance-value { font-size: clamp(24px, 2vw, 30px); margin: 18px 0 7px; }
.balance-icon { width: 29px; height: 29px; right: 18px; top: 17px; }
.section-grid { gap: 14px; margin-top: 14px; }
.panel { padding: 21px; }
.panel-head { margin-bottom: 17px; }
.flow-card { padding: 13px; }
.flow-card strong { font-size: 19px; }
.due-item, .movement-item { gap: 10px; padding: 11px 0; }
.due-button { padding: 8px 10px; }
.list-panel { padding: 6px 18px; }
.settings-card { padding: 22px; }

.concept-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 18px; }
.concept-summary { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px; color: var(--muted); font-size: 12px; }
.concept-summary strong { color: var(--ink); font: 800 15px Manrope, sans-serif; }
.concept-summary i { width: 3px; height: 3px; background: #9caea0; border-radius: 50%; margin: 0 7px 3px; }
.concept-filters { display: inline-flex; gap: 3px; background: #eaf0e8; border-radius: 9px; padding: 3px; }
.concept-filters button { border: 0; background: none; color: #52685a; border-radius: 7px; padding: 8px 16px; font-size: 12px; font-weight: 700; }
.concept-filters button.active { background: #fff; color: #234c36; box-shadow: 0 1px 3px #122c1b16; }
.concept-filters button:hover:not(.active) { background: #dfe9dc; }
.catalog-section { margin-top: 26px; }
.catalog-heading { max-width: 1130px; margin-bottom: 10px; align-items: center; }
.catalog-heading h2 { font-size: 16px; }
.catalog-heading p { font-size: 11px; color: var(--muted); margin-top: 3px; }
.catalog-heading > span { display: grid; place-items: center; min-width: 24px; height: 24px; background: #eaf0e8; border-radius: 7px; color: #48634e; font-weight: 800; font-size: 11px; }
.concept-list { max-width: 1130px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.concept-row { display: grid; align-items: center; gap: 12px; min-height: 66px; padding: 9px 16px; border-bottom: 1px solid #edf1ea; }
.concept-row:last-child { border-bottom: 0; }
.concept-row:hover { background: #f9fbf7; }
.fixed-row { grid-template-columns: 30px minmax(0, 1fr) 90px 116px 164px; }
.catalog-row { grid-template-columns: 30px minmax(0, 1fr) 118px 164px; }
.concept-mark { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; font-size: 15px; font-weight: 800; background: #eef2ea; color: #688070; }
.concept-mark.done, .concept-mark.income { background: #e5f3e6; color: #39804d; }
.concept-mark.expense { background: #fff2e9; color: #b66f4c; }
.concept-mark.debt { background: #f3f0e8; color: #8c7750; }
.concept-main { min-width: 0; }
.concept-main strong { display: block; font-size: 13px; line-height: 1.35; font-weight: 700; color: var(--ink); }
.concept-main small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; line-height: 1.35; }
.concept-status { font-size: 10px; font-weight: 800; color: #896f42; }
.concept-status::before { content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 6px; vertical-align: 1px; border-radius: 50%; background: #ccaa63; }
.concept-status.done { color: #428052; }
.concept-status.done::before { background: #6aa774; }
.concept-amount, .catalog-amount { font: 800 14px Manrope, sans-serif; color: #203629; white-space: nowrap; text-align: right; }
.concept-actions { display: flex; justify-content: flex-end; align-items: center; gap: 6px; }
.row-action { min-height: 34px; padding: 7px 11px; border: 1px solid #d6e6d4; border-radius: 7px; background: #eef6eb; color: #315e3c; font-size: 11px; font-weight: 800; white-space: nowrap; }
.row-action:hover:not(:disabled) { background: #dfeedd; }
.row-action.completed { color: #63836a; background: #f0f4ee; border-color: #e3eae1; }
.catalog-row > .row-action { justify-self: end; }
.row-edit { border: 0; border-radius: 7px; background: transparent; color: #617a68; width: 33px; height: 34px; font-size: 16px; }
.row-edit:hover { background: #eaf1e8; color: #274b32; }
.concept-footnote { max-width: 1130px; margin: 18px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }

@media (max-width: 1100px) {
  .sidebar { width: 202px; }
  .content-wrap { padding: 28px 26px 80px; }
  .topbar { padding: 0 26px; }
  .fixed-row { grid-template-columns: 28px minmax(0, 1fr) 78px 104px 150px; gap: 8px; }
  .catalog-row { grid-template-columns: 28px minmax(0, 1fr) 100px 150px; gap: 8px; }
}

@media (min-width: 751px) and (max-width: 900px) {
  .sidebar { display: none; }
  .main-content { width: 100%; }
  .topbar { justify-content: space-between; }
  .mobile-brand { display: flex; font-size: 18px; gap: 6px; }
  .top-add { display: none; }
  #mobile-settings { display: block; }
  .bottom-nav { display: flex; position: fixed; left: 0; right: 0; bottom: 0; height: calc(65px + env(safe-area-inset-bottom)); padding: 5px 6px env(safe-area-inset-bottom); background: #fff; border-top: 1px solid var(--line); z-index: 10; justify-content: space-around; }
  .bottom-nav button { border: 0; background: none; color: #718476; font-size: 10px; font-weight: 700; min-width: 52px; display: flex; flex-direction: column; align-items: center; gap: 1px; }
  .bottom-nav button span { font-size: 23px; line-height: 1.1; }
  .bottom-nav button.active { color: #2e6942; }
  .bottom-nav .mobile-add { min-width: 43px; }
  .mobile-add span { background: #234a32; color: #fff; border-radius: 13px; width: 42px; height: 42px; display: grid; place-items: center; font-size: 29px !important; line-height: 1 !important; margin-top: -14px; }
}

@media (max-width: 750px) {
  .main-content { width: 100%; }
  .topbar { height: 58px; padding: 0 16px; }
  .content-wrap { padding: 25px 16px 100px; }
  .page-heading { gap: 14px; margin-bottom: 20px; }
  .page-heading h1 { font-size: 27px; }
  .month-control { margin-top: 0; }
  .overview-grid { gap: 9px; }
  .balance-card { min-height: 132px; padding: 16px; }
  .balance-card.main { min-height: 140px; }
  .balance-value { font-size: 23px; margin: 16px 0 6px; }
  .main .balance-value { font-size: 30px; }
  .panel { padding: 18px; }
  .concept-toolbar { margin-bottom: 14px; }
  .concept-summary { line-height: 1.35; }
  .concept-summary strong { font-size: 13px; }
  .concept-toolbar .button { padding: 9px 11px; }
  .catalog-section { margin-top: 24px; }
  .concept-row { min-height: 75px; padding: 11px 12px; gap: 5px 8px; }
  .fixed-row, .catalog-row { grid-template-columns: 27px minmax(0, 1fr) auto; }
  .concept-mark { grid-column: 1; grid-row: 1 / 3; align-self: start; width: 26px; height: 26px; }
  .concept-main { grid-column: 2; grid-row: 1; }
  .concept-main strong { font-size: 12px; }
  .concept-main small { font-size: 10px; }
  .meta-category { display: none; }
  .concept-amount, .catalog-amount { grid-column: 3; grid-row: 1; align-self: start; font-size: 12px; }
  .concept-status { grid-column: 2; grid-row: 2; }
  .concept-actions, .catalog-row > .row-action { grid-column: 3; grid-row: 2; }
  .row-action { min-height: 31px; padding: 6px 8px; font-size: 10px; }
  .row-edit { width: 27px; height: 31px; }
  .catalog-row .concept-main { grid-row: 1 / 3; }
  .catalog-row > .row-action { align-self: end; }
  .bottom-nav { box-shadow: 0 -2px 12px #112a1710; }
  .modal { border-radius: 18px 18px 0 0; }
}

@media (max-width: 390px) {
  .concept-toolbar { align-items: flex-start; }
  .concept-summary { max-width: 170px; }
  .concept-summary i { display: none; }
  .concept-summary span:nth-of-type(2) { display: none; }
  .concept-filters { display: flex; width: 100%; }
  .concept-filters button { flex: 1; padding: 8px 6px; }
  .concept-main small { max-width: 145px; }
}

/* Identidad ORDENATE! */
:root { --canvas: #f7f8f2; --ink: #183a2c; --line: #dde7da; --green: #174b37; }
.sidebar { background: #113d2e; }
.brand { gap: 10px; letter-spacing: -.055em; }
.brand-logo { width: 39px; height: 39px; flex: none; border-radius: 12px; box-shadow: 0 5px 14px #071f1933; }
.brand-name { display: block; line-height: 1; }
.brand-bang { color: #c9ed7b; }
.brand-name small { display: block; margin-top: 6px; color: #b5d1bb; letter-spacing: .13em; font-size: 8px; }
.nav-icon { width: 20px; display: grid; place-items: center; }
.glyph { width: 19px; height: 19px; display: inline-block; flex: none; vertical-align: middle; }
.nav-icon .glyph { width: 18px; height: 18px; }
.nav-item.active { background: #d0ed98; color: #16432f; }
.balance-card.main { background: linear-gradient(130deg, #143d2e, #215a40); border: 0; }
.balance-card.main:after { content: ''; width: 210px; height: 210px; border: 2px solid #ffffff1d; border-radius: 50%; right: -77px; bottom: -140px; }
.balance-card.main:before { content: ''; position: absolute; width: 130px; height: 130px; border: 2px solid #ffffff1a; border-radius: 50%; right: -51px; bottom: -88px; }
.balance-icon .glyph { width: 18px; height: 18px; }
.flow-card span { display: inline-flex; align-items: center; gap: 5px; }
.flow-card .glyph { width: 15px; height: 15px; }
.item-icon .glyph { width: 19px; height: 19px; }
.icon-button .glyph, .row-edit .glyph { width: 16px; height: 16px; }
.concept-mark .glyph { width: 17px; height: 17px; }
.concept-mark { border-radius: 9px; }
.concept-mark.income { background: #e5f6e5; color: #23835a; }
.concept-mark.expense { background: #fff0e3; color: #c66b42; }
.concept-mark.debt { background: #eeeafb; color: #7858a6; }
.shared-card { display: flex; align-items: center; gap: 16px; padding: 19px 21px; margin: 16px 0; border-radius: 15px; background: linear-gradient(100deg, #e1f2bd, #f2f9df 70%); border: 1px solid #d6e9b1; }
.shared-symbol { width: 43px; height: 43px; display: grid; place-items: center; flex: none; border-radius: 12px; background: #194f38; color: #d4ef9d; }
.shared-symbol .glyph { width: 23px; height: 23px; }
.shared-copy { flex: 1; min-width: 0; }
.shared-copy small { font-size: 10px; letter-spacing: .06em; font-weight: 800; color: #507357; }
.shared-copy h2 { margin: 4px 0; font: 800 clamp(17px, 2vw, 22px)/1.2 Manrope, sans-serif; letter-spacing: -.04em; color: #164532; }
.shared-copy p { margin: 0 0 6px; color: #55715a; font-size: 11px; }
.partner-shares { display: flex; flex-wrap: wrap; gap: 5px 13px; margin: 8px 0; color: #345e43; font-size: 11px; font-weight: 800; }
.shared-actions { display: flex; flex-direction: column; align-items: stretch; gap: 7px; }
.shared-actions .button { width: 100%; }
.shared-progress { width: min(300px, 100%); height: 5px; margin: 7px 0 5px; border-radius: 8px; overflow: hidden; background: #c8dea9; }
.shared-progress span { display: block; height: 100%; background: #33865b; border-radius: inherit; }
.shared-button { background: #184b37; color: white; }
.shared-button:hover { background: #286d4b; }
.toolbar-actions { display: flex; gap: 7px; }
.catalog-row { grid-template-columns: 30px minmax(0, 1fr) 118px 164px; }
.catalog-row .concept-actions { justify-content: flex-end; }
.check-field { display: flex; align-items: center; gap: 9px; padding: 8px 0; font-size: 12px; font-weight: 700; color: #315b43; }
.check-field input { accent-color: #277b4c; width: 17px; height: 17px; }
.icon-picker-field { position: relative; grid-column: 1 / -1; }
.icon-picker-toggle { width: 100%; min-height: 41px; border: 1px solid #dce3db; border-radius: 8px; background: #fff; color: #22352a; padding: 4px 9px 4px 5px; display: flex; align-items: center; gap: 8px; text-align: left; font-size: 13px; }
.icon-picker-toggle:hover { border-color: #91b47f; }
.icon-picker-toggle:focus-visible, .icon-picker-option:focus-visible { outline: 2px solid #287a4e; outline-offset: 2px; }
.icon-picker-preview { width: 29px; height: 29px; border-radius: 7px; display: grid; place-items: center; background: #e9f2e5; color: #32744b; flex: none; }
.icon-picker-preview .glyph { width: 17px; height: 17px; }
.icon-picker-name { flex: 1; }
.icon-picker-chevron { color: #789282; font-size: 20px; line-height: 1; margin-right: 2px; }
.icon-picker-menu { position: relative; z-index: 1; margin-top: 7px; padding: 8px; border: 1px solid #dce8d6; border-radius: 11px; background: #f9fbf7; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; box-shadow: 0 9px 22px #153e2512; }
.icon-picker-option { min-width: 0; min-height: 62px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #4b6755; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 5px 2px; font-size: 9px; font-weight: 700; }
.icon-picker-option:hover { background: #ecf4e8; }
.icon-picker-option.selected { background: #e2f0dc; border-color: #a8cda0; color: #1b673e; }
.icon-picker-option .glyph { width: 19px; height: 19px; }
.icon-picker-option span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bottom-nav .glyph { width: 21px; height: 21px; }
.mobile-brand { letter-spacing: -.06em; }
.mobile-brand .brand-logo { width: 29px; height: 29px; border-radius: 8px; }
@media (max-width: 1100px) { .catalog-row { grid-template-columns: 28px minmax(0, 1fr) 100px 150px; } }
@media (max-width: 750px) {
  .brand-name { font-size: 19px; }
  .shared-card { align-items: flex-start; gap: 11px; padding: 16px; flex-wrap: wrap; }
  .shared-symbol { width: 36px; height: 36px; border-radius: 10px; }
  .shared-symbol .glyph { width: 19px; height: 19px; }
  .shared-copy { flex: 1 1 calc(100% - 49px); }
  .shared-copy h2 { font-size: 17px; }
  .shared-button { width: 100%; margin-top: 2px; }
  .concept-toolbar { flex-wrap: wrap; }
  .toolbar-actions { width: 100%; }
  .toolbar-actions .button { flex: 1; }
  .catalog-row { grid-template-columns: 27px minmax(0, 1fr) auto; }
  .catalog-row .concept-actions { grid-column: 3; grid-row: 2; }
}

/* Portada pública: la aplicación queda oculta hasta confirmar la sesión. */
body.auth-locked { background: #f8f8ed; }
body.auth-locked .app-shell { display: none; }
body.auth-unlocked #auth-cover { display: none; }
.welcome { min-height: 100svh; overflow: hidden; display: flex; flex-direction: column; background: radial-gradient(circle at 78% 42%, #e8f4c8 0, #f8f8ed 42%, #f8f8ed 100%); color: #173f31; }
.welcome-header { width: min(100%, 1360px); margin: 0 auto; padding: 30px clamp(22px, 5vw, 76px); display: flex; align-items: center; gap: 26px; position: relative; z-index: 2; }
.welcome-brand { display: flex; align-items: center; gap: 10px; font: 800 24px/1 Manrope, sans-serif; letter-spacing: -.07em; white-space: nowrap; }
.welcome-brand img { width: 42px; height: 42px; border-radius: 12px; box-shadow: 0 8px 16px #183c2e26; }
.welcome-brand span span { color: #74a846; }
.welcome-header-note { margin-left: 4px; padding-left: 25px; border-left: 1px solid #cbd9bd; color: #80917b; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.welcome-link { margin-left: auto; border: 1px solid #cadaae; border-radius: 100px; background: #ffffffb8; padding: 11px 18px; color: #214632; font-size: 12px; font-weight: 800; }
.welcome-link span { margin-left: 10px; font-size: 16px; }
.welcome-link:hover:not(:disabled) { background: #fff; border-color: #8fb75d; }
.welcome button:disabled { opacity: .65; }
.welcome-main { flex: 1; width: min(100%, 1360px); min-height: 560px; margin: 0 auto; padding: 30px clamp(22px, 5vw, 76px) 36px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(410px, .94fr); align-items: center; gap: clamp(28px, 5vw, 78px); }
.welcome-copy { position: relative; z-index: 2; max-width: 640px; }
.welcome-kicker { display: inline-flex; align-items: center; gap: 8px; color: #507950; font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.welcome-kicker span { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #90c955; box-shadow: 0 0 0 5px #dbeec5; }
.welcome-copy h1 { margin: 23px 0 21px; font: 800 clamp(41px, 5.1vw, 70px)/1.08 Manrope, sans-serif; letter-spacing: -.07em; color: #143c2e; }
.welcome-copy h1 em { font-style: normal; color: #79aa46; }
.welcome-copy p { max-width: 49ch; margin: 0 0 30px; color: #657e68; font-size: clamp(14px, 1.3vw, 17px); line-height: 1.65; }
.welcome-primary { border: 0; border-radius: 13px; background: #154532; color: #fff; min-height: 54px; padding: 0 22px; font-size: 14px; font-weight: 800; box-shadow: 0 13px 23px #19482f2a; }
.welcome-primary:hover:not(:disabled) { background: #246246; transform: translateY(-1px); }
.welcome-primary span { margin-left: 30px; font-size: 19px; vertical-align: -1px; }
.welcome-status { display: block; margin-top: 13px; color: #7c927d; font-size: 11px; min-height: 16px; }
.welcome-points { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-top: 37px; }
.welcome-points span { display: inline-flex; align-items: center; gap: 6px; color: #486b50; font-size: 11px; font-weight: 800; }
.welcome-points .glyph { width: 16px; height: 16px; color: #729c57; }
.welcome-visual { min-height: 535px; display: grid; place-items: center; position: relative; isolation: isolate; }
.visual-orbit { position: absolute; border: 1px solid #a9ce804b; border-radius: 50%; z-index: -1; }
.orbit-one { width: 470px; height: 470px; }
.orbit-two { width: 610px; height: 610px; }
.welcome-device { width: min(100%, 412px); padding: 24px; background: #fff; border-radius: 27px; box-shadow: 0 35px 80px #24452f25, 0 3px 8px #24452f0e; transform: rotate(-3deg); border: 1px solid #e2eadc; }
.device-top { display: flex; align-items: center; gap: 10px; }
.device-top img { width: 32px; height: 32px; border-radius: 9px; }
.device-top > span { flex: 1; font-size: 12px; font-weight: 900; }
.device-top small { display: block; color: #8aa08b; font-size: 10px; font-weight: 500; margin-top: 2px; }
.device-top > .glyph { color: #83a58a; }
.device-title { margin: 24px 0 15px; font: 800 24px/1.1 Manrope, sans-serif; letter-spacing: -.05em; }
.device-title span { float: right; color: #9cc965; }
.device-accounts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.device-account { min-height: 127px; border-radius: 15px; padding: 13px; display: flex; flex-direction: column; align-items: flex-start; }
.account-home { background: #e9f3df; color: #305a3d; }
.account-store { background: #eaeefb; color: #485a95; }
.device-account .glyph { width: 20px; height: 20px; margin-bottom: 13px; }
.device-account span { font-size: 13px; font-weight: 900; }
.device-account small { display: block; margin-top: 2px; font-size: 9px; font-weight: 500; opacity: .7; }
.device-account b { display: block; margin-top: auto; width: 68%; height: 9px; background: currentColor; opacity: .13; border-radius: 9px; }
.device-share { margin-top: 11px; border-radius: 15px; background: #d9eea9; padding: 17px; }
.device-share > span { display: flex; align-items: center; gap: 5px; color: #537052; font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.device-share .glyph { width: 15px; height: 15px; }
.device-share strong { display: block; margin: 9px 0 13px; font: 800 20px Manrope, sans-serif; letter-spacing: -.05em; }
.device-progress { height: 6px; border-radius: 9px; background: #b9d78a; overflow: hidden; }
.device-progress span { display: block; height: 100%; width: 61%; border-radius: 9px; background: #4f9460; }
.device-bottom { display: flex; gap: 9px; margin-top: 11px; }
.device-bottom span { flex: 1; padding: 12px; border: 1px solid #edf0eb; border-radius: 11px; color: #627965; display: inline-flex; align-items: center; gap: 7px; font-size: 10px; font-weight: 800; }
.device-bottom .glyph { width: 15px; height: 15px; }
.visual-sticker { position: absolute; z-index: 2; display: flex; align-items: center; gap: 7px; padding: 12px 15px; background: white; border: 1px solid #e1e9d8; border-radius: 12px; box-shadow: 0 12px 32px #2643311c; font-size: 11px; font-weight: 800; }
.visual-sticker .glyph { width: 16px; height: 16px; }
.sticker-top { top: 10px; left: 0; transform: rotate(-8deg); color: #2c7953; }
.sticker-bottom { bottom: 43px; right: -10px; transform: rotate(6deg); color: #7c64aa; }
.welcome-footer { width: min(100%, 1360px); margin: auto auto 0; display: flex; justify-content: space-between; gap: 15px; padding: 18px clamp(22px, 5vw, 76px) 24px; border-top: 1px solid #dfe9d5; color: #79917b; font-size: 10px; font-weight: 700; }
@media (max-width: 930px) {
  .welcome-main { grid-template-columns: 1fr 390px; gap: 20px; }
  .welcome-copy h1 { font-size: clamp(38px, 5vw, 58px); }
  .welcome-visual { min-height: 450px; }
  .welcome-device { transform: rotate(-3deg) scale(.87); }
  .visual-sticker { display: none; }
}
@media (max-width: 750px) {
  .welcome { background: radial-gradient(circle at 62% 52%, #e7f3c7 0, #f8f8ed 60%); }
  .welcome-header { padding: 19px 20px; }
  .welcome-brand { font-size: 20px; }
  .welcome-brand img { width: 34px; height: 34px; border-radius: 9px; }
  .welcome-header-note { display: none; }
  .welcome-link { font-size: 11px; padding: 9px 12px; }
  .welcome-link span { margin-left: 3px; }
  .welcome-main { display: flex; flex-direction: column; align-items: stretch; min-height: auto; padding: 46px 22px 40px; gap: 10px; }
  .welcome-copy h1 { font-size: clamp(40px, 10vw, 56px); margin: 20px 0 18px; }
  .welcome-copy p { font-size: 14px; margin-bottom: 25px; }
  .welcome-primary { width: 100%; }
  .welcome-points { margin-top: 25px; gap: 9px 16px; }
  .welcome-visual { min-height: 390px; margin: 10px -14px 0; }
  .welcome-device { width: 350px; max-width: 95%; transform: rotate(-3deg) scale(.9); }
  .orbit-one { width: 360px; height: 360px; }
  .orbit-two { width: 470px; height: 470px; }
  .welcome-footer { padding: 17px 22px 22px; }
}
@media (max-width: 390px) {
  .welcome-main { padding-top: 37px; }
  .welcome-copy h1 { font-size: 39px; }
  .welcome-points span { font-size: 10px; }
  .welcome-visual { min-height: 350px; }
  .welcome-device { transform: rotate(-3deg) scale(.82); }
}

/* La portada toma los colores y la composición de la carta elegida. */
body.auth-locked { background: #f8f1df; }
.welcome {
  color: #263a35;
  background:
    radial-gradient(circle at 77% 48%, #d8e9de 0, #e9efe3 24%, transparent 49%),
    repeating-linear-gradient(0deg, transparent 0 31px, #a68e6540 32px),
    repeating-linear-gradient(90deg, transparent 0 31px, #a68e6540 32px),
    #f8f1df;
}
.welcome-header { padding-top: 25px; padding-bottom: 25px; }
.welcome-brand span span { color: #c98373; }
.welcome-header-note { color: #566f69; border-color: #b7c6b9; }
.welcome-link { border-color: #314d44; background: #fff9ed; color: #213e36; box-shadow: 3px 3px 0 #284c3e; }
.welcome-link:hover:not(:disabled) { background: #fff; border-color: #213e36; transform: translate(-1px, -1px); box-shadow: 4px 4px 0 #284c3e; }
.welcome-main { grid-template-columns: minmax(0, 1fr) minmax(360px, .8fr); min-height: 670px; gap: clamp(20px, 4vw, 55px); padding-top: 10px; padding-bottom: 16px; }
.welcome-copy { max-width: 665px; }
.welcome-kicker { gap: 10px; color: #91674e; font-size: 11px; letter-spacing: .13em; }
.welcome-kicker span { width: auto; height: auto; border-radius: 0; background: none; box-shadow: none; color: #be806e; font-size: 20px; line-height: 1; }
.welcome-copy h1 { max-width: 680px; margin: 22px 0 18px; color: #243d36; font-size: clamp(48px, 5vw, 74px); line-height: 1.07; }
.welcome-copy h1 em { color: #bc756a; font-style: italic; font-family: Georgia, serif; font-weight: 600; letter-spacing: -.05em; }
.welcome-copy .welcome-lead { margin: 0 0 13px; color: #254c43; font: 800 clamp(22px, 2.4vw, 33px)/1.2 Manrope, sans-serif; letter-spacing: -.045em; }
.welcome-copy .welcome-description { margin: 0 0 27px; color: #5e6f68; font-size: clamp(14px, 1.25vw, 17px); line-height: 1.6; }
.welcome-primary { background: #244b3f; border: 1px solid #16382e; border-radius: 11px; box-shadow: 5px 5px 0 #d59b89; }
.welcome-primary:hover:not(:disabled) { background: #316454; transform: translate(-2px, -2px); box-shadow: 7px 7px 0 #d59b89; }
.welcome-status { color: #62786d; }
.welcome-points { margin-top: 31px; gap: 9px; }
.welcome-points span { padding: 9px 11px; border: 1px solid #d5d4c2; border-radius: 100px; background: #fff8e9c9; color: #455d51; font-size: 11px; }
.welcome-points .glyph { color: #aa7064; }
.welcome-visual { margin: 0; min-height: 600px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 8px 0 18px; }
.welcome-halo { position: absolute; z-index: -1; width: min(95%, 540px); aspect-ratio: 1; border: 1px solid #6994827a; border-radius: 50%; background: radial-gradient(circle, #d8e7dbcc 0, #c3dbd08c 50%, transparent 71%); box-shadow: 0 0 0 28px #cddfd454, 0 0 0 57px #cddfd42b; }
.welcome-tarot-card { position: relative; width: min(100%, 372px); height: auto; display: block; border-radius: 9px; box-shadow: 16px 22px 0 #294d42, 20px 28px 35px #243e3338; transform: rotate(3deg); }
.welcome-card-caption { z-index: 1; margin-top: 26px; padding: 8px 17px; border: 1px solid #9eae92; border-radius: 99px; background: #f9f2e7ed; color: #48665a; font-size: 10px; font-weight: 900; letter-spacing: .14em; text-align: center; }
.welcome-card-caption span { color: #bb806d; margin: 0 5px; }
.welcome-star { position: absolute; z-index: 2; color: #c28471; line-height: 1; text-shadow: 0 2px 0 #fff4dd; }
.star-one { top: 6%; right: 6%; font-size: 45px; }
.star-two { bottom: 17%; left: 1%; font-size: 37px; }
.welcome-footer { color: #647970; border-color: #b9c8b8; }
@media (max-width: 930px) {
  .welcome-main { grid-template-columns: minmax(0, 1fr) minmax(280px, .8fr); min-height: 620px; }
  .welcome-tarot-card { width: min(100%, 315px); }
  .welcome-visual { min-height: 520px; }
  .welcome-copy h1 { font-size: clamp(39px, 5vw, 58px); }
}
@media (max-width: 750px) {
  .welcome { background: radial-gradient(circle at 65% 78%, #deece0 0, transparent 52%), repeating-linear-gradient(0deg, transparent 0 31px, #a68e6530 32px), repeating-linear-gradient(90deg, transparent 0 31px, #a68e6530 32px), #f8f1df; }
  .welcome-header { padding: 18px 20px; }
  .welcome-main { padding: 27px 22px 22px; gap: 14px; }
  .welcome-copy h1 { margin: 17px 0 13px; font-size: clamp(41px, 10vw, 56px); }
  .welcome-copy .welcome-lead { font-size: 23px; margin-bottom: 10px; }
  .welcome-copy .welcome-description { margin-bottom: 23px; }
  .welcome-points { margin-top: 22px; }
  .welcome-visual { min-height: 0; margin: 10px auto 0; width: 100%; padding: 23px 16px 15px; }
  .welcome-tarot-card { width: min(78vw, 330px); }
  .welcome-halo { width: min(90vw, 440px); }
  .star-one { right: 0; top: 5%; }
  .star-two { left: 0; bottom: 14%; }
  .welcome-card-caption { margin-top: 24px; font-size: 9px; }
}
@media (max-width: 390px) {
  .welcome-copy h1 { font-size: 40px; }
  .welcome-kicker { font-size: 9px; }
  .welcome-points span { font-size: 10px; padding: 7px 9px; }
  .welcome-tarot-card { width: min(76vw, 290px); }
}

/* Registro y navegación */
body.dialog-open { overflow: hidden; }
.top-add { display: inline-flex; align-items: center; gap: 8px; min-height: 39px; }
.top-add .glyph { width: 16px; height: 16px; }
#mobile-settings { border: 0; background: transparent; color: #47705a; width: 36px; height: 36px; border-radius: 9px; }
#mobile-settings .glyph { width: 19px; height: 19px; }
#mobile-settings:hover { background: #e8f0e4; }
.month-navigation { display: flex; align-items: center; gap: 9px; }
.current-month { border: 0; background: #e5f0df; color: #306e45; border-radius: 8px; min-height: 37px; padding: 0 12px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.current-month:hover { background: #d8eacb; }
.quick-entry { display: flex; align-items: center; gap: 7px; margin: 15px 0 3px; }
.quick-entry > span { color: #688071; font-size: 11px; font-weight: 800; margin-right: 5px; white-space: nowrap; }
.quick-entry button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 34px; border: 1px solid #d9e5d5; border-radius: 8px; background: #fff; color: #31513d; padding: 0 11px; font-size: 11px; font-weight: 800; transition: transform .16s ease, border-color .16s ease, background .16s ease; }
.quick-entry button:hover { transform: translateY(-1px); border-color: #aacaa5; background: #f6faf2; }
.quick-entry .glyph { width: 15px; height: 15px; }
.quick-entry button:nth-of-type(1) .glyph { color: #3c9860; }
.quick-entry button:nth-of-type(2) .glyph { color: #c47b57; }
.quick-entry button:nth-of-type(3) .glyph { color: #6782b7; }
.modal-backdrop { background: #0a261dcc; backdrop-filter: blur(4px); }
.modal { width: min(100%, 540px); padding: 0; border-radius: 20px; max-height: min(92vh, 850px); overscroll-behavior: contain; box-shadow: 0 28px 75px #071c1650; animation: modal-rise .2s ease-out; }
.modal-header { position: sticky; top: 0; z-index: 5; align-items: center; gap: 13px; margin: 0; padding: 22px 24px 17px; background: #fff; border-bottom: 1px solid #edf1e9; }
.modal-symbol { flex: none; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #e7f3df; color: #28734a; }
.modal-symbol .glyph { width: 22px; height: 22px; }
.modal-heading { min-width: 0; flex: 1; }
.modal-kicker { display: block; margin-bottom: 3px; color: #6e9770; font-size: 9px; font-weight: 900; letter-spacing: .13em; }
.modal-header h2 { font-size: 20px; line-height: 1.2; }
.modal-header p { color: #77887b; font-size: 11px; line-height: 1.4; }
.modal-close { flex: none; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; font-size: 20px; line-height: 1; }
.modal-close:hover { background: #e3ebe0; color: #244d35; }
.modal-content { padding: 8px 24px 24px; }
.modal-content .field { margin: 12px 0; gap: 7px; }
.modal-content .field label { color: #4e6557; font-size: 11px; }
.modal-content .field input:not([type=checkbox]), .modal-content .field select { height: 44px; border-radius: 9px; border-color: #d6e2d5; background: #fff; }
.modal-content .field input:hover, .modal-content .field select:hover { border-color: #a8c6a5; }
.modal-content .field input:focus, .modal-content .field select:focus { border-color: #67a76e; box-shadow: 0 0 0 3px #7fc17d2d; }
.modal-content .form-grid { gap: 0 15px; }
.modal-content .type-picker { gap: 5px; padding: 5px; margin: 13px 0 5px; border-radius: 11px; background: #edf2e9; }
.modal-content .type-picker label { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 39px; padding: 7px 3px; }
.type-picker .glyph { width: 16px; height: 16px; }
.type-picker label:has(input:checked) { color: #1e5d3d; }
.modal-content .modal-actions { position: sticky; bottom: -24px; z-index: 4; align-items: center; margin: 18px -24px -24px; padding: 15px 24px calc(17px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #e9eee7; box-shadow: 0 -8px 22px #1b3a2310; }
.modal-actions .right { flex-wrap: wrap; justify-content: flex-end; }
.modal-actions .button { min-height: 39px; }
.modal-content .error:not(:empty) { padding: 9px 11px; border-radius: 8px; background: #fff0ec; }
.quick-modal { width: min(100%, 470px); }
.quick-action-list { display: grid; gap: 7px; padding-top: 9px; }
.quick-action { display: flex; align-items: center; width: 100%; min-height: 68px; gap: 12px; border: 1px solid #e2ebe0; border-radius: 11px; background: #fff; padding: 9px 12px; text-align: left; color: #284835; }
.quick-action:hover, .quick-action:focus-visible { border-color: #9ec39c; background: #f6faf3; transform: translateX(2px); }
.quick-action-icon { flex: none; width: 41px; height: 41px; display: grid; place-items: center; border-radius: 10px; }
.quick-action-icon.green { color: #2f8653; background: #e8f4e7; }
.quick-action-icon.orange { color: #bd7651; background: #fcf0e8; }
.quick-action-icon.blue { color: #5b75a9; background: #eaf0f9; }
.quick-action-icon .glyph { width: 20px; height: 20px; }
.quick-action-copy { flex: 1; min-width: 0; }
.quick-action-copy strong { display: block; font-size: 13px; }
.quick-action-copy small { display: block; margin-top: 3px; color: #7d8e80; font-size: 11px; }
.quick-action-arrow { color: #a0b4a3; font-size: 23px; }
@keyframes modal-rise { from { opacity: .65; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 900px) {
  .bottom-nav { padding-left: 10px; padding-right: 10px; border-radius: 16px 16px 0 0; }
  .bottom-nav button:not(.mobile-add) { border-radius: 10px; padding-top: 4px; }
  .bottom-nav button.active:not(.mobile-add) { color: #1d6341; background: #eef6e9; }
  .bottom-nav .mobile-add span { background: #184e37; border: 3px solid #fff; border-radius: 14px; box-shadow: 0 6px 15px #173e2e38; }
}
@media (max-width: 750px) {
  .page-heading { align-items: flex-start; }
  .month-navigation { width: 100%; justify-content: space-between; margin-top: 3px; }
  .month-control { margin-left: auto; }
  .quick-entry { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 12px; }
  .quick-entry > span { grid-column: 1 / -1; margin: 0 0 1px; }
  .quick-entry button { min-height: 40px; padding: 0 4px; font-size: 10px; gap: 4px; }
  .quick-entry .glyph { width: 14px; height: 14px; }
  .modal { width: 100%; max-height: 93dvh; border-radius: 20px 20px 0 0; animation: modal-sheet .2s ease-out; }
  .modal-header { padding: 18px 18px 15px; }
  .modal-symbol { width: 38px; height: 38px; }
  .modal-header h2 { font-size: 19px; }
  .modal-content { padding: 8px 18px 20px; }
  .modal-content .modal-actions { bottom: -20px; margin: 18px -18px -20px; padding: 12px 18px calc(14px + env(safe-area-inset-bottom)); }
  .modal-actions .button { padding: 10px 12px; }
}
@media (max-width: 370px) {
  .modal-content .form-grid { grid-template-columns: 1fr; }
  .modal-content .form-grid > .field, .modal-content .form-grid > .full { grid-column: 1; }
  .quick-entry button { font-size: 9px; }
}
@keyframes modal-sheet { from { opacity: .7; transform: translateY(25px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .modal, .quick-entry button, .quick-action { animation: none; transition: none; } }

/* Agenda y tarot del negocio */
.business-side-label { margin-top: 22px; margin-bottom: 7px; }
.business-tabs { display: inline-flex; gap: 4px; padding: 4px; background: #eaf0e8; border-radius: 12px; margin-bottom: 24px; }
.business-tabs button { border: 0; background: transparent; border-radius: 9px; padding: 10px 18px; color: #677d6c; font-size: 12px; font-weight: 800; display: inline-flex; align-items: center; gap: 8px; }
.business-tabs button .glyph { width: 17px; height: 17px; }
.business-tabs button.active { background: #fff; color: #1f593b; box-shadow: 0 2px 8px #14382518; }
.business-kicker { color: #5e916c; font-size: 10px; font-weight: 900; letter-spacing: .15em; }
.agenda-intro { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.agenda-intro h2,.tarot-copy h2 { font: 800 clamp(24px, 2.3vw, 33px)/1.18 Manrope,sans-serif; letter-spacing: -.055em; margin: 8px 0 5px; }
.agenda-intro p { margin: 0; color: #758779; font-size: 12px; line-height: 1.5; }
.agenda-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; }
.agenda-period,.agenda-modes { display: flex; align-items: center; gap: 3px; }
.agenda-period { background: #fff; border: 1px solid #dfe8dc; border-radius: 10px; padding: 3px; }
.agenda-period strong { min-width: 165px; text-align: center; font-size: 12px; }
.agenda-period button,.agenda-modes button { border: 0; background: transparent; color: #3f624d; border-radius: 7px; min-height: 34px; }
.agenda-period > button:first-child,.agenda-period > button:nth-child(3) { width: 30px; font-size: 23px; line-height: 1; }
.agenda-period .agenda-today { padding: 0 10px; background: #edf5e7; font-size: 11px; font-weight: 800; }
.agenda-modes { padding: 3px; border-radius: 10px; background: #ebf0e9; }
.agenda-modes button { padding: 0 13px; font-weight: 800; font-size: 11px; }
.agenda-modes button.active { background: white; box-shadow: 0 2px 5px #244a2e18; }
.agenda-filters { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 13px; }
.agenda-filters button { border: 1px solid #dce7dc; background: #fff; color: #5a6f60; border-radius: 100px; padding: 7px 11px; font-size: 11px; font-weight: 800; display: inline-flex; align-items: center; gap: 7px; }
.agenda-filters button.active { background: #214d36; color: #fff; border-color: #214d36; }
.agenda-filters i,.month-dots i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; }
.agenda-filters i.hair,.month-dots i.hair { background: #e58b64; }
.agenda-filters i.therapeutic,.month-dots i.therapeutic { background: #7b80c1; }
.agenda-filters i.personal,.month-dots i.personal { background: #4b91b4; }
.agenda-filters i.reminder,.month-dots i.reminder { background: #c6a54a; }
.agenda-calendar { overflow: hidden; }
.agenda-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); min-height: 340px; }
.agenda-day { min-width: 0; padding: 11px 7px; border-right: 1px solid #edf1ec; }
.agenda-day:last-child { border-right: 0; }
.agenda-day.today { background: #f6faef; }
.agenda-day.selected { box-shadow: inset 0 3px #6dba70; }
.agenda-day-heading { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 4px 5px 11px; border: 0; background: transparent; color: #3a5742; text-transform: capitalize; text-align: left; font-size: 12px; font-weight: 900; }
.agenda-day-heading small { color: #4e8e53; font-size: 8px; letter-spacing: .08em; }
.agenda-day-appointments { display: grid; gap: 6px; }
.appointment { display: grid; width: 100%; gap: 3px; border: 1px solid #f4d7c8; border-left: 4px solid #db825b; background: #fff5ef; color: #5a3c2d; border-radius: 8px; padding: 9px; text-align: left; overflow: hidden; }
.appointment.therapeutic { background: #f2f1fc; border-color: #dcd9f5; border-left-color: #797dc4; color: #34365f; }
.appointment.personal { background: #edf7fb; border-color: #d2e9f2; border-left-color: #4b91b4; color: #24536d; }
.appointment.reminder { background: #fff9e9; border-color: #efe2b7; border-left-color: #b99942; color: #6c5724; }
.appointment:hover,.appointment:focus-visible { outline: 2px solid #285d40; outline-offset: 1px; }
.appointment-time { font-size: 10px; font-weight: 900; white-space: nowrap; }
.appointment strong { font-size: 12px; overflow: hidden; text-overflow: ellipsis; }
.appointment small { font-size: 10px; color: inherit; opacity: .8; overflow: hidden; text-overflow: ellipsis; }
.appointment-type { font-size: 9px; font-weight: 800; opacity: .75; }
.agenda-empty { border: 1px dashed #d9e4d9; color: #719177; background: #fff; border-radius: 7px; width: 100%; padding: 9px 2px; font-size: 10px; font-weight: 800; }
.agenda-empty:hover { background: #f2f9ee; }
.agenda-month { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); }
.month-weekday { padding: 13px 9px; color: #87958a; text-align: center; font-size: 10px; font-weight: 900; text-transform: uppercase; border-bottom: 1px solid #e8eee7; }
.month-day { min-width: 0; min-height: 91px; display: flex; flex-direction: column; align-items: flex-start; gap: 7px; border: 0; border-right: 1px solid #edf1ec; border-bottom: 1px solid #edf1ec; background: #fff; padding: 9px; color: #2c4635; text-align: left; }
.month-day:nth-child(7n) { border-right: 0; }
.month-day:hover { background: #f4f9f1; }
.month-day.outside { background: #f9faf7; color: #b1bdb1; }
.month-day.today strong { background: #25583c; color: #fff; border-radius: 50%; width: 25px; height: 25px; display: grid; place-items: center; margin: -4px; }
.month-day.selected { box-shadow: inset 0 0 0 2px #68ab6a; }
.month-day strong { font-size: 12px; }
.month-day small { color: #6b806e; font-size: 10px; }
.month-dots { display: flex; flex-wrap: wrap; gap: 3px; min-height: 8px; }
.agenda-selected { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 19px; border-bottom: 1px solid #eaf0e9; }
.agenda-selected h3 { font-size: 14px; margin: 0 0 3px; }
.agenda-selected span { font-size: 11px; color: #829185; }
.agenda-selected-list { display: grid; gap: 8px; padding: 14px 19px 19px; }
.agenda-selected-list .appointment { grid-template-columns: 85px minmax(0,1fr) auto; align-items: center; }
.agenda-selected-list .appointment small { display: none; }
.agenda-no-appointments { color: #879589; font-size: 12px; margin: 12px 0; }
.appointment-privacy { font-size: 11px; color: #7c8d80; line-height: 1.5; }
.appointment-payment { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 11px 13px; margin-top: 13px; background: #f2f8ed; border-radius: 9px; color: #416b49; font-size: 11px; font-weight: 700; }
.tarot-hero { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 24px; background: #142d27; color: #f8f5e8; border-radius: 18px; overflow: hidden; padding: 42px; min-height: 430px; }
.tarot-copy { position: relative; z-index: 2; }
.tarot-copy .business-kicker { color: #d8c78f; }
.tarot-copy h2 { font-size: clamp(32px,4vw,52px); }
.tarot-copy p { max-width: 370px; color: #b7c9b9; font-size: 13px; line-height: 1.7; }
.tarot-date { margin: 22px 0 24px; color: #e3e5ca; font-size: 12px; }
.tarot-draw { background: #e4c77e; color: #183529; padding: 15px 20px; }
.tarot-draw:hover { background: #f0da9e; }
.tarot-result-label { color: #d8c78f; font-size: 10px; letter-spacing: .14em; font-weight: 900; }
.tarot-copy h3 { font: 800 29px Manrope,sans-serif; letter-spacing: -.04em; margin: 6px 0; }
.tarot-group { color: #b9c8b4; font-size: 12px; }
.tarot-stage { min-height: 350px; display: grid; place-items: center; }
.tarot-revealed { width: min(100%, 205px); height: auto; max-height: 340px; object-fit: contain; border-radius: 8px; box-shadow: 0 18px 50px #0008; animation: tarot-reveal .6s ease both; }
.tarot-wheel { position: relative; width: 230px; height: 300px; display: grid; place-items: center; }
.tarot-wheel-card { width: 134px; height: 226px; position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px; border: 5px solid #d1ad69; border-radius: 9px; background: repeating-linear-gradient(45deg,#203b36 0 8px,#284941 8px 16px); outline: 2px solid #d1ad69; outline-offset: -13px; transform: rotate(calc((var(--index) - 3.5) * 8deg)) translateX(calc((var(--index) - 3.5) * 10px)); box-shadow: 0 8px 22px #0005; }
.tarot-wheel-card b { color: #e0c481; font-size: 54px; }
.tarot-wheel-card small { color: #e0c481; font-size: 8px; letter-spacing: .12em; font-weight: 900; }
.tarot-stage.spinning .tarot-wheel { animation: tarot-spin .18s linear infinite; }
.tarot-history { margin-top: 24px; padding: 20px 22px; border: 1px solid #e5ece2; border-radius: 14px; background: #fff; }
.tarot-history .panel-head { margin-bottom: 10px; }
.tarot-history-list { display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 7px 16px; }
.tarot-history-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid #eef2ec; }
.tarot-history-row img { width: 35px; height: 59px; object-fit: cover; border-radius: 3px; }
.tarot-history-row span:nth-child(2) { display: grid; gap: 3px; flex: 1; }
.tarot-history-row strong { font-size: 11px; }
.tarot-history-row small,.tarot-history-row > span:last-child { font-size: 9px; color: #849087; }
.tarot-credit { color: #859087; font-size: 10px; line-height: 1.6; }
.tarot-credit a { color: #416e50; }
@keyframes tarot-spin { to { transform: rotate(360deg); } }
@keyframes tarot-reveal { from { opacity: 0; transform: translateY(14px) rotateY(80deg); } to { opacity: 1; transform: translateY(0) rotateY(0); } }
@media (max-width: 1200px) and (min-width: 751px) { .agenda-week { grid-template-columns: repeat(4,minmax(0,1fr)); } .agenda-day { border-bottom: 1px solid #edf1ec; } }
@media (max-width: 750px) {
  .bottom-nav button:not(.mobile-add) { flex: 1 1 0; min-width: 0; font-size: 9px; }
  .bottom-nav .mobile-add { flex: 0 0 43px; }
  .business-tabs { display: flex; width: 100%; }
  .business-tabs button { flex: 1; justify-content: center; padding: 10px; }
  .agenda-intro { align-items: flex-start; }
  .agenda-intro .button { font-size: 10px; padding: 10px; }
  .agenda-intro h2 { font-size: 25px; }
  .agenda-toolbar { flex-wrap: wrap; }
  .agenda-period { flex: 1; }
  .agenda-period strong { flex: 1; min-width: 0; }
  .agenda-modes { margin-left: auto; }
  .agenda-week { display: grid; grid-template-columns: 1fr; min-height: 0; }
  .agenda-day { border-right: 0; border-bottom: 1px solid #edf1ec; padding: 10px 12px; }
  .agenda-day-appointments { grid-template-columns: repeat(auto-fit,minmax(145px,1fr)); }
  .agenda-empty { width: auto; padding: 8px 13px; }
  .month-day { min-height: 67px; padding: 6px; }
  .month-day small { display: none; }
  .month-weekday { padding: 9px 2px; font-size: 9px; }
  .tarot-hero { grid-template-columns: 1fr; padding: 29px 23px; gap: 8px; }
  .tarot-copy h2 { font-size: 37px; }
  .tarot-stage { min-height: 290px; }
  .tarot-wheel { transform: scale(.85); }
}
@media (max-width: 360px) { .bottom-nav button:not(.mobile-add) { font-size: 8px; } .bottom-nav button .glyph { width: 19px; height: 19px; } .agenda-selected-list .appointment { grid-template-columns: 70px minmax(0,1fr); } .agenda-selected-list .appointment-type { display: none; } }
@media (prefers-reduced-motion: reduce) { .tarot-stage.spinning .tarot-wheel,.tarot-revealed { animation: none; } }

/* Cuentas independientes en Movimientos */
.movement-jump { display: flex; gap: 8px; margin-bottom: 18px; }
.movement-jump a { display: inline-flex; align-items: center; gap: 7px; padding: 8px 13px; border: 1px solid #dfe9dc; border-radius: 100px; background: #fff; color: #2f6141; text-decoration: none; font-size: 11px; font-weight: 800; }
.movement-jump .glyph { width: 16px; height: 16px; }
.movement-account-section { margin-bottom: 27px; scroll-margin-top: 20px; }
.movement-account-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.movement-account-symbol { width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 12px; background: #e9f3e5; color: #32764d; }
.movement-account-section.business .movement-account-symbol { background: #e9eee5; color: #224e38; }
.movement-account-symbol .glyph { width: 24px; height: 24px; }
.movement-account-head > div:nth-child(2) { min-width: 0; flex: 1; }
.movement-account-head > div:nth-child(2) > span { color: #6c9571; font-size: 9px; font-weight: 900; letter-spacing: .13em; }
.movement-account-head h2 { margin: 1px 0 1px; font: 800 20px Manrope,sans-serif; letter-spacing: -.04em; }
.movement-account-head p { margin: 0; font-size: 11px; color: #809184; }
.movement-account-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.movement-kpis { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-bottom: 12px; }
.movement-kpis > div { padding: 16px 18px; border: 1px solid #e3ebe0; border-radius: 12px; background: #fff; }
.movement-kpis span { display: block; color: #7d8d80; font-size: 10px; font-weight: 800; }
.movement-kpis strong { display: block; margin-top: 5px; font: 800 clamp(17px,1.8vw,24px) Manrope,sans-serif; letter-spacing: -.05em; }
.movement-kpis strong.income,.movement-activity-row .income { color: #33744a; }
.movement-kpis strong.expense,.movement-activity-row .expense { color: #b66c52; }
.movement-activities { padding: 17px 18px; border: 1px solid #dde9d9; border-radius: 12px; background: #f6faf3; margin-bottom: 12px; }
.movement-activities-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 9px; }
.movement-activities h3,.movement-list-head h3 { margin: 0; font-size: 13px; }
.movement-activities-head span { color: #819187; font-size: 10px; }
.movement-activity-row { display: grid; grid-template-columns: minmax(0,1.5fr) repeat(3,minmax(70px,1fr)); gap: 8px; align-items: center; padding: 9px 0; border-top: 1px solid #e4ede0; font-size: 11px; }
.movement-activity-row strong { overflow: hidden; text-overflow: ellipsis; }
.movement-activity-row span,.movement-activity-row b { text-align: right; white-space: nowrap; }
.movement-activity-row.general { color: #718175; }
.movement-activities p { color: #809080; font-size: 10px; line-height: 1.5; margin: 10px 0 0; }
.movement-account-list { padding: 6px 20px 10px; }
.movement-list-head { display: flex; justify-content: space-between; align-items: center; padding: 14px 0 7px; }
.movement-list-head small { color: #859286; font-size: 10px; }
@media (max-width: 750px) { .movement-account-head { flex-wrap: wrap; } .movement-account-actions { width: 100%; justify-content: flex-start; } .movement-account-actions .button { font-size: 10px; } .movement-kpis { gap: 6px; } .movement-kpis > div { padding: 12px 10px; } .movement-kpis strong { font-size: 17px; } .movement-activity-row { grid-template-columns: minmax(0,1.2fr) repeat(3,minmax(56px,1fr)); font-size: 10px; gap: 4px; } .movement-account-list { padding: 5px 13px 10px; } }
@media (max-width: 370px) { .movement-kpis strong { font-size: 15px; } .movement-activity-row { font-size: 9px; } }
.today-agenda { display: flex; align-items: center; gap: 16px; padding: 17px 20px; margin: 17px 0; background: #f9fbf6; }
.today-agenda > div:first-child { min-width: 190px; }
.today-agenda h2 { font: 800 15px Manrope,sans-serif; margin: 4px 0 2px; }
.today-agenda p { color: #829084; font-size: 10px; margin: 0; }
.today-events { display: flex; flex: 1; flex-wrap: wrap; gap: 7px; }
.today-events > span { display: grid; gap: 2px; padding: 7px 10px; border-radius: 8px; background: #fff2e9; color: #7b503d; font-size: 11px; font-weight: 800; }
.today-events > span.therapeutic { background: #efeffa; color: #565a9b; }
.today-events > span.personal { background: #e9f5fa; color: #376a83; }
.today-events > span.reminder { background: #fff6dd; color: #786333; }
.today-events b { font-size: 9px; }
.today-events small { font-size: 9px; font-weight: 600; }
@media (max-width: 750px) { .today-agenda { align-items: flex-start; flex-wrap: wrap; } .today-events { flex-basis: 100%; } .today-agenda > .button { margin-left: auto; } .appointment-payment { flex-wrap: wrap; } }

.activity-card { margin-top: 15px; padding: 20px 22px 15px; }
.activity-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 15px; margin-bottom: 14px; }
.activity-eyebrow { color: #64876b; font-size: 9px; font-weight: 900; letter-spacing: .13em; }
.activity-heading h2 { margin: 5px 0 3px; color: #1c4832; font: 800 17px Manrope, sans-serif; letter-spacing: -.035em; }
.activity-heading p { margin: 0; color: #75867a; font-size: 11px; }
.activity-heading > strong { color: #23724a; font: 800 24px Manrope, sans-serif; letter-spacing: -.045em; white-space: nowrap; }
.activity-heading > strong small { display: block; color: #8a9b8c; font: 700 10px 'DM Sans', sans-serif; text-align: right; letter-spacing: 0; }
.activity-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.activity-row { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 11px; background: #f5f9f2; border: 1px solid #e8efe4; border-radius: 10px; }
.activity-row.unclassified { background: #fcf7ec; border-color: #f1e6ca; }
.activity-row-icon { flex: none; width: 31px; height: 31px; display: grid; place-items: center; border-radius: 8px; background: #e3f0dc; color: #3b8a54; }
.activity-row.unclassified .activity-row-icon { background: #f8eacc; color: #ad8544; }
.activity-row-icon .glyph { width: 16px; height: 16px; }
.activity-row-main { flex: 1; min-width: 0; }
.activity-row-main > strong { display: block; color: #315741; font-size: 11px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.activity-row-main > span { display: block; margin-top: 3px; color: #748b78; font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.activity-row-main i { display: block; height: 4px; margin-top: 7px; background: #e3ebdd; border-radius: 4px; overflow: hidden; }
.activity-row-main b { display: block; height: 100%; background: #6aac72; border-radius: inherit; }
.activity-row > strong { font-size: 12px; font-weight: 900; white-space: nowrap; }
.activity-row > strong.negative { color: #bf7456; }
.activity-heading > strong.negative { color: #bd7655; }
.activity-totals { display: flex; gap: 16px; padding: 11px 0 0; color: #748879; font-size: 11px; }
.activity-totals { flex-wrap: wrap; }
.activity-totals strong { color: #284d36; margin-left: 3px; }
.activity-allocation-button { display: inline-flex; align-items: center; gap: 7px; margin-top: 12px; border: 1px solid #cfe1c9; border-radius: 8px; background: #eef7e9; color: #2d6f42; padding: 8px 10px; font-size: 11px; font-weight: 800; }
.activity-allocation-button:hover { background: #e1f0da; }
.activity-allocation-button .glyph { width: 15px; height: 15px; }
.activity-unassigned { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: 10px; padding: 9px 11px; border-radius: 8px; background: #fff7e9; color: #8b7050; font-size: 10px; }
.activity-unassigned strong { color: #604d31; }
.activity-unassigned .text-button { margin-left: auto; }
.activity-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 12px; color: #819086; font-size: 10px; }
.activity-foot .text-button { white-space: nowrap; }
.analysis-grid { margin-top: 15px; }
.activity-settings-list { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.activity-settings-list > span { display: inline-flex; align-items: center; gap: 5px; padding: 5px 5px 5px 10px; background: #edf5e9; color: #2c6840; border-radius: 20px; font-size: 11px; font-weight: 800; }
.activity-settings-list > span.inactive { background: #f0f1ec; color: #89948b; }
.activity-settings-list button { border: 0; background: #d9ead4; color: #3e7051; border-radius: 14px; padding: 5px 7px; font-size: 10px; font-weight: 800; }
.activity-settings-list .inactive button { background: #dce7da; }
.activity-settings-list button:hover { background: #c4dfbf; }
.activity-add-form label { display: block; margin-bottom: 6px; color: #586a5d; font-size: 11px; font-weight: 800; }
.activity-add-form > div { display: flex; gap: 7px; }
.activity-add-form input { flex: 1; min-width: 0; height: 38px; padding: 0 10px; border: 1px solid #d7e4d5; border-radius: 8px; font-size: 12px; }
.activity-add-form .button { min-height: 38px; }
.allocation-intro { color: #617a66; font-size: 12px; line-height: 1.5; }
.allocation-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid #edf1eb; }
.allocation-row label { color: #294a35; font-size: 12px; font-weight: 800; }
.allocation-row > div { display: flex; align-items: center; gap: 5px; color: #748d78; }
.allocation-row input { width: 78px; height: 39px; border: 1px solid #d8e4d5; border-radius: 8px; padding: 0 8px; text-align: right; font-size: 13px; font-weight: 800; color: #295a3c; }
.allocation-total { margin-top: 13px; color: #31794e; font-size: 12px; font-weight: 900; text-align: right; }
.partner-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: end; border-bottom: 1px solid #e7efe4; }
.partner-row .field { margin: 7px 0 11px; }
.partner-switch { display: inline-flex; align-items: center; gap: 5px; margin-bottom: 22px; color: #54705a; font-size: 11px; font-weight: 800; white-space: nowrap; }
.partner-switch input { accent-color: #287b4c; width: 16px; height: 16px; }
.partner-preview { padding: 11px 12px; border-radius: 8px; background: #eff7eb; color: #366c45; font-size: 11px; font-weight: 800; }
@media (max-width: 1100px) { .activity-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 750px) {
  .activity-card { padding: 16px; }
  .activity-heading { align-items: flex-start; }
  .activity-heading > strong { font-size: 18px; }
  .activity-list { grid-template-columns: 1fr; gap: 6px; }
  .activity-row { padding: 9px 10px; }
  .activity-foot { align-items: flex-start; flex-direction: column; }
  .shared-actions { width: 100%; flex-direction: row; }
  .shared-actions .button { flex: 1; font-size: 10px; white-space: normal; }
  .partner-row { grid-template-columns: 1fr; gap: 0; }
  .partner-switch { margin: 0 0 13px; }
}