@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;font-family:'DM Sans',system-ui,sans-serif;background:#101417;color:#f0f4f2}*{box-sizing:border-box}body{margin:0}header{height:78px;border-bottom:1px solid #293136;display:flex;align-items:center;justify-content:space-between;padding:0 5vw}.brand{display:flex;gap:12px;font-size:25px;color:#8dbdff}.brand span{font-size:20px;color:#eef3ef}.brand b{font-weight:400;color:#a3b3ac}.tag,.eyebrow{font-size:10px;letter-spacing:2px;color:#96a9a0}main{max-width:1500px;padding:38px 5vw;margin:auto}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}h1{font-size:46px;letter-spacing:-2px;margin:8px 0}p{line-height:1.6}.intro p:last-child{color:#a6b3ae;margin-bottom:0}h2{font-size:17px;margin:0 0 18px}.upload,button{background:#26302e;border:1px solid #40514a;color:#eff5f1;border-radius:9px;padding:12px 17px;cursor:pointer;font:inherit;font-size:13px}.upload{background:#8dbdff;color:#10291e;font-weight:700;border:0}.upload input{display:none}button:hover{filter:brightness(1.15)}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #8dbdff;outline-offset:3px}.workspace{display:grid;grid-template-columns:250px 1fr;gap:22px}aside,.player{background:#192024;border:1px solid #303a3d;border-radius:14px}aside{padding:24px}aside button{width:100%;margin-bottom:12px}label{display:block;font-size:12px;color:#c5d2cc;margin:17px 0}select{width:100%;padding:10px;margin-top:8px;background:#101719;color:#e0eae4;border:1px solid #3d4945;border-radius:7px}input[type=range]{width:100%;accent-color:#8dbdff}.muted{color:#91a29a;font-size:12px}hr{border:0;border-top:1px solid #303b3a;margin:24px 0}.check{display:flex;gap:8px;align-items:center}.check input{accent-color:#8dbdff}#speedLabel{float:right}.player{overflow:hidden;min-width:0}.songbar{padding:20px 24px;display:flex;justify-content:space-between;align-items:center}.songbar h2{margin:0}.songbar .eyebrow{margin:0 0 7px}.roll{height:470px;background:#10171c;position:relative}canvas{width:100%;height:100%;display:block}.rollhint{position:absolute;left:18px;top:15px;font-size:9px;letter-spacing:2px;color:#849890;pointer-events:none}.transport{display:flex;align-items:center;gap:12px;padding:20px 24px 5px}.primary{background:#8dbdff;color:#10291e;font-weight:700;min-width:100px}#time{font-size:12px;white-space:nowrap;color:#a6b9ae}.transport input{flex:1;min-width:40px}#status{font-size:12px;color:#a4b5ac;padding:0 24px 12px;min-height:32px}footer{color:#71857a;font-size:11px;margin-top:24px;text-align:center}@media(max-width:800px){main{padding:24px 16px}.workspace{grid-template-columns:1fr}aside{display:grid;grid-template-columns:1fr 1fr;gap:12px}aside hr{display:none}.intro{gap:15px}h1{font-size:34px}.roll{height:400px}.transport{flex-wrap:wrap}.transport input{flex-basis:100%}.tag{display:none}}
dialog{color:#edf4ef;background:#192024;border:1px solid #52695d;border-radius:16px;padding:28px;max-width:680px;width:calc(100% - 32px);max-height:90vh;overflow:auto;box-shadow:0 24px 90px #0008}dialog::backdrop{background:#060d10dd;backdrop-filter:blur(5px)}dialog h2{font-size:24px;line-height:1.3}dialog p,dialog li{font-size:13px;line-height:1.65;color:#becfc5}dialog ul{padding-left:21px}dialog li{margin-bottom:10px}dialog .check{align-items:flex-start;font-size:13px;line-height:1.5;color:#f0f4f2}dialog .check input{margin-top:4px;flex-shrink:0}.noticeActions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}

footer a{color:#8dbdff;text-underline-offset:3px}footer a:hover{color:#c8dfff}