/* Fluxa UI 2.0 · shared product experience */
:root{
  color-scheme:light;
  --blue:#4c6fff;--blue-dark:#3454d1;--purple:#7567e8;--cyan:#33c6c1;
  --green:#14a38f;--green-dark:#0c7e70;--yellow:#e8b849;--yellow-dark:#a96b0b;
  --red:#dd5d62;--ink:#102a43;--muted:#687b8e;--line:#dfe8ee;
  --bg:#f4f7fa;--card-bg:#fff;--soft-bg:#edf4f5;
  --grad:linear-gradient(135deg,#0e9f91 0%,#28bda7 68%,#80cf9b 135%);
  --brand-grad:linear-gradient(135deg,#12a99a 0%,#3f82d9 105%);
  --side-from:#f8fbfc;--side-to:#f2f7f8;--side-text:#52697c;
  --side-active-from:#e2f7f2;--side-active-to:#eaf2ff;
  --font-display:'Manrope','DM Sans',sans-serif;--font-body:'DM Sans',sans-serif;
  --shadow-xs:0 1px 2px rgba(16,42,67,.04);
  --shadow-sm:0 8px 24px rgba(16,42,67,.07);
  --shadow-md:0 18px 48px rgba(16,42,67,.12);
  --radius-sm:10px;--radius:16px;--radius-lg:24px;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{font-family:var(--font-body);background:var(--bg);color:var(--ink);letter-spacing:-.01em}
body:before{content:'';position:fixed;z-index:-1;inset:0;background:radial-gradient(620px 420px at 10% -8%,rgba(64,196,178,.14),transparent 70%),radial-gradient(700px 420px at 95% 0,rgba(76,111,255,.08),transparent 72%);pointer-events:none}

/* Brand */
.logo{font-family:var(--font-display);font-size:20px;font-weight:800;letter-spacing:-.055em;color:var(--ink);gap:10px}
.logo .mark{display:grid;place-items:center;position:relative;width:38px;height:38px;border-radius:12px;background:var(--brand-grad);box-shadow:0 10px 22px -10px rgba(14,159,145,.72);color:#fff;font-size:0;overflow:hidden}
.logo .mark svg{display:block;width:21px;height:21px}

/* Authentication */
.auth-screen{position:relative;isolation:isolate;background:linear-gradient(145deg,#f2f8f8 0%,#f7f9fc 52%,#eef4fb 100%)!important;overflow:hidden}
.auth-screen:before,.auth-screen:after{content:'';position:absolute;z-index:-1;border-radius:50%;filter:blur(2px);pointer-events:none}
.auth-screen:before{width:620px;height:620px;left:-310px;top:-300px;background:radial-gradient(circle,rgba(44,194,173,.18),transparent 68%)}
.auth-screen:after{width:580px;height:580px;right:-260px;bottom:-330px;background:radial-gradient(circle,rgba(76,111,255,.14),transparent 68%)}
.auth-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(390px,.8fr);width:min(1060px,100%);min-height:630px;background:rgba(255,255,255,.84);border:1px solid rgba(213,227,233,.95);border-radius:28px;overflow:hidden;box-shadow:0 30px 90px -42px rgba(16,42,67,.36),0 2px 10px rgba(16,42,67,.04);backdrop-filter:blur(18px)}
.auth-intro{position:relative;display:flex;flex-direction:column;padding:54px 58px;background:linear-gradient(145deg,#0f6072 0%,#108f87 56%,#2abfa6 125%);color:#fff;overflow:hidden}
.auth-intro:before{content:'';position:absolute;width:440px;height:440px;right:-230px;top:-210px;border:1px solid rgba(255,255,255,.2);border-radius:50%;box-shadow:0 0 0 48px rgba(255,255,255,.04),0 0 0 98px rgba(255,255,255,.035)}
.auth-intro:after{content:'';position:absolute;inset:auto 0 0;height:46%;background:linear-gradient(180deg,transparent,rgba(5,71,80,.18));pointer-events:none}
.auth-intro>*{position:relative;z-index:1}
.auth-intro-logo{color:#fff;margin-bottom:auto}.auth-intro-logo .mark{background:#fff;color:#0c8d83;box-shadow:0 10px 26px rgba(4,68,72,.22)}
.auth-eyebrow{display:inline-flex;align-items:center;gap:9px;width:max-content;margin:54px 0 14px;padding:7px 10px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(255,255,255,.1);font:700 10px/1 var(--font-display);letter-spacing:.14em;color:#e3fffa}
.auth-intro h1{margin:0 0 16px;font-size:42px;line-height:1.08;letter-spacing:-.06em;color:#fff}
.auth-intro>p{max-width:500px;margin:0 0 28px;color:#d5f2ef;font-size:15.5px;line-height:1.65}
.auth-benefits{display:grid;gap:4px;margin-top:3px}
.auth-benefits>div{display:flex;align-items:center;gap:13px;padding:11px 0;border-top:1px solid rgba(255,255,255,.12)}
.auth-benefits>div>span{display:grid;place-items:center;width:33px;height:33px;border-radius:10px;background:rgba(255,255,255,.11);color:#d8fbf5;font:700 10px var(--font-display);letter-spacing:.05em}
.auth-benefits p{display:grid;gap:2px;margin:0}.auth-benefits b{font-size:13px;color:#fff}.auth-benefits small{font-size:11.5px;color:#c3e6e3}
.auth-trust{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:30px;color:#d0ecea;font-size:11.5px}.auth-trust span{width:8px;height:8px;border-radius:50%;background:#c8f56f;box-shadow:0 0 0 5px rgba(200,245,111,.14)}
.auth-card{display:flex;flex-direction:column;justify-content:center;width:100%!important;margin:0!important;padding:52px 50px!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:rgba(255,255,255,.96)!important}
.auth-card-brand{display:none;margin-bottom:26px}
.auth-kicker{margin-bottom:11px;color:#0d9185;font:700 10px/1 var(--font-display);letter-spacing:.14em}
.auth-card h2{margin:0 0 8px!important;text-align:left!important;font-size:28px;line-height:1.15;color:var(--ink)}
.auth-subtitle{margin:0 0 26px!important;text-align:left!important;font-size:13px!important;line-height:1.55}
.auth-divider{display:flex;align-items:center;gap:12px;margin:20px 0;color:#8695a4;font-size:11.5px}.auth-divider:before,.auth-divider:after{content:'';height:1px;flex:1;background:#e3ebef}.auth-divider span{white-space:nowrap}
.auth-switch{margin:18px 0 0;text-align:center;font-size:12.5px}.auth-switch a{color:#0c9185!important}
.auth-recovery{display:flex;justify-content:flex-end;margin-top:9px}.auth-recovery button{padding:2px 0;background:transparent;border:0;color:#4665cb;font-size:12px;font-weight:700;cursor:pointer}.auth-recovery button:hover{text-decoration:underline;color:#304fb4}.auth-recovery button:focus-visible{outline:3px solid rgba(76,111,255,.18);outline-offset:3px;border-radius:4px}.auth-recovery button:disabled{color:#8996a2;cursor:wait;text-decoration:none}
.auth-card #authError{padding:10px 12px;border-radius:10px;background:#fff2f1;border:1px solid #f3d1d1;line-height:1.45}.auth-card #authError.auth-success{color:#0b7656!important;background:#eaf8f1;border-color:#c5ead7}
.auth-card .field label{font-size:11.5px}.auth-card .field input{min-height:48px;background:#fbfcfd}
.auth-card #passwordToggleBtn{color:#637a8e!important}.auth-card #passwordToggleBtn:hover{background:#eef4f6!important;color:#0e8f84!important}
#googleAuthBtn{min-height:50px;background:linear-gradient(135deg,#345bd2,#6650c8)!important;color:#fff!important;border:1.5px solid #7890ef!important;box-shadow:0 10px 24px -12px rgba(76,91,207,.8)!important;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease!important}
#googleAuthBtn:hover:not(:disabled){background:linear-gradient(135deg,#4069df,#735ed7)!important;border-color:#9aabf5!important;box-shadow:0 14px 30px -13px rgba(76,91,207,.8)!important;transform:translateY(-1px)}
#googleAuthBtn:active:not(:disabled){transform:translateY(0)}
#googleAuthBtn:focus-visible{outline:3px solid rgba(76,111,255,.2);outline-offset:3px}
#googleAuthBtn:disabled{background:#edf1f4!important;color:#8996a2!important;border-color:#dce4e8!important;box-shadow:none!important;cursor:wait;opacity:1}
.auth-card #authSubmitBtn{min-height:49px;margin-top:18px!important}
.state-screen{padding:24px!important}.state-card{padding:38px!important;border-radius:var(--radius-lg)!important;box-shadow:var(--shadow-md)!important}.state-brand{justify-content:center;margin-bottom:24px;color:var(--ink)}

/* App shell */
#appRoot>header{height:72px;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-bottom:1px solid #dfe8ed;color:var(--ink);padding:0 30px;box-shadow:0 2px 14px rgba(16,42,67,.025)}
.layout{min-height:calc(100vh - 72px);background:transparent}
aside{width:254px;padding:22px 14px 18px;background:linear-gradient(180deg,var(--side-from),var(--side-to));border-right:1px solid #dfe8ed;box-shadow:none}
aside .logo{padding:3px 11px 24px;margin-bottom:13px;border-bottom:1px solid #e0e9ed;color:var(--ink)}
nav{padding:0 3px}nav:before{content:'NAVEGACIÓN';display:block;margin:0 12px 10px;font:700 9px/1 var(--font-display);letter-spacing:.16em;color:#8c9aa7}
nav button{position:relative;gap:10px;padding:9px 10px;margin:3px 0;border-radius:11px;color:var(--side-text);font-family:var(--font-body);font-size:13px;font-weight:600;letter-spacing:0}
nav button:hover{background:#eaf2f4;color:#183b50}
nav button.active{background:linear-gradient(105deg,var(--side-active-from),var(--side-active-to));color:#0c706b;box-shadow:inset 0 0 0 1px rgba(31,174,158,.13)}
nav button.active:after{content:'';position:absolute;width:3px;height:18px;left:-7px;border-radius:0 4px 4px 0;background:#16a596}
.nav-icon{display:grid;place-items:center;width:28px;height:28px;flex:0 0 28px;border-radius:8px;background:#e7eef2;color:#587084;font:700 14px/1 var(--font-display);transition:background .15s,color .15s}
nav button:hover .nav-icon{background:#dbe9ec;color:#136f6a}nav button.active .nav-icon{background:#fff;color:#0a8f83;box-shadow:0 4px 10px rgba(16,42,67,.06)}
.hamburger{border:1px solid var(--line);border-radius:10px;background:#fff;padding:8px 9px}.hamburger span{background:var(--ink)}
.headerRight{gap:14px}.headerRight .muted{font-size:11.5px}.headerRight .close{background:#f4f7f8;border:1px solid var(--line);color:#375266;font-size:11.5px;padding:8px 12px}

/* Product surfaces */
main{padding:32px 36px 48px;max-width:1680px;background:transparent}
h1,h2,h3{font-family:var(--font-display);color:var(--ink);letter-spacing:-.045em}h1{font-size:29px;line-height:1.14}h2{font-size:22px}h3{font-size:16px}.muted{color:var(--muted);font-size:13px;line-height:1.5}
main>h1{margin:0 0 5px!important}main>h1+p.muted{max-width:760px;margin:0 0 25px!important}
.toolbar{gap:10px;margin:0 0 17px}.search,.field input,.field select{border:1px solid #d8e3e9;border-radius:11px;background:#fff;color:var(--ink);font-family:var(--font-body);font-size:13.5px;box-shadow:var(--shadow-xs)}
.search{padding:12px 14px}.search:focus,.field input:focus,.field select:focus{border-color:#1aa596;box-shadow:0 0 0 4px rgba(26,165,150,.13)}.field label{font-family:var(--font-display);font-size:11px;letter-spacing:.02em;color:#536b7d}
button{font-family:var(--font-body)}button.primary,button.ok,button.danger,.close{border-radius:10px;transition:transform .14s ease,box-shadow .14s ease,background .14s ease}
button.primary{background:var(--brand-grad);padding:11px 16px;box-shadow:0 9px 20px -12px rgba(14,131,149,.8)}button.primary:hover{box-shadow:0 13px 26px -12px rgba(14,131,149,.75)}
button.ok{background:#e1f6ed;color:#0d7d57;box-shadow:none;border:1px solid #bce8d3}button.ok:hover{background:#159d71;color:#fff;border-color:#159d71}
button.danger{background:#fff7f6;color:#c84f54;border-color:#f0c8c9}.close{background:#f1f5f7;color:#476174}
button.iconbtn{color:#4e6b7e}.iconbtn:hover{background:#e7f1f1}
.card{background:rgba(255,255,255,.97);border:1px solid #dfe8ed;border-radius:var(--radius);padding:21px;margin-bottom:18px;box-shadow:var(--shadow-sm)}
.stats{gap:14px;margin-bottom:20px}.stat{position:relative;overflow:hidden;border:1px solid #dfe8ed;background:linear-gradient(125deg,#fff 0%,#f2fbf9 100%);min-height:106px}.stat:after{content:'';position:absolute;width:78px;height:78px;right:-26px;top:-30px;border-radius:50%;background:rgba(51,198,193,.13)}.stat.g{border-color:#cbe7d8;background:linear-gradient(125deg,#fff 0%,#f1faf5 100%)}.stat.y{border-color:#efdfa9;background:linear-gradient(125deg,#fff 0%,#fff9e9 100%)}.stat b{font-family:var(--font-display);font-size:26px;color:var(--ink)}.stat small{display:block;margin-top:7px;color:#718394;font-size:11px}
.tablewrap{border:1px solid #dce6eb;border-radius:14px;background:#fff;box-shadow:var(--shadow-sm)}table{background:#fff}th,td{border-color:#e8eff2;padding:13px 14px;font-size:13px}th{background:#f7f9fa;color:#6f8292;font-family:var(--font-display);font-size:10px;letter-spacing:.08em}tbody tr:hover td{background:#f2f8f7}td.money{font-family:var(--font-display);font-weight:600;color:#263f53}.badge{background:#e4f3f1;color:#137a70;border:1px solid #c8e7e2;font-family:var(--font-display);font-size:10px}.badge.g{background:#e8f6ed;color:#1e7e50}.badge.y{background:#fff4d8;color:#9f670b}.badge.r{background:#ffeded;color:#b94b4f}
.rowmenu{background:#fff;border-color:#dde7eb;box-shadow:0 18px 48px -18px rgba(16,42,67,.25)}.rowmenu button{color:var(--ink)}.rowmenu button:hover{background:#eef6f5}
.modal{background:rgba(16,42,67,.35);backdrop-filter:blur(5px)}.modalbox{background:#fff;border:1px solid #e0e9ed;border-radius:var(--radius-lg);box-shadow:0 30px 90px rgba(16,42,67,.24);color:var(--ink)}

/* Dashboard */
.fluxa-dashboard-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 22px;padding:30px 31px;border-radius:var(--radius-lg);color:#fff;background:linear-gradient(112deg,#0d6874 0%,#118c87 56%,#27b99f 135%);box-shadow:0 20px 48px -28px rgba(11,102,116,.75);overflow:hidden;position:relative}
.fluxa-dashboard-hero:before{content:'';position:absolute;width:330px;height:330px;right:-140px;top:-190px;border:40px solid rgba(214,248,125,.18);border-radius:50%;box-shadow:0 0 0 50px rgba(255,255,255,.035)}.fluxa-dashboard-hero>*{position:relative;z-index:1}.fluxa-dashboard-hero h1{font-size:31px;color:#fff;margin:6px 0}.fluxa-dashboard-hero p{margin:0;color:#d6efed;font-size:14px}.fluxa-kicker{display:block;font:700 10px/1 var(--font-display);letter-spacing:.14em;color:#bff8ed}.fluxa-hero-actions{display:flex;gap:10px;flex-wrap:wrap}.fluxa-hero-actions button{min-width:128px}.fluxa-hero-actions .ok{background:#dcf77f;border-color:#dcf77f;color:#17404a}.fluxa-hero-actions .primary{background:#fff;color:#0b766f;box-shadow:none}
.fluxa-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.85fr);gap:18px}.fluxa-dashboard-grid .card{height:100%;margin:0}.fluxa-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}.fluxa-section-heading h3{margin:5px 0 0}.fluxa-section-heading .iconbtn{font-size:12px;padding:7px 8px;white-space:nowrap}.fluxa-attention-list{display:grid;gap:2px}.fluxa-attention-list>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #e8eff2}.fluxa-attention-list>div:last-child{border:0}.fluxa-attention-list span{display:grid;gap:3px;font-size:13px}.fluxa-attention-list small{color:var(--muted);font-size:11px}.fluxa-attention-list strong{font-family:var(--font-display);font-size:13px;color:#b85a42;text-align:right}.fluxa-attention-list em{display:block;color:#8594a1;font:400 10px var(--font-body)}.fluxa-empty-state{min-height:186px;display:flex;align-items:center;gap:13px;padding:16px;color:#31586a}.fluxa-empty-state>span{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:#e2f7ea;color:#218356;font-weight:800}.fluxa-empty-state b{font-family:var(--font-display);font-size:13px}.fluxa-empty-state p{margin:4px 0 0}

/* Responsive */
@media(max-width:980px){.auth-layout{grid-template-columns:.9fr minmax(380px,1fr)}.auth-intro{padding:46px 40px}.auth-intro h1{font-size:36px}.auth-benefits small{display:none}.fluxa-dashboard-grid{grid-template-columns:1fr}}
@media(max-width:760px){
  .auth-screen{padding:16px!important;align-items:flex-start!important;overflow:auto}.auth-layout{display:block;width:min(480px,100%);min-height:0;margin:auto}.auth-intro{padding:26px 25px 30px}.auth-intro-logo{margin:0}.auth-eyebrow{margin:32px 0 11px}.auth-intro h1{font-size:30px}.auth-intro>p{margin-bottom:0;font-size:14px}.auth-benefits,.auth-trust{display:none}.auth-card{padding:34px 25px 30px!important}.auth-card-brand{display:none}
  #appRoot>header{height:64px;padding:0 16px}.headerRight #syncStatus,.headerRight #dbstatus,.headerRight #authUserEmail{display:none}main{padding:24px 16px 40px}h1{font-size:25px}.card{padding:16px}.row{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}aside{width:278px;top:0}.tablewrap{border-radius:12px}.fluxa-dashboard-hero{padding:24px;align-items:flex-start;flex-direction:column}.fluxa-dashboard-hero h1{font-size:26px}.fluxa-dashboard-grid{grid-template-columns:1fr}.layout{min-height:calc(100vh - 64px)}
}
@media(max-width:460px){.auth-intro{padding:23px 21px 26px}.auth-intro h1{font-size:27px}.auth-card{padding:30px 21px 26px!important}.state-card{padding:26px 21px!important}.stats{grid-template-columns:1fr}.headerRight .close{padding:7px 9px}.toolbar .search{min-width:100%}button.primary,button.ok{width:100%}}