*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:radial-gradient(1200px 700px at 60% -10%,rgba(42,75,255,.18),transparent 60%),radial-gradient(800px 500px at 10% 10%,rgba(255,138,0,.10),transparent 60%),#060d1a;color:#e8eefc}a{color:inherit;text-decoration:none}input,select,textarea,button{font:inherit}textarea{min-height:120px;resize:vertical}
.container{max-width:1200px;margin:0 auto;padding:18px}
.muted{opacity:.72}
.card{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:16px}
.grid{display:grid;gap:14px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.h1{font-size:22px;font-weight:800;margin:0 0 12px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:10px;padding:10px 12px;border:1px solid rgba(255,255,255,.12);background:#1a2a4d;color:#e8eefc;cursor:pointer}
.btn:hover{filter:brightness(1.05)}.btn-primary{background:#ff8a00;border-color:rgba(255,138,0,.6);color:#101522}.btn-ghost{background:transparent;border-color:rgba(255,255,255,.18)}
.btn-primary:hover{filter:brightness(1.02)}
.btn-danger{background:rgba(255,0,102,.18);border-color:rgba(255,0,102,.35)}.btn-success{background:rgba(0,255,153,.12);border-color:rgba(0,255,153,.25)}
.btn-sm{padding:6px 10px;border-radius:9px;font-size:12px}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:11px 10px;border-bottom:1px solid rgba(255,255,255,.06);text-align:left;vertical-align:middle}.table th{font-size:11px;letter-spacing:.09em;text-transform:uppercase;opacity:.65}
.table tbody tr:hover{background:rgba(255,255,255,.03)}
.pill{display:inline-flex;align-items:center;border-radius:999px;padding:4px 10px;border:1px solid rgba(255,255,255,.12);font-size:12px;opacity:.92}.pill-ok{border-color:rgba(0,255,153,.25);background:rgba(0,255,153,.07)}.pill-warn{border-color:rgba(255,214,0,.28);background:rgba(255,214,0,.07)}.pill-bad{border-color:rgba(255,0,102,.3);background:rgba(255,0,102,.07)}
.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:12px;letter-spacing:.04em;text-transform:uppercase;opacity:.72}
.field input,.field select,.field textarea{padding:10px 11px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#0b1326;color:#e8eefc;outline:none}
.field input:focus,.field select:focus,.field textarea:focus{border-color:rgba(42,75,255,.6);box-shadow:0 0 0 3px rgba(42,75,255,.15)}
.alert{border-radius:12px;padding:12px 14px;border:1px solid rgba(255,255,255,.12);margin:0 0 14px}.alert-success{border-color:rgba(0,255,153,.25);background:rgba(0,255,153,.07)}.alert-error{border-color:rgba(255,0,102,.3);background:rgba(255,0,102,.07)}.alert-info{border-color:rgba(42,75,255,.35);background:rgba(42,75,255,.12)}
.split{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.small{font-size:13px;opacity:.85}

.app{display:flex;min-height:100vh}
.sidebar{width:240px;background:linear-gradient(180deg,rgba(12,22,42,.96),rgba(10,18,33,.96));border-right:1px solid rgba(255,255,255,.06);padding:14px;display:flex;flex-direction:column;gap:14px}
.sidebar-brand{font-weight:800;letter-spacing:.2px;font-size:16px;padding:10px 10px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06)}
.sidebar-sub{font-weight:500;font-size:12px;opacity:.7;margin-top:3px}
.sidebar-title{font-size:11px;letter-spacing:.12em;text-transform:uppercase;opacity:.6;margin:6px 10px}
.sidebar-section{display:flex;flex-direction:column;gap:6px}
.sidebar-link{display:flex;align-items:center;gap:10px;padding:10px 10px;border-radius:10px;opacity:.86;border:1px solid transparent}
.sidebar-link:hover{opacity:1;background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.06)}
.sidebar-link.is-active{opacity:1;background:rgba(255,138,0,.14);border-color:rgba(255,138,0,.35)}
.sicon{width:18px;height:18px;border-radius:6px;display:inline-block;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.10)}
.sicon.orange{background:rgba(255,138,0,.18);border-color:rgba(255,138,0,.35)}
.sicon.blue{background:rgba(42,75,255,.18);border-color:rgba(42,75,255,.35)}
.sicon.green{background:rgba(0,255,153,.12);border-color:rgba(0,255,153,.25)}
.sidebar-footer{margin-top:auto;display:flex;flex-direction:column;gap:10px;padding:10px 10px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06)}
.sidebar-user{font-size:12px;opacity:.75;word-break:break-all}
.api-indicator{display:flex;align-items:center;gap:8px;font-size:12px;opacity:.85}
.dot{width:8px;height:8px;border-radius:999px;display:inline-block}
.dot-ok{background:#00ff99;box-shadow:0 0 0 3px rgba(0,255,153,.12)}
.dot-bad{background:#ff0066;box-shadow:0 0 0 3px rgba(255,0,102,.12)}

.main{flex:1;display:flex;flex-direction:column}
.main-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.06);background:rgba(10,18,33,.55);backdrop-filter:blur(12px);position:sticky;top:0;z-index:5}
.main-title{font-weight:800;font-size:16px;opacity:.95}
.main-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.container-main{padding-top:16px}

.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tab{padding:7px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);font-size:12px;opacity:.8}
.tab:hover{opacity:1}
.tab.is-active{opacity:1;background:rgba(255,138,0,.14);border-color:rgba(255,138,0,.35)}

[data-modal]{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.55);padding:16px;z-index:50;backdrop-filter:blur(10px)}
[data-modal][data-open]{display:flex}
.modal-card{width:min(640px,100%);background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px;box-shadow:0 24px 60px rgba(0,0,0,.55)}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.modal-title{font-weight:800}
.modal-sub{font-size:13px;opacity:.75;margin-top:2px}
.modal-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:12px}
.modal-card.modal-iframe{width:min(720px,100%);padding:0;overflow:hidden}
.modal-iframe-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 14px;border-bottom:1px solid rgba(255,255,255,.06);background:rgba(0,0,0,.18)}
.modal-iframe-title{font-weight:800}
.modal-iframe-frame{width:100%;height:min(70vh,560px);border:0;display:block;background:transparent}

.actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.act{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);font-size:12px;opacity:.9}
.act:hover{opacity:1}
.act.yellow{background:rgba(255,214,0,.12);border-color:rgba(255,214,0,.28)}
.act.blue{background:rgba(42,75,255,.14);border-color:rgba(42,75,255,.35)}
.act.green{background:rgba(0,255,153,.10);border-color:rgba(0,255,153,.25)}
.act.red{background:rgba(255,0,102,.12);border-color:rgba(255,0,102,.30)}
.act .dot{width:7px;height:7px}

.lic-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.lic-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.search{display:flex;align-items:center;gap:8px}
.search input{min-width:320px;max-width:420px}

.kbd{font-size:11px;opacity:.7;border:1px solid rgba(255,255,255,.14);border-bottom-width:2px;border-radius:8px;padding:2px 6px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}