:root{
  --bg:#050713;
  --panel:rgba(13,20,45,.72);
  --panel2:rgba(8,13,31,.90);
  --glass:rgba(255,255,255,.052);
  --line:rgba(145,100,255,.22);
  --line2:rgba(27,216,255,.24);
  --text:#f7f8ff;
  --muted:#aab3d3;
  --muted2:#7581a5;
  --purple:#9b4dff;
  --purple2:#5b32ff;
  --cyan:#1bd8ff;
  --blue:#3b82ff;
  --green:#45f5a7;
  --yellow:#ffd166;
  --pink:#ff4fd8;
  --danger:#ff5470;
  --topbar-h:64px;
  --gap:12px;
  --radius:20px;
  --sidebar-w:270px;
  --font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:var(--font);overflow-x:hidden}
button,input{font:inherit}
.cgn-galaxy{
  position:fixed;
  inset:0;
  z-index:-5;
  background:
    radial-gradient(circle at 56% 36%, rgba(65,92,255,.30), transparent 38%),
    radial-gradient(circle at 76% 62%, rgba(26,216,255,.13), transparent 34%),
    linear-gradient(135deg,#050713 0%,#15133a 43%,#111c58 70%,#080615 100%);
}
.bg-wash{position:absolute;border-radius:999px;filter:blur(54px);opacity:.30}
.bg-wash-a{width:620px;height:620px;left:-220px;top:120px;background:radial-gradient(circle,rgba(111,54,255,.70),transparent 65%)}
.bg-wash-b{width:620px;height:620px;right:-250px;bottom:-80px;background:radial-gradient(circle,rgba(27,216,255,.40),transparent 70%)}
.bg-core{position:absolute;left:18%;right:0;bottom:-10%;height:60%;background:radial-gradient(ellipse at center,rgba(74,92,255,.30),transparent 66%);filter:blur(8px)}
.stars{position:absolute;inset:0;opacity:.19;background-image:radial-gradient(rgba(255,255,255,.85) .65px,transparent .9px);background-size:36px 36px}
.dot-grid{position:absolute;inset:0;opacity:.11;background-image:radial-gradient(rgba(255,255,255,.30) 1px,transparent 1px);background-size:12px 12px;mask-image:linear-gradient(to bottom,transparent,black 10%,black 86%,transparent)}
.cgn-topbar{
  position:fixed;top:10px;left:10px;right:10px;z-index:70;height:var(--topbar-h);
  display:grid;grid-template-columns:minmax(210px,.85fr) minmax(190px,.65fr) auto minmax(235px,auto);align-items:center;gap:12px;
  padding:9px 14px;border:1px solid rgba(145,100,255,.20);border-radius:22px;background:rgba(8,13,31,.74);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(14px);
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease,backdrop-filter .18s ease;
}
body.is-scrolled .cgn-topbar{
  border-color:rgba(255,255,255,.52);
  background:rgba(8,13,31,.92);
  backdrop-filter:blur(20px);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.12),
    0 12px 34px rgba(0,0,0,.30),
    0 0 30px rgba(27,216,255,.13),
    inset 0 1px 0 rgba(255,255,255,.10);
}
.top-left,.top-center,.top-right,.top-search{display:flex;align-items:center}
.top-left{gap:12px;min-width:0}
.top-center{justify-content:center;gap:8px;flex-wrap:wrap}
.top-right{justify-content:flex-end;gap:8px}
.cgn-icon-button{position:relative;width:42px;height:42px;flex:0 0 42px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:var(--glass);color:#fff;cursor:pointer}
.hamburger{display:grid;place-items:center}.hamburger i{display:block;width:19px;height:2px;border-radius:99px;background:#fff}.hamburger i+i{margin-top:4px}
.cgn-breadcrumb{min-width:0}.cgn-breadcrumb span,.cgn-breadcrumb strong{display:block}.cgn-breadcrumb span{font-size:12px;color:var(--muted)}.cgn-breadcrumb strong{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-search{height:42px;min-width:0;padding:0 12px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(255,255,255,.045);gap:8px}
.top-search span{color:var(--cyan)}.top-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#fff}.top-search input::placeholder{color:var(--muted2)}
.cgn-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;background:var(--glass);border:1px solid rgba(255,255,255,.08);font-size:12px;color:var(--muted);white-space:nowrap}
.cgn-chip:before{content:"";width:7px;height:7px;border-radius:99px;display:block}.cgn-chip--ok:before{background:var(--green);box-shadow:0 0 10px var(--green)}.cgn-chip--info:before{background:var(--cyan);box-shadow:0 0 10px var(--cyan)}.cgn-chip--warn:before{background:var(--yellow);box-shadow:0 0 10px var(--yellow)}.cgn-chip--danger:before{background:var(--danger);box-shadow:0 0 10px var(--danger)}
.cgn-lang{font-weight:800}.cgn-bell em{position:absolute;right:-4px;top:-5px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--pink);font-size:10px;font-style:normal;line-height:18px}
.cgn-avatar-button{display:flex;align-items:center;gap:9px;border:1px solid rgba(155,77,255,.24);border-radius:999px;background:var(--glass);padding:4px 11px 4px 4px;color:#fff;cursor:pointer}
.cgn-avatar{width:36px;height:36px;display:grid;place-items:center;border-radius:999px;background:linear-gradient(135deg,var(--purple),var(--pink));font-weight:900}.cgn-avatar-copy strong,.cgn-avatar-copy small{display:block}.cgn-avatar-copy strong{font-size:13px}.cgn-avatar-copy small{font-size:11px;color:var(--muted);text-align:right}
.cgn-layout{display:block;min-height:100vh;padding:calc(var(--topbar-h) + 22px) 10px 22px calc(var(--sidebar-w) + 22px);transition:padding-left .2s ease}
body.nav-collapsed .cgn-layout{padding-left:10px}
.cgn-sidebar{position:fixed;z-index:60;left:10px;top:calc(var(--topbar-h) + 22px);bottom:10px;width:var(--sidebar-w);min-width:0;display:flex;flex-direction:column;padding:14px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(180deg,rgba(20,27,56,.86),rgba(8,11,27,.78));box-shadow:0 0 34px rgba(155,77,255,.14),inset 0 1px 0 rgba(255,255,255,.045);backdrop-filter:blur(18px);overflow:auto;transition:opacity .2s ease,transform .2s ease}
body.nav-collapsed .cgn-sidebar{opacity:0;pointer-events:none;transform:translateX(calc(-100% - 16px))}
.sidebar-head{padding:2px 4px 12px}.sidebar-head strong,.sidebar-head span{display:block}.sidebar-head strong{font-size:15px}.sidebar-head span{font-size:12px;color:var(--muted);margin-top:2px}
.cgn-nav{display:flex;flex-direction:column;gap:6px}.nav-group{display:grid;grid-template-columns:22px 1fr 18px;align-items:center;width:100%;border:0;border-radius:14px;padding:10px 11px;background:transparent;color:var(--muted);cursor:pointer;text-align:left}.nav-group:hover,.nav-group.is-open{background:rgba(255,255,255,.06);color:#fff}.nav-group span{color:var(--cyan)}.nav-group i{font-style:normal;transform:rotate(-90deg);transition:.18s}.nav-group.is-open i{transform:rotate(0);color:var(--cyan)}.nav-sub{display:none;flex-direction:column;gap:3px;padding:0 0 5px 29px}.nav-sub.is-open{display:flex}.nav-link{position:relative;width:100%;border:0;border-radius:12px;padding:8px 10px 8px 15px;background:transparent;color:var(--muted);text-align:left;cursor:pointer}.nav-link:before{content:"";position:absolute;left:3px;top:50%;width:5px;height:5px;border-radius:99px;background:rgba(170,179,211,.35);transform:translateY(-50%)}.nav-link:hover{background:rgba(255,255,255,.05);color:#fff}.nav-link.is-active{background:linear-gradient(90deg,rgba(155,77,255,.28),rgba(27,216,255,.1));color:#fff;box-shadow:inset 0 0 0 1px rgba(155,77,255,.22)}.nav-link.is-active:before{background:var(--cyan);box-shadow:0 0 10px var(--cyan)}
.sidebar-foot{margin-top:auto;padding:12px;border-radius:16px;background:var(--glass);border:1px solid rgba(255,255,255,.06)}.sidebar-foot span,.sidebar-foot strong{display:block}.sidebar-foot span{font-size:12px;color:var(--muted)}.sidebar-foot strong{font-size:13px;margin-top:2px}.cgn-scrim{display:none}
.cgn-content{min-width:0}.cgn-card{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(145deg,rgba(22,29,59,.69),rgba(9,13,31,.64));box-shadow:0 0 28px rgba(155,77,255,.09),inset 0 1px 0 rgba(255,255,255,.045);backdrop-filter:blur(16px);padding:14px}
.page-header{min-height:86px;margin-bottom:var(--gap);padding:16px}.cgn-eyebrow{margin:0 0 5px;color:var(--cyan);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.page-header h1{max-width:980px;margin:0 0 7px;font-size:clamp(22px,2.15vw,32px);line-height:1.08;letter-spacing:-.045em}.page-header p:not(.cgn-eyebrow){max-width:790px;margin:0;color:var(--muted);line-height:1.45}
.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);margin-bottom:var(--gap)}.metric-card{padding:12px}.metric-card span,.metric-card small{display:block;color:var(--muted)}.metric-card span{font-size:11px;text-transform:uppercase;letter-spacing:.1em}.metric-card strong{display:block;margin:4px 0;font-size:19px;letter-spacing:-.04em}.metric-card small{font-size:12px}.cgn-progress{height:5px;margin-top:10px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}.cgn-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--purple),var(--cyan));box-shadow:0 0 14px rgba(27,216,255,.32)}.cgn-progress--warn i{background:linear-gradient(90deg,var(--yellow),var(--pink))}
.page-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:var(--gap)}.span2{min-height:220px}.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}.card-head h2{margin:0;font-size:18px}
.chart-card{min-height:300px}.fake-chart{height:205px;position:relative;margin-top:10px;border-radius:18px;background:linear-gradient(180deg,rgba(27,216,255,.05),rgba(155,77,255,.10));overflow:hidden}.fake-chart:before{content:"";position:absolute;inset:18px 12px 30px;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.14) 0 1px,transparent 1px 48px)}.line-svg{position:absolute;inset:0;width:100%;height:100%}.chart-labels{position:absolute;left:14px;right:14px;bottom:8px;display:flex;justify-content:space-between;color:var(--muted);font-size:12px}
.kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.kpi-item{padding:12px;border-radius:15px;background:var(--glass);border:1px solid rgba(255,255,255,.06)}.kpi-icon{width:30px;height:30px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--purple),var(--blue));margin-bottom:8px}.kpi-item span,.kpi-item small{display:block;color:var(--muted)}.kpi-item strong{display:block;font-size:21px;margin:4px 0}
.module-list{display:grid;gap:9px}.module-row{display:grid;grid-template-columns:40px minmax(0,1fr) 190px;align-items:center;gap:10px;padding:10px;border-radius:16px;background:var(--glass);border:1px solid rgba(255,255,255,.06)}.module-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:14px;font-weight:900}.module-icon.purple{background:rgba(155,77,255,.22)}.module-icon.cyan{background:rgba(27,216,255,.16)}.module-icon.blue{background:rgba(59,130,255,.18)}.module-icon.green{background:rgba(69,245,167,.16)}.module-row b,.module-row small{display:block}.module-row small{font-size:12px;color:var(--muted);margin-top:2px}.module-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.cgn-button{height:34px;border:1px solid rgba(27,216,255,.22);border-radius:12px;background:linear-gradient(135deg,rgba(155,77,255,.65),rgba(59,130,255,.55));color:#fff;padding:0 10px;cursor:pointer;white-space:nowrap}.cgn-button--ghost{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.08)}
.cgn-table{display:grid;gap:7px}.table-head,.table-row{display:grid;grid-template-columns:80px minmax(0,1fr) 130px 70px;gap:10px;align-items:center}.table-head{padding:0 10px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em}.table-row{padding:10px;border-radius:15px;background:var(--glass);border:1px solid rgba(255,255,255,.06)}.table-row span{color:var(--muted)}.table-row b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.table-row em{justify-self:end;border-radius:999px;padding:5px 8px;font-size:11px;font-style:normal;font-weight:800}.table-row em.ok{background:var(--green);color:#06140e}.table-row em.warn{background:var(--yellow);color:#151000}.table-row em.danger{background:var(--danger);color:white}.members{display:flex}.members i{width:26px;height:26px;border-radius:50%;display:block;margin-left:-7px;background:linear-gradient(135deg,var(--purple),var(--cyan));border:2px solid rgba(8,13,31,.9)}.members i:first-child{margin-left:0}.cgn-pagination{display:flex;gap:5px}.cgn-pagination button{min-width:30px;height:30px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:var(--glass);color:#fff;cursor:pointer}.cgn-pagination .is-active{background:linear-gradient(135deg,var(--purple),var(--blue))}
.cgn-timeline{display:grid;gap:14px}.cgn-timeline div{position:relative;padding-left:34px}.cgn-timeline i{position:absolute;left:0;top:3px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:rgba(155,77,255,.18);border:1px solid rgba(155,77,255,.45)}.cgn-timeline i:after{content:"";width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}.cgn-timeline div:before{content:"";position:absolute;left:10px;top:28px;width:2px;height:26px;background:rgba(27,216,255,.22)}.cgn-timeline div:last-child:before{display:none}.cgn-timeline b,.cgn-timeline span{display:block}.cgn-timeline span{font-size:12px;color:var(--muted);margin-top:2px}.txn-list{display:grid;gap:12px}.txn{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center}.txn .circle{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid currentColor}.txn strong,.txn small{display:block}.txn small{color:var(--muted);margin-top:2px}.plus{color:var(--green)}.minus{color:var(--danger)}
.settings-list{display:grid;gap:13px}.setting-title{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.09em;margin:4px 0}.switch-row{display:flex;align-items:center;gap:12px;color:var(--muted)}.switch{width:44px;height:24px;border-radius:999px;background:rgba(255,255,255,.25);position:relative;flex:0 0 44px}.switch:after{content:"";position:absolute;width:20px;height:20px;top:2px;left:2px;border-radius:50%;background:white;transition:.2s}.switch.on{background:linear-gradient(135deg,var(--purple),var(--blue))}.switch.on:after{left:22px}.cgn-toast{padding:12px;border-radius:15px;background:rgba(27,216,255,.08);border:1px solid rgba(27,216,255,.18)}.cgn-toast strong,.cgn-toast span{display:block}.cgn-toast span{color:var(--muted);font-size:12px;margin-top:3px}
.login-page{display:grid;place-items:center;padding:18px}.login-wrap{width:min(480px,100%)}.login-card{padding:26px}.login-card h1{margin:0 0 10px;font-size:34px;letter-spacing:-.05em}.login-card p:not(.cgn-eyebrow){color:var(--muted);line-height:1.6;margin:0 0 18px}.twitch-login{width:100%;height:48px;border:0;border-radius:15px;background:linear-gradient(135deg,#9146ff,var(--purple));color:#fff;font-weight:800;cursor:pointer;box-shadow:0 0 28px rgba(145,70,255,.25)}.login-hints{display:grid;gap:12px;margin-top:18px}.login-state{display:flex;gap:8px;flex-wrap:wrap}

@media(max-width:1366px){
  :root{--topbar-h:60px;--gap:10px;--sidebar-w:248px}
  .cgn-topbar{top:8px;left:8px;right:8px;height:var(--topbar-h);padding:8px 12px;grid-template-columns:minmax(190px,.75fr) minmax(160px,.55fr) auto minmax(225px,auto)}
  .cgn-icon-button{width:40px;height:40px;flex-basis:40px}
  .page-header{min-height:74px;padding:13px}
  .page-header h1{font-size:22px}
  .page-header p:not(.cgn-eyebrow){font-size:14px}
  .cgn-card{padding:11px}
  .metric-card strong{font-size:18px}
  .module-row{padding:9px;grid-template-columns:40px minmax(0,1fr) 176px}
  .chart-card{min-height:260px}
  .fake-chart{height:170px}
  .span2{min-height:190px}
}
@media(max-width:1180px){
  .cgn-layout,body.nav-collapsed .cgn-layout{display:block;padding:calc(var(--topbar-h) + 22px) 8px 22px}
  .cgn-sidebar{position:fixed;z-index:80;top:calc(var(--topbar-h) + 18px);left:8px;bottom:auto;width:280px;max-width:calc(100vw - 16px);height:calc(100vh - var(--topbar-h) - 26px);transform:translateX(calc(-100% - 20px));opacity:0;pointer-events:none}
  body.nav-open .cgn-sidebar{transform:translateX(0);opacity:1;pointer-events:auto}
  body.nav-collapsed .cgn-sidebar{transform:translateX(calc(-100% - 20px));opacity:0}
  .cgn-scrim{position:fixed;inset:0;z-index:75;background:rgba(0,0,0,.48);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .2s ease;display:block}
  body.nav-open .cgn-scrim{opacity:1;pointer-events:auto}
  .cgn-topbar{grid-template-columns:minmax(220px,1fr) minmax(190px,.65fr) minmax(230px,auto)}
  .top-center{display:none}
  .page-grid{grid-template-columns:1fr}
  .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  .cgn-topbar{height:auto;grid-template-columns:1fr;align-items:stretch}
  .top-right{justify-content:flex-start}
  .cgn-avatar-copy{display:none}
  .cgn-layout,body.nav-collapsed .cgn-layout{padding-top:184px}
  .cgn-sidebar{top:174px;height:calc(100vh - 182px)}
  .metric-grid{grid-template-columns:1fr}
  .module-row{grid-template-columns:40px minmax(0,1fr)}
  .module-actions{grid-column:2;grid-template-columns:1fr 1fr}
  .table-head{display:none}
  .table-row{grid-template-columns:52px minmax(0,1fr) 60px}
  .table-row span:nth-child(3){display:none}
  .kpi-grid{grid-template-columns:1fr}
}


/* v11 module navigation examples */
.module-tabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:0 0 var(--gap);
  padding:8px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:18px;
  background:rgba(8,13,31,.46);
  backdrop-filter:blur(14px);
}
.module-tab{
  min-height:36px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:13px;
  padding:0 13px;
  background:rgba(255,255,255,.045);
  color:var(--muted);
  cursor:pointer;
}
.module-tab:hover{color:#fff;background:rgba(255,255,255,.07)}
.module-tab.is-active{
  color:#fff;
  background:linear-gradient(135deg,rgba(155,77,255,.62),rgba(59,130,255,.42));
  border-color:rgba(27,216,255,.28);
  box-shadow:0 0 18px rgba(27,216,255,.10);
}
.module-layout-note{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  margin-bottom:var(--gap);
}
.module-note-copy{
  color:var(--muted);
  line-height:1.45;
}
.module-note-copy b{color:#fff}
.admin-lock-note{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(255,209,102,.24);
  background:rgba(255,209,102,.08);
  color:var(--muted);
}
.admin-lock-note strong{display:block;color:#fff;margin-bottom:2px}
.admin-lock-note i{
  width:32px;height:32px;display:grid;place-items:center;border-radius:12px;
  color:#151000;background:var(--yellow);font-style:normal;font-weight:900;flex:0 0 32px;
}
.simple-form{
  display:grid;
  gap:10px;
}
.form-row{
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  gap:10px;
  align-items:center;
  padding:10px;
  border-radius:15px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.06);
}
.form-row label{color:var(--muted);font-size:13px}
.form-control{
  min-height:38px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  background:rgba(255,255,255,.045);
  color:#fff;
  padding:0 12px;
}
.form-help{font-size:12px;color:var(--muted);line-height:1.45}
.page-split-3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--gap);
}
.mini-action-list{display:grid;gap:9px}
.mini-action{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:10px;
  border-radius:15px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.06);
}
.mini-action .module-icon{width:34px;height:34px;border-radius:12px}
.mini-action b,.mini-action small{display:block}
.mini-action small{color:var(--muted);font-size:12px;margin-top:2px}
@media(max-width:1366px){
  .module-tab{min-height:34px;padding:0 11px;font-size:13px}
  .module-layout-note{grid-template-columns:1fr}
}
@media(max-width:1180px){
  .page-split-3{grid-template-columns:1fr}
}
@media(max-width:820px){
  .form-row{grid-template-columns:1fr}
}


/* v12: topbar shows module + active tab, page header is more compact */
.cgn-breadcrumb strong .tab-part{
  color:var(--muted);
  font-weight:750;
}
.cgn-breadcrumb strong .tab-part:before{
  content:" · ";
  color:rgba(255,255,255,.46);
  font-weight:600;
}
.page-header.module-page-header{
  min-height:76px;
}
.page-header.module-page-header h1{
  font-size:clamp(21px,1.85vw,28px);
  margin-bottom:5px;
}
.page-header.module-page-header p:not(.cgn-eyebrow){
  font-size:15px;
  max-width:920px;
}
.page-header.module-page-header .cgn-eyebrow{
  opacity:.92;
}
@media(max-width:1366px){
  .page-header.module-page-header{min-height:66px;padding:12px}
  .page-header.module-page-header h1{font-size:21px}
  .page-header.module-page-header p:not(.cgn-eyebrow){font-size:13.5px}
}


/* v13: active tab stays inline directly behind the module name */
.cgn-breadcrumb strong{
  display:flex;
  align-items:baseline;
  gap:0;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cgn-breadcrumb strong .tab-part{
  display:inline;
  color:var(--muted);
  font-size:.78em;
  font-weight:760;
  margin-left:7px;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cgn-breadcrumb strong .tab-part:before{
  content:"•";
  display:inline-block;
  margin-right:7px;
  color:rgba(255,255,255,.58);
  font-weight:800;
}


/* RDAP_DESIGN1C_TRUE_V13_PORT: Remote-Modboard Bindings, keine Backend-/Auth-Änderung */
[hidden]{display:none!important}
.loginScene[hidden],.deniedScene[hidden],.dashboardScene[hidden]{display:none!important}
.loginScene,.deniedScene{min-height:100vh}
.login-card h1{margin:0 0 12px;font-size:clamp(31px,4vw,52px);line-height:1.02}
.login-card p{color:var(--muted);line-height:1.62}
.twitch-login{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;margin-top:10px;padding:0 22px;border:1px solid rgba(27,216,255,.35);border-radius:16px;background:linear-gradient(135deg,rgba(27,216,255,.18),rgba(155,77,255,.22));color:#fff;font-weight:900;text-decoration:none;box-shadow:0 0 24px rgba(27,216,255,.12);cursor:pointer}
.twitch-login:hover{border-color:rgba(255,255,255,.42);box-shadow:0 0 32px rgba(27,216,255,.18),0 0 34px rgba(155,77,255,.14)}
.login-hints{margin-top:20px;display:grid;gap:12px}.login-state{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.login-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.dashboardScene{min-height:100vh}.dashboardScene[hidden]+*{display:none}
.cgn-topbar{grid-template-columns:minmax(210px,.82fr) minmax(190px,.68fr) auto minmax(285px,auto)}
.top-search input:disabled{opacity:.72}.top-search.disabled{opacity:.82}
.cgn-chip{white-space:nowrap}.cgn-chip--bad{border-color:rgba(255,84,112,.35);color:#ffd0d8;background:rgba(255,84,112,.10)}
.rdap-view{display:none}.rdap-view.is-active-view{display:block}
.page-header h1{margin:0 0 8px}.page-header p{margin:0;color:var(--muted);line-height:1.55}.page-header .cgn-eyebrow{margin:0 0 6px}.page-grid{margin-top:var(--gap)}
.kv-grid{display:grid;gap:9px}.kv-row{display:grid;grid-template-columns:minmax(160px,.45fr) minmax(0,1fr);gap:12px;align-items:center;min-height:40px;padding:9px 11px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.035)}.kv-row span{color:var(--muted);font-size:13px}.kv-row strong{overflow-wrap:anywhere}.valueTrue,.quickGood{color:var(--green)!important}.valueFalse,.quickBad{color:var(--danger)!important}.valueNeutral{color:#dce7ff!important}
.security-list{display:grid;gap:9px;margin:0;padding:0;list-style:none}.security-list li{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 12px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.035)}.security-list span{color:var(--muted)}
.endpoint-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.endpoint{display:grid;gap:5px;min-height:88px;padding:12px;border:1px solid rgba(255,255,255,.07);border-radius:16px;background:rgba(255,255,255,.035)}.endpoint span,.endpoint small{color:var(--muted);overflow-wrap:anywhere}.endpoint strong{color:var(--green)}.endpoint.bad{border-color:rgba(255,84,112,.36)}.endpoint.bad strong{color:var(--danger)}
.routes{display:grid;gap:9px}.route{display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px;padding:11px;border:1px solid rgba(255,255,255,.07);border-radius:15px;background:rgba(255,255,255,.035)}.method{display:inline-flex;align-items:center;justify-content:center;width:fit-content;min-width:48px;height:26px;padding:0 8px;border-radius:10px;background:rgba(69,245,167,.10);border:1px solid rgba(69,245,167,.22);color:var(--green);font-size:12px;font-weight:950}.routePath{font-weight:850;overflow-wrap:anywhere}.routeDescription{margin-top:3px;color:var(--muted);font-size:13px;line-height:1.4}
.errorBox{margin:0 0 var(--gap);display:flex;justify-content:space-between;align-items:center;gap:12px;border-color:rgba(255,209,102,.32)}.errorBox p{margin:5px 0 0;color:var(--muted)}.errorBox[hidden]{display:none!important}.secondaryButton{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 14px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.052);color:#fff;font-weight:850;cursor:pointer}.secondaryButton.small{min-height:34px;font-size:13px}.secondaryButton:hover{border-color:rgba(27,216,255,.35)}
.footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:var(--gap) 0 18px;color:var(--muted);font-size:13px}.rdap-readonly-badge{color:var(--yellow)}
@media(max-width:1100px){.endpoint-grid{grid-template-columns:1fr}.kv-row,.route{grid-template-columns:1fr}.cgn-topbar{grid-template-columns:1fr auto}.top-search,.top-center{display:none}.top-right{min-width:0}.cgn-avatar-copy{display:none}}


/* RDAP_PERMISSIONS1_ROLE_ALLOWLIST_UI - read-only access model cards */
.access-note{display:grid;gap:10px;color:var(--muted);line-height:1.55}
.access-note p{margin:0}
.access-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.access-columns h3{margin:0 0 8px;font-size:14px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.model-list{display:grid;gap:8px}
.model-row{display:grid;gap:3px;min-height:54px;padding:10px 11px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.035)}
.model-row strong{font-size:13px;overflow-wrap:anywhere}
.model-row small{color:var(--muted);font-size:12px;line-height:1.35;overflow-wrap:anywhere}
.model-row.muted{opacity:.72}
@media(max-width:1100px){.access-columns{grid-template-columns:1fr}}


/* RDAP_USERMENU1_SELF_PROFILE_PANEL: eigenes Profil oben rechts, read-only */
.cgn-avatar-button{
  position:relative;
  overflow:visible;
}
.cgn-avatar-button:hover,
.cgn-avatar-button[aria-expanded="true"]{
  border-color:rgba(27,216,255,.48);
  box-shadow:0 0 18px rgba(27,216,255,.14),0 0 22px rgba(155,77,255,.12);
}
.cgn-avatar img,
.self-profile-avatar img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border-radius:inherit;
}
.cgn-avatar.has-image,
.self-profile-avatar.has-image{
  background:rgba(255,255,255,.06);
  padding:0;
  overflow:hidden;
}
.self-profile-panel{
  position:fixed;
  z-index:95;
  top:calc(var(--topbar-h) + 24px);
  right:16px;
  width:min(420px,calc(100vw - 32px));
  max-height:calc(100vh - var(--topbar-h) - 42px);
  overflow:auto;
  padding:16px;
  border-color:rgba(27,216,255,.30);
  box-shadow:0 20px 70px rgba(0,0,0,.44),0 0 42px rgba(27,216,255,.12),0 0 48px rgba(155,77,255,.14);
}
.self-profile-backdrop{
  position:fixed;
  inset:0;
  z-index:90;
  background:rgba(0,0,0,.14);
}
.self-profile-head{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) 42px;
  gap:12px;
  align-items:center;
  margin-bottom:14px;
}
.self-profile-avatar{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  border-radius:22px;
  background:linear-gradient(135deg,var(--purple),var(--pink));
  color:#fff;
  font-size:26px;
  font-weight:950;
  box-shadow:0 0 24px rgba(155,77,255,.22),inset 0 1px 0 rgba(255,255,255,.18);
}
.self-profile-head h2{
  margin:0;
  font-size:22px;
  letter-spacing:-.035em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.self-profile-head small{
  color:var(--muted);
  display:block;
  margin-top:2px;
}
.self-profile-close{
  justify-self:end;
  font-size:22px;
  line-height:1;
}
.self-profile-grid{
  display:grid;
  gap:8px;
}
.self-profile-grid .kv-row{
  grid-template-columns:145px minmax(0,1fr);
}
.self-profile-note{
  margin-top:12px;
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(27,216,255,.18);
  background:rgba(27,216,255,.07);
}
.self-profile-note strong,
.self-profile-note span{
  display:block;
}
.self-profile-note span{
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
  margin-top:3px;
}

.self-profile-sync{
  margin-top:12px;
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(27,216,255,.22);
  background:rgba(27,216,255,.08);
}
.self-profile-sync strong,
.self-profile-sync span{
  display:block;
}
.self-profile-sync span{
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
  margin-top:3px;
}
.self-profile-sync--loading{
  border-color:rgba(27,216,255,.28);
  background:rgba(27,216,255,.09);
}
.self-profile-sync--success{
  border-color:rgba(69,245,167,.30);
  background:rgba(69,245,167,.08);
}
.self-profile-sync--error{
  border-color:rgba(255,84,112,.34);
  background:rgba(255,84,112,.08);
}
.secondaryButton:disabled{
  opacity:.55;
  cursor:not-allowed;
}

.self-profile-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
  margin-top:12px;
}
.secondaryButton.danger{
  border-color:rgba(255,84,112,.32);
  color:#ffd8df;
}
@media(max-width:820px){
  .self-profile-panel{top:118px;right:8px;width:calc(100vw - 16px);max-height:calc(100vh - 132px)}
  .self-profile-head{grid-template-columns:56px minmax(0,1fr) 40px}
  .self-profile-avatar{width:56px;height:56px;border-radius:19px;font-size:23px}
  .self-profile-grid .kv-row{grid-template-columns:1fr}
}


/* RDAP_LOGIN1_CENTER_LAYOUT_FIX: Login-/Denied-Seite nicht oben links quetschen */
.loginScene,
.deniedScene{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:calc(var(--topbar-h) + 34px) 18px 34px;
}
.loginScene .login-wrap,
.deniedScene .login-wrap{
  width:min(560px,calc(100vw - 36px));
  margin:0 auto;
}
.loginScene .login-card,
.deniedScene .login-card{
  position:relative;
  overflow:hidden;
  padding:34px;
  text-align:center;
  border-color:rgba(27,216,255,.24);
  box-shadow:
    0 18px 54px rgba(0,0,0,.34),
    0 0 44px rgba(155,77,255,.13),
    0 0 36px rgba(27,216,255,.08),
    inset 0 1px 0 rgba(255,255,255,.055);
}
.loginScene .login-card:before,
.deniedScene .login-card:before{
  content:"";
  position:absolute;
  inset:-1px;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 0%,rgba(27,216,255,.16),transparent 34%),
    radial-gradient(circle at 84% 8%,rgba(155,77,255,.18),transparent 36%);
  opacity:.95;
}
.loginScene .login-card > *,
.deniedScene .login-card > *{
  position:relative;
  z-index:1;
}
.loginScene .twitch-login,
.deniedScene .twitch-login{
  width:100%;
  max-width:360px;
  margin-left:auto;
  margin-right:auto;
}
.loginScene .cgn-toast,
.deniedScene .cgn-toast{
  text-align:left;
}
@media(max-width:820px){
  .loginScene,
  .deniedScene{
    align-items:center;
    padding:34px 14px;
  }
  .loginScene .login-wrap,
  .deniedScene .login-wrap{
    width:100%;
  }
  .loginScene .login-card,
  .deniedScene .login-card{
    padding:24px 18px;
  }
  .loginScene .login-card h1,
  .deniedScene .login-card h1{
    font-size:clamp(28px,9vw,38px);
  }
}

/* RDAP_LAYOUT2_GRID_SPACING_FIX: V13 metric grid binding restored.
   The template uses .metric-grid; older RDAP HTML temporarily used .metrics-grid.
   Keep both selectors so future pages do not collapse into full-width stacked cards. */
.metric-grid,
.metrics-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--gap);
  margin-bottom:var(--gap);
}
.metric-grid .metric-card,
.metrics-grid .metric-card{
  min-width:0;
}
.metric-grid .cgn-progress,
.metrics-grid .cgn-progress{
  height:5px;
  margin-top:10px;
  border-radius:99px;
  background:rgba(255,255,255,.08);
  overflow:hidden;
}
.metric-grid .cgn-progress i,
.metrics-grid .cgn-progress i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--purple),var(--cyan));
  box-shadow:0 0 14px rgba(27,216,255,.32);
}
.metric-grid .cgn-progress--warn i,
.metrics-grid .cgn-progress--warn i{
  background:linear-gradient(90deg,var(--yellow),var(--pink));
}
@media(max-width:1180px){
  .metric-grid,
  .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:820px){
  .metric-grid,
  .metrics-grid{grid-template-columns:1fr;}
}


/* RDAP_ADMIN_USERS1_READONLY_OVERVIEW */
.admin-user-table{display:grid;gap:8px}
.admin-user-row{display:grid;grid-template-columns:minmax(180px,1.4fr) minmax(84px,.45fr) minmax(120px,.7fr) minmax(150px,.8fr);gap:10px;align-items:center;padding:10px;border-radius:15px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.06)}
.admin-user-row strong,.admin-user-row small{display:block}.admin-user-row small{color:var(--muted);font-size:12px;margin-top:2px}.admin-user-row span{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-user-row--empty{grid-template-columns:90px minmax(0,1fr)}
@media(max-width:900px){.admin-user-row{grid-template-columns:1fr}.admin-user-row span{white-space:normal}}

/* RDAP_DESIGN1_REAL_CGN_LOGIN_CLEANUP: sauberer CGN Login ohne technische Statusboxen */
.loginScene{
  position:relative;
  display:grid;
  place-items:center;
  min-height:100vh;
  padding:32px;
  overflow:hidden;
}
.loginScene:before,
.loginScene:after{
  content:"";
  position:fixed;
  z-index:-3;
  pointer-events:none;
  border-radius:999px;
  filter:blur(22px);
  opacity:.58;
}
.loginScene:before{
  width:520px;
  height:680px;
  left:-150px;
  top:16%;
  background:
    radial-gradient(ellipse at 45% 50%,rgba(191,67,255,.42),transparent 62%),
    radial-gradient(ellipse at 70% 38%,rgba(98,65,255,.22),transparent 64%);
  transform:rotate(-13deg);
}
.loginScene:after{
  width:560px;
  height:720px;
  right:-160px;
  bottom:1%;
  background:
    radial-gradient(ellipse at 48% 44%,rgba(27,216,255,.34),transparent 62%),
    radial-gradient(ellipse at 28% 70%,rgba(59,130,255,.18),transparent 66%);
  transform:rotate(18deg);
}
.loginScene .dot-grid{
  display:none;
}
.loginScene ~ .dashboardScene .dot-grid{
  display:block;
}
body:has(.loginScene:not([hidden])) .dot-grid{
  display:none;
}
body:has(.loginScene:not([hidden])) .stars{
  opacity:.12;
  background-size:62px 62px;
}
body:has(.loginScene:not([hidden])) .cgn-galaxy{
  background:
    radial-gradient(circle at 51% 22%,rgba(74,92,255,.24),transparent 34%),
    radial-gradient(circle at 15% 61%,rgba(155,77,255,.16),transparent 34%),
    radial-gradient(circle at 84% 61%,rgba(27,216,255,.13),transparent 36%),
    linear-gradient(135deg,#030614 0%,#080d2a 42%,#08184a 72%,#030512 100%);
}
body:has(.loginScene:not([hidden])) .bg-wash-a{
  opacity:.36;
  filter:blur(66px);
}
body:has(.loginScene:not([hidden])) .bg-wash-b{
  opacity:.30;
  filter:blur(72px);
}
.login-wrap{
  width:min(860px,100%);
  margin:auto;
}
.login-card.login-card--welcome{
  position:relative;
  isolation:isolate;
  width:100%;
  min-height:520px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:54px clamp(28px,6vw,88px);
  border-radius:34px;
  border:1px solid rgba(128,150,255,.62);
  background:
    radial-gradient(circle at 50% 0%,rgba(75,104,255,.20),transparent 34%),
    linear-gradient(145deg,rgba(31,27,67,.78),rgba(5,12,34,.80) 58%,rgba(8,19,50,.78));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.035),
    0 24px 90px rgba(0,0,0,.46),
    0 0 44px rgba(27,216,255,.15),
    0 0 58px rgba(155,77,255,.16),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 0 70px rgba(59,130,255,.08);
  backdrop-filter:blur(22px);
}
.login-card.login-card--welcome:before{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:-1;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg,rgba(255,119,255,.82),rgba(27,216,255,.82));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:.78;
}
.login-card.login-card--welcome:after{
  content:"";
  position:absolute;
  left:18%;
  right:18%;
  top:-2px;
  height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,transparent,rgba(155,77,255,.88),rgba(27,216,255,.88),transparent);
  box-shadow:0 0 28px rgba(27,216,255,.38);
}
.login-mark{
  width:70px;
  height:70px;
  display:grid;
  place-items:center;
  margin:0 0 22px;
  border-radius:24px;
  background:radial-gradient(circle,rgba(27,216,255,.18),transparent 62%);
  filter:drop-shadow(0 0 18px rgba(27,216,255,.42));
}
.login-mark span{
  width:42px;
  height:42px;
  display:block;
  border-radius:10px 10px 14px 14px;
  border:6px solid transparent;
  border-top-color:var(--cyan);
  border-left-color:var(--cyan);
  border-right-color:var(--purple);
  transform:rotate(45deg);
  box-shadow:0 0 18px rgba(27,216,255,.28),inset 0 0 12px rgba(155,77,255,.20);
}
.login-card.login-card--welcome .cgn-eyebrow{
  margin:0 0 18px;
  color:rgba(232,237,255,.82);
  font-size:13px;
  line-height:1.2;
  letter-spacing:.18em;
  text-shadow:0 0 18px rgba(27,216,255,.14);
}
.login-card.login-card--welcome h1{
  margin:0;
  font-size:clamp(48px,6.6vw,86px);
  line-height:.98;
  letter-spacing:-.065em;
  color:#fff;
  text-shadow:0 16px 40px rgba(0,0,0,.34);
}
.login-card.login-card--welcome h1:after{
  content:"";
  display:block;
  width:120px;
  height:2px;
  margin:28px auto 0;
  border-radius:99px;
  background:linear-gradient(90deg,transparent,var(--cyan),var(--purple),transparent);
  box-shadow:0 0 18px rgba(27,216,255,.48);
}
.login-card.login-card--welcome p:not(.cgn-eyebrow){
  margin:26px auto 28px;
  max-width:560px;
  color:rgba(221,228,255,.84);
  font-size:clamp(18px,1.48vw,21px);
  line-height:1.42;
  text-wrap:balance;
}
.login-card.login-card--welcome .twitch-login{
  width:min(460px,100%);
  min-height:70px;
  height:auto;
  margin:0;
  padding:0 32px;
  gap:16px;
  white-space:nowrap;
  border:1px solid rgba(213,170,255,.56);
  border-radius:17px;
  background:
    linear-gradient(135deg,rgba(196,58,255,.95),rgba(105,55,236,.96) 52%,rgba(94,55,255,.93));
  color:#fff;
  font-size:clamp(20px,2vw,28px);
  font-weight:950;
  letter-spacing:-.025em;
  text-decoration:none;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.05),
    0 16px 42px rgba(97,44,255,.30),
    0 0 34px rgba(190,63,255,.25),
    inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,filter .18s ease;
}
.login-card.login-card--welcome .twitch-login:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.78);
  filter:saturate(1.08);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.08),
    0 20px 52px rgba(97,44,255,.38),
    0 0 48px rgba(190,63,255,.36),
    inset 0 1px 0 rgba(255,255,255,.28);
}
.twitch-icon{
  width:32px;
  height:32px;
  flex:0 0 32px;
  display:grid;
  place-items:center;
}
.twitch-icon svg{
  width:32px;
  height:32px;
  fill:currentColor;
  filter:drop-shadow(0 0 10px rgba(255,255,255,.18));
}
.login-safe-note{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:28px;
  color:rgba(213,221,255,.70);
  font-size:clamp(14px,1.25vw,17px);
}
.login-safe-note span{
  color:rgba(172,191,255,.88);
  filter:drop-shadow(0 0 8px rgba(27,216,255,.25));
}
@media(max-width:820px){
  .loginScene{padding:18px}
  .login-wrap{width:100%}
  .login-card.login-card--welcome{
    min-height:auto;
    padding:40px 22px;
    border-radius:28px;
  }
  .login-mark{width:56px;height:56px;margin-bottom:18px}
  .login-mark span{width:34px;height:34px;border-width:5px}
  .login-card.login-card--welcome .cgn-eyebrow{font-size:11px;letter-spacing:.13em}
  .login-card.login-card--welcome h1{font-size:clamp(44px,13vw,62px)}
  .login-card.login-card--welcome p:not(.cgn-eyebrow){font-size:17px;max-width:330px}
  .login-card.login-card--welcome .twitch-login{min-height:62px;font-size:19px;padding:0 20px;width:min(320px,100%)}
  .twitch-icon,.twitch-icon svg{width:28px;height:28px}
}

