.system-navigation { display:flex; gap:6px; padding:6px; margin:0 0 24px; border:1px solid var(--line); border-radius:14px; background:#0d151f; overflow-x:auto; }
.system-tab { display:flex; align-items:center; gap:10px; border:1px solid transparent; background:transparent; color:var(--muted); border-radius:9px; padding:12px 18px; cursor:pointer; font:inherit; font-size:13px; white-space:nowrap; }
.system-tab svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; }
.system-tab:hover { color:#e5f4f2; background:#ffffff05; }
.system-tab[aria-selected="true"] { color:#7ce6df; border-color:#305454; background:linear-gradient(110deg,#1c3b3e,#15292f); }
.system-tab:focus-visible { outline:2px solid var(--cyan); outline-offset:1px; }
.system-panel { animation:system-panel-in .15s ease-out; }
.system-panel .system-card { border-radius:14px; }
.system-panel > .system-card:first-child { margin-top:0; }
.system-panel-intro { margin:0 0 20px; }
.system-panel-intro h2 { margin:0 0 6px; font-size:20px; }
.system-panel-intro p { margin:0; font-size:13px; color:var(--muted); }
#system-panel-storage > form, #system-panel-api > section { max-width:900px; }
@keyframes system-panel-in { from { opacity:.6; transform:translateY(3px); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce){.system-panel{animation:none;}}
@media(max-width:700px){.system-navigation{margin-bottom:18px;gap:3px;}.system-tab{padding:10px 12px;gap:7px;font-size:12px;}}