:root{--bg:#09101f;--panel:#10182d;--panel2:#141f39;--line:#26365f;--text:#f4f6fb;--muted:#9aa8c8;--accent:#89a2ff;--ok:#59d7a5}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(180deg,#08101f,#0b1324);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}
button,select{font:inherit}.top{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;border-bottom:1px solid var(--line);background:#09101fe8;position:sticky;top:0;z-index:5}
.brand-block{display:flex;align-items:center;gap:12px}.brand-mark{width:42px;height:42px;border-radius:13px;background:linear-gradient(145deg,#738cff,#4c64c7);display:grid;place-items:center;font-weight:900}.brand-block strong{display:block;font-size:16px}.brand-block small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.top-actions{display:flex;gap:10px;align-items:center}select,.icon-btn{background:#0d1629;color:var(--text);border:1px solid var(--line);border-radius:10px}.top select{padding:8px 10px}.icon-btn{width:40px;height:40px;font-size:20px}
.shell{max-width:1120px;margin:auto;padding:28px 20px 64px}.hero{display:grid;grid-template-columns:1fr 250px;gap:20px;align-items:end;padding:24px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,#142143,#0e172c)}
.eyebrow{font-size:10px;letter-spacing:.15em;color:var(--accent);font-weight:800}h1{font-size:clamp(28px,4vw,44px);line-height:1.06;margin:8px 0 12px}h2{font-size:24px;margin:5px 0 10px}p,small{color:var(--muted);line-height:1.5}.hero p{font-size:15px}
.status-strip{display:flex;gap:11px;align-items:center;background:#0a1325;border:1px solid var(--line);padding:15px;border-radius:14px}.dot{width:10px;height:10px;background:var(--ok);border-radius:50%;box-shadow:0 0 14px var(--ok)}.status-strip small{display:block}
.branch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0 28px}.branch-grid article{display:flex;gap:13px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:15px;background:var(--panel);cursor:pointer}.branch-grid article:hover{border-color:var(--accent)}
.branch-no{font-size:24px;font-weight:800;color:var(--accent);min-width:36px}.branch-grid strong{display:block;font-size:14px}.branch-grid small{display:block;font-size:11px;margin-top:4px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.card{min-height:175px;padding:18px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(160deg,var(--panel2),var(--panel));display:flex;flex-direction:column;justify-content:space-between}.card.off{display:none}
.tag{display:inline-block;border:1px solid var(--line);padding:5px 9px;border-radius:999px;color:var(--accent);font-size:10px;font-weight:800}.card h3{font-size:17px;margin:9px 0 6px}.card p{font-size:13px;margin:0}.meta{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:10px;color:var(--muted)}
.open,.primary{border-radius:9px;padding:9px 12px;font-weight:700}.open{background:transparent;color:var(--text);border:1px solid var(--line)}.primary{width:100%;margin-top:16px;background:var(--accent);color:#08101f;border:0}
.internal{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:22px;padding:20px;border:1px dashed #354979;border-radius:16px;background:#0d172ab8}.tags{display:flex;flex-wrap:wrap;gap:7px}.tags span{border:1px solid var(--line);padding:6px 9px;border-radius:999px;color:var(--muted);font-size:10px}
.panel{position:fixed;right:0;top:0;height:100vh;width:min(440px,100%);z-index:10;background:#0c1427;border-left:1px solid var(--line);padding:20px;overflow:auto;box-shadow:-30px 0 80px #0008}.hidden{display:none}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}
.company{padding:15px;border:1px solid var(--line);border-radius:13px;background:var(--panel);margin-bottom:10px}.company-head{display:flex;justify-content:space-between;gap:10px}.company small{display:block;margin-top:5px}.gateway-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.gateway-tags span{font-size:9px;padding:5px 7px;border-radius:999px;border:1px solid var(--line);color:var(--accent)}
.control-row{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.switch{position:relative;width:46px;height:26px}.switch input{display:none}.slider{position:absolute;inset:0;background:#293253;border-radius:999px}.slider:before{content:"";position:absolute;width:18px;height:18px;left:4px;top:4px;background:white;border-radius:50%;transition:.2s}.switch input:checked+.slider{background:#6d8cff}.switch input:checked+.slider:before{transform:translateX(20px)}
.notice{margin-top:18px;padding:12px;border-left:3px solid var(--accent);background:#111a35;color:var(--muted);font-size:12px}footer{text-align:center;padding:22px;color:var(--muted);border-top:1px solid var(--line);font-size:12px}
@media(max-width:980px){.branch-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.shell{padding:18px 14px 56px}.hero{grid-template-columns:1fr;padding:18px}h1{font-size:30px}.grid{grid-template-columns:1fr}.branch-grid{grid-template-columns:1fr 1fr}.internal{display:block}.tags{margin-top:14px}}@media(max-width:430px){.branch-grid{grid-template-columns:1fr}}