:root{--bg: #12161d;--bg-elev: #181e28;--bg-soft: #1c2430;--bg-input: #222b38;--border: #2c3648;--border-strong: #3a4660;--text: #d8e0ec;--text-bright: #f0f4fa;--muted: #8b98ab;--accent: #3db8a8;--accent-soft: color-mix(in srgb, var(--accent) 16%, transparent);--accent-text: #0a1f1c;--danger: #e07070;--danger-soft: color-mix(in srgb, var(--danger) 16%, transparent);--ok: #5ecf8e;--ok-soft: color-mix(in srgb, var(--ok) 16%, transparent);--warn: #d4b05a;--warn-soft: color-mix(in srgb, var(--warn) 16%, transparent);--font: "Outfit", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace;--radius: 8px;--radius-lg: 14px;--shadow: 0 12px 40px rgba(0, 0, 0, .28);--ease: cubic-bezier(.22, 1, .36, 1);--nav-w: 240px}*{box-sizing:border-box}html{min-height:100%;background-color:var(--bg)}html,body,#root{margin:0;min-height:100%}body{font-family:var(--font);background-color:var(--bg);background-image:radial-gradient(900px 480px at 0% 0%,rgba(61,184,168,.08),transparent 55%),radial-gradient(700px 400px at 100% 0%,rgba(90,130,180,.07),transparent 50%);background-repeat:no-repeat;background-attachment:fixed;color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased}#root{min-height:100vh}a{color:var(--accent);text-decoration:none;transition:color .15s var(--ease)}a:hover{color:color-mix(in srgb,var(--accent) 80%,white)}button,input,select,textarea{font:inherit}button{cursor:pointer}.shell{display:grid;grid-template-columns:var(--nav-w) 1fr;min-height:100%}.nav{position:sticky;top:0;height:100vh;background:color-mix(in srgb,var(--bg-elev) 88%,transparent);border-right:1px solid var(--border);padding:1.35rem .9rem;display:flex;flex-direction:column;gap:.2rem;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:.65rem;margin:0 0 1.75rem;padding:.35rem .55rem;text-decoration:none;color:var(--text-bright)}.brand-mark{width:28px;height:28px;border-radius:8px;background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 70%,#fff),var(--accent));box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 40%,transparent);position:relative;flex-shrink:0}.brand-mark:after{content:"";position:absolute;top:7px;right:7px;bottom:7px;left:7px;border:1.5px solid var(--accent-text);border-radius:3px;opacity:.85}.brand-text{font-weight:700;font-size:1.05rem;letter-spacing:-.03em;line-height:1.1}.brand-text span{display:block;font-size:.68rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:.15rem}.nav-section{font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:.75rem .65rem .35rem}.nav a:not(.brand){color:var(--muted);padding:.55rem .7rem;border-radius:var(--radius);text-decoration:none;font-weight:500;font-size:.92rem;transition:background .15s var(--ease),color .15s var(--ease)}.nav a:not(.brand):hover{background:var(--bg-soft);color:var(--text);text-decoration:none}.nav a:not(.brand).active{background:var(--accent-soft);color:color-mix(in srgb,var(--accent) 70%,white);text-decoration:none}.nav-foot{margin-top:auto;padding:.9rem .55rem .25rem;border-top:1px solid var(--border);font-size:.82rem;color:var(--muted)}.nav-foot .user-email{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:.55rem;color:var(--text);font-weight:500}.main{padding:1.75rem 2.25rem 3rem;max-width:1120px;animation:fade-in .35s var(--ease)}@keyframes fade-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}h1{font-size:1.55rem;font-weight:700;letter-spacing:-.035em;margin:0 0 .3rem;color:var(--text-bright)}h2.panel-title,.panel-title{margin:0 0 .75rem;font-size:.95rem;font-weight:600;letter-spacing:-.01em;color:var(--text-bright)}.sub{color:var(--muted);margin:0 0 1.5rem;font-size:.92rem}.breadcrumb{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;color:var(--muted);margin:0 0 .85rem}.breadcrumb a{color:var(--muted)}.breadcrumb a:hover{color:var(--accent)}.meta-row{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;margin:0 0 1.35rem}.toolbar{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;margin-bottom:1.25rem}.toolbar.end{align-items:end}.btn{background:var(--accent);color:var(--accent-text);border:none;border-radius:var(--radius);padding:.52rem 1rem;font-weight:600;font-size:.9rem;transition:background .15s var(--ease),transform .15s var(--ease),box-shadow .15s var(--ease)}.btn:hover:not(:disabled){background:color-mix(in srgb,var(--accent) 82%,white)}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--border)}.btn.ghost:hover:not(:disabled){border-color:var(--border-strong);background:var(--bg-soft)}.btn.danger{background:var(--danger);color:#1a0a0a}.btn.danger:hover:not(:disabled){background:color-mix(in srgb,var(--danger) 85%,white)}.btn.sm{padding:.32rem .65rem;font-size:.8rem;font-weight:550}.btn.icon{padding:.32rem .5rem;min-width:2rem}.field{display:flex;flex-direction:column;gap:.3rem;margin-bottom:.85rem}.field label{font-size:.75rem;color:var(--muted);font-weight:550;letter-spacing:.02em}.field input,.field select,.field textarea,.inline-input{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);padding:.55rem .7rem;transition:border-color .15s var(--ease),box-shadow .15s var(--ease)}.field textarea{resize:vertical;min-height:120px;font-family:var(--mono);font-size:.85rem;line-height:1.55}.field input:focus,.field select:focus,.field textarea:focus,.inline-input:focus{outline:none;border-color:color-mix(in srgb,var(--accent) 65%,var(--border));box-shadow:0 0 0 3px var(--accent-soft)}.field input::placeholder,.field textarea::placeholder,.inline-input::placeholder{color:color-mix(in srgb,var(--muted) 70%,transparent)}.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-lg);background:color-mix(in srgb,var(--bg-elev) 92%,transparent)}table{width:100%;border-collapse:collapse;font-size:.9rem}th,td{text-align:left;padding:.75rem .95rem;border-bottom:1px solid var(--border);vertical-align:middle}th{color:var(--muted);font-weight:600;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;background:color-mix(in srgb,var(--bg-soft) 60%,transparent)}th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;transition:color .12s var(--ease)}th.sortable:hover{color:var(--text)}th.sortable.sorted{color:color-mix(in srgb,var(--accent) 70%,white)}th.sortable .sort-ind{display:inline-block;margin-left:.35rem;opacity:.35;font-size:.85em;font-weight:500;text-transform:none;letter-spacing:0}th.sortable.sorted .sort-ind,th.sortable:hover .sort-ind{opacity:1}tr:last-child td{border-bottom:none}tbody tr{transition:background .12s var(--ease)}tbody tr:hover{background:color-mix(in srgb,var(--bg-soft) 55%,transparent)}tbody tr.editing{background:var(--accent-soft)}tbody tr.saving{opacity:.72}.mono{font-family:var(--mono);font-size:.84rem}.badge{display:inline-block;padding:.18rem .5rem;border-radius:999px;font-size:.72rem;font-weight:600;background:var(--bg-input);color:var(--muted);letter-spacing:.02em}.badge.ok{color:var(--ok);background:var(--ok-soft)}.badge.warn{color:var(--warn);background:var(--warn-soft)}.badge.danger{color:var(--danger);background:var(--danger-soft)}.badge.accent{color:color-mix(in srgb,var(--accent) 75%,white);background:var(--accent-soft)}.error{color:var(--danger);margin:.5rem 0 1rem;font-size:.9rem;padding:.65rem .85rem;border-radius:var(--radius);background:var(--danger-soft);border:1px solid color-mix(in srgb,var(--danger) 30%,transparent)}.ok-msg{color:var(--ok);margin:.5rem 0 1rem;font-size:.9rem;padding:.65rem .85rem;border-radius:var(--radius);background:var(--ok-soft);border:1px solid color-mix(in srgb,var(--ok) 30%,transparent)}.panel{border:1px solid var(--border);border-radius:var(--radius-lg);background:color-mix(in srgb,var(--bg-elev) 92%,transparent);padding:1.15rem 1.25rem;margin-bottom:1.25rem}.panel.compact{padding:1rem 1.1rem}.modal{border:1px solid var(--border);border-radius:var(--radius-lg);background:color-mix(in srgb,var(--bg-elev) 96%,transparent);color:var(--text);padding:0;width:min(560px,calc(100vw - 2rem));max-height:calc(100vh - 2rem);box-shadow:var(--shadow)}.modal::backdrop{background:color-mix(in srgb,#000 55%,transparent);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-body{padding:1.15rem 1.25rem 1.25rem;overflow:auto;max-height:calc(100vh - 2rem)}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.35rem}.modal-head .panel-title{margin:0}.dash-block{margin-bottom:1.35rem}.dash-block-label{font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.55rem}.stat-grid{display:grid;gap:.85rem}.dash-inventory{grid-template-columns:repeat(2,1fr)}.dash-inventory.with-admin,.dash-expiry{grid-template-columns:repeat(4,1fr)}@media(max-width:960px){.dash-inventory.with-admin,.dash-expiry{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.dash-inventory,.dash-inventory.with-admin,.dash-expiry{grid-template-columns:1fr}}.stat-card{border:1px solid var(--border);border-radius:var(--radius-lg);background:color-mix(in srgb,var(--bg-elev) 92%,transparent);padding:1rem 1.1rem .95rem;display:flex;flex-direction:column;gap:.2rem;min-height:108px}.stat-card.tone-warn{border-color:color-mix(in srgb,var(--warn) 45%,var(--border));background:color-mix(in srgb,var(--warn-soft) 55%,var(--bg-elev))}.stat-card.tone-danger{border-color:color-mix(in srgb,var(--danger) 45%,var(--border));background:color-mix(in srgb,var(--danger-soft) 55%,var(--bg-elev))}.stat-label{font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.stat-value{font-size:1.85rem;font-weight:700;letter-spacing:-.04em;color:var(--text-bright);line-height:1.15;font-variant-numeric:tabular-nums}.stat-hint{font-size:.78rem;color:var(--muted);margin-top:auto}.stat-link{font-size:.78rem;font-weight:500;margin-top:auto}.dash-section-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.15rem}.dash-section-head .panel-title{margin:0}.dash-section-sub{margin-bottom:1rem}.kind-chips{display:flex;flex-wrap:wrap;gap:.5rem}.kind-chips.compact{gap:.35rem;margin:.35rem 0 .15rem}.kind-chip{display:inline-flex;align-items:center;gap:.55rem;padding:.4rem .7rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-soft);font-size:.85rem}.kind-chips.compact .kind-chip{padding:.2rem .45rem;gap:.35rem;font-size:.72rem}.kind-chip strong{font-variant-numeric:tabular-nums;color:var(--text-bright)}.empty{color:var(--muted);text-align:center;padding:2rem 1rem;font-size:.92rem}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:.4rem;background:var(--muted);vertical-align:middle}.status-dot.on{background:var(--ok);box-shadow:0 0 0 3px var(--ok-soft)}.status-dot.off{background:var(--muted)}.inline-cell{position:relative;min-width:0}.inline-input{width:100%;font-family:var(--mono);font-size:.84rem;padding:.4rem .55rem;background:transparent;border-color:transparent}.inline-input:hover:not(:disabled):not(:focus){background:var(--bg-input);border-color:var(--border)}.inline-input:disabled{opacity:1;color:var(--text);cursor:default}.inline-input.ttl{width:5.5rem;text-align:right}.inline-input.dirty{border-color:color-mix(in srgb,var(--warn) 50%,var(--border))}.row-status{font-size:.7rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);white-space:nowrap;min-width:3.5rem}.row-status.saving{color:var(--warn)}.row-status.saved{color:var(--ok);animation:flash-ok 1.2s var(--ease)}.row-status.error{color:var(--danger);background:none;border:none;padding:0;margin:0}@keyframes flash-ok{0%{opacity:0}20%{opacity:1}to{opacity:.85}}.save-hint{font-size:.78rem;color:var(--muted);margin:-.5rem 0 1rem}.login-page{min-height:100%;display:grid;place-items:center;padding:2rem;position:relative;overflow:hidden}.login-page:before{content:"";position:absolute;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle,rgba(61,184,168,.14),transparent 70%);top:-120px;right:-80px;pointer-events:none;animation:drift 12s ease-in-out infinite alternate}.login-page:after{content:"";position:absolute;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(90,130,180,.1),transparent 70%);bottom:-100px;left:-60px;pointer-events:none;animation:drift 14s ease-in-out infinite alternate-reverse}@keyframes drift{0%{transform:translate(0)}to{transform:translate(24px,16px)}}.login-box{width:min(400px,100%);border:1px solid var(--border);border-radius:var(--radius-lg);background:color-mix(in srgb,var(--bg-elev) 94%,transparent);padding:1.85rem;box-shadow:var(--shadow);position:relative;z-index:1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fade-in .4s var(--ease)}.login-box .brand{margin-bottom:1.25rem;padding:0}.login-box h1{margin-bottom:.2rem}.login-box .btn{width:100%;margin-top:.35rem;padding:.65rem 1rem}.check-row{display:flex;align-items:center;gap:.5rem;margin:.5rem 0 1rem;color:var(--muted);font-size:.9rem}.zone-list{display:flex;flex-direction:column;gap:.25rem;max-height:180px;overflow:auto;border:1px solid var(--border);border-radius:var(--radius);padding:.45rem;background:var(--bg-input)}.row-actions{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:flex-end}.file-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center}.file-btn input[type=file]{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.bulk-result{margin-top:1rem;white-space:pre-wrap;font-size:.8rem;color:var(--muted);max-height:240px;overflow:auto;padding:.75rem;border-radius:var(--radius);background:var(--bg-input);border:1px solid var(--border)}.loading-page{min-height:100%;display:grid;place-items:center;color:var(--muted);letter-spacing:.04em;font-size:.9rem}@media(max-width:800px){.shell{grid-template-columns:1fr}.nav{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;border-right:none;border-bottom:1px solid var(--border);padding:.85rem}.brand{margin:0 .75rem 0 0}.nav-section{display:none}.nav-foot{width:100%;margin-top:.5rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem}.nav-foot .user-email{margin:0}.main{padding:1.25rem}}
