:root{--red:#d71920;--red2:#b90f15;--ink:#1f2937;--muted:#6b7280;--line:#e5e7eb;--bg:#f5f6f8;--card:#fff;--good:#087a48;--danger:#b42318;--shadow:0 8px 24px rgba(17,24,39,.06)}*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}body{margin:0}.topbar{min-height:66px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 24px;gap:26px;position:sticky;top:0;z-index:50}.brand{display:flex;align-items:center;gap:10px;font-weight:800;white-space:nowrap}.brand-mark{background:var(--red);color:#fff;padding:8px 10px;font-style:italic;letter-spacing:.04em;border-radius:4px}.nav{display:flex;gap:4px;align-items:center;flex:1;overflow:auto}.nav a,.userbox a{color:#374151;text-decoration:none;padding:9px 10px;border-radius:7px;font-size:14px;white-space:nowrap}.nav a:hover,.userbox a:hover{background:#f3f4f6}.userbox{display:flex;gap:7px;align-items:center;font-size:13px}.userbox span{display:flex;flex-direction:column;text-align:right}.userbox small{color:var(--muted)}.container{max-width:1500px;margin:0 auto;padding:28px 24px 70px}.page-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.page-title h1{margin:0;font-size:27px;letter-spacing:-.02em}.card{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:20px;margin-bottom:18px}.card h2{margin:0 0 8px;font-size:19px}.card h3{margin:22px 0 10px}.card-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:14px}.card-head p{color:var(--muted);margin:0;font-size:14px}.form-grid{display:grid;gap:16px}.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:650;color:#374151}input,select,textarea{width:100%;border:1px solid #d1d5db;border-radius:8px;padding:10px 11px;background:#fff;color:#111827;font:inherit;outline:none}input:focus,select:focus,textarea:focus{border-color:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.10)}input[readonly]{background:#f9fafb}.check{flex-direction:row;align-items:center;gap:9px;align-self:end;min-height:42px}.check input{width:18px;height:18px}.check span{font-weight:550}.check-list{display:grid;gap:7px;margin-top:8px}.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid #d1d5db;background:#fff;color:#222;text-decoration:none;border-radius:8px;padding:9px 14px;font-weight:700;font-size:13px;cursor:pointer;white-space:nowrap}.btn:hover{background:#f9fafb}.btn.primary{background:var(--red);color:#fff;border-color:var(--red)}.btn.primary:hover{background:var(--red2)}.btn.danger{border-color:#fecaca;color:var(--danger);background:#fff5f5}.btn.small{padding:6px 9px;font-size:12px}.btn.full{width:100%;padding:11px}.copied{background:var(--good)!important;border-color:var(--good)!important}.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.inline{display:inline}.toolbar{display:flex;justify-content:flex-end;margin-bottom:12px}.filter-action{display:flex;align-items:end}.filters .btn{margin-top:12px}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:9px}table{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}th,td{padding:10px 11px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}thead th{background:#f9fafb;color:#4b5563;font-size:12px;text-transform:uppercase;letter-spacing:.03em;position:sticky;top:0;z-index:2}tbody th,thead th:first-child,td:first-child{text-align:left}tr:last-child td,tr:last-child th{border-bottom:0}.compact th,.compact td{padding:6px 8px;font-size:11px}.wizard-table{min-width:1400px}.wizard-table tbody tr:nth-child(6),.wizard-table tbody tr:nth-child(12){border-bottom:3px solid #9ca3af}.table-input{min-width:90px;padding:7px 8px}.empty{text-align:center!important;color:var(--muted);padding:28px}.flash{border-radius:8px;padding:11px 14px;margin-bottom:14px;font-size:14px}.flash.success{background:#ecfdf3;color:#067647;border:1px solid #abefc6}.flash.error{background:#fef3f2;color:#b42318;border:1px solid #fecdca}.flash.info{background:#eff8ff;color:#175cd3;border:1px solid #b2ddff}.auth-wrap{min-height:62vh;display:grid;place-items:center}.auth-card{width:min(430px,100%);padding:28px}.auth-card label{margin:13px 0}.login-logo{font-weight:900;font-size:26px;color:var(--red);margin-bottom:22px}.login-logo span{color:#111827;font-weight:750}.form-narrow{max-width:640px}.form-narrow label{margin-bottom:15px}.form-narrow small,label small{color:var(--muted);font-weight:400}.summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:18px}.stat{background:#fff;border:1px solid var(--line);border-radius:11px;padding:16px;box-shadow:var(--shadow);display:flex;flex-direction:column}.stat span{color:var(--muted);font-size:12px;text-transform:uppercase;font-weight:700}.stat strong{font-size:19px;margin-top:5px}.stat small{color:var(--muted);margin-top:2px}.meta-row{display:flex;gap:22px;align-items:center;flex-wrap:wrap}.meta-row .actions{margin-left:auto}.tabs{display:flex;gap:6px;margin:14px 0}.tab-btn{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 13px;font-weight:700;cursor:pointer}.tab-btn.active{background:#111827;color:#fff;border-color:#111827}.tab-panel{display:none}.tab-panel.active{display:block}.copy-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}.copy-card{border:1px solid var(--line);border-radius:9px;padding:13px;display:grid;gap:7px}.copy-card>span{color:var(--muted);font-size:12px}.copy-source{height:72px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:10px;white-space:pre;overflow:auto;background:#f9fafb}.sticky-actions{position:sticky;bottom:12px;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:10px;padding:10px;display:flex;justify-content:flex-end;gap:8px;box-shadow:0 10px 30px rgba(0,0,0,.1);margin:12px 0 18px}.badge{display:inline-block;background:#eef2ff;color:#3730a3;border-radius:999px;padding:3px 7px;font-size:11px;font-weight:700}.role-admin{background:#fff1f2;color:#be123c}.role-editor{background:#eff6ff;color:#1d4ed8}.role-viewer{background:#f3f4f6;color:#374151}.good{color:var(--good);font-weight:700}.muted{color:var(--muted)}.block{display:block;margin-top:3px}.footer{text-align:center;color:#9ca3af;font-size:12px;padding:22px}.wizard-section{border-top:3px solid var(--red)}fieldset{border:1px solid var(--line);border-radius:9px;padding:12px;margin:0 0 15px}legend{font-size:13px;font-weight:700;padding:0 6px}code{font-size:11px;white-space:pre-wrap}.filters{padding-bottom:16px}
@media(max-width:1100px){.topbar{flex-wrap:wrap;padding:10px 15px;gap:8px}.nav{order:3;width:100%}.userbox{margin-left:auto}.cols-4,.cols-5,.cols-6{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-grid{grid-template-columns:repeat(2,1fr)}.copy-grid{grid-template-columns:1fr}.container{padding:20px 14px 70px}}
@media(max-width:650px){.cols-3,.cols-4,.cols-5,.cols-6,.summary-grid{grid-template-columns:1fr}.brand{font-size:13px}.userbox span{display:none}.page-title h1{font-size:23px}.card{padding:14px}.sticky-actions{flex-direction:column}.sticky-actions .btn{width:100%}}
.pair-card{border-left:4px solid var(--red)}.pair-example{border:1px dashed #d1d5db;border-radius:9px;padding:10px 12px;display:flex;flex-direction:column;justify-content:center;gap:3px;background:#fafafa}.pair-example span{font-size:11px;color:var(--muted);text-transform:uppercase;font-weight:700}.pair-example strong{font-size:13px}.pair-example small{color:var(--muted)}.pair-link-card{display:flex;align-items:center;justify-content:space-between;gap:16px;border-left:4px solid var(--red)}.pair-link-card>div{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.pair-link-card small{display:block;color:var(--muted);width:100%}
@media(max-width:650px){.pair-link-card{align-items:stretch;flex-direction:column}.pair-link-card .btn{width:100%}}
.brand-logo{
    height:46px;
    width:auto;
    display:block;
    object-fit:contain;
}
