/* Claude-inspired palette: warm cream, clay accent, slate ink. Light + dark. */
:root{--bg:#F5F4EF;--surface:#FFFFFF;--surface-2:#FAF9F5;--ink:#1F1E1D;--muted:#6B6A64;--line:#E6E2D6;
--accent:#C96442;--accent-ink:#FFFFFF;--accent-soft:#F6E6DE;--ok:#2E7D4F;--ok-soft:#E3F1E8;--warn:#B25E09;
--warn-soft:#FBEBD5;--bad:#B3261E;--bad-soft:#F9E1DF;--info:#2D5B9A;--radius:12px;color-scheme:light;
--shadow:0 1px 2px rgba(31,30,29,.05),0 4px 16px rgba(31,30,29,.05)}
@media (prefers-color-scheme:dark){:root{--bg:#262624;--surface:#30302E;--surface-2:#2B2B29;--ink:#F2F0E8;
--muted:#A9A79E;--line:#43423F;--accent:#D97757;--accent-soft:#4A3229;--ok:#6CC08F;--ok-soft:#24392C;--warn:#E6A15A;
--warn-soft:#45351F;--bad:#F08A80;--bad-soft:#47282A;--info:#8DB3EA;color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{font-family:"Tiempos Headline",Georgia,"Times New Roman",serif;font-weight:500;letter-spacing:-.01em;margin:0 0 .4em}
h1{font-size:1.9rem}h2{font-size:1.35rem}h3{font-size:1.05rem}
.top{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .in{max-width:1180px;margin:0 auto;padding:.7rem 1.2rem;display:flex;gap:1.2rem;align-items:center;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.55rem;font-weight:600;color:var(--ink)}
.brand .mark{width:26px;height:26px;border-radius:7px;background:var(--accent);display:grid;place-items:center;color:#fff;font-weight:700;font-size:.85rem}
.brand small{color:var(--muted);font-weight:400}
nav{display:flex;gap:.2rem;flex-wrap:wrap;flex:1}
nav a{color:var(--muted);padding:.38rem .7rem;border-radius:8px}nav a:hover,nav a.on{background:var(--surface);color:var(--ink);text-decoration:none}
.who{display:flex;align-items:center;gap:.6rem;color:var(--muted);font-size:.88rem}
main{max-width:1180px;margin:0 auto;padding:1.6rem 1.2rem 4rem}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem 1.3rem;box-shadow:var(--shadow);margin-bottom:1.2rem}
.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));margin-bottom:1.2rem}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.1rem}
.kpi .l{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.kpi .v{font-family:Georgia,serif;font-size:1.6rem;margin-top:.15rem}
table{width:100%;border-collapse:collapse;font-size:.92rem}
th{text-align:left;font-weight:600;color:var(--muted);font-size:.76rem;text-transform:uppercase;letter-spacing:.05em;padding:.55rem .6rem;border-bottom:1px solid var(--line)}
td{padding:.65rem .6rem;border-bottom:1px solid var(--line);vertical-align:middle}
tr:last-child td{border-bottom:0}td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
.scroll{overflow-x:auto}
.pill{display:inline-block;padding:.12rem .55rem;border-radius:999px;font-size:.78rem;font-weight:600;white-space:nowrap}
.ok{background:var(--ok-soft);color:var(--ok)}.warn{background:var(--warn-soft);color:var(--warn)}
.bad{background:var(--bad-soft);color:var(--bad)}.mute{background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}
.btn{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--line);background:var(--surface);color:var(--ink);
padding:.5rem .95rem;border-radius:9px;font:inherit;font-weight:500;cursor:pointer}
.btn:hover{border-color:var(--accent);text-decoration:none}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn.primary:hover{filter:brightness(1.06)}
.btn.small{padding:.3rem .65rem;font-size:.85rem}.btn.danger{color:var(--bad)}
form.inline{display:inline}
label{display:block;font-size:.85rem;color:var(--muted);margin:.7rem 0 .3rem}
input,select,textarea{width:100%;padding:.6rem .7rem;border:1px solid var(--line);border-radius:9px;background:var(--surface-2);color:var(--ink);font:inherit}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent-soft);border-color:var(--accent)}
.row{display:flex;gap:.8rem;flex-wrap:wrap;align-items:end}.row>*{flex:1;min-width:160px}
.check{display:flex;gap:.5rem;align-items:center;color:var(--ink);font-size:.95rem}.check input{width:auto}
.msg{padding:.75rem 1rem;border-radius:10px;margin-bottom:1rem;background:var(--accent-soft);color:var(--ink);border:1px solid var(--line)}
.err{background:var(--bad-soft);color:var(--bad)}
.muted{color:var(--muted)}.small{font-size:.85rem}
.auth{min-height:100vh;display:grid;place-items:center;padding:1.5rem}
.auth .card{width:100%;max-width:400px;padding:2rem}
.auth h1{text-align:center}.auth .brand{justify-content:center;margin-bottom:1.2rem}
.qr{display:block;margin:1rem auto;width:200px;height:200px;background:#fff;padding:10px;border-radius:10px}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--surface-2);border:1px solid var(--line);padding:.5rem .7rem;border-radius:8px;word-break:break-all}
.frame{width:100%;height:78vh;border:1px solid var(--line);border-radius:var(--radius);background:#F5F4EF}
.head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.actions{display:flex;gap:.5rem;flex-wrap:wrap}
details summary{cursor:pointer;color:var(--muted)}
footer{max-width:1180px;margin:0 auto;padding:0 1.2rem 2rem;color:var(--muted);font-size:.8rem}
@media (max-width:640px){h1{font-size:1.5rem}.who span{display:none}td,th{padding:.5rem .4rem}}
.full{width:100%;justify-content:center}.w-auto{width:auto}.otp{text-align:center;font-size:1.4rem;letter-spacing:.3em}
.kpi .v.sm{font-family:inherit;font-size:1rem;margin-top:.45rem}.center{text-align:center}.mw-sm{max-width:520px}.mw-md{max-width:640px}.mw-lg{max-width:720px}
.row>.shrink{flex:0;min-width:auto}
.progress-card{border-color:var(--accent)}.progress-card h2{display:flex;align-items:center;gap:.6rem}
.spinner{width:18px;height:18px;border:3px solid var(--accent-soft);border-top-color:var(--accent);border-radius:50%;animation:spin .9s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
.bar{height:6px;background:var(--accent-soft);border-radius:999px;overflow:hidden;margin:.6rem 0}
.bar>div{height:100%;width:35%;background:var(--accent);border-radius:999px;animation:slide 1.4s ease-in-out infinite}
@keyframes slide{0%{margin-left:-35%}100%{margin-left:100%}}
.ver{margin-left:.4rem;font:500 .72rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);background:var(--surface-2);border:1px solid var(--line);border-radius:6px;padding:.25rem .4rem}