:root{
 --bg:#050507;--panel:#0c0c11;--panel2:#111117;--line:rgba(255,255,255,.085);--line2:rgba(255,255,255,.14);
 --text:#f7f7fa;--muted:#8f8f9c;--indigo:#3f18c3;--magenta:#e72acc;--yellow:#ffc31f;--violet:#6f17c4;--orchid:#c450ea;--coral:#ff9068;
 --green:#53e39a;--red:#ff465a;--orange:#ff9b4a;--radius:20px;--shadow:0 24px 70px rgba(0,0,0,.42);
 --font:"Aeonik","Arial Narrow","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:var(--font);font-weight:400}button,input,select{font:inherit}button{color:inherit}body{overflow-x:hidden}.app{min-height:100vh;background:radial-gradient(circle at 80% -10%,rgba(231,42,204,.07),transparent 34%),radial-gradient(circle at 5% 105%,rgba(63,24,195,.09),transparent 36%),#050507}.glass{background:rgba(13,13,18,.76);backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px);border:1px solid var(--line2);box-shadow:var(--shadow)}[hidden]{display:none!important}

/* Login */
.login-view{position:fixed;inset:0;display:grid;place-items:center;padding:24px;z-index:5;overflow:hidden}.login-bg{position:fixed;inset:-15%;overflow:hidden;z-index:0;background:linear-gradient(120deg,#020204 18%,#12052d 46%,#3c1765 70%,#1d091a 100%);background-size:170% 170%;animation:bgDrift 18s ease-in-out infinite alternate}.login-bg:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 28% 28%,rgba(63,24,195,.52),transparent 29%),radial-gradient(circle at 68% 48%,rgba(231,42,204,.44),transparent 26%),radial-gradient(circle at 78% 12%,rgba(255,144,104,.32),transparent 25%),radial-gradient(circle at 22% 78%,rgba(255,195,31,.10),transparent 20%);filter:blur(20px);animation:aurora 22s ease-in-out infinite alternate}.login-bg i{position:absolute;border:1px solid rgba(255,255,255,.045);border-radius:50%;width:680px;height:680px;left:8%;top:8%;animation:ringOrbit 32s linear infinite}.login-bg i:nth-child(2){width:930px;height:930px;left:auto;right:-7%;top:15%;animation-duration:42s}.login-bg i:nth-child(3){width:480px;height:480px;left:42%;top:52%;animation-duration:27s;animation-direction:reverse}@keyframes bgDrift{to{background-position:100% 70%}}@keyframes aurora{0%{transform:translate3d(-3%,-2%,0) scale(1)}100%{transform:translate3d(4%,2%,0) scale(1.09)}}@keyframes ringOrbit{to{transform:rotate(360deg)}}
.login-card{position:relative;z-index:2;width:min(440px,92vw);padding:42px 42px 38px;border-radius:26px;background:linear-gradient(160deg,rgba(18,18,24,.88),rgba(5,5,8,.76));animation:loginRise .65s cubic-bezier(.2,.75,.25,1) both}@keyframes loginRise{from{opacity:0;transform:translateY(20px) scale(.985)}to{opacity:1;transform:none}}.login-logo{display:block;width:210px;height:auto;margin:0 auto 22px}.login-product{text-align:center;font-size:34px;letter-spacing:-.045em;font-weight:700}.login-copy{text-align:center;color:var(--muted);font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin:6px 0 34px}.access-field{display:block}.access-field span,label>span{display:block;color:#aaaab5;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin:0 0 8px}.access-field input,.field{width:100%;border:1px solid var(--line2);background:#09090d;color:#fff;border-radius:12px;padding:14px 15px;outline:none;transition:.2s}.access-field input{font-size:22px;text-align:center;letter-spacing:.35em;padding:16px}.access-field input:focus,.field:focus{border-color:rgba(231,42,204,.65);box-shadow:0 0 0 4px rgba(231,42,204,.08)}.login-enter{width:100%;margin-top:14px}.form-error{min-height:20px;color:#ff7583;text-align:center;font-size:12px;margin-top:10px}

/* Core */
.control-view{padding:16px;min-height:100vh;animation:controlIn .5s ease both}@keyframes controlIn{from{opacity:0;transform:scale(.995)}to{opacity:1;transform:none}}.topbar{height:70px;border:1px solid var(--line);background:rgba(9,9,12,.82);border-radius:18px;display:flex;align-items:center;padding:0 16px 0 18px;gap:20px;position:sticky;top:10px;z-index:20;backdrop-filter:blur(20px);box-shadow:0 12px 35px rgba(0,0,0,.28)}.brand-wrap{display:flex;align-items:center;gap:16px;min-width:270px}.top-logo{width:126px;height:auto}.product-name{font-weight:700;font-size:18px;letter-spacing:-.03em;padding-left:15px;border-left:1px solid var(--line2)}.top-statuses{display:flex;gap:8px;flex:1}.status-pill{border:1px solid var(--line);background:#0c0c11;border-radius:999px;padding:8px 11px;display:flex;align-items:center;gap:8px;color:#a9a9b4;font-size:10px;font-weight:700;letter-spacing:.08em}.status-dot{width:7px;height:7px;border-radius:50%;background:#666;display:inline-block;box-shadow:0 0 0 3px rgba(255,255,255,.03)}.status-dot.online{background:var(--green);box-shadow:0 0 11px rgba(83,227,154,.5)}.status-pill.audio .status-dot{background:#6d7eff}.top-right{display:flex;align-items:center;gap:10px}.closing-mini{min-width:132px;text-align:right;padding-right:13px;border-right:1px solid var(--line)}.closing-mini small,.clock small{display:block;color:#777783;font-size:9px;letter-spacing:.12em}.closing-mini strong{font-size:15px}.clock{min-width:78px}.clock strong{display:block;font-size:15px}.icon-btn{border:1px solid var(--line);background:#101015;border-radius:10px;min-width:38px;height:38px;cursor:pointer;transition:.2s}.icon-btn:hover{border-color:var(--line2);background:#17171e;transform:translateY(-1px)}.icon-btn.admin-active{border-color:rgba(231,42,204,.45);box-shadow:inset 0 0 24px rgba(231,42,204,.12)}
.upper-grid{display:grid;grid-template-columns:1.15fr 1.35fr .9fr;gap:14px;margin-top:14px}.lower-grid{display:grid;grid-template-columns:.92fr 1.48fr;gap:14px;margin-top:14px;height:calc(100vh - 357px);min-height:470px}.panel{background:linear-gradient(150deg,rgba(15,15,20,.96),rgba(8,8,11,.98));border:1px solid var(--line);border-radius:var(--radius);padding:18px;position:relative;overflow:hidden;box-shadow:0 14px 36px rgba(0,0,0,.18)}.panel:before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.11),transparent);pointer-events:none}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:10px}.eyebrow{font-size:9px;letter-spacing:.16em;color:#797985;font-weight:700}.panel h2{font-size:18px;line-height:1;margin:4px 0 0;letter-spacing:-.03em}.badge{padding:6px 9px;border-radius:999px;background:#16161d;color:#b4b4bf;font-size:9px;font-weight:800;letter-spacing:.08em;border:1px solid var(--line)}.badge.live{color:var(--green);border-color:rgba(83,227,154,.22);background:rgba(83,227,154,.05)}.badge.danger{color:#fff;background:rgba(255,70,90,.2);border-color:rgba(255,70,90,.48)}.badge.muted{color:#686874}.btn{border:1px solid var(--line2);background:#121218;border-radius:11px;padding:11px 15px;font-size:10px;font-weight:800;letter-spacing:.08em;cursor:pointer;transition:.18s}.btn:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.2)}.btn-primary{border:0;background:linear-gradient(105deg,var(--indigo),var(--magenta) 68%,var(--coral));box-shadow:0 10px 28px rgba(111,23,196,.24)}.btn-ghost{background:#101015}.btn-danger{border-color:rgba(255,70,90,.4);background:rgba(255,70,90,.13);color:#ff7180}.btn.big{padding:12px 20px}.btn.full{width:100%;margin-top:8px}.text-btn{border:0;background:transparent;color:#9797a3;font-size:9px;font-weight:800;letter-spacing:.1em;cursor:pointer}.text-btn.danger{color:#ff6676}.mini-action{border:1px solid var(--line);background:#111117;color:#b5b5bf;border-radius:8px;padding:7px 9px;font-size:9px;cursor:pointer}

/* timer */
.timer-panel{min-height:250px}.timer-display{font-size:72px;font-weight:700;letter-spacing:-.055em;line-height:.92;margin:10px 0 12px;font-variant-numeric:tabular-nums}.preset-row{display:flex;gap:6px;flex-wrap:wrap}.preset{border:1px solid var(--line);background:#0d0d12;color:#9a9aa6;border-radius:8px;padding:7px 9px;font-size:9px;cursor:pointer}.preset.active{border-color:rgba(231,42,204,.42);color:#fff;background:rgba(231,42,204,.08)}.timer-manual{display:flex;align-items:flex-end;gap:7px;margin-top:10px}.timer-manual label{width:62px}.timer-manual input{width:100%;background:#08080c;border:1px solid var(--line);border-radius:8px;color:#fff;padding:7px 8px}.timer-manual>span{padding-bottom:8px;color:#6e6e79}.timer-manual .btn{padding:8px 10px}.timer-actions{display:flex;gap:8px;margin-top:12px}.timer-panel.warning{border-color:rgba(255,155,74,.45);box-shadow:0 0 35px rgba(255,155,74,.08)}.timer-panel.warning .timer-display{color:#ffb06d}.timer-panel.expired{border-color:rgba(255,70,90,.7);animation:dangerPulse 1s ease-in-out infinite;box-shadow:0 0 46px rgba(255,70,90,.15)}.timer-panel.expired:after{content:"FAHRT BEENDEN";position:absolute;right:18px;bottom:18px;color:rgba(255,70,90,.2);font-size:34px;font-weight:900;letter-spacing:-.05em;pointer-events:none}.timer-panel.expired .timer-display{color:#ff4e61}@keyframes dangerPulse{0%,100%{background:linear-gradient(150deg,#130b0e,#09090d)}50%{background:linear-gradient(150deg,#2b0c13,#0c090b)}}

/* alerts */
.alert-panel{min-height:250px}.alert-list{display:flex;flex-direction:column;gap:8px;max-height:194px;overflow:auto;padding-right:2px}.no-alert{height:145px;border:1px dashed var(--line);border-radius:14px;display:flex;align-items:center;justify-content:center;gap:12px;color:#8d8d99}.no-alert strong{display:block;color:#c6c6cf;font-size:13px}.no-alert small{display:block;margin-top:3px;font-size:10px}.alert-item{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;border:1px solid var(--line);background:#0d0d12;border-radius:12px;padding:10px}.alert-item .alert-icon{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;font-weight:900;background:#17171d}.alert-item strong{display:block;font-size:11px;letter-spacing:.02em}.alert-item span{display:block;color:#898995;font-size:10px;margin-top:3px}.alert-item.warning{border-color:rgba(255,195,31,.18)}.alert-item.warning .alert-icon{color:var(--yellow);background:rgba(255,195,31,.08)}.alert-item.high{border-color:rgba(255,144,104,.28)}.alert-item.high .alert-icon{color:var(--coral);background:rgba(255,144,104,.09)}.alert-item.critical{border-color:rgba(255,70,90,.48);box-shadow:inset 0 0 28px rgba(255,70,90,.04)}.alert-item.critical .alert-icon{color:#fff;background:var(--red);animation:smallPulse .9s infinite}.alert-ok{border:1px solid var(--line);background:#111117;color:#aaaab5;border-radius:8px;padding:7px;font-size:9px;cursor:pointer}@keyframes smallPulse{50%{box-shadow:0 0 20px rgba(255,70,90,.48)}}

/* operation */
.operation-panel{min-height:250px}.operation-big{border:1px solid var(--line);border-radius:14px;padding:11px 13px;margin-top:4px;background:linear-gradient(110deg,rgba(63,24,195,.06),rgba(231,42,204,.035))}.operation-big span{display:block;color:#8b8b97;font-size:9px;letter-spacing:.09em;text-transform:uppercase}.operation-big strong{display:block;font-size:29px;margin-top:2px;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.operation-list{margin-top:8px}.operation-list div{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:6px 1px;font-size:10px}.operation-list span{color:#777783}.stop-all{width:100%;margin-top:10px;border-color:rgba(255,70,90,.28);background:rgba(255,70,90,.07);color:#ff6877}.stop-all:hover{background:rgba(255,70,90,.12)}

/* music */
.music-panel,.jingle-panel{height:100%;min-height:0}.music-head{align-items:center}.source-tabs{background:#08080b;border:1px solid var(--line);border-radius:10px;padding:3px;display:flex}.source-tab{border:0;background:transparent;color:#6f6f7a;font-size:9px;font-weight:800;letter-spacing:.08em;padding:7px 10px;border-radius:7px;cursor:pointer}.source-tab.active{background:#191920;color:#fff;box-shadow:0 4px 10px rgba(0,0,0,.25)}.music-source{display:none;height:calc(100% - 43px);min-height:0}.music-source.active{display:flex;flex-direction:column;animation:sourceIn .25s ease both}@keyframes sourceIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.now-card{display:flex;gap:12px;align-items:center;border:1px solid var(--line);background:#0a0a0e;border-radius:14px;padding:10px}.cover-placeholder,.spotify-cover{width:58px;height:58px;border-radius:11px;background:linear-gradient(135deg,rgba(63,24,195,.22),rgba(231,42,204,.18));display:grid;place-items:center;overflow:hidden;flex:0 0 auto}.cover-placeholder img{width:42px;height:42px;object-fit:contain}.spotify-cover img{width:100%;height:100%;object-fit:cover}.spotify-cover>div{font-size:23px;font-weight:900;color:#1ed760}.now-copy{min-width:0}.now-copy small{display:block;color:#666673;font-size:8px;font-weight:800;letter-spacing:.12em}.now-copy strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.now-copy span{display:block;color:#8b8b96;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.progress-row{display:grid;grid-template-columns:34px 1fr 34px;gap:8px;align-items:center;margin:8px 2px 2px;color:#70707b;font-size:9px}.progress-row input,.volume-line input,.range-field input{accent-color:var(--magenta);width:100%}.player-controls{display:flex;justify-content:center;align-items:center;gap:10px;margin:7px 0}.round-btn,.play-btn{border:1px solid var(--line2);background:#111117;border-radius:50%;width:34px;height:34px;cursor:pointer}.round-btn.small{width:30px;height:30px;font-size:12px}.round-btn.active{color:var(--magenta);border-color:rgba(231,42,204,.4)}.play-btn{width:42px;height:42px;background:linear-gradient(135deg,var(--indigo),var(--magenta));border:0;box-shadow:0 8px 20px rgba(111,23,196,.23)}.volume-line{display:grid;grid-template-columns:26px 1fr 38px;gap:8px;align-items:center;color:#777783;font-size:9px;margin-bottom:7px}.volume-line strong{text-align:right;color:#a6a6b1}.category-row{display:flex;gap:5px;overflow-x:auto;padding:5px 0 7px;scrollbar-width:none}.category-row::-webkit-scrollbar{display:none}.cat-wrap{position:relative;display:inline-flex}.cat-chip{white-space:nowrap;border:1px solid var(--line);background:#0b0b10;color:#868692;border-radius:999px;padding:7px 10px;font-size:8px;font-weight:800;letter-spacing:.07em;cursor:pointer}.cat-chip.active{color:#fff;border-color:rgba(196,80,234,.35);background:rgba(196,80,234,.08)}.cat-edit{border:0;background:#17171e;color:#7e7e8a;border-radius:50%;width:19px;height:19px;font-size:8px;position:absolute;right:-3px;top:-5px;cursor:pointer}.library-top{display:flex;justify-content:space-between;align-items:center;color:#72727d;font-size:9px;padding:3px 1px 6px}.track-list{overflow:auto;min-height:0;flex:1;border-top:1px solid var(--line);padding-top:5px}.track-row{display:grid;grid-template-columns:27px 1fr 28px auto;align-items:center;gap:7px;padding:8px 5px;border-bottom:1px solid rgba(255,255,255,.045);border-radius:8px;cursor:default}.track-row:hover{background:#0f0f14}.track-row.active{background:rgba(111,23,196,.08)}.track-index{color:#555560;font-size:9px}.track-row div{min-width:0}.track-row strong{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-row div span{display:block;color:#757581;font-size:9px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-play,.track-edit{border:0;background:transparent;color:#8c8c98;cursor:pointer}.library-empty{padding:20px;text-align:center;color:#666673;font-size:10px}
.spotify-connect-card{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed rgba(30,215,96,.2);border-radius:16px;background:radial-gradient(circle at 50% 38%,rgba(30,215,96,.06),transparent 28%)}.spotify-orb{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#1ed760;color:#050705;font-size:25px;font-weight:900;box-shadow:0 0 30px rgba(30,215,96,.18)}.spotify-connect-card strong{margin-top:12px}.spotify-connect-card p{color:#81818d;font-size:10px;max-width:300px;text-align:center;line-height:1.5}.spotify-btn{background:#1ed760;color:#061109;border-color:#1ed760}.spotify-btn:disabled{filter:grayscale(1);opacity:.4;cursor:not-allowed}.spotify-state-line{display:flex;align-items:center;gap:8px;color:#8a8a96;font-size:9px;margin-bottom:8px}.spotify-state-line .text-btn{margin-left:auto}.inline-note{border:1px solid rgba(255,195,31,.18);background:rgba(255,195,31,.05);color:#bcae78;border-radius:9px;padding:8px;font-size:9px;margin-top:7px}

/* jingle */
.jingle-head{align-items:center}.jingle-master{display:grid;grid-template-columns:10px 76px 10px 76px;gap:5px;align-items:center;font-size:8px;color:#6f6f7b}.jingle-master i{height:5px;background:#17171d;border-radius:999px;overflow:hidden}.jingle-master b{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--indigo),var(--magenta),var(--yellow));transition:width .06s linear}.bank-row{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding-bottom:9px}.bank-tabs{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none;flex:1}.bank-tabs::-webkit-scrollbar{display:none}.bank-wrap{position:relative;flex:0 0 auto}.bank-tab{border:1px solid var(--line);background:#0b0b10;color:#868692;border-radius:9px;padding:8px 12px;font-size:9px;font-weight:800;cursor:pointer}.bank-tab.active{color:#fff;background:linear-gradient(110deg,rgba(63,24,195,.18),rgba(231,42,204,.09));border-color:rgba(111,23,196,.38)}.bank-edit{position:absolute;right:-4px;top:-5px;border:0;background:#1a1a21;color:#888895;width:19px;height:19px;border-radius:50%;font-size:8px;cursor:pointer}.bank-plus{border:1px solid var(--line);background:#101015;border-radius:9px;width:34px;height:34px;cursor:pointer}.pad-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:10px;overflow:auto;align-content:start;max-height:calc(100% - 80px);padding:1px}.jingle-pad{min-height:105px;border:1px solid var(--line);background:linear-gradient(150deg,#111117,#0a0a0e);border-radius:14px;padding:13px;position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;cursor:pointer;overflow:hidden;transition:.16s}.jingle-pad:hover{border-color:rgba(196,80,234,.32);transform:translateY(-1px);background:linear-gradient(150deg,#14141b,#0b0b10)}.jingle-pad:before{content:"";position:absolute;width:70px;height:70px;border-radius:50%;right:-28px;top:-32px;background:radial-gradient(circle,rgba(111,23,196,.22),transparent 66%)}.jingle-pad .pad-number{position:absolute;left:12px;top:10px;color:#575763;font-size:9px}.jingle-pad strong{font-size:13px;max-width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.jingle-pad span{font-size:8px;color:#696975;margin-top:4px;letter-spacing:.08em}.jingle-pad>i{position:absolute;left:0;right:0;bottom:0;height:2px;background:transparent}.jingle-pad.playing{border-color:rgba(231,42,204,.62);box-shadow:inset 0 0 34px rgba(231,42,204,.11),0 0 20px rgba(111,23,196,.09)}.jingle-pad.playing>i{background:linear-gradient(90deg,var(--indigo),var(--magenta),var(--coral));animation:padLine 1.2s linear infinite;background-size:200% 100%}.jingle-pad.playing span{color:#db67c9}@keyframes padLine{to{background-position:200% 0}}.pad-admin{position:absolute;right:8px;top:8px;display:flex;gap:4px;opacity:0;transition:.15s}.jingle-pad.admin:hover .pad-admin{opacity:1}.pad-admin button{border:1px solid var(--line);background:#17171e;color:#a0a0ab;width:25px;height:25px;border-radius:7px;cursor:pointer}.jingle-pad.dragging{opacity:.35}.add-pad{border-style:dashed;align-items:center;justify-content:center;color:#777783}.add-pad b{font-size:23px;color:#a54bd9;margin-bottom:6px}.empty-box{height:70%;display:grid;place-items:center;align-content:center;color:#73737e;text-align:center}.empty-box strong{color:#a7a7b1;font-size:14px}.empty-box span{font-size:10px;margin-top:5px}

/* modal / drawer */
.modal-backdrop{position:fixed;inset:0;background:rgba(1,1,3,.68);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:60;display:grid;place-items:center;padding:22px;opacity:0;transition:.15s}.modal-backdrop.open{opacity:1}.modal{width:min(430px,94vw);border-radius:21px;padding:25px;position:relative;transform:translateY(10px) scale(.985);transition:.18s}.modal-backdrop.open .modal{transform:none}.modal.wide{width:min(650px,94vw)}.modal h3{font-size:23px;margin:5px 0 8px;letter-spacing:-.04em}.modal p{color:#868692;font-size:11px;line-height:1.5}.modal-close{position:absolute;right:13px;top:13px;border:1px solid var(--line);background:#131319;color:#aaaab4;width:32px;height:32px;border-radius:9px;cursor:pointer}.modal form>label{display:block;margin-top:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.range-field{display:flex;align-items:center;gap:10px;min-height:44px}.range-field strong{font-size:11px;width:43px;text-align:right}.upload-zone{border:1px dashed rgba(196,80,234,.28);background:rgba(111,23,196,.035);border-radius:13px;padding:15px;cursor:pointer}.upload-zone input{display:none}.upload-zone b{display:block;font-size:11px}.upload-zone span{display:block;text-transform:none;letter-spacing:0;margin-top:4px;color:#73737f;font-size:9px}.modal-actions{display:grid;grid-template-columns:auto 1fr auto auto;gap:8px;align-items:center;margin-top:18px}.settings-drawer{position:fixed;top:0;right:0;bottom:0;width:min(430px,94vw);z-index:55;background:rgba(8,8,11,.97);border-left:1px solid var(--line2);box-shadow:-30px 0 70px rgba(0,0,0,.48);transform:translateX(100%);transition:.22s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column;backdrop-filter:blur(30px)}.settings-drawer.open{transform:none}.drawer-head{padding:20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:flex-start}.drawer-head h2{margin:4px 0 0;font-size:22px;letter-spacing:-.04em}.drawer-scroll{padding:0 20px 20px;overflow:auto;flex:1}.drawer-scroll section{padding:20px 0;border-bottom:1px solid var(--line)}.drawer-scroll h3{font-size:12px;margin:0 0 12px}.drawer-scroll label{display:block;margin-top:10px}.settings-note{font-size:9px;color:#777783;line-height:1.55}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px}.drawer-foot{padding:15px 20px;border-top:1px solid var(--line);background:#09090d}

/* misc */
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;z-index:90;background:#17171e;border:1px solid var(--line2);border-radius:11px;padding:10px 14px;color:#d1d1d8;font-size:10px;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.bad{border-color:rgba(255,70,90,.35);color:#ff8290}.loading-overlay{position:fixed;inset:0;z-index:100;background:rgba(4,4,6,.82);backdrop-filter:blur(18px);display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center}.loading-overlay img{width:64px;height:70px;object-fit:contain;animation:markLoad 1.45s cubic-bezier(.55,.1,.45,.9) infinite}.loading-overlay span{font-size:11px;color:#9494a0;letter-spacing:.14em}@keyframes markLoad{0%,100%{transform:rotate(-5deg) scale(.96);filter:drop-shadow(0 0 0 transparent)}50%{transform:rotate(5deg) scale(1.05);filter:drop-shadow(0 0 20px rgba(231,42,204,.35))}}.callback-page{min-height:100vh;background:#050507}.callback-loader{display:flex}.callback-error .callback-loader span{color:#ff7180}
::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-thumb{background:#22222a;border-radius:999px}::-webkit-scrollbar-track{background:transparent}

@media(max-width:1250px){.top-statuses{display:none}.upper-grid{grid-template-columns:1fr 1fr}.operation-panel{grid-column:1/-1}.lower-grid{grid-template-columns:1fr;height:auto}.music-panel,.jingle-panel{min-height:600px}.closing-mini{display:none}}
@media(max-width:760px){.control-view{padding:8px}.topbar{height:auto;min-height:64px;flex-wrap:wrap;padding:10px;top:4px}.brand-wrap{min-width:0;flex:1}.top-logo{width:108px}.product-name{font-size:15px}.clock{display:none}.upper-grid{grid-template-columns:1fr}.operation-panel{grid-column:auto}.lower-grid{display:block}.music-panel,.jingle-panel{height:auto;min-height:660px;margin-top:10px}.pad-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none}.timer-display{font-size:64px}.form-grid{grid-template-columns:1fr}.jingle-master{display:none}.login-card{padding:32px 24px}.modal-actions{grid-template-columns:auto 1fr;}.modal-actions .btn{grid-column:auto}.top-right{gap:5px}.top-right .icon-btn{min-width:35px}.closing-mini{display:none}}

/* ==========================================================================\n   RideControl 2.1 – Operator Panel UI\n   Groß, kontrastreich, aus Distanz lesbar und haptischer als v2.0.\n   ========================================================================== */
:root{
  --radius:22px;
  --font:"Aeonik","Segoe UI Variable Display","Segoe UI",Arial,sans-serif;
}
html{font-size:16px}
body{font-family:var(--font);font-stretch:normal}

/* Login – größer und komplett deutsch */
.login-card{width:min(620px,92vw);padding:58px 62px 52px;border-radius:32px;border-width:2px}
.login-logo{width:300px;margin-bottom:28px}
.login-product{font-size:52px;line-height:1;letter-spacing:-.045em}
.login-copy{font-size:15px;letter-spacing:.1em;margin:12px 0 38px;text-transform:none}
.access-field span,label>span{font-size:13px;letter-spacing:.11em;margin-bottom:10px}
.access-field input{font-family:"Segoe UI",Arial,sans-serif;font-size:32px;min-height:72px;border-radius:16px;border-width:2px}
.login-enter{min-height:66px;font-size:14px;margin-top:18px;border-radius:15px}
.form-error{font-size:14px}

/* Gesamtrahmen */
.control-view{padding:18px 20px 22px}
.topbar{height:86px;border-radius:20px;padding:0 20px 0 22px;gap:24px;border-width:2px;top:8px}
.brand-wrap{min-width:340px;gap:20px}.top-logo{width:165px}.product-name{font-size:24px;padding-left:20px}
.top-statuses{gap:10px}.status-pill{font-size:12px;padding:10px 14px;border-width:2px}.status-dot{width:10px;height:10px}
.closing-mini{min-width:175px}.closing-mini small,.clock small{font-size:11px}.closing-mini strong,.clock strong{font-size:20px}
.clock{min-width:105px}.icon-btn{min-width:48px;height:48px;border-radius:13px;font-size:20px;border-width:2px}

/* Panel-Chassis: eher Bedienpult als Dashboard */
.upper-grid{grid-template-columns:1.12fr 1.02fr .86fr;gap:16px;margin-top:16px;min-height:330px}
.lower-grid{grid-template-columns:.82fr 1.28fr;gap:16px;margin-top:16px;height:calc(100vh - 470px);min-height:535px}
.panel{border:2px solid rgba(255,255,255,.105);border-radius:24px;padding:24px;background:linear-gradient(155deg,#111117 0%,#09090e 70%,#07070a 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),inset 0 -18px 30px rgba(0,0,0,.17),0 18px 42px rgba(0,0,0,.25)}
.panel:after{content:"";position:absolute;inset:9px;border:1px solid rgba(255,255,255,.025);border-radius:17px;pointer-events:none}
.panel-head{margin-bottom:16px}.eyebrow{font-size:12px;letter-spacing:.13em;color:#9b9ba7}.panel h2{font-size:27px;margin-top:6px}.badge{font-size:11px;padding:8px 12px;border-width:2px}

/* Hardware-artige Tasten */
.btn{min-height:48px;border-width:2px;border-radius:13px;padding:12px 18px;font-size:12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 4px 0 rgba(0,0,0,.45),0 10px 18px rgba(0,0,0,.16)}
.btn:active{transform:translateY(3px);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 1px 0 rgba(0,0,0,.5)}
.btn.big{min-height:58px;padding:14px 25px;font-size:14px}
.btn-primary{box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 4px 0 #451388,0 14px 28px rgba(111,23,196,.25)}
.btn-danger{font-size:15px;font-weight:900}

/* Fahrzeit – sehr groß und in normal proportionierten Ziffern */
.timer-panel{min-height:330px}
.timer-display{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif;font-size:clamp(98px,6.8vw,132px);font-weight:750;font-stretch:normal;letter-spacing:-.065em;line-height:.88;font-variant-numeric:tabular-nums lining-nums;margin:12px 0 20px;padding:12px 18px 16px;border:2px solid rgba(255,255,255,.075);border-radius:18px;background:linear-gradient(180deg,#050507,#0a0a0e);box-shadow:inset 0 10px 24px rgba(0,0,0,.6),inset 0 -1px 0 rgba(255,255,255,.04);text-shadow:0 0 24px rgba(255,255,255,.035)}
.preset-row{gap:10px}.preset{min-width:67px;min-height:44px;padding:9px 12px;border-radius:11px;border-width:2px;font-size:13px;box-shadow:0 3px 0 rgba(0,0,0,.45)}
.preset.active{border-color:rgba(231,42,204,.75);background:linear-gradient(180deg,rgba(231,42,204,.18),rgba(111,23,196,.1));box-shadow:inset 0 0 18px rgba(231,42,204,.09),0 3px 0 rgba(0,0,0,.45)}
.timer-manual{gap:10px;margin-top:15px}.timer-manual label{width:90px}.timer-manual input{font-family:"Segoe UI",Arial,sans-serif;font-size:19px;padding:10px 12px;border-width:2px;border-radius:11px}.timer-manual>span{font-size:25px;padding-bottom:7px}.timer-manual .btn{padding:10px 16px}.timer-actions{gap:11px;margin-top:16px}
.timer-panel.expired{border-color:rgba(255,70,90,.95);box-shadow:inset 0 0 55px rgba(255,34,61,.12),0 0 48px rgba(255,35,58,.19);animation:dangerPulseNew .75s ease-in-out infinite}
.timer-panel.expired:after{display:none}.timer-panel.expired .timer-display{color:#fff;background:linear-gradient(180deg,#36070d,#160509);border-color:rgba(255,79,98,.78);text-shadow:0 0 30px rgba(255,70,90,.52)}
@keyframes dangerPulseNew{0%,100%{border-color:rgba(255,70,90,.62)}50%{border-color:#ff4358;box-shadow:inset 0 0 65px rgba(255,35,58,.18),0 0 58px rgba(255,35,58,.27)}}

/* EIN einziges großes Signalfeld */
.signal-panel{min-height:330px;display:flex;flex-direction:column;justify-content:space-between;transition:border-color .2s,box-shadow .2s,background .2s}
.signal-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.signal-count{font-size:11px;color:#777784;letter-spacing:.08em}
.signal-body{flex:1;display:flex;align-items:center;justify-content:center;gap:26px;text-align:left;padding:16px 8px}
.signal-light{width:82px;height:82px;border-radius:50%;padding:12px;flex:0 0 auto;background:#050507;border:3px solid #292930;box-shadow:inset 0 8px 20px rgba(0,0,0,.8),0 5px 0 #030305}
.signal-light span{display:block;width:100%;height:100%;border-radius:50%;background:#4a4a51;box-shadow:inset 0 4px 8px rgba(255,255,255,.06),0 0 12px rgba(255,255,255,.03)}
.signal-copy{min-width:0}.signal-copy strong{display:block;font-size:clamp(32px,2.6vw,52px);line-height:.95;letter-spacing:-.045em}.signal-copy span{display:block;margin-top:12px;color:#9b9ba6;font-size:15px;line-height:1.35}
.signal-ack{width:100%;font-size:13px}
.signal-ok .signal-light span{background:#3ee894;box-shadow:inset 0 3px 10px rgba(255,255,255,.25),0 0 22px rgba(62,232,148,.62),0 0 56px rgba(62,232,148,.18)}
.signal-warning{border-color:rgba(255,195,31,.75);box-shadow:inset 0 0 50px rgba(255,195,31,.045),0 0 36px rgba(255,195,31,.08)}.signal-warning .signal-light span{background:#ffc31f;box-shadow:0 0 28px rgba(255,195,31,.78),0 0 65px rgba(255,195,31,.22)}.signal-warning .signal-copy strong{color:#ffd65c}
.signal-high{border-color:rgba(255,145,55,.82);box-shadow:inset 0 0 55px rgba(255,145,55,.06),0 0 38px rgba(255,145,55,.1)}.signal-high .signal-light span{background:#ff8d37;box-shadow:0 0 30px rgba(255,141,55,.82),0 0 70px rgba(255,141,55,.25)}.signal-high .signal-copy strong{color:#ffa75f}
.signal-critical{border-color:#ff4055;background:linear-gradient(150deg,#22090e,#0c080a 76%);animation:signalCritical .68s ease-in-out infinite}.signal-critical .signal-light span{background:#ff334b;box-shadow:0 0 36px rgba(255,51,75,.95),0 0 85px rgba(255,51,75,.42)}.signal-critical .signal-copy strong{color:#fff;text-shadow:0 0 25px rgba(255,50,72,.6)}.signal-critical .signal-copy span{color:#ff9ba7}
@keyframes signalCritical{0%,100%{box-shadow:inset 0 0 45px rgba(255,40,65,.09),0 0 28px rgba(255,40,65,.14)}50%{box-shadow:inset 0 0 90px rgba(255,40,65,.2),0 0 60px rgba(255,40,65,.3)}}

/* Betrieb */
.operation-panel{min-height:330px}.operation-big{padding:17px 18px;margin-top:7px;border-width:2px;border-radius:16px;background:linear-gradient(180deg,#07070a,#0d0d13);box-shadow:inset 0 8px 18px rgba(0,0,0,.5)}.operation-big span{font-size:12px}.operation-big strong{font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(34px,2.5vw,48px);font-variant-numeric:tabular-nums;letter-spacing:-.035em}.operation-list{margin-top:13px}.operation-list div{padding:10px 2px;font-size:12px}.operation-list strong{font-size:13px}.stop-all{min-height:54px;margin-top:15px;font-size:13px;border:2px solid rgba(255,70,90,.48);background:linear-gradient(180deg,rgba(82,12,22,.5),rgba(35,7,13,.72));color:#ff7887;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 4px 0 #21050a}

/* Musikplayer */
.music-panel,.jingle-panel{height:100%;min-height:0}.music-head{margin-bottom:15px}.source-tabs{padding:5px;border-width:2px;border-radius:13px}.source-tab{font-size:12px;padding:9px 14px;border-radius:9px}.music-source.active{gap:11px}.now-card{min-height:92px;padding:13px 15px;border-width:2px;border-radius:16px}.cover-placeholder,.spotify-cover{width:66px;height:66px;border-radius:14px}.cover-placeholder img{max-width:43px;max-height:47px}.now-copy small{font-size:10px}.now-copy strong{font-size:18px;margin-top:3px}.now-copy span{font-size:12px;margin-top:4px}.progress-row{grid-template-columns:44px 1fr 44px;gap:10px;font-size:11px}.progress-row input[type=range]{height:7px}.player-controls{gap:12px;margin:4px 0}.round-btn{width:50px;height:50px;font-size:25px;border-width:2px;box-shadow:0 4px 0 rgba(0,0,0,.5)}.round-btn.small{width:46px;height:46px}.play-btn{width:64px;height:64px;font-size:22px;box-shadow:0 5px 0 #451388,0 10px 24px rgba(111,23,196,.27)}.volume-line{grid-template-columns:90px 1fr 54px;gap:12px;font-size:11px}.volume-line strong{font-size:13px}.category-row{gap:8px}.category-btn{font-size:11px;padding:8px 12px;border-width:2px;border-radius:10px}.library-top{font-size:11px;padding:8px 2px}.mini-action{font-size:11px;padding:8px 11px}.track-row{grid-template-columns:32px 1fr 36px auto;gap:10px;padding:12px 8px}.track-index{font-size:11px}.track-row strong{font-size:14px}.track-row div span{font-size:11px}.track-play,.track-edit{font-size:17px}.library-empty{font-size:13px;padding:28px}.spotify-connect-card{border-width:2px}.spotify-orb{width:76px;height:76px;font-size:31px}.spotify-connect-card strong{font-size:20px}.spotify-connect-card p{font-size:13px;max-width:390px}.spotify-state-line{font-size:12px}

/* Jingle-Pult */
.jingle-master{grid-template-columns:14px 105px 14px 105px;gap:7px;font-size:10px}.jingle-master i{height:8px}.bank-row{gap:10px;padding-bottom:14px}.bank-tabs{gap:8px}.bank-tab{min-height:46px;padding:10px 16px;font-size:12px;border-radius:11px;border-width:2px;box-shadow:0 3px 0 rgba(0,0,0,.42)}.bank-tab.active{border-color:rgba(231,42,204,.75);box-shadow:inset 0 0 20px rgba(231,42,204,.09),0 3px 0 rgba(0,0,0,.42)}.bank-plus{width:46px;height:46px;font-size:19px;border-width:2px;border-radius:11px}.bank-edit{width:25px;height:25px;font-size:11px;right:-6px;top:-8px}
.pad-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:13px;margin-top:14px;max-height:calc(100% - 92px);padding:2px}.jingle-pad{min-height:150px;border-width:2px;border-radius:18px;padding:18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 5px 0 rgba(0,0,0,.42),0 12px 20px rgba(0,0,0,.12)}.jingle-pad:hover{transform:translateY(-2px)}.jingle-pad:active{transform:translateY(3px);box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 1px 0 rgba(0,0,0,.45)}.jingle-pad .pad-number{left:17px;top:14px;font-size:11px}.jingle-pad strong{font-size:20px;line-height:1.05}.jingle-pad span{font-size:10px;margin-top:7px}.jingle-pad.playing{border-color:#ed3fd6;box-shadow:inset 0 0 50px rgba(231,42,204,.16),0 5px 0 rgba(71,9,64,.7),0 0 34px rgba(231,42,204,.16)}.jingle-pad.playing>i{height:5px}.pad-admin button{width:34px;height:34px;font-size:14px}.add-pad b{font-size:34px}.empty-box strong{font-size:20px}.empty-box span{font-size:13px}

/* Admin bleibt kompakter als die Live-Oberfläche, aber lesbar */
.modal{width:min(520px,94vw);padding:30px;border-width:2px}.modal.wide{width:min(760px,94vw)}.modal h3{font-size:30px}.modal p{font-size:14px}.field{min-height:50px;font-size:15px;border-width:2px}.settings-drawer{width:min(520px,96vw)}.drawer-head{padding:25px}.drawer-head h2{font-size:28px}.drawer-scroll{padding:0 25px 25px}.drawer-scroll h3{font-size:16px}.settings-note{font-size:12px}.drawer-foot{padding:18px 25px}
.toast{font-size:13px;padding:13px 18px}

@media(max-width:1450px){
 .top-statuses{display:none}.brand-wrap{min-width:290px}.top-logo{width:150px}
 .upper-grid{grid-template-columns:1.05fr 1fr .9fr}.lower-grid{grid-template-columns:.88fr 1.12fr}
 .timer-display{font-size:96px}.signal-copy strong{font-size:38px}.pad-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
}
@media(max-width:1120px){
 .upper-grid{grid-template-columns:1fr 1fr}.operation-panel{grid-column:1/-1}.lower-grid{grid-template-columns:1fr;height:auto}.music-panel,.jingle-panel{min-height:650px}.closing-mini{display:none}
}
@media(max-width:760px){
 .control-view{padding:9px}.topbar{height:auto;min-height:74px;padding:11px 12px;gap:10px}.top-logo{width:120px}.product-name{font-size:18px;padding-left:12px}.top-right{gap:6px}.icon-btn{min-width:44px;height:44px}.clock{display:none}
 .upper-grid{grid-template-columns:1fr}.operation-panel{grid-column:auto}.panel{padding:18px}.panel h2{font-size:24px}.timer-display{font-size:86px}.signal-body{justify-content:flex-start}.signal-copy strong{font-size:38px}.signal-light{width:68px;height:68px}.lower-grid{display:block}.music-panel,.jingle-panel{height:auto;min-height:680px;margin-top:12px}.pad-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none}.jingle-pad{min-height:135px}.login-card{padding:40px 26px}.login-logo{width:250px}.login-product{font-size:43px}.form-grid{grid-template-columns:1fr}
}


/* RideControl 2.2 overrides */
/* Fahrzeit bleibt auch nach Ablauf optisch neutral; die Warnung sitzt ausschließlich im Signalpanel. */
.timer-panel.expired,.timer-panel.warning{border-color:var(--line);box-shadow:none;animation:none;background:var(--panel)}
.timer-panel.expired .timer-display,.timer-panel.warning .timer-display{color:#fff;background:linear-gradient(180deg,#050507,#0a0a0e);border-color:rgba(255,255,255,.075);text-shadow:0 0 24px rgba(255,255,255,.035)}
.timer-panel.expired:after{display:none}
.preset-row{display:none!important}
.operation-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.operation-meta>div{border:1px solid var(--line);background:#09090d;border-radius:12px;padding:10px 11px;min-width:0}
.operation-meta span{display:block;color:#757581;font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.operation-meta strong{display:block;color:#f3f3f7;font-size:14px;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.signal-critical .signal-copy strong{font-size:clamp(36px,3vw,58px);letter-spacing:-.05em}
@media(max-width:1450px){.operation-meta{grid-template-columns:1fr 1fr}.operation-meta>div:last-child{grid-column:1/-1}}
@media(max-width:760px){.operation-meta{grid-template-columns:1fr}.operation-meta>div:last-child{grid-column:auto}}

/* RideControl 2.3 — Audio-Bedienpult / Master Meter */
.auto-login-hint{margin-top:13px;text-align:center;color:#777784;font-size:10px;letter-spacing:.08em;text-transform:uppercase;line-height:1.45}
.admin-hint{margin:11px 0 0;text-transform:none;letter-spacing:.03em}
.admin-code-field{text-align:center;font-size:25px!important;letter-spacing:.32em;padding-left:1.1em!important}

/* Rechts Platz für den echten Master-Pegel schaffen. */
.upper-grid,.lower-grid{margin-right:102px}

/* Musiklautstärke bewusst komplett anders als die Positionsanzeige gestalten. */
.channel-volume{border:2px solid rgba(255,255,255,.09);background:linear-gradient(180deg,#111118,#09090d);border-radius:16px;padding:12px 14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 5px 0 rgba(0,0,0,.28)}
.channel-volume-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px}
.channel-volume-head span,.jingle-volume-head span{color:#aaaab5;font-size:11px;font-weight:800;letter-spacing:.11em}
.channel-volume-head strong,.jingle-volume-head strong{min-width:54px;text-align:right;font-family:"Segoe UI",Arial,sans-serif;font-size:19px;font-variant-numeric:tabular-nums}
.channel-volume-control{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:10px}
.channel-volume-control.compact{grid-template-columns:38px minmax(150px,250px) 38px;gap:8px}
.volume-step{width:44px;height:38px;border-radius:10px;border:2px solid rgba(255,255,255,.1);background:linear-gradient(180deg,#1c1c24,#0d0d12);color:#efeff4;font-size:20px;font-weight:700;cursor:pointer;box-shadow:0 3px 0 #040406;transition:.12s}
.channel-volume-control.compact .volume-step{width:38px;height:34px;font-size:18px}
.volume-step:hover{border-color:rgba(231,42,204,.45);background:#1a121e}.volume-step:active{transform:translateY(2px);box-shadow:0 1px 0 #040406}
.channel-volume input[type=range],.jingle-volume-module input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:12px;border-radius:999px;outline:0;background:linear-gradient(90deg,rgba(63,24,195,.95),rgba(231,42,204,.95) 70%,rgba(255,144,104,.95));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 2px 5px rgba(0,0,0,.55)}
.channel-volume input[type=range]::-webkit-slider-thumb,.jingle-volume-module input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:25px;height:25px;border-radius:50%;background:#fff;border:4px solid #d52ac8;box-shadow:0 2px 9px rgba(0,0,0,.55),0 0 15px rgba(231,42,204,.35);cursor:pointer}
.channel-volume input[type=range]::-moz-range-thumb,.jingle-volume-module input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:4px solid #d52ac8;box-shadow:0 2px 9px rgba(0,0,0,.55);cursor:pointer}
/* Positionsbalken bleibt bewusst dünn und neutral. */
.progress-row input[type=range]{appearance:none;-webkit-appearance:none;height:5px!important;border-radius:999px;background:#2a2a31;border:0;accent-color:#fff}
.progress-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:#eee;border:2px solid #888;box-shadow:none}
.progress-row input[type=range]::-moz-range-thumb{width:11px;height:11px;border-radius:50%;background:#eee;border:2px solid #888;box-shadow:none}

/* Jingle-Master sitzt wie ein eigener Kanalzug im Pult. */
.jingle-head{align-items:center;margin-bottom:12px}
.jingle-volume-module{min-width:330px;border:2px solid rgba(231,42,204,.18);background:linear-gradient(180deg,rgba(48,13,53,.35),rgba(10,9,13,.7));border-radius:15px;padding:10px 12px}
.jingle-volume-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.jingle-volume-head strong{font-size:17px}
.jingle-master{display:none!important}

/* Master-Pegel rechts: echter RideControl-Bus (lokale Musik + Jingles). */
.master-meter-rail{position:fixed;z-index:18;right:16px;top:100px;bottom:16px;width:82px;border:2px solid rgba(255,255,255,.10);border-radius:18px;background:linear-gradient(180deg,rgba(16,16,21,.96),rgba(5,5,8,.985));box-shadow:0 18px 45px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.04);padding:12px 8px 10px;display:flex;flex-direction:column;align-items:center;overflow:hidden}
.master-meter-rail:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(231,42,204,.10),transparent 26%);pointer-events:none}
.master-meter-title{position:relative;text-align:center;line-height:.9;margin:2px 0 9px}.master-meter-title span{display:block;color:#8d8d99;font-size:8px;font-weight:800;letter-spacing:.17em}.master-meter-title strong{display:block;font-size:15px;letter-spacing:.05em;margin-top:4px}
.clip-row{width:41px;display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:0 0 5px 17px}.clip-row i{display:block;height:7px;border-radius:3px;background:#321015;border:1px solid rgba(255,70,90,.22)}.clip-row i.on{background:#ff4055;box-shadow:0 0 12px rgba(255,64,85,.95)}
.master-meter-body{position:relative;flex:1;min-height:240px;width:100%;display:grid;grid-template-columns:18px 1fr 1fr;gap:6px;padding:0 2px 0 0}
.db-scale{display:flex;flex-direction:column;justify-content:space-between;padding:20px 0 8px;color:#676773;font-family:"Segoe UI",Arial,sans-serif;font-size:8px;text-align:right;font-variant-numeric:tabular-nums}
.meter-channel{min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px}.meter-channel-label{color:#aaaab5;font-size:9px;font-weight:900}.meter-track{position:relative;flex:1;width:16px;border-radius:5px;background:repeating-linear-gradient(to top,#141419 0,#141419 5px,#07070a 5px,#07070a 8px);border:1px solid rgba(255,255,255,.09);box-shadow:inset 0 0 10px rgba(0,0,0,.9);overflow:hidden}
.meter-track:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(to top,transparent 0,transparent 5px,rgba(0,0,0,.62) 5px,rgba(0,0,0,.62) 8px);pointer-events:none}
.meter-track b{position:absolute;inset:0;display:block;transform-origin:50% 100%;transform:scaleY(0);background:linear-gradient(to top,#35df8d 0 69%,#ffc31f 69% 87%,#ff8d37 87% 94%,#ff4055 94% 100%);box-shadow:0 0 12px rgba(83,227,154,.18);will-change:transform}
.master-meter-source{position:relative;margin-top:9px;width:100%;padding-top:8px;border-top:1px solid var(--line);text-align:center;color:#777784;font-size:7px;font-weight:800;letter-spacing:.07em;line-height:1.3}.master-meter-source.external{color:#ffb36e}

/* Kleiner visueller Schwerpunkt: Betrieb/Jingle liegen jetzt vor der Pegelschiene und nicht am Bildschirmrand. */
.operation-panel,.jingle-panel{border-right-color:rgba(255,255,255,.12)}

@media(max-width:1450px){
 .upper-grid,.lower-grid{margin-right:88px}.master-meter-rail{right:10px;width:72px;top:96px}.jingle-volume-module{min-width:290px}.channel-volume-control.compact{grid-template-columns:36px minmax(120px,210px) 36px}
}
@media(max-width:1120px){
 .upper-grid,.lower-grid{margin-right:78px}.master-meter-rail{width:65px}.jingle-head{align-items:flex-start;flex-direction:column}.jingle-volume-module{width:100%;min-width:0}.channel-volume-control.compact{grid-template-columns:38px 1fr 38px}
}
@media(max-width:900px){
 .upper-grid,.lower-grid{margin-right:0}.master-meter-rail{display:none}.jingle-head{flex-direction:column}.jingle-volume-module{width:100%}
}

/* ==========================================================================
   RideControl 2.4 – Operator Console
   Neutralere Bedienelemente, fester 16:9-Viewport, zentraler Audio-Mixer,
   quittierbare Warnungen und optionales Feuerwerk / Musik reduzieren.
   ========================================================================== */

/* Primäransicht darf auf Desktop nicht scrollen. Scrollen findet nur in Listen statt. */
html,body{width:100%;height:100%;overflow:hidden}
body{min-height:0;overflow:hidden}
.app{height:100dvh;min-height:0;overflow:hidden}
.control-view{
  height:100dvh;min-height:0;overflow:hidden;position:relative;
  padding:12px 104px 12px 12px;
  display:grid;grid-template-rows:64px clamp(215px,28vh,300px) 66px minmax(0,1fr);gap:12px;
}
.topbar{position:relative;top:auto;left:auto;right:auto;height:64px;min-height:64px;margin:0;border-radius:17px;padding:0 16px 0 18px;gap:18px}
.brand-wrap{min-width:300px}.top-logo{width:146px}.product-name{font-size:20px;padding-left:16px}
.top-statuses{gap:7px}.status-pill{font-size:10px;padding:8px 11px;border-width:1px}
.top-right{margin-left:auto}.clock{min-width:150px;text-align:right;padding-right:8px}.clock strong{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif;font-size:19px;font-variant-numeric:tabular-nums}.clock small{font-size:10px;letter-spacing:.08em;margin-top:2px;color:#95959f}
.icon-btn{min-width:42px;height:42px;font-size:17px;border-radius:11px}

.upper-grid,.lower-grid{margin:0!important;margin-right:0!important;min-height:0!important}
.upper-grid{display:grid;grid-template-columns:1.07fr 1.12fr .81fr;gap:12px;height:100%}
.lower-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:12px;height:100%!important;min-height:0!important}
.panel{padding:18px;border-radius:20px;border:1px solid rgba(255,255,255,.11);min-height:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 12px 30px rgba(0,0,0,.24)}
.panel:after{inset:7px;border-radius:14px}.panel-head{margin-bottom:10px}.panel h2{font-size:22px}.eyebrow{font-size:10px}

/* Neutralere, eher hardwareartige Buttons – Markenfarben bleiben im Hintergrund statt auf jedem Schalter. */
.btn,.round-btn,.play-btn,.volume-step,.bank-tab,.source-tab,.cat-chip,.mini-action,.bank-plus{
  background:linear-gradient(180deg,#22262d 0%,#12151a 100%);border-color:#383e47;color:#f2f4f7;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 3px 0 #07090b,0 8px 14px rgba(0,0,0,.2)
}
.btn:hover,.round-btn:hover,.play-btn:hover,.volume-step:hover,.bank-tab:hover,.source-tab:hover,.cat-chip:hover,.mini-action:hover,.bank-plus:hover{border-color:#68717d;background:linear-gradient(180deg,#2b3038,#171b20)}
.btn-primary{background:linear-gradient(180deg,#272d35,#15191f);border:1px solid #4a535f;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 3px 0 #080a0c,0 10px 18px rgba(0,0,0,.25)}
#timerStartBtn{border-color:#2c6d4d;background:linear-gradient(180deg,#183829,#0e1d16);color:#c9f9df;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 3px 0 #06100b,0 0 0 1px rgba(83,227,154,.06)}
#timerStartBtn:hover{border-color:#4fb57f;background:linear-gradient(180deg,#20503a,#11261c)}
#timerStartBtn:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#53e39a;box-shadow:0 0 10px rgba(83,227,154,.65);margin-right:9px;vertical-align:1px}
.btn-danger,#finishRideBtn{background:linear-gradient(180deg,#3a171b,#1d0d10);border-color:#77303a;color:#ffadb6}
.stop-all{background:linear-gradient(180deg,#32171a,#1b0d10);border-color:#632b32;color:#ff909c}

/* Fahrzeit kompakt, groß lesbar – Panel selbst bleibt bei Ablauf neutral. */
.timer-panel{min-height:0}.timer-display{font-size:clamp(72px,5.8vw,108px);margin:4px 0 10px;padding:8px 14px 11px;border-radius:15px;line-height:.9}
.timer-manual{margin-top:7px;gap:8px}.timer-manual label{width:82px}.timer-manual input{font-size:16px;padding:8px 10px}.timer-manual .btn{min-height:40px;padding:7px 12px;font-size:10px}.timer-actions{margin-top:10px;gap:8px}.btn.big{min-height:47px;padding:10px 18px;font-size:12px}
.timer-panel.expired,.timer-panel.warning{border-color:rgba(255,255,255,.11)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 12px 30px rgba(0,0,0,.24)!important;animation:none!important;background:linear-gradient(155deg,#111117 0%,#09090e 70%,#07070a 100%)!important}
.timer-panel.expired .timer-display,.timer-panel.warning .timer-display{color:#fff!important}

/* Statuszentrale: nur der nicht quittierte Hauptalarm blinkt. Quittierte Hinweise bleiben als ruhige Einträge sichtbar. */
.signal-panel{min-height:0;display:flex;flex-direction:column;justify-content:flex-start;overflow:hidden;--tone:#53e39a;--tone-rgb:83,227,154}
.signal-head{height:22px;flex:0 0 auto}.signal-ready-mark{font-size:9px;letter-spacing:.09em;color:#737984}.signal-body{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;gap:18px;padding:6px 2px 3px}
.signal-light{width:62px;height:62px;padding:10px;border-width:2px}.signal-light span{background:var(--tone);box-shadow:0 0 26px rgba(var(--tone-rgb),.75),0 0 58px rgba(var(--tone-rgb),.22)}
.signal-copy strong{font-size:clamp(28px,2.2vw,44px);color:#fff}.signal-copy span{font-size:12px;margin-top:7px;color:#b9bbc1}
.signal-ack{min-height:39px;font-size:11px;margin-top:4px;flex:0 0 auto;border-color:rgba(var(--tone-rgb),.48);background:rgba(var(--tone-rgb),.10);box-shadow:none;color:#fff}
.signal-ok{--tone:#53e39a;--tone-rgb:83,227,154}
.signal-yellow{--tone:#ffc31f;--tone-rgb:255,195,31;border-color:rgba(255,195,31,.48)}
.signal-orange{--tone:#ff9b4a;--tone-rgb:255,155,74;border-color:rgba(255,155,74,.52)}
.signal-blue{--tone:#5da9ff;--tone-rgb:93,169,255;border-color:rgba(93,169,255,.5)}
.signal-violet{--tone:#b779ff;--tone-rgb:183,121,255;border-color:rgba(183,121,255,.5)}
.signal-red{--tone:#ff465a;--tone-rgb:255,70,90;border-color:rgba(255,70,90,.78);background:linear-gradient(150deg,#190a0d,#09090d 72%)}
.signal-panel.is-flashing{animation:operatorAlertFlash .72s ease-in-out infinite}
@keyframes operatorAlertFlash{0%,100%{box-shadow:inset 0 0 18px rgba(var(--tone-rgb),.035),0 12px 30px rgba(0,0,0,.24)}50%{box-shadow:inset 0 0 65px rgba(var(--tone-rgb),.16),0 0 36px rgba(var(--tone-rgb),.19);border-color:rgba(var(--tone-rgb),.95)}}
.alert-stack{flex:0 0 auto;max-height:76px;overflow:auto;margin-top:6px;display:flex;flex-direction:column;gap:4px;padding-right:2px}
.alert-entry{display:grid;grid-template-columns:8px minmax(0,1fr) auto;gap:8px;align-items:center;padding:6px 8px;border:1px solid #292d34;border-radius:8px;background:#0b0d10;color:#d8dbe0}
.alert-entry>i{width:7px;height:7px;border-radius:50%;background:#8f97a2}.alert-entry div{min-width:0}.alert-entry strong{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.alert-entry span{display:block;color:#7f858e;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}.alert-entry>b{font-size:7px;letter-spacing:.08em;color:#7f858e}.alert-entry.pending>b{color:#e8ebef}.alert-entry.acknowledged{opacity:.72}
.alert-entry.tone-yellow>i{background:#ffc31f}.alert-entry.tone-orange>i{background:#ff9b4a}.alert-entry.tone-blue>i{background:#5da9ff}.alert-entry.tone-violet>i{background:#b779ff}.alert-entry.tone-red>i{background:#ff465a}

/* Betrieb: nur wirklich relevante Betriebsinfos, keine doppelte Uhr/Datum-Anzeige. */
.operation-panel{min-height:0;display:flex;flex-direction:column}.operation-panel .panel-head{margin-bottom:6px}.operation-big{margin-top:1px;padding:10px 12px;border-radius:13px;background:#0b0d11}.operation-big span{font-size:9px}.operation-big strong{font-size:clamp(24px,2vw,34px)}
.operation-list{margin-top:6px;flex:1;min-height:0}.operation-list div{padding:6px 1px;font-size:10px}.operation-list strong{font-variant-numeric:tabular-nums;color:#e4e7ec}.operation-list [hidden]{display:none!important}.stop-all{margin-top:7px;min-height:42px;font-size:10px}
.operation-meta{display:none!important}

/* Horizontaler Mixer – zwei Kanalzüge nebeneinander, später einfach erweiterbar. */
.audio-mixer-strip{height:66px;display:grid;grid-template-columns:90px minmax(260px,1fr) minmax(260px,1fr);gap:12px;align-items:center;padding:8px 13px!important;border-radius:17px;overflow:hidden}
.mixer-title{border-right:1px solid #2c3037;padding-right:12px}.mixer-title .eyebrow{display:block;font-size:8px}.mixer-title>strong{display:block;font-size:17px;margin-top:1px}
.mixer-channel{min-width:0;border:1px solid #2a2f36;background:linear-gradient(180deg,#15191e,#0b0e12);border-radius:11px;padding:6px 9px;display:grid;grid-template-columns:115px minmax(0,1fr);gap:10px;align-items:center;height:49px}
.mixer-channel-head{display:grid;grid-template-columns:10px 1fr auto;gap:7px;align-items:center;min-width:0}.mixer-channel-head strong{font-size:10px;letter-spacing:.07em;white-space:nowrap}.mixer-channel-head strong small{display:block;font-size:7px;color:#7f858e;letter-spacing:.09em;margin-top:1px}.mixer-channel-head>b{font-family:"Segoe UI",Arial,sans-serif;font-size:15px;font-variant-numeric:tabular-nums}.mixer-led{width:8px;height:8px;border-radius:50%;background:#53e39a;box-shadow:0 0 8px rgba(83,227,154,.55)}
.mixer-control{display:grid;grid-template-columns:30px minmax(0,1fr) 30px;gap:8px;align-items:center}.mixer-control .volume-step{width:30px;height:29px;border-radius:8px;font-size:16px;box-shadow:0 2px 0 #06080a}.mixer-control input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:8px;border:1px solid #3b414a;border-radius:999px;background:#1c2128;outline:none}.mixer-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:5px;background:linear-gradient(180deg,#f4f5f6,#aeb5bd);border:2px solid #555e69;box-shadow:0 2px 5px rgba(0,0,0,.45);cursor:pointer}.mixer-control input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:5px;background:#d9dde1;border:2px solid #555e69;box-shadow:0 2px 5px rgba(0,0,0,.45);cursor:pointer}
.channel-volume,.jingle-volume-module{display:none!important}

/* Music player – Transport vorne, Titel daneben, klare Hierarchie. */
.music-panel,.jingle-panel{height:100%;min-height:0;overflow:hidden}.music-panel{display:flex;flex-direction:column}.music-head{margin-bottom:8px}.music-source{height:auto;min-height:0;flex:1}.music-source.active{gap:6px}.now-card{min-height:64px;padding:8px 10px;border-radius:13px;border-color:#30353d;background:#0c0f13}.now-card-transport{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center}.spotify-now{grid-template-columns:auto 48px minmax(0,1fr) auto}.spotify-cover{width:48px;height:48px;border-radius:9px;background:#10141a}.now-copy strong{font-size:16px;color:#f4f6f8}.now-copy span{font-size:10px;color:#9ba1aa}.now-copy small{font-size:8px;color:#737a84}.now-actions{display:flex;gap:6px;align-items:center}.round-btn{width:36px;height:36px;font-size:18px}.round-btn.small{width:34px;height:34px;font-size:12px}.play-btn{width:48px;height:48px;border-radius:12px;border:1px solid #4b535e;background:linear-gradient(180deg,#303640,#171b20);font-size:18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 3px 0 #07090b}.play-btn:hover{border-color:#76818e}.play-btn.is-playing{border-color:#3e9f6e;background:linear-gradient(180deg,#1d4934,#10251b);color:#c5f5dc;box-shadow:0 0 14px rgba(83,227,154,.12),0 3px 0 #07090b}.player-controls{display:none!important}
.progress-row{margin:2px 1px 0;grid-template-columns:34px 1fr 34px;gap:7px;font-size:9px}.progress-row input[type=range]{height:4px!important;background:#30353c}.progress-row input[type=range]::-webkit-slider-thumb{width:12px;height:12px;background:#d9dde1;border-color:#626a74}
.category-row{gap:6px;padding:4px 0}.cat-chip{padding:6px 10px;font-size:8px;border-radius:8px}.cat-chip.active{background:#242a31;border-color:#626d79;color:#fff;box-shadow:inset 3px 0 0 #7c8793}.cat-edit{background:#252a31;color:#c4c8ce}.library-top{padding:3px 1px 4px;font-size:9px}.track-list{padding-top:4px}.track-row{grid-template-columns:30px minmax(0,1fr) 26px auto;gap:8px;padding:7px 7px;border:1px solid transparent;border-bottom-color:rgba(255,255,255,.045);border-radius:8px}.track-row:hover{background:#15191e}.track-row.active{background:linear-gradient(90deg,#2b3139,#1b2026);border-color:#68727e;box-shadow:inset 4px 0 0 #53e39a;color:#fff}.track-row.active strong{color:#fff}.track-row.active div span{color:#c4c9cf}.track-row.active .track-index{color:#aab1ba}.track-play{width:28px;height:28px;border:1px solid #3c424b;border-radius:7px;background:#1b2026;color:#f0f2f5;font-size:12px;cursor:pointer}.track-row.active .track-play{border-color:#4d8d6c;color:#bff0d5;background:#173023}.track-row strong{font-size:11px}.track-row div span{font-size:9px}.track-index{font-size:8px;text-align:right}.track-edit{font-size:13px}
.source-tabs{padding:3px;border-color:#30353c;background:#0a0d10}.source-tab{font-size:9px;padding:7px 11px;box-shadow:none}.source-tab.active{background:#282e35;color:#fff;border-color:#4d5661;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}

/* Jinglebank ohne pinke Dauerumrandung. */
.jingle-head{margin-bottom:7px}.bank-row{padding-bottom:8px;gap:6px}.bank-tabs{gap:6px}.bank-tab{min-height:36px;padding:7px 12px;font-size:9px;border-radius:9px;box-shadow:0 2px 0 #06080a}.bank-tab.active{background:linear-gradient(180deg,#303640,#181c21);border-color:#69737f;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 2px 0 #06080a}.bank-plus{width:36px;height:36px;font-size:15px}.pad-grid{grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:8px;margin-top:8px;max-height:calc(100% - 53px);overflow:auto}.jingle-pad{min-height:92px;padding:12px;border-radius:13px;border:1px solid #30353d;background:linear-gradient(155deg,#171b20,#0c0f13);box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 3px 0 #07090b}.jingle-pad:hover{border-color:#67717d;background:linear-gradient(155deg,#20252c,#10141a)}.jingle-pad:before{background:radial-gradient(circle,rgba(255,255,255,.035),transparent 66%)}.jingle-pad strong{font-size:15px}.jingle-pad span{font-size:8px;color:#737a84}.jingle-pad.playing{border-color:#4ca476;background:linear-gradient(155deg,#183326,#0c1711);box-shadow:inset 0 0 30px rgba(83,227,154,.07),0 3px 0 #06100b,0 0 18px rgba(83,227,154,.08)}.jingle-pad.playing>i{height:3px;background:#53e39a;animation:none}.jingle-pad.playing span{color:#8ee9b8}.add-pad b{color:#aeb5bd}

/* Master-Pegel bleibt rechts, ist aber vollständig Teil des Viewports. */
.master-meter-rail{position:absolute;right:12px;top:88px;bottom:12px;width:80px;z-index:18;border-radius:17px;padding:10px 7px 9px}.master-meter-rail:before{background:radial-gradient(circle at 50% 0,rgba(255,255,255,.035),transparent 28%)}.master-meter-body{min-height:0}.master-meter-title{margin-bottom:7px}.master-meter-source{font-size:6.5px}

/* Settings: Schalter für optionale Betriebsereignisse. */
.schedule-setting{margin-top:14px;padding:12px;border:1px solid #282d34;border-radius:12px;background:#0b0e12}.toggle-row{display:flex!important;align-items:center;justify-content:space-between;gap:14px;margin:0!important;cursor:pointer}.toggle-row>span{display:block!important;margin:0!important;text-transform:none!important;letter-spacing:0!important}.toggle-row>span strong{display:block;color:#eef0f3;font-size:12px}.toggle-row>span small{display:block;color:#777e88;font-size:9px;line-height:1.4;margin-top:3px;max-width:280px}.toggle-row input{position:absolute;opacity:0;pointer-events:none}.toggle-row>i{position:relative;display:block;flex:0 0 auto;width:44px;height:24px;border-radius:999px;background:#252a31;border:1px solid #3c424b;transition:.18s}.toggle-row>i:after{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#8d949d;transition:.18s}.toggle-row input:checked+ i{background:#173425;border-color:#3f8f65}.toggle-row input:checked+ i:after{left:23px;background:#6fe6a5;box-shadow:0 0 9px rgba(83,227,154,.35)}.schedule-setting-fields{margin-top:10px}.schedule-setting label.disabled{opacity:.38}.field:disabled{cursor:not-allowed;color:#666c74}.settings-note{font-size:9px}

/* Modal/Drawer Primärbuttons ebenfalls neutral. */
.drawer-foot .btn-primary,.modal .btn-primary{background:linear-gradient(180deg,#303640,#171b20);border-color:#4d5662;color:#fff}
.access-field input:focus,.field:focus{border-color:#69737f;box-shadow:0 0 0 4px rgba(105,115,127,.10)}

/* Höhe vor Breite: auf 16:9 / Laptop-Displays kompakter, aber weiterhin ohne Seitenscroll. */
@media(max-height:900px) and (min-width:901px){
 .control-view{padding:8px 92px 8px 8px;grid-template-rows:58px clamp(228px,29vh,245px) 60px minmax(0,1fr);gap:8px}
 .topbar{height:58px;min-height:58px}.top-logo{width:128px}.product-name{font-size:18px}.status-pill{font-size:9px;padding:6px 9px}.icon-btn{min-width:38px;height:38px}.clock strong{font-size:17px}.clock small{font-size:9px}
 .panel{padding:14px;border-radius:17px}.panel h2{font-size:19px}.eyebrow{font-size:9px}.timer-display{font-size:clamp(64px,5.4vw,88px);padding:6px 11px 8px;margin:1px 0 6px}.timer-manual input{font-size:14px;padding:6px 8px}.timer-manual label{width:70px}.timer-actions{margin-top:6px}.btn.big{min-height:40px;padding:7px 13px;font-size:10px}
 .signal-light{width:52px;height:52px}.signal-copy strong{font-size:clamp(24px,2vw,34px)}.signal-copy span{font-size:10px}.alert-stack{max-height:58px}.alert-entry{padding:4px 7px}
 .operation-big{padding:7px 10px}.operation-big strong{font-size:24px}.operation-list div{padding:4px 1px;font-size:9px}.stop-all{min-height:36px;padding:7px;font-size:9px}
 .audio-mixer-strip{height:60px;padding:5px 10px!important;grid-template-columns:76px minmax(220px,1fr) minmax(220px,1fr)}.mixer-channel{height:44px;padding:5px 8px;grid-template-columns:100px minmax(0,1fr)}.mixer-channel-head strong{font-size:9px}.mixer-channel-head>b{font-size:13px}.mixer-control{grid-template-columns:26px 1fr 26px}.mixer-control .volume-step{width:26px;height:25px;font-size:13px}
 .now-card{min-height:54px;padding:6px 8px}.play-btn{width:40px;height:40px}.round-btn{width:31px;height:31px}.round-btn.small{width:30px;height:30px}.now-copy strong{font-size:13px}.category-row{padding:2px 0}.cat-chip{padding:5px 8px}.track-row{padding:5px 6px}.track-row strong{font-size:10px}.pad-grid{gap:6px;margin-top:6px}.jingle-pad{min-height:76px;padding:10px}.jingle-pad strong{font-size:13px}.bank-tab{min-height:32px;padding:5px 10px}.bank-plus{width:32px;height:32px}
 .master-meter-rail{right:8px;top:74px;bottom:8px;width:72px}
}

/* Unter 900px Breite bleibt die Oberfläche funktional; Master-Meter wird ausgeblendet. */
@media(max-width:900px){
 html,body{overflow:auto}.app{height:auto;min-height:100vh;overflow:visible}.control-view{height:auto;min-height:100vh;display:block;padding:8px;overflow:visible}.topbar{margin-bottom:8px}.upper-grid,.lower-grid{display:grid;grid-template-columns:1fr;margin-bottom:8px}.audio-mixer-strip{display:grid;grid-template-columns:1fr;margin-bottom:8px;height:auto}.mixer-title{border-right:0;border-bottom:1px solid #2c3037;padding:0 0 7px}.master-meter-rail{display:none}.music-panel,.jingle-panel{min-height:560px}.operation-panel{grid-column:auto}
}
.mixer-control input[type=range]:disabled{opacity:.28;cursor:not-allowed}.mixer-channel:has(input:disabled){opacity:.58}
/* v2.4 fit-pass: Fahrzeit-Bedienung vollständig innerhalb des oberen Panels. */
.control-view{grid-template-rows:64px clamp(240px,31vh,330px) 66px minmax(0,1fr)}
@media(max-height:900px) and (min-width:901px){
 .control-view{grid-template-rows:58px clamp(240px,30vh,265px) 60px minmax(0,1fr)}
 .timer-display{font-size:clamp(58px,5vw,74px);padding:4px 10px 6px;margin:0 0 4px}
 .timer-manual{margin-top:3px}.timer-actions{margin-top:4px}.btn.big{min-height:36px;padding:6px 11px}
}
@media(max-height:900px) and (min-width:901px){.control-view{grid-template-rows:58px clamp(260px,30vh,275px) 60px minmax(0,1fr)}}