:root{--navy:#08293f;--cyan:#00b8e3;--bg:#f3f7fa;--ink:#183045}*{box-sizing:border-box}body{margin:0;background:var(--bg);font:14px Arial,sans-serif;color:var(--ink)}button,input,select{font:inherit}button{cursor:pointer}.login{max-width:390px;margin:12vh auto;padding:32px;background:#fff;border-radius:12px;box-shadow:0 14px 45px #08293f22}.brand{color:var(--cyan);letter-spacing:3px;font-weight:bold}.login input,.form input,.form select{width:100%;margin:7px 0 15px;padding:10px;border:1px solid #ccd8df;border-radius:6px}.primary{background:var(--cyan);border:0;border-radius:6px;padding:10px 15px;font-weight:bold;color:#042534}.nav{background:var(--navy);color:#fff;display:flex;align-items:center;gap:10px;padding:13px 5%;position:sticky;top:0}.nav .spacer{flex:1}.nav button{background:transparent;border:0;color:#d9e9ef;padding:8px}.page{max-width:1200px;margin:25px auto;padding:0 16px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.card,.panel{background:#fff;border-radius:10px;padding:20px;box-shadow:0 3px 12px #08293f12}.card h3{margin:0 0 8px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.table{width:100%;border-collapse:collapse;background:#fff}.table th,.table td{padding:10px;border-bottom:1px solid #e6eef2;text-align:left}.table th{background:#eaf8fc}.muted{color:#6b7c87;font-size:12px}.notice{padding:10px;background:#fff4cf;border-radius:6px}.hide{display:none}@media(max-width:700px){.grid{grid-template-columns:1fr}.nav{flex-wrap:wrap}.table{font-size:12px}}
.component-grid{display:grid;grid-template-columns:1.2fr 1.5fr 1fr .65fr;gap:15px;align-items:center;margin:8px 0}@media(max-width:700px){.component-grid{grid-template-columns:1fr}}