/* Lymos TV · base compartilhada (app e painel). Paleta e marca da Lymos: verde #00d97e sobre grafite esverdeado,
   gradiente verde nos botões, brilho suave no topo, cantos arredondados 5·8·13·21 e sombras leves. */
@font-face{font-family:'Bricolage';src:url('/fonts/bricolage-var.woff2') format('woff2');font-weight:500 800;font-stretch:75% 100%;font-display:swap}
@font-face{font-family:'Plex Sans';src:url('/fonts/plex-sans-var.woff2') format('woff2');font-weight:400 600;font-display:swap}
@font-face{font-family:'Plex Mono';src:url('/fonts/plex-mono-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Plex Mono';src:url('/fonts/plex-mono-500.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --font:'Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --display:'Bricolage','Plex Sans',system-ui,sans-serif;
  --mono:'Plex Mono',ui-monospace,Consolas,monospace;

  --bg:#080b0a; --bg-2:#0b100e; --surface:#0e1311; --surface-2:#131a17; --surface-3:#1a231f;
  --text:#e8f0ec; --text-2:#bccac2; --muted:#8b9b93; --faint:#62736b;
  --line:#1f2a25; --line-strong:#35463d;
  --primary-rgb:0 217 126; --primary:#00d97e; --primary-hover:#3bff9a; --on-primary:#03160c; --primary-soft:#0c2a1b;
  --grad-primary:linear-gradient(180deg,#25eb97 0%,#00d17a 100%);
  --grad-primary-hover:linear-gradient(180deg,#4dffae 0%,#12e48a 100%);
  --green:#00d97e; --green-hi:#25eb97; --accent:#2ee596; --glow:rgb(var(--primary-rgb)/.30);
  --warn:#e5b04b; --bad:#f06478; --info:#78a6f2;
  --b-white:#c8c8cc; --b-yellow:#e5b04b; --b-cyan:#3fd0de; --b-green:#00d97e; --b-magenta:#e25ac0; --b-red:#f06478; --b-blue:#4366ff;
  --spectrum:linear-gradient(90deg,#00b866,#00d97e 55%,#25eb97);
  --shadow-1:0 1px 2px rgba(0,0,0,.4);
  --shadow-2:0 8px 21px -6px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.02);
  --shadow-3:0 21px 55px -13px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.03);
  --r-xs:5px; --r-sm:8px; --r:13px; --r-lg:21px;
  --ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{font-size:clamp(14px,.5vw + 9px,22px)}
html,body{height:100%;margin:0}
body{background-color:var(--bg);color:var(--text);font:400 1rem/1.45 var(--font);-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(60% 55% at 50% -8%,rgb(var(--primary-rgb)/.13),transparent 70%);background-repeat:no-repeat;background-attachment:fixed}
::selection{background:#00d97e;color:#03160c}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:-.028em;text-wrap:balance}
:focus-visible{outline:3px solid #fff;outline-offset:3px}
.ic{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.grow{flex:1}
.mono{font-family:var(--mono)}
kbd{font:500 .72rem var(--mono);padding:.12rem .4rem;border:1px solid var(--line-strong);border-radius:6px;color:var(--muted)}

/* marca: símbolo + LYMOS em maiúsculas + TV em verde */
.wordmark{display:inline-flex;align-items:center;gap:.6rem}
.wordmark img{height:1.9rem;width:auto;display:block}
.wordmark b{font:700 1.2rem/1 var(--display);letter-spacing:.06em}
.wordmark i{font:700 1.2rem/1 var(--display);font-style:normal;letter-spacing:.06em;color:var(--primary)}
em.mark{font-style:normal;background:var(--grad-primary);-webkit-background-clip:text;background-clip:text;color:transparent}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.7rem 1.25rem;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--surface-2);color:var(--text);font-weight:600;
  transition:transform .15s var(--ease),background .2s,border-color .2s,box-shadow .2s}
.btn:hover{background:var(--surface-3);border-color:#4a6055}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--grad-primary);color:var(--on-primary);border-color:transparent;box-shadow:0 8px 24px -10px rgb(var(--primary-rgb)/.55)}
.btn.primary:hover{background:var(--grad-primary-hover);box-shadow:0 10px 28px -8px rgb(var(--primary-rgb)/.6)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--text-2)}
.btn.ghost:hover{background:var(--surface-3);color:var(--text)}
.btn.danger{color:var(--bad);border-color:rgba(240,100,120,.4)}
.btn.danger:hover{background:rgba(240,100,120,.12);border-color:var(--bad)}
.btn.sm{padding:.4rem .8rem;font-size:.85rem;border-radius:var(--r-sm)}
.btn:disabled{opacity:.55;cursor:progress;transform:none}

/* campos */
.field{display:block;margin-bottom:.85rem}
.field>span{display:block;margin-bottom:.3rem;font-size:.8rem;font-weight:600;color:var(--text-2)}
.field input,.field select,.field textarea{width:100%;padding:.7rem .85rem;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--r);outline:0;transition:border-color .2s,box-shadow .2s}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#4a6055}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgb(var(--primary-rgb)/.26)}
.field small{display:block;margin-top:.3rem;color:var(--faint);font-size:.78rem}
.err{margin:0 0 1rem;padding:.7rem .9rem;background:rgba(240,100,120,.12);border:1px solid rgba(240,100,120,.45);border-radius:var(--r);color:#ffc2ca;font-size:.92rem}
.ok{margin:0 0 1rem;padding:.7rem .9rem;background:var(--primary-soft);border:1px solid rgb(var(--primary-rgb)/.4);border-radius:var(--r);color:#b6f2cd;font-size:.92rem}

.pill{display:inline-flex;align-items:center;gap:.4rem;padding:.18rem .6rem;border-radius:999px;font-size:.75rem;font-weight:600;background:rgba(255,255,255,.07);color:var(--muted)}
.pill::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:currentColor}
.pill.on{background:var(--primary-soft);color:var(--accent)}
.pill.off{background:rgba(240,100,120,.14);color:var(--bad)}
.pill.warn{background:rgba(229,176,75,.14);color:var(--warn)}

.toast{position:fixed;left:50%;bottom:calc(1.5rem + env(safe-area-inset-bottom,0px));z-index:50;max-width:min(92vw,28rem);padding:.75rem 1.1rem;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--r);box-shadow:var(--shadow-3);opacity:0;transform:translate(-50%,10px);pointer-events:none;transition:opacity .2s,transform .2s}
.toast.show{opacity:1;transform:translate(-50%,0)}

dialog{width:min(34rem,92vw);padding:0;border:1px solid var(--line-strong);border-radius:var(--r-lg);background:var(--surface);color:var(--text);box-shadow:var(--shadow-3);overflow:hidden}
dialog::backdrop{background:rgba(3,6,5,.78);backdrop-filter:blur(8px)}
.bars-strip{height:4px;background:var(--spectrum)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}