/* Caveat (handwritten notes on the pages), self-hosted, SIL OFL 1.1 */
@font-face{font-family:"Caveat";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/caveat-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Caveat";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/caveat-latin-600-normal.woff2) format("woff2")}
/* Maelana Nightingale · opening sequence (book intro). Self-contained; everything is drawn in code except her logo. */
#mn-intro-root:empty{display:none}
html.mn-intro-lock,html.mn-intro-lock body{overflow:hidden!important}
#mn-intro{
  --w:min(62vw,44vh,400px);--h:calc(var(--w)*1.46);--d:calc(var(--w)*.11);
  --gold:#d8b46a;--gold-hi:#f6e2a8;--gold-lo:#8a6a2c;--ink:#07050a;
  position:fixed;inset:0;z-index:2147483000;background:radial-gradient(ellipse at 50% 42%,#1d0f18 0%,#0d070c 45%,var(--ink) 80%);
  overflow:hidden;color:#efe6d6;font-family:Jost,system-ui,sans-serif;-webkit-tap-highlight-color:transparent}
#mn-intro canvas.dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#mn-intro .vig{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 45%,rgba(0,0,0,.65) 100%)}
#mn-intro .mi-stage{position:absolute;inset:0;display:grid;place-items:center;perspective:1700px;perspective-origin:50% 45%}
#mn-intro .cam,#mn-intro .mi-bk,#mn-intro .mi-cover,#mn-intro .pg{transform-style:preserve-3d}
#mn-intro .cam{width:var(--w);height:var(--h);opacity:0;will-change:transform,opacity}
#mn-intro .mi-bk{position:relative;width:100%;height:100%;will-change:transform}
#mn-intro .mi-bk>*{position:absolute}

/* ---------- leather ---------- */
#mn-intro .leather{
  background-color:#3b0f1f;
  background-image:
    radial-gradient(ellipse at 40% 35%,rgba(150,40,70,.35),transparent 60%),
    radial-gradient(ellipse at 50% 50%,transparent 55%,rgba(0,0,0,.55) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .7 -.18'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='turbulence' baseFrequency='.018 .03' numOctaves='2' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -.55 .32'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E");
  background-size:100% 100%,100% 100%,180px 180px,100% 100%}

/* ---------- back, spine, page edges ---------- */
#mn-intro .back{inset:0;border-radius:3px 8px 8px 3px;transform:translateZ(calc(var(--d)/-2)) rotateY(180deg);box-shadow:0 30px 60px rgba(0,0,0,.6)}
#mn-intro .spine{top:0;height:100%;width:var(--d);left:calc(var(--d)/-2);transform:rotateY(-90deg);border-radius:6px;
  background-image:repeating-linear-gradient(180deg,transparent 0 15%,rgba(216,180,106,.0) 15%,var(--gold) 15.4%,#3b0f1f 16%,var(--gold) 16.6%,transparent 17%,transparent 22%),
    linear-gradient(90deg,rgba(0,0,0,.6),rgba(255,255,255,.08) 50%,rgba(0,0,0,.6))}
#mn-intro .edge{background:repeating-linear-gradient(90deg,#efe0bd 0 1px,#d8c49a 1px 2px,#f4e8cc 2px 3px);}
#mn-intro .edge.r{top:4px;height:calc(100% - 8px);width:calc(var(--d) - 4px);left:calc(100% - 4px - (var(--d) - 4px)/2);transform:rotateY(90deg);
  background:repeating-linear-gradient(90deg,#efe0bd 0 1px,#cdb88d 1px 2px,#f6ebd2 2px 3px);box-shadow:inset 0 0 12px rgba(120,80,30,.35)}
#mn-intro .edge.t,#mn-intro .edge.b{left:2px;width:calc(100% - 8px);height:calc(var(--d) - 4px);
  background:repeating-linear-gradient(180deg,#efe0bd 0 1px,#cdb88d 1px 2px,#f6ebd2 2px 3px)}
#mn-intro .edge.t{top:calc(4px - (var(--d) - 4px)/2);transform:rotateX(90deg)}
#mn-intro .edge.b{top:calc(100% - 4px - (var(--d) - 4px)/2);transform:rotateX(-90deg)}

/* ---------- pages ---------- */
#mn-intro .pg{top:4px;left:1px;width:calc(100% - 7px);height:calc(100% - 8px);transform-origin:0 50%}
#mn-intro .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:0 4px 4px 0;overflow:hidden;
  background:linear-gradient(90deg,rgba(90,55,20,.32),rgba(90,55,20,0) 14%),radial-gradient(ellipse at 55% 45%,#f6ead0,#e6d3a8 80%,#d8c08f)}
#mn-intro .face.bk-side{transform:rotateY(180deg);border-radius:4px 0 0 4px;
  background:linear-gradient(270deg,rgba(90,55,20,.32),rgba(90,55,20,0) 14%),radial-gradient(ellipse at 45% 45%,#f6ead0,#e6d3a8 80%,#d8c08f)}
#mn-intro .lines{position:absolute;inset:16% 14% 14%;
  background:repeating-linear-gradient(180deg,rgba(60,35,20,.28) 0 1.5px,transparent 1.5px 9px);
  opacity:.55}
#mn-intro .lines::before{content:"";position:absolute;left:0;right:30%;bottom:-2px;height:12px;background:#ecdcb6}
#mn-intro .drop{position:absolute;top:9%;left:14%;font-family:"Pinyon Script",cursive;color:#7a1f3d;font-size:calc(var(--w)*.11);line-height:1}
#mn-intro .pnum{position:absolute;bottom:5%;left:0;right:0;text-align:center;font-family:Cinzel,serif;font-size:calc(var(--w)*.03);color:rgba(80,50,25,.6);letter-spacing:.2em}
#mn-intro .pg.base .face{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:calc(var(--w)*.02)}
#mn-intro .pg.base .frame{position:absolute;inset:6%;border:1px solid rgba(160,120,50,.55);outline:1px solid rgba(160,120,50,.35);outline-offset:4px}
#mn-intro .pg.base img{width:46%;filter:drop-shadow(0 1px 0 rgba(80,40,10,.35)) sepia(.2)}
#mn-intro .pg.base .ch{font-family:Cinzel,serif;letter-spacing:.32em;font-size:calc(var(--w)*.038);color:#6d4a1e}
#mn-intro .pg.base .wl{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500;font-size:calc(var(--w)*.095);color:#7a1f3d;line-height:1.05;letter-spacing:.01em}
#mn-intro .pg.base .sm{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:calc(var(--w)*.045);color:#5a3a1a}
#mn-intro .pg.base .glow{position:absolute;inset:0;opacity:0;background:radial-gradient(circle at 50% 48%,rgba(255,246,214,.95),rgba(246,214,140,.55) 35%,transparent 70%)}

/* ---------- cover ---------- */
#mn-intro .mi-cover{inset:0;transform-origin:0 50%;transform:translateZ(calc(var(--d)/2))}
#mn-intro .cv-front,#mn-intro .cv-in{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
#mn-intro .cv-front{border-radius:3px 8px 8px 3px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 6px 0 14px rgba(0,0,0,.55),inset -2px 0 4px rgba(255,200,200,.06)}
#mn-intro .cv-in{transform:rotateY(180deg);border-radius:8px 3px 3px 8px;overflow:hidden;
  background:radial-gradient(circle at 50% 50%,rgba(216,180,106,.18) 0 1.5px,transparent 2px) 0 0/18px 18px,
    radial-gradient(circle at 50% 50%,rgba(216,180,106,.12) 0 1px,transparent 1.5px) 9px 9px/18px 18px,
    linear-gradient(135deg,#2a0b16,#1a0710);box-shadow:inset 0 0 0 calc(var(--w)*.035) #3b0f1f,inset 0 0 0 calc(var(--w)*.04) var(--gold-lo)}
#mn-intro .cv-in img{position:absolute;left:50%;top:50%;width:34%;transform:translate(-50%,-50%);opacity:.35}
#mn-intro .frame1{position:absolute;inset:5.5%;border:1.5px solid var(--gold);border-radius:2px;box-shadow:0 0 6px rgba(246,226,168,.25),inset 0 0 6px rgba(246,226,168,.15)}
#mn-intro .frame2{position:absolute;inset:8%;border:1px solid rgba(216,180,106,.7);border-radius:1px}
#mn-intro .corner{position:absolute;width:28%;aspect-ratio:1;color:var(--gold);filter:drop-shadow(0 0 2px rgba(246,226,168,.35)) drop-shadow(0 1px 0 rgba(0,0,0,.6))}
#mn-intro .corner svg{width:100%;height:100%;display:block}
#mn-intro .corner.tl{top:4%;left:4%}
#mn-intro .corner.tr{top:4%;right:4%;transform:scaleX(-1)}
#mn-intro .corner.bl{bottom:4%;left:4%;transform:scaleY(-1)}
#mn-intro .corner.br{bottom:4%;right:4%;transform:scale(-1,-1)}
#mn-intro .cv-body{position:absolute;inset:13% 11%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
#mn-intro .foil{background:linear-gradient(100deg,#7c5e26 0%,#d8b46a 20%,#fff3c8 32%,#c99a45 44%,#8a6a2c 56%,#f2d793 70%,#fff8dc 76%,#b8893c 88%,#7c5e26 100%);
  background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:mnFoil 5s linear infinite;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.7))}
@keyframes mnFoil{from{background-position:100% 0}to{background-position:-160% 0}}
#mn-intro .wt{font-family:"Pinyon Script",cursive;font-size:calc(var(--w)*.1);line-height:1.1;padding:0 .1em}
#mn-intro .nm{font-family:Cinzel,serif;font-weight:600;letter-spacing:.14em;font-size:calc(var(--w)*.058);line-height:1.15;margin-top:calc(var(--w)*.01)}
#mn-intro .mi-rule{display:flex;align-items:center;gap:8px;width:72%;margin:calc(var(--w)*.03) 0;color:var(--gold)}
#mn-intro .mi-rule::before,#mn-intro .mi-rule::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
#mn-intro .mi-rule::after{background:linear-gradient(270deg,transparent,var(--gold))}
#mn-intro .mi-rule i{width:6px;height:6px;transform:rotate(45deg);border:1px solid var(--gold);display:block}
#mn-intro .medal{position:relative;width:52%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 50% 40%,#2c0c18,#12050a 75%);
  box-shadow:0 0 0 1.5px var(--gold),0 0 0 calc(var(--w)*.016) #2a0b16,0 0 0 calc(var(--w)*.016 + 1px) rgba(216,180,106,.8),0 0 18px rgba(246,226,168,.18),inset 0 0 18px rgba(0,0,0,.8)}
#mn-intro .medal::before{content:"";position:absolute;inset:7%;border-radius:50%;border:1px dashed rgba(216,180,106,.45)}
#mn-intro .medal img{width:78%;filter:drop-shadow(0 0 6px rgba(246,214,140,.35))}
#mn-intro .wd{font-family:Cinzel,serif;font-weight:700;letter-spacing:.28em;font-size:calc(var(--w)*.1);line-height:1;margin-top:calc(var(--w)*.045);padding-left:.28em}
#mn-intro .sheen{position:absolute;inset:-20%;pointer-events:none;mix-blend-mode:screen;opacity:0;
  background:linear-gradient(115deg,transparent 35%,rgba(255,236,190,.0) 40%,rgba(255,236,190,.28) 50%,rgba(255,236,190,0) 60%,transparent 65%);transform:translateX(-60%)}

/* ---------- flash + controls ---------- */
#mn-intro .flash{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 50%,#fffaf0 0%,#fbecc4 30%,#e9c987 60%,#c9a45c 100%)}
#mn-intro .ctl{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:16px max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));z-index:3;opacity:0;transition:opacity .6s}
#mn-intro.ready .ctl{opacity:1}
#mn-intro .ctl label{display:flex;align-items:center;gap:8px;font-size:13px;letter-spacing:.04em;color:#cbbda6;cursor:pointer;user-select:none}
#mn-intro .ctl input{appearance:none;-webkit-appearance:none;width:16px;height:16px;border:1px solid var(--gold);border-radius:3px;margin:0;display:grid;place-items:center;background:transparent;cursor:pointer}
#mn-intro .ctl input:checked{background:var(--gold)}
#mn-intro .ctl input:checked::after{content:"";width:4px;height:8px;border:solid #1a0a10;border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
#mn-intro .ctl input:focus-visible,#mn-intro .skip:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
#mn-intro .skip{font:500 12px/1 Jost,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-hi);background:rgba(10,5,8,.55);
  border:1px solid rgba(216,180,106,.7);border-radius:999px;padding:11px 18px;cursor:pointer;backdrop-filter:blur(4px)}
#mn-intro .skip:hover{background:rgba(216,180,106,.15)}
#mn-intro .hint{position:absolute;top:max(14px,env(safe-area-inset-top));left:0;right:0;text-align:center;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:rgba(216,180,106,.55);opacity:0;transition:opacity .8s}
#mn-intro.ready .hint{opacity:1}
@media (max-width:520px){#mn-intro .ctl label span.long{display:none}}
.mn-intro-replay{background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer;opacity:.85}
.mn-intro-replay:hover{opacity:1}

/* ---------- candlelight + handwritten notes ---------- */
#mn-intro .halo{position:absolute;left:50%;top:46%;width:120vmax;height:120vmax;transform:translate(-50%,-50%);pointer-events:none;
  background:radial-gradient(circle,rgba(201,140,70,.16) 0%,rgba(138,35,70,.08) 25%,transparent 50%);animation:mnFlicker 3.8s ease-in-out infinite}
@keyframes mnFlicker{0%,100%{opacity:.75}22%{opacity:.95}40%{opacity:.7}63%{opacity:1}80%{opacity:.82}}
#mn-intro .notes{position:absolute;inset:8% 11% 11% 13%;font-family:Caveat,"Segoe Print","Bradley Hand",cursive;color:#3f2614;
  font-size:calc(var(--w)*.058);line-height:1.42;transform:rotate(-1.2deg);text-shadow:0 0 .5px rgba(63,38,20,.6)}
#mn-intro .face.bk-side .notes{inset:8% 13% 11% 11%;transform:rotate(.9deg)}
#mn-intro .notes .h{font-family:"Pinyon Script",cursive;color:#7a1f3d;font-size:calc(var(--w)*.085);line-height:1;margin:.2em 0 .5em;
  border-bottom:1px solid rgba(122,31,61,.45);display:inline-block;padding-right:.4em}
#mn-intro .notes .h.sm2{font-size:calc(var(--w)*.066);margin-top:.35em}
#mn-intro .notes .n{margin:.1em 0}
#mn-intro .notes .ind{padding-left:1.1em}
#mn-intro .notes .r{text-align:right;margin-top:.3em}
#mn-intro .notes .wine{color:#7a1f3d}
#mn-intro .notes b{font-weight:600;color:#7a1f3d}
#mn-intro .notes s{text-decoration-color:#7a1f3d;text-decoration-thickness:1.5px;opacity:.75}
#mn-intro .notes i{font-style:normal;opacity:.85}
#mn-intro .notes .sm3{font-size:.8em;opacity:.75}
#mn-intro .notes .sig{font-family:"Pinyon Script",cursive;font-size:1.15em;color:#7a1f3d;margin-top:.5em}
#mn-intro .notes .dd{display:inline-block;width:1.5em;height:1.5em;vertical-align:-.35em;color:#7a1f3d}
#mn-intro .notes .dd.sm{width:1em;height:1em;vertical-align:-.1em}

/* ---------- 3D mode, sound, hand-off ---------- */
#mn-intro canvas.mi-gl{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;animation:mnIn 1.2s ease forwards}
@keyframes mnIn{to{opacity:1}}
#mn-intro.gl .cam,#mn-intro.gl .halo{display:none}
#mn-intro.gl canvas.dust{opacity:0;transition:opacity 2.5s}
#mn-intro.gl .vig{background:radial-gradient(ellipse at 50% 50%,transparent 55%,rgba(0,0,0,.55) 100%)}
#mn-intro .rt{display:flex;gap:10px;align-items:center}
#mn-intro .snd{display:inline-flex;align-items:center;gap:7px;font:500 12px/1 Jost,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#cbbda6;
  background:rgba(10,5,8,.55);border:1px solid rgba(216,180,106,.35);border-radius:999px;padding:10px 14px;cursor:pointer;backdrop-filter:blur(4px)}
#mn-intro .snd:hover{border-color:rgba(216,180,106,.7)}
#mn-intro .snd[aria-pressed="true"]{color:var(--gold-hi);border-color:rgba(216,180,106,.7)}
#mn-intro .snd .w1,#mn-intro .snd .w2{display:none}
#mn-intro .snd[aria-pressed="true"] .w1,#mn-intro .snd[aria-pressed="true"] .w2{display:inline}
#mn-intro .snd[aria-pressed="true"] .x{display:none}
#mn-intro .snd:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
@media (max-width:520px){#mn-intro .snd span{display:none}#mn-intro .snd{padding:10px}}
.mn-fly{position:fixed;z-index:2147483001;pointer-events:none;transform-origin:50% 50%;will-change:transform,filter}
.site-head .brand.mn-arrive img{animation:mnArrive 1.8s ease-out}
@keyframes mnArrive{0%{filter:drop-shadow(0 0 10px rgba(255,236,190,.95)) brightness(1.35)}100%{filter:none}}
#mn-intro .skip{white-space:nowrap}
@media (max-width:520px){#mn-intro .skip{letter-spacing:.14em;padding:11px 14px}#mn-intro .ctl label{font-size:12px;max-width:44vw}}
/* Pause / resume (3D intro only) */
#mn-intro .pause{display:none;font:500 12px/1 Jost,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-hi);background:rgba(10,5,8,.55);
  border:1px solid rgba(216,180,106,.45);border-radius:999px;padding:11px 18px;cursor:pointer;backdrop-filter:blur(4px);white-space:nowrap}
#mn-intro.gl .pause{display:inline-block}
#mn-intro .pause:hover{background:rgba(216,180,106,.15)}
#mn-intro .pause:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
#mn-intro.paused .pause{border-color:rgba(216,180,106,.85);background:rgba(216,180,106,.18)}
#mn-intro.paused .hint::after{content:" \00b7  paused"}
@media (max-width:520px){#mn-intro .pause{letter-spacing:.14em;padding:11px 14px}}
/* Tap-to-open invitation (first visit) */
.mn-invite{position:fixed;left:0;right:0;margin:0 auto;width:max-content;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateY(16px);z-index:70;display:flex;align-items:center;gap:4px;
  padding:6px 6px 6px 8px;background:rgba(12,9,12,.9);border:1px solid rgba(216,180,106,.55);border-radius:999px;box-shadow:0 14px 40px rgba(0,0,0,.55),0 0 0 1px rgba(216,180,106,.08) inset,0 0 28px rgba(216,180,106,.12);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;transition:opacity .45s ease,transform .45s cubic-bezier(.2,.7,.2,1);max-width:calc(100vw - 28px)}
.mn-invite.on{opacity:1;transform:none}
.mn-invite .mn-invite-spark{flex:none}
.mn-invite-txt b,.mn-invite-txt small{white-space:nowrap}
.mn-invite button{all:unset;cursor:pointer;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.mn-invite .mn-invite-open{display:flex;align-items:center;gap:12px;padding:8px 16px 8px 10px;border-radius:999px;transition:background .25s}
.mn-invite .mn-invite-open:hover,.mn-invite .mn-invite-open:focus-visible{background:rgba(216,180,106,.12)}
.mn-invite-open:focus-visible,.mn-invite-x:focus-visible{outline:2px solid #f1d99c;outline-offset:2px}
.mn-invite .mn-invite-spark{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:#1a0f0a;font-size:16px;background:radial-gradient(circle at 35% 30%,#fff1c9,#d8b46a 55%,#8a6a2c);box-shadow:0 0 18px rgba(241,217,156,.55);animation:mnInvGlow 2.8s ease-in-out infinite}
@keyframes mnInvGlow{50%{box-shadow:0 0 28px rgba(241,217,156,.85);transform:rotate(18deg)}}
.mn-invite-txt{display:grid;line-height:1.15;text-align:left}
.mn-invite-txt b{font:600 14px/1.2 Cinzel,serif;letter-spacing:.12em;text-transform:uppercase;color:#f1d99c}
.mn-invite-txt small{font:italic 400 15px/1.2 "Cormorant Garamond",serif;color:#e2d6c4}
.mn-invite .mn-invite-x{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;color:#cbbba3;font-size:20px;line-height:1}
.mn-invite .mn-invite-x:hover{background:rgba(255,255,255,.06);color:#fff}
@media (prefers-reduced-motion:reduce){.mn-invite-spark{animation:none}.mn-invite{transition:opacity .3s}}
body:has(.cart-bar:not([hidden])) .mn-invite{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
