*{box-sizing:border-box}body{margin:0}main{max-width:1440px;margin:auto;padding:40px}header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:36px}h1{font-size:40px;margin:8px 0}h1 span{color:var(--dt-accent)}header p{color:var(--dt-muted);margin:8px 0}.eyebrow{font-size:11px;color:var(--dt-accent)!important}button{font:600 13px var(--dt-font);border:1px solid var(--dt-line);background:white;padding:12px 16px;cursor:pointer;color:var(--dt-ink)}button:hover{background:var(--dt-soft)}button:disabled{opacity:.4;cursor:default}.primary{background:var(--dt-accent);color:white;border-color:var(--dt-accent)}.primary:hover{background:#005c71}.workspace{display:grid;grid-template-columns:350px 1fr;gap:28px}.program{background:white;border:1px solid var(--dt-line);padding:24px}.section-head{display:flex;justify-content:space-between;align-items:center}.section-head h2{font-size:19px}.section-head span{font:12px var(--dt-mono);color:var(--dt-muted)}.preset{border:1px solid var(--dt-line);margin:10px 0;padding:12px;display:flex;gap:8px;align-items:center}.preset.selected{border-color:var(--dt-accent);background:var(--dt-soft)}.preset .load{flex:1;text-align:left;border:0;background:transparent;padding:0;min-width:0}.load b{display:block;overflow-wrap:anywhere}.load small{display:block;margin-top:7px;color:var(--dt-muted);font:13px var(--dt-mono)}.preset .icon{padding:7px}.preset button:disabled{opacity:.4}form{border-top:1px solid var(--dt-line);margin-top:24px;padding-top:12px}h3{font-size:16px}label{display:block;font-size:12px;font-weight:600;margin:12px 0}input{width:100%;padding:12px;margin-top:8px;border:1px solid var(--dt-line);font:15px var(--dt-font)}.duration{display:flex;gap:12px}.duration label{flex:1}.buttons{display:flex;gap:8px}.monitor{background:#0a1118;color:#f3f6f7;padding:28px;min-height:350px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:4px}.monitor-top{align-self:stretch;display:flex;justify-content:space-between;font:11px var(--dt-mono);color:#9bb2bf;letter-spacing:.1em}.monitor h2{font-weight:500;font-size:24px;margin:36px 0 8px;overflow-wrap:anywhere;text-align:center}.digits{font:600 clamp(65px,8vw,130px) var(--dt-mono);letter-spacing:-.055em;line-height:1.3;font-variant-numeric:tabular-nums}.monitor p{font:12px var(--dt-mono);letter-spacing:.18em;color:#9bb2bf}.progress{height:3px;background:#263842;width:100%;margin-top:24px}.progress div{height:100%;background:var(--si-cyan);width:100%}.warning .digits{color:#ff4056;animation:alert 1s steps(1,end) infinite}.over .digits{color:#ff4056}.over #caption{color:#ff7e8d}.paused .digits{animation:none}.hint,.output-info p{font-size:13px;color:var(--dt-muted);line-height:1.6}.output-info{margin-top:28px;padding:20px;border:1px solid var(--dt-line);background:white}.output-info strong{font-size:15px}#message{color:var(--dt-accent);margin-bottom:0}@keyframes alert{50%{opacity:.22}}@media(max-width:850px){main{padding:24px}.workspace{grid-template-columns:1fr}.control{grid-row:1}header{align-items:flex-start;flex-direction:column}.digits{font-size:clamp(65px,14vw,130px)}}



.transport{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:18px 0 12px;padding:12px;background:#e7eef1;border:1px solid var(--dt-line);border-radius:8px}
.player-button{min-height:94px;padding:14px 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;font-size:11px;border-radius:6px!important;box-shadow:0 2px 3px #0a111809}
.player-button svg{width:32px;height:32px}.player-button:disabled{box-shadow:none}.fine-adjust{display:flex;align-items:center;gap:10px;color:var(--dt-muted);font-size:12px}.fine-adjust button{padding:8px 14px}
@media(max-width:600px){.transport{grid-template-columns:repeat(3,minmax(0,1fr))}.player-button{min-height:90px;font-size:12px}}

.preset{display:grid;grid-template-columns:minmax(0,1fr) 36px 36px;gap:12px 8px;padding:18px 16px;min-height:116px}.preset .load{grid-column:1;grid-row:1}.preset .load b{font-size:16px;line-height:1.3}.preset .load small{font-size:22px;margin-top:9px;color:var(--dt-ink)}.preset .icon{grid-row:1;min-height:36px}.preset-stepper{grid-column:1 / -1;grid-row:2;display:flex;align-items:center;gap:12px}.preset-stepper button{width:42px;height:38px;padding:0;font-size:24px;line-height:1}.preset-stepper span{font:12px var(--dt-mono);color:var(--dt-muted)}

.ipad-link{display:inline-block;padding:12px;color:var(--dt-accent);font-size:13px;font-weight:600}header{flex-wrap:wrap}

.preset{grid-template-columns:26px minmax(0,1fr) 36px 36px}.preset .load{grid-column:2}.preset .preset-stepper{grid-column:2 / -1}.preset-drag{grid-row:1;grid-column:1;padding:0;min-height:44px;font-size:26px;background:transparent;border:0;color:var(--dt-muted);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}.preset-drag:active{cursor:grabbing}.preset.dragging{border-color:var(--si-cyan-ink);box-shadow:0 5px 20px #0a111826;background:var(--dt-soft)}.sorting{user-select:none}.sorting .preset:not(.dragging){opacity:.7}