:root{color-scheme:light dark;--bg: #fafafa;--panel: #fff;--border: #ddd;--text: #1a1a1a;--muted: #777;--accent: #2a6df4;--ok: #2faf6a;--warn: #d49a18;--err: #c0392b}@media (prefers-color-scheme: dark){:root{--bg: #111;--panel: #1d1d1d;--border: #2c2c2c;--text: #f0f0f0;--muted: #8a8a8a;--accent: #6f9aff;--ok: #41c47e;--warn: #e2b34c;--err: #f0644f}}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;padding-bottom:env(safe-area-inset-bottom)}.app{max-width:40rem;margin:0 auto;padding:1rem;display:flex;flex-direction:column;gap:1rem}.brand{display:flex;align-items:center;justify-content:space-between}.brand h1{margin:0;font-size:1.4rem}.settings{border:0;background:transparent;color:var(--text);font-size:1.4rem;cursor:pointer;padding:.25rem .5rem}.card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:1rem;display:flex;flex-direction:column;gap:.75rem}.card h2,.card h3{margin:0;font-size:1.05rem}label{display:block}label>span{display:block;font-size:.85rem;color:var(--muted);margin-bottom:.25rem}input[type=text],input[type=password],input[type=url]{width:100%;padding:.6rem .7rem;border:1px solid var(--border);border-radius:6px;background:var(--panel);color:var(--text);font:inherit}input:focus{outline:2px solid var(--accent);outline-offset:1px}button{padding:.65rem 1rem;border:0;border-radius:6px;background:var(--accent);color:#fff;font:inherit;font-weight:600;cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button.danger{background:var(--err)}.error{color:var(--err);margin:0}.ok{color:var(--ok);margin:0}.hint{color:var(--muted);margin:0;font-size:.9rem}.device-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.25rem}.device-row{width:100%;display:flex;align-items:center;gap:.65rem;text-align:left;background:transparent;color:var(--text);font-weight:500;border:1px solid var(--border);padding:.55rem .75rem}.device-row:hover{background:var(--bg)}.device-row.selected{border-color:var(--accent)}.device-id{flex:1}.device-state{color:var(--muted);font-size:.9rem;text-transform:capitalize}.dot{width:.65rem;height:.65rem;border-radius:50%;display:inline-block}.detail header{display:flex;align-items:center;justify-content:space-between}.badge{background:var(--border);padding:.15rem .55rem;border-radius:999px;font-size:.85rem;text-transform:capitalize}.now-playing{margin:0}.now-playing code{background:var(--bg);padding:0 .3rem;border-radius:4px}dl.meta{margin:0;display:grid;grid-template-columns:max-content 1fr;gap:.25rem .75rem;font-size:.9rem}dl.meta dt{color:var(--muted)}dl.meta dd{margin:0}.buttons{display:flex;flex-wrap:wrap;gap:.5rem}.buttons button{flex:1 1 calc(33% - .5rem);min-width:6rem}.volume input{width:100%}label.file{border:1px dashed var(--border);padding:1rem;text-align:center;border-radius:8px;cursor:pointer}label.file input{display:none}label.loop{display:flex;gap:.5rem;align-items:center;font-size:.9rem}.progress{position:relative;background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:.35rem .5rem;font-size:.85rem;overflow:hidden}.progress .bar{position:absolute;top:0;right:0;bottom:0;left:0;background:color-mix(in srgb,var(--accent) 25%,transparent);transition:width .2s ease}.progress span{position:relative}.loop-row{display:flex;gap:1rem;flex-wrap:wrap}.clip-list{list-style:decimal inside;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem}.clip-list li{display:grid;grid-template-columns:1fr max-content max-content;align-items:center;gap:.5rem;background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:.35rem .55rem;font-size:.9rem}.clip-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.clip-size,.clip-list .hint,.clip-list .ok,.clip-list .error{font-size:.8rem}.clip-actions{display:flex;gap:.25rem;grid-column:1 / -1;justify-content:end}.clip-actions button{padding:.15rem .45rem;background:transparent;border:1px solid var(--border);color:var(--text);font-weight:400}.schedule-header{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem}.rule{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:.75rem;display:flex;flex-direction:column;gap:.55rem}.rule-times{display:flex;gap:.5rem;align-items:end;flex-wrap:wrap}.rule-times label{flex:0 0 7rem}.rule-times button{margin-left:auto}.rule-days{display:flex;gap:.25rem;flex-wrap:wrap}.day{background:transparent;border:1px solid var(--border);color:var(--text);font-weight:500;padding:.25rem .55rem;font-size:.85rem}.day.on{background:var(--accent);color:#fff;border-color:var(--accent)}