/* Luminous illustrations and complete phone layouts. Loaded after design.css. */
.glow-art {display:block;overflow:hidden;border-radius:20px;background:#170c2d}
.glow-art img {display:block;width:100%;height:100%;object-fit:cover}
.auth-art {position:relative;max-width:560px;margin-top:28px;border:1px solid #bc86ff50;box-shadow:0 0 35px #a364ef24;aspect-ratio:3/2}
.hero-banner .illuminated-cover {display:block;flex:0 1 330px;width:330px;height:auto;min-width:0;transform:none;margin:0}
.illuminated-cover .glow-art {aspect-ratio:3/2;border:1px solid #d5b1ff60;box-shadow:0 0 35px #c694ff25}
.illuminated-cover .capacity-badge {position:relative;right:auto;bottom:auto;max-width:none;margin:-18px 18px 0;padding:11px 16px;display:flex;align-items:center;justify-content:center;gap:10px;background:#291947ed;backdrop-filter:blur(8px)}
.illuminated-cover .capacity-badge strong {font-size:22px}.illuminated-cover .capacity-badge span {font-size:11px}
.section-head,.message-hero,.permissions-hero {position:relative;isolation:isolate}
.page-section>.section-head {display:flex;align-items:center;gap:20px}
.page-section>.section-head>div:first-child {flex:1;min-width:0}
.section-art {width:120px;height:80px;flex:none;order:2;border:1px solid #ab7ff052;box-shadow:0 0 20px #955ee526;border-radius:12px}
.message-hero {padding-right:175px;min-height:140px}.message-hero .section-art {position:absolute;right:25px;top:25px}
.permissions-hero .section-art {width:100px;height:76px}
.calendar-scroll {overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin}
.calendar-scroll-hint {display:none}
@media(max-width:1100px) and (min-width:761px) {
 .topbar {padding-left:66px;align-items:flex-start}.top-actions {width:100%;display:flex;flex-wrap:wrap}
 .global-search-wrap {flex:1;min-width:260px}.main-content {padding-bottom:40px}
 .hero-banner>div:first-child {max-width:65%}.hero-banner .illuminated-cover {width:250px;flex-basis:250px}
 .profile-filter-bar {grid-template-columns:repeat(2,minmax(0,1fr))}
 .table-card {overflow-x:auto}.table-card table {min-width:700px}
 .permissions-hero {flex-wrap:wrap}.permission-actions {flex-wrap:wrap}
}
@media(max-width:900px) {
 .auth-brand {display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 12px;padding:24px}
 .auth-brand>.brand-mark {grid-column:1;grid-row:1;align-self:center;margin:0}
 .auth-brand>div:nth-of-type(2) {grid-column:2;grid-row:1}
 .auth-brand h2 {margin:0}.auth-brand>div>p {margin:4px 0}
 .auth-brand .hero-copy {grid-column:1/-1;margin-top:22px;padding-right:125px;min-height:116px}
 .auth-brand .hero-copy h1 {font-size:32px;letter-spacing:-1.3px;margin:10px 0}
 .auth-brand .hero-copy>p,.auth-brand .store-badge {display:none}
 .auth-brand .auth-art {position:absolute;width:120px;height:116px;right:22px;bottom:24px;margin:0;border-radius:17px}
 .auth-art img {object-fit:cover}.auth-panel-wrap {padding-top:18px}
}
@media(max-width:760px) {
 html {scroll-padding-top:16px}
 body {margin:0}.main-content {margin-left:0;width:100%;padding:18px 14px calc(104px + env(safe-area-inset-bottom));min-width:0}
 .page-section,.page-section>* {min-width:0;max-width:100%}
 button,input,select,textarea {touch-action:manipulation}
 input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea {font-size:16px!important;max-width:100%;min-width:0}
 input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select {min-height:48px}
 input[type=checkbox],input[type=radio] {width:22px;min-height:22px;flex:none}
 button,.small-btn,.filter-chip,.forgot-password-btn {min-height:44px}
 .hidden {display:none!important}
 .topbar {display:flex;align-items:stretch;padding:0 0 18px;gap:14px}
 .topbar h1 {font-size:25px}.topbar p {font-size:12px;line-height:1.5}
 .top-actions {display:grid!important;grid-template-columns:44px 44px minmax(0,1fr)!important;gap:8px;width:100%;padding:0}
 .top-actions .cloud-save-status {grid-column:1/-1;grid-row:1;justify-self:start;font-size:10px;max-width:100%}
 .top-actions .global-search-wrap {grid-column:1/-1;grid-row:2;width:100%}
 .top-actions .notification-center {grid-column:1;grid-row:3;position:static}
 .top-actions #helpBtn {grid-column:2;grid-row:3;width:44px}
 .top-actions>.secondary-btn {display:none}
 .top-actions>.primary-btn {grid-column:3;grid-row:3;width:100%;min-height:44px}
 .top-actions .notification-btn {width:44px;height:44px;min-width:0}
 .global-search-wrap input {width:100%!important;min-width:0;padding-left:38px}
 .global-search-results {position:absolute;inset:calc(100% + 8px) 0 auto;max-height:45dvh;width:100%;z-index:65}
 .notification-panel {position:fixed;top:20px;left:12px;right:12px;width:auto;max-width:none;max-height:75dvh;overflow:auto;z-index:90}
 .demo-strip {display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:12px 14px}
 .demo-strip>div {min-width:0}.demo-strip strong {font-size:12px}.demo-strip span {font-size:11px;line-height:1.5;overflow-wrap:anywhere}
 .hero-banner {display:flex;flex-direction:column;align-items:stretch;padding:22px;gap:18px}
 .hero-banner>div:first-child {max-width:none;width:100%}.hero-banner h2 {font-size:28px;line-height:1.2}
 .hero-banner .hero-actions {display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .hero-actions button {white-space:normal;font-size:12px}.hero-actions button:first-child {grid-column:1/-1}
 .hero-banner .illuminated-cover {display:block;width:100%;max-width:420px;height:auto;flex:none;align-self:center}
 .illuminated-cover .glow-art {aspect-ratio:2.3/1}.illuminated-cover img {object-position:center 55%}
 .illuminated-cover .capacity-badge {margin:-12px 24px 0}
 .quick-action-grid>button {grid-template-columns:36px minmax(0,1fr);gap:9px;padding:13px;min-height:80px}
 .quick-action-grid>button>span {width:36px;height:38px}.quick-action-grid strong {font-size:12px;line-height:1.4}.quick-action-grid small {font-size:10px;line-height:1.4}.quick-action-grid b {display:none}
 .stat-card {padding:17px;min-width:0}.stat-card strong {font-size:clamp(22px,6vw,29px);overflow-wrap:anywhere}.stat-card small {font-size:11px;line-height:1.5}.stat-card>span {font-size:12px}
 .panel-card,.message-panel {padding:18px}.panel-head,.message-panel-head {flex-wrap:wrap;align-items:flex-start;gap:12px}
 .panel-head h3,.message-panel h3 {font-size:16px}.panel-head p {line-height:1.6}.panel-head .small-btn {font-size:12px}
 .page-section>.section-head,#perfiles .section-head,#cuentas .section-head {display:grid;grid-template-columns:minmax(0,1fr) 78px;padding:18px;gap:12px;align-items:center}
 .section-head>div:first-child {grid-column:1;grid-row:1}.section-head>button {grid-column:1/-1;grid-row:2;width:100%;white-space:normal}
 .section-head .section-art {grid-column:2;grid-row:1;width:78px;height:78px;order:0}
 .page-section>.section-head h2 {font-size:23px}.section-head p {font-size:12px;line-height:1.6;margin-bottom:0}
 .profile-quick-filters,#perfiles .profile-quick-filters {display:flex;flex-wrap:nowrap;overflow:auto!important;gap:8px;padding:10px;scrollbar-width:thin}
 .profile-quick-filters button {flex:none;font-size:12px}
 .profile-filter-bar,#perfiles .profile-filter-bar {display:grid;grid-template-columns:1fr!important;padding:12px;gap:9px}
 .profile-filter-banner {flex-direction:column;align-items:stretch;overflow-wrap:anywhere;font-size:13px}
 /* Real labeled records instead of a desktop table wider than the phone. */
 .table-card:has(.responsive-table),#perfiles .table-card:has(.responsive-table) {overflow:visible!important;border:0;background:transparent;box-shadow:none}
 .table-card:has(.responsive-table):after {display:none!important;content:none!important}
 .table-card table.responsive-table {display:block;width:100%;min-width:0!important;table-layout:fixed;border-spacing:0}
 .responsive-table thead {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
 .responsive-table tbody {display:grid;gap:14px;width:100%}
 .responsive-table tbody tr {display:block;width:100%;border:1px solid var(--line);border-radius:16px;padding:6px 16px;background:var(--card);box-shadow:var(--shadow);overflow:hidden}
 .table-card .responsive-table td,.table-card .responsive-table .luminous-profile-row td {display:block;position:relative;width:100%;max-width:none;min-width:0;padding:11px 0 11px 37%;border:0;border-bottom:1px solid var(--line);font-size:13px;line-height:1.6;white-space:normal;overflow-wrap:anywhere;text-align:left;background:transparent;box-shadow:none}
 .responsive-table td:before {content:attr(data-label);position:absolute;left:0;top:13px;width:33%;font-size:10px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--muted);line-height:1.5}
 .table-card .responsive-table td:last-child {border-bottom:0}
 .table-card .responsive-table td.actions-cell {padding-left:0;padding-top:12px}.responsive-table td.actions-cell:before {position:static;display:block;width:auto;margin-bottom:9px}
 .table-card .responsive-table td.empty-cell {padding:25px 8px;text-align:center;color:var(--muted)}.responsive-table td.empty-cell:before {display:none}
 .responsive-table .table-platform {min-width:0;align-items:flex-start}.responsive-table .table-platform strong {min-width:0;overflow-wrap:anywhere}
 .responsive-table .client-actions,.responsive-table .permission-actions {display:flex;flex-wrap:wrap;gap:8px}
 .responsive-table .client-actions button,.responsive-table .permission-actions button {flex:1 1 90px;width:auto;font-size:12px;padding:10px;white-space:normal}
 .responsive-table .permission-user {align-items:flex-start;gap:8px}.permission-user>div {min-width:0}.permission-user>span {flex:none}
 .account-card-head {flex-wrap:wrap;align-items:flex-start}.account-card-head>div {flex:1;min-width:0}.account-capacity {margin-left:0;white-space:normal}
 .account-finance {flex-wrap:wrap;font-size:13px}.account-actions {display:flex;flex-wrap:wrap;gap:8px}.account-actions button {flex:1 1 110px;white-space:normal}
 .inventory-head,.inventory-account-head {flex-wrap:wrap;gap:12px}.inventory-group {border-radius:16px}.inventory-body {padding:12px}.inventory-account {padding:14px}
 .account-identity {min-width:0;max-width:100%}.account-identity strong {font-size:13px}.availability {white-space:normal}.inventory-title h3 {font-size:21px}
 .space-slot {min-height:130px}.platform-card {min-width:0}.platform-card h3 {overflow-wrap:anywhere}
 .renewal-stats {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.renewal-stat {padding:16px}.renewal-stat span {font-size:12px}.renewal-stat strong {font-size:25px}
 .renewal-calendar {overflow:visible!important;padding:0;min-width:0}.calendar-toolbar {position:static;width:100%;display:flex;flex-direction:column;padding:18px;gap:14px}
 .calendar-toolbar>div:last-child {display:flex;width:100%;justify-content:space-between;gap:8px}.calendar-toolbar>div:last-child strong {min-width:0;font-size:14px;color:var(--text)}
 .calendar-toolbar .small-btn {min-width:44px;font-size:23px}.calendar-scroll-hint {display:block;margin:8px 18px;font-size:11px;color:var(--muted);line-height:1.6}
 .calendar-scroll {max-width:100%;border-block:1px solid var(--line);border-radius:0}.calendar-scroll .month-calendar {min-width:560px;margin:0;border-top:0}
 .calendar-day {min-height:100px}.calendar-day button {min-height:44px}.calendar-day button b {font-size:10px}.calendar-day button small {font-size:9px}
 .renewal-list-heading {padding:18px 18px 0}.renewal-list {width:100%}.renewal-person {align-items:flex-start}.renewal-person h3 {font-size:16px;overflow-wrap:anywhere}.renewal-person>div {flex:1}
 .renewal-item {gap:12px}.renewal-actions {display:flex;flex-wrap:wrap}.renewal-actions button {flex:1 1 110px;width:auto}
 .message-hero {padding:22px 110px 22px 20px;min-height:150px}.message-hero h2 {font-size:23px}.message-hero p {font-size:12px;line-height:1.6}.message-hero .section-art {width:76px;height:90px;right:18px;top:24px}
 .message-contact {padding:14px;gap:14px}.message-contact label {align-items:center;font-size:14px;gap:10px}.message-contact small {font-size:12px}
 .contact-buttons {display:grid;grid-template-columns:1fr 1fr;gap:8px}.contact-buttons button {font-size:12px}.message-actions {gap:10px}.template-vars span {font-size:11px;overflow-wrap:anywhere}.message-panel textarea {line-height:1.6}
 .permissions-hero {display:grid;grid-template-columns:minmax(0,1fr) 78px;gap:14px;padding:20px}.permissions-hero .rk-seal {display:none}.permissions-hero>div:not(.rk-seal) {grid-column:1;grid-row:1}.permissions-hero .section-art {width:78px;height:90px;grid-column:2;grid-row:1}.permissions-hero h2 {font-size:23px}.permissions-hero p {font-size:12px;line-height:1.6}.permissions-hero .admin-access-btn {grid-column:1/-1;margin:0;font-size:13px}
 .data-actions {gap:12px}.data-actions button {font-size:13px}.trash-list article,.activity-list article {display:flex;flex-wrap:wrap;gap:10px}.trash-list article>div,.activity-list article>div {flex:1 1 180px}.trash-list article>button {width:100%;font-size:13px}.activity-list article>small {width:100%}
 .modal-backdrop {height:100dvh;padding:env(safe-area-inset-top) 0 0;align-items:stretch}
 .modal {width:100%;max-width:100%;height:100%;max-height:100%;border-radius:18px 18px 0 0;padding:18px 18px calc(20px + env(safe-area-inset-bottom));overflow:auto;scroll-padding:60px 0 120px}
 .modal h2 {font-size:25px;overflow-wrap:anywhere;padding-right:10px}.modal form {min-width:0;gap:14px}.modal .form-field {min-width:0}.modal label {font-size:12px;line-height:1.6}
 .modal .modal-actions {position:static;display:grid;grid-template-columns:1fr!important;margin:20px 0 0;padding:14px 0 0;background:var(--card);box-shadow:none;gap:10px}
 .modal .modal-actions button {min-height:48px}.modal .modal-close-x {width:44px;height:44px;top:0;background:var(--card);color:var(--text);border:1px solid var(--line)}
 .profile-modal-head,.client-history-head {flex-wrap:wrap}.client-history-head>div {min-width:0}.client-history-head h2,.client-history-head p {overflow-wrap:anywhere}.client-history-summary {grid-template-columns:1fr}.client-history-item {flex-wrap:wrap}.client-history-item>div {min-width:0;overflow-wrap:anywhere}
 .payment-balance,.payment-history-item {min-width:0}.payment-history-item {flex-wrap:wrap}.receipt-modal {min-width:0!important}.receipt-card {max-width:100%;min-width:0;overflow-wrap:anywhere}
 .tutorial-overlay {padding:16px;z-index:270}.tutorial-card {max-height:calc(100dvh - 32px);overflow:auto;width:100%;padding:22px}.tutorial-actions {display:flex;flex-wrap:wrap;gap:12px}.tutorial-actions>div {display:flex;gap:8px;flex:1}.tutorial-actions button {flex:1;white-space:normal;font-size:12px}
 .sidebar {padding:20px 14px calc(16px + env(safe-area-inset-bottom));width:min(320px,90vw)}.sidebar-brand {padding-right:34px}.sidebar nav {overflow:auto;overscroll-behavior:contain}.nav-item {min-height:46px;font-size:14px}.sidebar-bottom .secondary-btn {min-height:44px;font-size:13px}
 body:has(.sidebar.mobile-open) {overflow:hidden}
 .mobile-bottom-nav {left:0;right:0;bottom:0;width:100%;border-radius:18px 18px 0 0;padding:8px 8px calc(8px + env(safe-area-inset-bottom));z-index:80}
 .mobile-bottom-nav button {min-height:52px;min-width:0}.mobile-bottom-nav button small {font-size:10px!important}.mobile-bottom-nav button span {font-size:21px}
 .support-whatsapp {bottom:calc(91px + env(safe-area-inset-bottom));right:14px;width:44px;height:44px}.auth-page .support-whatsapp {bottom:calc(16px + env(safe-area-inset-bottom))}
 .auth-card {padding:24px 20px}.auth-card-heading {gap:9px}.auth-card-heading strong {font-size:13px}.auth-card-heading small {font-size:10px}.auth-mini-logo {flex:none}.secure-pill {font-size:8px;white-space:nowrap;padding:6px}
 .auth-tabs .tab {font-size:13px}.auth-card h1 {font-size:27px}.auth-card label {font-size:11px}.auth-card .primary-btn {font-size:14px}.auth-note {padding:13px}.auth-note p {font-size:11px;line-height:1.5}
 .dark-mode .table-card .responsive-table td {background:transparent;color:var(--text)}
 .dark-mode .calendar-day,.dark-mode .calendar-weekday {border-color:var(--line)}
}
@media(max-width:359px) {
 .auth-brand {padding:20px}.auth-brand .hero-copy {padding-right:105px}.auth-brand .hero-copy h1 {font-size:27px}.auth-brand .auth-art {width:100px;height:100px;right:18px;bottom:22px}
 .quick-action-grid,.stats-grid {grid-template-columns:1fr!important}.stat-card {min-height:105px}.main-content {padding-inline:10px}.hero-banner {padding:18px}
 .auth-card-heading .secure-pill {display:none!important}.mobile-bottom-nav button small {font-size:9px!important}
}
@media(prefers-reduced-motion:reduce) {.glow-art {animation:none;transition:none}}
@media(max-width:900px) {
 .auth-panel-wrap {order:0;min-height:0}
 .auth-brand .hero-copy {margin-top:18px!important}
}
@media(max-width:760px) {
 .demo-strip {flex-direction:row;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px}
 .demo-strip>div>span {display:none}.demo-strip>span {max-width:65%;font-size:10px}
 .hero-banner .illuminated-cover {order:-1}.illuminated-cover .glow-art {aspect-ratio:2.5/1}
 .modal form,.modal .profile-form {grid-template-columns:minmax(0,1fr)!important}
 .modal form>* {min-width:0;max-width:100%;overflow-wrap:anywhere}
 .profile-account-notice {font-size:13px;line-height:1.6}
 .mini-card h3,.mini-card p {overflow-wrap:anywhere}
 .auth-card label {margin-top:15px}.auth-card .primary-btn {margin-top:20px}.auth-tabs {margin-bottom:20px}
}
.illuminated-cover .capacity-badge {width:calc(100% - 36px)}
@media(max-width:900px) {.auth-brand .hero-copy h1 span {display:block}}
@media(max-width:760px) {
 .illuminated-cover .capacity-badge {width:calc(100% - 48px)}
 .responsive-table .client-actions,.responsive-table .permission-actions {flex-direction:row}
 .table-card .responsive-table .luminous-profile-row td:first-child:before {content:attr(data-label);left:0;top:13px;bottom:auto;width:33%;background:none;filter:none;opacity:1}
}
.dark-mode .filter-chip {color:var(--muted)}
.dark-mode .filter-chip.active {color:#f2eaff}
.dark-mode .cloud-save-status.saved {color:#85e7ae;border-color:#35674b;background:#193329}
.dark-mode .demo-strip>span {color:#d1b4fc;background:var(--soft)}
