:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#22313a;background:#f5f7f8;font-size:14px}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;min-width:320px}
button,input,select{font:inherit}
button{cursor:pointer}
button:disabled{cursor:wait;opacity:.55}
button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #94d1ba;outline-offset:2px}
.site-header{background:#173c42;color:#fff;border-bottom:3px solid #319a75}
.header-inner{max-width:1160px;min-height:68px;margin:auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:750;line-height:1.2}
.brand small{display:block;color:#b6d4ce;font-size:11px;font-weight:500;margin-top:3px}
.brand-mark{width:36px;height:36px;display:grid;place-items:center;border:1px solid #7ebbad;color:#fff;font-size:12px;flex:none}
.session-controls{display:flex;align-items:center;gap:18px;font-size:13px}
.session-controls span{overflow-wrap:anywhere;text-align:right}
main{max-width:1160px;margin:auto;padding:0 24px 60px}
.login-wrap{min-height:calc(100vh - 70px);display:grid;place-items:center;padding:32px 0}
.login-panel{width:min(410px,100%);background:#fff;border:1px solid #d8e1e2;border-radius:8px;padding:28px;box-shadow:0 10px 30px rgba(18,40,45,.09)}
h1,h2,p{margin-top:0}
.login-panel h1{font-size:24px;margin-bottom:24px}
.login-panel form{display:grid}
label{display:block;font-weight:650;color:#294349;margin:0 0 6px}
input,select{width:100%;height:40px;padding:8px 10px;border:1px solid #b6c7cb;border-radius:5px;background:#fff;color:#1e2e36}
input[type=password]{letter-spacing:0}
.login-panel input{margin-bottom:17px}
.optional{font-size:11px;font-weight:450;color:#667a80}
.primary-button,.secondary-button,.quiet-button{min-height:38px;padding:8px 13px;border-radius:5px;font-weight:650;white-space:nowrap}
.primary-button{background:#176d56;border:1px solid #176d56;color:#fff}
.primary-button:hover{background:#115942}
.secondary-button{background:#fff;border:1px solid #9db2b8;color:#24454d}
.secondary-button:hover{background:#eff5f4}
.quiet-button{background:transparent;border:1px solid #86a8a8;color:#fff}
.quiet-button:hover{background:#275259}
.full{width:100%}
.page-heading{padding:27px 0 20px;border-bottom:1px solid #cbd8db}
.page-heading h1{font-size:25px;margin-bottom:5px}
.page-heading p,.section-heading p{margin:0;color:#5a6e75;line-height:1.45}
.section{padding:23px 0 28px;border-bottom:1px solid #cbd8db}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:19px}
.section-heading h2{font-size:18px;margin:0 0 4px}
.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.field{min-width:0}
.field small{display:block;margin-top:5px;color:#61747b;font-size:11px;line-height:1.4}
.form-actions{grid-column:1/-1;display:flex;align-items:center;gap:14px;min-height:40px;flex-wrap:wrap}
.form-message{color:#a63223;font-size:12px;line-height:1.45;margin:0}
.form-message.success{color:#176d56}
.login-panel .form-message{margin:0 0 14px}
.password-section.required{background:#fff8e9;border-left:4px solid #bf8a22;padding:23px 18px 28px;margin:18px 0 0}
.table-scroll{max-width:100%;overflow-x:auto;background:#fff;border:1px solid #d7e0e2}
table{width:100%;border-collapse:collapse;min-width:790px}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid #e1e8e9;vertical-align:middle}
th{background:#eaf0f1;color:#294349;font-size:12px;white-space:nowrap}
tr:last-child td{border-bottom:0}
td{font-size:12px}
td strong{font-size:13px}
.state{display:inline-block;color:#176d56;font-weight:650}
.state.inactive,.state.pending{color:#a15c17}
.row-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.row-actions button{min-height:31px;padding:5px 8px;border:1px solid #b6c7cb;border-radius:4px;background:#fff;color:#24454d;font-size:11px;font-weight:650}
.row-actions button:hover{background:#eff5f4}
.row-actions button.danger{color:#a63223;border-color:#d9aaa4}
dialog{border:1px solid #b6c7cb;border-radius:8px;width:min(475px,calc(100% - 24px));padding:22px 24px;color:#22313a;box-shadow:0 22px 60px rgba(18,40,45,.2)}
dialog::backdrop{background:rgba(13,32,38,.62)}
.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.dialog-heading h2{font-size:19px;margin:0 0 12px}
.icon-close{border:0;background:transparent;color:#456068;font-size:27px;line-height:1;padding:0 2px;min-width:28px;min-height:28px}
dialog p{font-size:13px;line-height:1.45;color:#546971}
.credential-list{margin:17px 0;border-top:1px solid #d7e0e2}
.credential-list div{display:grid;grid-template-columns:105px minmax(0,1fr);gap:10px;padding:11px 0;border-bottom:1px solid #d7e0e2}
.credential-list dt{font-weight:650;color:#4d666e}
.credential-list dd{margin:0;font-weight:650;overflow-wrap:anywhere}
.credential-list .secret{font-family:Consolas,monospace;font-size:15px;color:#132e35}
.dialog-actions{display:flex;gap:9px;justify-content:flex-end;flex-wrap:wrap;margin:18px 0 0}
dialog .form-message{margin-top:10px}
@media(max-width:720px){.header-inner{padding:11px 16px}.session-controls{gap:7px;flex-direction:column;align-items:flex-end}.brand{font-size:14px}main{padding:0 16px 40px}.form-grid{grid-template-columns:1fr}.section-heading{align-items:flex-start}.login-panel{padding:22px}}