:root{color-scheme:dark;font-family:'Segoe UI',Arial,sans-serif;background:#181818;color:#e5e5e5;font-size:14px}*{box-sizing:border-box}body{margin:0}a{color:#78bfff;text-decoration:none}a:hover{text-decoration:underline}button,input,select{font:inherit}button,.button{border:1px solid #505050;border-radius:5px;padding:9px 15px;background:#303030;color:#eee;cursor:pointer;display:inline-block}button:hover,.button:hover{background:#3a3a3a;text-decoration:none}button:disabled{opacity:.45;cursor:default}.primary{background:#3d82f6;border-color:#3d82f6;color:white}.primary:hover{background:#286bd4}.danger{color:#ffaaaa;background:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #78bfff;outline-offset:3px}input,select{border:1px solid #555;background:#1b1b1b;color:#eee;padding:10px 12px;border-radius:5px;min-width:0}input:focus,select:focus{border-color:#78bfff}label{display:block;font-weight:600;margin-bottom:7px}h1{font-size:28px;font-weight:600;line-height:1.2;margin:6px 0 10px}h2{font-size:20px;font-weight:600;margin:0 0 12px}p{line-height:1.6;margin:0 0 18px;color:#bcbcbc}small,.helper{color:#aaa;font-size:12px}.sidebar{position:fixed;inset:0 auto 0 0;width:238px;background:#232323;border-right:1px solid #383838;display:flex;flex-direction:column;padding:28px 16px;z-index:10}.brand{display:flex;flex-direction:column;padding:0 14px 30px;color:#eee}.brand:hover{text-decoration:none}.brand img{width:164px;height:auto;margin-bottom:28px}.brand strong{font-size:24px;font-weight:600}.brand span{font-size:15px;color:#aaa;margin-top:3px}.sidebar nav{display:flex;flex-direction:column;gap:7px}.sidebar nav a{color:#c9c9c9;padding:12px 16px;border-radius:5px;display:flex;gap:12px}.sidebar nav a:hover{background:#2e2e2e;text-decoration:none}.sidebar nav a.active{background:#233551;color:#98c5ff;box-shadow:inset 3px 0 #3d82f6}.sidebar footer{margin-top:auto;padding:20px 12px 0;color:#aaa;font-size:12px;line-height:1.8;border-top:1px solid #393939}.main{margin-left:238px;min-height:100vh}.topbar{height:72px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;background:#1d1d1d;border-bottom:1px solid #343434;color:#aaa;gap:12px}.account-links{display:flex;align-items:center;gap:14px}.account-links form{margin:0}.text-button{border:0;background:none;padding:5px;color:#bbb}.content{padding:32px;max-width:1680px;margin:auto}.page-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.page-header p{margin:0}.eyebrow{font-size:11px;letter-spacing:1.6px;color:#a5a5a5;font-weight:600}.panel,.metric{background:#232323;border:1px solid #3b3b3b;border-radius:7px}.notice{background:#202a36;border:1px solid #34465e;border-radius:5px;padding:16px 18px;color:#bdcee4;font-size:13px;line-height:1.65;margin-bottom:24px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:28px}.metric{padding:22px 24px;border-top:3px solid #555;display:flex;flex-direction:column;gap:8px}.metric>span{color:#c4c4c4;font-size:14px}.metric strong{font-size:37px;line-height:1.3;font-weight:600}.active-metric{border-top-color:#59ba8c}.active-metric strong{color:#80d4ad}.warning-metric{border-top-color:#c29c51}.dashboard-summary{padding:25px;display:flex;justify-content:space-between;align-items:center;gap:30px}.dashboard-summary p{max-width:720px}.dashboard-summary .button{white-space:nowrap}.search-panel{padding:20px;display:flex;gap:24px;align-items:flex-end;margin-bottom:14px}.search-panel form{flex:1}.search-controls{display:flex;gap:10px}.search-controls input{flex:1;min-width:80px}.page-size{width:130px}.page-size select{width:100%}.list-summary{display:flex;justify-content:space-between;gap:12px;margin:24px 0 12px}.table-frame{border:1px solid #3b3b3b;border-radius:6px;overflow-x:auto;background:#232323}table{border-collapse:collapse;width:100%;text-align:left}th{background:#1d1d1d;color:#bbb;font-size:12px;font-weight:600;white-space:nowrap;padding:15px 18px}td{padding:17px 18px;border-top:1px solid #383838;vertical-align:middle;font-size:13px}tbody tr:hover{background:#292929}.key-cell{min-width:210px;max-width:420px}.key-link{background:none;border:0;padding:0;text-align:left;color:#78bfff;font-family:Consolas,monospace;overflow-wrap:anywhere;line-height:1.6}.key-link:hover{background:none;text-decoration:underline}.badge{display:inline-block;border:1px solid #505050;background:#313131;border-radius:4px;padding:3px 8px;font-size:11px;white-space:nowrap}.badge.valid{background:#20392e;border-color:#365b48;color:#92d4b3}.badge.suspended,.badge.stale{background:#3b3121;border-color:#645130;color:#e2c286}.badge.revoked{background:#40282b;border-color:#6c3b40;color:#eda7ae}.pagination{display:flex;justify-content:space-between;align-items:center;margin-top:18px;color:#aaa}.pagination>div{display:flex;gap:10px}.state{text-align:center;padding:48px 20px;color:#aaa}.alert{background:#20392e;border:1px solid #365b48;border-radius:5px;padding:16px;margin:20px 0;line-height:1.6}.alert.error{background:#38272a;border-color:#77454e;color:#f2b9c1}.alert button{margin-left:12px}.drawer-backdrop{position:fixed;inset:0;background:#0009;z-index:30}.drawer{position:fixed;right:0;top:0;bottom:0;width:min(530px,100vw);background:#232323;border-left:1px solid #505050;z-index:31;box-shadow:-10px 0 35px #0006;display:flex;flex-direction:column}.drawer>header{display:flex;justify-content:space-between;align-items:center;padding:24px;border-bottom:1px solid #3b3b3b;background:#1d1d1d}.drawer h2{margin:7px 0 0}.drawer-body{padding:24px;overflow-y:auto;flex:1}.drawer>footer{padding:16px 24px;border-top:1px solid #444;text-align:right}.detail-key{font:15px/1.7 Consolas,monospace;overflow-wrap:anywhere;color:#a9d3ff;padding:14px;background:#1b1b1b;border-radius:4px}dl{margin:20px 0}dt{font-size:12px;color:#aaa;margin-top:19px}dd{margin:6px 0 0;overflow-wrap:anywhere;line-height:1.5}.login-card{max-width:430px;margin:8vh auto;padding:32px}.account-panel{max-width:600px;padding:26px;margin-top:28px}.login-card input,.account-panel input:not([type=checkbox]),.account-panel select{width:100%;margin-bottom:20px}.login-card button{width:100%;margin-top:8px}.check{display:flex;align-items:center;gap:10px;margin:6px 0 20px}.actions{display:flex;align-items:center;gap:18px;margin-top:6px}.row-actions{display:flex;align-items:center;gap:20px}.row-actions form{margin:0}#blazor-error-ui{display:none;position:fixed;bottom:0;left:0;right:0;padding:15px;background:#493324;z-index:100}
@media(min-width:1500px){.cards{grid-template-columns:repeat(6,minmax(0,1fr))}.metric{padding:20px 18px}}
@media(max-width:1000px){.sidebar{width:205px;padding-inline:10px}.main{margin-left:205px}.content{padding:24px}.topbar{padding-inline:24px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-summary{align-items:flex-start;flex-direction:column}.account-links{gap:8px}}
@media(max-width:700px){.sidebar{position:static;width:100%;padding:14px 16px;display:block;border-right:0;border-bottom:1px solid #444}.brand{padding:0;display:block}.brand img{width:115px;margin:0 22px 0 0;vertical-align:middle}.brand strong{font-size:18px}.brand span{display:inline;font-size:13px;margin-left:7px}.sidebar nav{flex-direction:row;margin-top:14px;flex-wrap:wrap;gap:4px}.sidebar nav a{padding:9px 12px}.sidebar footer{display:none}.main{margin-left:0}.topbar{height:auto;min-height:58px;padding:12px 18px;flex-wrap:wrap}.topbar>span{display:none}.account-links{margin-left:auto;flex-wrap:wrap}.content{padding:24px 16px}.page-header{align-items:flex-start}h1{font-size:24px}.search-panel{flex-direction:column;align-items:stretch;padding:16px}.page-size{width:100%;display:flex;align-items:center;gap:12px}.page-size label{white-space:nowrap;margin:0}.page-size select{width:90px}.search-controls{flex-wrap:wrap}.search-controls input{flex-basis:100%}.list-summary{flex-direction:column}.cards{gap:12px}.metric{padding:16px}.metric strong{font-size:30px}.metric small{font-size:11px}.login-card{margin:20px auto}.drawer-body{padding:20px}.pagination{gap:10px}td,th{padding:14px 12px;white-space:nowrap}.key-cell{white-space:normal}.account-panel{padding:20px}.actions{flex-wrap:wrap}}

.sidebar-banner { position: relative; }
.startup-state { max-width: 560px; margin: 15vh auto; padding: 28px; background: #232323; border: 1px solid #3b3b3b; border-radius: 7px; }
.startup-state[hidden] { display: none; }
.brand-logo-frame { width: 164px; height: 40px; overflow: hidden; margin-bottom: 22px; }
.brand .brand-logo-frame img { width: 164px; max-width: none; margin: 0; display: block; }
.sidebar-collapse-btn { position: absolute; right: -10px; top: 0; padding: 5px 8px; background: #1d1d1d; border-color: #444; }
.sidebar .sidebar-footer { display: flex; align-items: center; gap: 8px; justify-content: space-between; }
.sidebar-footer-details { min-width: 0; font-size: 11px; }
.sidebar-info { padding: 4px; border: 0; background: transparent; font-size: 20px; color: #aaa; }
.nav-icon { width: 18px; flex-shrink: 0; text-align: center; }
.layout-user-dropdown { position: relative; color: #c8d0da; }
.layout-user-btn { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 5px; cursor: pointer; list-style: none; }
.layout-user-btn::-webkit-details-marker { display: none; }
.layout-user-btn:hover, .layout-user-dropdown[open] .layout-user-btn { background: #ffffff12; }
.user-icon { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.layout-user-name { max-width: 210px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.dropdown-chevron { color: #999; font-size: 11px; }
.layout-user-popup { position: absolute; top: calc(100% + 8px); left: 0; min-width: 215px; background: #292929; border: 1px solid #484848; border-radius: 6px; box-shadow: 0 8px 24px #0009; z-index: 25; list-style: none; margin: 0; padding: 5px 0; }
.layout-user-popup li + li { border-top: 1px solid #3b3b3b; }
.layout-user-popup form { margin: 0; }
.layout-user-popup .layout-user-menu-item { display: flex; align-items: center; gap: 10px; padding: 12px 16px; width: 100%; border: 0; border-radius: 0; color: #c8d0da; text-align: left; font-size: 13px; background: none; }
.layout-user-popup .layout-user-menu-item:hover { background: #ffffff12; text-decoration: none; color: #f0f4f8; }
.layout-user-menu-item > span { width: 18px; text-align: center; font-size: 17px; }
.sidebar-collapsed .sidebar { width: 78px; padding-inline: 12px; }
.sidebar-collapsed .main { margin-left: 78px; }
.sidebar-collapsed .brand { padding: 0 0 25px; }
.sidebar-collapsed .brand-logo-frame { width: 39px; margin-top: 30px; margin-bottom: 0; }
.sidebar-collapsed .brand strong, .sidebar-collapsed .brand > span, .sidebar-collapsed .nav-label, .sidebar-collapsed .sidebar-footer-details { display: none; }
.sidebar-collapsed .sidebar nav a { padding: 12px 16px; }
.sidebar-collapsed .sidebar-collapse-btn { right: 2px; top: -15px; }
.sidebar-collapsed .sidebar .sidebar-footer { justify-content: center; padding-inline: 0; }
.annotation-panel { margin-top: 30px; padding-top: 24px; border-top: 1px solid #484848; }
.annotation-panel h3 { font-size: 18px; margin: 0 0 10px; font-weight: 600; }
.annotation-panel input, .annotation-panel textarea { width: 100%; }
.annotation-panel textarea { font: inherit; line-height: 1.6; resize: vertical; min-height: 130px; border: 1px solid #555; background: #1b1b1b; color: #eee; padding: 10px 12px; border-radius: 5px; }
.annotation-panel .helper { margin: 8px 0 18px; }
.annotation-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.annotation-note { white-space: pre-wrap; }
.annotation-warning { color: #e2c286; font-size: 12px; }
.customer-suggestions { display: flex; flex-direction: column; max-height: 190px; overflow-y: auto; border: 1px solid #505050; border-radius: 4px; margin: -8px 0 20px; }
.customer-suggestions button { border: 0; border-radius: 0; text-align: left; background: #292929; overflow-wrap: anywhere; }
.customer-suggestions button:hover, .customer-suggestions button:focus { background: #233551; color: #a9d3ff; }
.customer-suggestions button + button { border-top: 1px solid #414141; }
@media (max-width: 1000px) and (min-width: 701px) { .brand { padding-inline: 5px; } .brand-logo-frame { width: 150px; } .brand .brand-logo-frame img { width: 150px; } }
@media (max-width: 700px) {
    .brand-logo-frame { display: inline-block; width: 115px; height: 28px; margin: 0 20px 0 0; vertical-align: middle; }
    .brand .brand-logo-frame img { width: 115px; }
    .sidebar-collapse-btn { right: 0; top: 0; }
    .sidebar .sidebar-footer { display: none; }
    .sidebar-collapsed .sidebar { width: 100%; padding: 14px 16px; }
    .sidebar-collapsed .main { margin-left: 0; }
    .sidebar-collapsed .brand { padding: 0; }
    .sidebar-collapsed .brand-logo-frame { width: 28px; margin: 0; }
    .sidebar-collapsed .sidebar-collapse-btn { right: 0; top: 0; }
    .sidebar-collapsed .sidebar nav { display: none; }
    .layout-user-name { max-width: 220px; }
}