*{box-sizing:border-box}
body{margin:0;background:#0f1115;color:#e8eaf0;font-family:Inter,system-ui,Segoe UI,sans-serif;font-size:13px}
.topbar{display:flex;align-items:center;gap:18px;padding:12px 18px;background:#161a22;border-bottom:1px solid #232834}
.brand{font-weight:700}.logo{color:#7db3ff}
.tabs{display:flex;gap:6px}
.tab{background:transparent;border:1px solid transparent;color:#cfd5e2;padding:5px 12px;border-radius:6px;cursor:pointer;font:inherit;opacity:.7}
.tab.active{opacity:1;background:rgba(125,179,255,.14);border-color:rgba(125,179,255,.35)}
.meta{margin-left:auto;color:#8b93a7}
.layout{max-width:1100px;margin:0 auto;padding:18px}
.hidden{display:none}
.app-header h2{margin:8px 0 4px}
.muted{color:#8b93a7}
.toolbar{margin:10px 0}
.ghost{background:#1d2330;border:1px solid #2b3342;color:#cfd5e2;border-radius:6px;padding:6px 12px;cursor:pointer}
table.appdb{width:100%;border-collapse:collapse;margin-top:8px}
table.appdb th,table.appdb td{text-align:left;padding:10px 12px;border-bottom:1px solid #232834;vertical-align:top}
table.appdb th{color:#9aa4b2;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
table.appdb a{color:#7db3ff;text-decoration:none;word-break:break-all}
.pill{padding:1px 8px;border-radius:10px;font-size:11px}
.pill.up{background:rgba(60,200,120,.15);color:#4ede9b}
.pill.down{background:rgba(240,90,90,.15);color:#ff7a7a}
.code{background:#12161d;border:1px solid #232834;border-radius:8px;padding:16px;overflow:auto;color:#cfe3ff;line-height:1.5}

.addrule{display:flex;gap:8px;margin:10px 0}
.addrule input{flex:1;background:#12161d;border:1px solid #2b3342;color:#e8eaf0;border-radius:6px;padding:8px}
.addrule select{background:#12161d;border:1px solid #2b3342;color:#cfd5e2;border-radius:6px;padding:8px}
.addrule button{background:#22406b;border:1px solid #35598f;color:#dbe9ff;border-radius:6px;padding:8px 14px;cursor:pointer}

.settings{display:flex;gap:8px;margin:10px 0;padding:10px;border:1px solid #2b3342;border-radius:8px;background:#12161d}
.settings input{flex:1;background:#0f131a;border:1px solid #2b3342;color:#e8eaf0;border-radius:6px;padding:8px}
.settings button{background:#1d2330;border:1px solid #2b3342;color:#cfd5e2;border-radius:6px;padding:8px 14px;cursor:pointer}
#rule-result{margin-top:8px}

.suggest{margin:10px 0;padding:12px;border:1px solid #35598f;border-radius:8px;background:#0f1622}
.suggest label{display:block;margin:6px 0;font-size:12px}
.suggest input,.suggest textarea{width:100%;background:#0f131a;border:1px solid #2b3342;color:#e8eaf0;border-radius:6px;padding:8px;font:inherit}
.suggest-actions{margin-top:8px;display:flex;gap:8px}
.suggest-actions button{background:#22406b;border:1px solid #35598f;color:#dbe9ff;border-radius:6px;padding:8px 14px;cursor:pointer}
.suggest-actions .ghost{background:#1d2330;border-color:#2b3342;color:#cfd5e2}