/* DRUMOJO unified production UI system: based on the established manga public site. */
@font-face{font-family:DRUMOJOInter;src:url('/assets/fonts/inter-latin-400-normal-C38fXH4l.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:DRUMOJOInter;src:url('/assets/fonts/inter-latin-700-normal-Yt3aPRUw.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:DRUMOJODisplay;src:url('/assets/fonts/barlow-condensed-latin-700-normal-v1xN8_Wq.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
:root{
 --dmu-ink:#171b20;--dmu-void:#101418;--dmu-paper:#f7f4ec;--dmu-paper-deep:#ece7d9;
 --dmu-card:#fffdf8;--dmu-line:#c9c5b9;--dmu-red:#c1321d;--dmu-flare:#ff5439;
 --dmu-yellow:#e2fa5e;--dmu-blue:#274de0;--dmu-muted:#4e5963;
 --dmu-body:DRUMOJOInter,Inter,system-ui,-apple-system,'Segoe UI',sans-serif;
 --dmu-display:DRUMOJODisplay,Impact,'Arial Narrow',sans-serif;
 --dmu-radius:7px;--dmu-geometry:2px 3px 0 #10141824;
}
.dm-icon{width:22px;height:22px;flex:none;display:inline-block;vertical-align:middle;color:inherit}
/* Member shell: consistent visual hierarchy, same identity as public; no engine internals restyled. */
body[data-drumojo-design="workspace"]{
 --bg:var(--dmu-paper);--surface:var(--dmu-card);--line:var(--dmu-line);
 --text:var(--dmu-ink);--muted:var(--dmu-muted);--accent:var(--dmu-red);
 --nav:var(--dmu-void);--radius:var(--dmu-radius);--shadow:var(--dmu-geometry);
 font-family:var(--dmu-body);
}
body[data-drumojo-design="workspace"] .mast{
 background:var(--dmu-paper);border-bottom:4px solid var(--dmu-ink);gap:clamp(9px,1.3vw,25px);padding-inline:clamp(11px,2vw,30px);
}
body[data-drumojo-design="workspace"] .mast .identity{text-decoration:none;flex-basis:205px;gap:11px}
body[data-drumojo-design="workspace"] .mast .dm-brand-mark{
 display:block;width:44px;height:44px;flex:none;object-fit:contain;background:#fffdf8;border:2px solid var(--dmu-ink);border-radius:6px;padding:3px;
}
body[data-drumojo-design="workspace"] .mast .identity-text strong{font:700 clamp(1.35rem,2vw,1.95rem)/.95 var(--dmu-display);letter-spacing:-.01em;color:var(--dmu-ink)}
body[data-drumojo-design="workspace"] .mast .identity-text small{font-size:.59rem;letter-spacing:.045em;color:#49535c}
body[data-drumojo-design="workspace"] .mast-actions{gap:10px;min-width:0}
body[data-drumojo-design="workspace"] .rail{background:var(--dmu-void);border-right:3px solid var(--dmu-red);padding:24px 11px}
body[data-drumojo-design="workspace"] .rail-label{color:var(--dmu-yellow);font-weight:800;letter-spacing:.16em;font-size:.68rem}
body[data-drumojo-design="workspace"] .rail .navitem{border-radius:4px;min-height:44px;color:#e4e6e5;gap:10px;position:relative;border-left:3px solid transparent;padding:11px 10px;font-size:.84rem;letter-spacing:-.006em}
body[data-drumojo-design="workspace"] .rail .navitem:hover{background:#28313a;color:white}
body[data-drumojo-design="workspace"] .rail .navitem.active,
body[data-drumojo-design="workspace"] .rail .navitem[aria-current="page"]{background:#343b3f;color:#fff;border-left-color:var(--dmu-yellow)}
body[data-drumojo-design="workspace"] .rail .nav-icon{display:grid;place-items:center;width:24px;flex:none;font-size:0}
body[data-drumojo-design="workspace"] .rail .nav-icon .dm-icon{width:20px;height:20px}
body[data-drumojo-design="workspace"] .rail .dm-more-tools summary{min-height:44px}
body[data-drumojo-design="workspace"] .workarea h1,
body[data-drumojo-design="workspace"] .workarea .page-intro h2,
body[data-drumojo-design="workspace"] .workarea .dm-start-heading h2,
body[data-drumojo-design="workspace"] .workarea .engine-head h1,
body[data-drumojo-design="workspace"] .workarea .dm-start-card strong{font-family:var(--dmu-display);font-weight:700;letter-spacing:0;line-height:1}
body[data-drumojo-design="workspace"] .workarea .panel,
body[data-drumojo-design="workspace"] .workarea .entry,
body[data-drumojo-design="workspace"] .workarea .dm-start-card{border-radius:var(--dmu-radius);border-color:var(--dmu-line);box-shadow:var(--dmu-geometry)}
body[data-drumojo-design="workspace"] :is(button,input,select,textarea){font-family:var(--dmu-body)}
body[data-drumojo-design="workspace"] :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--dmu-blue)!important;outline-offset:3px!important}
body[data-drumojo-design="workspace"] .rail :is(button,a,summary):focus-visible{outline-color:var(--dmu-yellow)!important}
body[data-drumojo-design="workspace"] .action{background:var(--dmu-ink);color:white;border-radius:var(--dmu-radius)}
body[data-drumojo-design="workspace"] .action:hover{background:#373d41}
body[data-drumojo-design="workspace"] .secondary{border-radius:var(--dmu-radius)}
body[data-drumojo-design="workspace"] .workarea .eyebrow{color:#9b3020}
/* Finder: concrete actions backed by existing nav buttons and routes. */
.dm-find-trigger{border:1.5px solid var(--dmu-ink);background:var(--dmu-paper);color:var(--dmu-ink);display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:6px 9px;border-radius:var(--dmu-radius);font-size:.78rem;font-weight:700;white-space:nowrap}
.dm-find-trigger .dm-icon{width:19px;height:19px}
.dm-find-trigger kbd{font-size:.67rem;font-weight:700;border:1px solid #777;padding:2px 4px;border-radius:3px}
.dm-find-trigger:hover{background:var(--dmu-yellow)}
.dm-finder{position:fixed;inset:0;margin:auto;width:min(650px,calc(100% - 26px));max-height:min(80dvh,760px);border:2px solid var(--dmu-ink);background:var(--dmu-paper);color:var(--dmu-ink);border-radius:8px;padding:0;box-shadow:8px 10px 0 #10141850;overflow:hidden}
.dm-finder::backdrop{background:#101418c9}
.dm-finder-shell{display:flex;flex-direction:column;max-height:min(80dvh,760px)}
.dm-finder-head{display:flex;align-items:start;justify-content:space-between;gap:16px;background:var(--dmu-void);color:white;padding:21px 23px}
.dm-finder-head small{display:block;color:var(--dmu-yellow);font-size:.69rem;font-weight:800;letter-spacing:.14em;margin-bottom:4px}
.dm-finder-head h2{font:700 2.4rem/.9 var(--dmu-display);margin:0}
.dm-finder-close{border:1px solid #d5d5d5;background:transparent;color:white;min-width:44px;min-height:44px;border-radius:5px;display:grid;place-items:center}
.dm-finder-close .dm-icon{width:24px;height:24px}
.dm-finder-search{padding:16px 20px;border-bottom:1px solid var(--dmu-line)}
.dm-finder-search label{display:block;font-size:.7rem;font-weight:800;letter-spacing:.1em;margin-bottom:8px}
.dm-finder-search input{width:100%;min-height:51px;border:2px solid #7f8180;border-radius:4px;background:white;color:#15191c;padding:10px 15px;font-size:1.02rem}
.dm-finder-results{overflow:auto;padding:12px;min-height:85px;display:grid;align-content:start;gap:7px}
.dm-finder-option{min-height:55px;display:flex;align-items:center;gap:13px;border:1px solid #c9c5b9;background:#fffdf8;color:#171b20;text-align:left;padding:10px 13px;border-radius:5px;cursor:pointer}
.dm-finder-option .dm-icon{width:20px;height:20px;color:var(--dmu-red)}
.dm-finder-option span{flex:1;font-weight:700;font-size:.89rem}
.dm-finder-option small{font-size:.7rem;color:#526069}
.dm-finder-option[data-selected="true"],.dm-finder-option:hover{border-color:var(--dmu-ink);background:var(--dmu-yellow)}
.dm-finder-empty{padding:14px;line-height:1.6;font-size:.9rem}
.dm-finder-foot{border-top:1px solid var(--dmu-line);display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;padding:10px 19px;font-size:.68rem;color:var(--dmu-muted)}
body[data-drumojo-design="workspace"].dark-mode{--bg:#151b20;--surface:#232a2e;--line:#515a5c;--text:#f3f1e9;--muted:#bac8c7;--nav:#101418;--shadow:3px 4px 0 #0008}
body[data-drumojo-design="workspace"].dark-mode .mast{background:#20272b}
body[data-drumojo-design="workspace"].dark-mode .mast .identity-text strong{color:#fffdf8}
body[data-drumojo-design="workspace"].dark-mode .mast .identity-text small{color:#d0d4d4}
body[data-drumojo-design="workspace"].dark-mode .dm-find-trigger{background:#31393e;color:white;border-color:#bec3c1}
body[data-drumojo-design="workspace"].dark-mode .dm-find-trigger:hover{background:#424e54}
body[data-drumojo-design="workspace"].dark-mode .workarea .eyebrow{color:#ffb29f}
body[data-drumojo-design="workspace"].dark-mode .workarea .panel,
body[data-drumojo-design="workspace"].dark-mode .workarea .entry{box-shadow:3px 4px 0 #0008}
@media(max-width:1100px){.dm-find-trigger kbd{display:none}body[data-drumojo-design="workspace"] .mast .identity{flex-basis:165px}}
@media(max-width:900px){body[data-drumojo-design="workspace"] .mast .identity{flex-basis:135px}body[data-drumojo-design="workspace"] .rail .navitem{justify-content:center;padding:10px 5px}body[data-drumojo-design="workspace"] .rail .nav-icon{width:26px}body[data-drumojo-design="workspace"] .rail .navitem span:last-child{display:none}}
@media(max-width:660px){body[data-drumojo-design="workspace"] .mast .identity{flex-basis:auto}body[data-drumojo-design="workspace"] .mast .dm-brand-mark{width:40px;height:40px}body[data-drumojo-design="workspace"] .mast-actions{gap:6px}.dm-find-trigger{min-width:42px;padding:8px}.dm-find-trigger .dm-find-label{display:none}body[data-drumojo-design="workspace"] .mobile-nav button{min-height:49px;flex:1 1 0;font-size:.7rem}body[data-drumojo-design="workspace"] .workarea{scroll-padding-bottom:110px}}
@media(prefers-reduced-motion:reduce){.dm-finder *{transition:none!important;animation:none!important}}
@media print{.dm-find-trigger,.dm-finder{display:none!important}}
/* Owner control room: established mark and same typography, without touching access controls. */
body[data-drumojo-design="operator"]{--paper:var(--dmu-paper);--ink:var(--dmu-ink);--red:var(--dmu-red);--navy:var(--dmu-void);--line:var(--dmu-line);font-family:var(--dmu-body)}
body[data-drumojo-design="operator"] .operator-bar{border-bottom:4px solid var(--dmu-yellow)}
body[data-drumojo-design="operator"] :is(h1,h2,.intro h1,.mark strong){font-family:var(--dmu-display);font-weight:700;letter-spacing:0;line-height:1.01}
body[data-drumojo-design="operator"] .mark img{background:#fffdf8;padding:3px;border:2px solid white;border-radius:6px}
body[data-drumojo-design="operator"] .panel{border-radius:var(--dmu-radius);box-shadow:var(--dmu-geometry)}
body[data-drumojo-design="operator"] :is(button,input,textarea,select,a):focus-visible{outline:3px solid var(--dmu-blue);outline-offset:3px}
/* Portal React shell: purely presentational; permissions, billing actions and data remain intact. */
body[data-drumojo-design="portal"]{--accent:var(--dmu-red);--sidebar:var(--dmu-void);--border:var(--dmu-line);font-family:var(--dmu-body);background:var(--dmu-paper);color:var(--dmu-ink)}
body[data-drumojo-design="portal"] :is(.public-site,.app-shell,.auth-layout){font-family:var(--dmu-body);color:var(--dmu-ink)}
body[data-drumojo-design="portal"] :is(.public-site,.app-shell,.auth-layout) :is(h1,h2,h3){font-family:var(--dmu-display);font-weight:700;letter-spacing:0}
body[data-drumojo-design="portal"] .app-shell :is(.panel,.upcoming-show,.audio-instrument,.module-card){border-color:var(--dmu-line);border-radius:var(--dmu-radius);box-shadow:var(--dmu-geometry)}
body[data-drumojo-design="portal"] .app-shell .primary{background:var(--dmu-red);border-color:var(--dmu-red);color:white;border-radius:var(--dmu-radius)}
body[data-drumojo-design="portal"] .app-shell .secondary{background:#fffdf8;color:var(--dmu-ink);border:1px solid var(--dmu-line);border-radius:var(--dmu-radius)}
body[data-drumojo-design="portal"] :is(.app-shell,.auth-layout) :is(button,a,input,select,textarea):focus-visible{outline:3px solid var(--dmu-blue);outline-offset:3px}
/* Six destinations are stable on small displays; More never drops to another row. */
@media(max-width:660px){
 body[data-drumojo-design="workspace"] .mobile-nav{
  display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;align-items:stretch;
  justify-content:stretch;gap:0;min-height:64px;overflow:hidden;
 }
 body[data-drumojo-design="workspace"] .mobile-nav>button{
  display:flex;align-items:center;justify-content:center;min-width:0;width:100%;
  min-height:64px;padding:8px 1px!important;font-size:clamp(.61rem,2.55vw,.72rem)!important;
  white-space:nowrap!important;letter-spacing:0;
 }
}