:root{color-scheme:dark;--bg:#101513;--panel:#18201d;--line:#2b3732;--green:#2c7a57;--text:#f1f5f3;--muted:#aab7b1}*{box-sizing:border-box}body{margin:0;font-family:system-ui;background:var(--bg);color:var(--text)}a{color:#8ed5b3}header{display:flex;justify-content:space-between;padding:1rem 1.25rem;background:#0b100e;border-bottom:1px solid var(--line)}main{max-width:1050px;margin:auto;padding:1.25rem}.center{min-height:100vh;display:grid;place-items:center;padding:1rem}.narrow{width:min(100%,540px)}.card{background:var(--panel);border:1px solid var(--line);border-radius:1rem;padding:1.2rem}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}label{display:block;margin:.8rem 0;color:var(--muted)}input{width:100%;margin-top:.3rem;padding:.8rem;border:1px solid var(--line);border-radius:.6rem;background:#0d1210;color:white}button,.button{display:inline-block;padding:.8rem 1rem;border:0;border-radius:.6rem;background:var(--green);color:white;font-weight:700;text-decoration:none}.error,.ok{padding:.8rem;border-radius:.6rem;margin:1rem 0}.error{background:#4a2020}.ok{background:#174832}.muted{color:var(--muted)}.metric{font-size:2rem;font-weight:800}

.admin-nav{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.page-head,.customer-title,.dialog-head,.dialog-actions{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.filter-links{display:flex;gap:.7rem;flex-wrap:wrap;margin:1rem 0}
.filter-links a{background:var(--panel);border:1px solid var(--line);padding:.55rem .8rem;border-radius:.6rem;text-decoration:none}
.customer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:1rem}
.customer-card h2{margin-bottom:.2rem}.details{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin:1rem 0}
.details div{background:#111815;padding:.65rem;border-radius:.6rem}.details dt{color:var(--muted);font-size:.8rem}.details dd{margin:.2rem 0 0;font-weight:700}
.actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}.actions form{margin:0}
.secondary{background:#36433d}.danger{background:#8b3030}.small-input{width:70px;margin:0;padding:.65rem}
.inline-form{display:flex;gap:.4rem;align-items:center}.badge{padding:.3rem .55rem;border-radius:999px;font-size:.78rem;font-weight:800}
.badge.active{background:#185b3d}.badge.blocked{background:#6a2929}
.password-reset{width:100%;margin-top:.4rem}.password-reset form{display:flex;gap:.5rem;margin-top:.5rem}.password-reset input{margin:0}
select{width:100%;margin-top:.35rem;padding:.8rem;border:1px solid var(--line);border-radius:.65rem;background:#0d1210;color:var(--text)}
dialog{width:min(95vw,560px);border:1px solid var(--line);border-radius:1rem;background:var(--panel);color:var(--text);padding:0}
dialog::backdrop{background:rgba(0,0,0,.72)}.dialog-form{padding:1.2rem}.icon-button{background:transparent;font-size:1.6rem;padding:.2rem .5rem}
.checkbox{display:flex;gap:.6rem;align-items:center}.checkbox input{width:auto;margin:0}
@media(max-width:700px){.topbar,.page-head{align-items:flex-start;flex-direction:column}.details{grid-template-columns:1fr}.admin-nav{gap:.6rem}}

.session-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:.7rem;margin-bottom:1rem}
.session-summary>div{background:var(--panel);border:1px solid var(--line);border-radius:.8rem;padding:.8rem;display:flex;flex-direction:column;gap:.2rem}
.roulette-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(420px,1.2fr);gap:1rem;margin-top:1rem}
.bet-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.bet-grid label:last-child{grid-column:1/-1}
.roulette-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem}
.roulette-number{min-height:52px;font-size:1.05rem;border:1px solid rgba(255,255,255,.16)}
.roulette-number.green,.permanence-number.green{background:#167445}
.roulette-number.red,.permanence-number.red{background:#a52c2c}
.roulette-number.black,.permanence-number.black{background:#171717}
.roulette-number:first-child{grid-column:1/-1}
.permanence{display:flex;gap:.4rem;overflow:auto;padding:.4rem 0}
.permanence-number{min-width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:800}
.result-panel{margin-top:1rem;padding:.9rem;border-radius:.7rem;background:#111815}
.result-panel.hit{background:#174832}.result-panel.loss{background:#4a2020}.result-panel.no_bet{background:#27312d}
.positive{color:#8ed5b3}.negative{color:#ff9f9f}
.badge.paused{background:#6a5529}.badge.finished{background:#38413d}
@media(max-width:850px){
  .session-summary{grid-template-columns:repeat(2,1fr)}
  .roulette-layout{grid-template-columns:1fr}
}

textarea{width:100%;margin-top:.35rem;padding:.8rem;border:1px solid var(--line);border-radius:.65rem;background:#0d1210;color:var(--text);resize:vertical}
.rule-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.system-status{padding:1rem;border-radius:.8rem;background:#111815;margin-bottom:1rem}
.system-status.signal{background:#4b3919}.system-status.attack{background:#173e31}
.system-status strong{display:block;font-size:1.15rem;margin-bottom:.35rem}
.badge.inactive{background:#4c4c4c}
@media(max-width:700px){.rule-form-grid{grid-template-columns:1fr}}

.attack-list{display:grid;gap:.65rem;margin-top:.8rem}
.attack-card{display:grid;grid-template-columns:1fr auto;gap:.3rem 1rem;align-items:center;background:#0d1512;border:1px solid var(--line);border-radius:.75rem;padding:.75rem}
.attack-card>div:first-child{display:flex;flex-direction:column;gap:.15rem}
.attack-card small{color:var(--muted)}
.attack-stake{grid-row:1/3;grid-column:2;display:flex;align-items:baseline;gap:.3rem}
.attack-stake strong{font-size:1.65rem;color:#9ee0bd}
.total-stake{padding:.7rem;border-top:1px solid var(--line);text-align:right}
.system-edit{margin:1rem 0}
.system-edit summary{cursor:pointer;color:#8ed5b3;font-weight:700}
.rule-edit-form{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin-top:.8rem;padding:.8rem;background:#101714;border-radius:.7rem}
.rule-edit-form button,.rule-edit-form label:last-of-type{grid-column:1/-1}
@media(max-width:700px){.rule-edit-form{grid-template-columns:1fr}.rule-edit-form button,.rule-edit-form label:last-of-type{grid-column:auto}}

.system-selection-info{
    display:flex;
    flex-direction:column;
    gap:.25rem;
    margin:-.25rem 0 .8rem;
    padding:.75rem .85rem;
    border:1px solid var(--line);
    border-radius:.7rem;
    background:#101714;
}
.system-selection-info strong{color:var(--text)}
.system-selection-info span{line-height:1.35}
.system-selection-info small{color:var(--muted)}
.system-selection-info.parallel{
    border-color:#2f7e5c;
    background:#11271e;
}
.system-selection-info.sequential{
    border-color:#7b652c;
    background:#292214;
}
.system-selection-info.manual{
    border-color:#44524c;
}

.system-card-actions{
    display:flex;
    flex-wrap:wrap;
    gap:.55rem;
    align-items:center;
    margin-top:1rem;
}
.system-card-actions form{margin:0}
.copy-hint{
    display:flex;
    flex-direction:column;
    gap:.25rem;
    margin:.8rem 0;
    padding:.8rem;
    border:1px solid var(--line);
    border-radius:.7rem;
    background:#101714;
}
.copy-hint span{
    color:var(--muted);
    line-height:1.4;
}

.generated-session-name{
    display:flex;
    flex-direction:column;
    gap:.2rem;
    padding:.75rem .85rem;
    border:1px solid var(--line);
    border-radius:.7rem;
    background:#101714;
    margin:.2rem 0 .8rem;
}
.generated-session-name strong{
    line-height:1.35;
}
.new-casino-row{
    display:flex;
    justify-content:flex-start;
    margin:-.35rem 0 .45rem;
}
.new-casino-fields{
    display:grid;
    grid-template-columns:1fr 1fr 110px;
    gap:.6rem;
    padding:.8rem;
    border:1px solid var(--line);
    border-radius:.7rem;
    background:#101714;
    margin-bottom:.8rem;
}
.new-casino-fields button{
    grid-column:1/-1;
}
.tableau-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:1rem;
}
.tableau-head h2{
    margin-bottom:.2rem;
}
.tableau-head p{
    margin:.1rem 0 0;
}
.tableau-body[hidden]{
    display:none;
}
.tableau-card.collapsed{
    padding-bottom:.8rem;
}
.tableau-card.collapsed .tableau-head p{
    display:none;
}
@media(max-width:850px){
    .new-casino-fields{
        grid-template-columns:1fr;
    }
    .new-casino-fields button{
        grid-column:auto;
    }
    .tableau-card{
        padding:.85rem;
    }
    .tableau-head{
        align-items:center;
    }
    .tableau-toggle{
        padding:.65rem .75rem;
        white-space:nowrap;
    }
}

.editor-wide{
    grid-column:1/-1;
}
.editor-actions{
    display:flex;
    gap:.6rem;
    justify-content:flex-end;
    flex-wrap:wrap;
}
.system-card-actions{
    display:flex;
    align-items:center;
    gap:.55rem;
    flex-wrap:wrap;
    margin-top:1rem;
}
.system-card-actions form{
    margin:0;
}
.system-editor-form small{
    display:block;
    margin-top:.25rem;
    color:var(--muted);
}
.auto-code-hint{
    padding:.7rem .8rem;
    border:1px solid var(--line);
    border-radius:.65rem;
    background:#101714;
    color:var(--muted);
    margin-bottom:.7rem;
}
.tableau-controls{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:.7rem;
    flex-wrap:wrap;
}
.keep-tableau-open{
    margin:0;
    padding:.55rem .65rem;
    border:1px solid var(--line);
    border-radius:.65rem;
    background:#101714;
    white-space:nowrap;
}
.badge.paused{
    background:#6d5925;
}
@media(max-width:700px){
    .editor-wide{
        grid-column:auto;
    }
    .editor-actions{
        justify-content:stretch;
    }
    .editor-actions button{
        flex:1;
    }
    .tableau-controls{
        width:100%;
        justify-content:space-between;
    }
    .tableau-head{
        flex-direction:column;
    }
}

.brand{
    display:flex;
    align-items:center;
    gap:.65rem;
}
.brand img{
    width:34px;
    height:34px;
    border-radius:.6rem;
    object-fit:cover;
}
.auth-page{
    background:
        linear-gradient(rgba(16,21,19,.86), rgba(16,21,19,.96)),
        url('../img/install-splash.png') center/cover no-repeat;
}
.auth-card{
    backdrop-filter: blur(4px);
}
.auth-brand{
    text-align:center;
    margin-bottom:1rem;
}
.login-logo{
    display:block;
    width:min(100%, 420px);
    margin:0 auto .3rem;
}
.brand-claim{
    margin:.2rem 0 0;
}
.login-actions{
    display:flex;
    gap:.75rem;
    flex-wrap:wrap;
    margin-top:1rem;
}
.login-actions button{
    flex:1;
}
.pwa-install-dialog{
    max-width:620px;
}
.install-splash{
    display:block;
    width:100%;
    aspect-ratio:9/16;
    object-fit:cover;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
}
.install-guide{
    padding-top:1rem;
}
.install-guide p{
    line-height:1.45;
}
.roulette-number.feedback-pressed{
    box-shadow:0 0 0 3px rgba(142,213,179,.35), 0 0 24px rgba(76, 218, 147, .65);
    transform:scale(.97);
    filter:brightness(1.18);
}
.result-panel.pending{
    background:#1c3a47;
}
@media(max-width:700px){
    .login-actions{
        flex-direction:column;
    }
}

.system-status.signal{background:#213a47}
.system-status.flash-signal{animation:signalFlash .9s ease}
.system-status.flash-active{animation:activeFlash .9s ease}
.attack-section-title{margin:.85rem 0 .35rem;font-weight:800;color:#bfe8d1}
.attack-card.pending{border-color:#5d83a7;background:#101923;cursor:pointer}
.attack-card.pending .attack-confirm-btn{margin-top:.2rem;justify-self:start}
.attack-card.active{border-color:#2d6f55}
.attack-confirm-btn{background:#2c7a57;color:#fff;border:0;border-radius:.6rem;padding:.6rem .8rem;font-weight:700}
.tableau-title h2{margin:.1rem 0;font-size:1.25rem}
.tableau-head{align-items:center}
.tableau-card{padding-top:.95rem}
.tableau-controls{gap:.45rem}
.keep-tableau-open{padding:.45rem .6rem;font-size:.95rem}
.tableau-toggle{padding:.62rem .78rem;line-height:1}
.roulette-number.feedback-pressed{box-shadow:0 0 0 3px rgba(142,213,179,.35),0 0 24px rgba(76,218,147,.65);transform:scale(.97);filter:brightness(1.18)}
.result-panel.pending{background:#1c3a47}
@keyframes signalFlash{0%{box-shadow:0 0 0 0 rgba(88,170,255,.0)}30%{box-shadow:0 0 0 4px rgba(88,170,255,.45)}100%{box-shadow:0 0 0 0 rgba(88,170,255,0)}}
@keyframes activeFlash{0%{box-shadow:0 0 0 0 rgba(79,212,144,.0)}30%{box-shadow:0 0 0 4px rgba(79,212,144,.45)}100%{box-shadow:0 0 0 0 rgba(79,212,144,0)}}
@media(max-width:850px){
  .tableau-head{display:grid;grid-template-columns:auto 1fr;gap:.5rem .7rem;align-items:start}
  .tableau-title{grid-column:1/2}
  .tableau-controls{grid-column:2/3;justify-content:flex-end;align-items:flex-start}
  .keep-tableau-open{font-size:.86rem;padding:.4rem .5rem}
  .tableau-toggle{padding:.55rem .65rem;font-size:.9rem}
  .attack-card{grid-template-columns:1fr auto}
  .attack-confirm-btn{grid-column:1/-1;width:100%}
}
@media(max-width:560px){
  .tableau-head{grid-template-columns:1fr;gap:.45rem}
  .tableau-controls{grid-column:auto;justify-content:space-between;width:100%}
  .tableau-title h2{font-size:1.1rem}
  .tableau-card{padding:.75rem}
}

.input-mode-choice{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.65rem;
    margin:.2rem 0 .8rem;
    padding:.75rem;
    border:1px solid var(--line);
    border-radius:.75rem;
}
.input-mode-choice legend{
    padding:0 .3rem;
    font-weight:800;
}
.input-mode-option{
    display:flex;
    align-items:flex-start;
    gap:.55rem;
    margin:0;
    padding:.75rem;
    border:1px solid var(--line);
    border-radius:.7rem;
    background:#101714;
    cursor:pointer;
}
.input-mode-option input{
    width:auto;
    margin:.15rem 0 0;
}
.input-mode-option span{
    display:flex;
    flex-direction:column;
    gap:.15rem;
}
.input-mode-option small{
    color:var(--muted);
    line-height:1.3;
}
.input-mode-note{
    grid-column:1/-1;
    margin:0;
}
.random-input-panel{
    display:flex;
    align-items:center;
    gap:.75rem;
    margin:.65rem 0;
    padding:.7rem;
    border:1px solid #47725f;
    border-radius:.75rem;
    background:#10271e;
}
.random-spin-button{
    min-height:48px;
    white-space:nowrap;
}
.tableau-card.random-mode
.roulette-number:disabled{
    opacity:1;
    cursor:default;
}
.roulette-number.random-result{
    position:relative;
    z-index:2;
    animation:randomResultPulse 1.1s ease-in-out
        0s 2;
    box-shadow:
        0 0 0 4px rgba(255,220,90,.48),
        0 0 34px rgba(255,207,64,.95);
    filter:brightness(1.25);
    transform:scale(1.04);
}
@keyframes randomResultPulse{
    0%,100%{
        transform:scale(1.02);
    }
    50%{
        transform:scale(1.11);
    }
}
@media(max-width:700px){
    .input-mode-choice{
        grid-template-columns:1fr;
    }
    .input-mode-note{
        grid-column:auto;
    }
    .random-input-panel{
        flex-direction:column;
        align-items:stretch;
    }
}

/*
 * display:grid on .new-casino-fields overrode the HTML hidden state
 * in some browsers. This rule makes the collapsed state reliable.
 */
.new-casino-fields[hidden],
#tableField[hidden]{
    display:none !important;
}

#casinoTableauFields[hidden]{
    display:none !important;
}
.session-card-actions{
    display:flex;
    align-items:center;
    gap:.6rem;
    flex-wrap:wrap;
    margin-top:1rem;
}
.session-card-actions .button,
.session-card-actions button{
    margin:0;
}
.outline-danger{
    background:transparent;
    border:1px solid #a93636;
    color:#ffb3b3;
}
.outline-danger:hover{
    background:#5a2020;
    color:#fff;
}
@media(max-width:600px){
    .session-card-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
    }
    .session-card-actions .button,
    .session-card-actions button{
        width:100%;
        text-align:center;
    }
}

.system-count-details{
    min-height:1.5em;
    margin:.25rem 0 .85rem;
}

.tableau-size-control{
    display:flex;
    align-items:center;
    gap:.4rem;
    margin:0;
    padding:.35rem .45rem;
    border:1px solid var(--line);
    border-radius:.65rem;
    background:#101714;
    color:var(--muted);
    white-space:nowrap;
}
.tableau-size-control span{
    font-size:.85rem;
}
.tableau-size-control select{
    width:auto;
    min-width:86px;
    margin:0;
    padding:.42rem .5rem;
    border:1px solid var(--line);
    border-radius:.5rem;
    background:#0d1210;
    color:var(--text);
}
.keep-tableau-open[hidden]{
    display:none !important;
}

/*
 * Kompakt:
 * Zero über die volle Breite, danach sechs Zahlen pro Reihe.
 * Dadurch benötigt das komplette Tableau nur sieben Zahlenreihen.
 */
.tableau-card[data-tableau-size="compact"]
.roulette-grid{
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:.25rem;
}
.tableau-card[data-tableau-size="compact"]
.roulette-number{
    min-height:clamp(30px,5vh,38px);
    padding:.2rem;
    font-size:.9rem;
    border-radius:.45rem;
}
.tableau-card[data-tableau-size="compact"]
.roulette-number:first-child{
    grid-column:1/-1;
    min-height:34px;
}

/* Große Ansicht entspricht dem bisherigen Tableau. */
.tableau-card[data-tableau-size="large"]
.roulette-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.36rem;
}
.tableau-card[data-tableau-size="large"]
.roulette-number{
    min-height:42px;
    padding:.32rem;
    font-size:1rem;
}
.tableau-card[data-tableau-size="large"]
.roulette-number:first-child{
    grid-column:1/-1;
}

/*
 * Auto:
 * Desktop groß, Smartphone automatisch kompakt.
 */
@media(max-width:850px){
    .tableau-card[data-tableau-size="auto"]
    .roulette-grid{
        grid-template-columns:repeat(6,minmax(0,1fr));
        gap:.25rem;
    }
    .tableau-card[data-tableau-size="auto"]
    .roulette-number{
        min-height:clamp(30px,5vh,38px);
        padding:.2rem;
        font-size:.9rem;
        border-radius:.45rem;
    }
    .tableau-card[data-tableau-size="auto"]
    .roulette-number:first-child{
        grid-column:1/-1;
        min-height:34px;
    }
    .tableau-controls{
        gap:.35rem;
    }
    .tableau-size-control{
        padding:.3rem .4rem;
    }
    .tableau-size-control span{
        display:none;
    }
    .tableau-size-control select{
        min-width:82px;
        font-size:.88rem;
    }
}

@media(max-width:430px){
    .tableau-card[data-tableau-size="compact"]
    .roulette-number,
    .tableau-card[data-tableau-size="auto"]
    .roulette-number{
        min-height:32px;
        font-size:.82rem;
    }
    .tableau-card{
        padding:.65rem;
    }
    .tableau-head{
        gap:.35rem;
    }
    .tableau-controls{
        gap:.3rem;
    }
    .keep-tableau-open{
        padding:.36rem .44rem;
        font-size:.8rem;
    }
    .tableau-toggle{
        padding:.48rem .55rem;
        font-size:.82rem;
    }
}

.system-status.result{
    background:#252314;
}
.system-status.flash-hit{
    animation:statusHitFlash .9s ease;
}
.system-status.flash-loss{
    animation:statusLossFlash .9s ease;
}
.attack-result-card{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:.25rem .8rem;
    padding:.8rem;
    border:1px solid var(--line);
    border-radius:.75rem;
    cursor:pointer;
    transition:
        transform .15s ease,
        filter .15s ease;
}
.attack-result-card:hover,
.attack-result-card:active{
    transform:scale(.99);
    filter:brightness(1.08);
}
.attack-result-card.won{
    background:#123c2b;
    border-color:#3d9b70;
}
.attack-result-card.lost{
    background:#452020;
    border-color:#a94b4b;
}
.attack-result-card>small{
    grid-column:1/-1;
    color:var(--muted);
}
.feedback-settings-panel{
    margin:.65rem 0;
    border:1px solid var(--line);
    border-radius:.75rem;
    background:#101714;
}
.feedback-settings-panel summary{
    cursor:pointer;
    padding:.7rem .8rem;
    font-weight:800;
    color:#bfe8d1;
}
.feedback-settings-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:.55rem;
    padding:0 .8rem .65rem;
}
.feedback-settings-grid .checkbox{
    margin:0;
    padding:.55rem;
    border:1px solid var(--line);
    border-radius:.6rem;
    background:#0d1210;
}
#feedbackSaveState{
    display:block;
    padding:0 .8rem .75rem;
}
.feedback-flash-overlay{
    position:fixed;
    inset:0;
    z-index:9998;
    pointer-events:none;
    opacity:0;
}
.feedback-flash-overlay.active{
    animation:screenFlash .65s ease-out;
}
.feedback-flash-overlay.hit{
    background:rgba(50,255,150,.28);
}
.feedback-flash-overlay.loss{
    background:rgba(255,60,60,.24);
}
.feedback-flash-overlay.signal{
    background:rgba(60,160,255,.25);
}
.feedback-flash-overlay.active{
    background-color:rgba(60,220,150,.2);
}
.roulette-wheel-overlay[hidden]{
    display:none !important;
}
.roulette-wheel-overlay{
    position:fixed;
    inset:0;
    z-index:9999;
    display:grid;
    place-items:center;
    padding:1rem;
    background:rgba(3,8,6,.9);
    backdrop-filter:blur(5px);
}
.roulette-wheel-stage{
    display:grid;
    justify-items:center;
    gap:1rem;
    width:min(92vw,420px);
}
.roulette-wheel-shell{
    position:relative;
    width:min(82vw,340px);
    aspect-ratio:1;
    display:grid;
    place-items:center;
}
.roulette-wheel{
    position:absolute;
    inset:0;
    border-radius:50%;
    border:10px solid #b88b39;
    background:
        radial-gradient(
            circle at center,
            #244b36 0 27%,
            #16251e 28% 42%,
            #8a672b 43% 47%,
            #181a18 48% 100%
        );
    box-shadow:
        0 0 0 4px #382c16,
        0 20px 60px rgba(0,0,0,.65),
        inset 0 0 30px rgba(0,0,0,.7);
}
.roulette-wheel-pockets{
    position:absolute;
    inset:0;
    border-radius:50%;
}
.roulette-wheel-pocket{
    position:absolute;
    left:50%;
    top:50%;
    width:24px;
    height:19px;
    margin-left:-12px;
    margin-top:-9.5px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.28);
    border-radius:.25rem;
    font-size:.58rem;
    font-weight:900;
    color:#fff;
    transform:
        rotate(var(--angle))
        translateY(-136px)
        rotate(var(--counter-angle));
    transform-origin:center;
}
.roulette-wheel-pocket.red{
    background:#a52c2c;
}
.roulette-wheel-pocket.black{
    background:#141414;
}
.roulette-wheel-pocket.green{
    background:#167445;
}
.roulette-wheel-center{
    position:absolute;
    inset:34%;
    display:grid;
    place-items:center;
    border-radius:50%;
    border:5px solid #b88b39;
    background:#0e1713;
    box-shadow:inset 0 0 22px rgba(0,0,0,.8);
}
.roulette-wheel-center span{
    min-width:58px;
    min-height:58px;
    display:grid;
    place-items:center;
    border-radius:50%;
    font-size:1.65rem;
    font-weight:900;
}
.roulette-wheel-center span.red{
    background:#a52c2c;
}
.roulette-wheel-center span.black{
    background:#171717;
}
.roulette-wheel-center span.green{
    background:#167445;
}
.roulette-ball-orbit{
    position:absolute;
    inset:4%;
    border-radius:50%;
    pointer-events:none;
}
.roulette-ball{
    position:absolute;
    top:-2px;
    left:50%;
    width:15px;
    height:15px;
    margin-left:-7.5px;
    border-radius:50%;
    background:
        radial-gradient(
            circle at 35% 30%,
            #fff 0 20%,
            #d8d8d8 22% 55%,
            #777 100%
        );
    box-shadow:
        0 1px 5px rgba(0,0,0,.8);
}
#rouletteWheelCaption{
    font-size:1.25rem;
}
body.wheel-animation-open{
    overflow:hidden;
}

/* Echte flache Tableau-Anordnung: 0 + 12 Spalten in nur drei Reihen. */
.tableau-card[data-tableau-size="flat"]
.roulette-grid{
    grid-template-columns:
        34px
        repeat(12,minmax(22px,1fr));
    grid-template-rows:
        repeat(3,38px);
    gap:2px;
}
.tableau-card[data-tableau-size="flat"]
.roulette-number{
    grid-row:var(--roulette-row);
    grid-column:var(--roulette-column);
    min-height:0;
    height:38px;
    padding:0;
    border-radius:.25rem;
    font-size:.8rem;
}
.tableau-card[data-tableau-size="flat"]
.roulette-number:first-child{
    grid-row:1/4;
    grid-column:1;
    height:auto;
    min-height:0;
}
@keyframes screenFlash{
    0%{opacity:0}
    18%{opacity:1}
    100%{opacity:0}
}
@keyframes statusHitFlash{
    0%{box-shadow:0 0 0 0 rgba(60,255,150,0)}
    35%{box-shadow:0 0 0 5px rgba(60,255,150,.48)}
    100%{box-shadow:0 0 0 0 rgba(60,255,150,0)}
}
@keyframes statusLossFlash{
    0%{box-shadow:0 0 0 0 rgba(255,70,70,0)}
    35%{box-shadow:0 0 0 5px rgba(255,70,70,.42)}
    100%{box-shadow:0 0 0 0 rgba(255,70,70,0)}
}
@media(max-width:700px){
    .feedback-settings-grid{
        grid-template-columns:1fr;
    }
}
@media(max-width:430px){
    .tableau-card[data-tableau-size="flat"]
    .roulette-grid{
        grid-template-columns:
            28px
            repeat(12,minmax(19px,1fr));
        grid-template-rows:
            repeat(3,34px);
    }
    .tableau-card[data-tableau-size="flat"]
    .roulette-number{
        height:34px;
        font-size:.72rem;
    }
    .roulette-wheel-pocket{
        transform:
            rotate(var(--angle))
            translateY(-112px)
            rotate(var(--counter-angle));
    }
}


/* v0.11.1 Hotfix: Kesselanimation mit sauberer Zielausrichtung */
.roulette-wheel-shell{
    overflow:visible;
}
.roulette-wheel-pocket{
    width:26px;
    height:20px;
    margin-left:-13px;
    margin-top:-10px;
    font-size:.62rem;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.roulette-wheel-pocket.winning{
    outline:2px solid #fff3b0;
    box-shadow:0 0 0 3px rgba(255,239,153,.45), 0 0 20px rgba(255,230,120,.4);
    z-index:3;
}
.roulette-ball-orbit{
    inset:0;
}
.roulette-ball{
    top:27px;
    left:50%;
    width:16px;
    height:16px;
    margin-left:-8px;
    border:2px solid rgba(255,255,255,.2);
}
.roulette-wheel-center{
    inset:37%;
}
.roulette-wheel-center span{
    min-width:62px;
    min-height:62px;
}
@media(max-width:430px){
    .roulette-ball{
        top:24px;
    }
    .roulette-wheel-pocket{
        width:22px;
        height:18px;
        margin-left:-11px;
        margin-top:-9px;
        font-size:.56rem;
    }
}

/* ---------------------------------------------------------------
 * v0.11.2: kompakte Spielsitzung
 * --------------------------------------------------------------- */
.roulette-page{
    max-width:1280px;
    padding-top:.8rem;
}
.session-summary{
    margin-bottom:.55rem;
    gap:.5rem;
}
.session-summary>div{
    padding:.55rem .7rem;
    border-radius:.65rem;
}
.session-control-bar{
    position:relative;
    z-index:5;
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:.6rem;
    margin-bottom:.55rem;
    padding:.55rem;
    border:1px solid var(--line);
    border-radius:.75rem;
    background:var(--panel);
}
.session-control-actions,
.session-view-controls{
    display:flex;
    align-items:flex-start;
    gap:.45rem;
    flex-wrap:wrap;
}
.compact-control{
    padding:.6rem .75rem;
    min-height:38px;
}
.feedback-settings-top{
    position:relative;
    margin:0;
    min-width:118px;
}
.feedback-settings-top summary{
    padding:.55rem .7rem;
    min-height:38px;
    display:flex;
    align-items:center;
}
.feedback-settings-top[open]{
    min-width:310px;
}
.feedback-settings-top[open]
.feedback-settings-grid{
    padding:.55rem .65rem;
}
.feedback-settings-top
#feedbackSaveState{
    padding:0 .65rem .6rem;
}
.tableau-size-control{
    min-height:38px;
    padding:.28rem .4rem;
}
.tableau-size-control select{
    min-width:82px;
    padding:.42rem .45rem;
}
.system-status{
    margin-bottom:.55rem;
    padding:.7rem .8rem;
}
.system-status strong{
    font-size:1rem;
    margin-bottom:.2rem;
}
.attack-list{
    gap:.45rem;
    margin-top:.55rem;
}
.attack-section-title{
    margin:.55rem 0 .25rem;
}
.attack-card,
.attack-result-card{
    padding:.55rem .65rem;
}
.attack-stake strong{
    font-size:1.3rem;
}
.permanence-card{
    padding:.65rem .8rem;
    margin-bottom:.55rem;
}
.permanence-head{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:.65rem;
    flex-wrap:wrap;
}
.permanence-head-main{
    display:flex;
    align-items:baseline;
    gap:.65rem;
    flex-wrap:wrap;
}
.permanence-head strong{
    font-size:1rem;
}
.permanence-head #sessionStatus{
    font-size:.82rem;
}
.permanence-last-hint{
    display:inline-flex;
    align-items:center;
    gap:.35rem;
    min-height:1.2rem;
    color:#8ed5b3;
    font-size:.8rem;
    font-weight:700;
    white-space:nowrap;
}
.permanence-last-hint.is-left,
.permanence-last-hint.is-right{
    opacity:1;
}
.permanence{
    padding:.35rem 0 0;
    gap:.3rem;
}
.permanence-number{
    min-width:31px;
    width:31px;
    height:31px;
    font-size:.82rem;
}
.roulette-layout{
    margin-top:0;
    gap:.55rem;
}
.roulette-layout.system-mode{
    grid-template-columns:1fr;
}
.roulette-layout.system-mode
.tableau-card{
    grid-column:1/-1;
}
.tableau-card{
    padding:.65rem .8rem;
}
.tableau-head{
    min-height:38px;
    align-items:center;
    gap:.5rem;
}
.tableau-title h2{
    margin:0;
    font-size:1.05rem;
}
.tableau-controls{
    gap:.4rem;
}
.tableau-toggle,
.keep-tableau-open{
    min-height:36px;
}
.random-input-panel{
    display:block;
    margin:.4rem 0;
    padding:0;
    border:0;
    background:transparent;
}
.random-spin-button{
    width:auto;
    min-height:40px;
    padding:.65rem .9rem;
}
.tableau-body{
    margin-top:.35rem;
}
.tableau-card[data-tableau-size="flat"]
.roulette-grid{
    width:100%;
}
@media(min-width:851px){
    .roulette-layout.system-mode
    .tableau-card[data-tableau-size="flat"]{
        max-width:none;
    }
}
@media(max-width:850px){
    .roulette-page{
        padding:.55rem;
    }
    .session-control-bar{
        align-items:stretch;
    }
    .session-control-actions,
    .session-view-controls{
        flex:1 1 auto;
    }
    .feedback-settings-top[open]{
        position:absolute;
        right:.55rem;
        top:3.25rem;
        width:min(330px,calc(100vw - 1.1rem));
        background:var(--panel);
        box-shadow:0 12px 28px rgba(0,0,0,.45);
    }
}
@media(max-width:620px){
    .session-summary{
        gap:.35rem;
    }
    .session-summary>div{
        padding:.45rem .55rem;
    }
    .session-control-bar{
        display:grid;
        grid-template-columns:1fr;
        padding:.45rem;
    }
    .session-control-actions,
    .session-view-controls{
        justify-content:space-between;
    }
    .compact-control{
        flex:1;
        padding:.55rem .5rem;
        font-size:.82rem;
    }
    .permanence-card{
        padding:.55rem .6rem;
    }
    .system-status{
        padding:.6rem;
    }
    .tableau-card{
        padding:.55rem .6rem;
    }
}

/* ---------------------------------------------------------------
 * v0.11.3: obere Leiste noch kompakter, Tableau-Schalter nach oben
 * --------------------------------------------------------------- */
.session-control-bar{
    margin-bottom:.45rem;
    padding:.45rem;
}
.session-view-controls{
    justify-content:flex-end;
}
.session-view-controls .tableau-toggle{
    min-width:102px;
}
.tableau-card{
    margin-top:0;
}
.tableau-head{
    min-height:30px;
    margin-bottom:.1rem;
}
.tableau-head .tableau-controls{
    margin-left:auto;
}
@media(max-width:620px){
    .roulette-page{
        padding:.45rem;
    }
    .session-summary{
        margin-bottom:.3rem;
    }
    .session-control-bar{
        margin-bottom:.35rem;
        padding:.38rem;
        gap:.38rem;
    }
    .session-control-actions,
    .session-view-controls{
        gap:.34rem;
    }
    .session-view-controls{
        display:grid;
        grid-template-columns:1fr auto auto;
        align-items:start;
    }
    .tableau-size-control{
        min-width:0;
        width:100%;
        justify-content:space-between;
    }
    .tableau-size-control select{
        min-width:74px;
    }
    .session-view-controls .tableau-toggle{
        min-width:0;
        width:auto;
        padding:.55rem .55rem;
        font-size:.82rem;
    }
    .feedback-settings-top{
        min-width:0;
    }
    .feedback-settings-top summary{
        padding:.55rem .65rem;
        font-size:.82rem;
        justify-content:center;
    }
    .system-status{
        margin-bottom:.38rem;
        padding:.55rem .6rem;
    }
    .permanence-card{
        margin-bottom:.38rem;
        padding:.5rem .55rem;
    }
    .tableau-card{
        padding:.5rem .55rem;
    }
    .tableau-title h2{
        font-size:1rem;
    }
    .tableau-head{
        min-height:24px;
        margin-bottom:0;
    }
    .tableau-controls{
        gap:.25rem;
    }
}

/* ---------------------------------------------------------------
 * v0.11.4: Angriffshistorie beendeter Sitzungen
 * --------------------------------------------------------------- */
.system-status.history{
    background:#18211d;
}
.attack-history-card{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:.35rem .8rem;
    padding:.65rem .75rem;
    border:1px solid var(--line);
    border-radius:.7rem;
    background:#0e1512;
}
.attack-history-card small{
    display:block;
    margin-top:.18rem;
    color:var(--muted);
}
.attack-history-card.won{
    border-left:4px solid #39a873;
}
.attack-history-card.lost{
    border-left:4px solid #bd3e3e;
}
.attack-history-card.active{
    border-left:4px solid #d39a34;
}
.attack-history-card.pending,
.attack-history-card.cancelled{
    border-left:4px solid #697772;
}
@media(max-width:560px){
    .attack-history-card{
        padding:.55rem .6rem;
    }
}

/* ---------------------------------------------------------------
 * v0.11.5: aufklappbare Verbindung Coup ↔ Angriffsergebnis
 * --------------------------------------------------------------- */
.coup-result-panel{
    margin:0 0 .45rem;
    padding:0;
    overflow:hidden;
    background:#101713;
    border-color:#293a33;
}
.coup-result-panel>summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.7rem;
    padding:.48rem .65rem;
    cursor:pointer;
    color:#a8beb5;
    font-size:.86rem;
    list-style:none;
}
.coup-result-panel>summary::-webkit-details-marker{
    display:none;
}
.coup-result-panel>summary::before{
    content:'▸';
    margin-right:.35rem;
    color:#73b993;
}
.coup-result-panel[open]>summary::before{
    content:'▾';
}
.coup-result-panel[open]>summary{
    color:#d8efe3;
    border-bottom:1px solid var(--line);
}
.coup-result-panel-body{
    padding:.55rem .65rem .65rem;
}
.coup-result-hint{
    margin:.05rem 0 .5rem;
    font-size:.83rem;
}
.coup-result-details{
    display:grid;
    gap:.45rem;
}
.coup-detail-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.7rem;
    padding:.25rem 0 .4rem;
}
.coup-detail-heading span{
    display:flex;
    flex-direction:column;
    gap:.12rem;
}
.coup-bet-list,
.attack-coup-list{
    display:grid;
    gap:.35rem;
}
.coup-detail-card,
.coup-bet-row,
.attack-coup-row{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.65rem;
    padding:.55rem .6rem;
    border:1px solid var(--line);
    border-radius:.6rem;
    background:#0d1411;
    color:var(--text);
    text-align:left;
}
.coup-bet-row,
.attack-coup-row{
    cursor:pointer;
}
.coup-bet-row:hover,
.attack-coup-row:hover{
    border-color:#4c7b66;
    filter:brightness(1.07);
}
.coup-detail-card small,
.coup-bet-row small,
.attack-coup-row small{
    display:block;
    margin-top:.12rem;
    color:var(--muted);
}
.small-button{
    margin-top:.55rem;
    padding:.45rem .6rem;
    font-size:.8rem;
}
.permanence-number{
    border:0;
    color:#fff;
    cursor:default;
}
.permanence.coup-link-mode
.permanence-number{
    cursor:pointer;
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.18);
}
.permanence-number.linked-coup{
    outline:3px solid #65b9f4;
    outline-offset:2px;
    box-shadow:
        0 0 15px rgba(75,170,240,.45);
}
.permanence-number.linked-coup-selected{
    outline:3px solid #f2d36d;
    outline-offset:2px;
    box-shadow:
        0 0 16px rgba(242,211,109,.55);
}
[data-link-attack].linked-attack-selected{
    box-shadow:
        inset 0 0 0 2px #65b9f4,
        0 0 14px rgba(75,170,240,.28);
}
.attack-history-card[data-link-attack],
.attack-card.active[data-link-attack]{
    cursor:pointer;
}
.attack-coup-link{
    grid-column:1/-1;
    justify-self:start;
    padding:.35rem .55rem;
    border:1px solid #5a8e75;
    border-radius:.5rem;
    background:transparent;
    color:#bfe8d1;
    font-size:.78rem;
}
@media(max-width:560px){
    .coup-result-panel>summary{
        padding:.43rem .55rem;
        font-size:.82rem;
    }
    .coup-result-panel-body{
        padding:.5rem .55rem .55rem;
    }
    .coup-detail-heading,
    .coup-bet-row,
    .attack-coup-row{
        gap:.45rem;
    }
}

/* ---------------------------------------------------------------
 * v0.11.6: Angriffshistorie standardmäßig eingeklappt
 * --------------------------------------------------------------- */
.attack-history-panel{
    margin-top:.45rem;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:.72rem;
    background:#0d1511;
}
.attack-history-panel>summary{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:.65rem;
    padding:.65rem .75rem;
    cursor:pointer;
    list-style:none;
    color:var(--text);
}
.attack-history-panel>summary::-webkit-details-marker{
    display:none;
}
.attack-history-panel>summary::before{
    content:'▸';
    grid-column:1;
    grid-row:1;
    align-self:start;
    width:1rem;
    color:#75b995;
    font-weight:900;
}
.attack-history-panel[open]>summary::before{
    content:'▾';
}
.attack-history-panel>summary>span{
    grid-column:1;
    grid-row:1;
    display:flex;
    flex-direction:column;
    gap:.12rem;
    padding-left:1.15rem;
}
.attack-history-panel>summary>span small{
    color:var(--muted);
    font-weight:400;
}
.attack-history-panel>summary>strong{
    grid-column:2;
    grid-row:1;
    white-space:nowrap;
}
.attack-history-panel[open]>summary{
    border-bottom:1px solid var(--line);
    background:#132019;
}
.attack-history-list{
    display:grid;
    gap:.42rem;
    padding:.55rem;
}
.attack-history-panel:not([open])
.attack-history-list{
    display:none;
}
@media(max-width:560px){
    .attack-history-panel>summary{
        padding:.55rem .6rem;
        gap:.4rem;
    }
    .attack-history-panel>summary>span small{
        font-size:.76rem;
    }
    .attack-history-list{
        padding:.45rem;
    }
}

/* ---------------------------------------------------------------
 * v0.11.7: Coup ↔ Ergebnis ausschließlich bei beendeten Sitzungen
 * --------------------------------------------------------------- */
.coup-result-panel[hidden]{
    display:none !important;
}
.permanence:not(.coup-link-mode)
.permanence-number{
    cursor:default;
}

/* ---------------------------------------------------------------
 * v0.11.8: gespieltes System auf den Sitzungskarten
 * --------------------------------------------------------------- */
.session-system-name{
    display:flex;
    align-items:baseline;
    gap:.38rem;
    margin-top:.38rem;
    color:#cfe6da;
    line-height:1.25;
}
.session-system-name span{
    color:var(--muted);
    font-size:.78rem;
}
.session-system-name strong{
    font-size:.88rem;
}
@media(max-width:560px){
    .session-system-name{
        display:grid;
        gap:.08rem;
    }
}

/* ---------------------------------------------------------------
 * v0.12.0: Spielauswahl, Kategorien und Sitzung-Wizard
 * --------------------------------------------------------------- */
.session-category-name,
.system-category-label{
    display:inline-flex;
    align-items:center;
    width:max-content;
    margin-top:.35rem;
    padding:.22rem .48rem;
    border:1px solid #3b6452;
    border-radius:999px;
    background:#10261c;
    color:#aee0c5;
    font-size:.76rem;
    font-weight:700;
}
.session-wizard-page{
    max-width:1180px;
}
.wizard-progress{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.65rem;
    margin:.4rem auto 1.25rem;
    color:var(--muted);
}
.wizard-progress-step{
    display:flex;
    align-items:center;
    gap:.45rem;
    font-weight:700;
}
.wizard-progress-step b{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border:1px solid var(--line);
    border-radius:50%;
    background:#101714;
}
.wizard-progress-step.active{
    color:#c9eed9;
}
.wizard-progress-step.active b{
    border-color:#3f9c71;
    background:#1d704e;
    color:#fff;
}
.wizard-progress-line{
    width:min(16vw,120px);
    height:2px;
    background:var(--line);
}
.wizard-title{
    margin-bottom:1rem;
}
.wizard-title h1{
    margin:.1rem 0 .45rem;
}
.eyebrow{
    display:block;
    color:#79c49c;
    font-size:.78rem;
    font-weight:900;
    letter-spacing:.07em;
    text-transform:uppercase;
}
.section-heading.compact,
.game-category-toolbar{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:1rem;
}
.section-heading.compact h2,
.game-category-toolbar h2{
    margin:.08rem 0 0;
}
.recent-games-section{
    margin-bottom:1.4rem;
    padding:1rem;
    border:1px solid #3d7359;
    border-radius:1rem;
    background:
        linear-gradient(
            135deg,
            rgba(28,91,62,.34),
            rgba(12,24,19,.7)
        );
}
.game-category-toolbar{
    margin-bottom:.7rem;
}
.game-category-filters{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:.4rem;
}
.category-filter{
    padding:.46rem .7rem;
    border:1px solid var(--line);
    border-radius:999px;
    background:#111915;
    color:#b8ccc2;
    font-size:.82rem;
}
.category-filter.active{
    border-color:#48a678;
    background:#1d704e;
    color:#fff;
}
.game-catalog{
    display:grid;
    gap:1.25rem;
}
.game-category-section{
    display:grid;
    gap:.55rem;
}
.game-category-heading{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:.7rem;
    padding:0 .1rem;
}
.game-category-heading h3{
    margin:0;
}
.game-card-grid{
    display:grid;
    grid-template-columns:
        repeat(auto-fit,minmax(245px,1fr));
    gap:.7rem;
}
.recent-game-grid{
    margin-top:.7rem;
}
.game-choice-card{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:.52rem;
    min-height:190px;
    padding:.85rem;
    border:1px solid var(--line);
    border-radius:.85rem;
    background:#121b17;
    color:var(--text);
    text-align:left;
    cursor:pointer;
    transition:
        transform .15s ease,
        border-color .15s ease,
        background .15s ease;
}
.game-choice-card:hover,
.game-choice-card:focus-visible{
    transform:translateY(-2px);
    border-color:#4fa77b;
    background:#17251e;
}
.game-choice-card.recent{
    border-color:#4a8b69;
}
.game-choice-card-top,
.game-choice-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.55rem;
}
.game-category-badge{
    display:inline-flex;
    align-items:center;
    width:max-content;
    max-width:100%;
    padding:.24rem .5rem;
    border-radius:999px;
    background:#20392d;
    color:#bce7cf;
    font-size:.75rem;
    font-weight:800;
}
.game-choice-name{
    font-size:1.12rem;
}
.game-choice-description{
    flex:1;
    color:#d5dfda;
    line-height:1.35;
}
.game-choice-rule{
    color:var(--muted);
    font-size:.8rem;
}
.game-choice-footer{
    padding-top:.5rem;
    border-top:1px solid var(--line);
    color:#9db4a9;
    font-size:.78rem;
}
.game-choice-footer b{
    color:#75d1a0;
}
.wizard-bottom-actions,
.wizard-form-actions{
    display:flex;
    justify-content:space-between;
    gap:.7rem;
    margin-top:1.2rem;
}
.selected-game-summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin-bottom:1rem;
    padding:1rem;
    border:1px solid #4a936e;
    border-radius:.9rem;
    background:#13291f;
}
.selected-game-main{
    display:flex;
    align-items:flex-start;
    gap:.85rem;
}
.selected-game-main h2{
    margin:.05rem 0 .28rem;
}
.selected-game-main p{
    margin:0;
    color:#c7d8d0;
}
.selected-game-meta{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:.28rem;
    color:var(--muted);
    font-size:.82rem;
    white-space:nowrap;
}
.session-setup-form{
    display:grid;
    gap:.85rem;
    padding:1rem;
    border:1px solid var(--line);
    border-radius:1rem;
    background:var(--panel);
}
.wizard-input-mode{
    margin:0;
}
.wizard-form-section{
    display:grid;
    gap:.65rem;
    padding:.8rem;
    border:1px solid var(--line);
    border-radius:.8rem;
    background:#101713;
}
.wizard-form-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:.7rem;
}
@media(max-width:760px){
    .section-heading.compact,
    .game-category-toolbar{
        align-items:flex-start;
        flex-direction:column;
    }
    .game-category-filters{
        justify-content:flex-start;
        width:100%;
        flex-wrap:nowrap;
        overflow-x:auto;
        padding-bottom:.25rem;
    }
    .category-filter{
        flex:0 0 auto;
    }
    .selected-game-summary{
        align-items:flex-start;
        flex-direction:column;
    }
    .selected-game-main{
        flex-direction:column;
    }
    .selected-game-meta{
        align-items:flex-start;
    }
    .wizard-form-grid{
        grid-template-columns:1fr;
    }
}
@media(max-width:520px){
    .session-wizard-page{
        padding:.65rem;
    }
    .wizard-progress{
        margin-bottom:.8rem;
        font-size:.82rem;
    }
    .wizard-progress-line{
        width:38px;
    }
    .game-card-grid{
        grid-template-columns:1fr;
    }
    .game-choice-card{
        min-height:0;
    }
    .recent-games-section{
        padding:.7rem;
    }
    .session-setup-form{
        padding:.7rem;
    }
    .wizard-form-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
    }
    .wizard-form-actions button{
        width:100%;
    }
}

/* ---------------------------------------------------------------
 * v0.13.0: IQ-Modus und Casino-Bearbeitung
 * --------------------------------------------------------------- */
.session-start-mode{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.8rem;
    margin-bottom:1.2rem;
}
.start-mode-card{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:.2rem .75rem;
    align-items:center;
    min-height:112px;
    padding:1rem;
    border:1px solid var(--line);
    border-radius:1rem;
    background:#111a16;
    color:var(--text);
    text-align:left;
}
.start-mode-card:hover,
.start-mode-card.active{
    border-color:#4ba779;
    background:#17271f;
}
.start-mode-card.iq.active{
    border-color:#7b9fe6;
    background:#172238;
}
.start-mode-icon{
    grid-row:1/3;
    width:54px;
    height:54px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#234333;
    font-size:1.15rem;
    font-weight:900;
}
.start-mode-card.iq .start-mode-icon{
    background:#2b477d;
}
.start-mode-card strong{
    font-size:1.08rem;
}
.start-mode-card small{
    color:var(--muted);
    line-height:1.35;
}
.iq-mode-panel{
    display:grid;
    gap:1rem;
}
.iq-entry-card{
    display:grid;
    gap:.8rem;
}
.iq-coup-counter{
    display:flex;
    flex-direction:column;
    align-items:center;
    min-width:78px;
    padding:.55rem .7rem;
    border:1px solid #496790;
    border-radius:.75rem;
    background:#111e31;
}
.iq-coup-counter strong{
    font-size:1.35rem;
}
.iq-coup-counter span{
    color:var(--muted);
    font-size:.75rem;
}
.iq-permanence{
    display:flex;
    gap:.3rem;
    min-height:45px;
    padding:.55rem;
    overflow-x:auto;
    border:1px solid var(--line);
    border-radius:.7rem;
    background:#0b120f;
}
.iq-permanence-number{
    flex:0 0 34px;
    width:34px;
    height:34px;
    padding:0;
    border:1px solid rgba(255,255,255,.18);
    border-radius:50%;
    color:#fff;
    font-weight:800;
}
.iq-tableau{
    display:grid;
    grid-template-columns:34px repeat(12,minmax(22px,1fr));
    grid-template-rows:repeat(3,38px);
    gap:2px;
}
.iq-number{
    grid-row:var(--iq-row);
    grid-column:var(--iq-column);
    min-height:0;
    height:38px;
    padding:0;
    border-radius:.28rem;
    color:#fff;
    font-size:.78rem;
    font-weight:800;
}
.iq-number:first-child{
    grid-row:1/4;
    grid-column:1;
    height:auto;
}
.iq-number.red,
.iq-permanence-number.red{background:#9f2d2d}
.iq-number.black,
.iq-permanence-number.black{background:#171717}
.iq-number.green,
.iq-permanence-number.green{background:#167445}
.iq-entry-actions{
    display:flex;
    flex-wrap:wrap;
    gap:.5rem;
}
.iq-entry-actions #iqAnalyzeButton{
    margin-left:auto;
}
.iq-dev-option{
    width:max-content;
}
.iq-disclaimer{
    margin:0;
    padding:.65rem .75rem;
    border-left:3px solid #7187a7;
    background:#111a27;
    color:#bdc9d9;
    font-size:.82rem;
}
.iq-results-section{
    display:grid;
    gap:.75rem;
}
.iq-recommendation-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:.7rem;
}
.iq-recommendation-card{
    display:grid;
    gap:.65rem;
    padding:.85rem;
    border:1px solid var(--line);
    border-radius:.9rem;
    background:#121b17;
}
.iq-recommendation-card.overall{
    border-color:#6ca2ed;
    background:#14223a;
}
.iq-result-title{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:.7rem;
}
.iq-result-title h3{
    margin:.35rem 0 0;
}
.iq-metrics{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.4rem;
    margin:0;
}
.iq-metrics>div{
    padding:.45rem;
    border:1px solid var(--line);
    border-radius:.55rem;
    background:rgba(0,0,0,.13);
}
.iq-metrics dt{
    color:var(--muted);
    font-size:.72rem;
}
.iq-metrics dd{
    margin:.12rem 0 0;
    font-weight:800;
}
.iq-next-signal{
    margin:0;
    color:#c9d8d0;
    font-size:.83rem;
}
.iq-ranking-panel{
    padding:0;
    overflow:hidden;
}
.iq-ranking-panel>summary{
    padding:.7rem .8rem;
    cursor:pointer;
    font-weight:800;
}
.iq-ranking-list{
    display:grid;
    gap:.35rem;
    padding:.6rem;
    border-top:1px solid var(--line);
}
.iq-ranking-row{
    display:grid;
    grid-template-columns:34px minmax(160px,1fr) auto auto auto auto;
    align-items:center;
    gap:.55rem;
    padding:.55rem;
    border:1px solid var(--line);
    border-radius:.6rem;
    background:#0e1512;
}
.iq-ranking-row small{
    display:block;
    color:var(--muted);
}
.iq-rank{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#24382f;
    font-weight:900;
}
.iq-baseline-notice{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:.15rem .65rem;
    margin-bottom:.75rem;
    padding:.75rem;
    border:1px solid #567cb5;
    border-radius:.8rem;
    background:#12223b;
}
.iq-baseline-notice strong{
    grid-row:1/3;
    align-self:center;
    padding:.35rem .5rem;
    border-radius:.5rem;
    background:#2b5994;
}
.iq-baseline-notice small{
    color:#b9c8db;
}
.casino-action-row{
    display:flex;
    flex-wrap:wrap;
    gap:.45rem;
}
.casino-editor-heading{
    grid-column:1/-1;
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.casino-management-page{
    max-width:1000px;
}
.casino-management-card{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem;
}
.session-card-badges{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:.35rem;
}
.iq-session-badge{
    display:inline-flex;
    align-items:center;
    padding:.22rem .48rem;
    border:1px solid #587bb4;
    border-radius:999px;
    background:#162744;
    color:#bad2f4;
    font-size:.74rem;
    font-weight:800;
}
.permanence-number.baseline{
    box-shadow:inset 0 0 0 2px rgba(109,157,230,.85);
}
@media(max-width:760px){
    .session-start-mode{grid-template-columns:1fr}
    .iq-ranking-row{
        grid-template-columns:30px minmax(0,1fr) auto;
    }
    .iq-ranking-row>span:nth-of-type(n+2),
    .iq-ranking-row>strong{
        display:none;
    }
    .iq-entry-actions #iqAnalyzeButton{
        margin-left:0;
        width:100%;
    }
}
@media(max-width:520px){
    .iq-tableau{
        grid-template-columns:28px repeat(12,minmax(18px,1fr));
        grid-template-rows:repeat(3,34px);
    }
    .iq-number{
        height:34px;
        font-size:.72rem;
    }
    .iq-recommendation-grid{grid-template-columns:1fr}
    .casino-management-card{align-items:flex-start;flex-direction:column}
}
.iq-mode-panel[hidden],
.iq-results-section[hidden],
.iq-baseline-notice[hidden]{
    display:none !important;
}

/* v0.13.1: IQ-Eingabetableau standardmäßig flach, Größe Groß kompakter */


/* ---------------------------------------------------------------
 * v0.13.2: Random-Eingabe nur in echten Random-Sitzungen
 * --------------------------------------------------------------- */
.random-input-panel[hidden],
.random-spin-button[hidden]{
    display:none !important;
}


/* v0.14.0: Tischregel Partage und halbe Stücke */
.zero-rule-choice{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.65rem;
    margin:0;
}
.zero-rule-choice legend{
    margin-bottom:.35rem;
    font-weight:800;
}
.zero-rule-badge{
    display:inline-flex;
    align-items:center;
    padding:.22rem .48rem;
    border:1px solid #7d6e3e;
    border-radius:999px;
    background:#2b2512;
    color:#ead894;
    font-size:.74rem;
    font-weight:800;
}
@media(max-width:650px){
    .zero-rule-choice{grid-template-columns:1fr}
}

/* ---------------------------------------------------------------
 * v0.15.0: Session-Automatik und nicht gesetzte Einsätze
 * --------------------------------------------------------------- */
.session-option-choice{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.65rem;
    margin:0;
    padding:.75rem;
    border:1px solid var(--line);
    border-radius:.8rem;
    background:#101713;
}
.session-option-choice legend{
    padding:0 .35rem;
    color:#bfe8d1;
    font-weight:800;
}
.attack-card.skip-next-bet{
    border-color:#a16b45;
    background:#241a12;
}
.attack-card.skip-next-bet .attack-stake{
    opacity:.55;
    text-decoration:line-through;
}
.attack-skip-button{
    grid-column:1/-1;
    justify-self:start;
    padding:.4rem .62rem;
    font-size:.8rem;
}
.latest-bets-correction{
    margin:.5rem 0;
    padding:0;
    overflow:hidden;
    border-color:#694d3c;
    background:#15120f;
}
.latest-bets-correction[hidden]{
    display:none !important;
}
.latest-bets-correction>summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.65rem;
    padding:.55rem .7rem;
    cursor:pointer;
    color:#e8c9b4;
    font-weight:800;
}
.latest-bets-correction>summary small{
    font-weight:400;
}
.latest-bets-correction[open]>summary{
    border-bottom:1px solid var(--line);
}
.latest-bets-correction-list{
    display:grid;
    gap:.4rem;
    padding:.55rem;
}
.latest-bet-correction-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.7rem;
    padding:.55rem .65rem;
    border:1px solid var(--line);
    border-radius:.65rem;
    background:#0d1411;
}
.latest-bet-correction-row small{
    display:block;
    margin-top:.12rem;
    color:var(--muted);
}
.latest-bet-correction-row.not-placed{
    border-color:#665c45;
    opacity:.8;
}
@media(max-width:700px){
    .session-option-choice{
        grid-template-columns:1fr;
    }
}
@media(max-width:520px){
    .latest-bet-correction-row{
        align-items:flex-start;
        flex-direction:column;
    }
    .latest-bet-correction-row button{
        width:100%;
    }
}
.session-option-badge{
    display:inline-flex;
    align-items:center;
    padding:.22rem .48rem;
    border:1px solid #5c765f;
    border-radius:999px;
    background:#18251b;
    color:#c5dec8;
    font-size:.74rem;
    font-weight:800;
}


/* ---------------------------------------------------------------
 * v0.16.1: System oben und Korrektur „nicht gesetzt“ nach oben
 * --------------------------------------------------------------- */
.session-summary{
    grid-template-columns:repeat(6,minmax(0,1fr));
}
.session-system-summary strong{
    color:#b8ebcf;
}
.latest-bets-correction-top{
    margin:0 0 .55rem;
    border-color:#765348;
    background:#211714;
}
.latest-bets-correction-top>summary{
    color:#ffd0bd;
}
@media(max-width:1050px){
    .session-summary{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}
@media(max-width:620px){
    .session-summary{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .session-system-summary{
        grid-column:1/-1;
    }
}


/* ---------------------------------------------------------------
 * v0.17.0: Kategorienverwaltung und M:N-Systemzuordnung
 * --------------------------------------------------------------- */
.page-head-actions{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:.55rem;
}
.admin-category-filter{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:.4rem;
    margin:.7rem 0 1rem;
}
.admin-category-filter .category-filter{
    text-decoration:none;
}
.admin-category-filter .category-filter small{
    margin-left:.25rem;
    opacity:.75;
}
.system-category-labels,
.game-category-badges{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:.3rem;
}
.category-selection-fieldset{
    margin:0;
    padding:.7rem;
    border:1px solid var(--line);
    border-radius:.7rem;
    background:#101713;
}
.category-selection-fieldset legend{
    padding:0 .3rem;
    color:#cae9da;
    font-weight:800;
}
.category-checkbox-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:.4rem;
    margin-bottom:.45rem;
}
.category-checkbox{
    display:flex;
    align-items:center;
    gap:.45rem;
    min-height:42px;
    padding:.45rem .55rem;
    border:1px solid var(--line);
    border-radius:.55rem;
    background:#0d1411;
}
.category-checkbox input{
    width:auto;
    margin:0;
}
.category-checkbox small{
    margin-left:auto;
    color:#d4a75d;
}
.category-management-page{
    max-width:1150px;
}
.category-create-card{
    margin-bottom:1rem;
}
.category-create-form{
    display:grid;
    grid-template-columns:minmax(220px,2fr) minmax(120px,.7fr) minmax(240px,1.4fr) auto;
    align-items:end;
    gap:.65rem;
}
.category-active-checkbox{
    min-height:46px;
    margin:0;
}
.category-management-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:.8rem;
}
.category-management-card{
    display:grid;
    gap:.55rem;
}
.category-edit-form{
    display:grid;
    gap:.55rem;
}
.category-card-heading,
.category-card-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.6rem;
}
.category-card-heading>div{
    display:flex;
    align-items:center;
    gap:.45rem;
}
.category-delete-form{
    display:flex;
    justify-content:flex-end;
    padding-top:.45rem;
    border-top:1px solid var(--line);
}
.category-delete-form button:disabled{
    opacity:.45;
    cursor:not-allowed;
}
@media(max-width:800px){
    .category-create-form{
        grid-template-columns:1fr 1fr;
    }
}
@media(max-width:520px){
    .page-head-actions,
    .category-create-form{
        display:grid;
        grid-template-columns:1fr;
        width:100%;
    }
    .page-head-actions>*{
        width:100%;
        text-align:center;
    }
    .category-checkbox-grid{
        grid-template-columns:1fr;
    }
}


/* ---------------------------------------------------------------
 * v0.18.0: Satzpakete und Satzangaben
 * --------------------------------------------------------------- */
.attack-package-details{
    margin-top:.35rem;
    max-width:560px;
    color:#bcd1c7;
    font-size:.82rem;
}
.attack-package-details summary{
    cursor:pointer;
    color:#8fd5af;
}
.attack-package-details>div{
    display:flex;
    flex-wrap:wrap;
    gap:.3rem;
    margin-top:.35rem;
}
.attack-package-details span{
    display:inline-flex;
    gap:.28rem;
    padding:.25rem .42rem;
    border:1px solid var(--line);
    border-radius:.45rem;
    background:#101713;
}
.generator-selection-field[hidden],
.generator-count-field[hidden],
.duplicate-mode-field[hidden],
.window-size-field[hidden],
.required-count-field[hidden]{
    display:none !important;
}

/* ---------------------------------------------------------------
 * v0.19.0: tabellengesteuerte Satz-Sets
 * --------------------------------------------------------------- */
.bet-set-management-page{
    max-width:1280px;
}
.bet-set-create-panel{
    margin-bottom:1rem;
}
.bet-set-create-panel>summary{
    cursor:pointer;
    font-weight:900;
    color:#bfe8d1;
}
.bet-set-form{
    display:grid;
    gap:.75rem;
    margin-top:.75rem;
}
.bet-set-base-grid{
    display:grid;
    grid-template-columns:2fr 1.3fr .7fr 1.2fr;
    gap:.65rem;
    align-items:end;
}
.bet-set-lines-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.6rem;
}
.bet-set-lines-head h3{
    margin:0;
}
.bet-set-lines{
    display:grid;
    gap:.4rem;
}
.bet-set-line-row{
    display:grid;
    grid-template-columns:1.2fr 1.2fr 1.4fr 90px 44px;
    gap:.4rem;
    align-items:center;
    padding:.45rem;
    border:1px solid var(--line);
    border-radius:.65rem;
    background:#0e1612;
}
.bet-set-line-row select,
.bet-set-line-row input{
    margin:0;
}
.bet-set-line-row .danger{
    min-height:42px;
    padding:.35rem;
    font-size:1.1rem;
}
.bet-set-category-nav{
    display:flex;
    gap:.4rem;
    margin:.8rem 0 1rem;
    overflow-x:auto;
    padding-bottom:.25rem;
}
.bet-set-category-nav a{
    flex:0 0 auto;
    padding:.42rem .65rem;
    border:1px solid var(--line);
    border-radius:999px;
    background:#101914;
    color:#b9d2c5;
    font-size:.8rem;
}
.bet-set-category-section{
    margin-bottom:1.25rem;
}
.bet-set-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:.7rem;
}
.bet-set-card{
    align-self:start;
}
.bet-set-card h3{
    margin:.05rem 0;
}
.bet-set-summary{
    display:flex;
    flex-wrap:wrap;
    gap:.45rem .8rem;
    color:#c4d7ce;
    font-size:.82rem;
}
.bet-set-editor{
    margin-top:.65rem;
    border-top:1px solid var(--line);
    padding-top:.55rem;
}
.bet-set-editor>summary{
    cursor:pointer;
    color:#bfe8d1;
    font-weight:800;
}
.bet-set-secondary-actions{
    display:flex;
    flex-wrap:wrap;
    gap:.45rem;
    margin-top:.6rem;
}
.bet-set-checkbox-groups{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:.55rem;
}
.bet-set-checkbox-group{
    display:grid;
    align-content:start;
    gap:.35rem;
    padding:.55rem;
    border:1px solid var(--line);
    border-radius:.65rem;
    background:#0e1612;
}
.bet-set-checkbox-group>strong{
    color:#80cfa5;
    font-size:.82rem;
}
.bet-set-checkbox-group .category-checkbox{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:.15rem .4rem;
    align-items:start;
    margin:0;
    padding:.32rem .38rem;
}
.bet-set-checkbox-group .category-checkbox small{
    grid-column:2;
    color:var(--muted);
}
.bet-set-selection-field[hidden]{
    display:none !important;
}
@media(max-width:850px){
    .bet-set-base-grid{
        grid-template-columns:1fr 1fr;
    }
    .bet-set-line-row{
        grid-template-columns:1fr 1fr;
    }
    .bet-set-line-row input[name="line_label[]"]{
        grid-column:1/-1;
    }
    .bet-set-line-row .danger{
        width:44px;
    }
}
@media(max-width:560px){
    .bet-set-base-grid{
        grid-template-columns:1fr;
    }
    .bet-set-grid{
        grid-template-columns:1fr;
    }
    .bet-set-line-row{
        grid-template-columns:1fr;
    }
    .bet-set-line-row input[name="line_label[]"]{
        grid-column:auto;
    }
    .bet-set-line-row .danger{
        width:100%;
    }
}


/* ---------------------------------------------------------------
 * v0.19.1: sichtbare Bearbeiten-/Kopieren-/Löschen-Aktionen
 * --------------------------------------------------------------- */
.bet-set-card-actions{
    display:flex;
    flex-wrap:wrap;
    gap:.45rem;
    margin-top:.7rem;
    padding-top:.65rem;
    border-top:1px solid var(--line);
}
.bet-set-card-actions form{
    margin:0;
}
.bet-set-card-actions button{
    min-width:92px;
}
.bet-set-editor{
    margin-top:.55rem;
}
.bet-set-editor[open]{
    padding:.65rem;
    border:1px solid #3e6b57;
    border-radius:.7rem;
    background:#0d1712;
}
.bet-set-editor[open]>summary{
    margin-bottom:.65rem;
}
@media(max-width:520px){
    .bet-set-card-actions{
        display:grid;
        grid-template-columns:1fr 1fr 1fr;
    }
    .bet-set-card-actions button{
        width:100%;
        min-width:0;
        padding:.5rem .3rem;
        font-size:.8rem;
    }
}


/* ---------------------------------------------------------------
 * v0.19.2: Satz-Set-Formular bei Fehlern erhalten
 * --------------------------------------------------------------- */
.bet-set-inline-error{
    margin:0 0 .75rem;
}
.bet-set-form .field-error{
    border-color:#d45b5b !important;
    box-shadow:0 0 0 2px rgba(212,91,91,.22);
}
.bet-set-form.form-has-error{
    scroll-margin-top:1rem;
}
.bet-set-line-help{
    margin:.1rem 0 .55rem;
    font-size:.82rem;
}

/* v0.19.3: getrennte Satz-Set-Kategorien */
.page-head-actions{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:flex-end}
@media(max-width:700px){.page-head-actions{justify-content:flex-start}}


/* ---------------------------------------------------------------
 * v0.19.5: Set-Kategorie zuerst, danach Satz-Set-Feinauswahl
 * --------------------------------------------------------------- */
.bet-set-category-filter-field{
    display:grid;
    gap:.28rem;
    margin-bottom:.75rem;
}
.bet-set-category-filter-field select{
    width:min(100%,420px);
}
.bet-set-checkbox-group[hidden]{
    display:none !important;
}
.bet-set-selection-summary{
    margin-top:.65rem;
    padding:.55rem .65rem;
    border:1px solid var(--line);
    border-radius:.6rem;
    background:#0d1511;
    color:#cce7d8;
    font-size:.82rem;
}
.bet-set-selection-summary.muted{
    color:var(--muted);
}
@media(max-width:560px){
    .bet-set-category-filter-field select{
        width:100%;
    }
}


/* ---------------------------------------------------------------
 * v0.21.0: La Remise und manuelle Saldo-Korrekturen
 * --------------------------------------------------------------- */
.balance-adjustment-summary{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.6rem;
    margin:.8rem 0;
}
.balance-adjustment-summary>div{
    display:grid;
    gap:.2rem;
    padding:.65rem;
    border:1px solid var(--line);
    border-radius:.65rem;
    background:#0d1511;
}
.balance-adjustment-summary span{
    color:var(--muted);
    font-size:.78rem;
}
.balance-adjustment-summary strong{
    font-size:1.05rem;
}
.balance-adjustment-history{
    margin-top:1rem;
    padding-top:.8rem;
    border-top:1px solid var(--line);
}
.balance-adjustment-history h3{
    margin:.1rem 0 .55rem;
}
.balance-adjustment-history-list{
    display:grid;
    gap:.4rem;
    max-height:260px;
    overflow:auto;
}
.balance-adjustment-history-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.75rem;
    padding:.55rem .6rem;
    border:1px solid var(--line);
    border-radius:.6rem;
    background:#0d1511;
}
.balance-adjustment-history-row small{
    display:block;
    margin-top:.12rem;
    color:var(--muted);
}
.balance-adjustment-history-values{
    text-align:right;
    white-space:nowrap;
}
@media(max-width:560px){
    .balance-adjustment-summary{
        grid-template-columns:1fr;
    }
    .balance-adjustment-history-row{
        align-items:flex-start;
        flex-direction:column;
    }
    .balance-adjustment-history-values{
        text-align:left;
    }
}


/* ---------------------------------------------------------------
 * v0.23.0: Handwechsel in der Permanenz
 * --------------------------------------------------------------- */
.permanence-hand-change,
.iq-permanence-hand-change{
    display:inline-grid;
    place-items:center;
    flex:0 0 auto;
    min-width:30px;
    height:30px;
    padding:0 .38rem;
    border:1px solid #8ca298;
    border-radius:.42rem;
    background:#26312c;
    color:#f2f6f4;
    font-size:1.2rem;
    font-weight:900;
    line-height:1;
}
.permanence-hand-change.baseline{
    border-color:#6998db;
    box-shadow:inset 0 0 0 1px #6998db;
}
.iq-permanence-hand-change{
    cursor:pointer;
}
.hand-change-button{
    white-space:nowrap;
}
@media(max-width:560px){
    .permanence-hand-change,
    .iq-permanence-hand-change{
        min-width:26px;
        height:26px;
        font-size:1rem;
    }
}


/* ---------------------------------------------------------------
 * v0.24.0: AppRoulette – ein Produkt von PlusStar
 * --------------------------------------------------------------- */
.brand{
    display:flex;
    align-items:center;
    gap:.72rem;
    min-width:max-content;
}
.brand-mark-link{
    display:block;
    line-height:0;
}
.brand img{
    width:42px;
    height:42px;
    border:0;
    border-radius:.78rem;
    object-fit:contain;
    box-shadow:
        0 8px 24px rgba(0,0,0,.22),
        0 0 0 1px rgba(228,200,117,.16);
}
.brand-copy{
    display:grid;
    gap:.16rem;
    line-height:1.05;
}
.brand-title{
    color:var(--text);
    font-size:1.03rem;
    font-weight:900;
    letter-spacing:-.02em;
    text-decoration:none;
}
.brand-title:hover{
    color:#fff;
}
.brand-origin{
    color:#d9c77f;
    font-size:.69rem;
    font-weight:700;
    letter-spacing:.035em;
    text-decoration:none;
}
.brand-origin:hover{
    color:#f4dfa0;
}
.brand-product-origin{
    margin:.25rem 0 0;
    color:var(--muted);
    font-size:.92rem;
}
.brand-product-origin a,
.auth-plusstar-link a,
.install-plusstar-reference a{
    color:#e4c875;
    font-weight:800;
}
.auth-plusstar-link{
    margin:1rem 0 0;
    color:var(--muted);
    font-size:.82rem;
}
.login-logo{
    width:min(100%,560px);
}
.app-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin-top:2rem;
    padding:1.05rem max(1rem,calc((100vw - 1380px)/2));
    border-top:1px solid var(--line);
    background:rgba(8,17,13,.76);
    color:var(--muted);
    font-size:.8rem;
}
.app-footer>div{
    display:flex;
    align-items:baseline;
    gap:.4rem;
}
.app-footer strong{
    color:var(--text);
}
.app-footer nav{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:.45rem;
    flex-wrap:wrap;
}
.app-footer a{
    color:#d9c77f;
}
.install-branding{
    margin:-.2rem 0 1rem;
    text-align:center;
}
.install-branding img{
    width:min(100%,560px);
    max-height:170px;
    object-fit:contain;
}
.install-plusstar-reference{
    margin:1.2rem 0 0;
    color:var(--muted);
    font-size:.82rem;
    text-align:center;
}
.about-page{
    display:grid;
    gap:1rem;
}
.about-hero{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);
    align-items:center;
    gap:2rem;
    overflow:hidden;
    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(228,200,117,.13),
            transparent 25rem
        ),
        radial-gradient(
            circle at 15% 0,
            rgba(126,226,168,.11),
            transparent 22rem
        ),
        var(--panel);
}
.about-hero h1{
    margin:.15rem 0;
    font-size:clamp(2.5rem,6vw,5rem);
    line-height:.95;
    letter-spacing:-.055em;
}
.about-origin-line{
    margin:.35rem 0 1rem;
    color:var(--muted);
    font-size:1.1rem;
}
.about-origin-line a{
    color:#e4c875;
    font-weight:900;
}
.about-actions{
    display:flex;
    gap:.65rem;
    margin-top:1.2rem;
    flex-wrap:wrap;
}
.about-app-logo{
    width:100%;
    max-height:300px;
    object-fit:contain;
}
.about-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1rem;
}
.about-grid h2{
    margin:.2rem 0 .7rem;
}
.about-grid ul{
    padding-left:1.2rem;
}
.plusstar-about-card{
    background:
        radial-gradient(
            circle at 50% 30%,
            rgba(126,226,168,.08),
            transparent 18rem
        ),
        var(--panel);
}
.about-plusstar-logo{
    display:block;
    width:min(100%,620px);
    max-height:210px;
    margin:.3rem auto .8rem;
    object-fit:contain;
}
.about-disclaimer{
    border-color:rgba(228,200,117,.28);
    background:rgba(228,200,117,.055);
}
@media(max-width:900px){
    .topbar{
        align-items:flex-start;
    }
    .brand{
        min-width:0;
    }
    .app-footer{
        align-items:flex-start;
        flex-direction:column;
    }
    .app-footer nav{
        justify-content:flex-start;
    }
    .about-hero,
    .about-grid{
        grid-template-columns:1fr;
    }
    .about-app-logo{
        max-width:650px;
    }
}
@media(max-width:520px){
    .brand img{
        width:38px;
        height:38px;
    }
    .brand-title{
        font-size:.96rem;
    }
    .brand-origin{
        font-size:.63rem;
    }
    .app-footer>div{
        align-items:flex-start;
        flex-direction:column;
        gap:.1rem;
    }
    .app-footer nav span:last-child{
        width:100%;
    }
    .about-actions{
        display:grid;
    }
    .about-actions .button{
        width:100%;
    }
}


/* ---------------------------------------------------------------
 * v0.24.1: Konto-Management und Branding-Feinschliff
 * --------------------------------------------------------------- */
.auth-help-links{
    display:flex;
    gap:1rem;
    flex-wrap:wrap;
    justify-content:center;
    margin-top:.95rem;
    font-size:.9rem;
}
.auth-help-links-stack{
    flex-direction:column;
    align-items:center;
    gap:.55rem;
}
.account-page,
.account-grid{
    display:grid;
    gap:1rem;
}
.account-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.account-section h2{
    margin:.15rem 0 .9rem;
}
.account-meta-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.8rem;
    margin-bottom:1rem;
}
.account-meta-grid > div{
    background:rgba(6,14,11,.52);
    border:1px solid var(--line);
    border-radius:14px;
    padding:.85rem .95rem;
}
.account-meta-grid span{
    display:block;
    color:var(--muted);
    font-size:.8rem;
    margin-bottom:.25rem;
}
.account-meta-grid strong{
    display:block;
    color:var(--text);
}
.stack-form{
    display:grid;
    gap:.9rem;
}
.inline-form{
    margin-top:.9rem;
}
.account-actions{
    display:flex;
    flex-wrap:wrap;
    gap:.7rem;
}
.small-note{
    font-size:.86rem;
}
.about-hero-single{
    grid-template-columns:1fr;
    gap:0;
}
.about-intro{
    max-width:78ch;
}
.benefits-list{
    margin:.25rem 0 0;
    padding-left:1.15rem;
    display:grid;
    gap:.6rem;
}
.clean-logo{
    max-height:145px;
}
@media(max-width:900px){
    .account-grid,
    .account-meta-grid{
        grid-template-columns:1fr;
    }
}


/* ---------------------------------------------------------------
 * v0.24.2: Kundenmenü und SMTP-Mailversand
 * --------------------------------------------------------------- */
.customer-menu{
    position:relative;
    z-index:80;
}
.customer-menu summary{
    display:flex;
    align-items:center;
    gap:.48rem;
    min-height:42px;
    padding:.35rem .6rem;
    border:1px solid var(--line);
    border-radius:.75rem;
    background:rgba(255,255,255,.045);
    color:var(--text);
    cursor:pointer;
    list-style:none;
    user-select:none;
}
.customer-menu summary::-webkit-details-marker{
    display:none;
}
.customer-menu[open] summary,
.customer-menu summary:hover{
    border-color:rgba(126,226,168,.35);
    background:rgba(126,226,168,.08);
}
.customer-menu-avatar{
    display:grid;
    place-items:center;
    width:29px;
    height:29px;
    border-radius:50%;
    background:#1b5b3b;
    color:#fff;
    font-size:.78rem;
    font-weight:900;
}
.customer-menu-label{
    max-width:180px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-weight:750;
}
.customer-menu-arrow{
    color:var(--muted);
    font-size:.8rem;
}
.customer-menu-panel{
    position:absolute;
    top:calc(100% + .45rem);
    right:0;
    display:grid;
    min-width:230px;
    padding:.45rem;
    border:1px solid var(--line);
    border-radius:.85rem;
    background:#101d17;
    box-shadow:0 18px 45px rgba(0,0,0,.38);
}
.customer-menu-panel a{
    display:block;
    padding:.72rem .78rem;
    border-radius:.58rem;
    color:var(--text);
    text-decoration:none;
}
.customer-menu-panel a:hover{
    background:rgba(126,226,168,.09);
}
.customer-menu-panel .customer-menu-logout{
    margin-top:.3rem;
    border-top:1px solid var(--line);
    border-radius:0 0 .58rem .58rem;
    color:#ff9b9b;
}
.account-anchor{
    scroll-margin-top:7rem;
}
@media(max-width:720px){
    .customer-menu-label{
        display:none;
    }
    .customer-menu-panel{
        position:fixed;
        top:74px;
        right:12px;
        left:12px;
        min-width:0;
    }
}


/* ---------------------------------------------------------------
 * v0.25.0: Parametrisierbare Tarife
 * --------------------------------------------------------------- */
.tier-admin-grid,.plan-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.tariff-editor{display:grid;gap:.8rem;padding:1rem;border:1px solid var(--line);border-radius:1rem;background:rgba(7,16,12,.45)}.tariff-editor-new{border-style:dashed}.tariff-editor-title,.customer-plan-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.form-grid{display:grid;gap:.7rem}.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.checkbox-row{display:flex;gap:1rem;flex-wrap:wrap}.current-tier-banner{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-bottom:1rem}.current-tier-banner>div{padding:.9rem;border:1px solid rgba(126,226,168,.18);border-radius:.8rem;background:rgba(126,226,168,.06)}.current-tier-banner span{display:block;color:var(--muted);font-size:.78rem}.current-tier-banner strong{display:block;margin-top:.2rem}.customer-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.customer-plan-card{display:grid;align-content:start;gap:.75rem;padding:1rem;border:1px solid var(--line);border-radius:1rem;background:rgba(7,16,12,.45)}.customer-plan-card.current{border-color:rgba(126,226,168,.5);box-shadow:inset 0 0 0 1px rgba(126,226,168,.15)}.customer-plan-card h4{margin:.1rem 0 0;font-size:1.15rem}.customer-plan-price{font-size:1.6rem;font-weight:900;color:var(--green)}.customer-plan-card ul{margin:0;padding-left:1.15rem}.plan-facts{display:flex;gap:.5rem;flex-wrap:wrap;color:var(--muted);font-size:.8rem}.plan-facts span{padding:.25rem .45rem;border:1px solid var(--line);border-radius:999px}.plan-change-notice{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin:1rem 0;padding:.85rem;border:1px solid rgba(228,200,117,.28);border-radius:.8rem;background:rgba(228,200,117,.06)}.change-request-grid{display:grid;gap:.7rem}.change-request-card{display:grid;grid-template-columns:1fr auto;gap:.8rem;align-items:start;padding:.85rem;border:1px solid var(--line);border-radius:.8rem}.change-actions{grid-column:1/-1;display:flex;gap:.5rem;flex-wrap:wrap}.change-actions input{flex:1 1 220px}.change-upgrade{color:#8ff0b4}.change-downgrade{color:#f4d47a}.change-lateral{color:#9bc7ff}@media(max-width:1100px){.customer-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:850px){.tier-admin-grid,.plan-admin-grid,.form-grid.two,.current-tier-banner,.customer-plan-grid{grid-template-columns:1fr}.change-request-card{grid-template-columns:1fr}}


/* ---------------------------------------------------------------
 * v0.25.1: Tarifbezogene Abrechnungsplan-Filter
 * --------------------------------------------------------------- */
.tariff-editor-selected{
    border-color:rgba(126,226,168,.5);
    box-shadow:
        inset 0 0 0 1px rgba(126,226,168,.13);
}
.tariff-editor-title>div{
    display:flex;
    align-items:center;
    gap:.5rem;
    flex-wrap:wrap;
}
.tariff-plan-link{
    display:inline-flex;
    align-items:center;
    gap:.4rem;
    white-space:nowrap;
}
.tariff-plan-link span,
.filter-pills a span{
    display:inline-grid;
    place-items:center;
    min-width:1.6rem;
    height:1.6rem;
    padding:0 .38rem;
    border-radius:999px;
    background:rgba(255,255,255,.08);
    color:inherit;
    font-size:.75rem;
    font-weight:900;
}
.billing-filter-bar{
    position:sticky;
    top:76px;
    z-index:18;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1rem;
    margin:0 0 1.1rem;
    padding:.9rem;
    border:1px solid var(--line);
    border-radius:1rem;
    background:rgba(10,21,16,.96);
    box-shadow:0 12px 35px rgba(0,0,0,.2);
    backdrop-filter:blur(14px);
}
.billing-filter-label{
    display:block;
    margin:0 0 .42rem;
    color:var(--muted);
    font-size:.74rem;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.filter-pills{
    display:flex;
    gap:.45rem;
    flex-wrap:wrap;
}
.filter-pills a{
    display:inline-flex;
    align-items:center;
    gap:.35rem;
    min-height:38px;
    padding:.48rem .68rem;
    border:1px solid var(--line);
    border-radius:999px;
    background:rgba(255,255,255,.025);
    color:var(--muted);
    font-size:.84rem;
    font-weight:800;
    text-decoration:none;
}
.filter-pills a:hover{
    border-color:rgba(126,226,168,.36);
    color:var(--text);
}
.filter-pills a.active{
    border-color:rgba(126,226,168,.5);
    background:rgba(126,226,168,.12);
    color:var(--green);
}
.billing-interval-badge{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:.28rem .58rem;
    border:1px solid rgba(228,200,117,.28);
    border-radius:999px;
    background:rgba(228,200,117,.07);
    color:#e9d787;
    font-size:.76rem;
    font-weight:850;
    white-space:nowrap;
}
.billing-empty-state{
    margin:0 0 1rem;
    padding:1rem;
    border:1px dashed var(--line);
    border-radius:.9rem;
    background:rgba(255,255,255,.02);
}
.billing-empty-state p{
    margin:.35rem 0 0;
}
@media(max-width:980px){
    .billing-filter-bar{
        grid-template-columns:1fr;
        top:68px;
    }
}
@media(max-width:650px){
    .billing-filter-bar{
        position:static;
    }
    .filter-pills{
        display:grid;
        grid-template-columns:1fr 1fr;
    }
    .filter-pills a{
        justify-content:space-between;
    }
    .tariff-editor-title{
        align-items:stretch;
        flex-direction:column;
    }
    .tariff-plan-link{
        justify-content:center;
    }
}


/* ---------------------------------------------------------------
 * v0.25.2: Manuelle Abo-, Zahlungs- und Ablaufverwaltung
 * --------------------------------------------------------------- */
.expiry-overview{
    margin-bottom:1rem;
    border-color:rgba(228,200,117,.28);
    background:
        radial-gradient(circle at 90% 0,rgba(228,200,117,.08),transparent 22rem),
        var(--panel);
}
.expiry-period-filter{
    display:flex;
    gap:.45rem;
    flex-wrap:wrap;
    margin:0 0 1rem;
}
.expiry-period-filter a,
.customer-filter-links a{
    display:inline-flex;
    align-items:center;
    min-height:40px;
    padding:.5rem .76rem;
    border:1px solid var(--line);
    border-radius:.72rem;
    background:rgba(255,255,255,.025);
    color:var(--green);
    text-decoration:none;
}
.expiry-period-filter a.active,
.customer-filter-links a.active{
    border-color:rgba(126,226,168,.5);
    background:rgba(126,226,168,.12);
    color:var(--text);
}
.expiry-table-wrap{
    overflow:auto;
}
.expiry-table{
    width:100%;
    border-collapse:collapse;
    min-width:760px;
}
.expiry-table th,
.expiry-table td{
    padding:.78rem .7rem;
    border-bottom:1px solid var(--line);
    text-align:left;
    vertical-align:middle;
}
.expiry-table th{
    color:var(--muted);
    font-size:.76rem;
    letter-spacing:.05em;
    text-transform:uppercase;
}
.expiry-table td small{
    display:block;
    margin-top:.18rem;
    color:var(--muted);
}
.expiry-days{
    display:inline-flex;
    padding:.26rem .52rem;
    border-radius:999px;
    background:rgba(228,200,117,.12);
    color:#ead98d;
    font-size:.8rem;
    font-weight:850;
}
.expiry-days.urgent{
    background:rgba(211,72,72,.15);
    color:#ffadad;
}
.payment-status{
    display:inline-flex;
    align-items:center;
    padding:.25rem .5rem;
    border-radius:999px;
    border:1px solid var(--line);
    font-size:.78rem;
    font-weight:850;
}
.payment-paid{
    border-color:rgba(126,226,168,.4);
    background:rgba(126,226,168,.12);
    color:var(--green);
}
.payment-open{
    border-color:rgba(228,200,117,.35);
    background:rgba(228,200,117,.08);
    color:#ead98d;
}
.payment-waived{
    border-color:rgba(104,161,255,.35);
    background:rgba(104,161,255,.09);
    color:#a9c9ff;
}
.payment-refunded,
.payment-cancelled{
    border-color:rgba(211,72,72,.32);
    background:rgba(211,72,72,.08);
    color:#ffadad;
}
.customer-filter-links{
    margin:0 0 1rem;
    display:flex;
    gap:.55rem;
    flex-wrap:wrap;
}
.customer-quick-actions{
    margin-bottom:.8rem;
}
.subscription-admin-editor{
    margin-top:.85rem;
    border-top:1px solid var(--line);
    padding-top:.78rem;
}
.subscription-admin-editor>summary{
    display:flex;
    justify-content:space-between;
    gap:1rem;
    cursor:pointer;
    color:var(--text);
    font-weight:850;
}
.subscription-admin-editor>summary span{
    color:var(--muted);
    font-size:.8rem;
    font-weight:600;
}
.subscription-admin-form{
    display:grid;
    gap:.9rem;
    margin-top:1rem;
}
.manual-order-fieldset{
    display:grid;
    gap:.8rem;
    margin:0;
    padding:1rem;
    border:1px solid rgba(228,200,117,.22);
    border-radius:.9rem;
    background:rgba(228,200,117,.035);
}
.manual-order-fieldset legend{
    padding:0 .45rem;
    color:#ead98d;
    font-weight:850;
}
.subscription-cancel-checkbox{
    align-self:end;
    min-height:52px;
}
.change-payment-form{
    display:grid;
    gap:.8rem;
    margin-top:.8rem;
}
.change-request-title{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:1rem;
}
.customer-onboarding-form{
    width:min(920px,calc(100vw - 2rem));
}
@media(max-width:700px){
    .subscription-admin-editor>summary,
    .change-request-title{
        flex-direction:column;
    }
    .expiry-period-filter,
    .customer-filter-links{
        display:grid;
        grid-template-columns:1fr 1fr;
    }
}


/* ---------------------------------------------------------------
 * v0.25.3: Bestätigung und Storno bei Tarifwechseln
 * --------------------------------------------------------------- */
.plan-change-notice{
    justify-content:space-between;
}
.plan-change-notice-copy{
    display:flex;
    align-items:center;
    gap:.5rem;
    flex-wrap:wrap;
}
.plan-change-cancel-form{
    margin-left:auto;
}
.danger-outline{
    border-color:rgba(224,92,92,.5)!important;
    color:#ffb2b2!important;
    background:rgba(224,92,92,.06)!important;
}
.danger-outline:hover{
    border-color:rgba(224,92,92,.8)!important;
    background:rgba(224,92,92,.14)!important;
}
.current-plan-cancel-button{
    width:100%;
    border-color:rgba(228,200,117,.38)!important;
    color:#ead98c!important;
}
.subscription-confirm-dialog{
    width:min(94vw,620px);
}
.subscription-confirm-dialog h2{
    margin:0;
}
.subscription-confirm-text{
    margin:1rem 0;
    font-size:1.02rem;
    line-height:1.55;
}
.subscription-confirm-hint{
    display:grid;
    gap:.25rem;
    margin:0 0 1rem;
    padding:.85rem;
    border:1px solid rgba(228,200,117,.25);
    border-radius:.8rem;
    background:rgba(228,200,117,.06);
    color:var(--muted);
}
.subscription-confirm-hint strong{
    color:#ead98c;
}
@media(max-width:650px){
    .plan-change-notice{
        align-items:stretch;
        flex-direction:column;
    }
    .plan-change-cancel-form{
        margin-left:0;
    }
    .plan-change-cancel-form button{
        width:100%;
    }
}


/* ---------------------------------------------------------------
 * v0.25.4: Kundenbearbeitung und kostenlose Zugänge
 * --------------------------------------------------------------- */
.payment-free{
    border-color:rgba(193,132,255,.42);
    background:rgba(193,132,255,.11);
    color:#d9b5ff;
}
.customer-master-editor{
    margin-top:.85rem;
    border-color:rgba(126,226,168,.22);
}
.customer-master-editor>summary{
    background:rgba(126,226,168,.045);
}
.customer-email-confirmed{
    align-self:end;
    min-height:52px;
}
.customer-master-meta{
    display:flex;
    gap:.7rem 1.2rem;
    flex-wrap:wrap;
    margin:.15rem 0 .8rem;
    color:var(--muted);
    font-size:.8rem;
}
@media(max-width:650px){
    .customer-email-confirmed{
        align-self:auto;
        min-height:auto;
    }
}


/* ---------------------------------------------------------------
 * v0.25.5: Nächste Zahlung und kontrollierte Verlängerungsfreigabe
 * --------------------------------------------------------------- */
.next-payment-detail dd{
    display:grid;
    gap:.28rem;
}
.next-payment-detail small{
    color:var(--muted);
    font-size:.75rem;
}
.next-renewal-editor{
    margin-top:.9rem;
    border-color:rgba(228,200,117,.28);
}
.next-renewal-editor>summary{
    background:rgba(228,200,117,.045);
}
.next-renewal-editor>summary::before{
    content:"€";
    display:inline-grid;
    place-items:center;
    width:1.7rem;
    height:1.7rem;
    margin-right:.5rem;
    border-radius:.5rem;
    background:rgba(228,200,117,.13);
    color:#ead688;
    font-weight:900;
}
.renewal-workflow-hint{
    display:flex;
    gap:.5rem;
    flex-wrap:wrap;
    margin-bottom:.9rem;
}
.renewal-workflow-hint>*{
    padding:.45rem .62rem;
    border:1px solid var(--line);
    border-radius:999px;
    background:rgba(255,255,255,.025);
    color:var(--muted);
    font-size:.78rem;
}
.renewal-workflow-hint strong{
    border-color:rgba(126,226,168,.3);
    color:var(--green);
}
.next-renewal-actions{
    display:flex;
    gap:.65rem;
    flex-wrap:wrap;
}
.next-renewal-release-panel{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin:0 1rem 1rem;
    padding:1rem;
    border:1px solid var(--line);
    border-radius:.9rem;
}
.next-renewal-release-panel>div:first-child{
    display:grid;
    gap:.25rem;
}
.next-renewal-release-panel>div:first-child span{
    color:var(--muted);
    font-size:.82rem;
}
.next-renewal-release-panel.ready{
    border-color:rgba(126,226,168,.38);
    background:rgba(126,226,168,.07);
}
.next-renewal-release-panel.blocked{
    border-color:rgba(228,200,117,.28);
    background:rgba(228,200,117,.05);
}
.next-renewal-release-actions{
    display:flex;
    gap:.6rem;
    align-items:center;
    flex-wrap:wrap;
    justify-content:flex-end;
}
.customer-next-renewal-notice{
    display:flex;
    justify-content:space-between;
    gap:1rem;
    margin:1rem 0;
    padding:1rem;
    border:1px solid rgba(228,200,117,.3);
    border-radius:1rem;
    background:rgba(228,200,117,.055);
}
.customer-next-renewal-notice>div{
    display:grid;
    gap:.3rem;
}
.customer-next-renewal-notice>div:last-child{
    justify-items:end;
    text-align:right;
}
.expiry-table td small{
    display:block;
    margin-top:.25rem;
}
@media(max-width:760px){
    .next-renewal-release-panel,
    .customer-next-renewal-notice{
        align-items:stretch;
        flex-direction:column;
    }
    .next-renewal-release-actions{
        justify-content:flex-start;
    }
    .customer-next-renewal-notice>div:last-child{
        justify-items:start;
        text-align:left;
    }
}


/* ---------------------------------------------------------------
 * v0.25.6: Systemfreigabe nach Tarif oder Einzelkunde
 * --------------------------------------------------------------- */
.system-access-fieldset{
    border-color:rgba(228,200,117,.28);
    background:rgba(228,200,117,.035);
}
.system-access-columns{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:1rem;
    margin-top:.8rem;
}
.system-access-columns>div{
    min-width:0;
}
.system-access-columns>div>strong{
    display:block;
    margin-bottom:.5rem;
}
.system-access-checklist{
    display:grid;
    gap:.45rem;
    max-height:260px;
    overflow:auto;
    padding:.25rem;
    border:1px solid var(--line);
    border-radius:.85rem;
    background:rgba(6,14,11,.42);
}
.system-customer-search{
    margin-bottom:.5rem;
}
.system-access-summary{
    display:flex;
    align-items:center;
    gap:.45rem .8rem;
    flex-wrap:wrap;
    margin:.65rem 0 .9rem;
    padding:.65rem .75rem;
    border:1px solid rgba(228,200,117,.22);
    border-radius:.75rem;
    background:rgba(228,200,117,.045);
    color:var(--muted);
    font-size:.82rem;
}
.system-access-summary strong{
    color:#ead88b;
}
.customer-individual-systems{
    grid-column:1/-1;
}
.system-access-fieldset[data-access-mode="all_customers"] .system-access-columns,
.system-access-fieldset[data-access-mode="admin_only"] .system-access-columns{
    opacity:.45;
}
@media(max-width:780px){
    .system-access-columns{
        grid-template-columns:1fr;
    }
}

.game-access-badges{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;justify-content:flex-end}.system-access-exclusive{background:rgba(228,200,117,.14)!important;border-color:rgba(228,200,117,.36)!important;color:#ead88b!important}.system-access-tier{background:rgba(126,226,168,.10)!important;border-color:rgba(126,226,168,.3)!important;color:var(--green)!important}


/* ---------------------------------------------------------------
 * v0.25.7: echte Tarif-Funktionsrechte
 * --------------------------------------------------------------- */
.tariff-feature-picker{
    margin:.9rem 0;
    padding:.9rem;
    border:1px solid var(--line);
    border-radius:1rem;
    background:rgba(4,12,9,.38);
}
.tariff-feature-picker legend{
    padding:0 .35rem;
    color:var(--text);
    font-weight:900;
}
.tariff-feature-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.65rem;
    margin-top:.65rem;
}
.tariff-feature-option{
    display:flex;
    align-items:flex-start;
    gap:.65rem;
    min-height:118px;
    padding:.8rem;
    border:1px solid var(--line);
    border-radius:.85rem;
    background:rgba(255,255,255,.025);
    cursor:pointer;
}
.tariff-feature-option:has(input:checked){
    border-color:rgba(126,226,168,.48);
    background:rgba(126,226,168,.09);
}
.tariff-feature-option input{
    width:auto;
    margin:.15rem 0 0;
}
.tariff-feature-option span{
    display:grid;
    gap:.3rem;
}
.tariff-feature-option small{
    color:var(--muted);
    line-height:1.35;
}
.feature-included-badge{
    display:inline-flex;
    align-self:flex-start;
    margin-top:.35rem;
    padding:.25rem .5rem;
    border-radius:999px;
    background:rgba(126,226,168,.13);
    color:var(--green);
    font-size:.72rem;
    font-weight:900;
}
.feature-locked-card{
    cursor:default;
    opacity:.86;
    border-style:dashed;
}
.feature-locked-card .button{
    align-self:flex-start;
    margin-top:.4rem;
}
.current-feature-section{
    margin-top:1.1rem;
}
.current-feature-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.75rem;
}
.current-feature-card{
    display:flex;
    flex-direction:column;
    gap:.6rem;
    min-height:190px;
    padding:.9rem;
    border:1px solid var(--line);
    border-radius:1rem;
    background:rgba(5,14,10,.45);
}
.current-feature-card.included{
    border-color:rgba(126,226,168,.38);
}
.current-feature-card.locked{
    opacity:.82;
}
.current-feature-card-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:.55rem;
}
.current-feature-card p{
    flex:1;
    margin:0;
    color:var(--muted);
    font-size:.88rem;
}
.feature-detail-line{
    color:var(--green);
    font-weight:800;
    font-size:.85rem;
}
.plan-feature-badges{
    display:flex;
    flex-wrap:wrap;
    gap:.35rem;
    margin:.6rem 0;
}
.system-customer-option.feature-unavailable{
    border-style:dashed;
    opacity:.7;
}
.system-customer-option.feature-unavailable small{
    color:#e0bd68;
}
.customer-feature-rights dd{
    line-height:1.35;
}
@media(max-width:980px){
    .tariff-feature-grid,
    .current-feature-grid{
        grid-template-columns:1fr;
    }
    .tariff-feature-option{
        min-height:auto;
    }
}


/* ---------------------------------------------------------------
 * v0.25.9: SMTP-Diagnose
 * --------------------------------------------------------------- */
.mail-diagnostic-card{
    margin-bottom:1rem;
    border-color:rgba(126,226,168,.4);
    background:rgba(126,226,168,.055);
}
.mail-diagnostic-card ul{
    display:grid;
    gap:.45rem;
    margin:.7rem 0 0;
    padding-left:1.2rem;
}
.mail-connection-test{
    margin:0 0 1.25rem;
    padding:0 0 1.15rem;
    border-bottom:1px solid var(--line);
}
.account-meta-grid strong small{
    display:block;
    margin-top:.25rem;
    color:var(--muted);
    font-size:.72rem;
    font-weight:600;
}


/* ---------------------------------------------------------------
 * v0.26.0: Aktives und passives Onboarding
 * --------------------------------------------------------------- */
.onboarding-public-card{
    width:min(860px,calc(100vw - 2rem));
}
.registration-honeypot{
    position:absolute!important;
    left:-9999px!important;
    width:1px!important;
    height:1px!important;
    opacity:0!important;
}
.onboarding-consents{
    display:grid;
    gap:.65rem;
    padding:.9rem;
    border:1px solid var(--line);
    border-radius:1rem;
    background:rgba(255,255,255,.025);
}
.onboarding-fallback-link input,
.onboarding-generated-link input{
    width:100%;
    margin-top:.5rem;
}
.onboarding-admin-page{
    display:grid;
    gap:1rem;
}
.onboarding-queue{
    display:grid;
    gap:.85rem;
}
.onboarding-queue-item{
    display:grid;
    grid-template-columns:minmax(180px,.8fr) minmax(240px,1fr) minmax(280px,1.1fr) auto;
    gap:1rem;
    align-items:center;
    padding:1rem;
    border:1px solid var(--line);
    border-radius:1rem;
    background:rgba(255,255,255,.025);
}
.onboarding-queue-item h3,
.onboarding-queue-item p{
    margin:.12rem 0;
}
.onboarding-status-pills,
.customer-onboarding-strip{
    display:flex;
    gap:.4rem;
    flex-wrap:wrap;
}
.compact-details{
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.onboarding-queue-actions{
    display:grid;
    gap:.45rem;
}
.onboarding-queue-actions form,
.customer-onboarding-actions form{
    margin:0;
}
.customer-onboarding-strip{
    margin:.65rem 0 .85rem;
}
.customer-onboarding-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin:.8rem 0;
    padding:.85rem;
    border:1px solid rgba(228,200,117,.25);
    border-radius:.9rem;
    background:rgba(228,200,117,.055);
}
.customer-onboarding-actions p{
    margin:.25rem 0 0;
}
@media(max-width:1100px){
    .onboarding-queue-item{
        grid-template-columns:1fr 1fr;
    }
}
@media(max-width:680px){
    .onboarding-queue-item,
    .compact-details{
        grid-template-columns:1fr;
    }
    .customer-onboarding-actions{
        align-items:stretch;
        flex-direction:column;
    }
}


/* v0.26.1: Onboarding-Texte und optionale Bestellreferenz */
.optional-label{
    font-size:.82em;
    font-weight:500;
}
.onboarding-review-note{
    line-height:1.55;
}


/* ---------------------------------------------------------------
 * v0.26.2: Kundenverwaltung, Zahlungsnachrichten und Dialog-Layout
 * --------------------------------------------------------------- */
.customer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:start;
}
.customer-card{
    min-width:0;
}
.customer-card.is-editing{
    grid-column:1 / -1;
    border-color:rgba(126,226,168,.42);
    box-shadow:0 18px 54px rgba(0,0,0,.2);
}
.customer-card.is-editing details[open]{
    scroll-margin-top:88px;
}
.customer-card details>summary{
    border-radius:.65rem;
    padding:.45rem .2rem;
}
.customer-card details>summary:hover{
    background:rgba(255,255,255,.035);
}
.payment-reminder-meta{
    display:block;
    margin-top:.35rem;
    color:#b8f5d1!important;
}
.payment-notice-panel{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin:0 1rem 1rem;
    padding:1rem;
    border:1px solid rgba(104,161,255,.28);
    border-radius:.9rem;
    background:rgba(104,161,255,.055);
}
.payment-notice-panel>div:first-child{
    display:grid;
    gap:.25rem;
}
.payment-notice-panel span{
    color:var(--muted);
    font-size:.84rem;
}
.payment-notice-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:.55rem;
    flex-wrap:wrap;
}
.payment-notice-actions form{
    margin:0;
}
.customer-create-dialog{
    width:min(1100px,calc(100vw - 32px));
    max-width:1100px;
    max-height:calc(100dvh - 32px);
    margin:auto;
    padding:0;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:1.15rem;
    background:var(--panel);
}
.customer-onboarding-form{
    display:grid;
    grid-template-rows:auto minmax(0,1fr) auto;
    width:100%;
    max-width:none;
    max-height:calc(100dvh - 34px);
    padding:0;
    overflow:hidden;
}
.customer-dialog-head,
.customer-dialog-actions{
    position:relative;
    z-index:3;
    margin:0;
    padding:1rem 1.25rem;
    background:rgba(18,32,25,.98);
}
.customer-dialog-head{
    border-bottom:1px solid var(--line);
}
.customer-dialog-head h2{
    margin:.1rem 0 0;
}
.customer-dialog-head .eyebrow{
    margin:0;
}
.customer-dialog-actions{
    border-top:1px solid var(--line);
    justify-content:flex-end;
}
.customer-dialog-scroll{
    min-width:0;
    overflow-y:auto;
    overflow-x:hidden;
    padding:1.1rem 1.25rem 1.4rem;
    overscroll-behavior:contain;
}
.customer-dialog-intro{
    margin:.1rem 0 1rem;
}
.customer-form-section{
    display:grid;
    gap:.85rem;
    min-width:0;
    margin:0 0 1rem;
    padding:1rem;
    border:1px solid var(--line);
    border-radius:.9rem;
    background:rgba(255,255,255,.018);
}
.customer-form-section legend{
    padding:0 .45rem;
    color:var(--green);
    font-weight:900;
}
.customer-form-section label,
.customer-form-section input,
.customer-form-section select{
    min-width:0;
    max-width:100%;
}
@media(max-width:1100px){
    .customer-grid{
        grid-template-columns:1fr;
    }
}
@media(max-width:760px){
    .payment-notice-panel,
    .next-renewal-release-panel{
        align-items:stretch;
        flex-direction:column;
        margin-inline:0;
    }
    .payment-notice-actions,
    .next-renewal-release-actions{
        display:grid;
        grid-template-columns:1fr;
        width:100%;
    }
    .payment-notice-actions button,
    .next-renewal-release-actions button{
        width:100%;
    }
    .customer-create-dialog{
        width:100vw;
        max-width:none;
        max-height:100dvh;
        height:100dvh;
        border:0;
        border-radius:0;
    }
    .customer-onboarding-form{
        max-height:100dvh;
        height:100dvh;
    }
    .customer-dialog-head,
    .customer-dialog-actions,
    .customer-dialog-scroll{
        padding-inline:1rem;
    }
    .customer-dialog-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
    }
    .customer-dialog-actions button{
        width:100%;
    }
}
@media(max-width:520px){
    .customer-dialog-actions{
        grid-template-columns:1fr;
    }
    .customer-form-section{
        padding:.85rem;
    }
}


/* ---------------------------------------------------------------
 * v0.26.3: Persönliche Nachricht bei Admin-Kundenmails
 * --------------------------------------------------------------- */
.personal-mail-dialog{
    width:min(680px,calc(100vw - 2rem));
    max-height:min(760px,calc(100dvh - 2rem));
    padding:0;
    border:1px solid var(--line);
    border-radius:1.25rem;
    background:var(--panel);
    color:var(--text);
    box-shadow:0 30px 90px rgba(0,0,0,.55);
}
.personal-mail-dialog::backdrop{
    background:rgba(0,0,0,.7);
    backdrop-filter:blur(4px);
}
.personal-mail-dialog .dialog-form{
    display:grid;
    gap:1rem;
    margin:0;
    padding:1.35rem;
}
.personal-mail-dialog .dialog-head{
    align-items:flex-start;
}
.personal-mail-dialog h2{
    margin:.15rem 0 .2rem;
}
.personal-mail-dialog textarea{
    min-height:170px;
    resize:vertical;
}
.personal-mail-hint{
    display:flex;
    justify-content:space-between;
    gap:1rem;
    color:var(--muted);
    font-size:.8rem;
}
.personal-mail-dialog .dialog-actions{
    display:flex;
    justify-content:flex-end;
    gap:.65rem;
    flex-wrap:wrap;
    margin-top:.2rem;
}
.customer-onboarding-form textarea[name="personal_message"]{
    min-height:125px;
}
@media(max-width:650px){
    .personal-mail-dialog{
        width:100vw;
        height:100dvh;
        max-width:none;
        max-height:none;
        border:0;
        border-radius:0;
    }
    .personal-mail-dialog .dialog-form{
        min-height:100%;
        align-content:start;
    }
    .personal-mail-dialog .dialog-actions{
        display:grid;
        grid-template-columns:1fr;
        margin-top:auto;
    }
    .personal-mail-dialog .dialog-actions button{
        width:100%;
    }
    .personal-mail-hint{
        align-items:flex-start;
        flex-direction:column;
        gap:.25rem;
    }
}


/* ---------------------------------------------------------------
 * v0.26.4: Kontolöschung, Testzugang und Onboarding-Menü
 * --------------------------------------------------------------- */
.trial-access-meta{
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.danger-zone{
    border-color:rgba(224,82,82,.32);
}
.account-deletion-pending,
.customer-deletion-alert{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
}
.account-deletion-pending p,
.customer-deletion-alert p{
    margin:.3rem 0 0;
}
.account-deletion-request>summary{
    cursor:pointer;
    color:#ffb2b2;
    font-weight:850;
}
.account-deletion-request form{
    margin-top:1rem;
}
.deletion-request-list{
    display:grid;
    gap:.65rem;
}
.deletion-request-item{
    display:grid;
    grid-template-columns:minmax(220px,1.2fr) minmax(220px,1fr) auto;
    align-items:center;
    gap:1rem;
    padding:.9rem 1rem;
    border:1px solid var(--line);
    border-radius:.9rem;
    background:rgba(255,255,255,.025);
}
.deletion-request-item>div{
    display:grid;
    gap:.18rem;
}
.deletion-request-item span,
.deletion-request-item small{
    color:var(--muted);
}
.customer-deletion-alert{
    margin:.8rem 0;
    padding:1rem;
    border:1px solid rgba(224,82,82,.4);
    border-radius:1rem;
    background:rgba(224,82,82,.08);
}
.customer-delete-editor{
    border-color:rgba(224,82,82,.32);
}
.customer-delete-editor>summary{
    color:#ffb2b2;
}
.onboarding-stat-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:1rem;
    margin-bottom:1rem;
}
.onboarding-stat-grid article{
    display:grid;
    gap:.3rem;
}
.onboarding-stat-grid span{
    color:var(--muted);
}
.onboarding-stat-grid strong{
    font-size:2rem;
}
@media(max-width:900px){
    .onboarding-stat-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .deletion-request-item{
        grid-template-columns:1fr;
    }
}
@media(max-width:650px){
    .trial-access-meta,
    .onboarding-stat-grid{
        grid-template-columns:1fr;
    }
    .account-deletion-pending,
    .customer-deletion-alert{
        align-items:stretch;
        flex-direction:column;
    }
}


/* ---------------------------------------------------------------
 * v1.0.0: IQ Light, IQ Pro und Permanenz-Dateiimport
 * --------------------------------------------------------------- */
.iq-access-banner{
    display:flex;
    align-items:center;
    gap:.7rem;
    margin:.7rem 0 1rem;
    padding:.8rem .95rem;
    border:1px solid var(--line);
    border-radius:.9rem;
    background:rgba(255,255,255,.025);
}
.iq-access-banner strong{
    color:var(--green);
    white-space:nowrap;
}
.iq-access-banner.light{
    border-color:rgba(228,200,117,.3);
}
.iq-access-banner.light strong{
    color:#e4c875;
}
.iq-light-system-field{
    display:grid;
    gap:.38rem;
    margin-bottom:1rem;
}
.iq-file-import{
    margin:1rem 0;
    padding:1rem;
    border:1px solid var(--line);
    border-radius:1rem;
    background:rgba(4,12,9,.35);
}
.iq-file-import-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
}
.iq-file-import-head>div{
    display:grid;
    gap:.2rem;
}
.iq-file-import-head small{
    color:var(--muted);
}
.iq-file-button{
    cursor:pointer;
    margin:0;
}
.iq-file-preview{
    display:grid;
    gap:.85rem;
    margin-top:1rem;
    padding-top:1rem;
    border-top:1px solid var(--line);
}
.iq-file-preview[hidden]{display:none}
.iq-file-summary{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:1rem;
    flex-wrap:wrap;
}
.iq-file-summary span{
    color:var(--muted);
}
.iq-upgrade-card{
    border-color:rgba(228,200,117,.28);
    background:rgba(228,200,117,.055);
}
@media(max-width:650px){
    .iq-access-banner,
    .iq-file-import-head{
        align-items:flex-start;
        flex-direction:column;
    }
    .iq-file-button{
        width:100%;
        justify-content:center;
    }
}


/* ---------------------------------------------------------------
 * v1.0.1: fokussierte Sitzungsoberfläche
 * --------------------------------------------------------------- */
.session-core-workspace{
    display:block;
}
.session-view-controls{
    align-items:center;
}
.session-view-controls #betCorrectionBtn[hidden]{
    display:none !important;
}
.tableau-card{
    overflow:visible;
}
.tableau-card[data-tableau-size="flat"] .roulette-grid{
    width:100%;
}
.tableau-card .tableau-head{
    padding-bottom:.15rem;
}
.tableau-card .tableau-controls{
    margin-left:auto;
}
.tableau-card .tableau-body{
    display:block !important;
}
.attack-card-compact{
    grid-template-columns:minmax(0,1fr) auto auto;
    align-items:center;
    gap:.45rem .6rem;
    padding:.45rem .58rem;
}
.attack-card-compact .attack-compact-main{
    display:flex;
    align-items:center;
    gap:.38rem;
    min-width:0;
    flex-wrap:wrap;
}
.attack-card-compact .attack-compact-main>b{
    margin-right:.15rem;
    font-size:.96rem;
}
.attack-meta-chip{
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:.18rem .42rem;
    border:1px solid rgba(126,226,168,.18);
    border-radius:999px;
    background:rgba(126,226,168,.07);
    color:#bfdecf;
    font-size:.72rem;
    font-weight:850;
    white-space:nowrap;
}
.attack-meta-chip.warning{
    border-color:rgba(228,177,117,.28);
    background:rgba(228,177,117,.09);
    color:#efd1a7;
}
.attack-stake-compact{
    grid-row:auto;
    grid-column:auto;
    display:flex;
    align-items:baseline;
    gap:.25rem;
    min-width:max-content;
}
.attack-stake-compact strong{
    font-size:1.15rem;
}
.attack-card-compact .attack-confirm-btn{
    min-width:72px;
    padding:.42rem .58rem;
}
.attack-package-compact{
    grid-column:1/-1;
    margin:0;
}
.attack-package-compact summary{
    font-size:.74rem;
}
.attack-package-compact>div{
    padding-top:.3rem;
}
.total-stake{
    padding:.38rem .55rem;
    font-size:.82rem;
}

/* Nicht gesetzter Einsatz ist eine normale Korrekturaktion, kein Alarmblock. */
.bet-correction-dialog,
.session-log-dialog{
    width:min(720px,calc(100vw - 2rem));
    max-height:min(820px,calc(100dvh - 2rem));
    padding:0;
    border:1px solid var(--line);
    border-radius:1rem;
    background:var(--panel);
    color:var(--text);
    box-shadow:0 28px 80px rgba(0,0,0,.55);
}
.bet-correction-dialog::backdrop,
.session-log-dialog::backdrop{
    background:rgba(0,0,0,.68);
    backdrop-filter:blur(4px);
}
.bet-correction-dialog .dialog-form,
.session-log-dialog .dialog-form{
    margin:0;
    padding:1.1rem;
}
.bet-correction-dialog .latest-bets-correction-list{
    padding:.2rem 0 0;
}
.status-chip{
    display:inline-flex;
    align-items:center;
    padding:.25rem .48rem;
    border-radius:999px;
    font-size:.75rem;
    font-weight:800;
}
.muted-chip{
    border:1px solid var(--line);
    color:var(--muted);
    background:rgba(255,255,255,.03);
}

/* Sitzungsprotokoll */
.session-log-list{
    display:grid;
    gap:.4rem;
    max-height:min(610px,65dvh);
    overflow:auto;
    padding-right:.15rem;
}
.session-log-entry{
    display:grid;
    grid-template-columns:32px minmax(0,1fr) auto;
    align-items:center;
    gap:.65rem;
    padding:.55rem .62rem;
    border:1px solid var(--line);
    border-radius:.7rem;
    background:#0d1512;
}
.session-log-entry>div{
    min-width:0;
}
.session-log-entry b{
    display:block;
    font-size:.88rem;
}
.session-log-entry small{
    display:block;
    margin-top:.12rem;
    color:var(--muted);
    font-size:.76rem;
}
.session-log-entry time{
    color:var(--muted);
    font-size:.72rem;
    white-space:nowrap;
}
.session-log-icon{
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    border-radius:.55rem;
    background:rgba(126,226,168,.09);
    color:var(--green);
    font-weight:900;
}
.session-log-entry.balance_adjustment .session-log-icon{
    background:rgba(116,165,222,.1);
    color:#a9cdf5;
}
.session-log-entry.bet_not_placed .session-log-icon{
    background:rgba(228,177,117,.1);
    color:#efd1a7;
}
.session-log-entry.hand_change .session-log-icon{
    background:rgba(202,177,232,.1);
    color:#d7baf8;
}

/* Fokus: nur die betrieblich wichtigen Bereiche bleiben groß im Blick. */
.session-focus-mode .roulette-page{
    max-width:none;
}
.session-focus-mode .session-summary,
.session-focus-mode #coupResultPanel{
    display:none !important;
}
.session-focus-mode .app-footer{
    display:none;
}
.session-focus-mode .session-control-bar{
    position:sticky;
    top:64px;
    z-index:25;
    margin-bottom:.45rem;
    background:rgba(8,17,13,.96);
    box-shadow:0 10px 28px rgba(0,0,0,.22);
    backdrop-filter:blur(12px);
}
.session-focus-mode .session-core-workspace{
    display:grid;
    grid-template-columns:minmax(250px,.34fr) minmax(0,1fr);
    grid-template-areas:
        "attack tableau"
        "perma tableau";
    align-items:start;
    gap:.5rem;
}
.session-focus-mode #systemStatus{
    grid-area:attack;
    margin:0;
}
.session-focus-mode .permanence-card{
    grid-area:perma;
    margin:0;
    position:sticky;
    top:124px;
}
.session-focus-mode .roulette-layout{
    grid-area:tableau;
    margin:0;
}
.session-focus-mode .roulette-layout.system-mode{
    display:block;
}
.session-focus-mode .tableau-card{
    min-height:calc(100dvh - 145px);
}
.session-focus-mode .system-status>span{
    display:block;
    max-height:2.8em;
    overflow:hidden;
}
.session-focus-mode .attack-history-panel{
    display:none;
}
.session-focus-mode .attack-section-title{
    font-size:.76rem;
    margin:.35rem 0 .18rem;
}
.session-focus-mode .permanence{
    max-height:210px;
    overflow:auto;
}

/* Bedienung auf kleinen Screens */
@media(max-width:900px){
    .attack-card-compact{
        grid-template-columns:minmax(0,1fr) auto;
    }
    .attack-card-compact .attack-confirm-btn{
        grid-column:1/-1;
        width:100%;
    }
    .session-focus-mode .session-core-workspace{
        grid-template-columns:1fr;
        grid-template-areas:
            "attack"
            "perma"
            "tableau";
    }
    .session-focus-mode .permanence-card{
        position:static;
    }
    .session-focus-mode .tableau-card{
        min-height:0;
    }
}
@media(max-width:620px){
    .session-view-controls{
        display:flex;
        flex-wrap:wrap;
        justify-content:flex-start;
    }
    .session-view-controls .compact-control{
        flex:0 1 auto;
    }
    .attack-card-compact{
        grid-template-columns:1fr auto;
        gap:.35rem .45rem;
    }
    .attack-card-compact .attack-compact-main{
        gap:.3rem;
    }
    .attack-meta-chip{
        font-size:.68rem;
        padding:.15rem .34rem;
    }
    .session-log-entry{
        grid-template-columns:28px 1fr;
    }
    .session-log-entry time{
        grid-column:2;
    }
    .bet-correction-dialog,
    .session-log-dialog{
        width:100vw;
        max-width:none;
        height:100dvh;
        max-height:none;
        border:0;
        border-radius:0;
    }
}


/* ---------------------------------------------------------------
 * v1.0.2: Tableau-Größenwahl
 * Standardwert bei jedem neuen Aufruf: Flach.
 * --------------------------------------------------------------- */
.session-view-controls .tableau-size-control{
    display:flex;
    align-items:center;
    gap:.4rem;
}
.session-view-controls .tableau-size-control>span{
    color:var(--muted);
    font-size:.78rem;
    font-weight:800;
}
.session-view-controls .tableau-size-control select{
    width:auto;
    min-height:36px;
    padding:.35rem 2rem .35rem .65rem;
}
@media(max-width:620px){
    .session-view-controls .tableau-size-control{
        flex:1 1 150px;
    }
    .session-view-controls .tableau-size-control select{
        flex:1 1 auto;
        min-width:0;
    }
}


/* v1.0.3: klassische Angriffsdarstellung */
.attack-card{
    display:grid;
    grid-template-columns:1fr auto;
    gap:.3rem 1rem;
    align-items:center;
    background:#0d1512;
    border:1px solid var(--line);
    border-radius:.75rem;
    padding:.75rem;
}
.attack-card>div:first-child{
    display:flex;
    flex-direction:column;
    gap:.15rem;
}
.attack-card small{color:var(--muted)}
.attack-stake{
    grid-row:1/3;
    grid-column:2;
    display:flex;
    align-items:baseline;
    gap:.3rem;
}
.attack-stake strong{
    font-size:1.65rem;
    color:#9ee0bd;
}
.total-stake{
    padding:.7rem;
    border-top:1px solid var(--line);
    text-align:right;
}
.attack-card.pending .attack-confirm-btn{
    margin-top:.2rem;
    justify-self:start;
}
.attack-confirm-btn{
    padding:.6rem .8rem;
}


/* ---------------------------------------------------------------
 * v1.0.4: Test-/Echtspiel und regelabhängige Optionen
 * --------------------------------------------------------------- */
.session-play-type-choice{
    border-color:rgba(121,223,170,.22);
}
.session-play-type-choice .real-play-option{
    border-color:rgba(229,184,96,.2);
}
.session-play-type-choice
.real-play-option:has(input:checked){
    border-color:rgba(229,184,96,.65);
    background:rgba(229,184,96,.08);
}
.session-list-toolbar{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:1rem;
    margin:0 0 1rem;
    padding:.75rem .9rem;
    border:1px solid var(--line);
    border-radius:.85rem;
    background:rgba(15,28,22,.72);
}
.session-list-toolbar label{
    display:grid;
    gap:.3rem;
    margin:0;
}
.session-list-toolbar label>span{
    color:var(--muted);
    font-size:.8rem;
    font-weight:800;
}
.session-list-toolbar select{
    min-width:220px;
}
.play-type-badge{
    display:inline-flex;
    align-items:center;
    padding:.28rem .55rem;
    border-radius:999px;
    font-size:.75rem;
    font-weight:850;
    border:1px solid var(--line);
}
.play-type-badge.test{
    color:#a9cdf5;
    border-color:rgba(116,165,222,.35);
    background:rgba(116,165,222,.09);
}
.play-type-badge.real{
    color:#f0cd89;
    border-color:rgba(229,184,96,.38);
    background:rgba(229,184,96,.1);
}
.play-type-badge.unassigned{
    color:var(--muted);
    background:rgba(255,255,255,.03);
}
@media(max-width:650px){
    .session-list-toolbar{
        align-items:stretch;
        flex-direction:column;
    }
    .session-list-toolbar select{
        width:100%;
        min-width:0;
    }
}


/* ---------------------------------------------------------------
 * v1.0.6: Konditionale Session-Optionen zuverlässig ausblenden
 * --------------------------------------------------------------- */
#laRemiseOption[hidden],
#zeroRuleField[hidden]{
    display:none !important;
}


/* ---------------------------------------------------------------
 * v1.0.8: IQ-Pro System-Hopping
 * --------------------------------------------------------------- */
.iq-hopping-notice{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin:.8rem 0;
    padding:.8rem .9rem;
    border:1px solid rgba(121,223,170,.34);
    border-radius:.8rem;
    background:rgba(121,223,170,.07);
}
.iq-hopping-notice[hidden]{
    display:none !important;
}
.iq-hopping-notice>div{
    display:grid;
    gap:.15rem;
}
.iq-hopping-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin-top:.8rem;
    padding:.75rem .85rem;
    border:1px dashed rgba(121,223,170,.28);
    border-radius:.8rem;
    background:rgba(12,26,20,.7);
}
.iq-hopping-session-button{
    text-decoration:none;
}
.iq-return-to-session{
    flex:0 0 auto;
    white-space:nowrap;
    text-decoration:none;
}
@media(max-width:700px){
    .iq-hopping-notice{
        align-items:stretch;
        flex-direction:column;
    }
    .iq-return-to-session{
        width:100%;
        white-space:normal;
        text-align:center;
    }
    .iq-hopping-actions{
        align-items:stretch;
        flex-direction:column;
    }
    .iq-hopping-actions button{
        width:100%;
    }
}


/* ---------------------------------------------------------------
 * v1.0.10: Mobile Fokusansicht + Letzte-Zahl-Markierung
 * --------------------------------------------------------------- */


/* Mobile Fokusansicht */
@media(max-width:700px){
    body.session-focus-mode{
        width:100%;
        max-width:100%;
        overflow-x:hidden;
    }

    .session-focus-mode .roulette-page{
        width:100%;
        max-width:100%;
        min-width:0;
        padding-left:.45rem;
        padding-right:.45rem;
        overflow-x:hidden;
    }

    .session-focus-mode .session-control-bar{
        position:static;
        top:auto;
        display:grid;
        grid-template-columns:1fr;
        width:100%;
        min-width:0;
        gap:.45rem;
        padding:.45rem;
    }

    .session-focus-mode .session-control-actions,
    .session-focus-mode .session-view-controls{
        display:grid;
        grid-template-columns:
            repeat(2,minmax(0,1fr));
        width:100%;
        min-width:0;
        gap:.4rem;
    }

    .session-focus-mode
    .session-control-actions > *,
    .session-focus-mode
    .session-view-controls > *{
        min-width:0;
        max-width:100%;
    }

    .session-focus-mode
    .iq-hopping-session-button{
        grid-column:1/-1;
        width:100%;
        white-space:normal;
        text-align:center;
    }

    .session-focus-mode
    .tableau-size-control{
        grid-column:1/-1;
        width:100%;
    }

    .session-focus-mode
    .tableau-size-control select{
        width:100%;
        min-width:0;
    }

    .session-focus-mode
    .session-core-workspace{
        display:flex;
        flex-direction:column;
        width:100%;
        min-width:0;
        max-width:100%;
        gap:.45rem;
    }

    .session-focus-mode
    .session-core-workspace > *{
        width:100%;
        min-width:0;
        max-width:100%;
    }

    .session-focus-mode #systemStatus{
        order:1;
        width:100%;
        min-width:0;
    }

    .session-focus-mode .permanence-card{
        order:2;
        position:static;
        top:auto;
        width:100%;
        min-width:0;
    }

    .session-focus-mode .roulette-layout{
        order:3;
        display:block !important;
        width:100%;
        min-width:0;
        max-width:100%;
        overflow:visible;
    }

    .session-focus-mode .tableau-card{
        width:100%;
        min-width:0;
        max-width:100%;
        min-height:0;
        padding:.5rem;
        overflow:hidden;
    }

    .session-focus-mode
    .tableau-card .tableau-body{
        width:100%;
        min-width:0;
        max-width:100%;
        overflow:hidden;
    }

    .session-focus-mode
    .tableau-card[data-tableau-size="flat"]
    .roulette-grid{
        width:100%;
        min-width:0;
        max-width:100%;
    }

    .session-focus-mode .permanence{
        width:100%;
        max-width:100%;
        max-height:none;
        overflow-x:auto;
        overflow-y:hidden;
        -webkit-overflow-scrolling:touch;
    }

    .session-focus-mode .permanence-last-hint{
        width:auto;
        justify-content:flex-start;
    }

    .session-focus-mode .attack-card{
        grid-template-columns:
            minmax(0,1fr) auto;
        width:100%;
        min-width:0;
        gap:.35rem .55rem;
    }

    .session-focus-mode
    .attack-card > div:first-child{
        min-width:0;
    }

    .session-focus-mode
    .attack-card b,
    .session-focus-mode
    .attack-card small{
        overflow-wrap:anywhere;
    }

    .session-focus-mode
    .system-status>span{
        max-height:none;
        overflow:visible;
    }
}

@media(max-width:430px){
    .session-focus-mode .compact-control{
        width:100%;
        padding:.5rem .4rem;
        font-size:.78rem;
        white-space:normal;
    }

    .session-focus-mode
    .feedback-settings-top{
        min-width:0;
        width:100%;
    }

    .session-focus-mode
    .feedback-settings-top[open]{
        min-width:0;
        width:100%;
        grid-column:1/-1;
    }

    .session-focus-mode .tableau-card{
        padding:.38rem;
    }

    .session-focus-mode
    .tableau-card[data-tableau-size="flat"]
    .roulette-grid{
        grid-template-columns:
            26px
            repeat(12,minmax(0,1fr));
        grid-template-rows:
            repeat(3,32px);
        gap:1px;
    }

    .session-focus-mode
    .tableau-card[data-tableau-size="flat"]
    .roulette-number{
        height:32px;
        font-size:.68rem;
    }
}


/* ---------------------------------------------------------------
 * v1.0.13: Letzte-Zahl-Hinweis auch in IQ-Permanenz
 * --------------------------------------------------------------- */
.iq-permanence-hint-row{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    min-height:1.35rem;
    margin:.2rem 0 .15rem;
    padding-left:.15rem;
}
.iq-permanence-hint-row
.permanence-last-hint[hidden]{
    display:none !important;
}
@media(max-width:700px){
    .iq-permanence-hint-row{
        min-height:1.25rem;
        margin:.15rem 0 .1rem;
    }
}


/* ---------------------------------------------------------------
 * v1.0.14: Mindestbestand und Finanzfortführung beim System-Hopping
 * --------------------------------------------------------------- */
.system-budget-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin:1rem 0;
    padding:.8rem .9rem;
    border:1px solid var(--line);
    border-radius:.85rem;
    background:rgba(17,31,25,.72);
}
.system-budget-bar>div{
    display:grid;
    gap:.12rem;
}
.system-budget-bar label{
    display:flex;
    align-items:center;
    gap:.45rem;
    margin:0;
    min-width:150px;
}
.system-budget-bar input{
    margin:0;
    width:105px;
    text-align:right;
    font-weight:850;
}
.minimum-bankroll-badge{
    background:rgba(229,184,96,.10);
    border:1px solid rgba(229,184,96,.30);
    color:#f0cd89;
}
.handoff-finance-summary{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.55rem;
    margin:.75rem 0 1rem;
}
.handoff-finance-summary[hidden]{
    display:none !important;
}
.handoff-finance-summary>div{
    display:grid;
    gap:.2rem;
    padding:.7rem .8rem;
    border:1px solid var(--line);
    border-radius:.75rem;
    background:#0f1814;
}
.handoff-finance-summary span{
    color:var(--muted);
    font-size:.78rem;
}
.handoff-finance-summary strong{
    font-size:1.15rem;
}
@media(max-width:650px){
    .system-budget-bar{
        align-items:stretch;
        flex-direction:column;
    }
    .system-budget-bar label{
        width:100%;
        justify-content:flex-start;
    }
    .handoff-finance-summary{
        grid-template-columns:1fr;
    }
}

/* v1.0.15: Kundenliste und Ablaufübersicht klar getrennt */
.customer-list-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin:1.2rem 0 .7rem;
}
.customer-list-heading h2{
    margin:.15rem 0 0;
}


/* ---------------------------------------------------------------
 * v1.0.18: steuerbare IQ-Quellenreihenfolge
 * --------------------------------------------------------------- */
.iq-sequence-order-field{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:1rem;
    margin:.8rem 0;
    padding:.75rem .9rem;
    border:1px solid var(--line);
    border-radius:.8rem;
    background:rgba(10,22,17,.62);
}
.iq-sequence-order-field label{
    display:grid;
    gap:.35rem;
    margin:0;
    min-width:min(420px,100%);
}
.iq-sequence-order-field select{
    min-width:320px;
    max-width:100%;
}
.iq-sequence-order-field small{
    max-width:460px;
    line-height:1.35;
}
@media(max-width:760px){
    .iq-sequence-order-field{
        align-items:stretch;
        flex-direction:column;
    }
    .iq-sequence-order-field label,
    .iq-sequence-order-field select{
        width:100%;
        min-width:0;
    }
}


/* v1.0.19: Passwort-Reset Diagnose */
.password-reset-note{
    margin-top:1rem;
    font-size:.82rem;
    line-height:1.5;
}
.password-reset-diagnostic{
    margin-top:.75rem;
    overflow-wrap:anywhere;
}

/* v1.1.0 – IQ nachvollziehbar + gespeicherte Permanenz-Sitzungen */
.iq-session-manager,
.iq-calculation-rules {
  border:1px solid var(--border, #2d443b);
  border-radius:16px;
  padding:16px;
  margin:14px 0;
  background:rgba(255,255,255,.018);
}
.iq-session-manager-head,
.iq-calculation-rules,
.iq-session-actions,
.iq-session-load,
.iq-result-actions,
.iq-ranking-actions {
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.iq-session-manager-head { justify-content:space-between; }
.iq-session-manager-head > div:first-child,
.iq-calculation-rules > div:first-child { display:grid; gap:3px; }
.iq-session-meta-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:14px 0;
}
.iq-session-load select { min-width:240px; }
.iq-calculation-rules { align-items:end; }
.iq-calculation-rules > div:first-child { margin-right:auto; }
.iq-validation-inline {
  display:grid;
  gap:3px;
  margin:10px 0 12px;
}
.iq-validation-inline small { color:var(--muted, #9fb2aa); }
.iq-result-actions { align-items:stretch; }
.iq-result-actions button { flex:1 1 180px; }
.iq-ranking-actions { justify-content:flex-end; }
.iq-validation-box {
  display:grid;
  gap:5px;
  padding:12px 14px;
  margin-bottom:12px;
  border:1px solid var(--border, #2d443b);
  border-radius:12px;
  background:rgba(255,255,255,.02);
}
.iq-audit-table-wrap {
  width:100%;
  overflow:auto;
  border:1px solid var(--border, #2d443b);
  border-radius:12px;
}
.iq-audit-table {
  width:100%;
  min-width:1000px;
  border-collapse:collapse;
  font-size:.9rem;
}
.iq-audit-table th,
.iq-audit-table td {
  padding:9px 10px;
  border-bottom:1px solid var(--border, #2d443b);
  text-align:left;
  vertical-align:top;
}
.iq-audit-table th {
  position:sticky;
  top:0;
  z-index:1;
  background:var(--card, #14211c);
}
.iq-audit-hand td {
  text-align:center;
  font-weight:700;
  color:var(--muted, #9fb2aa);
}
.iq-audit-lines summary { cursor:pointer; font-weight:600; }
.iq-audit-lines ul { margin:7px 0 0 18px; padding:0; }
.iq-audit-lines li { margin:3px 0; }
@media (max-width:760px) {
  .iq-session-meta-grid { grid-template-columns:1fr; }
  .iq-session-load { width:100%; }
  .iq-session-load select { min-width:0; flex:1 1 180px; }
  .iq-calculation-rules { align-items:stretch; }
}
.dashboard-iq-sessions { margin:0 0 22px; }
.dashboard-iq-sessions .compact-grid { margin-top:10px; }
.iq-dashboard-card { display:grid; gap:8px; }
.iq-dashboard-card .iq-dashboard-meta { display:flex; gap:8px; flex-wrap:wrap; }

/* v1.1.0 UX-Fix: Quellenreihenfolge und verwendete Coupfolge zusammenhalten */
.iq-analysis-sequence-block{
    display:grid;
    gap:.2rem;
    margin:-.15rem 0 .8rem;
}
.iq-analysis-sequence-head{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:.75rem;
    padding:0 .15rem;
}
.iq-analysis-sequence-head strong{
    font-size:.92rem;
}
.iq-analysis-sequence-head small{
    text-align:right;
}
.iq-analysis-sequence-block .iq-permanence-hint-row{
    margin:0;
    min-height:1.15rem;
}
.iq-analysis-sequence-block .iq-permanence{
    margin:0;
}
@media(max-width:700px){
    .iq-analysis-sequence-head{
        align-items:flex-start;
        flex-direction:column;
        gap:.15rem;
    }
    .iq-analysis-sequence-head small{
        text-align:left;
    }
}
