:root{--bg:#0b0f14;--panel:#0f1620;--text:#e6edf3;--muted:#98a6b3;--line:#1d2a38;--accent:#44d7ff;--accent2:#b7ff4a;--warn:#ff5c7a;--shadow: rgba(0,0,0,.35);--radius:16px}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial;background:var(--bg);color:var(--text)}.container{max-width:1240px;margin:0 auto;padding:28px 18px 60px}.header{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:18px}.brand{display:flex;flex-direction:column;gap:6px}.brand h1{margin:0;font-size:32px;letter-spacing:1px}.brandTitle{display:flex;align-items:flex-end;gap:10px}.poweredBy{font-size:11px;color:var(--muted);letter-spacing:.4px;text-transform:lowercase;line-height:1.2;margin-bottom:4px}.brand .sub{color:var(--muted);font-size:13px}.subtleBtn{text-decoration:none;color:var(--muted);font-size:12px;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:#ffffff0a}.subtleBtn:hover{color:var(--text);background:#ffffff14}.badgeRow{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.badge{padding:8px 10px;background:linear-gradient(180deg,#ffffff0f,#ffffff08);border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:12px}.grid{display:grid;grid-template-columns:1.18fr .9fr;gap:16px}.panel.span2{grid-column:1 / -1}@media(max-width:920px){.grid{grid-template-columns:1fr}}.panel{background:linear-gradient(180deg,#ffffff0a,#ffffff05),var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 10px 30px var(--shadow);overflow:hidden}.panelHeader{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(180deg,#ffffff05,#0000)}.panelHeader h2{margin:0;font-size:14px;letter-spacing:.6px;color:var(--muted);text-transform:uppercase}.panelBody{padding:16px}.controlsTop{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.input{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);background:#00000040;border-radius:12px}.input label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.6px}.input input,.input select{background:transparent;color:var(--text);border:none;outline:none;font-size:14px;min-width:68px}.input select option{color:#0e141b;background:#f4f7fb}.btnRow{width:100%;display:flex;gap:10px;flex-wrap:nowrap;align-items:center;margin-left:0;overflow-x:hidden;padding-bottom:0}.btnRow>button{flex:0 0 auto;padding:9px 10px;font-size:13px}.transportGroup{display:inline-flex;gap:10px;flex-wrap:nowrap;margin-left:0;align-items:center;flex:0 0 auto}.transportBtn{min-width:100px;text-align:center}@media(max-width:1220px){.btnRow{flex-wrap:wrap;overflow-x:visible}}button{cursor:pointer;border:none;color:var(--text);padding:10px 12px;border-radius:12px;background:#ffffff0f;border:1px solid var(--line);transition:transform .05s ease,background .15s ease}button:hover{background:#ffffff17}button:active{transform:translateY(1px)}button:disabled{opacity:.55;cursor:not-allowed}button.primary{background:linear-gradient(180deg,#44d7ff40,#44d7ff1a);border-color:#44d7ff59}button.good{background:linear-gradient(180deg,#b7ff4a38,#b7ff4a14);border-color:#b7ff4a52}button.danger{background:linear-gradient(180deg,#ff5c7a2e,#ff5c7a0f);border-color:#ff5c7a47}.kv{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}@media(max-width:520px){.kv{grid-template-columns:1fr}}.slider{padding:12px;border-radius:14px;border:1px solid var(--line);background:#0003}.slider .top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}.slider .name{font-size:12px;letter-spacing:.6px;color:var(--muted);text-transform:uppercase}.slider .val{font-variant-numeric:tabular-nums;font-size:13px;color:var(--text)}.slider input[type=range]{width:100%}.trackList{display:flex;flex-direction:column;gap:10px}.track{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:12px;border-radius:14px;border:1px solid var(--line);background:#0003}.track .left{display:flex;align-items:center;gap:10px}.track .left{min-width:0}.trackControls{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:nowrap}.pill{width:10px;height:10px;border-radius:999px;background:var(--accent);box-shadow:0 0 18px #44d7ff59}.pill.alt{background:var(--accent2);box-shadow:0 0 18px #b7ff4a40}.track .title{font-size:14px}.track .meta{font-size:12px;color:var(--muted);margin-top:2px}.switch{width:44px;height:26px;border-radius:999px;border:1px solid var(--line);background:#ffffff0a;position:relative}.switch.on{border-color:#44d7ff59;background:#44d7ff24}.knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:999px;background:#ffffffbf;transition:left .15s ease}.switch.on .knob{left:21px}.mini{color:var(--muted);font-size:12px;line-height:1.5}.stepGrid{margin-top:14px;border:1px solid var(--line);border-radius:14px;overflow:hidden}.stepHead{padding:10px 12px;border-bottom:1px solid var(--line);background:#00000038;display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.stepBody{padding:10px;background:#0c141d;overflow:hidden}.timelinePanel{margin-top:12px;border:1px solid var(--line);border-radius:14px;overflow:hidden}.timelineBody{padding:10px;background:#00000026;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}@media(max-width:720px){.timelineBody{grid-template-columns:repeat(2,minmax(0,1fr))}}.timelineItem{border:1px solid var(--line);border-radius:12px;padding:8px;background:#ffffff08;display:flex;flex-direction:column;gap:6px}.timelineItem.off{opacity:.5}.timelineItem input[type=range]{width:100%}.row{display:grid;grid-template-columns:80px 1fr;gap:10px;align-items:center;margin-bottom:8px}.row:last-child{margin-bottom:0}.row .label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.6px}.barsWrap{display:flex;flex-wrap:wrap;gap:8px;overflow:hidden}.barBlock{border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:6px;background:#ffffff05;overflow:hidden}.barBlock.playing{border-color:#44d7ff59;background:#44d7ff0f}.barTitle{color:var(--muted);font-size:10px;letter-spacing:.5px;margin-bottom:4px;text-transform:uppercase}.cells{display:grid;grid-template-columns:repeat(16,minmax(8px,1fr));gap:4px}.cell{height:12px;border-radius:5px;border:1px solid rgba(255,255,255,.08);background:#ffffff05}.cell.on{background:#44d7ff38;border-color:#44d7ff4d}.cell.accent{background:#b7ff4a2e;border-color:#b7ff4a42}.footer{margin-top:18px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,#ffffff08,#ffffff03),var(--panel);padding:14px 16px}.footerTop{display:flex;justify-content:space-between;align-items:center;gap:10px}.textLink{color:var(--accent);text-decoration:none;font-size:13px}.textLink:hover{text-decoration:underline}.footerLegal{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.donateBox{margin-top:10px;border:1px solid var(--line);border-radius:12px;background:#00000029;padding:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.donateActions{display:flex;gap:8px;flex-wrap:wrap}.donateBtn{text-decoration:none;color:var(--text);padding:8px 10px;border-radius:10px;border:1px solid rgba(68,215,255,.35);background:linear-gradient(180deg,#44d7ff33,#44d7ff14);font-size:13px}.donateBtn:hover{background:linear-gradient(180deg,#44d7ff47,#44d7ff1f)}@media(max-width:920px){.footerLegal{grid-template-columns:1fr}}.legalCard{border:1px solid var(--line);border-radius:12px;background:#0d1620;padding:10px 12px}.legalCard summary{cursor:pointer;font-size:13px;color:var(--text);-webkit-user-select:none;user-select:none}.legalBody{margin-top:8px}.legalBody p{margin:0 0 8px}.legalBody p:last-child{margin-bottom:0}.contactPage{max-width:920px}.contactForm{display:grid;gap:10px}.textareaInput{align-items:flex-start}.textareaInput textarea{width:100%;background:transparent;color:var(--text);border:none;outline:none;resize:vertical;font-size:14px;line-height:1.4}.contactActions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.hiddenInput{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}.contactStatus{margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px}.contactStatus.ok{border-color:#b7ff4a66;background:#b7ff4a14}.contactStatus.err{border-color:#ff5c7a66;background:#ff5c7a14}
