*{box-sizing:border-box}
:root{--bg:#020817;--panel:#031329ee;--panel2:#071c3cf2;--line:#116ec5;--blue:#179dff;--gold:#ffd21a;--text:#f7f9ff;--muted:#91add1;--green:#22de82;--red:#ff4e60}
html{background:var(--bg);min-height:100%}
body{margin:0;min-height:100vh;color:var(--text);font-family:Segoe UI,Inter,Arial,sans-serif;background:linear-gradient(rgba(1,5,18,.25),rgba(1,5,18,.55)),url("assets/background.jpeg") center top/cover fixed no-repeat}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 50% 5%,rgba(20,90,255,.14),transparent 34%),linear-gradient(90deg,rgba(0,0,0,.55),transparent 20%,transparent 80%,rgba(0,0,0,.55))}
button,select{font:inherit}.app-shell{max-width:1540px;margin:auto;padding:18px 22px 40px}
.top-hero{position:relative;min-height:235px;text-align:center;padding:132px 280px 0}
.hero-logo{position:absolute;top:0;left:50%;transform:translateX(-50%);width:180px;height:130px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(0,156,255,.55));}
.hero-title h1{margin:0;font-size:clamp(38px,4.4vw,60px);font-style:italic;letter-spacing:.04em;background:linear-gradient(#fff 0%,#f6f6f6 58%,#ffd21a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 18px rgba(0,74,255,.18)}
.hero-meta{display:flex;justify-content:center;gap:30px;font-weight:800;margin-top:5px}.hero-meta span{white-space:nowrap}.live-pill{position:absolute;left:0;top:2px;display:flex;gap:10px;align-items:center;background:#04142ddd;border:1px solid #18a6ff;border-radius:12px;padding:10px 15px;box-shadow:0 0 16px #009dff2d}.live-pill .live-dot{width:13px;height:13px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green)}.live-pill div,.time-card span,.admin-top span{display:flex;flex-direction:column;text-align:left}.live-pill small{color:var(--green)}
.top-actions{position:absolute;right:0;top:0;display:flex;gap:8px}.time-card,.admin-top{min-height:58px;background:#04142ddd;border:1px solid #18a6ff;border-radius:12px;color:#fff;padding:9px 13px;display:flex;align-items:center;gap:9px;box-shadow:0 0 15px #009dff22}.time-card small,.admin-top small{color:#79bff5;font-size:10px}.admin-top{cursor:pointer}
.main-nav{display:grid;grid-template-columns:repeat(7,1fr);background:#03142eea;border:1px solid #1684df;border-radius:11px;overflow:hidden;box-shadow:0 0 25px #006fff22}.main-nav button{min-height:71px;background:transparent;color:#fff;border:0;border-right:1px solid #103c6d;font-weight:800;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.main-nav button i{font-style:normal;font-size:24px;color:var(--gold)}.main-nav button.active,.main-nav button:hover{background:#08224c88;box-shadow:inset 0 -3px var(--gold),0 0 15px #ffd21a12}
main{margin-top:13px}.view{display:none}.view.active{display:block}
.row-top{display:grid;grid-template-columns:1.65fr .98fr .9fr;gap:11px}.row-bottom{display:grid;grid-template-columns:.72fr 1.05fr 1.7fr;gap:11px;margin-top:11px}.panel,.placeholder{background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:11px;padding:14px;box-shadow:0 0 17px #006cff16}.panel-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #164878;padding-bottom:8px;margin-bottom:7px}.panel-head h2{font-size:16px;margin:0}.outline-btn{background:transparent;color:var(--gold);border:1px solid #a98e1e;border-radius:6px;padding:7px 11px;font-weight:800;font-size:11px}.centered{display:block;margin:10px auto 0}
.match-header,.match-row{display:grid;grid-template-columns:1.1fr 1.35fr .25fr 1.35fr .42fr .65fr;gap:6px;align-items:center}.match-header{color:#61bdff;font-size:10px;padding:7px 3px}.match-row{padding:8px 3px;border-top:1px solid #123c68;font-size:11px}.match-row b{color:var(--gold)}.ok{color:var(--green)}.bad{color:var(--red)}
.info-grid>div{display:flex;justify-content:space-between;gap:10px;padding:8px 2px;border-bottom:1px solid #133c66;font-size:11px}.info-grid span{color:#5db5fa}.info-grid b{text-align:right}.mini-live{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);margin-right:5px}
.stat-line{display:grid;grid-template-columns:35px 1fr auto;gap:7px;align-items:center;padding:8px 0;border-bottom:1px solid #143b65}.stat-line i{width:30px;height:30px;border:2px solid var(--gold);border-radius:50%;display:grid;place-items:center;font-style:normal}.stat-line small{display:block;color:var(--gold);font-weight:900;font-size:8px}.stat-line b{font-size:10px}.stat-line strong{color:var(--gold);font-size:18px}
.group-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.group-grid button{background:#061933;color:#cfe8ff;border:1px solid #1c578e;border-radius:6px;padding:8px 3px;font-size:10px}.group-grid .selected{background:var(--gold);color:#111;border-color:#ffe46b}
table{width:100%;border-collapse:collapse;font-size:11px}th,td{text-align:left;padding:8px 7px;border-bottom:1px solid #153d68}th{color:#60b9ff;font-size:9px}.leader{background:#06452f88;color:#63f3ae}
.bracket-tabs{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:8px}.bracket-tabs button{background:#061a37;color:#cde7ff;border:1px solid #155996;padding:6px 4px;font-size:9px}.bracket-tabs .active{background:var(--gold);color:#111}
.bracket{display:flex;align-items:center;gap:28px;min-height:220px;overflow:auto;padding:4px 3px}.round{min-width:150px}.round.r2{display:flex;flex-direction:column;gap:35px}.round.r3{display:flex;align-items:center}.pair{position:relative;border:1px solid #1a629f;border-radius:6px;background:#04162f;margin:6px 0}.pair span{display:flex;justify-content:space-between;padding:6px 7px;border-bottom:1px solid #17446f;font-size:9px}.pair span:last-child{border-bottom:0}.pair b{color:var(--gold)}.pair:after{content:"";position:absolute;right:-29px;top:50%;width:29px;border-top:2px solid var(--gold)}.round.final .pair:after{display:none}.trophy{text-align:center;color:var(--gold);font-size:32px}.trophy small{display:block;font-size:11px}
.phase-card{margin-top:11px}.phase-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr auto 1fr auto 1fr auto 1fr;gap:8px;align-items:center}.phase-flow>div{min-height:74px;border:1px solid #155a9c;border-radius:7px;background:#04152f;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:7px;font-size:10px}.phase-flow span{color:#7bc0f5;margin-top:6px}.phase-flow .done{color:var(--green)}.phase-flow .final b,.phase-flow .final span{color:var(--gold)}.phase-flow em{font-style:normal;color:var(--gold);font-size:24px}
.placeholder{min-height:430px}.placeholder h2{color:var(--gold)}
.admin-overlay{position:fixed;right:16px;top:16px;bottom:16px;width:min(360px,calc(100vw - 32px));z-index:100;background:linear-gradient(180deg,#061938f8,#031029fa);border:1px solid #1477cd;border-radius:13px;padding:13px;box-shadow:0 0 35px #000b,0 0 18px #008cff24;overflow:auto;transform:translateX(calc(100% + 40px));transition:.25s}.admin-overlay.open{transform:translateX(0)}.admin-title{display:flex;justify-content:space-between;align-items:start}.admin-title h2{margin:0}.admin-title small{color:#7bbbed}.admin-title button{background:transparent;color:#fff;border:0;font-size:28px}.admin-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:13px 0}.admin-tabs button{background:#041630;color:#b6d7f6;border:1px solid #14518b;border-radius:7px;padding:9px 3px;font-size:9px}.admin-tabs .active{color:var(--gold);border-color:#b0931e;box-shadow:0 0 9px #ffd21a20}.admin-section{border:1px solid #15578e;border-radius:8px;padding:10px}.admin-section h3{font-size:13px}.admin-section p{font-size:9px;color:#82b5df}.mode-box{border-top:1px solid #16456e;padding-top:8px;margin-top:8px}.mode-box h4{font-size:11px;margin:4px 0 7px}.mode-box label{display:grid;grid-template-columns:95px 1fr;gap:8px;align-items:center;color:#8ebbe1;font-size:10px;margin:7px 0}.mode-box select{background:#04142e;color:#fff;border:1px solid #175a95;border-radius:6px;padding:7px}.admin-actions{display:grid;grid-template-columns:1fr 1.2fr;gap:9px;margin-top:11px}.admin-actions button{padding:11px;border-radius:7px;background:#07152e;color:#fff;border:1px solid #7290ae}.admin-actions .save{background:var(--gold);color:#111;border-color:#ffe56a;font-weight:900}
@media(max-width:1100px){.top-hero{padding-left:180px;padding-right:180px}.row-top,.row-bottom{grid-template-columns:1fr 1fr}.bracket-card{grid-column:1/-1}.main-nav{grid-template-columns:repeat(7,minmax(90px,1fr));overflow:auto}.phase-flow{overflow:auto;grid-template-columns:repeat(15,minmax(95px,auto))}}
@media(max-width:760px){.app-shell{padding:8px}.top-hero{min-height:220px;padding:110px 5px 0}.hero-logo{width:145px;height:105px}.hero-title h1{font-size:29px}.hero-meta{gap:9px;flex-wrap:wrap;font-size:9px}.live-pill{position:static;display:inline-flex;margin-bottom:5px}.top-actions{right:3px;top:3px}.time-card{display:none}.admin-top{font-size:9px;padding:6px}.row-top,.row-bottom{grid-template-columns:1fr}.match-header,.match-row{min-width:650px}.current-games{overflow:auto}.main-nav{margin-left:-8px;margin-right:-8px;border-radius:0}.main-nav button{min-height:62px;font-size:9px}.admin-overlay{right:8px;top:8px;bottom:8px;width:calc(100vw - 16px)}}


/* === Supabase/Funktionsseiten im festen 2.0 Design === */
.tab{display:none}.tab.active{display:block}
.card,.round-card,.board-card,.group-dropdown,.notice,.admin-group-block,.running-card,.schedule-group{
 background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:11px;padding:14px;box-shadow:0 0 17px #006cff16;margin:10px 0
}
.row{display:flex;gap:8px;align-items:center}.wrap{flex-wrap:wrap}.small{color:var(--muted);font-size:11px}.scroll{overflow:auto}
.primary,.secondary,.ghost,.danger{border-radius:7px;padding:9px 13px;font-weight:800}.primary{background:var(--gold);color:#111;border:1px solid #ffe46b}.secondary,.ghost{background:#061a34;color:#e5f2ff;border:1px solid #275f94}.danger{background:#571421;color:#fff;border:1px solid #b93c50}
input,select,textarea{background:#031129;color:#fff;border:1px solid #245f96;border-radius:7px;padding:9px;outline:none}textarea{width:100%}input:focus,select:focus,textarea:focus{border-color:var(--gold)}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:9px;border-bottom:1px solid #153d68;text-align:left}.table th{color:#60b9ff;font-size:10px}
.group-dropdown summary{padding:13px;cursor:pointer;display:flex;justify-content:space-between;font-weight:900}.group-dropdown-body{padding:8px}.group-match-row,.queue-row,.schedule-row,.admin-row{display:flex;justify-content:space-between;gap:10px;padding:9px;border-bottom:1px solid #153d68}
.game-mode{display:block;width:max-content;margin-top:5px;padding:4px 7px;background:var(--gold);color:#111;border-radius:5px;font-size:9px;font-weight:900}
.boards-grid,.running-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}.board-number,.running-board{display:inline-block;background:var(--gold);color:#111;padding:4px 8px;border-radius:5px;font-weight:900}.free{color:var(--green);font-weight:900}.playing{font-weight:900}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stat-row{display:flex;justify-content:space-between;gap:10px;padding:9px;border-bottom:1px solid #153d68}.stat-row span{color:var(--gold)}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.form-grid label{display:flex;flex-direction:column;gap:4px;color:#9abbdc;font-size:11px}
.admin-hero{display:flex;justify-content:space-between;gap:12px;align-items:center}.admin-tabs{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0}.admin-tab{background:#061832;border:1px solid #1a568e;color:#d9ecff;border-radius:6px;padding:8px 10px}.admin-tab.active{background:var(--gold);color:#111}.admin-pane{display:none}.admin-pane.active{display:block}.match{display:grid;grid-template-columns:minmax(120px,1fr) 60px 18px 60px minmax(120px,1fr) auto;gap:6px;align-items:center;padding:8px;border-bottom:1px solid #153d68}.match input{width:60px}.result-actions{display:flex;gap:5px}
.admin-actionbar,.admin-section-head,.schedule-head,.admin-group-title{display:flex;justify-content:space-between;align-items:center;gap:10px}.round-mode-settings,.group-board-assignments{display:grid;gap:8px}.round-mode-row{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:8px;align-items:end;padding:10px;border:1px solid #15578e;border-radius:7px}.round-mode-row label{display:flex;flex-direction:column;gap:4px;font-size:10px;color:#8ebbe1}
.ko-tree-card{background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:11px;padding:14px}.ko-bracket-tree{display:flex;gap:12px;overflow:auto}.bracket-round{min-width:190px}.bracket-game{border:1px solid #1a629f;border-radius:6px;background:#04162f;margin:7px 0}.bracket-game>div{display:flex;justify-content:space-between;padding:6px;border-bottom:1px solid #17446f}
.winner-stage{text-align:center}.winner-trophy{font-size:60px}.winner-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.tv-overlay{position:fixed;inset:0;z-index:200;background:#010714 url("assets/background.jpeg") center/cover no-repeat;padding:24px;overflow:auto}.tv-columns{display:grid;grid-template-columns:1fr 1fr;gap:20px}.tv-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.tv-board{background:#041733e8;border:1px solid #1973bc;border-radius:10px;padding:16px}
.empty-state{color:var(--muted);padding:18px;text-align:center}
.dash-simple{grid-template-columns:1fr 2.2fr .5fr .7fr}
@media(max-width:800px){.stats{grid-template-columns:1fr}.round-mode-row{grid-template-columns:1fr 1fr}.match{grid-template-columns:1fr 48px 12px 48px 1fr}.result-actions,.match button{grid-column:1/-1}.tv-columns{grid-template-columns:1fr}.tv-grid{grid-template-columns:1fr}}


/* Einzige Änderung: Admin-Button rechts oben im Header */
.top-hero > #adminBtn.admin-top{
  position:absolute !important;
  top:2px !important;
  right:0 !important;
  left:auto !important;
  margin:0 !important;
  z-index:20 !important;
}

@media(max-width:760px){
  .top-hero > #adminBtn.admin-top{
    top:3px !important;
    right:3px !important;
  }
}

/* Spielreihenfolge Ansicht */
.schedule-view-switch{padding:10px 12px!important}
.schedule-view-switch .secondary.active-view{background:var(--gold)!important;color:#111!important;border-color:#ffe46b!important}
.schedule-order-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.schedule-order-table{display:grid;gap:4px}
.schedule-order-row{display:grid;grid-template-columns:46px 135px minmax(250px,1.7fr) 95px minmax(180px,1fr) 90px;gap:10px;align-items:center;padding:10px 9px;border:1px solid rgba(38,96,157,.38);border-radius:7px;background:rgba(3,16,38,.72)}
.schedule-order-header{color:#61baff;font-size:10px;text-transform:uppercase;font-weight:900;background:rgba(7,31,67,.9)}
.schedule-order-row>span:nth-child(3){display:grid;grid-template-columns:1fr auto 1fr;gap:7px;align-items:center}
.schedule-order-row>span:nth-child(3) small{color:var(--gold);font-weight:900}
.schedule-order-row.playing{border-color:rgba(34,222,130,.62);box-shadow:0 0 10px rgba(34,222,130,.12)}
.schedule-order-row.finished{opacity:.62}
.schedule-order-status{font-weight:900;color:var(--gold)}
.schedule-order-row.playing .schedule-order-status{color:var(--green)}
.schedule-order-row.finished .schedule-order-status{color:var(--muted)}
@media(max-width:900px){.schedule-order-table{overflow-x:auto;display:block}.schedule-order-row{min-width:900px;margin-bottom:4px}}


/* Zuschauer-Spielerfilter */
.spectator-player-filter{padding:12px 14px!important}
.spectator-filter-head{display:flex;align-items:end;justify-content:space-between;gap:16px}
.spectator-filter-head h3{margin:0 0 3px;color:#fff}
.spectator-filter-head p{margin:0}
.spectator-filter-controls{display:grid;grid-template-columns:minmax(180px,260px) minmax(190px,260px) auto;gap:8px;align-items:center}
.spectator-filter-controls input,.spectator-filter-controls select{margin:0;width:100%}
.spectator-player-games{margin-top:14px;padding-top:13px;border-top:1px solid rgba(37,96,158,.45)}
.spectator-player-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}
.spectator-player-title h3{margin:0;color:var(--gold)}
.spectator-games-list{display:grid;gap:7px}
.spectator-game{display:grid;grid-template-columns:42px 1fr 90px;gap:11px;align-items:center;padding:11px;border:1px solid rgba(36,94,155,.5);border-radius:8px;background:rgba(3,16,38,.76)}
.spectator-game.playing{border-color:rgba(34,222,130,.68);box-shadow:0 0 11px rgba(34,222,130,.11)}
.spectator-game.finished{opacity:.72}
.spectator-game-no{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#071c3c;color:var(--gold);border:1px solid rgba(255,210,26,.45);font-weight:900}
.spectator-game-main{min-width:0}
.spectator-game-meta{display:flex;gap:10px;color:#6bb8f5;font-size:10px;margin-bottom:5px}
.spectator-game-players{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center}
.spectator-game-players span{color:var(--gold);font-weight:900}
.spectator-game-mode{margin-top:5px;color:#9ebadc;font-size:10px}
.spectator-game-result{text-align:right;display:flex;flex-direction:column;gap:3px}
.spectator-game-result strong{font-size:20px;color:var(--gold)}
.spectator-game-result span{font-size:10px;font-weight:900;color:#80baf0}
.spectator-game.playing .spectator-game-result span{color:var(--green)}
@media(max-width:850px){
  .spectator-filter-head{align-items:stretch;flex-direction:column}
  .spectator-filter-controls{grid-template-columns:1fr 1fr auto}
}
@media(max-width:620px){
  .spectator-filter-controls{grid-template-columns:1fr}
  .spectator-game{grid-template-columns:34px 1fr}
  .spectator-game-result{grid-column:2;text-align:left;flex-direction:row;align-items:center;gap:10px}
  .spectator-game-players{grid-template-columns:1fr}
  .spectator-game-players span{display:none}
}


/* Nur Spielplan: globale Spielnummer */
.schedule-order-row{
  grid-template-columns:78px 135px minmax(250px,1.7fr) 95px minmax(180px,1fr) 90px;
}
.schedule-order-row>span:first-child b{
  color:var(--gold);
  white-space:nowrap;
}


/* Gruppenansicht: chronologischer Spielplan */
.group-match-row.chronological{align-items:center}
.group-game-main{display:flex;align-items:center;gap:12px;min-width:0}
.group-game-number{
  flex:0 0 82px;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  padding:6px 7px;
  border-radius:6px;
  background:var(--gold);
  color:#111;
  font-weight:900;
  font-size:11px;
  white-space:nowrap;
}
.group-game-number.pending{background:#10233d;color:#8faac9;border:1px solid #315a83}
@media(max-width:620px){
  .group-game-main{align-items:flex-start;flex-direction:column;gap:6px}
  .group-game-number{flex-basis:auto}
}