/*
 Operations workspace design primitives v1.
 Parent: Marked Matter canon, September 2026. Applies only inside .mm-workspace.
 Canonical PEARL material asset: assets/canonical/MM_PATTERN_007_PEARL_NACRE_MASTER.webp.
 Do not emulate that pattern with random gradients. Product defines structure,
 theme defines material, pattern expresses identity; interactive content stays calm.
*/
.mm-workspace{
 --mm-gap-1:4px;--mm-gap-2:8px;--mm-gap-3:12px;--mm-gap-4:16px;--mm-gap-5:24px;
 --mm-r-sm:8px;--mm-r-md:12px;--mm-r-lg:16px;
 --mm-line:var(--border);
 --mm-ink:var(--ink);
 --mm-subtle:var(--muted);
 --mm-paper:var(--surface);
 --mm-pearl-art:var(--ops-pearl-asset,url('/assets/canonical/MM_PATTERN_007_PEARL_NACRE_MASTER.webp'));
 --mm-outline:color-mix(in srgb,var(--ink) 18%,transparent);
 --mm-accent:var(--accent);
 --mm-focus:var(--accent);
 color:var(--mm-ink);
}
.mm-workspace .mm-material-header{position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--mm-line);border-radius:var(--mm-r-lg);background:color-mix(in srgb,var(--surface) 95%,#fbfaf8)}
.mm-workspace .mm-material-header>*{position:relative;z-index:1}
/*
 The canonical 007 pattern is dark at the source crop used in a wide header.
 Do not blow it up as a giant background panel: it turns into a graphite slab.
 Keep PEARL as a subtle material cue in the trim and navigation instead.
*/
.mm-workspace .mm-material-header::after{content:none;display:none}
.mm-workspace .mm-material-header::before{content:"";position:absolute;z-index:2;pointer-events:none;top:0;left:0;right:0;height:2px;background-image:var(--mm-pearl-art);background-size:cover;background-position:50% 42%;filter:saturate(1.15)}
.mm-workspace .mm-tabrail [aria-pressed="true"]{position:relative;background:var(--mm-paper);border-color:var(--mm-outline);box-shadow:0 2px 9px rgba(36,32,40,.055)}
.mm-workspace .mm-tabrail [aria-pressed="true"]::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;border-radius:2px;background-image:var(--mm-pearl-art);background-size:cover;background-position:50% 48%}
.mm-workspace .mm-segment{transition:background .16s ease,border-color .16s ease,box-shadow .16s ease}
.mm-workspace .mm-segment[aria-pressed="true"]{background:color-mix(in srgb,var(--surface) 90%,#dad8e2);border-color:var(--mm-outline);box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--mm-accent) 42%,transparent)}
.mm-workspace .mm-segment:focus-visible,.mm-workspace .mm-disclosure-heading:focus-visible{outline:2px solid var(--mm-focus);outline-offset:2px}
.mm-workspace .mm-disclosure-heading{position:relative;cursor:pointer}
.mm-workspace .mm-disclosure-heading::before{
 content:""!important;display:block!important;box-sizing:border-box!important;
 width:9px!important;height:9px!important;border:solid var(--mm-subtle)!important;
 border-width:0 1.6px 1.6px 0!important;background:none!important;border-radius:0!important;
 transform:translateY(-65%) rotate(-45deg)!important;transform-origin:center!important;
 position:absolute!important;top:50%!important;left:14px!important;margin:0!important;
 font-size:0!important;line-height:0!important;filter:none!important;
 transition:transform .14s ease,border-color .14s ease;
}
.mm-workspace details[open]>.mm-disclosure-heading::before{transform:translateY(-65%) rotate(45deg)!important;border-color:var(--mm-accent)!important}
.mm-workspace .mm-worklist-row{border-bottom:1px solid var(--mm-line);transition:background .15s ease}
.mm-workspace .mm-worklist-row:hover{background:color-mix(in srgb,var(--surface) 91%,#f8f7fb)}
.mm-workspace .mm-worklist-row[open]{background:color-mix(in srgb,var(--surface) 95%,#e5e4e9);box-shadow:inset 2px 0 var(--mm-accent)}
.mm-workspace .mm-worklist-row >.mm-disclosure-heading{padding-left:38px!important;min-height:59px}
.mm-workspace .mm-worklist-group>.mm-disclosure-heading{padding-left:39px!important}
.mm-workspace .mm-worklist-group>.mm-disclosure-heading::before{left:17px!important}
@media(max-width:650px){.mm-workspace .mm-material-header::after{width:48%;opacity:.47}.mm-workspace .mm-worklist-row>.mm-disclosure-heading{min-height:58px}}
@media(prefers-reduced-motion:reduce){.mm-workspace .mm-segment,.mm-workspace .mm-disclosure-heading::before,.mm-workspace .mm-worklist-row{transition:none}}