:root{color-scheme:dark;--bg:#090c12;--card:#141924;--line:#2b3342;--accent:#2f80ed;--text:#f3f6fb;--muted:#9aa6b6;--danger:#b83b45}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% -20%,#182840 0,var(--bg) 42%);color:var(--text);font:15px system-ui,-apple-system,sans-serif;min-height:100vh}header{display:flex;align-items:center;justify-content:space-between;padding:22px 5vw;border-bottom:1px solid var(--line);background:rgba(9,12,18,.75)}h1,h2{margin:0 0 8px}a{color:#8ab9ff}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:24px 5vw}.card{background:linear-gradient(145deg,#171d29,#111620);border:1px solid var(--line);box-shadow:0 12px 35px rgba(0,0,0,.2);border-radius:12px;padding:20px}.span{grid-column:1/-1}form{display:grid;gap:12px}label{display:grid;gap:5px;color:var(--muted)}input,select,button{font:inherit;border-radius:7px;border:1px solid var(--line);padding:11px;background:#0d1119;color:var(--text)}button{background:var(--accent);border:0;font-weight:700;cursor:pointer}.danger{background:var(--danger);padding:7px 11px}.inline{grid-template-columns:2fr 2fr 90px 110px}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px;border-bottom:1px solid var(--line)}.item{display:grid;gap:4px;padding:10px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.item span,small{color:var(--muted)}.item span small{display:block;margin-top:4px}.login{min-height:100vh;display:grid;place-items:center}.login .card{width:min(440px,90vw)}.error{background:#4a1e24;padding:10px;border-radius:6px;margin:12px 0}nav{display:flex;gap:12px;padding:16px 5vw 18px;border-bottom:1px solid var(--line);background:#0c111a}nav a{display:flex;align-items:center;gap:11px;min-width:180px;padding:13px 18px;text-decoration:none;border:1px solid #283244;border-radius:12px;color:#c2ccda;background:linear-gradient(145deg,#171d28,#10151e);box-shadow:0 5px 14px rgba(0,0,0,.18);transition:.18s ease}nav a:hover{border-color:#4c78b5;transform:translateY(-1px)}nav a.active{border-color:#64a6ff;color:white;background:linear-gradient(135deg,#1769d2,#2f80ed);box-shadow:0 8px 24px rgba(47,128,237,.32)}nav a span:last-child{display:grid;gap:2px}nav a small{font-size:11px;color:#8391a5}nav a.active small{color:#d9eaff}.tab-icon{font-size:22px}.notice{margin:18px 5vw 0;background:#17472c;padding:10px;border-radius:7px}.page-error{margin:18px 5vw 0}.secret{background:#080b10;border:1px dashed #73829a;border-radius:7px;padding:14px;font:700 16px ui-monospace,monospace;overflow-wrap:anywhere;letter-spacing:1px}.customer{padding:12px 0;border-bottom:2px solid var(--line)}.customer h3,.customer h4{margin-bottom:6px}.row{grid-template-columns:1fr auto;align-items:center}.row form{display:block}@media(max-width:760px){nav{overflow-x:auto;padding:12px 4vw}nav a{min-width:145px;padding:11px}.grid{grid-template-columns:1fr}.span{grid-column:auto}.inline,.row{grid-template-columns:1fr}}

/* Conventional site navigation */
.nav-shell{padding:0 5vw;background:#101621;border-bottom:1px solid #303b4c}
.nav-shell nav{display:flex;gap:6px;max-width:1100px;padding:14px 0 0;border:0;background:transparent;overflow:visible}
.nav-shell nav a{display:block;min-width:150px;padding:14px 28px;border:1px solid #303b4c;border-bottom:0;border-radius:9px 9px 0 0;background:#171e2a;box-shadow:none;color:#b9c4d3;font-size:16px;font-weight:700;text-align:center;text-decoration:none;transform:none}
.nav-shell nav a:hover{background:#202a39;border-color:#4b5a70;color:#fff;transform:none}
.nav-shell nav a.active{position:relative;background:#2f80ed;border-color:#5ba0fa;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.nav-shell nav a.active:after{content:"";position:absolute;left:24px;right:24px;bottom:-1px;height:3px;background:#fff;border-radius:3px 3px 0 0}
.signout{padding:9px 15px;border:1px solid #3a4658;border-radius:7px;text-decoration:none;color:#d4dce8}
.signout:hover{background:#1b2432;color:#fff}
@media(max-width:600px){.nav-shell{padding:0 3vw}.nav-shell nav{gap:4px}.nav-shell nav a{min-width:0;flex:1;padding:12px 8px;font-size:14px}}
.portal-row{grid-template-columns:1fr auto;align-items:center}.portal-actions{display:flex;gap:6px}.portal-actions form{display:block}.portal-actions button{min-width:42px;padding:8px 11px}.secondary{background:#2b3545}.secondary:hover{background:#3b4a60}.secondary:disabled{opacity:.3;cursor:not-allowed}@media(max-width:600px){.portal-row{grid-template-columns:1fr}.portal-actions{margin-top:8px}}
.directory-head{display:flex;align-items:center;justify-content:space-between;gap:24px}.search-form{display:flex;grid-template-columns:none;flex-direction:row;gap:8px;width:min(620px,100%)}.search-form input{flex:1}.secondary-link{display:grid;place-items:center;padding:0 13px;border:1px solid var(--line);border-radius:7px;text-decoration:none}.customer-list{padding:0 20px}.customer-link{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 8px;border-bottom:1px solid var(--line);color:var(--text);text-decoration:none}.customer-link:hover{background:#1a2230}.customer-link span{display:grid;gap:4px}.customer-link strong{color:#83b8ff}.pagination{display:flex;align-items:center;justify-content:center;gap:20px;padding:20px}.pagination a{padding:8px 13px;border:1px solid var(--line);border-radius:7px;text-decoration:none}.detail-title{padding-bottom:14px}.detail-title h2{margin-top:12px;font-size:26px}@media(max-width:700px){.directory-head{align-items:stretch;flex-direction:column}.search-form{flex-wrap:wrap}.search-form input{min-width:100%}.customer-link{align-items:flex-start}.pagination{justify-content:space-between;gap:6px}}