:root{--bg: #07090F;--s1: #0E1117;--s2: #161C27;--s3: #1C2333;--b1: #252D3D;--b2: #2E3A50;--b3: #3D4F6A;--accent: #F97316;--accent-hover: #FB923C;--accent-soft: rgba(249,115,22,.1);--accent-border: rgba(249,115,22,.25);--tx: #E8EFF8;--t2: #8D9BB0;--t3: #5A6880;--ok: #22C55E;--ok-soft: rgba(34,197,94,.1);--err: #EF4444;--err-soft: rgba(239,68,68,.1);--warn: #EAB308;--warn-soft: rgba(234,179,8,.1);--info: #3B82F6;--info-soft: rgba(59,130,246,.1);--radius: 8px;--sidebar-width: 232px;--role-accent: #F97316;--role-soft: rgba(249,115,22,.1);--role-border: rgba(249,115,22,.25);--role-grad: linear-gradient(135deg,#F97316,#F59E0B)}body.role-admin{--role-accent: #3B82F6;--role-soft: rgba(59,130,246,.1);--role-border: rgba(59,130,246,.25);--role-grad: linear-gradient(135deg,#3B82F6,#60A5FA);--accent: #3B82F6;--accent-hover: #60A5FA;--accent-soft: rgba(59,130,246,.1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:DM Sans,Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--tx);font-size:13px;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--b2);border-radius:4px}input:focus,select:focus,textarea:focus{border-color:var(--role-accent)!important;outline:none;box-shadow:0 0 0 3px var(--role-soft)}button{cursor:pointer;font-family:inherit;transition:all .15s}button:hover{opacity:.88}a{color:var(--role-accent);text-decoration:none}.app-layout{display:flex;height:100vh;overflow:hidden}.sidebar{width:var(--sidebar-width);background:var(--s1);border-right:1px solid var(--b1);display:flex;flex-direction:column;flex-shrink:0;transition:width .22s cubic-bezier(.4,0,.2,1);overflow:hidden}.sidebar.collapsed{width:60px}.sidebar-logo{padding:18px 14px 14px;border-bottom:1px solid var(--b1);display:flex;align-items:center;gap:10px;flex-shrink:0}.sidebar-logo-icon{width:34px;height:34px;border-radius:9px;background:var(--role-grad);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:#fff;flex-shrink:0;box-shadow:0 4px 12px var(--role-soft)}.sidebar-logo-text{font-size:15px;font-weight:800;letter-spacing:-.02em;white-space:nowrap}.sidebar-logo-sub{font-size:9px;color:var(--t3);white-space:nowrap;margin-top:1px}.sidebar-nav{flex:1;padding:10px 8px;overflow-y:auto}.nav-section-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--t3);padding:14px 8px 5px;white-space:nowrap}.nav-item{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:7px;color:var(--t2);background:transparent;font-weight:500;font-size:12px;border:none;width:100%;text-align:left;transition:all .14s;margin-bottom:2px;white-space:nowrap}.nav-item:hover{background:var(--s2);color:var(--tx)}.nav-item.active{color:var(--role-accent);background:var(--role-soft);font-weight:600}.sidebar.collapsed .nav-item{justify-content:center;padding:9px 0}.sidebar.collapsed .nav-section-label{opacity:0;height:0;padding:0;overflow:hidden}.sidebar-footer{padding:12px 8px;border-top:1px solid var(--b1);flex-shrink:0}.sidebar-user{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;background:var(--s2);cursor:default}.sidebar-user-avatar{width:30px;height:30px;border-radius:8px;background:var(--role-grad);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;color:#fff;flex-shrink:0}.sidebar-user-name{font-size:12px;font-weight:600;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user-role{font-size:9px;color:var(--t3);white-space:nowrap}.logout-btn{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:7px;margin-top:4px;color:var(--t3);background:transparent;font-weight:500;font-size:12px;border:none;width:100%;text-align:left;transition:all .14s}.logout-btn:hover{background:var(--err-soft);color:var(--err)}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.header{padding:0 24px;height:56px;border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;background:var(--s1);flex-shrink:0}.header-title{font-size:17px;font-weight:700;letter-spacing:-.01em}.header-left,.header-right{display:flex;align-items:center;gap:12px}.role-badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;font-size:10px;font-weight:700;background:var(--role-soft);color:var(--role-accent);border:1px solid var(--role-border);text-transform:uppercase;letter-spacing:.06em}.header-avatar{width:30px;height:30px;border-radius:8px;background:var(--role-grad);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px;color:#fff;box-shadow:0 2px 8px var(--role-soft)}.page-content{flex:1;padding:22px 24px;overflow-y:auto}.card{background:var(--s1);border-radius:12px;border:1px solid var(--b1);overflow:hidden}.card-header{padding:14px 18px;border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between}.card-title{font-size:13px;font-weight:700}.card-body{padding:16px 18px}.btn{border:none;border-radius:8px;font-weight:600;font-family:inherit;display:inline-flex;align-items:center;gap:6px;transition:all .15s;line-height:1;padding:8px 14px;font-size:12px}.btn-sm{padding:5px 10px;font-size:11px;border-radius:6px}.btn-lg{padding:10px 20px;font-size:13px}.btn-primary{background:var(--role-grad);color:#fff;box-shadow:0 2px 8px var(--role-soft)}.btn-primary:hover{opacity:1;filter:brightness(1.08)}.btn-secondary{background:var(--s3);color:var(--tx);border:1px solid var(--b2)}.btn-danger{background:var(--err-soft);color:var(--err);border:1px solid rgba(239,68,68,.2)}.btn-ghost{background:transparent;color:var(--t2);padding:5px 7px}.btn-success{background:var(--ok-soft);color:var(--ok)}.form-input{width:100%;padding:9px 12px;border-radius:8px;border:1px solid var(--b2);background:var(--s2);color:var(--tx);font-size:12px;font-family:inherit;outline:none;transition:all .15s}.form-input::placeholder{color:var(--t3)}.form-label{font-size:10px;font-weight:700;color:var(--t3);margin-bottom:5px;display:block;text-transform:uppercase;letter-spacing:.06em}.form-field{margin-bottom:14px}.form-row{display:grid;gap:12px}.form-row-2{grid-template-columns:1fr 1fr}.form-row-3{grid-template-columns:1fr 1fr 1fr}.form-checkbox{display:flex;align-items:center;gap:7px;font-size:12px;cursor:pointer}.data-table{width:100%;border-collapse:collapse}.data-table th{padding:9px 14px;text-align:left;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--t3);border-bottom:1px solid var(--b1);background:var(--s2);white-space:nowrap}.data-table td{padding:11px 14px;border-bottom:1px solid var(--b1);font-size:12px;color:var(--tx)}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td{background:var(--s2)}.data-table tbody tr{transition:background .1s}.badge{padding:3px 9px;border-radius:50px;font-size:10px;font-weight:700;display:inline-block}.badge-ok{background:var(--ok-soft);color:var(--ok)}.badge-err{background:var(--err-soft);color:var(--err)}.badge-warn{background:var(--warn-soft);color:var(--warn)}.badge-info{background:var(--info-soft);color:var(--info)}.tag{padding:2px 8px;border-radius:5px;font-size:10px;font-weight:600;background:var(--s3);color:var(--t2);display:inline-block;margin:1px}.stat-card{background:var(--s1);border-radius:12px;border:1px solid var(--b1);padding:20px 18px;position:relative;overflow:hidden;transition:border-color .2s,transform .2s}.stat-card:hover{border-color:var(--b2);transform:translateY(-1px)}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--stat-color, var(--role-accent))}.stat-value{font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1}.stat-label{font-size:11px;color:var(--t3);margin-top:6px;font-weight:500}.stat-icon{position:absolute;right:16px;top:50%;transform:translateY(-50%);opacity:.07;font-size:48px}.search-box{position:relative}.search-box input{padding-left:34px}.search-box-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--t3);display:flex;pointer-events:none}.file-zone{border:2px dashed var(--b2);border-radius:10px;padding:22px 16px;text-align:center;cursor:pointer;background:var(--s2);transition:all .2s}.file-zone:hover,.file-zone.dragging{border-color:var(--role-accent);background:var(--role-soft)}.file-zone-bulk{border-color:var(--info)}.file-zone-title{font-weight:600;font-size:12px;margin-top:8px}.file-zone-sub{font-size:10px;color:var(--t3);margin-top:3px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:20px}.modal-box{background:var(--s1);border-radius:16px;border:1px solid var(--b2);width:100%;max-width:560px;max-height:88vh;overflow:auto;box-shadow:0 24px 80px #0009;animation:modalIn .2s ease}.modal-box.wide{max-width:820px}@keyframes modalIn{0%{transform:scale(.96) translateY(8px);opacity:0}to{transform:none;opacity:1}}.modal-header{padding:16px 20px;border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;font-size:15px;font-weight:700;position:sticky;top:0;background:var(--s1);z-index:1}.modal-body{padding:20px}.modal-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--b1)}.tabs{display:flex;border-bottom:1px solid var(--b1);margin-bottom:16px}.tab{padding:9px 16px;font-size:12px;font-weight:500;color:var(--t2);border:none;background:none;border-bottom:2px solid transparent;font-family:inherit;cursor:pointer;transition:all .15s}.tab.active{color:var(--role-accent);font-weight:700;border-bottom-color:var(--role-accent)}.tab:hover:not(.active){color:var(--tx)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.flex-between{display:flex;justify-content:space-between;align-items:center}.flex-end{display:flex;justify-content:flex-end}.mb-12{margin-bottom:12px}.mb-14{margin-bottom:14px}.mb-16{margin-bottom:16px}.mb-24{margin-bottom:24px}.empty-state{padding:52px 20px;text-align:center;color:var(--t3)}.empty-state-icon{font-size:36px;margin-bottom:10px;opacity:.4}.empty-state-title{font-size:14px;font-weight:600;color:var(--t2);margin-bottom:4px}.empty-state-sub{font-size:12px}.section-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:10px;flex-wrap:wrap}.section-bar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.section-bar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}@keyframes slideUp{0%{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}.divider{height:1px;background:var(--b1);margin:16px 0}body.light{--bg: #F0F2F7;--s1: #FFFFFF;--s2: #F5F7FA;--s3: #EAECF0;--b1: #DDE1E9;--b2: #C8CDD8;--b3: #A0A8B8;--tx: #0F1623;--t2: #4A5568;--t3: #8896AB;--ok: #16A34A;--ok-soft: rgba(22,163,74,.1);--err: #DC2626;--err-soft: rgba(220,38,38,.1);--warn: #CA8A04;--warn-soft: rgba(202,138,4,.1);--info: #2563EB;--info-soft: rgba(37,99,235,.1)}body.light input,body.light select,body.light textarea{background:#fff;color:#0f1623}body.light .form-input{background:#fff;border-color:var(--b1)}body.light .data-table th{background:var(--s2)}body.light .sidebar{box-shadow:2px 0 12px #0000000f}body.light .header{box-shadow:0 1px 8px #0000000f}body.light .modal-box{box-shadow:0 24px 80px #00000026}