/*! NEXTARI · Author: Marvin Slotta · Build 2026.09.07 */
:root{
--blue:#8ab4f8;}
body{font-family:'Nunito Sans',sans-serif;color:var(--txt);min-height:100vh;}
button{cursor:pointer;border:none;background:none;color:inherit}
@media (hover:hover){::-webkit-scrollbar-thumb:hover{background:var(--accent)}}
.app{display:flex;min-height:100vh}
.soon .ic{opacity:.7}
.main{margin-left:0;min-width:0;}
.head{display:flex;justify-content:space-between;gap:16px;margin-bottom:24px}
.head h1{font-family:var(--nx-f-titel);font-weight:800;letter-spacing:-.3px}
.head-act{display:flex;gap:8px;flex:none;align-items:center}
.search input{background:none;border:none;outline:none;color:var(--txt);font-size:var(--nx-typo-text);width:100%}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.stat .k{font-weight:700;}
.stat .v{font-family:var(--nx-f-titel);line-height:1}
.stat .v small{font-size:var(--nx-typo-kartenkopf);color:var(--dim);font-weight:700}
.stat .d{font-size:var(--nx-typo-text);color:var(--dim);margin-top:8px}
.stat .d em{font-style:normal;color:var(--green)}
.attn{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}
.card{margin-bottom:16px;}
.grip{color:var(--faint);cursor:grab;flex:none}
.grid{display:grid;align-items:center;gap:16px;padding:16px 16px;border-bottom:1px solid var(--line)}
.grid:last-child{border-bottom:none}
@media (hover:hover){.grid:hover:not(.headr){background:var(--nx-hebung)}}
.end{display:flex;justify-content:flex-end;gap:8px}
.muted{color:var(--faint)}
.av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:var(--nx-typo-text);color:#fff;flex:none}
.pill.paused,.pill.pending,.pill.draft{color:var(--gold);border-color:rgba(255,197,61,.32);background:rgba(255,197,61,.08)}
.pill.paused .dot,.pill.pending .dot,.pill.draft .dot{background:var(--gold)}
.note{margin-bottom:16px}
.note svg{color:var(--nx-text);flex:none;margin-top:1px}
.note b{font-family:var(--nx-f-text);font-size:var(--nx-typo-text)}
.note p{font-size:var(--nx-typo-text);color:var(--dim);margin-top:4px;line-height:1.5;max-width:820px}
.field input, .field select{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:var(--nx-r-bedien);padding:8px 16px;color:var(--txt);font-size:14px;outline:none}
.field textarea{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:var(--nx-r-bedien);padding:8px 16px;color:var(--txt);outline:none}
.act{display:flex;gap:16px;padding:16px 16px;border-bottom:1px solid var(--line);align-items:flex-start}
.act:last-child{border-bottom:none}
.act .tm{font-size:var(--nx-typo-meta);color:var(--faint);margin-top:2px}
.chart .bar{width:100%;max-width:34px;border-radius:8px 6px 0 0;background:var(--accent);transition:.2s}
@media(max-width:1040px){.stats{grid-template-columns:repeat(2,1fr)}.attn{grid-template-columns:1fr}}
@media(max-width:980px){.main{margin-left:0;padding:16px;max-width:none}.grid{grid-template-columns:1fr;gap:8px}.headr{display:none}}
@keyframes nxin{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.entry{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);border-radius:var(--nx-r-bedien);padding:8px 8px}
.entry input{flex:1;background:none;border:none;outline:none;color:var(--txt);font-size:var(--nx-typo-text);font-family:'Nunito Sans'}
.entadd input{flex:1;background:var(--bg);border:1px solid var(--line);border-radius:var(--nx-r-bedien);padding:8px 16px;color:var(--txt);font-size:var(--nx-typo-text);outline:none}
:root{--ag-bg:#101013;--ag-surface:#1f1f24;--ag-surface2:#2d2d34;--ag-line:rgba(255,255,255,.07);--ag-line2:rgba(255,255,255,.13);--ag-txt:#eef1f7;--ag-txt2:#9aa4ba;--ag-txt3:#a9a9b6;--ag-blue:var(--accent);--ag-blue-hi:var(--accent);--ag-mono:'Nunito Sans',monospace;--ag-r:14px}
body[data-nxfam=event]{--ag-blue:#ff8a3d;--ag-blue-hi:#ffb43d;--ag-ontext:#2b1500}
body[data-nxfam=creator]{--ag-blue:var(--accent);--ag-blue-hi:var(--accent);--ag-ontext:#140b2e}
body[data-nxfam=publisher],body[data-nxfam=agency]{--ag-blue:#34e5d8;--ag-blue-hi:#7ceee5;--ag-ontext:#04302b}
body{background:var(--ag-bg)}
.main{flex:1;overflow-y:auto;}
/* DIE SEITENBREITE STEHT AN .main · NICHT NOCHMAL AN JEDEM KASTEN.
  .main traegt bereits max-width und Polster. Die Breite ein zweites Mal an
  den Kindern rechnete dieselben 68px erneut ab · und weil manche Kaesten
  ihren Rand selbst auf 0 setzen, standen sie danach 34px weiter links als
  ihre Nachbarn. Gemessen  auf der Studio-Uebersicht: vier Kaesten
  auf 284, fuenf auf 318, alle gleich breit. Das ist die Unruhe, die man
  sieht, ohne sie benennen zu koennen. */
.main .head, .main > *{max-width:none;margin-left:0;margin-right:0}
.main .head h1{font-size:26px;letter-spacing:-.01em}
.stat{background:var(--ag-surface);border:1px solid var(--ag-line);border-radius:var(--ag-r);padding:18px}
.stat .k{font-family:var(--ag-mono);font-size:var(--nx-typo-klein);color:var(--ag-txt3)}
.stat .v{font-size:30px;font-weight:800;letter-spacing:-.02em;color:var(--ag-txt);margin-top:6px}
.note{background:var(--nx-hebung);border:1px solid rgba(255,255,255,0.11);border-radius:var(--ag-r)}
.grid{border-top:1px solid var(--ag-line)}
.note{display:flex;gap:14px;align-items:flex-start;padding:16px 18px}
.note > svg{width:20px;height:20px;flex:0 0 20px}
.note .cs-ic svg,.note svg{max-width:22px;max-height:22px}
.app .side::before,.app .side::after{content:none;display:none;border:none;background:none}
.app .side{box-shadow:none;background:var(--ag-bg)}
.stat{position:relative}
.stat .v{max-width:calc(100% - 90px)}
html body>footer.footer,html body .app~footer.footer{width:100%;max-width:none;margin:0;position:relative;z-index:1}
.finner{max-width:var(--nx-breite);margin:0 auto;padding:88px var(--nx-rand) 72px;display:grid;gap:24px}
.fbr .logo{margin-bottom:0}
.finner{grid-template-columns:1fr 1fr}
.nx-coming-panel{max-width:560px;margin:40px auto;text-align:center;padding:48px 32px;background:var(--nx-hebung);border:1px solid rgba(255,255,255,0.14);border-radius:var(--nx-r-tafel)}
.nx-coming-panel .nx-cp-ic{width:56px;height:56px;margin:0 auto 18px;display:grid;place-items:center;border-radius:var(--nx-r-tafel);background:var(--accent);color:#fff}
.nx-coming-panel h2{font-family:var(--nx-f-titel);font-size:26px;color:#fff;margin:0 0 10px}
.nx-coming-panel p{font-size:14px;color:var(--dim);line-height:1.55;margin:0 auto;max-width:400px}
.nx-coming-panel .nx-cp-pill{display:inline-flex;align-items:center;gap:6px;margin-top:18px;font-size:var(--nx-typo-meta);font-weight:700;color:#fff;background:var(--accent);border-radius:var(--nx-r-tafel);padding:8px 16px}
.app~footer.footer .finner{max-width:none;margin:0;padding-left:40px;padding-right:40px;grid-template-columns:1.4fr 1fr 1fr 1.2fr;align-items:start}
.av{position:relative;line-height:1}
.av>.online{right:1px;bottom:1px;width:10px;height:10px;border-radius:50%;background:#3be37a;box-shadow:0 0 0 2px var(--panel,#121215)}
.av{font-family:var(--nx-f-text)}
@media (hover:hover){.side-nav a:hover{background:var(--nx-hebung)}}
input, select, textarea{font-family:inherit}
.brand{grid-template-columns:auto auto;text-decoration:none}
/* .finner hat FUENF Kinder, aber nur VIER Spalten: .nx-fg ueberspannt die
  erste Zeile, darunter stehen .fbrand und drei .fcol. Die Regel nannte
  fuenf Breiten · die fuenfte verfiel, und Spalte 1 wurde mit 526 px
  doppelt so breit wie ihre Nachbarn (171/227/263). Dazu schob
  margin-left die zweite Spalte noch einmal weg · zusammen die Luecke
  von 310 px im Bild. Vier Spalten: die Marke traegt den Claim und darf
  breiter sein, die drei Linkspalten sind gleich. */
/* minmax(0,...) ist noetig: ein blosses 1.5fr heisst minmax(auto,1.5fr),
  und der Claim "Second screen for gaming culture." hat eine breite
  min-content · er drueckte Spalte 1 auf 526 px zurueck, egal was die
  Regel sagte. Gemessen: 515/222/222/257 statt der gewollten Gleichheit. */
@media (min-width:1000px){.finner{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
  }
.nxl-l input,.nxl-l select{display:block;width:100%;margin-top:5px;background:var(--nx-hebung);border:1px solid var(--line,#242437);border-radius:var(--nx-r-bedien);color:var(--txt);padding:9px 11px;font-size:14px;box-sizing:border-box}
.nxl-note{font-size:var(--nx-typo-text);color:var(--dim);background:var(--nx-hebung);border:1px solid var(--nx-linie);border-radius:var(--nx-r-bedien);padding:9px 11px;margin:4px 0 16px}
.nxl-act .btn.danger{color:#ff8da3;border-color:rgba(255,77,109,.4)}
@keyframes nxfadeup{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes nxtoastin{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.nx-studiotitle{font:800 26px var(--nx-f-titel);color:#fff;margin:0}
.nx-studiokicker{font:800 var(--nx-typo-meta) var(--nx-f-text);color:var(--dim);margin:0 0 6px}
.nx-noti{position:absolute;top:calc(100% + var(--nx-kopf-haken, 14px));right:0;width:344px;background:var(--surface);border:1px solid var(--line,rgba(255,255,255,.09));box-shadow:var(--nx-schatten);padding:8px;z-index:120;transition:opacity .15s ease,transform .15s ease;font-family:'Nunito Sans',sans-serif;text-align:left;cursor:default}
@media(max-width:900px){
 .nx-demobar{min-height:0;padding-top:calc(6px + env(safe-area-inset-top));padding-bottom:8px}
 
}
.nx-noti{opacity:0;pointer-events:none;transform:translateY(-8px)}
.brand{display:flex;gap:8px;flex:none}
.brand .logo{height:19px;width:auto}
.icon-btn{width:40px;height:40px;border-radius:var(--nx-r-karte);border:1px solid var(--line);background:var(--nx-hebung);
 display:grid;place-items:center;color:var(--dim);cursor:pointer;transition:.15s;position:relative;flex:none}
@media (hover:hover){.icon-btn:hover{color:var(--txt);border-color:var(--line2)}}
.counter{position:absolute;top:5px;right:1px;min-width:14px;height:14px;padding:0 0px;border-radius:10px;
 background:var(--accent);color:#fff;font-family:var(--nx-f-text);font-weight:700;font-size:var(--nx-typo-klein);display:grid;
 place-items:center;box-shadow:none;border:1.5px solid var(--bg)}
.me{display:flex;align-items:center;gap:8px;padding:0px 8px 0px 0px;border-radius:var(--nx-r-pille);border:1px solid var(--line);
 background:var(--nx-hebung);cursor:pointer;transition:.15s}
@media (hover:hover){.me:hover{border-color:var(--line2)}}
.icon-btn,.me,.chip-f,.tha,button,.rbtn{touch-action:manipulation}
.nx-acct-pop{position:absolute;left:12px;right:12px;top:calc(100% + 6px);z-index:6000;
  background:var(--nx-flaeche-2);border:1px solid rgba(255,255,255,0.14);border-radius:var(--nx-r-tafel);padding:8px;
  box-shadow:var(--nx-schatten);display:none}
.brand{align-items:center}
.head{align-items:center}
.side-logo .nx-railname{font-family:var(--nx-f-text);font-weight:700;font-size:var(--nx-typo-kartenkopf);letter-spacing:.4px;display:inline-flex;align-items:center;gap:8px}
.side-logo .nx-railname::before{content:'';width:9px;height:9px;border-radius:4px;background:currentColor;box-shadow:none}
body{padding-top:calc(76px + var(--nx-leiste,48px))}
.main{margin:0 auto;max-width:1240px;padding:26px 32px 72px;width:100%;box-sizing:border-box}
.console-top{position:fixed;top:var(--nx-leiste,48px);left:0;right:0;height:56px;z-index:3500;display:flex;align-items:center;gap:18px;padding:0 24px;background:rgba(9,9,15,.95);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.07);font-family:var(--nx-f-text)}
.console-top .ct-brand{display:flex;align-items:center;gap:10px;flex:none}
.console-top .ct-brand .logo{height:16px;width:auto;color:#fff}
.console-top nav{display:flex;align-items:center;gap:3px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}
.console-top nav a{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 15px;border-radius:var(--nx-r-bedien);font-size:14px;font-weight:700;color:var(--dim);text-decoration:none;white-space:nowrap;transition:.15s;cursor:pointer}
@media (hover:hover){.console-top nav a:hover{color:#fff;background:var(--nx-hebung)}}
.console-top nav a.soon{color:var(--nx-leise);cursor:default}
.console-top nav a .soontag{font-size:8.5px;font-weight:700;letter-spacing:var(--nx-sperrung);text-transform:uppercase;color:var(--dim);border:1px solid rgba(255,255,255,.12);padding:1px 4px;border-radius:var(--nx-r-marke)}
.console-top .ct-right{margin-left:auto;flex:none;display:flex;align-items:center;gap:12px}
@media(max-width:860px){.main{padding:18px 16px 64px}}
@keyframes nxIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}