:root{--bg: #ffffff;--panel: #f5f5f5;--panel-2: #e5e5e5;--text: #1a1a1a;--muted: #666666;--border: rgba(220,38,38,.2);--shadow: 0 2px 8px rgba(0,0,0,.08);--primary: #dc2626;--primary-2: #b91c1c;--good: #16a34a;--warn: #ea580c;--danger: #dc2626;--radius: 16px;--radius-sm: 12px;--gap: 16px;--gap-lg: 24px;--font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:var(--font);color:var(--text);background:linear-gradient(135deg,#fafafa,#f0f0f0)}a{color:inherit;text-decoration:none}button,input,select{font-family:inherit}.row{display:flex;align-items:center;gap:var(--gap)}.shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;padding:22px 18px;border-right:2px solid #dc2626;background:linear-gradient(180deg,#1a1a1a,#0a0a0a);box-shadow:4px 0 16px #dc262626}.sidebar .brand{display:flex;align-items:center;gap:10px;padding:12px 14px;border:2px solid rgba(220,38,38,.5);background:linear-gradient(135deg,#dc262633,#991b1b26);border-radius:var(--radius);box-shadow:0 4px 16px #dc262640}.sidebar .brand *{color:#fff}.brand-badge{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#dc2626,#991b1b);display:grid;place-items:center;font-weight:800;font-size:1.2rem;color:#fff;box-shadow:0 4px 12px #dc262666}.nav{margin-top:18px;display:flex;flex-direction:column;gap:8px}.nav a{padding:12px 14px;border-radius:12px;border:1px solid transparent;color:#b3b3b3;display:flex;align-items:center;gap:12px;transition:all .2s ease;font-weight:500}.nav a:hover{color:#fff;background:#dc262640;border-color:#dc262680;transform:translate(4px)}.nav a.active{color:#fff;background:linear-gradient(135deg,#dc262659,#991b1b4d);border-color:#dc2626b3;box-shadow:0 2px 8px #dc26264d}.main{padding:22px 22px 40px;background:#fafafa}.topbar{display:flex;align-items:center;gap:12px;padding:16px 18px;border:1px solid rgba(0,0,0,.08);background:linear-gradient(135deg,#fff,#fafafa);border-radius:var(--radius);box-shadow:0 2px 12px #0000000f}.search{flex:1;display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;border:1px solid rgba(0,0,0,.12);background:#fff;transition:all .2s ease}.search:focus-within{border-color:#dc262666;box-shadow:0 0 0 3px #dc262614}.search input{width:100%;border:none;outline:none;background:transparent;color:var(--text)}.search input::placeholder{color:var(--muted);opacity:.7}.content{margin-top:18px}.card{border:1px solid rgba(0,0,0,.08);background:#fff;border-radius:var(--radius);box-shadow:0 4px 16px #0000000f;transition:all .2s ease}.card:hover{box-shadow:0 6px 20px #0000001a;transform:translateY(-2px)}.card-h{padding:18px 20px 14px;border-bottom:2px solid rgba(220,38,38,.15);background:linear-gradient(135deg,#fafafa,#fff)}.card-b{padding:20px}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}.col-12{grid-column:span 12}.col-8{grid-column:span 8}.col-6{grid-column:span 6}.col-4{grid-column:span 4}.col-3{grid-column:span 3}@media (max-width: 980px){.shell{grid-template-columns:1fr}.sidebar{height:auto;position:relative}.grid{grid-template-columns:repeat(6,1fr)}.col-8,.col-6,.col-4,.col-3{grid-column:span 6}}.field{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}label{font-size:.9rem;color:var(--text);font-weight:600}input,select{padding:12px 14px;border-radius:12px;border:2px solid rgba(0,0,0,.12);background:#fff;color:var(--text);outline:none;transition:all .2s ease;font-size:.95rem}input:focus,select:focus{border-color:#dc2626;box-shadow:0 0 0 4px #dc26261f;background:#fff}.btn{padding:12px 18px;border-radius:12px;border:2px solid rgba(0,0,0,.12);background:#fff;color:var(--text);cursor:pointer;transition:all .2s ease;font-weight:600;font-size:.95rem}.btn:hover{background:#fafafa;border-color:#dc262666;transform:translateY(-2px);box-shadow:0 4px 16px #0000001f}.btn-primary{border:none;background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;font-weight:700;box-shadow:0 4px 12px #dc26264d}.btn-primary:hover{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 8px 20px #dc262666;transform:translateY(-3px)}.btn-primary:active{transform:translateY(-1px)}.pill{font-size:.8rem;padding:6px 12px;border-radius:999px;border:1px solid rgba(0,0,0,.15);color:var(--text);background:linear-gradient(135deg,#f5f5f5,#e5e5e5);font-weight:600;box-shadow:0 2px 4px #0000000d}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:14px 12px;border-bottom:1px solid rgba(0,0,0,.08);color:var(--muted)}.table th{color:var(--text);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.8px;background:linear-gradient(135deg,#fafafa,#f5f5f5);border-bottom:2px solid rgba(220,38,38,.2)}.table tbody tr{transition:all .2s ease}.table tbody tr:hover{background:#dc26260a;transform:scale(1.005);box-shadow:0 2px 8px #0000000a}.empty{padding:24px;border:2px dashed rgba(220,38,38,.3);border-radius:16px;background:linear-gradient(135deg,#dc262605,#dc26260d);color:var(--muted);text-align:center;font-weight:500}.row{display:flex;align-items:center;gap:8px}.spacer{flex:1}.muted{color:var(--muted)}button:disabled{opacity:.5;cursor:not-allowed;transform:none!important}@media (max-width: 768px){.shell{grid-template-columns:1fr}.sidebar{height:auto;position:relative;padding:16px;border-right:none;border-bottom:2px solid #dc2626}.sidebar .brand{padding:10px 12px}.brand-badge{width:36px;height:36px;font-size:1rem}.nav{margin-top:12px;flex-direction:row;flex-wrap:wrap;gap:6px}.nav a{padding:10px 14px;font-size:.9rem;flex:1;min-width:120px;justify-content:center}.main{padding:16px}.topbar{flex-direction:column;padding:14px;gap:10px}.search{width:100%}.content{margin-top:12px}.grid{grid-template-columns:1fr;gap:12px}.col-12,.col-8,.col-6,.col-4,.col-3{grid-column:span 1}.card{border-radius:12px}.card-h,.card-b{padding:14px 16px}.row{flex-wrap:wrap;gap:10px}.btn{padding:12px 16px;width:100%;font-size:1rem;min-height:48px}.row .btn{flex:1;min-width:140px}.field{margin-bottom:14px}input,select{padding:14px;font-size:1rem;min-height:48px}.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}.table{min-width:600px}.table th,.table td{padding:12px 10px;font-size:.9rem}.pill{font-size:.75rem;padding:5px 10px}.empty{padding:20px 16px;font-size:.9rem}.row button{min-height:44px;padding:10px 16px}}@media (max-width: 480px){.brand-badge{width:32px;height:32px;font-size:.9rem}.sidebar .brand{gap:8px}.sidebar .brand div:last-child{font-size:.9rem}.nav a{padding:10px;font-size:.85rem;min-width:100px}.main{padding:12px}.card-h,.card-b{padding:12px 14px}h1,h2,h3{font-size:1.2rem}.btn{font-size:.95rem}.row .btn{min-width:100%}.table{font-size:.85rem}.table th,.table td{padding:10px 8px}}
