:root{--bg:#fdfcf9;--panel:#f3f1ea;--text:#171a1f;--dim:#6a6f78;--cell:#e6e3da;--beat:#dbd7cc;--accent:#2757c9;--ink:#171a1f;--unsure:#b06f10}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:Segoe UI,system-ui,sans-serif}header{z-index:5;background:var(--panel);position:sticky;top:0;box-shadow:0 2px 8px #00000026}.transport{align-items:center;gap:12px;padding:10px 20px 8px;display:flex}.settings{border-top:1px solid var(--cell);flex-wrap:wrap;align-items:center;gap:8px 14px;padding:9px 20px 10px;display:flex}h1{letter-spacing:-.3px;margin:0 4px 0 0;font-family:Georgia,Times New Roman,serif;font-size:17px;font-weight:700}h1 i{color:var(--accent);font-style:normal}h1 a{color:inherit;text-decoration:none}h1 a[href]:hover{text-underline-offset:3px;text-decoration:underline}.meta{color:var(--dim);margin-right:auto;font-size:12.5px}button{background:var(--cell);color:var(--text);cursor:pointer;border:0;border-radius:8px;padding:7px 14px;font-family:inherit;font-size:13.5px}button:hover{filter:brightness(1.08)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.primary{background:var(--accent);color:#fff;min-width:96px;padding:9px 18px;font-size:14px}button.icon{padding:8px 11px}button.toggle.active{background:var(--accent);color:#fff}.group{display:inline-flex}.group button{border-radius:0}.group button:first-child{border-radius:8px 0 0 8px}.group button:last-child{border-radius:0 8px 8px 0}.group button+button{box-shadow:inset 1px 0 0 var(--panel)}#time,#barNow{font-variant-numeric:tabular-nums;color:var(--dim);font-size:13px}#time{min-width:96px}#barNow{text-align:right;min-width:58px}#levelWrap{align-items:center;gap:6px;display:flex}#levelSlider{width:88px;accent-color:var(--accent)}#levelName{min-width:70px;font-size:12px;font-weight:600}#ribbon{cursor:pointer;flex:1;align-items:stretch;gap:1px;height:22px;display:flex}.rb{opacity:.5;border-radius:1px;flex:1;min-width:2px;transition:opacity .12s}#ribbon:hover .rb{opacity:.7}.rb.played{opacity:.95}.rb.now{opacity:1;box-shadow:inset 0 0 0 2px var(--text)}@media (prefers-reduced-motion:reduce){.rb{transition:none}}.more{display:inline-flex;position:relative}.menu{z-index:10;background:var(--bg);border:1px solid var(--cell);border-radius:10px;min-width:210px;padding:8px;position:absolute;top:calc(100% + 6px);right:0;box-shadow:0 8px 26px #0000002e}.menu-title{letter-spacing:.6px;text-transform:uppercase;color:var(--dim);padding:4px 8px 6px;font-size:11px}.menu-sep{background:var(--cell);height:1px;margin:6px 0}.menu a,.menu-item,.menu .hint{text-align:left;width:100%;color:var(--text);cursor:pointer;background:0 0;border:0;border-radius:6px;padding:7px 8px;font-family:inherit;font-size:13.5px;text-decoration:none;display:block}.menu a:hover,.menu-item:hover{background:var(--cell)}.menu .hint{color:var(--dim);cursor:default;font-size:12.5px;line-height:1.45}.menu .hint a{color:var(--accent);padding:0;display:inline}.menu .ext{float:right;color:var(--dim);font-size:11.5px}#score,#grid{padding:18px 20px 30px;overflow-x:auto}.scorekey{opacity:.75;margin-bottom:4px}#score{color:var(--ink)}#score .nh{transition:color .16s ease-out}#score .nh.unsure{color:var(--unsure)}@media (prefers-reduced-motion:reduce){#score .nh{transition:none}}.system{width:max-content;margin-bottom:8px;position:relative}.playline{background:var(--accent);width:2px;height:74px;display:none;position:absolute;top:28px}.gsystem{border-left:2px solid var(--cell);width:max-content;margin-bottom:20px;padding-left:8px;position:relative}.loopband{pointer-events:none;background:var(--accent);opacity:.08;border-radius:6px;display:none;position:absolute;top:0;bottom:0}.gsystem.now{border-left-color:var(--accent)}.row{align-items:center;margin-bottom:3px;display:flex}.label{-webkit-user-select:none;user-select:none;width:34px;color:var(--lane);flex:none;margin-right:8px;padding:2px 4px;font-size:12px;font-weight:600}.cell{background:var(--cell);border-radius:3px;flex:none;width:14px;height:24px;margin-right:2px}.cell.beat{background:var(--beat)}.cell.bar{margin-left:10px}.cell.on{background:var(--lane)}.cell.on.unsure{background:var(--unsure)}.cell.play{outline:2px solid var(--text);outline-offset:-1px}.cell.edited{outline:2px dashed var(--accent);outline-offset:-2px}body.editing .cell{cursor:pointer}body.editing .cell:hover{filter:brightness(1.25)}.mrow{height:16px;margin-bottom:2px}.mrow .mspacer{flex:none;width:34px;margin-right:8px}.mnum{width:14px;color:var(--dim);cursor:pointer;white-space:nowrap;flex:none;margin-right:2px;font-size:10px;overflow:visible}.mnum.bar{margin-left:10px}.mnum:hover{color:var(--text)}#volWrap{color:var(--dim);align-items:center;gap:4px;font-size:13px;display:flex}#songVol{width:80px;accent-color:var(--accent)}#speedWrap{color:var(--dim);align-items:center;gap:5px;font-size:13px;display:flex}#speedSlider{width:74px;accent-color:var(--accent)}#speedValue{font-variant-numeric:tabular-nums;min-width:34px;font-family:Consolas,monospace}#loopChip{cursor:pointer;background:var(--accent);color:#fff;border-radius:12px;padding:3px 10px;font-size:12px;font-weight:600}#loopChip.hint{color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:0 0}body.picking #score .hot{fill:var(--accent);fill-opacity:.08}body.picking #score .hot:hover{fill-opacity:.2}body.picking .rb{opacity:.85}body.picking .mnum{color:var(--accent)}#syncWrap{color:var(--dim);align-items:center;gap:4px;font-size:12px;display:flex}#syncWrap button{padding:4px 9px;font-size:13px;line-height:1}#syncValue{text-align:center;font-variant-numeric:tabular-nums;min-width:42px}footer{color:var(--dim);padding:0 20px 20px;font-size:12px}body.no-track .transport,body.no-track .settings>:not(h1),body.no-track #patterns,body.no-track footer{display:none!important}#help{background:var(--panel);padding:4px 20px 10px;font-size:13px;line-height:1.5;box-shadow:0 2px 8px #0000001a}#help p{margin:6px 0}#ytwrap{background:var(--panel);padding:12px 20px}#ytwrap iframe{aspect-ratio:16/9;border:0;border-radius:8px;width:100%;max-width:480px;height:auto;display:block}.pagenote{background:var(--panel);border-bottom:1px solid var(--cell);color:var(--dim);padding:12px 20px;font-size:13.5px;line-height:1.55}.pagenote b{color:var(--text)}.pagenote a{color:var(--accent)}body.sitenav .settings h1{display:none}.rb,.mnum,.cell,#score svg{touch-action:manipulation;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}#patterns{border-top:1px solid var(--cell);grid-template-columns:1fr 1fr;align-items:start;gap:28px;margin-top:6px;padding:4px 20px 30px;display:grid}#patterns h3{align-items:baseline;gap:12px;margin:18px 0 4px;font-family:Georgia,serif;font-size:17px;font-weight:400;display:flex}.pat-fold{flex:none;margin-left:auto;padding:3px 11px;font-family:Segoe UI,system-ui,sans-serif;font-size:12px}#patternsCol.folded .pat-hint,#patternsCol.folded #patList{display:none}#patternsCol.folded h3{margin-bottom:0}.pat-hint{color:var(--dim);max-width:46ch;margin:0 0 12px;font-size:12.5px;line-height:1.5}#patList{flex-wrap:wrap;gap:10px;display:flex}.pat{border:1px solid var(--cell);background:var(--panel);border-radius:8px;flex-direction:column;gap:2px;padding:6px 8px 4px;display:flex}.pat-top{color:var(--dim);align-items:center;gap:7px;font-size:12px;display:flex}.pat-num{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:19px;height:19px;font-size:11.5px;font-weight:700;display:flex}.pat svg{width:176px;height:auto;color:var(--ink);cursor:pointer;display:block}.pat-add{margin-left:auto;padding:1px 8px;font-size:13px;line-height:1.4}.pat.rest{border-style:dashed}.pat-more{align-self:center;padding:8px 14px;font-size:12.5px}#seqList{border:1px dashed var(--cell);border-radius:8px;flex-wrap:wrap;align-items:flex-start;gap:8px;min-height:44px;padding:8px;display:flex}#seqList.empty{color:var(--dim);justify-content:center;align-items:center;font-size:12.5px}.seq-bar{border:1px solid var(--cell);background:var(--panel);cursor:pointer;border-radius:6px;padding:4px 5px 2px;position:relative}.seq-bar svg{width:150px;height:auto;color:var(--ink);display:block}.seq-bar .seq-num{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:17px;height:17px;font-size:10.5px;font-weight:700;display:flex;position:absolute;top:-6px;left:-6px}.seq-bar.now{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset}.seq-line{background:var(--accent);pointer-events:none;border-radius:1px;width:2px;display:none;position:absolute;top:6px;bottom:4px}.pat-controls{flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px;display:flex}.bpmbox{align-items:center;gap:4px;font-size:12.5px;display:flex}.bpmbox input{border:1px solid var(--cell);background:var(--bg);width:56px;color:var(--text);border-radius:6px;padding:6px;font-family:inherit;font-size:13px}.dim{color:var(--dim)}@media (width<=820px){.transport{gap:8px;padding:8px 10px 6px}.settings{gap:6px 10px;padding:7px 10px 8px}h1{font-size:15px}.meta{font-size:11.5px}button{padding:8px 11px;font-size:12.5px}button.primary{min-width:78px;padding:9px 14px}#time{min-width:0;font-size:11.5px}#barNow{display:none}#levelSlider{width:78px}#levelName{min-width:0;font-size:11.5px}#songVol{width:58px}#ribbon{height:18px}#score,#grid{padding:12px 10px 24px}.cell{width:16px;height:26px;margin-right:3px}.mnum{width:16px;margin-right:3px}.label{width:30px;font-size:11px}footer,#help{font-size:12.5px}#speedSlider{width:58px}#patterns{grid-template-columns:1fr;gap:12px;padding:4px 10px 24px}.pat svg{width:112px}#seqList{flex-direction:column;align-items:stretch}.seq-bar svg{width:100%}.pat-hint{font-size:12px}}#printHead{display:none}@page{margin:14mm}@media print{header,footer,#help,#ytwrap,#grid,.pagenote,#patterns{display:none!important}body{color:#000;background:#fff}#printHead{margin:0 0 14px;display:block}#printHead h2{margin:0 0 2px;font-family:Georgia,Times New Roman,serif;font-size:21px;font-weight:400}#printHead p{color:#444;margin:0;font-size:12px}#score{padding:0}#score svg{color:#000}#score .nh{transition:none;color:#000!important}#score .nh.unsure{color:#8a8a8a!important}.system{break-inside:avoid;page-break-inside:avoid;margin-bottom:10px}.playline,.loopband{display:none!important}}.sitebar{padding:0 20px}.sitefoot{border-top:1px solid #d9d6cd;flex-wrap:wrap;gap:8px 18px;margin:40px 20px 30px;padding-top:16px;font-size:13px;display:flex}