/* ===== ORIGAMY SYSTEM · dark forest + neón · compartido HQ + Portal =====
   --accent sale de --brand: el Portal la sobreescribe con el color de marca del tenant
   en boot(); el HQ no la toca (dark forest puro). */
:root{--brand:#3DE68B;--ink:#0B0F0C;--deep:#06231A;--panel:#141C17;--panel2:#18211A;--line:#26332A;
  --text:#EAF0EA;--muted:#8B978D;--accent:var(--brand);--accent-soft:#7CFFC4;--neon:#39ff14;
  --gold:#F2F5F0;--red:#F2F5F0;--paper:#F2F5F0}
html,body{margin:0!important;padding:0!important;width:100%;min-height:100%}
body{font-family:'Inter',-apple-system,sans-serif;color:var(--text)}
h1,h2,h3,.font-extrabold{font-family:'Space Grotesk',sans-serif}
.uppercase{font-family:'Space Mono',monospace;letter-spacing:.12em}
/* ROMPE cualquier contenedor del builder */
#login,#app{position:fixed;inset:0;z-index:2147483000;overflow-y:auto;overscroll-behavior:contain;
  background:
    radial-gradient(120% 90% at 100% -10%,rgba(61,230,139,.10),transparent 55%),
    radial-gradient(90% 80% at -10% 10%,rgba(61,230,139,.06),transparent 50%),
    var(--ink)}
#login::after,#app::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.5;
  background:linear-gradient(13deg,transparent 49.7%,rgba(61,230,139,.10) 49.9% 50.1%,transparent 50.3%) 0 22%/140% 1px no-repeat,
             linear-gradient(-11deg,transparent 49.7%,rgba(61,230,139,.08) 49.9% 50.1%,transparent 50.3%) 100% 62%/120% 1px no-repeat}
#login>*,#app>*{position:relative;z-index:1}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;
  box-shadow:0 24px 60px -40px rgba(0,0,0,.8);
  transition:transform .25s cubic-bezier(.2,.8,.3,1),box-shadow .25s,border-color .25s;
  animation:rise .5s cubic-bezier(.2,.8,.3,1) both}
.card:hover{transform:translateY(-3px);border-color:rgba(61,230,139,.45);box-shadow:0 24px 60px -30px rgba(61,230,139,.35)}
.grid>.card:nth-child(1){animation-delay:.02s}.grid>.card:nth-child(2){animation-delay:.06s}
.grid>.card:nth-child(3){animation-delay:.10s}.grid>.card:nth-child(4){animation-delay:.14s}
.grid>.card:nth-child(5){animation-delay:.18s}.grid>.card:nth-child(6){animation-delay:.22s}
.grid>.card:nth-child(7){animation-delay:.26s}.grid>.card:nth-child(8){animation-delay:.30s}
.grid>.card:nth-child(n+9){animation-delay:.34s}
@keyframes rise{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.btn{border-radius:12px;font-weight:800;transition:.18s;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font-family:'Space Grotesk',sans-serif}
.btn:active{transform:scale(.96)}
.btn-p{background:linear-gradient(135deg,var(--accent),var(--accent-soft));color:var(--deep);box-shadow:0 14px 34px -14px rgba(61,230,139,.65)}
.btn-p:hover{filter:brightness(1.1);box-shadow:0 18px 40px -14px rgba(61,230,139,.8)}
.btn-s{background:var(--panel2);color:var(--text);border:1px solid var(--line)}.btn-s:hover{border-color:rgba(61,230,139,.4)}
.inp{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:.6rem .8rem;background:var(--panel2);color:var(--text);outline:none;transition:.15s}
.inp::placeholder{color:#5c6a60}
.inp:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(61,230,139,.14)}
select.inp option{background:var(--panel2)}
.sheet{position:fixed;inset:0;z-index:2147483200;display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s}
.sheet.open{opacity:1;pointer-events:auto}
.sheet .bg{position:absolute;inset:0;background:rgba(3,10,6,.72);backdrop-filter:blur(4px)}
.sheet .box{position:relative;background:var(--panel2);color:var(--text);border:1px solid var(--line);width:100%;max-width:640px;max-height:88vh;overflow-y:auto;border-radius:20px 20px 0 0;padding:1.25rem;transform:translateY(36px);transition:.25s cubic-bezier(.2,.8,.3,1)}
.sheet.open .box{transform:translateY(0)}
@media(min-width:640px){.sheet{align-items:center}.sheet .box{border-radius:20px}}
.tabbtn{padding:.55rem 1rem;border-radius:12px;font-weight:800;font-size:.85rem;white-space:nowrap;color:var(--muted);transition:.18s;font-family:'Space Grotesk',sans-serif}
.tabbtn:hover{color:var(--text)}
.tabbtn.on{background:var(--accent);color:var(--deep);box-shadow:0 12px 26px -12px rgba(61,230,139,.7)}
.pill{font-size:.68rem;font-weight:800;padding:.18rem .6rem;border-radius:999px;font-family:'Space Mono',monospace}
.h-verde{background:rgba(61,230,139,.16);color:var(--accent)}
.h-ambar{background:rgba(242,245,240,.16);color:var(--gold)}
.h-rojo{background:var(--gold);color:#06231A;animation:pulse-r 1.6s infinite}
@keyframes pulse-r{0%,100%{box-shadow:0 0 0 0 rgba(242,245,240,.45)}50%{box-shadow:0 0 0 7px rgba(242,245,240,0)}}
.livedot{width:8px;height:8px;border-radius:999px;background:var(--neon);box-shadow:0 0 8px rgba(57,255,20,.8);position:relative;display:inline-block}
.livedot::after{content:'';position:absolute;inset:0;border-radius:999px;background:var(--neon);animation:ping 1.6s cubic-bezier(0,0,.2,1) infinite}
@keyframes ping{0%{transform:scale(1);opacity:.8}80%,100%{transform:scale(2.6);opacity:0}}
.gb{transform-box:fill-box;transform-origin:center bottom;animation:growBar .7s cubic-bezier(.2,.8,.3,1) both}
@keyframes growBar{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.chline{stroke-dasharray:2400;stroke-dashoffset:2400;animation:dash 1.4s .3s ease-out forwards;filter:drop-shadow(0 0 6px rgba(124,255,196,.6))}
@keyframes dash{to{stroke-dashoffset:0}}
@keyframes growW{from{max-width:0}to{max-width:100%}}
.logo-o{filter:drop-shadow(0 0 10px rgba(57,255,20,.55));animation:floaty 5s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-4px) rotate(-2deg)}}
.wm{font-family:'Space Grotesk',sans-serif;font-weight:900;font-style:italic;letter-spacing:-.045em}
.wm .n{color:var(--accent);text-shadow:0 0 16px rgba(57,255,20,.45)}
.crease{position:relative;height:1px;background:var(--line)}
.crease::before{content:"";position:absolute;left:50%;top:-6px;width:56px;height:12px;transform:translateX(-50%);background:linear-gradient(135deg,transparent 49%,var(--accent) 49% 51%,transparent 51%),linear-gradient(45deg,transparent 49%,var(--accent) 49% 51%,transparent 51%);opacity:.5}
/* mapeo dark de utilidades usadas en los renders */
.text-stone-300{color:#3d4a41!important}.text-stone-400{color:#7b8a7f!important}
.text-stone-500{color:var(--muted)!important}.text-stone-600{color:#B9C4BB!important}
.bg-stone-100{background:#0F1712!important}.border-stone-100{border-color:var(--line)!important}
.text-emerald-600,.text-emerald-700{color:var(--accent)!important}
.text-red-500,.text-red-600{color:var(--gold)!important}
.hover\:text-red-600:hover{color:var(--gold)!important}
img[data-path]{cursor:zoom-in}
.cm-staff{background:rgba(242,245,240,.10);border:1px solid rgba(242,245,240,.25)}
.cm-client{background:rgba(124,255,196,.08);border:1px solid rgba(124,255,196,.22)}