:root{--bg: #1B0B2E;--surface: #2A1545;--border: #3D2A5C;--text: #FFFFFF;--muted: #B9A9CF;--primary: #FF2E86;--play: #FF8A00;--accent: #FFD43B;--electric: #30B9FF}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}a{color:inherit;text-decoration:none}button{background:var(--primary);color:#fff;border:0;padding:10px 16px;border-radius:6px;cursor:pointer;font-size:14px}button.secondary{background:var(--surface);border:1px solid var(--border)}input,select,textarea{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:10px;font-size:14px;width:100%}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px;border-bottom:1px solid var(--border)}th{color:var(--muted);font-weight:600}.layout{display:flex;min-height:100vh}.sidebar{width:220px;background:var(--surface);padding:20px;border-right:1px solid var(--border)}.sidebar h1{color:var(--primary);font-size:22px}.brand-logo{width:100%;max-width:170px;display:block;margin:0 auto 18px}.login-logo{width:220px;display:block;margin:0 auto 6px}.slogan{color:var(--accent);text-align:center;font-weight:700;font-size:13px;margin:0 0 14px}.sidebar nav a{display:block;padding:10px;border-radius:6px;color:var(--muted)}.sidebar nav a.active{background:var(--bg);color:var(--text)}.nav-group{margin-top:16px}.nav-group:first-of-type{margin-top:4px}.nav-section{width:100%;display:flex;align-items:center;justify-content:space-between;margin:0 0 2px;padding:8px 10px;background:transparent;border:0;border-radius:6px;cursor:pointer;font-family:inherit;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left}.nav-section:hover{color:var(--text)}.nav-section:focus-visible{outline:2px solid var(--electric);outline-offset:-2px}.nav-chevron{display:inline-flex;transition:transform .18s ease}.nav-chevron.open{transform:rotate(180deg)}.sidebar nav a.nav-item{display:flex;align-items:center;gap:10px}.sidebar nav a.nav-item:hover{color:var(--text)}.sidebar nav a.nav-item.active .nav-icon{color:var(--accent)}.sidebar nav a.nav-item:focus-visible{outline:2px solid var(--electric);outline-offset:-2px}.nav-icon{display:inline-flex;flex:0 0 auto}@media(max-width:760px){.layout{flex-direction:column}.sidebar{width:100%;border-right:0;border-bottom:1px solid var(--border);padding:16px}.brand-logo{max-width:130px;margin:0 0 12px}}.content{flex:1;padding:28px}.card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:20px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}.row{display:flex;gap:12px;align-items:center}.login-box{max-width:380px;margin:12vh auto}.field{margin-bottom:14px}.label{display:block;color:var(--muted);margin-bottom:6px;font-size:13px}.error{color:var(--primary);margin:8px 0}.table-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}.table-search{max-width:300px}.table-count{color:var(--muted);font-size:13px}.pagination{display:flex;align-items:center;gap:12px;margin-top:12px}.pagination span{color:var(--muted);font-size:13px}.pagination button:disabled{opacity:.5;cursor:default}@media(max-width:700px){.responsive-table thead{display:none}.responsive-table,.responsive-table tbody,.responsive-table tr,.responsive-table td{display:block;width:100%}.responsive-table tr{background:var(--bg);border:1px solid var(--border);border-radius:8px;margin-bottom:10px;padding:6px 12px}.responsive-table td{display:flex;justify-content:space-between;align-items:center;gap:12px;border:0;padding:7px 0;text-align:right}.responsive-table td:before{content:attr(data-label);color:var(--muted);font-weight:600;text-align:left;margin-right:auto}}.password-wrap{position:relative}.password-wrap input{padding-right:44px}.password-toggle{position:absolute;top:0;right:0;height:100%;display:flex;align-items:center;justify-content:center;width:40px;padding:0;border:0;border-radius:0 6px 6px 0;background:transparent;color:var(--muted);cursor:pointer}.password-toggle:hover{color:var(--text)}.password-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
