@font-face{font-family:Manrope;src:url("fonts/manrope-400.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url("fonts/manrope-500.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:Manrope;src:url("fonts/manrope-600.woff2") format("woff2");font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:Manrope;src:url("fonts/manrope-700.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:Manrope;src:url("fonts/manrope-800.woff2") format("woff2");font-style:normal;font-weight:800;font-display:swap}
@font-face{font-family:"Bebas Neue";src:url("fonts/bebas-neue-400.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}

:root{
  --red:#e42320;
  --red-deep:#b81b19;
  --red-wash:#fce9e7;
  --ink:#17130f;
  --ink-2:#262019;
  --paper:#f6f4f1;
  --white:#fff;
  --smoke:#726b63;
  --smoke-2:#9a938b;
  --line:#e7e2db;
  --line-strong:#d7cfc5;
  --ok:#1e7a4d;
  --ok-wash:#e9f4ee;
  --warning:#9a6b05;
  --warning-wash:#fff7e8;
  --sidebar-w:258px;
  --topbar-h:70px;
  --maxw:1540px;
  --r:14px;
  --s1:6px;
  --s2:12px;
  --s3:18px;
  --s4:26px;
  --s5:40px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{min-width:320px;background:var(--paper);color:var(--ink);font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body{padding-bottom:env(safe-area-inset-bottom)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--red);text-decoration:none}
a:hover{text-decoration:underline}
strong{font-weight:800}
h1,h2,h3,h4{color:var(--ink);line-height:1.05}
h1,h2{font-family:"Bebas Neue",Impact,sans-serif;font-weight:400;letter-spacing:.015em}
h1{font-size:clamp(38px,4vw,50px);text-transform:uppercase}
h2{font-size:28px;text-transform:uppercase}
h3{font-size:17px;font-weight:800}
:focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:5px}
::selection{background:#f5bbb7;color:var(--ink)}

.muted{color:var(--smoke)}
.app-shell{display:flex;min-height:100vh}
.sidebar{position:fixed;inset:0 auto 0 0;z-index:110;display:flex;width:var(--sidebar-w);flex-direction:column;overflow-x:hidden;overflow-y:auto;background:var(--paper);border-right:1px solid var(--line);overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-track{background:transparent}
.sidebar::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:999px}
.brand{display:flex;align-items:center;gap:13px;min-height:88px;padding:18px 20px}
.brand-symbol{position:relative;display:grid;width:50px;height:50px;flex:none;place-items:center;overflow:hidden;border-radius:12px;background:var(--ink);color:var(--white)}
.brand-symbol::after{position:absolute;right:-12px;bottom:-14px;width:36px;height:36px;border-radius:50%;background:var(--red);content:""}
.brand-symbol span{position:relative;z-index:1;font-family:"Bebas Neue",sans-serif;font-size:31px;line-height:1}
.brand-copy{min-width:0}
.brand-copy span,.brand-copy strong,.brand-copy small{display:block}
.brand-house{margin-bottom:1px;color:var(--red);font-size:10px;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
.brand-copy strong{font-family:"Bebas Neue",sans-serif;font-size:29px;font-weight:400;letter-spacing:.025em;line-height:1}
.brand-copy small{margin-top:5px;color:var(--smoke);font-size:10.5px;font-weight:600;white-space:nowrap}
.brand-rule{height:3px;margin:0 20px;background:linear-gradient(90deg,var(--red) 0 42px,var(--ink) 42px 100%)}
.nav-list{display:flex;flex-direction:column;gap:3px;padding:22px 14px}
.nav-heading{margin:17px 13px 7px;color:var(--smoke-2);font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.nav-heading:first-child{margin-top:0}
.nav-list a{display:flex;align-items:center;gap:12px;padding:10px 13px;border-radius:10px;color:var(--ink);font-size:14px;font-weight:700;line-height:1.2;transition:background .15s,color .15s,transform .15s}
.nav-list a:hover{background:var(--white);text-decoration:none;transform:translateX(2px)}
.nav-list a.active{background:var(--ink);color:var(--white)}
.nav-number{width:26px;flex:none;color:var(--smoke-2);font-family:"Bebas Neue",sans-serif;font-size:20px;font-weight:400;line-height:1;text-align:center}
.nav-list a.active .nav-number{color:var(--red)}
.sidebar-footer{margin-top:auto;padding:20px;border-top:1px solid var(--line)}
.sidebar-footer small{display:block;margin-top:8px;color:var(--smoke);font-size:11px}
.environment-badge{display:inline-flex;align-items:center;border-radius:999px;background:var(--ink);color:var(--white);font-size:10.5px;font-weight:800;letter-spacing:.04em;padding:5px 10px;text-transform:uppercase}
.environment-badge::before{width:7px;height:7px;margin-right:7px;border-radius:50%;background:var(--red);content:""}

.main-column{width:calc(100% - var(--sidebar-w));min-width:0;margin-left:var(--sidebar-w)}
.topbar{position:sticky;top:0;z-index:90;display:flex;align-items:center;gap:22px;height:var(--topbar-h);padding:0 30px;background:rgba(246,244,241,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.menu-toggle{display:none;width:42px;height:40px;flex:none;align-items:center;justify-content:center;flex-direction:column;gap:5px;border:0;border-radius:10px;background:var(--ink)}
.menu-toggle span{display:block;width:18px;height:2px;border-radius:2px;background:var(--white);transition:transform .2s,opacity .2s}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.entity-switcher{max-width:760px;min-width:0;flex:1}
.entity-switcher label{display:block;margin-bottom:2px;color:var(--smoke);font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.entity-switcher select{width:100%;max-width:700px;border:0;background:transparent;font-size:15px;font-weight:800;outline:0;padding:2px 28px 2px 0}
.user-menu{display:flex;align-items:center;gap:18px;margin-left:auto}
.user-menu>div{min-width:120px}
.user-menu strong,.user-menu small{display:block;text-align:right}
.user-menu strong{font-size:14px}
.user-menu small{color:var(--smoke);font-size:11px}
.link-button{border:0;background:transparent;color:var(--red);font-size:13px;font-weight:800;padding:7px}
.link-button:hover{color:var(--red-deep);text-decoration:underline}

.content{width:100%;max-width:var(--maxw);margin:0 auto;padding:34px 34px 72px}
.content{padding-bottom:max(72px,calc(48px + env(safe-area-inset-bottom)))}
.entity-context{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:25px;padding:14px 18px;background:var(--white);border:1px solid var(--line);border-left:4px solid var(--red);border-radius:var(--r)}
.entity-context strong,.entity-context span{display:block}
.entity-context strong{font-size:14px}
.entity-context span{margin-top:2px;color:var(--smoke);font-size:12px}
.entity-context a{font-size:12px;font-weight:800;white-space:nowrap}
.page-header{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:22px;margin-bottom:28px;padding-bottom:17px;border-bottom:2px solid var(--ink)}
.page-header::after{position:absolute;bottom:-2px;left:0;width:68px;height:4px;background:var(--red);content:""}
.page-header p{max-width:72ch;margin-top:7px;color:var(--smoke);font-size:15px}
.header-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}

.button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border:1px solid transparent;border-radius:999px;padding:9px 19px;font-size:13px;font-weight:800;line-height:1.2;transition:background .16s,color .16s,border-color .16s,transform .16s}
.button:hover{text-decoration:none;transform:translateY(-1px)}
.button.primary{background:var(--red);color:var(--white)}
.button.primary:hover{background:var(--ink)}
.button.secondary{background:var(--white);border-color:var(--line-strong);color:var(--ink)}
.button.secondary:hover{background:var(--ink);border-color:var(--ink);color:var(--white)}
.button.small{min-height:34px;padding:7px 13px;font-size:11.5px}
.button.full{width:100%}

.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}
.stat-card{position:relative;min-height:126px;overflow:hidden;padding:22px 21px;background:var(--ink);border:1px solid var(--ink);border-radius:var(--r);color:var(--white)}
.stat-card::after{position:absolute;right:-24px;bottom:-38px;width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,rgba(228,35,32,.38),transparent 66%);content:""}
.stat-card span{position:relative;z-index:1;color:#cfc8c1;font-size:11.5px;font-weight:700}
.stat-card strong{position:relative;z-index:1;display:block;margin-top:12px;color:var(--red);font-family:"Bebas Neue",sans-serif;font-size:42px;font-weight:400;line-height:.9}
.panel{margin-bottom:22px;padding:24px;background:var(--white);border:1px solid var(--line);border-radius:var(--r)}
.panel-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.panel-header h2{margin:0}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.profile-summary{display:flex;gap:8px;flex-wrap:wrap}

.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.form-grid .span-2{grid-column:span 2}
.form-grid label,.filter-form label{color:var(--ink-2);font-size:12px;font-weight:800}
.form-grid input,.form-grid select,.form-grid textarea,.filter-form input,.filter-form select,.inline-form input,.inline-form select{display:block;width:100%;margin-top:6px;border:1px solid var(--line-strong);border-radius:10px;background:var(--white);padding:10px 12px;outline:0;transition:border-color .15s,box-shadow .15s}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus,.filter-form input:focus,.filter-form select:focus,.inline-form input:focus,.inline-form select:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(228,35,32,.11)}
.form-grid textarea{min-height:92px;resize:vertical}
.form-grid hr{width:100%;margin:4px 0;border:0;border-top:1px solid var(--line)}
.hint{display:block;margin-top:5px;color:var(--smoke);font-size:11px;font-weight:500}
.filter-form{display:flex;align-items:flex-end;gap:10px}
.filter-form input,.filter-form select{min-width:170px;margin-top:5px}
.inline-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.inline-form input,.inline-form select{width:auto;min-width:110px;margin:0;padding:7px 9px;font-size:12px}
.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:9px}
.check-item{display:flex!important;align-items:center;gap:9px;padding:9px 10px;border:1px solid var(--line);border-radius:9px;background:var(--paper)}
.check-item input{width:auto!important;margin:0!important;accent-color:var(--red)}

.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
.table-wrap::-webkit-scrollbar{height:7px}
.table-wrap::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:999px}
.data-table{width:100%;min-width:720px;border-collapse:collapse;background:var(--white)}
.data-table th,.data-table td{padding:12px 15px;border-top:1px solid var(--line);text-align:left;vertical-align:middle}
.data-table thead th{border:0;background:var(--ink);color:var(--white);font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.data-table tbody tr:first-child td{border-top:0}
.data-table tbody tr:hover{background:var(--paper)}
.data-table td{font-size:12.5px}
.data-table small{font-size:10.5px}

.badge{display:inline-flex;align-items:center;border-radius:999px;background:#eeeae5;color:var(--ink-2);font-size:10px;font-weight:800;letter-spacing:.03em;padding:4px 9px;text-transform:uppercase}
.badge.success,.badge.active,.badge.accepted{background:var(--ok-wash);color:var(--ok)}
.badge.warning,.badge.suggested,.badge.draft{background:var(--warning-wash);color:var(--warning)}
.badge.danger,.badge.rejected{background:var(--red-wash);color:var(--red-deep)}
.alert,.warning-banner{margin:0 0 18px;padding:14px 17px;border:1px solid;border-radius:var(--r);font-size:13px}
.alert.success{background:var(--ok-wash);border-color:#bfe0cd;color:var(--ok)}
.alert.warning,.warning-banner{background:var(--warning-wash);border-color:#f1d79a;color:#785205}
.alert.danger{background:var(--red-wash);border-color:#f4c9c4;color:var(--red-deep)}
.alert.info{background:var(--white);border-color:var(--line);border-left:4px solid var(--red);color:var(--ink-2)}
.info-banner{margin:0 0 18px;padding:14px 17px;border:1px solid var(--line);border-left:4px solid var(--red);border-radius:var(--r);background:var(--white);color:var(--ink-2);font-size:13px}
.info-banner.compact{margin:18px 0 0;padding:12px 14px}
.empty-state{padding:40px 22px;text-align:center;color:var(--smoke)}
.empty-state strong{display:block;margin-bottom:6px;color:var(--ink);font-size:16px}
.empty-state p{margin-bottom:19px}
.empty-state.compact{padding:28px 14px}
.hub-empty{max-width:860px;margin:0 auto}
.hub-empty>p{max-width:680px;margin-right:auto;margin-left:auto}
.empty-kicker{display:block;margin-bottom:8px;color:var(--red);font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.flow-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:22px auto;max-width:780px;text-align:left}
.flow-steps.wide{grid-template-columns:repeat(4,minmax(0,1fr));max-width:none}
.flow-steps span{display:flex;align-items:center;gap:10px;min-height:62px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink-2);font-size:11.5px;font-weight:700}
.flow-steps b{display:grid;width:29px;height:29px;flex:none;place-items:center;border-radius:50%;background:var(--ink);color:var(--red);font-family:"Bebas Neue",sans-serif;font-size:17px;font-weight:400}
.status-dot{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:var(--smoke-2)}
.success-dot{background:var(--ok)}
.identity-lock{display:flex;align-items:center;justify-content:space-between;gap:20px;border-left:4px solid var(--red)}
.identity-lock h2{margin:0}
.identity-lock p{margin:6px 0 0;color:var(--smoke)}
.identity-lock>div:last-child{text-align:right}
.identity-lock small{display:block;margin-top:9px;color:var(--smoke);font-size:10.5px}
.secret-panel{border:2px solid var(--red);background:var(--red-wash)}
.copy-field{display:flex;align-items:stretch;gap:8px;margin:7px 0 16px}
.copy-field code{display:block;min-width:0;flex:1;overflow:auto;padding:11px 13px;border:1px solid var(--line-strong);border-radius:10px;background:var(--ink);color:var(--white);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;white-space:nowrap}
.endpoint-label{display:block;margin-top:17px;color:var(--ink-2);font-size:11px;font-weight:800;text-transform:uppercase}
.connection-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:20px 0 0}
.connection-meta div{padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--paper)}
.connection-meta dt{color:var(--smoke);font-size:10px;font-weight:800;text-transform:uppercase}
.connection-meta dd{margin:5px 0 0;font-size:12px;font-weight:800}
.workflow{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0}
.workflow span{position:relative;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--smoke);font-size:10.5px;font-weight:800;padding:6px 10px;text-transform:uppercase}
.workflow span.current{background:var(--ink);border-color:var(--ink);color:var(--white)}
.workflow span.current::before{display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:var(--red);content:""}
.settings-actions{margin-top:18px}
.diagnostic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.diagnostic-grid div{padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--paper)}
.diagnostic-grid dt{color:var(--smoke);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.diagnostic-grid dd{margin-top:5px;font-size:13px;font-weight:800}
.connection-status{margin-top:12px;color:var(--ok);font-size:12px;font-weight:800}
.connection-status.offline{color:var(--red-deep)}
.update-banner{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:160;display:flex;align-items:center;gap:14px;max-width:440px;padding:13px 15px;border:1px solid var(--line-strong);border-left:4px solid var(--red);border-radius:12px;background:var(--white);box-shadow:0 18px 45px rgba(23,19,15,.18);font-size:12px;font-weight:800}
.update-banner[hidden]{display:none}

.auth-body{position:relative;display:grid;min-height:100vh;place-items:center;overflow:hidden;padding:26px;background:var(--paper)}
.auth-body::before{position:fixed;top:-230px;right:-180px;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(228,35,32,.23),transparent 65%);content:"";pointer-events:none}
.auth-body::after{position:fixed;bottom:-270px;left:-250px;width:650px;height:650px;border-radius:50%;background:radial-gradient(circle,rgba(23,19,15,.12),transparent 65%);content:"";pointer-events:none}
.auth-card,.install-card{position:relative;z-index:1;width:min(470px,100%);padding:32px;background:var(--white);border:1px solid var(--line);border-top:5px solid var(--red);border-radius:18px;box-shadow:0 22px 60px rgba(23,19,15,.12)}
.install-card{width:min(700px,100%)}
.brand-center{justify-content:center;min-height:auto;padding:0 0 26px}
.brand-center .brand-copy{text-align:left}
.auth-card h1,.install-card h1{text-align:center}
.auth-card>p,.install-card>p{text-align:center}

.scrim{position:fixed;inset:0;z-index:100;background:rgba(23,19,15,.58);opacity:0;pointer-events:none;transition:opacity .2s}
.scrim.open{opacity:1;pointer-events:auto}

@media (max-width:1100px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:920px){
  :root{--topbar-h:64px}
  .sidebar{width:286px;transform:translateX(-100%);transition:transform .23s ease;box-shadow:0 0 42px rgba(23,19,15,.2)}
  .sidebar.open{transform:translateX(0)}
  .main-column{width:100%;margin-left:0}
  .menu-toggle{display:flex}
  .topbar{padding:0 18px}
  .content{padding:26px 20px 60px}
  .grid-2,.grid-3{grid-template-columns:1fr}
  .flow-steps.wide{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.menu-open{overflow:hidden}
}

@media (max-width:640px){
  html{font-size:15px}
  .cards{grid-template-columns:1fr}
  .topbar{gap:10px;padding:0 12px}
  .user-menu>div{display:none}
  .user-menu{gap:4px}
  .entity-switcher label{display:none}
  .entity-switcher select{font-size:12px}
  .content{padding:22px 13px 48px}
  .entity-context,.page-header{align-items:flex-start;flex-direction:column}
  .entity-context{padding:13px 14px}
  .page-header{gap:13px}
  .page-header .filter-form{width:100%}
  .filter-form{align-items:stretch;flex-direction:column}
  .filter-form input,.filter-form select{width:100%}
  .form-grid{grid-template-columns:1fr}
  .form-grid .span-2{grid-column:span 1}
  .panel{padding:18px}
  .panel-header{align-items:flex-start;flex-direction:column}
  .auth-card,.install-card{padding:24px 20px}
  .check-grid{grid-template-columns:1fr}
  .flow-steps,.flow-steps.wide{grid-template-columns:1fr}
  .identity-lock{align-items:flex-start;flex-direction:column}
  .identity-lock>div:last-child{text-align:left}
  .copy-field{align-items:stretch;flex-direction:column}
  .diagnostic-grid{grid-template-columns:1fr}
  .update-banner{right:12px;bottom:max(12px,env(safe-area-inset-bottom));left:12px;justify-content:space-between}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}
}

@media print{
  .sidebar,.topbar,.scrim,.button,.link-button{display:none!important}
  .main-column{width:100%;margin:0}
  .content{max-width:none;padding:0}
  body{background:#fff}
  .panel,.stat-card{break-inside:avoid}
}