:root{--bg:#0f1419;--surface:#1a2332;--surface-2:#243044;--border:#334155;--text:#e8edf4;--muted:#94a3b8;--accent:#38bdf8;--accent-2:#0ea5e9;--success:#34d399;--error:#f87171;--warning:#fbbf24;--radius:12px;--shadow:0 12px 40px #00000059;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.5}*{box-sizing:border-box}body{background:radial-gradient(circle at top left, #38bdf81f, transparent 40%), radial-gradient(circle at bottom right, #0ea5e914, transparent 35%), var(--bg);min-height:100vh;margin:0}#root{min-height:100vh}button,input{font:inherit}.app{max-width:1280px;margin:0 auto;padding:24px}.header{justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:24px;display:flex}.eyebrow{color:var(--accent);letter-spacing:.08em;text-transform:uppercase;margin:0 0 4px;font-size:.85rem;font-weight:600}.header h1{margin:0;font-size:2rem;font-weight:700}.header-actions{align-items:center;gap:12px;display:flex}.status{border-radius:999px;padding:6px 12px;font-size:.85rem;font-weight:600}.status.online{color:var(--success);background:#34d39926}.status.offline{color:var(--error);background:#f8717126}.toast{border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);margin-bottom:16px;padding:12px 16px}.toast.success{color:var(--success);border-color:#34d39966}.toast.error{color:var(--error);border-color:#f8717166}.toast.info{color:var(--muted)}.layout{grid-template-columns:320px 1fr;align-items:start;gap:20px;display:grid}.sidebar,.content{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.sidebar{flex-direction:column;gap:20px;padding:20px;display:flex}.content{overflow:hidden}.item-form h2{margin:0 0 16px;font-size:1.1rem}.item-form label{color:var(--muted);flex-direction:column;gap:6px;margin-bottom:14px;font-size:.9rem;display:flex}.item-form input,.search{border:1px solid var(--border);background:var(--surface-2);width:100%;color:var(--text);border-radius:8px;padding:10px 12px}.item-form input:focus,.search:focus{border-color:var(--accent);outline:2px solid #38bdf859}.item-form input[readonly]{opacity:.75;cursor:not-allowed}.form-actions{gap:10px;display:flex}.btn{cursor:pointer;border:none;border-radius:8px;padding:10px 14px;font-weight:600;transition:transform .15s,opacity .15s}.btn:disabled{opacity:.6;cursor:not-allowed}.btn:not(:disabled):hover{transform:translateY(-1px)}.btn.primary{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#04111d}.btn.secondary{background:var(--surface-2);color:var(--text);border:1px solid var(--border)}.btn.ghost{color:var(--muted);border:1px solid var(--border);background:0 0}.excel-import h3{margin:0 0 8px;font-size:1.1rem}.import-actions{flex-direction:column;gap:10px;display:flex}.import-actions .btn{width:100%}.file-name{color:var(--muted);word-break:break-all;margin:8px 0 0;font-size:.85rem}.import-preview{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:4px;margin-top:12px;padding:10px 12px;font-size:.9rem;display:flex}.import-warn{color:var(--warning);font-size:.85rem}.import-error{color:var(--error);margin:8px 0 0;font-size:.85rem}.import-errors{color:var(--muted);margin:8px 0 12px;padding-left:18px;font-size:.8rem}.excel-import .btn.primary{width:100%;margin-top:12px}.toolbar-meta{align-items:center;gap:10px;display:flex}.toolbar{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.count{color:var(--muted);white-space:nowrap;font-size:.9rem}.table-wrap{max-height:calc(100vh - 220px);overflow:auto}.item-table{border-collapse:collapse;width:100%}.item-table th,.item-table td{text-align:left;border-bottom:1px solid var(--border);padding:12px 16px}.item-table th{background:var(--surface-2);text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-size:.8rem;position:sticky;top:0}.item-table tbody tr{cursor:pointer;transition:background .15s}.item-table tbody tr:hover{background:#38bdf80f}.item-table tbody tr.selected{background:#38bdf81f}.mono{font-family:Consolas,Courier New,monospace;font-size:.92rem}.price{color:var(--warning);font-weight:600}.muted{color:var(--muted);font-size:.88rem}.table-state{text-align:center;color:var(--muted);padding:48px 20px}.col-actions{text-align:center;width:72px}.btn-icon{border:1px solid var(--border);background:var(--surface-2);width:34px;height:34px;color:var(--accent);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;padding:0;transition:transform .15s,background .15s,border-color .15s;display:inline-flex}.btn-icon:hover{background:#38bdf81f;border-color:#38bdf859;transform:translateY(-1px)}.barcode-preview-btn:focus-visible{outline-offset:2px;outline:2px solid #38bdf873}.barcode-modal-backdrop{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#040a12b8;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.barcode-modal{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);width:min(100%,420px);box-shadow:var(--shadow);padding:24px}.barcode-modal-header{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;display:flex}.barcode-modal-header h2{margin:4px 0 0;font-size:1.25rem}.barcode-modal-close{min-width:40px;padding:6px 10px;font-size:1.4rem;line-height:1}.barcode-image-wrap{background:#fff;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;min-height:120px;padding:16px;display:flex}.barcode-svg{max-width:100%;height:auto;display:block}.barcode-image-error{color:var(--error);text-align:center;margin:0;font-size:.9rem}.barcode-modal-meta{grid-template-columns:1fr 1fr;gap:16px;margin:20px 0 0;display:grid}.barcode-modal-meta div{flex-direction:column;gap:4px;display:flex}.barcode-modal-meta dt{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0;font-size:.75rem}.barcode-modal-meta dd{margin:0;font-size:.95rem}.login-page{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:min(100%,400px);box-shadow:var(--shadow);padding:28px}.login-card h1{margin:0 0 20px}.form-error{color:var(--error);margin:0;font-size:.9rem}.user-badge{color:var(--muted);font-size:.9rem}.btn.active{color:var(--accent);border-color:#38bdf859}.user-management .content{padding:0 24px 24px}.user-create-form{margin-bottom:24px}.config-form{max-width:560px;margin-bottom:32px}.firmware-notes{white-space:pre-wrap;word-break:break-word;min-width:160px;max-width:280px;color:var(--muted);font-size:.88rem}.firmware-panel .table-wrap{margin-top:24px}.user-qr-config{flex-wrap:wrap;align-items:flex-start;gap:20px;display:flex}.user-qr-config-controls{flex:1;min-width:260px}.user-qr-config-controls label{flex-direction:column;gap:8px;display:flex}.user-qr-config-controls select{width:100%}.user-qr-config-card{flex:none;max-width:280px}.token-cell{text-overflow:ellipsis;white-space:nowrap;max-width:220px;overflow:hidden}.user-actions{flex-wrap:wrap;gap:6px;display:flex}.devices-page .content,.config-devices-page .content{padding:0 24px 24px}.devices-toolbar{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px;display:flex}.user-devices-row td{background:#0f172a73;padding:12px 16px}.devices-subtable{margin:0}.token-qr-panel{margin-bottom:28px}.devices-toolbar h2{margin:0 0 8px;font-size:1.1rem}.device-note-cell{min-width:220px}.device-note-cell .device-note-input{width:100%;max-width:180px;margin-bottom:6px}.token-qr-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;display:grid}.token-qr-card{background:#0f172a59;border:1px solid #94a3b833;border-radius:12px;flex-direction:column;align-items:center;gap:10px;padding:16px;display:flex}.token-qr-label{text-align:center;margin:0;font-weight:600}.token-qr-hint{text-align:center;margin:0;font-size:.85rem}.token-qr-value{word-break:break-all;text-align:center;max-width:100%;margin:0;font-size:.72rem}.token-qr-image{background:#fff;border-radius:8px;padding:8px;display:block}.token-qr-loading{width:180px;height:180px;color:var(--muted,#94a3b8);place-items:center;font-size:.9rem;display:grid}@media (width<=900px){.layout{grid-template-columns:1fr}.header{flex-direction:column;align-items:flex-start}}