:root{--space: 8px;--bg: #f4f5f7;--fg: #1b1f24;--muted: #5c6570;--card: #ffffff;--accent: #0b6e4f;--accent-fg: #ffffff;--danger: #b42318;--border: #d5dbe3;--focus: #0b6e4f;font-family:Segoe UI,system-ui,sans-serif;color:var(--fg);background:var(--bg);line-height:1.4}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-size:16px}h1{font-size:24px;margin:0 0 calc(var(--space) * 2)}h2{font-size:20px;margin:0 0 var(--space)}p{font-size:16px;color:var(--muted)}.shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:calc(var(--space) * 3)}.card{background:var(--card);border:1px solid var(--border);border-radius:calc(var(--space) * 1.5);padding:calc(var(--space) * 3);width:100%;max-width:400px}label{display:block;font-size:14px;margin-bottom:var(--space)}input,select{width:100%;height:calc(var(--space) * 5);border:1px solid var(--border);border-radius:var(--space);padding:0 calc(var(--space) * 1.5);font-size:16px;margin-bottom:calc(var(--space) * 2);background:var(--card)}select:focus,input:focus{outline:2px solid var(--focus);outline-offset:1px}.checkbox{display:inline-flex;align-items:center;gap:var(--space);margin:0;font-size:14px}.checkbox input{width:auto;height:auto;margin:0}.hint{font-size:13px;color:var(--muted);margin:calc(var(--space) * -1) 0 var(--space)}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 calc(var(--space) * 2)}.user-form{margin-bottom:calc(var(--space) * 3)}button.danger{background:var(--danger);color:#fff;margin-left:var(--space)}.password-field{position:relative;margin-bottom:calc(var(--space) * 2)}.password-field input{margin-bottom:0;padding-right:calc(var(--space) * 5)}.password-field .eye{position:absolute;top:0;right:0;width:calc(var(--space) * 5);height:calc(var(--space) * 5);padding:0;margin:0;background:transparent;color:var(--muted);display:flex;align-items:center;justify-content:center}.password-field .eye:hover,.password-field .eye[aria-pressed=true]{color:var(--fg)}button{height:calc(var(--space) * 5);padding:0 calc(var(--space) * 2);border:0;border-radius:var(--space);background:var(--accent);color:var(--accent-fg);font-size:16px;cursor:pointer}button.secondary{background:transparent;color:var(--fg);border:1px solid var(--border);margin-left:var(--space)}button.linkish{height:auto;padding:0;margin:0;background:transparent;color:var(--accent);border:0;font-size:16px}.banner{background:#fdecea;color:var(--danger);padding:var(--space) calc(var(--space) * 1.5);border-radius:var(--space);margin-bottom:calc(var(--space) * 2);font-size:14px}.banner.ok{background:#e7f5ef;color:var(--accent)}button:disabled{opacity:.6;cursor:default}.row{display:flex;gap:var(--space);flex-wrap:wrap;align-items:center}.badge{display:inline-block;padding:2px calc(var(--space) * 1.5);border-radius:999px;background:#e7f5ef;color:var(--accent);font-size:14px}.badge.warn{background:#fff4d6;color:#8a5b00}.badge.bad{background:#fdecea;color:var(--danger)}.badge.muted{background:#eef1f4;color:var(--muted)}.app{min-height:100vh}.top{background:var(--card);border-bottom:1px solid var(--border);padding:calc(var(--space) * 2) calc(var(--space) * 3);display:flex;flex-wrap:wrap;gap:calc(var(--space) * 2);align-items:center;justify-content:space-between}.brand{font-weight:700;font-size:20px;color:var(--accent)}.nav{display:flex;flex-wrap:wrap;gap:var(--space)}.nav button{height:calc(var(--space) * 4);background:transparent;color:var(--fg);border:1px solid transparent;padding:0 calc(var(--space) * 1.5)}.nav button.active{border-color:var(--accent);color:var(--accent)}.page{padding:calc(var(--space) * 3);max-width:1100px;margin:0 auto}.toolbar{display:flex;flex-wrap:wrap;gap:var(--space);align-items:end;margin-bottom:calc(var(--space) * 2)}.toolbar input,.toolbar select{max-width:280px;margin-bottom:0}table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--border);border-radius:var(--space);overflow:hidden}th,td{text-align:left;padding:calc(var(--space) * 1.5);border-bottom:1px solid var(--border);font-size:14px;vertical-align:middle}th{background:#f8faf9;font-weight:600}.qty{width:88px}.wide{max-width:none}.empty{padding:calc(var(--space) * 3);color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.file-btn{display:inline-flex;align-items:center;height:40px;padding:0 16px;border:1px solid var(--border);border-radius:8px;cursor:pointer;background:var(--card)}.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.drop-target{outline:2px dashed var(--accent);outline-offset:4px;background:#e7f5ef}nav button:disabled{opacity:.45;cursor:not-allowed}@media (max-width: 720px){.page{padding:calc(var(--space) * 2)}.top{align-items:stretch}.nav,.row{width:100%}.row select,.row input{max-width:none;flex:1}}