/* MXROOM · Zugangsverwaltung im Stil des Tools: dunkel, Bernstein als Akzent */
:root{--bg:#141517;--panel:#1d1e21;--panel2:#25272b;--fg:#e9e6e0;--dim:#9a978f;--line:#ffffff1c;--accent:#f0a630;--red:#e0533f;--green:#5fbf72}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}
body{min-height:100vh;display:grid;place-items:center;padding:28px 16px;background:radial-gradient(ellipse at top,#22242a 0%,var(--bg) 60%)}
.box{width:100%;max-width:400px;background:var(--panel);border:1px solid #000;border-radius:10px;padding:26px 26px 28px;box-shadow:0 20px 60px #0008}.box.wide{max-width:1100px}
.box .box{background:none;border:0;box-shadow:none;padding:0}
.logo{font:600 34px/1 "Barlow Condensed","Arial Narrow",system-ui,sans-serif;letter-spacing:.14em;margin:0 0 4px;color:#fff}.logo span{color:#fff}
.logo small{display:block;margin-top:6px;font:500 10.5px ui-monospace,Menlo,monospace;letter-spacing:.3em;text-transform:uppercase;color:var(--dim)}
.logo + *{margin-top:22px}
label{display:block;font:600 10.5px ui-monospace,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;margin:14px 0 5px;color:var(--dim)}
input,select{width:100%;font:inherit;padding:9px 11px;border:1px solid #000;background:#0f1012;color:var(--fg);border-radius:5px}
input:focus,select:focus{outline:none;border-color:var(--accent)}
button,.btn{display:inline-block;font:600 12px ui-monospace,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;padding:10px 16px;border:1px solid #000;background:var(--accent);color:#141414;cursor:pointer;border-radius:5px;text-decoration:none;margin-top:18px}
button:hover,.btn:hover{filter:brightness(1.08)}
button.sec,.btn.sec{background:var(--panel2);color:var(--fg)}button.sec:hover,.btn.sec:hover{background:#30333a}
button.sm{padding:5px 8px;margin:2px 0;font-size:10px}
.err{border-left:3px solid var(--red);padding:8px 12px;background:#e0533f1f;margin:12px 0;border-radius:3px}
.ok{border-left:3px solid var(--green);padding:8px 12px;background:#5fbf721a;margin:12px 0;border-radius:3px}
.note{color:var(--dim);font-size:13px;margin-top:20px}.note a{color:var(--fg)}
table{width:100%;border-collapse:collapse;font-size:13px;margin-top:14px}th,td{text-align:left;padding:8px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font:600 10px ui-monospace,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
tr:hover td{background:#ffffff06}td small{color:var(--dim)}
td form{display:inline}.off td{opacity:.45}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0 14px}
.pw{font:600 17px ui-monospace,Menlo,monospace;letter-spacing:.06em;color:var(--accent)}
.bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.bar h2,h2{margin:0;font:600 12px ui-monospace,Menlo,monospace;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
input[type=checkbox]{accent-color:var(--accent)}
@media (max-width:760px){table,tbody,tr,td{display:block}tr:first-child{display:none}td{border:0;padding:4px 0}tr{border-bottom:1px solid var(--line);padding:10px 0}}
