/* Âncora Sistema · visual das páginas de login e administração */
:root{
  --bg:#0B0C0E;--surface:#121418;--surface-2:#15171B;--ink:#EDEDE8;--mut:#A3A6AD;--faint:#6F737B;--line:#23262C;
  --navy:#0F1114;--navy-2:#1A1D22;--navy-ink:#EDEDE8;--navy-mut:#A3A6AD;
  --acc:#F2A541;--acc-ink:#1A1206;--acc-soft:#2A2012;
  --ok:#4ADE80;--ok-soft:#10261B;--warn:#FBBF24;--warn-soft:#2E2410;--bad:#F87171;--bad-soft:#3A1719;
  --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 30px rgba(0,0,0,.35);--shadow-lg:0 30px 80px rgba(0,0,0,.6);
  --f-display:"Sora","Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{min-height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 var(--f-body);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
h1,h2,h3{font-family:var(--f-display);margin:0;letter-spacing:-.02em;text-wrap:balance}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
svg.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo .lm{width:36px;height:36px;border-radius:10px;background:var(--acc);color:var(--acc-ink);display:grid;place-items:center;flex:none}
.logo .lm svg{width:21px;height:21px}
.logo b{font:700 18px var(--f-display);letter-spacing:-.02em}
.logo small{display:block;font-size:12px;color:var(--navy-mut);font-weight:500;margin-top:-2px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:9px 16px;border-radius:11px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:600;font-size:14px;white-space:nowrap;text-decoration:none;transition:transform .08s,background .15s,border-color .15s}
.btn:hover{border-color:color-mix(in srgb,var(--ink) 25%,var(--line))}
.btn:active:not(:disabled){transform:scale(.97)}
.btn.pri{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.btn.pri:hover{background:color-mix(in srgb,var(--acc) 88%,#000)}
.btn.dark{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.btn.ghost{background:transparent;border-color:transparent}
.btn.red{color:var(--bad)}
.btn.sm{min-height:34px;padding:6px 11px;font-size:13px;border-radius:9px}
.btn.lg{min-height:52px;font-size:16px;padding:12px 22px;border-radius:13px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn svg.i{width:17px;height:17px}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:13px;font-weight:600;color:var(--mut)}
input,select{font:inherit;width:100%;min-height:46px;padding:10px 14px;border-radius:11px;border:1px solid var(--line);background:var(--surface);color:var(--ink)}
input:focus,select:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 4px var(--acc-soft)}
.msg{font-size:14px;font-weight:600;padding:10px 14px;border-radius:12px;background:var(--surface-2)}
.msg:empty{display:none}
.msg.ok{background:var(--ok-soft);color:var(--ok)}
.msg.warn{background:var(--warn-soft);color:var(--warn)}
.pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:99px;background:var(--surface-2);color:var(--mut);white-space:nowrap}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.warn{background:var(--warn-soft);color:var(--warn)}
.pill.bad{background:var(--bad-soft);color:var(--bad)}
.spin{width:30px;height:30px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--acc);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
#toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,10px);background:var(--ink);color:var(--bg);padding:11px 18px;border-radius:99px;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:30;max-width:calc(100vw - 32px);box-shadow:var(--shadow-lg)}
#toast.on{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
