*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#04060f;--sidebar:#060912;--surface:#080d1a;--card:#0b1022;--card2:#0f1530;
  --border:#111c35;--border2:#162040;--cyan:#00d9ff;--cyan2:#00a8cc;
  --cyan-glow:rgba(0,217,255,0.12);--cyan-glow2:rgba(0,217,255,0.06);
  --text:#ffffff;--text2:#c8deff;--muted:#2a3a58;--muted2:#6080a8;
  --gold:#e8b84b;--gold-glow:rgba(232,184,75,0.15);
  --green:#00ff88;--green-glow:rgba(0,255,136,0.1);
  --red:#ff3d6a;--red-glow:rgba(255,61,106,0.1);
  --orange:#ff8c42;--purple:#a078ff;--sidebar-w:220px;
}
body{background:var(--bg);font-family:'Rajdhani',sans-serif;color:var(--text);height:100vh;overflow:hidden;font-size:16px;letter-spacing:0.02em;}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;background-image:linear-gradient(rgba(0,217,255,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,217,255,0.03) 1px,transparent 1px);background-size:40px 40px;}
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse 600px 400px at 30% 20%,rgba(0,217,255,0.04) 0%,transparent 70%),radial-gradient(ellipse 400px 300px at 80% 70%,rgba(160,120,255,0.04) 0%,transparent 70%);}
::-webkit-scrollbar{width:4px;height:4px}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse{0%,100%{opacity:0.3}50%{opacity:1}}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}

/* LIGHT THEME */
body.light-theme {
  --bg:#f5f5f7;--sidebar:#ffffff;--surface:#ffffff;--card:#ffffff;--card2:#f0f0f2;
  --border:rgba(0,0,0,0.1);--border2:rgba(0,0,0,0.18);
  --text:#1a1a1a;--text2:#333;
  --muted:rgba(0,0,0,0.35);--muted2:rgba(0,0,0,0.45);
  --cyan:#0077aa;--cyan-glow:rgba(0,119,170,0.06);
  --green:#00905a;--green-glow:rgba(0,144,90,0.06);
  --purple:#6030cc;--gold:#b07800;--red:#cc2200;--orange:#bb5500;
}
body.light-theme #topbar{background:rgba(255,255,255,0.95);border-bottom:1px solid rgba(0,0,0,0.1);}
body.light-theme #sidebar{border-right:1px solid rgba(0,0,0,0.1);}
body.light-theme .nav-item{color:rgba(0,0,0,0.45);}
body.light-theme .nav-item:hover{background:rgba(0,0,0,0.04);color:#111;}
body.light-theme .nav-item.active{color:#0077aa;border-left-color:#0077aa;background:rgba(0,119,170,0.06);}
body.light-theme .kpi-block{border-right-color:rgba(0,0,0,0.08);}
body.light-theme .kpi-num{color:#111 !important;}
body.light-theme .kpi-sub,.light-theme .kpi-label{color:rgba(0,0,0,0.5);}
body.light-theme .t-card,.light-theme .log-card,.light-theme .idea-card{background:#fff;border-color:rgba(0,0,0,0.1);}
body.light-theme .client-card{background:#fff !important;border-color:rgba(0,0,0,0.1) !important;}
body.light-theme .client-card .client-name{color:#111 !important;}
body.light-theme .client-card .client-sub{color:rgba(0,0,0,0.5) !important;}
body.light-theme input,.light-theme select,.light-theme textarea{background:#f0f0f2;border-color:rgba(0,0,0,0.15);color:#111;}
body.light-theme .modal{background:#fff;border-color:rgba(0,0,0,0.12);}
body.light-theme .overlay{background:rgba(0,0,0,0.5);}
body.light-theme .qf-btn{background:rgba(0,0,0,0.05);border-color:rgba(0,0,0,0.12);color:#333;}
body.light-theme .qf-btn.active{background:#0077aa;color:#fff;border-color:#0077aa;}
body.light-theme .btn{color:#333;border-color:rgba(0,0,0,0.15);}
body.light-theme .btn-cyan{background:#0077aa;color:#fff;border-color:#0077aa;}
body.light-theme .s-title{color:#111;}
body.light-theme .empty-state{color:rgba(0,0,0,0.35);}
/* Client cards light theme */
body.light-theme .client-card{background:linear-gradient(135deg,rgba(255,255,255,0.97),rgba(245,245,250,0.97)) !important;border-color:rgba(0,0,0,0.1) !important;}
/* Economia light theme - preserve colored numbers */
body.light-theme .eco-header{background:rgba(232,184,75,0.08) !important;border-color:rgba(232,184,75,0.2) !important;}
body.light-theme .fin-amount{color:var(--gold) !important;-webkit-text-fill-color:var(--gold) !important;}
body.light-theme .goal-pct{color:rgba(0,0,0,0.5) !important;}
body.light-theme .fin-meta-tag{color:rgba(0,0,0,0.5) !important;}
body.light-theme .eco-header .eco-amount{color:var(--gold) !important;}
body.light-theme .eco-header .eco-meta{color:rgba(0,0,0,0.5) !important;}
body.light-theme .eco-total-card{background:#fff !important;border-color:rgba(0,0,0,0.1) !important;}
/* Table in light theme */
body.light-theme table th{color:rgba(0,0,0,0.45) !important;border-color:rgba(0,0,0,0.08) !important;background:rgba(0,0,0,0.02);}
body.light-theme .eco-neto-num{color:#005588 !important;}
body.light-theme table td{color:#222 !important;border-color:rgba(0,0,0,0.06) !important;}
/* Colored numbers stay colored in light theme but slightly darker */

/* Client cards — light theme targeted fixes */
body.light-theme .cli-card{background:rgba(255,255,255,0.97) !important;border-color:rgba(0,0,0,0.1) !important;}
body.light-theme .cli-card .cli-name{color:#111 !important;}
body.light-theme .cli-card .cli-sub{color:rgba(0,0,0,0.45) !important;}
body.light-theme .cli-glow{opacity:0.12;}
body.light-theme .tag{opacity:0.85;}
/* LAYOUT */
#shell{display:flex;height:100vh;position:relative;z-index:1;overflow:hidden;width:100%}

/* SIDEBAR */
#sidebar{width:var(--sidebar-w);flex-shrink:0;background:var(--sidebar);border-right:1px solid var(--border);display:flex;flex-direction:column;height:100vh;overflow:hidden;position:relative;}
#sidebar::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);}
.sidebar-logo{padding:22px 20px 18px;border-bottom:1px solid var(--border);}
.sidebar-logo-text{font-family:'Sora',sans-serif;font-size:20px;font-weight:700;color:var(--text);letter-spacing:0.08em;}
.sidebar-logo-text span{color:var(--cyan);text-shadow:0 0 20px var(--cyan)}
.sidebar-logo-sub{font-size:11px;color:var(--muted2);letter-spacing:0.2em;text-transform:uppercase;margin-top:3px;font-family:'Rajdhani',sans-serif;font-weight:400;}
.sidebar-section{font-size:10px;color:var(--muted);letter-spacing:0.25em;text-transform:uppercase;padding:18px 20px 8px;font-weight:600;}
.nav-item{display:flex;align-items:center;gap:10px;padding:11px 20px;cursor:pointer;font-size:15px;font-weight:500;letter-spacing:0.06em;color:var(--muted2);transition:all 0.2s;border-left:2px solid transparent;text-transform:uppercase;position:relative;}
.nav-item:hover{color:var(--text);background:rgba(0,217,255,0.04)}
.nav-item.active{color:var(--cyan);border-left-color:var(--cyan);background:var(--cyan-glow);}
.nav-item.active::after{content:'';position:absolute;right:0;top:0;bottom:0;width:1px;background:var(--cyan);opacity:0.3;}
.nav-icon{font-size:16px;width:20px;text-align:center;opacity:0.8}
.nav-badge{margin-left:auto;background:var(--cyan);color:#04060f;font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;font-family:'Sora',sans-serif;min-width:20px;text-align:center;}
.nav-badge.red{background:var(--red);color:#fff}
.nav-badge.gold{background:var(--gold);color:#04060f}
.sidebar-bottom{margin-top:auto;padding:16px 20px;border-top:1px solid var(--border);}
.sys-status{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted2);letter-spacing:0.1em;text-transform:uppercase;}
.sys-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}

/* MAIN */
#main{flex:1;display:flex;flex-direction:column;height:100vh;overflow:hidden;min-width:0;}

/* TOP BAR */
#topbar{background:rgba(6,9,18,0.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:0 24px;height:54px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;z-index:10;}
.topbar-path{font-size:12px;color:var(--muted2);letter-spacing:0.15em;text-transform:uppercase;display:flex;align-items:center;gap:8px;}
.topbar-path span{color:var(--text);font-weight:600}
.topbar-sep{color:var(--muted);font-size:11px}
.topbar-date{font-size:12px;color:var(--muted2);letter-spacing:0.08em;text-transform:uppercase}
.topbar-actions{display:flex;gap:8px}

/* BUTTONS */
.btn{border:none;border-radius:4px;padding:8px 18px;font-size:11px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;cursor:pointer;font-family:'Rajdhani',sans-serif;transition:all 0.2s;}
.btn-cyan{background:transparent;color:var(--cyan);border:1px solid var(--cyan);box-shadow:0 0 12px var(--cyan-glow),inset 0 0 12px var(--cyan-glow2);}
.btn-cyan:hover{background:var(--cyan-glow);box-shadow:0 0 20px var(--cyan-glow)}
.btn-ghost{background:transparent;color:var(--muted2);border:1px solid var(--border);}
.btn-ghost:hover{color:var(--text2);border-color:var(--border2)}
.btn-sm{padding:6px 14px;font-size:10px;}
.btn-danger{background:var(--red-glow);color:var(--red);border:1px solid rgba(255,61,106,0.2)}
.btn-danger:hover{background:rgba(255,61,106,0.15)}

/* KPI */
.kpi-strip{display:grid;border-bottom:1px solid var(--border);flex-shrink:0;}
.kpi-strip.cols4{grid-template-columns:repeat(4,1fr)}
.kpi-strip.cols3{grid-template-columns:repeat(3,1fr)}
.kpi-strip.cols5{grid-template-columns:repeat(5,1fr)}
.kpi-block{padding:18px 22px;border-right:1px solid var(--border);position:relative;overflow:hidden;cursor:default;transition:background 0.2s;}
.kpi-block:last-child{border-right:none}
.kpi-block:hover{background:rgba(255,255,255,0.02)}
.kpi-block::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;}
.kpi-block.cyan::before{background:linear-gradient(90deg,transparent,var(--cyan),transparent);filter:drop-shadow(0 0 4px var(--cyan))}
.kpi-block.green::before{background:linear-gradient(90deg,transparent,var(--green),transparent)}
.kpi-block.red::before{background:linear-gradient(90deg,transparent,var(--red),transparent)}
.kpi-block.gold::before{background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.kpi-block.purple::before{background:linear-gradient(90deg,transparent,var(--purple),transparent)}
.kpi-block.orange::before{background:linear-gradient(90deg,transparent,var(--orange),transparent)}
.kpi-block.cyan{background:linear-gradient(180deg,rgba(0,217,255,0.05) 0%,var(--surface) 60%)}
.kpi-block.green{background:linear-gradient(180deg,rgba(0,255,136,0.05) 0%,var(--surface) 60%)}
.kpi-block.red{background:linear-gradient(180deg,rgba(255,61,106,0.05) 0%,var(--surface) 60%)}
.kpi-block.gold{background:linear-gradient(180deg,rgba(232,184,75,0.05) 0%,var(--surface) 60%)}
.kpi-block.purple{background:linear-gradient(180deg,rgba(160,120,255,0.05) 0%,var(--surface) 60%)}
.kpi-block.orange{background:linear-gradient(180deg,rgba(255,140,66,0.05) 0%,var(--surface) 60%)}
.kpi-label{font-family:'Montserrat',sans-serif;font-size:11px;color:rgba(255,255,255,0.8);text-transform:uppercase;letter-spacing:0.18em;font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:6px;}
.kpi-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.kpi-num{font-family:'Montserrat',sans-serif;font-size:50px;font-weight:800;line-height:1;letter-spacing:-0.04em;margin-bottom:6px;color:#ffffff;}
.kpi-num.dim{color:rgba(255,255,255,0.25)}
.kpi-sub{font-family:'Montserrat',sans-serif;font-size:12px;color:rgba(255,255,255,0.75);font-weight:500;letter-spacing:0.02em;}
.kpi-action{position:absolute;bottom:10px;right:12px;}

/* FINANCIAL BANNER */
.fin-bar{padding:16px 28px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:24px;background:linear-gradient(135deg,rgba(232,184,75,0.07) 0%,transparent 50%);position:relative;overflow:hidden;flex-shrink:0;}
.fin-bar::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,transparent,var(--gold),transparent);box-shadow:0 0 12px var(--gold);}
.fin-label{font-family:'Montserrat',sans-serif;font-size:10px;color:var(--gold);text-transform:uppercase;letter-spacing:0.25em;font-weight:700;margin-bottom:5px;}
.fin-amount{font-family:'Montserrat',sans-serif;font-size:36px;font-weight:800;color:var(--gold);letter-spacing:-0.04em;line-height:1;}
.fin-month{font-family:'Montserrat',sans-serif;font-size:12px;color:rgba(232,184,75,0.85);margin-top:4px;letter-spacing:0.06em;font-weight:500;}

/* CONTENT AREA - scrollable, fills remaining height */
#content{padding:24px;flex:1;overflow-y:auto;overflow-x:hidden;}

/* SECTION HEADER */
.s-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.s-title{font-size:12px;color:var(--cyan);text-transform:uppercase;letter-spacing:0.25em;font-weight:600;display:flex;align-items:center;gap:10px;font-family:'Rajdhani',sans-serif;}
.s-title::before{content:'';width:3px;height:16px;background:var(--cyan);border-radius:2px;box-shadow:0 0 8px var(--cyan)}
.s-line{flex:1;height:1px;background:linear-gradient(90deg,var(--border),transparent);margin-left:10px}

/* BULK SELECT */
.bulk-bar{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding:10px 14px;background:rgba(255,61,106,0.08);border:1px solid rgba(255,61,106,0.2);border-radius:6px;}
.bulk-count{font-size:13px;color:var(--red);font-weight:600;letter-spacing:0.05em;}
.cb-item{width:18px;height:18px;border-radius:3px;border:1px solid var(--muted);background:none;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--cyan);transition:all 0.2s;appearance:none;-webkit-appearance:none;}
.cb-item:checked{background:var(--cyan-glow);border-color:var(--cyan);}

/* TASK CARDS */
.t-card{background:var(--card);border:1px solid var(--border);border-radius:6px;padding:13px 16px;display:flex;align-items:flex-start;gap:12px;transition:all 0.2s;margin-bottom:7px;position:relative;overflow:hidden;}
.t-card:hover{border-color:var(--border2);background:var(--card2);box-shadow:0 4px 20px rgba(0,0,0,0.3)}
.t-card.selected{border-color:rgba(255,61,106,0.4);background:rgba(255,61,106,0.05);}
.check-btn{width:20px;height:20px;border-radius:4px;border:1px solid var(--muted);background:none;cursor:pointer;flex-shrink:0;margin-top:2px;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--green);transition:all 0.2s;}
.check-btn.done{border-color:var(--green);background:var(--green-glow);box-shadow:0 0 8px var(--green-glow)}
.check-btn:hover{border-color:var(--cyan);box-shadow:0 0 8px var(--cyan-glow)}

/* CLIENT CARD */
.cli-card{border-radius:10px;padding:14px 18px;display:flex;align-items:center;gap:14px;margin-bottom:10px;transition:all 0.25s;cursor:default;position:relative;overflow:hidden;border:1px solid;}
.cli-card:hover{transform:translateX(3px)}
.cli-glow{position:absolute;top:-30px;right:-30px;width:130px;height:130px;border-radius:50%;opacity:0.15;filter:blur(35px);pointer-events:none;}
.cli-icon-wrap{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:15px;}
.cli-name{font-family:'Montserrat',sans-serif;font-size:15px;font-weight:700;color:#fff;letter-spacing:0.01em;}
.cli-meta{font-family:'Rajdhani',sans-serif;font-size:12px;color:rgba(255,255,255,0.7);text-transform:uppercase;letter-spacing:0.15em;margin-top:2px;}
.cli-right{margin-left:auto;text-align:right;flex-shrink:0}
.cli-monto{font-family:'Montserrat',sans-serif;font-size:15px;font-weight:700;color:#ffffff;}
.cli-monto-label{font-family:'Rajdhani',sans-serif;font-size:11px;color:rgba(255,255,255,0.65);text-transform:uppercase;letter-spacing:0.12em;margin-top:2px;}

/* TAGS */
.tag{display:inline-flex;align-items:center;border-radius:3px;padding:3px 8px;font-size:11px;font-weight:700;white-space:nowrap;letter-spacing:0.1em;text-transform:uppercase;font-family:'Rajdhani',sans-serif;}

/* INPUTS */
input,select,textarea{background:var(--card2);border:1px solid var(--border);color:#ffffff;font-family:'Rajdhani',sans-serif;border-radius:4px;padding:9px 13px;font-size:15px;outline:none;width:100%;letter-spacing:0.04em;transition:border-color 0.2s,box-shadow 0.2s;}
input:focus,select:focus,textarea:focus{border-color:var(--cyan2);box-shadow:0 0 0 2px var(--cyan-glow);}
select option{background:var(--surface);color:#fff;}
textarea{resize:vertical;min-height:80px}
.field{margin-bottom:14px}
.field-label{font-size:11px;color:var(--cyan);text-transform:uppercase;letter-spacing:0.2em;margin-bottom:6px;font-weight:600;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}

/* MODAL */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,0.85);display:flex;align-items:center;justify-content:center;z-index:200;padding:16px;backdrop-filter:blur(12px);}
.modal{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:28px;width:100%;max-width:520px;max-height:90vh;overflow-y:auto;box-shadow:0 0 60px rgba(0,217,255,0.08),0 40px 80px rgba(0,0,0,0.6);animation:mIn 0.2s ease;position:relative;}
.modal::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);}
@keyframes mIn{from{opacity:0;transform:scale(0.97)}to{opacity:1;transform:scale(1)}}
.modal-title{font-size:17px;font-weight:600;margin-bottom:22px;display:flex;justify-content:space-between;align-items:center;letter-spacing:0.1em;text-transform:uppercase;color:var(--cyan);}
.close-btn{background:none;border:none;color:var(--muted2);font-size:20px;cursor:pointer;transition:color 0.15s;padding:0}
.close-btn:hover{color:var(--text)}
.color-dot{width:26px;height:26px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:all 0.15s}

/* TOAST */
.toast{position:fixed;bottom:24px;right:24px;background:var(--card);border:1px solid var(--cyan);color:var(--cyan);padding:11px 20px;border-radius:4px;font-size:11px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;z-index:999;opacity:0;transition:all 0.3s;pointer-events:none;box-shadow:0 0 20px var(--cyan-glow);}
.toast.show{opacity:1;transform:translateY(-4px)}

/* SPINNER */
.spinner{width:16px;height:16px;border:1px solid var(--border);border-top-color:var(--cyan);border-radius:50%;animation:spin 0.8s linear infinite;display:inline-block;vertical-align:middle;margin-right:8px}
@keyframes spin{to{transform:rotate(360deg)}}

/* MISC */
.empty-state{color:var(--muted2);font-size:15px;background:var(--card);border:1px solid var(--border);border-radius:6px;padding:32px;text-align:center;letter-spacing:0.06em}
.log-card{background:var(--card);border:1px solid var(--border);border-radius:6px;padding:18px;margin-bottom:8px;transition:border-color 0.2s;}
.log-card:hover{border-color:var(--border2)}
.log-card.selected{border-color:rgba(255,61,106,0.4);background:rgba(255,61,106,0.05);}
.idea-card{background:var(--card);border:1px solid var(--border);border-radius:6px;padding:16px;margin-bottom:8px;display:flex;justify-content:space-between;gap:12px;transition:border-color 0.2s;}
.idea-card:hover{border-color:var(--border2)}
.idea-card.selected{border-color:rgba(255,61,106,0.4);background:rgba(255,61,106,0.05);}

/* REELS HISTORY */
.reel-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border);}
.reel-row:last-child{border-bottom:none}
.reel-month{font-size:14px;color:var(--text2);letter-spacing:0.06em;font-weight:500;}
.reel-count{font-family:'Montserrat',sans-serif;font-size:22px;font-weight:800;color:var(--gold);}
/* GLOBAL SEARCH */
#search-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.88);z-index:500;display:flex;align-items:flex-start;justify-content:center;padding-top:80px;backdrop-filter:blur(16px);}
#search-box{width:100%;max-width:640px;background:var(--surface);border:1px solid var(--cyan);border-radius:10px;overflow:hidden;box-shadow:0 0 60px rgba(0,217,255,0.15),0 40px 80px rgba(0,0,0,0.6);}
#search-input{width:100%;background:transparent;border:none;padding:18px 22px;font-size:18px;color:#fff;font-family:'Rajdhani',sans-serif;letter-spacing:0.04em;outline:none;}
#search-input::placeholder{color:var(--muted2)}
#search-results{max-height:420px;overflow-y:auto;border-top:1px solid var(--border);}
.sr-item{padding:12px 22px;cursor:pointer;display:flex;align-items:flex-start;gap:12px;transition:background 0.15s;border-bottom:1px solid var(--border);}
.sr-item:last-child{border-bottom:none}
.sr-item:hover{background:var(--cyan-glow);}
.sr-type{font-size:9px;color:var(--muted2);text-transform:uppercase;letter-spacing:0.2em;font-weight:700;margin-top:2px;min-width:42px;font-family:'Montserrat',sans-serif;}
.sr-title{font-size:15px;font-weight:500;color:#fff;line-height:1.3;}
.sr-sub{font-size:12px;color:var(--muted2);margin-top:3px;}
.sr-empty{padding:28px 22px;text-align:center;color:var(--muted2);font-size:14px;}
.sr-hint{padding:10px 22px;font-size:11px;color:var(--muted);letter-spacing:0.1em;border-top:1px solid var(--border);display:flex;gap:16px;}
.sr-hint span{display:flex;align-items:center;gap:4px;}
mark{background:rgba(0,217,255,0.25);color:var(--cyan);border-radius:2px;padding:0 2px;}

/* INLINE EDIT */
.inline-edit{background:transparent;border:none;border-bottom:1px solid var(--cyan);color:#fff;font-family:'Rajdhani',sans-serif;font-size:15px;font-weight:500;letter-spacing:0.03em;outline:none;width:100%;padding:2px 0;}
.inline-edit:focus{border-bottom-color:var(--cyan);}

/* MONTHLY GOAL PROGRESS */
.goal-bar-wrap{margin-top:10px;background:rgba(255,255,255,0.06);border-radius:4px;height:5px;overflow:hidden;position:relative;}
.goal-bar-fill{height:100%;border-radius:4px;transition:width 0.8s ease;background:linear-gradient(90deg,var(--gold),#fff176);}
.goal-pct{font-size:11px;color:rgba(232,184,75,0.75);margin-top:5px;letter-spacing:0.06em;font-weight:500;}

/* QUICK FILTERS */
.qf-btn{padding:4px 12px;font-size:10px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--muted2);cursor:pointer;font-family:'Rajdhani',sans-serif;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;transition:all 0.15s;}
.qf-btn:hover,.qf-btn.active{border-color:var(--cyan);color:var(--cyan);background:var(--cyan-glow);}

/* PRIORITY LEFT BORDER WIDTH */
.t-card[data-prio="alta"]>div:first-child{width:3px!important;box-shadow:0 0 12px var(--red)!important}
.t-card[data-prio="media"]>div:first-child{width:2px!important}
.t-card[data-prio="baja"]>div:first-child{width:1px!important;opacity:0.5}

/* DUPLICATE BUTTON */
.btn-dup{color:var(--muted2)!important}
.btn-dup:hover{color:var(--cyan)!important}

/* DAYS AGO BADGE */
.days-ago{font-size:10px;color:var(--muted2);letter-spacing:0.05em;}

/* INICIO SECTIONS */
#inicio-sections { width:100%; }
.inicio-sec { position:relative; margin-bottom:4px; padding-top:8px; }
.sec-drag-btn {
  cursor:grab; color:var(--muted2); font-size:14px;
  padding:2px 4px; border-radius:3px;
  opacity:0.35; transition:opacity 0.15s;
  user-select:none; display:inline-flex; align-items:center;
  margin-right:6px; vertical-align:middle;
}
.sec-drag-btn:hover{opacity:0.8;}
.sec-drag-row{display:flex;align-items:center;margin-bottom:16px;}
.sec-drag-label{font-size:11px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted2);}
.sec-drag-btn:hover { color:var(--cyan); border-color:var(--border); }
.sec-drag-btn:active { cursor:grabbing; }
.inicio-sec:hover .sec-drag-btn { opacity:1; }
.sortable-ghost .sec-drag-btn { opacity:0; }

/* FULL SCREEN CONTENT */
#content { min-height:0; box-sizing:border-box; }
#main { overflow:hidden; }

/* DRAG & RESIZE */
.drag-handle {
  cursor:grab; color:var(--muted); font-size:16px; flex-shrink:0;
  padding:2px 4px; border-radius:3px; transition:color 0.15s;
  user-select:none; line-height:1;
}
.drag-handle:hover { color:var(--cyan); }
.drag-handle:active { cursor:grabbing; }
.resize-handle {
  position:absolute; bottom:0; left:0; right:0; height:6px;
  cursor:ns-resize; display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity 0.2s;
}
.resize-handle::after {
  content:''; width:32px; height:2px; background:var(--border2);
  border-radius:2px; transition:background 0.15s;
}
.t-card:hover .resize-handle,
.log-card:hover .resize-handle,
.idea-card:hover .resize-handle { opacity:1; }
.resize-handle:hover::after { background:var(--cyan); }
.sortable-ghost { opacity:0.3; background:var(--cyan-glow) !important; border-color:var(--cyan) !important; }
.sortable-drag { opacity:0.95; box-shadow:0 8px 32px rgba(0,0,0,0.5) !important; z-index:100; }

/* KPI draggable */
.kpi-block { cursor:default; }
.kpi-block.kpi-draggable { cursor:grab; }
.kpi-block.kpi-draggable:active { cursor:grabbing; }
.kpi-ghost { opacity:0.25 !important; }


/* ═══════════════════════════════════════════════
   MOBILE RESPONSIVE
═══════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Sidebar hidden by default on mobile */
  #sidebar {
    position: fixed !important;  /* KEY FIX: remove from flex flow */
    top: 0; left: 0; bottom: 0;
    transform: translateX(-100%);
    transition: transform 0.28s cubic-bezier(0.4,0,0.2,1);
    z-index: 50;
    box-shadow: none;
  }
  #sidebar.mobile-open {
    transform: translateX(0);
    box-shadow: 4px 0 40px rgba(0,0,0,0.7);
  }
  #sidebar-overlay {
    display: none;
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.7);
    z-index: 49;
    backdrop-filter: blur(4px);
  }
  #sidebar-overlay.active { display: block; }

  /* Main fills full width — full page scroll on mobile */
  #main {
    margin-left: 0 !important;
    width: 100vw !important;
    max-width: 100vw;
    height: auto !important;
    min-height: 100vh;
    overflow: visible !important;
    padding-top: 52px; /* space for fixed topbar */
  }
  body { overflow-y: auto !important; overflow-x: hidden; height: auto !important; }
  #shell { height: auto !important; min-height: 100vh; overflow: visible !important; }
  #topbar {
    position: fixed !important;
    top: 0; left: 0; right: 0;
    z-index: 40;
    width: 100%;
  }
  #content {
    overflow: visible !important;
    height: auto !important;
    flex: none !important;
    padding-bottom: 80px !important;
    min-height: 40vh;
  }
  .kpi-strip { flex-shrink: 0; }
  .fin-bar { flex-shrink: 0; }
  #shell { width: 100%; overflow-x: hidden; }

  /* Topbar mobile */
  #topbar { padding: 0 10px; height: 52px; width: 100%; box-sizing: border-box; }
  .topbar-path { font-size: 9px; max-width: 120px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .topbar-date { display: none; }
  #topbar .topbar-center { display: flex; flex-direction: row; align-items: center; gap: 6px; }
  #topbar .topbar-day { font-size: 10px; font-weight: 600; color: var(--text); letter-spacing: 0.04em; white-space: nowrap; }
  #topbar #live-clock { font-size: 11px; }
  #mobile-menu-btn {
    background: none; border: none; color: var(--text2);
    font-size: 22px; cursor: pointer; padding: 4px 8px 4px 0;
    flex-shrink: 0;
  }
  .topbar-actions .btn { padding: 6px 10px; font-size: 9px; }

  /* KPI strips — 2 columns on mobile */
  .kpi-strip.cols4 { grid-template-columns: 1fr 1fr; }
  #meta-kpi-grid { touch-action: pan-y !important; }
  #meta-kpi-grid .meta-kpi-card { touch-action: none; }
  #kpi-unified-grid { grid-template-columns: 1fr 1fr !important; margin: -12px -12px 16px -12px !important; width: calc(100% + 24px) !important; }
  #cal-kpi-grid { grid-template-columns: 1fr 1fr !important; margin: -12px -12px 16px -12px !important; width: calc(100% + 24px) !important; }
  .kpi-strip.cols3 { grid-template-columns: 1fr 1fr; }
  .kpi-block { padding: 14px 16px; }
  .kpi-num { font-size: 38px; }
  .kpi-label { font-size: 9px; letter-spacing: 0.12em; }
  .kpi-sub { font-size: 11px; }
  .kpi-strip .kpi-block:nth-child(even) { border-right: none; }

  /* Financial bar */
  .fin-bar { padding: 14px 16px; }
  .fin-amount { font-size: 28px; }
  .fin-label { font-size: 9px; }
  .fin-month { font-size: 11px; }

  /* Content */
  #content { padding: 14px; }

  /* Cards */
  .t-card { padding: 11px 12px; }
  .t-card > div:first-child { display: none; } /* hide left color bar on mobile */
  .drag-handle { display: none; }
  .resize-handle { display: none; }
  .cb-item { width: 16px; height: 16px; }

  /* Log cards */
  .log-card { padding: 14px; }

  /* Table horizontal scroll for economia */
  #content table { font-size: 12px; }
  #content table td, #content table th { padding: 7px 8px; }

  /* Meta AI tab responsive */
  .meta-main-panel {
    flex-direction: column !important;
    height: auto !important;
    overflow: visible !important;
  }
  .meta-data-panel {
    overflow: visible !important;
    height: auto !important;
    border-right: none !important;
    border-bottom: 1px solid var(--border);
  }
  .meta-chat-panel {
    width: 100% !important;
    height: 480px !important;
    flex-shrink: 0 !important;
  }
  #content[style*="overflow:hidden"] {
    overflow: visible !important;
    height: auto !important;
    display: block !important;
  }
  /* Meta AI KPI grid — 2 cols on mobile */
  #meta-kpi-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  #meta-kpi-grid > div { min-width: unset !important; max-width: unset !important; flex: none !important; }
  /* Meta AI detail cards — 1 col on mobile */
  #meta-detail-cards { grid-template-columns: 1fr !important; }

  /* Modals */
  .modal { padding: 20px 16px; max-width: 100%; margin: 0; border-radius: 12px 12px 0 0; }
  .overlay { align-items: flex-end; padding: 0; }

  /* Search box */
  #search-box { max-width: 100%; border-radius: 0; }
  #search-overlay { padding-top: 0; align-items: flex-start; }

  /* Charts shorter on mobile */
  #eco-chart { height: 200px !important; }
  #reels-mini-chart { height: 130px !important; }

  /* Btn sizes */
  .btn { padding: 7px 12px; font-size: 10px; }
  .btn-sm { padding: 5px 9px; font-size: 9px; }

  /* Quick filters wrap */
  .qf-btn { font-size: 9px; padding: 4px 9px; }

  /* Bottom nav bar */
  #mobile-bottom-nav {
    display: flex !important;
    position: fixed; bottom: 0; left: 0; right: 0;
    background: var(--sidebar);
    border-top: 1px solid var(--border);
    z-index: 30; padding-bottom: env(safe-area-inset-bottom);
  }
  .mbn-item {
    flex: 1; display: flex; flex-direction: column; align-items: center;
    padding: 8px 4px; cursor: pointer; gap: 3px;
    color: var(--muted2); font-size: 8px; letter-spacing: 0.1em;
    text-transform: uppercase; font-family: 'Rajdhani', sans-serif; font-weight: 600;
    transition: color 0.15s; border: none; background: none;
  }
  .mbn-item.active { color: var(--cyan); }
  .mbn-icon { font-size: 18px; line-height: 1; }
  .mbn-badge {
    position: absolute; top: 5px; right: calc(50% - 18px);
    background: var(--red); color: #fff; font-size: 8px;
    border-radius: 8px; padding: 1px 4px; font-family: 'Sora', sans-serif;
    font-weight: 700;
  }
  .mbn-wrap { position: relative; display: flex; justify-content: center; }

  /* Content needs bottom padding for nav bar */
  #content { padding-bottom: 72px !important; }
  .kpi-strip { padding-bottom: 0; }

  /* Sidebar logo smaller */
  .sidebar-logo-text { font-size: 17px; }
}

/* Desktop: hide mobile elements */
@media (min-width: 769px) {
  #mobile-menu-btn { display: none !important; }
  #mobile-bottom-nav { display: none !important; }
  #sidebar-overlay { display: none !important; }
}

/* v48 */
.inicio-sec{position:relative;}
.sec-drag-btn{position:absolute;top:4px;right:2px;cursor:grab;color:var(--muted2);opacity:0.55;font-size:15px;padding:4px 6px;z-index:5;user-select:none;}
.sec-drag-btn:hover{opacity:1;color:var(--cyan);}
#health-dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:10px;cursor:pointer;background:#556;box-shadow:0 0 6px rgba(255,255,255,0.15);}
#health-dot.ok{background:#00c853;box-shadow:0 0 8px rgba(0,200,83,0.6);}
#health-dot.err{background:#ff3d6a;box-shadow:0 0 8px rgba(255,61,106,0.7);animation:pulse 1.4s infinite;}
@keyframes pulse{50%{opacity:0.45}}
#cmdk-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.6);backdrop-filter:blur(3px);z-index:900;display:flex;align-items:flex-start;justify-content:center;padding-top:12vh;}
#cmdk-box{background:var(--card,#12161f);border:1px solid var(--cyan);border-radius:12px;width:min(560px,92vw);padding:16px;box-shadow:0 20px 60px rgba(0,0,0,0.6);}
#cmdk-box textarea{width:100%;min-height:64px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.12);border-radius:8px;color:var(--text,#eee);padding:10px;font-size:15px;resize:vertical;}
.cmdk-chip{padding:5px 12px;border-radius:16px;border:1px solid rgba(255,255,255,0.15);background:transparent;color:var(--muted2,#889);cursor:pointer;font-size:12px;}
.cmdk-chip.active{border-color:var(--cyan);color:var(--cyan);}
#cmdk-fab{position:fixed;right:18px;bottom:76px;width:52px;height:52px;border-radius:50%;background:var(--cyan);color:#04121a;font-size:26px;font-weight:700;border:none;z-index:850;box-shadow:0 6px 20px rgba(0,217,255,0.4);display:none;align-items:center;justify-content:center;cursor:pointer;}
@media(max-width:820px){#cmdk-fab{display:flex;}}
.funnel-col{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:10px;min-width:210px;flex:1;}
.funnel-card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.09);border-radius:8px;padding:10px 12px;margin-bottom:8px;}

/* v53 paleta unificada */
#palette-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.55);backdrop-filter:blur(4px);z-index:950;display:flex;align-items:flex-start;justify-content:center;padding-top:11vh;}
#palette-box{background:var(--card);border:1px solid var(--border);border-radius:14px;width:min(620px,94vw);box-shadow:0 24px 70px rgba(0,0,0,0.45);overflow:hidden;}
#palette-chips{display:flex;gap:6px;flex-wrap:wrap;padding:12px 14px 0;}
.p-chip{padding:5px 12px;border-radius:14px;border:1px solid var(--border);background:transparent;color:var(--muted2);cursor:pointer;font-size:11px;font-family:inherit;letter-spacing:0.04em;}
.p-chip.active{border-color:var(--cyan);color:var(--cyan);background:rgba(0,150,255,0.08);}
#palette-input{width:100%;border:none;border-bottom:1px solid var(--border);background:transparent;color:var(--text)!important;-webkit-text-fill-color:var(--text);padding:16px 16px 14px;font-size:17px;font-family:inherit;outline:none;}
#palette-input::placeholder{color:var(--muted2);opacity:0.8;}
#palette-results{max-height:46vh;overflow-y:auto;}
.p-empty,.p-create{padding:22px 16px;text-align:center;color:var(--muted2);font-size:13px;}
.p-create{cursor:pointer;color:var(--cyan);border-top:1px solid var(--border);}
.p-item{display:flex;gap:10px;align-items:center;padding:10px 16px;cursor:pointer;border-bottom:1px solid rgba(128,128,128,0.10);}
.p-item.sel,.p-item:hover{background:rgba(0,150,255,0.10);}
.p-ico{font-size:15px;width:22px;text-align:center;}
.p-txt{display:flex;flex-direction:column;min-width:0;}
.p-txt b{font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.p-txt small{font-size:11px;color:var(--muted2);}
#palette-foot{display:flex;gap:14px;padding:9px 16px;border-top:1px solid var(--border);font-size:10px;color:var(--muted2);flex-wrap:wrap;}
@media(max-width:820px){#palette-overlay{padding-top:6vh;}#palette-input{font-size:16px;}}

/* v55 — Windows/Chrome pinta las <option> con colores del sistema si no se fuerzan */
select{color:var(--text)!important;background-color:var(--card)!important;-webkit-appearance:none;appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--muted2) 50%),linear-gradient(135deg,var(--muted2) 50%,transparent 50%);
  background-position:calc(100% - 16px) 52%,calc(100% - 11px) 52%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:32px;}
select option{color:#111!important;background-color:#fff!important;}
.light-theme select{color:#111!important;background-color:#f0f0f2!important;}
.light-theme select option{color:#111!important;background-color:#fff!important;}
input[type="date"],input[type="time"]{color:var(--text)!important;background-color:var(--card)!important;}
.light-theme input[type="date"],.light-theme input[type="time"]{color:#111!important;background-color:#f0f0f2!important;}
input[type="date"]::-webkit-calendar-picker-indicator,input[type="time"]::-webkit-calendar-picker-indicator{filter:invert(0.5);cursor:pointer;}
/* Una sola luz de estado, en el sidebar */
.sys-status{cursor:pointer;transition:color .2s;}
.sys-dot{transition:background .2s,box-shadow .2s;}
.sys-dot.err{background:#ff3d6a!important;box-shadow:0 0 8px rgba(255,61,106,.7)!important;animation:pulse 1.4s infinite;}
.sys-status.err{color:#ff3d6a;}
