/* DAT cassette */
.cassbox{flex:none;width:126px;display:flex;flex-direction:column;justify-content:space-between}
.cass{background:#000;padding:2px 4px 4px;box-shadow:inset 1px 1px var(--sh),inset -1px -1px var(--hi)}
.cass-name{height:12px;line-height:12px;color:#fff;font-size:9px;text-align:center;overflow:hidden;white-space:nowrap;text-transform:uppercase}
.cass-win{height:26px;margin:1px 14px 0;background:var(--face);border:1px solid #fff}
.cass-win canvas{display:block;width:100%;height:100%}
.mod.off .cass-name{color:transparent}
.datlogo{display:flex;align-items:center;gap:6px;height:20px}
.datlogo b{font:900 italic 18px/1 Arial,sans-serif}
.datlogo span{font-size:8px;line-height:1.05;color:#404040}
.lcd.dtime{width:76px;flex:none}
.lcd.vu{flex:1;min-width:0}
.vugrid{flex:1;display:grid;grid-template-columns:24px 1fr;align-items:center;row-gap:2px;font-size:8px;line-height:9px;padding-top:1px}
.vubar{display:flex;gap:1px;height:7px}
.vubar i{flex:1;background:var(--led-dim)}
.vubar i.on{background:var(--led)}
.vubar i.y{background:#3d3200} .vubar i.y.on{background:var(--amber)}
.vubar i.r{background:#3d0b0b} .vubar i.r.on{background:var(--red)}
.vuscale{position:relative;height:9px}
.vuscale span{position:absolute;top:0;transform:translateX(-50%)}
.vuscale span.r{color:#ff5a5a}
.vuscale span:last-child{transform:none;right:0}