/* DonWest UI v1 (local sample): compact icon grid + full-screen stop player */
.dw-ui1 .fsgrid.dw-cg>.fs{display:none}
.dw-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:8px 0 4px;padding:0;list-style:none}
@media(min-width:640px){.dw-tiles{grid-template-columns:repeat(6,1fr)}}
.dw-tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;min-height:44px;padding:0;border:0;background:none;color:var(--ink);font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.dw-tile .ic{position:relative;width:100%;aspect-ratio:1;border-radius:10px;background:var(--green);overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 1px rgba(22,20,15,.15)}
.dw-tile .ic img{width:100%;height:100%;image-rendering:pixelated;display:block}
.dw-tile .ic .num0{font:600 26px/1 var(--latin);color:var(--paper)}
.dw-tile .no{position:absolute;left:4px;top:4px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:rgba(22,20,15,.78);color:#fff;font:600 12px/20px var(--sans);text-align:center}
.dw-tile .tt{width:100%;font:12px/1.25 var(--sans);color:var(--muted);text-align:center;overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.dw-tile.locked .ic::after{content:"";position:absolute;inset:0;background:rgba(22,20,15,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f6f2ea'%3E%3Cpath d='M7 10V7a5 5 0 0 1 10 0v3h1a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V11a1 1 0 0 1 1-1h1zm2 0h6V7a3 3 0 0 0-6 0v3z'/%3E%3C/svg%3E") center/38% no-repeat}
.dw-tile.now .ic{box-shadow:0 0 0 3px var(--gold)}
.dw-tile:focus-visible .ic{outline:3px solid var(--gold);outline-offset:2px}
html.dw-stage-on,html.dw-stage-on body{overflow:hidden}
.dw-stage{position:fixed;inset:0;z-index:900;background:var(--paper);display:flex;flex-direction:column;overflow-y:auto;-webkit-overflow-scrolling:touch}
.dw-stage[hidden]{display:none}
.dw-sbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:6px 8px;background:var(--paper);border-bottom:1px solid rgba(22,20,15,.12)}
.dw-sbar button{min-width:44px;min-height:44px;border:0;background:none;font:600 15px var(--sans);color:var(--green);cursor:pointer;border-radius:8px}
.dw-sbar .pos{font:13px var(--sans);color:var(--muted)}
.dw-sbody{padding:14px 16px 28px;max-width:560px;margin:0 auto;width:100%;box-sizing:border-box}
/* inside the stage the original card shows only: icon, name, our player, map */
.dw-stage .fs{display:block!important;border:0;padding:0;margin:0;background:none;box-shadow:none}
.dw-stage .fs>*:not(.dw-hd):not(.mr-box):not(.dw-pl):not(.dw-lockmsg):not(.dw-sp):not(.dw-ex):not(audio){display:none!important}
.dw-stage .fs audio{display:none}
.dw-hd{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.dw-hd img,.dw-hd .num0{width:104px;height:104px;flex:none;border-radius:12px;image-rendering:pixelated;background:var(--green);display:flex;align-items:center;justify-content:center;font:600 40px var(--latin);color:var(--paper)}
.dw-hd .k{font:12px var(--sans);letter-spacing:.06em;color:var(--muted);margin:0 0 4px}
.dw-hd h3{font:700 22px/1.25 var(--serif);margin:0}
.dw-hd .en{font:italic 15px/1.3 var(--latin);color:var(--muted);margin:3px 0 0}
.dw-pl{display:flex;align-items:center;gap:10px;margin:4px 0 14px}
.dw-pl .pp{width:56px;height:56px;flex:none;border-radius:50%;border:0;background:var(--green);color:var(--paper);display:flex;align-items:center;justify-content:center;cursor:pointer}
.dw-pl .pp svg{width:24px;height:24px;fill:currentColor}
.dw-pl .sk{flex:none;width:44px;height:44px;border:0;background:none;color:var(--green);font:600 13px var(--sans);cursor:pointer;border-radius:50%}
.dw-pl .bar{flex:1;min-width:0}
.dw-pl input[type=range]{width:100%;height:32px;margin:0;accent-color:var(--gold)}
.dw-pl .tm{display:flex;justify-content:space-between;font:12px var(--sans);color:var(--muted);font-variant-numeric:tabular-nums}
.dw-stage .mr-box{margin-top:6px}
.dw-stage .mr-box .mr-k,.dw-stage .mr-box .mr-via,.dw-stage .mr-box .mr-ctl,.dw-stage .mr-box .mr-note{display:none}
.dw-lockmsg{margin:10px 0;padding:12px;border-radius:10px;background:#efe6d4;font:14px/1.5 var(--sans)}
.dw-lockmsg a{color:var(--green);font-weight:600}
.dw-ui1 #route2h .rn-wheelbox,.dw-ui1 #route2h .rn-panel{display:none!important}

/* v2: nav + speed */
.dw-sbar{gap:4px;padding:4px 6px}
.dw-sbar .x{padding:0 8px}
.dw-sbar .nv{display:flex;gap:2px}
.dw-sbar .nv button{font:500 13px var(--sans);color:var(--muted);padding:0 6px;min-width:0}
.dw-sbar .pn{display:flex}
.dw-sbar .pn button{font-size:22px}
.dw-sbar button:disabled{opacity:.3}
.dw-gtop{display:flex;justify-content:flex-start;margin:4px 0}
.dw-gtop a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;font:500 14px var(--sans);color:var(--green);text-decoration:none}
.dw-sp{display:flex;align-items:center;gap:6px;margin:-4px 0 14px}
.dw-sp .lb{font:12px var(--sans);color:var(--muted);margin-right:2px}
.dw-sp button{flex:1;min-height:44px;border:1px solid rgba(22,20,15,.18);border-radius:22px;background:none;font:600 14px var(--sans);color:var(--ink);cursor:pointer;font-variant-numeric:tabular-nums}
.dw-sp button.on{background:var(--green);border-color:var(--green);color:var(--paper)}

.dw-ex{margin-top:18px;padding-top:14px;border-top:1px solid rgba(22,20,15,.12)}
.dw-ex .k{font:12px var(--sans);letter-spacing:.06em;color:var(--muted);margin:0 0 8px}
.dw-ex .nr{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px;margin-bottom:14px}
.dw-ex .nr button{flex:none;width:68px;border:0;background:none;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--ink)}
.dw-ex .nr .ic{width:60px;height:60px;border-radius:10px;overflow:hidden;background:var(--green);color:var(--paper);display:flex;align-items:center;justify-content:center;font:600 18px var(--latin)}
.dw-ex .nr img{width:100%;height:100%;image-rendering:pixelated}
.dw-ex .nr .tt{width:100%;font:11px/1.2 var(--sans);color:var(--muted);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dw-ex .fbb{display:block;width:100%;min-height:44px;border:1px solid rgba(22,20,15,.18);border-radius:22px;background:none;font:600 14px var(--sans);color:var(--green);cursor:pointer}
.dw-tile .tt{font-size:10.5px;line-height:1.2;-webkit-line-clamp:unset;display:block;overflow:visible;word-break:break-word}
.dw-ex .nr button{width:76px}.dw-ex .nr .tt{white-space:normal;font-size:10.5px;text-overflow:clip;overflow:visible;word-break:break-word}
/* v3: per-tile fitted titles */
.dw-tile .tt{-webkit-line-clamp:unset;display:block;overflow:hidden;text-wrap:balance;word-break:normal;overflow-wrap:normal;line-height:1.2;font-size:12px}
.dw-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(min-width:640px){.dw-tiles{grid-template-columns:repeat(6,minmax(0,1fr))}}
.dw-tiles>li,.dw-tile{min-width:0}
.dw-tile{width:100%}.dw-tile .tt{max-width:100%}
/* v4: watch-crown speed knob + denser nearby grid */
.dw-pl{gap:8px}
.dw-crown{flex:none;width:44px;min-height:56px;padding:0;border:0;background:none;cursor:ns-resize;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;touch-action:none;-webkit-tap-highlight-color:transparent}
.dw-crown .cr{width:22px;height:30px;border-radius:5px;border:2px solid #16140f;box-sizing:border-box;
 background:repeating-linear-gradient(90deg,#c9a14a 0 3px,#6e5320 3px 5px);box-shadow:inset 0 3px 0 rgba(255,255,255,.35),inset 0 -3px 0 rgba(0,0,0,.3),3px 0 0 -1px #16140f;image-rendering:pixelated;transition:transform .12s}
.dw-crown .cr{background-position:calc(var(--o,0)*2px) 0}
.dw-crown[data-i="0"] .cr{--o:0}.dw-crown[data-i="1"] .cr{--o:1}.dw-crown[data-i="2"] .cr{--o:2}.dw-crown[data-i="3"] .cr{--o:3}
.dw-crown.tk .cr{animation:dwtk .15s steps(2)}
@keyframes dwtk{50%{transform:translateY(-2px)}}
.dw-crown .lb{font:600 12px/1 var(--sans);color:var(--green);font-variant-numeric:tabular-nums}
.dw-crown:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:8px}
.dw-ex .nr{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px 6px;overflow:visible}
.dw-ex .nr button{width:auto;min-width:0}
.dw-ex .nr .ic{width:100%;height:auto;aspect-ratio:1}
/* v5: drum + crown, 0.5–3.0× */
.dw-crown{min-height:44px;height:56px;width:30px;cursor:pointer}
.dw-spd{flex:none;display:flex;align-items:center;gap:2px;height:77px;margin:-10px 0;touch-action:none;cursor:ns-resize;user-select:none;-webkit-user-select:none}
.dw-spd .drum{position:relative;width:34px;height:77px;overflow:hidden}
.dw-spd .drum span{position:absolute;left:0;right:0;top:50%;height:12px;margin-top:-6px;text-align:right;font:500 11px/12px var(--sans);color:var(--ink);font-variant-numeric:tabular-nums;transform-origin:100% 50%;transition:transform .15s,opacity .15s}
.dw-spd.drag .drum span{transition:none}
.dw-spd .drum span.on{font-weight:800;color:var(--green)}
.dw-spd .drum .mk{position:absolute;right:-2px;top:50%;width:0;height:0;margin-top:-4px;border:4px solid transparent;border-right-color:var(--gold);border-left:0}
.dw-pl .bar{min-width:90px}
/* v6: edge-on thumb-wheel */
.dw-crown{width:34px}
.dw-crown .cr{position:relative;width:26px;height:52px;border-radius:7px/14px;border:2px solid #16140f;overflow:hidden;
 background:linear-gradient(180deg,#120f08 0%,#4a3814 14%,#8a6a2a 35%,#b38d3e 50%,#8a6a2a 65%,#4a3814 86%,#120f08 100%);
 box-shadow:inset 3px 0 2px -1px rgba(255,255,255,.18),inset -4px 0 3px -1px rgba(0,0,0,.45),2px 0 0 0 #16140f;transition:none}
.dw-crown .cr i{position:absolute;left:1px;right:1px;border-radius:1px;box-shadow:0 1px 0 rgba(0,0,0,.45)}
.dw-crown .cr::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.55),transparent 22%,rgba(255,240,200,.12) 50%,transparent 78%,rgba(0,0,0,.6))}
.dw-crown.tk .cr{animation:none}
/* prod: start selector visible in stage as wheel; single feedback entry */
.dw-stage .mr-box .mr-ctl{display:flex!important;align-items:center;gap:8px;margin:8px 0 0}
.dw-stage .mr-box .mr-ctl label{flex:1;min-width:0;display:flex;align-items:center;gap:6px;font:13px var(--sans);color:var(--muted)}
.dw-stage .mr-box .mr-ctl .mr-pick{flex:none;min-height:44px;font-size:13px}
.dw-ui1 .fb-btn{display:none!important}
.dw-stage .mr-box .mr-ctl{flex-wrap:wrap}
.dw-stage .mr-box .mr-ctl label{flex:1 1 100%;white-space:nowrap}
.dw-stage .mr-box .mr-ctl label .dww{flex:1;min-width:0}
.dw-stage .mr-box .mr-ctl .mr-pick{margin-left:auto}
