/* =====================================================================
   Midnight Masquerade: House Masquerade theme styles
   1. Kit tokens (same values as the house style board)
   2. Kit components (frame, rule, plate, buttons, dots)
   3. Page chrome (header, footer, skip link)
   4. Front page hero and paths
   5. Page header and prose (what the block editor produces)
   6. Block styles registered in inc/block-styles.php
   7. Handbook template (chapter rail)
   8. Responsive and reduced motion
   ===================================================================== */

/* ---------- 1. Tokens ---------- */
:root{
  --mm-night:#140c10;
  --mm-night-90:rgba(20,12,16,.90);
  --mm-velvet:rgba(32,20,24,.60);
  --mm-ink:#ede4da;
  --mm-ash:#a2929a;
  --mm-smoke:#7a6c72;
  --mm-brass:#cfa968;
  --mm-brass-lit:rgba(207,169,104,.55);
  --mm-brass-line:rgba(207,169,104,.28);
  --mm-brass-soft:rgba(207,169,104,.14);
  --mm-brass-wash:rgba(207,169,104,.09);
  --mm-vitae:#d95c4e;
  --mm-vitae-deep:#8e2230;
  --mm-vitae-line:rgba(217,92,78,.45);
  --mm-violet:#c9a2d8;
  --mm-steel:#7f9db8;
  --mm-sage:#8fae72;
  --mm-display:"Cinzel","Trajan Pro","Palatino Linotype",Georgia,serif;
  --mm-text:"Spectral",Constantia,Georgia,"Times New Roman",serif;
  --mm-hand:"Pinyon Script","Segoe Script",cursive;
  --mm-keys:"Cascadia Mono",Consolas,ui-monospace,monospace;
  --mm-ease:cubic-bezier(.2,.7,.2,1);
  --mm-quick:180ms;
  --mm-slow:320ms;
  --mm-tick:12px;

  --page:#0b0709;
  --page-rule:rgba(207,169,104,.16);
  --mm-rule-ground:#0b0709;
  --gutter:clamp(16px,4vw,48px);
  --wide:1140px;
  --measure:70ch;
  --top-h:64px;
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--page);scroll-behavior:smooth;scroll-padding-top:calc(var(--top-h) + 24px)}
#mm-main{overflow-x:clip} /* the page-header glow runs past the edge on phones */
body::before{content:"";position:fixed;inset:0;z-index:70;pointer-events:none;opacity:.07;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .92 0 0 0 0 .88 0 0 0 0 .84 0 0 0 .7 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url%28%23n%29'/%3E%3C/svg%3E") 0 0/180px 180px}
body{
  margin:0;background:var(--page);color:var(--mm-ink);
  font:400 17px/1.7 var(--mm-text);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,video,iframe{max-width:100%;height:auto}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:1px solid var(--mm-brass);outline-offset:3px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.mm-wrap{max-width:var(--wide);margin-inline:auto;padding-inline:var(--gutter)}
.mm-eyebrow{font:600 11px/1.3 var(--mm-display);letter-spacing:.24em;text-transform:uppercase;color:var(--mm-brass);margin:0}

/* ---------- 2. Kit components ---------- */
.mm-frame,.is-style-mm-frame{
  position:relative;
  border:1px solid var(--mm-brass-soft);
  background:
    linear-gradient(var(--mm-brass),var(--mm-brass)) left top/var(--mm-tick) 1px no-repeat,
    linear-gradient(var(--mm-brass),var(--mm-brass)) left top/1px var(--mm-tick) no-repeat,
    linear-gradient(var(--mm-brass),var(--mm-brass)) right top/var(--mm-tick) 1px no-repeat,
    linear-gradient(var(--mm-brass),var(--mm-brass)) right top/1px var(--mm-tick) no-repeat,
    linear-gradient(var(--mm-brass),var(--mm-brass)) left bottom/var(--mm-tick) 1px no-repeat,
    linear-gradient(var(--mm-brass),var(--mm-brass)) left bottom/1px var(--mm-tick) no-repeat,
    linear-gradient(var(--mm-brass),var(--mm-brass)) right bottom/var(--mm-tick) 1px no-repeat,
    linear-gradient(var(--mm-brass),var(--mm-brass)) right bottom/1px var(--mm-tick) no-repeat,
    var(--mm-ground,var(--mm-night-90));
  background-origin:border-box;
}

.mm-rule{position:relative;height:1px;margin:0;border:0;background:var(--mm-brass-line);overflow:visible}
.mm-rule::after{content:"";position:absolute;left:50%;top:-4px;width:7px;height:7px;margin-left:-4.5px;background:var(--mm-rule-ground);border:1px solid var(--mm-brass);transform:rotate(45deg)}

.mm-plate{display:inline-block;padding:3px 11px 2px;white-space:nowrap;font:600 9.5px/1.3 var(--mm-display);letter-spacing:.18em;text-transform:uppercase;color:var(--mm-brass);background:rgba(207,169,104,.14);
  clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 50%,calc(100% - 6px) 100%,6px 100%,0 50%)}

.mm-btn,
.wp-block-button__link,
.wp-element-button{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 16px 9px;border:1px solid var(--mm-brass-line);border-radius:2px;
  background:transparent;color:var(--mm-ink);cursor:pointer;text-decoration:none;
  font:600 11px/1.2 var(--mm-display);letter-spacing:.16em;text-transform:uppercase;
  transition:border-color var(--mm-quick) var(--mm-ease),background-color var(--mm-quick) var(--mm-ease),color var(--mm-quick) var(--mm-ease);
}
.mm-btn:hover,.wp-block-button__link:hover,.wp-element-button:hover{border-color:var(--mm-brass-lit);background-color:var(--mm-brass-wash);color:var(--mm-ink)}
.mm-btn:active,.wp-block-button__link:active{transform:translateY(1px)}
.mm-btn.is-primary,
.is-style-mm-primary .wp-block-button__link{border-color:var(--mm-brass);background-color:rgba(207,169,104,.16);color:#f6ecd8}
.mm-btn.is-primary:hover,
.is-style-mm-primary .wp-block-button__link:hover{background-color:rgba(207,169,104,.25)}

.mm-dots{display:inline-flex;gap:5px}
.mm-dot{display:inline-block;width:12px;height:12px;border:1px solid var(--mm-brass-lit);border-radius:50%}
.mm-dot.is-on{background:var(--mm-brass);border-color:var(--mm-brass)}

/* ---------- 3. Page chrome ---------- */
.mm-skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 14px;background:var(--mm-brass);color:#1d1409;font:600 12px var(--mm-display);letter-spacing:.12em;text-decoration:none;transition:top var(--mm-quick)}
.mm-skip:focus{top:12px}

.mm-top{position:sticky;top:0;z-index:40;background:rgba(11,7,9,.94);border-bottom:1px solid var(--mm-brass-soft)}
.admin-bar .mm-top{top:32px}
.mm-top .mm-wrap{display:flex;align-items:center;gap:28px;min-height:var(--top-h)}
.mm-brand{margin-right:auto;display:flex;align-items:center;gap:12px;text-decoration:none}
.mm-brand img{max-height:36px;width:auto}
.mm-brand span{white-space:nowrap;font:600 13px/1.2 var(--mm-display);letter-spacing:.22em;text-transform:uppercase;color:var(--mm-brass)}
.mm-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px}
.mm-nav a{position:relative;display:block;white-space:nowrap;padding:10px 12px;text-decoration:none;font:500 11px/1 var(--mm-display);letter-spacing:.16em;text-transform:uppercase;color:var(--mm-ash);transition:color var(--mm-quick) var(--mm-ease)}
.mm-nav a:hover,.mm-nav .current-menu-item > a,.mm-nav .current_page_item > a,.mm-nav .current-menu-ancestor > a{color:var(--mm-ink)}
.mm-nav .current-menu-item > a::after,.mm-nav .current_page_item > a::after{content:"";position:absolute;left:50%;bottom:0;width:6px;height:6px;margin-left:-3px;background:var(--mm-vitae);border-radius:0 50% 50% 50%;transform:rotate(45deg)}
.mm-actions{display:flex;align-items:center;gap:10px}
.mm-menu-toggle{display:none;background:none;border:1px solid var(--mm-brass-line);border-radius:2px;padding:9px 12px 8px;cursor:pointer;font:600 10.5px/1 var(--mm-display);letter-spacing:.16em;text-transform:uppercase;color:var(--mm-ink)}

.mm-foot{margin-top:clamp(64px,9vw,112px);padding-block:0 56px}
.mm-foot .mm-rule{margin-bottom:28px}
.mm-foot-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 32px;align-items:flex-start}
.mm-foot-brand{font:600 12px/1.4 var(--mm-display);letter-spacing:.22em;text-transform:uppercase;color:var(--mm-brass);margin:0}
.mm-foot-credit{font:italic 400 14px/1.5 var(--mm-text);color:var(--mm-smoke);margin:4px 0 0}
.mm-foot nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 20px}
.mm-foot nav a{text-decoration:none;font:500 11px/1.4 var(--mm-display);letter-spacing:.2em;text-transform:uppercase;color:var(--mm-smoke);transition:color var(--mm-quick)}
.mm-foot nav a:hover{color:var(--mm-ink)}
.mm-legal{margin:20px 0 0;font-size:13.5px;line-height:1.55;color:var(--mm-smoke);max-width:78ch}
.mm-darkpack{display:flex;align-items:center;gap:14px;margin-top:14px}
.mm-darkpack p{margin:0;font-size:12.5px;line-height:1.5;color:var(--mm-smoke);max-width:78ch}
.mm-darkpack a{color:inherit;text-decoration-color:var(--mm-brass-line);text-underline-offset:2px;transition:color var(--mm-quick)}
.mm-darkpack a:hover{color:var(--mm-ink)}
.mm-darkpack-logo{flex:none;width:auto;height:44px;opacity:.8;transition:opacity var(--mm-quick)}
.mm-darkpack:hover .mm-darkpack-logo{opacity:1}

/* ---------- 4. Front page ---------- */
.mm-hero{padding-block:clamp(64px,10vw,128px) clamp(48px,7vw,80px);display:grid;gap:26px}
.mm-hero h1{margin:0;font:500 clamp(36px,5.4vw,66px)/1.1 var(--mm-display);letter-spacing:.03em;max-width:20ch;text-wrap:balance}
.mm-hero h1 span{display:block;margin-top:.3em;font:italic 400 .56em/1.4 var(--mm-text);letter-spacing:0;color:var(--mm-ash)}
.mm-hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.mm-paths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:18px}
.mm-path{--mm-ground:rgba(20,12,16,.9);display:grid;align-content:start;grid-template-columns:1fr auto;gap:8px 18px;padding:24px 24px 26px;text-decoration:none;color:var(--mm-ink);
  transition:border-color var(--mm-quick) var(--mm-ease)}
.mm-path:hover{border-color:var(--mm-brass-line);--mm-ground:rgba(32,20,24,.9)}
.mm-path .mm-eyebrow{grid-column:1/-1;color:var(--mm-ash)}
.mm-path h2{grid-column:1;margin:0;font:500 clamp(20px,2vw,25px)/1.2 var(--mm-display);letter-spacing:.04em}
.mm-path p{grid-column:1;margin:0;font-size:15px;line-height:1.55;color:var(--mm-ash)}
.mm-path .mm-go{grid-column:2;grid-row:3/span 2;align-self:center;width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--mm-brass-line);transform:rotate(45deg);
  transition:border-color var(--mm-quick),transform var(--mm-slow) var(--mm-ease)}
.mm-path .mm-go i{transform:rotate(-45deg);font-style:normal;color:var(--mm-brass);font-size:14px}
.mm-path:hover .mm-go{border-color:var(--mm-brass);transform:rotate(45deg) translate(3px,-3px)}

/* ---------- 5. Page header and prose ---------- */
.mm-page-head{padding-block:clamp(56px,8vw,96px) 28px;display:grid;gap:12px}
.mm-page-head h1{margin:0;font:500 clamp(32px,4.4vw,52px)/1.12 var(--mm-display);letter-spacing:.03em;text-wrap:balance}
.mm-page-head .mm-lede{margin:4px 0 0;font-size:19px;line-height:1.6;color:var(--mm-ash);max-width:62ch}
.mm-page-head + .mm-rule{margin-bottom:clamp(36px,5vw,56px)}

:is(.mm-prose,.is-root-container){max-width:var(--measure)}
:is(.mm-prose,.is-root-container) > *{margin-block:0 1.1em}
:is(.mm-prose,.is-root-container) > :last-child{margin-bottom:0}
:is(.mm-prose,.is-root-container) .alignwide{max-width:var(--wide);width:min(var(--wide),calc(100vw - 2 * var(--gutter)))}
.mm-front .mm-prose{max-width:none}
.mm-front .mm-prose > :not(.alignwide):not(.alignfull):not(.wp-block-columns):not(.wp-block-group){max-width:var(--measure)}

:is(.mm-prose,.is-root-container) h2,:is(.mm-prose,.is-root-container) h3,:is(.mm-prose,.is-root-container) h4{font-family:var(--mm-display);text-wrap:balance;color:var(--mm-ink)}
:is(.mm-prose,.is-root-container) h2{font-weight:500;font-size:clamp(24px,2.6vw,31px);line-height:1.2;letter-spacing:.04em;margin-top:2em}
:is(.mm-prose,.is-root-container) h3{font-weight:600;font-size:15px;line-height:1.4;letter-spacing:.14em;text-transform:uppercase;margin-top:1.8em;margin-bottom:.6em}
:is(.mm-prose,.is-root-container) h4{font-weight:600;font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--mm-brass);margin-top:1.6em;margin-bottom:.5em}
:is(.mm-prose,.is-root-container) > h2:first-child,:is(.mm-prose,.is-root-container) > h3:first-child{margin-top:0}
:is(.mm-prose,.is-root-container) p{color:var(--mm-ink)}
:is(.mm-prose,.is-root-container) a{color:var(--mm-brass);text-decoration:underline;text-decoration-color:var(--mm-brass-line);text-underline-offset:3px;transition:text-decoration-color var(--mm-quick)}
:is(.mm-prose,.is-root-container) a:hover{text-decoration-color:var(--mm-brass)}
:is(.mm-prose,.is-root-container) a.wp-block-button__link,:is(.mm-prose,.is-root-container) a.mm-btn{color:var(--mm-ink);text-decoration:none}
:is(.mm-prose,.is-root-container) .is-style-mm-primary a.wp-block-button__link,:is(.mm-prose,.is-root-container) a.mm-btn.is-primary{color:#f6ecd8}
:is(.mm-prose,.is-root-container) strong{font-weight:600}
:is(.mm-prose,.is-root-container) em{color:inherit}

:is(.mm-prose,.is-root-container) ul:not(.wp-block-gallery){list-style:none;padding-left:0}
:is(.mm-prose,.is-root-container) ul:not(.wp-block-gallery) > li{position:relative;padding-left:22px;margin-bottom:.45em}
:is(.mm-prose,.is-root-container) ul:not(.wp-block-gallery) > li::before{content:"";position:absolute;left:3px;top:.68em;width:6px;height:6px;border:1px solid var(--mm-brass);transform:rotate(45deg)}
:is(.mm-prose,.is-root-container) ol{counter-reset:mm;list-style:none;padding-left:0}
:is(.mm-prose,.is-root-container) ol > li{counter-increment:mm;position:relative;padding-left:38px;margin-bottom:.6em}
:is(.mm-prose,.is-root-container) ol > li::before{content:counter(mm);position:absolute;left:0;top:-.05em;font:500 20px/1.4 var(--mm-display);color:var(--mm-brass)}

:is(.mm-prose,.is-root-container) code,.mm-key{font-family:var(--mm-keys);font-size:.86em;color:var(--mm-brass);background:var(--mm-brass-wash);padding:1px 6px;border-radius:2px;white-space:nowrap}
:is(.mm-prose,.is-root-container) pre{overflow-x:auto;padding:16px 18px;background:var(--mm-velvet);border-left:2px solid var(--mm-steel);font:400 14px/1.6 var(--mm-keys)}
:is(.mm-prose,.is-root-container) pre code{background:none;padding:0;white-space:pre;color:var(--mm-ink)}

:is(.mm-prose,.is-root-container) blockquote,:is(.mm-prose,.is-root-container) .wp-block-quote{margin-inline:0;padding:12px 16px 13px 17px;background:var(--mm-velvet);border-left:2px solid var(--mm-brass-line)}
:is(.mm-prose,.is-root-container) blockquote p:last-child{margin-bottom:0}
:is(.mm-prose,.is-root-container) blockquote cite{display:block;margin-top:6px;font:600 10px/1.3 var(--mm-display);letter-spacing:.2em;text-transform:uppercase;font-style:normal;color:var(--mm-ash)}

:is(.mm-prose,.is-root-container) hr,:is(.mm-prose,.is-root-container) .wp-block-separator{position:relative;height:1px;border:0;margin-block:2.4em;background:var(--mm-brass-line);overflow:visible;opacity:1}
:is(.mm-prose,.is-root-container) hr::after,:is(.mm-prose,.is-root-container) .wp-block-separator::after{content:"";position:absolute;left:50%;top:-4px;width:7px;height:7px;margin-left:-4.5px;background:var(--mm-rule-ground);border:1px solid var(--mm-brass);transform:rotate(45deg)}

:is(.mm-prose,.is-root-container) table{width:100%;border-collapse:collapse;font-size:15.5px}
:is(.mm-prose,.is-root-container) .wp-block-table{overflow-x:auto}
:is(.mm-prose,.is-root-container) th,:is(.mm-prose,.is-root-container) td{padding:9px 12px 9px 0;border-top:1px solid var(--page-rule);text-align:left;vertical-align:top}
:is(.mm-prose,.is-root-container) th{font:600 11.5px/1.5 var(--mm-display);letter-spacing:.14em;text-transform:uppercase;color:var(--mm-ash)}

:is(.mm-prose,.is-root-container) details{border-top:1px solid var(--page-rule);padding-block:4px}
:is(.mm-prose,.is-root-container) details:last-of-type{border-bottom:1px solid var(--page-rule)}
:is(.mm-prose,.is-root-container) summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:12px 0;font:600 13px/1.4 var(--mm-display);letter-spacing:.12em;text-transform:uppercase}
:is(.mm-prose,.is-root-container) summary::-webkit-details-marker{display:none}
:is(.mm-prose,.is-root-container) summary::before{content:"";flex:0 0 7px;width:7px;height:7px;border:1px solid var(--mm-brass);transform:rotate(45deg);transition:background-color var(--mm-quick) var(--mm-ease)}
:is(.mm-prose,.is-root-container) details[open] summary::before{background:var(--mm-brass)}
:is(.mm-prose,.is-root-container) details > :not(summary){color:var(--mm-ash)}

:is(.mm-prose,.is-root-container) .wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px;margin-block:1.6em}
:is(.mm-prose,.is-root-container) .wp-block-columns{gap:18px;margin-block:1.8em}
:is(.mm-prose,.is-root-container) .wp-block-column > :last-child{margin-bottom:0}
:is(.mm-prose,.is-root-container) .wp-block-image img{display:block}
:is(.mm-prose,.is-root-container) figcaption{font-size:14px;font-style:italic;color:var(--mm-smoke);margin-top:8px}

/* ---------- 6. Block styles ---------- */
:is(.mm-prose,.is-root-container) .is-style-mm-frame{--mm-ground:rgba(20,12,16,.9);padding:22px 22px 24px}
:is(.mm-prose,.is-root-container) .is-style-mm-frame > :last-child{margin-bottom:0}
:is(.mm-prose,.is-root-container) .is-style-mm-frame h3{margin-top:0}
.wp-block-image.is-style-mm-frame{padding:8px}

:is(.mm-prose,.is-root-container) .is-style-mm-world{border-left-color:var(--mm-violet)}
:is(.mm-prose,.is-root-container) .is-style-mm-world p{font-style:italic}
:is(.mm-prose,.is-root-container) .is-style-mm-world::before,:is(.mm-prose,.is-root-container) .is-style-mm-keys::before{display:block;margin-bottom:5px;font:600 10px/1.2 var(--mm-display);letter-spacing:.2em;text-transform:uppercase}
:is(.mm-prose,.is-root-container) .is-style-mm-world::before{content:"The world";color:var(--mm-violet)}
:is(.mm-prose,.is-root-container) .is-style-mm-keys{border-left-color:var(--mm-steel)}
:is(.mm-prose,.is-root-container) .is-style-mm-keys::before{content:"The keys";color:var(--mm-steel)}

:is(.mm-prose,.is-root-container) .is-style-mm-rules{padding:0}
:is(.mm-prose,.is-root-container) ul.is-style-mm-rules > li{padding:14px 0 14px 24px;margin:0;border-top:1px solid var(--page-rule);color:var(--mm-ash)}
:is(.mm-prose,.is-root-container) ul.is-style-mm-rules > li:last-child{border-bottom:1px solid var(--page-rule)}
:is(.mm-prose,.is-root-container) ul.is-style-mm-rules > li::before{top:1.45em}
:is(.mm-prose,.is-root-container) ul.is-style-mm-rules strong{display:block;margin-bottom:2px;font:600 12.5px/1.5 var(--mm-display);letter-spacing:.12em;text-transform:uppercase;color:var(--mm-ink)}

:is(.mm-prose,.is-root-container) ol.is-style-mm-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 28px}
:is(.mm-prose,.is-root-container) ol.is-style-mm-steps > li{margin:0;padding:16px 0 18px;border-top:1px solid var(--page-rule);color:var(--mm-ash)}
:is(.mm-prose,.is-root-container) ol.is-style-mm-steps > li::before{position:static;display:block;margin-bottom:6px;font:400 11px/1 var(--mm-text);letter-spacing:4px;color:var(--mm-brass);content:"●"}
:is(.mm-prose,.is-root-container) ol.is-style-mm-steps > li:nth-child(2)::before{content:"●●"}
:is(.mm-prose,.is-root-container) ol.is-style-mm-steps > li:nth-child(3)::before{content:"●●●"}
:is(.mm-prose,.is-root-container) ol.is-style-mm-steps > li:nth-child(4)::before{content:"●●●●"}
:is(.mm-prose,.is-root-container) ol.is-style-mm-steps > li:nth-child(n+5)::before{content:"●●●●●"}
:is(.mm-prose,.is-root-container) ol.is-style-mm-steps strong{display:block;font:600 12.5px/1.6 var(--mm-display);letter-spacing:.12em;text-transform:uppercase;color:var(--mm-ink)}

:is(.mm-prose,.is-root-container) .is-style-mm-plate{display:inline-block}
:is(.mm-prose,.is-root-container) p.is-style-mm-eyebrow + :is(h2,h3){margin-top:0}
:is(.mm-prose,.is-root-container) p.is-style-mm-eyebrow{font:600 11px/1.3 var(--mm-display);letter-spacing:.24em;text-transform:uppercase;color:var(--mm-brass);margin-bottom:.4em}
:is(.mm-prose,.is-root-container) p.is-style-mm-lede{font-size:19px;line-height:1.6;color:var(--mm-ash)}
:is(.mm-prose,.is-root-container) p.is-style-mm-signed{font:400 34px/1.2 var(--mm-hand);color:var(--mm-ink)}

/* ---------- 7. Handbook template ---------- */
.mm-handbook{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start}
.mm-rail{position:sticky;top:calc(var(--top-h) + 24px);max-height:calc(100vh - var(--top-h) - 48px);overflow-y:auto;padding-right:6px}
.admin-bar .mm-rail{top:calc(var(--top-h) + 56px)}
.mm-rail-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding-bottom:10px;margin-bottom:6px;border-bottom:1px solid var(--mm-brass-soft)}
.mm-rail-count{font:600 12.5px/1 var(--mm-text);font-variant-numeric:tabular-nums lining-nums;color:var(--mm-brass)}
.mm-rail ol{list-style:none;margin:0;padding:0;display:grid;gap:1px}
.mm-rail a{display:flex;align-items:center;gap:10px;padding:7px 8px;text-decoration:none;font:400 14px/1.35 var(--mm-text);color:var(--mm-ash);
  transition:color var(--mm-quick) var(--mm-ease),background-color var(--mm-quick) var(--mm-ease)}
.mm-rail a::before{content:"";flex:0 0 8px;width:8px;height:8px;border:1px solid var(--mm-brass-line);transform:rotate(45deg);transition:border-color var(--mm-quick),background-color var(--mm-quick)}
.mm-rail a:hover{color:var(--mm-ink);background:rgba(207,169,104,.05)}
.mm-rail a.is-read::before{background:var(--mm-brass-line);border-color:var(--mm-brass-line)}
.mm-rail a.is-active{color:var(--mm-ink);background:var(--mm-brass-wash)}
.mm-rail a.is-active::before{border-color:var(--mm-brass);background:var(--mm-brass)}
.mm-rail[hidden]{display:none}
.mm-rail-sub{display:none!important;margin:2px 0 8px 17px!important;padding-left:10px!important;border-left:1px solid var(--mm-brass-soft)}
.mm-rail li.is-open > .mm-rail-sub{display:grid!important}
.mm-rail a.is-sub{padding:4px 8px;font-size:13px;line-height:1.35;color:var(--mm-smoke)}
.mm-rail a.is-sub::before{display:none}
.mm-rail a.is-sub:hover{color:var(--mm-ink)}
.mm-rail a.is-sub.is-active{color:var(--mm-ink);background:none;box-shadow:inset 2px 0 0 var(--mm-vitae)}
.mm-handbook .mm-prose h3[id]{padding-top:1.4em;border-top:1px solid var(--page-rule);margin-top:2.2em;font-size:16px}
.mm-handbook .mm-prose h2 + h3[id]{border-top:0;padding-top:0;margin-top:1.2em}
.mm-handbook:has(> .mm-rail[hidden]),.mm-handbook.no-rail{grid-template-columns:minmax(0,1fr)}

/* ---------- 9. Life: the night, the blood, the court ---------- */
/* The front page sky. The canvas is painted by assets/js/night.js; the gradient is what shows before it loads. */
.mm-night{position:relative;isolation:isolate;overflow:hidden;
  background:linear-gradient(180deg,#060408 0%,#0c070b 50%,#1e0d0e 80%,#0a0607 100%)}
.mm-night::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;box-shadow:inset 0 0 180px 40px rgba(0,0,0,.85)}
.mm-rain{position:absolute;top:-120px;left:0;right:-40px;bottom:0;z-index:-1;pointer-events:none;opacity:.09;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg stroke='%23c8bcd0' stroke-width='1' stroke-linecap='round' fill='none'%3E%3Cpath d='M20 0l-5 20M72 28l-5 20M108 58l-5 20M42 74l-5 20M92 96l-4 16M12 48l-4 16M58 4l-3 12M114 14l-3 12'/%3E%3C/g%3E%3C/svg%3E") 0 0/120px 120px;animation:mm-rain .65s linear infinite;will-change:transform}
.mm-night.is-offscreen .mm-rain{animation-play-state:paused}
@keyframes mm-rain{to{transform:translate3d(-30px,120px,0)}}
.mm-night::after{content:"";position:absolute;left:0;right:0;bottom:0;height:28%;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(11,7,9,0),var(--page))}
.mm-night-sky{position:absolute;inset:0;width:100%;height:100%;z-index:-2;display:block}
.mm-night-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;
  background:radial-gradient(420px circle at var(--gx,70%) var(--gy,30%),rgba(216,121,47,.08),rgba(216,121,47,0) 65%);
  transition:opacity var(--mm-slow) var(--mm-ease)}
.mm-night-glow.is-lit{opacity:1}
.mm-night .mm-hero{padding-block:clamp(80px,12vw,150px) clamp(130px,15vw,200px)}
.mm-night .mm-hero h1{text-shadow:0 2px 28px rgba(0,0,0,.65)}
.mm-night .mm-hero h1 span{text-shadow:0 1px 18px rgba(0,0,0,.8)}

.mm-tonight{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0;font:italic 400 15px/1.5 var(--mm-text);color:var(--mm-ash)}
.mm-tonight[hidden]{display:none}
.mm-tonight span{display:inline-flex;align-items:baseline;gap:9px}
.mm-tonight b{font:600 10px/1 var(--mm-display);font-style:normal;letter-spacing:.22em;text-transform:uppercase;color:var(--mm-brass)}
.mm-tonight-restart b{color:var(--mm-vitae)}
.mm-tonight [hidden]{display:none}

/* The three doors sit over the bottom of the sky. */
.mm-night + .mm-wrap .mm-paths{position:relative;z-index:2;margin-top:calc(-1 * clamp(84px,10vw,130px))}
.mm-path{isolation:isolate;overflow:hidden}
.mm-path::after{content:"";position:absolute;left:0;right:0;top:0;height:46%;z-index:-1;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 80' preserveAspectRatio='none'%3E%3Cpath fill='%235e1320' d='M0 0H300V14C292 14 291 38 286 38C281 38 282 16 272 16C262 16 262 60 255 60C248 60 249 18 238 18C226 18 228 30 222 30C216 30 217 15 205 15C193 15 194 70 186 70C178 70 180 17 168 17C156 17 157 34 151 34C145 34 146 14 132 14C118 14 120 48 113 48C106 48 108 16 95 16C82 16 84 26 78 26C72 26 73 15 60 15C47 15 48 56 41 56C34 56 36 16 24 16C12 16 13 30 7 30C2 30 3 14 0 14Z'/%3E%3C/svg%3E") top/100% 100% no-repeat;opacity:.9;transform:scaleY(0);transform-origin:top;
  transition:transform 520ms var(--mm-ease)}
.mm-path:hover::after,.mm-path:focus-visible::after{transform:scaleY(1)}
.mm-sigil{grid-column:1/-1;width:34px;height:34px;margin-bottom:6px;color:var(--mm-brass);transition:transform var(--mm-slow) var(--mm-ease)}
.mm-path:hover .mm-sigil{transform:translateY(-2px)}
.mm-ico{display:block;width:100%;height:100%;overflow:visible}
.mm-vitae-fill{fill:var(--mm-vitae-deep);stroke:none}
.mm-flame{fill:rgba(255,190,110,.22);transform-origin:16px 9px;transition:fill var(--mm-slow) var(--mm-ease)}
.mm-path:hover .mm-flame{fill:rgba(255,190,110,.55);animation:mm-flame 1.4s ease-in-out infinite alternate}
@keyframes mm-flame{from{transform:scale(1,1)}to{transform:scale(.92,1.08)}}

/* The mask in the header, when no logo is uploaded. */
.mm-brand .mm-ico-mask{width:30px;height:13px;color:var(--mm-brass)}
.mm-mask-fill{fill:currentColor;stroke:none}

/* Barbed wire, with a small red-hearted rose at its centre. */
.mm-wire{position:relative;height:16px;border:0;margin:clamp(48px,7vw,80px) 0 0;overflow:visible;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='16'%3E%3Cg fill='none' stroke='%23cfa968' stroke-opacity='.42' stroke-width='1' stroke-linecap='round'%3E%3Cpath d='M0 8c11-4 11 4 22 0s11-4 22 0'/%3E%3Cpath d='M0 8c11 4 11-4 22 0s11 4 22 0'/%3E%3Cpath d='M18 3.5l8 9M26 3.5l-8 9'/%3E%3Ccircle cx='22' cy='8' r='1.6'/%3E%3C/g%3E%3C/svg%3E") center/44px 16px repeat-x}
.mm-wire::after{content:"";position:absolute;left:50%;top:50%;width:36px;height:36px;margin:-18px 0 0 -18px;
  background:var(--page) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23cfa968' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath fill='%238e2230' fill-opacity='.45' d='M7.5 10.5c0 3 2 5.5 4.5 5.5s4.5-2.5 4.5-5.5c-1.2-2.4-2.6-3.6-4.5-3.6s-3.3 1.2-4.5 3.6z'/%3E%3Cpath d='M12 8.6c1.8 0 3 1.1 3 2.6 0 1.3-1 2.2-2.2 2.2-1 0-1.8-.7-1.8-1.7 0-.7.5-1.3 1.2-1.3'/%3E%3Cpath d='M12 16v5'/%3E%3Cpath d='M12 19c-1.5-.2-2.6-1-3-2.2 1.3-.2 2.4.3 3 1.2'/%3E%3Cpath d='M12 18.5c1.4-.3 2.3-1.1 2.7-2.2-1.2-.1-2.2.4-2.7 1.3'/%3E%3C/g%3E%3C/svg%3E") center/24px 24px no-repeat}
.mm-foot .mm-wire{margin:0 0 28px}
.mm-front-body{padding-block:clamp(32px,5vw,56px) 0}

/* Every page header gets a little candlelight and mist. */
.mm-page-head{position:relative;isolation:isolate}
.mm-page-head::before{content:"";position:absolute;z-index:-1;pointer-events:none;top:-40px;right:-10%;width:min(620px,80vw);height:360px;
  background:radial-gradient(closest-side,rgba(207,169,104,.08),rgba(207,169,104,0)),radial-gradient(closest-side at 70% 60%,rgba(142,34,48,.10),rgba(142,34,48,0))}
.mm-foot-links{display:flex;gap:18px;margin:10px 0 0}
.mm-foot-links a{text-decoration:none;font:500 11px/1.4 var(--mm-display);letter-spacing:.2em;text-transform:uppercase;color:var(--mm-brass);transition:color var(--mm-quick)}
.mm-foot-links a:hover{color:var(--mm-ink)}
.mm-foot-motto{margin:6px 0 0;font:italic 400 14px/1.5 var(--mm-text);color:var(--mm-ash)}

/* The Handbook rail fills a blood pool as you read. */
.mm-rail-pool{display:flex;flex-wrap:wrap;gap:3px;max-width:120px;justify-content:flex-end}
.mm-rail-pool i{display:block;width:8px;height:8px;border:1px solid var(--mm-vitae-line);transition:background-color var(--mm-slow) var(--mm-ease),border-color var(--mm-slow) var(--mm-ease)}
.mm-rail-pool i.is-full{background:var(--mm-vitae-deep);border-color:var(--mm-vitae)}

/* Language picker */
.mm-lang{position:relative}
.mm-lang-toggle{background:none;border:1px solid transparent;border-radius:2px;padding:9px 10px 8px;cursor:pointer;font:600 11px/1 var(--mm-display);letter-spacing:.16em;color:var(--mm-ash);transition:color var(--mm-quick),border-color var(--mm-quick)}
.mm-lang-toggle:hover,.mm-lang-toggle[aria-expanded="true"]{color:var(--mm-ink);border-color:var(--mm-brass-line)}
.mm-lang-list{--mm-ground:rgba(14,9,12,.98);position:absolute;right:0;top:calc(100% + 8px);z-index:50;min-width:190px;margin:0;padding:6px;list-style:none;
  border:1px solid var(--mm-brass-soft);background:var(--mm-ground);box-shadow:0 18px 54px rgba(0,0,0,.55)}
.mm-lang-list[hidden]{display:none}
.mm-lang-list a{display:flex;align-items:baseline;gap:12px;padding:8px 10px;text-decoration:none;font:400 15px/1.3 var(--mm-text);color:var(--mm-ash);transition:color var(--mm-quick),background-color var(--mm-quick)}
.mm-lang-list a span{min-width:22px;font:600 10px/1 var(--mm-display);letter-spacing:.16em;color:var(--mm-brass)}
.mm-lang-list a:hover,.mm-lang-list a[aria-current]{color:var(--mm-ink);background:var(--mm-brass-wash)}
.mm-lang-list a em{margin-left:auto;font:italic 400 12px/1 var(--mm-text);color:var(--mm-vitae)}

/* ---------- 8. Responsive and motion ---------- */
@media (max-width:1180px) and (min-width:861px){
  .mm-brand span{font-size:12px;letter-spacing:.14em}
  .mm-nav a{padding-inline:8px}
  .mm-top .mm-wrap{gap:18px}
}
@media (max-width:980px){
  .mm-paths{grid-template-columns:1fr}
  .mm-night + .mm-wrap .mm-paths{margin-top:calc(-1 * clamp(56px,10vw,90px))}
  .mm-handbook{grid-template-columns:minmax(0,1fr)}
  .mm-rail{position:static;max-height:none;padding:14px 16px;border:1px solid var(--mm-brass-soft);background:var(--mm-night-90)}
}
@media (max-width:860px){
  .mm-menu-toggle{display:inline-flex}
  .mm-nav{position:absolute;left:0;right:0;top:100%;background:rgba(11,7,9,.98);border-bottom:1px solid var(--mm-brass-soft);
    padding:8px var(--gutter) 16px;opacity:0;transform:translateY(-6px);pointer-events:none;visibility:hidden;
    transition:opacity var(--mm-slow) var(--mm-ease),transform var(--mm-slow) var(--mm-ease),visibility 0s linear var(--mm-slow)}
  .mm-nav.is-open{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition-delay:0s}
  .mm-nav ul{flex-direction:column}
  .mm-nav a{padding:12px 0;font-size:12px}
  .mm-nav .current-menu-item > a::after,.mm-nav .current_page_item > a::after{left:auto;right:0;bottom:50%;margin-bottom:-2.5px}
  .mm-actions .mm-btn:not(.is-primary){display:none}
  .mm-top .mm-wrap{gap:12px}
  .mm-brand span{font-size:11px;letter-spacing:.16em;line-height:1.35;white-space:normal}
}
@media (max-width:782px){.admin-bar .mm-top{top:46px}}
@media (max-width:600px){.admin-bar .mm-top{top:0}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}
