/* styles-v20.css - THE HOUSE (2026-10-27, Tylan's word): the whole site is one house.
   This page is the Grand Entrance. Black is the main color; gold trim; jewel tones
   as accents; ornate sleek mid-century modern mixed with dark academia.
   Built on v19's candlelit palette. */
:root{
  --ink:#0b0805;
  --ink-2:#141009;
  --gold:#c9a227;
  --gold-bright:#e8c766;
  --bronze:#b08d57;
  --bronze-dim:#8a6d3f;
  --cream:#f0e6d2;
  --cream-dim:#cbbd9d;
  --parchment:#e9dcbc;
  --burgundy:#7b1e2b;
  --emerald:#1d5c3f;
  --royal:#3b1d5e;
  --ember:#b3541e;
  --wood:#241708;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--ink);
  color:var(--cream);
  font-family:'Inter',system-ui,sans-serif;
  line-height:1.55;
  min-height:100vh;
  background-image:
    radial-gradient(ellipse 80% 45% at 50% -5%, rgba(201,162,39,.15), transparent 60%),
    radial-gradient(ellipse 55% 35% at 88% 28%, rgba(123,30,43,.17), transparent 65%),
    radial-gradient(ellipse 55% 35% at 8% 62%, rgba(29,92,63,.13), transparent 65%),
    radial-gradient(ellipse 70% 40% at 50% 112%, rgba(59,29,94,.16), transparent 60%),
    repeating-linear-gradient(90deg, rgba(201,162,39,.014) 0 2px, transparent 2px 90px);
  background-attachment:fixed;
}
.glow{
  position:fixed;left:50%;top:-140px;transform:translateX(-50%);
  width:560px;height:300px;border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(255,176,66,.22), rgba(255,140,40,.08) 45%, transparent 70%);
  filter:blur(10px);pointer-events:none;z-index:0;
  animation:flicker 4.5s ease-in-out infinite;
}
@keyframes flicker{
  0%,100%{opacity:.85;transform:translateX(-50%) scale(1)}
  42%{opacity:1;transform:translateX(-50%) scale(1.03)}
  68%{opacity:.75;transform:translateX(-50%) scale(.99)}
}
@media (prefers-reduced-motion: reduce){ .glow{animation:none} html{scroll-behavior:auto} }
.topnav{
  position:relative;z-index:2;max-width:920px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 22px 0;
}
.topnav .brand{
  font-family:'Cormorant Garamond',serif;font-size:1.35rem;font-weight:700;
  color:var(--cream);text-decoration:none;letter-spacing:.03em;
}
.topnav .brand span{color:var(--gold)}
.topnav .pages{display:flex;gap:6px;align-items:center}
/* Topnav buttons in little gilt frames (2026-10-24): the same gold gradient frame
   the social pills carry; padding trades 2px for the 3px frame so each button
   keeps its exact outer size */
.topnav .pages a{
  color:var(--cream-dim);text-decoration:none;font-size:.9rem;font-weight:500;
  padding:5px 12px;border-radius:999px;border:3px solid transparent;
  background:
    linear-gradient(rgba(20,16,9,.94), rgba(20,16,9,.94)) padding-box,
    linear-gradient(155deg, #7d5f1c 0%, #e8c766 28%, #96762a 52%, #e8c766 76%, #6e5518 100%) border-box;
  box-shadow:
    inset 0 1px 1px rgba(255,246,200,.5),
    inset 0 -1px 2px rgba(40,26,2,.55),
    0 0 0 1px #171006,
    0 3px 8px rgba(0,0,0,.5);
  transition:all .2s ease;
}
.topnav .pages a:hover{color:var(--gold);box-shadow:
    inset 0 1px 1px rgba(255,246,200,.6),
    inset 0 -1px 2px rgba(40,26,2,.55),
    0 0 0 1px #171006,
    0 0 16px rgba(201,162,39,.35),
    0 3px 8px rgba(0,0,0,.5)}
.topnav .pages a.current{color:var(--gold);box-shadow:
    inset 0 1px 1px rgba(255,246,200,.6),
    inset 0 -1px 2px rgba(40,26,2,.55),
    0 0 0 1px #171006,
    0 0 12px rgba(201,162,39,.28),
    0 3px 8px rgba(0,0,0,.5)}
/* Pip's spider, resident in the top nav: no frame of her own */
.topnav .pages a.pip-spider{
  font-size:1.2rem;line-height:1;padding:2px 3px;
  border:0;background:none;box-shadow:none;
}
.topnav .pages a.pip-spider:hover{
  color:inherit;box-shadow:none;
  filter:drop-shadow(0 0 6px rgba(201,162,39,.65));
  transform:scale(1.15);
}
main{position:relative;z-index:1;max-width:700px;margin:0 auto;padding:44px 22px 40px}
main.wide{max-width:920px}
header.hero{text-align:center;margin-bottom:34px}
.monogram{
  width:88px;height:88px;margin:0 auto 18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:'Cormorant Garamond',serif;font-size:2.6rem;font-weight:700;color:var(--gold);
  background:radial-gradient(circle at 35% 30%, #2c2110, var(--ink-2));
  border:1px solid var(--bronze);
  box-shadow:0 0 0 5px rgba(176,141,87,.10), 0 0 0 6px rgba(176,141,87,.35), 0 0 38px rgba(201,162,39,.20), inset 0 0 18px rgba(0,0,0,.65);
}
h1{font-family:'Cormorant Garamond',serif;font-size:3rem;font-weight:700;letter-spacing:.02em;color:var(--cream)}
h1 .spark{color:var(--gold);font-size:1.7rem;vertical-align:.35em}
.est{
  margin-top:8px;font-size:.74rem;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--bronze);
}
.rule{
  display:flex;align-items:center;gap:12px;max-width:340px;margin:16px auto 0;color:var(--gold);
  font-size:.8rem;
}
.rule::before,.rule::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--bronze-dim),transparent)}
nav.socials{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:22px}
/* Social pills in little gilt frames (2026-10-24): the gold gradient and depth of the
   old photo frames, carried on a 3px gradient border with a dark outer edge */
nav.socials a{
  color:var(--cream-dim);text-decoration:none;font-size:.82rem;font-weight:500;
  border:3px solid transparent;border-radius:999px;padding:5px 13px;
  background:
    linear-gradient(rgba(20,16,9,.94), rgba(20,16,9,.94)) padding-box,
    linear-gradient(155deg, #7d5f1c 0%, #e8c766 28%, #96762a 52%, #e8c766 76%, #6e5518 100%) border-box;
  box-shadow:
    inset 0 1px 1px rgba(255,246,200,.5),
    inset 0 -1px 2px rgba(40,26,2,.55),
    0 0 0 1px #171006,
    0 3px 8px rgba(0,0,0,.5);
  transition:all .2s ease;
}
nav.socials a:hover{color:var(--gold);box-shadow:
    inset 0 1px 1px rgba(255,246,200,.6),
    inset 0 -1px 2px rgba(40,26,2,.55),
    0 0 0 1px #171006,
    0 0 16px rgba(201,162,39,.35),
    0 3px 8px rgba(0,0,0,.5)}
.page-head{text-align:center;margin-bottom:12px}
.page-head h1{font-size:2.6rem}
.page-head p{color:var(--cream-dim);margin-top:4px}
section{margin-top:46px}
.section-head{display:flex;align-items:center;gap:14px;margin-bottom:6px}
.section-head::before,.section-head::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--bronze-dim),transparent)}
.section-head h2{
  font-family:'Cormorant Garamond',serif;font-size:1.6rem;font-weight:600;color:var(--gold);
  letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;
}
.section-sub{text-align:center;color:var(--cream-dim);font-size:.9rem;margin-bottom:18px;font-style:italic;font-family:'Cormorant Garamond',serif;font-size:1.05rem}
.links{display:flex;flex-direction:column;gap:14px;padding:4px 2px}
a.link-card{
  position:relative;display:block;text-align:center;text-decoration:none;
  font-family:'Cormorant Garamond',serif;font-weight:700;font-size:1.3rem;letter-spacing:.03em;
  color:var(--parchment);
  padding:15px 44px 13px;border-radius:4px 10px 10px 4px;
  background:linear-gradient(180deg, #6d1a28, #4a101b);
  border:1px solid rgba(0,0,0,.6);
  text-shadow:0 1px 0 rgba(255,240,200,.16), 0 2px 3px rgba(0,0,0,.7);
  box-shadow:
    inset 0 0 0 1px rgba(232,199,102,.30), inset 0 0 0 5px rgba(0,0,0,.16),
    inset 14px 0 18px -8px rgba(0,0,0,.55), inset -3px 0 6px -2px rgba(0,0,0,.35),
    inset 0 0 26px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,235,190,.28), inset 0 -2px 0 rgba(0,0,0,.4),
    0 3px 0 #e6d9b8, 0 4px 0 #9a8a68, 0 6px 0 #d8c9a3, 0 7px 0 #8a795a, 0 9px 0 #2a1f10,
    0 12px 20px rgba(0,0,0,.55);
  transition:all .18s ease;
}
a.link-card::before,a.link-card::after{
  content:"";position:absolute;top:5px;bottom:5px;width:3px;border-radius:2px;
  background:linear-gradient(180deg, var(--gold-bright), var(--bronze));
  box-shadow:4px 0 0 -1px rgba(232,199,102,.55), -4px 0 0 -1px rgba(232,199,102,.30);
  opacity:.85;
}
a.link-card::before{left:14px}
a.link-card::after{right:14px}
a.link-card:nth-child(2){background:linear-gradient(180deg, #20563c, #123626)}
a.link-card:nth-child(3){background:linear-gradient(180deg, #46236e, #2b1547)}
a.link-card:hover{transform:translateY(-2px);color:#fff;box-shadow:
    inset 0 0 0 1px rgba(232,199,102,.45), inset 0 0 0 5px rgba(0,0,0,.16),
    inset 14px 0 18px -8px rgba(0,0,0,.55), inset -3px 0 6px -2px rgba(0,0,0,.35),
    inset 0 0 26px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,235,190,.32), inset 0 -2px 0 rgba(0,0,0,.4),
    0 3px 0 #e6d9b8, 0 4px 0 #9a8a68, 0 6px 0 #d8c9a3, 0 7px 0 #8a795a, 0 9px 0 #2a1f10,
    0 0 22px rgba(201,162,39,.30), 0 16px 26px rgba(0,0,0,.55)}
a.link-card small{display:block;font-family:'Inter',system-ui,sans-serif;font-weight:400;font-size:.8rem;letter-spacing:.02em;color:rgba(240,230,210,.75);margin-top:2px;text-shadow:none}
a.link-card.dolly{
  background:linear-gradient(135deg, #c94f83, #a03a68 55%, #7e2a56);
  border:1px solid #e88bb0;
  color:#ffe9f3;
  box-shadow:
    inset 0 0 0 1px rgba(255,220,238,.45), inset 0 0 0 5px rgba(255,255,255,.08),
    inset 14px 0 18px -8px rgba(90,10,50,.45), inset -3px 0 6px -2px rgba(90,10,50,.3),
    inset 0 0 26px rgba(90,10,50,.25),
    inset 0 1px 0 rgba(255,255,255,.35), inset 0 -2px 0 rgba(0,0,0,.3),
    0 3px 0 #f7e3d2, 0 4px 0 #b98d78, 0 6px 0 #f3d9c8, 0 7px 0 #a37c68, 0 9px 0 #2a1f10,
    0 0 24px rgba(255,105,180,.35), 0 12px 20px rgba(0,0,0,.55);
}
a.link-card.dolly:hover{box-shadow:
    inset 0 1px 0 rgba(255,255,255,.4), inset 0 -2px 0 rgba(0,0,0,.3),
    0 3px 0 #f3d9c8, 0 4px 0 #c39a86, 0 7px 0 #2a1f10,
    0 0 34px rgba(255,105,180,.5), 0 16px 26px rgba(0,0,0,.55)}
a.link-card.dolly small{color:#f6c9da}
a.link-card.dolly .wings{color:#ffd3e6}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:600px){ .grid{grid-template-columns:1fr} }
.card{
  --spine:var(--bronze);
  border-radius:8px;padding:20px 18px 18px 32px;position:relative;overflow:hidden;
  background:
    radial-gradient(130% 90% at 50% -10%, rgba(232,180,80,.17), transparent 55%),
    linear-gradient(180deg, rgba(233,220,188,.055), rgba(233,220,188,.015)),
    linear-gradient(180deg, #1d1508, #120d05);
  border:1px solid rgba(176,141,87,.45);
  box-shadow:inset 0 1px 0 rgba(240,230,210,.06), inset 0 0 26px rgba(0,0,0,.35), 0 4px 14px rgba(0,0,0,.42);
}
.card::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:13px;
  background:
    repeating-linear-gradient(180deg, transparent 0 30px, rgba(232,199,102,.45) 30px 32px, rgba(0,0,0,.35) 32px 34px, transparent 34px 64px),
    linear-gradient(90deg, rgba(0,0,0,.45), var(--spine) 45%, var(--spine) 70%, rgba(0,0,0,.4));
  box-shadow:inset -2px 0 0 rgba(232,199,102,.55), inset 3px 0 0 rgba(232,199,102,.35);
}
.card h3{font-family:'Cormorant Garamond',serif;font-size:1.35rem;font-weight:600;color:var(--cream);margin-bottom:5px}
.card p{font-size:.9rem;color:var(--cream-dim)}
.card a{color:var(--gold);text-decoration:none;font-weight:600;font-size:.88rem}
.card a:hover{text-decoration:underline}
a.card{display:block;text-decoration:none;transition:all .2s ease}
a.card:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:inset 0 1px 0 rgba(240,230,210,.08), inset 0 0 26px rgba(0,0,0,.35), 0 0 24px rgba(201,162,39,.22), 0 14px 24px rgba(0,0,0,.5)}
.card-img{display:block;width:calc(100% + 50px);max-width:none;height:112px;object-fit:cover;margin:-20px -18px 14px -32px;border-bottom:2px solid rgba(201,162,39,.6);box-shadow:0 6px 14px rgba(0,0,0,.45)}
a.card .go{color:var(--gold);font-weight:600;font-size:.88rem}
.plate{
  display:inline-block;margin-bottom:12px;padding:3px 12px 4px;
  font-size:.68rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#1c1408;
  background:linear-gradient(180deg, var(--gold-bright), var(--bronze));
  border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.5);
}
.accent-burgundy{--spine:#7b1e2b}
.accent-emerald{--spine:#1d5c3f}
.accent-royal{--spine:#3b1d5e}
.accent-ember{--spine:#b3541e}
.price{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--gold);font-weight:700}
.stamp{
  display:inline-block;margin-top:10px;font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--bronze);border:1.5px solid rgba(176,141,87,.55);border-radius:4px;padding:3px 10px;
  transform:rotate(-2deg);
}
footer{
  position:relative;z-index:1;max-width:700px;margin:54px auto 0;text-align:center;color:var(--cream-dim);font-size:.85rem;
  border-top:1px solid rgba(176,141,87,.3);padding:20px 22px 36px;
}
footer a{color:var(--gold);text-decoration:none}
footer a:hover{text-decoration:underline}
footer .finial{color:var(--gold);font-size:1rem;margin-bottom:8px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.crest{
  display:block;width:190px;max-width:58vw;height:auto;margin:0 auto 16px;border-radius:14px;
  box-shadow:0 0 0 1px rgba(176,141,87,.35), 0 0 34px rgba(201,162,39,.18), 0 10px 26px rgba(0,0,0,.5);
}
.crest-sm{width:104px;margin-bottom:12px}
.nameplate{
  display:block;width:min(580px,100%);height:auto;margin:2px auto 0;border-radius:10px;
  box-shadow:0 0 0 1px rgba(176,141,87,.30), 0 10px 26px rgba(0,0,0,.5);
}
.brand-crest{width:30px;height:30px;object-fit:cover;border-radius:50%;border:1px solid var(--bronze);vertical-align:-9px;margin-right:7px}
figure.shelf{margin:26px 0 6px}
figure.shelf img{
  display:block;width:100%;height:auto;border-radius:10px;
  border:1px solid var(--bronze);
  box-shadow:0 0 0 4px rgba(176,141,87,.12), 0 10px 30px rgba(0,0,0,.55), inset 0 0 0 1px rgba(0,0,0,.4);
}
figure.shelf figcaption{
  text-align:center;margin-top:9px;font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:.98rem;color:var(--cream-dim);letter-spacing:.04em;
}
.section-img{
  display:block;width:100%;height:auto;border-radius:10px;margin:4px 0 18px;
  border:1px solid rgba(176,141,87,.55);
  box-shadow:0 8px 24px rgba(0,0,0,.5);
}

/* Window frame: slim gold trim (2026-10-24 — was a deep 12px gilt frame with
   mullion bars and a vignette; now 6px of gold trim with a 1px dark edge) */
.shelf.window{
  position:relative;
  padding:6px;
  border:1px solid #4a380f;
  border-radius:132px 132px 14px 14px;
  background:linear-gradient(155deg, #7d5f1c 0%, #e8c766 28%, #96762a 52%, #e8c766 76%, #6e5518 100%);
  box-shadow:
    0 0 0 1px #171006,
    0 12px 26px rgba(0,0,0,.55);
}
.shelf.window img{border-radius:126px 126px 8px 8px;box-shadow:0 0 0 1px rgba(23,16,6,.85)}

div.card{transition:border-color .2s ease, box-shadow .2s ease}
div.card:hover{border-color:rgba(201,162,39,.8);box-shadow:inset 0 1px 0 rgba(240,230,210,.08), inset 0 0 26px rgba(0,0,0,.35), 0 0 18px rgba(201,162,39,.16), 0 8px 18px rgba(0,0,0,.5)}

/* Full framed photographs keep their natural shape */
.shelf.natural img{aspect-ratio:auto;object-fit:fill}

/* Framed photographs: slim gold trim (2026-10-24 — the heavy photographed gilt
   frame baked into the old composites is retired; a double gold line trims the
   plain photographs instead. The aspect-ratio hold keeps the figure box at the
   framed composites' shape so the page layout does not move) */
.framed-figure{margin:28px 0}
.framed-figure img{
  display:block;width:100%;height:auto;aspect-ratio:1907/1258;object-fit:cover;border-radius:5px;
  border:2px solid var(--gold);
  box-shadow:
    0 0 0 1px rgba(23,16,6,.85),
    0 0 0 5px rgba(201,162,39,.30),
    0 14px 28px rgba(0,0,0,.55);
}


/* Fly-off-the-shelf entrance for the book link cards (2026-10-16) */
.links a.link-card:nth-child(1){--fly-x:-72px;--fly-r:-8deg}
.links a.link-card:nth-child(2){--fly-x:64px;--fly-r:7deg}
.links a.link-card:nth-child(3){--fly-x:-48px;--fly-r:-6deg}
html.js .links:not(.shelf-in) a.link-card{opacity:0}
.links.shelf-in a.link-card{animation:flyIn 1.15s cubic-bezier(.22,.9,.3,1) backwards}
.links.shelf-in a.link-card:nth-child(2){animation-delay:.22s}
.links.shelf-in a.link-card:nth-child(3){animation-delay:.44s}
@keyframes flyIn{
  0%{opacity:0;transform:translate3d(calc(var(--fly-x,0)*1.6),-340px,0) rotate(calc(var(--fly-r,-4deg)*2.4)) scale(.9)}
  35%{opacity:1;transform:translate3d(calc(var(--fly-x,0)*.9),-120px,0) rotate(calc(var(--fly-r,0deg)*1.2)) scale(.97)}
  62%{transform:translate3d(calc(var(--fly-x,0)*-.35),26px,0) rotate(calc(var(--fly-r,0deg)*-.6)) scale(1.02)}
  80%{transform:translate3d(0,-12px,0) rotate(1deg) scale(1)}
  100%{opacity:1;transform:translate3d(0,0,0) rotate(0deg) scale(1)}
}
@media (max-width:640px){
  @keyframes flyIn{
    0%{opacity:0;transform:translate3d(calc(var(--fly-x,0)*.9),-200px,0) rotate(calc(var(--fly-r,-4deg)*1.9)) scale(.92)}
    40%{opacity:1;transform:translate3d(calc(var(--fly-x,0)*.45),-70px,0) rotate(calc(var(--fly-r,0deg)*1.1)) scale(.97)}
    65%{transform:translate3d(calc(var(--fly-x,0)*-.2),16px,0) rotate(calc(var(--fly-r,0deg)*-.5)) scale(1.01)}
    82%{transform:translate3d(0,-8px,0) rotate(1deg) scale(1)}
    100%{opacity:1;transform:translate3d(0,0,0) rotate(0deg) scale(1)}
  }
}
@media (prefers-reduced-motion: reduce){
  html.js .links:not(.shelf-in) a.link-card{opacity:1}
  .links.shelf-in a.link-card{animation:none}
}

/* The Countess's webs: fine gold threads in the corners (2026-10-17) */
body::before{
  content:"";position:fixed;top:0;right:0;width:132px;height:132px;z-index:0;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Cpath%20d%3D%22M0.0%2C0.0%20L118.0%2C0.0%20M0.0%2C0.0%20L118.0%2C31.6%20M0.0%2C0.0%20L118.0%2C68.1%20M0.0%2C0.0%20L118.0%2C118.0%20M0.0%2C0.0%20L68.1%2C118.0%20M0.0%2C0.0%20L31.6%2C118.0%20M0.0%2C0.0%20L0.0%2C118.0%20M26.0%2C0.0%20Q22.3%2C2.9%2026.0%2C7.0%20M26.0%2C7.0%20Q22.3%2C9.2%2026.0%2C15.0%20M26.0%2C15.0%20Q22.3%2C17.1%2026.0%2C26.0%20M26.0%2C26.0%20Q17.1%2C22.3%2015.0%2C26.0%20M15.0%2C26.0%20Q9.2%2C22.3%207.0%2C26.0%20M7.0%2C26.0%20Q2.9%2C22.3%200.0%2C26.0%20M47.2%2C0.0%20Q40.6%2C5.3%2047.2%2C12.6%20M47.2%2C12.6%20Q40.6%2C16.8%2047.2%2C27.3%20M47.2%2C27.3%20Q40.6%2C31.1%2047.2%2C47.2%20M47.2%2C47.2%20Q31.1%2C40.6%2027.3%2C47.2%20M27.3%2C47.2%20Q16.8%2C40.6%2012.6%2C47.2%20M12.6%2C47.2%20Q5.3%2C40.6%200.0%2C47.2%20M68.4%2C0.0%20Q58.9%2C7.7%2068.4%2C18.3%20M68.4%2C18.3%20Q58.9%2C24.4%2068.4%2C39.5%20M68.4%2C39.5%20Q58.9%2C45.2%2068.4%2C68.4%20M68.4%2C68.4%20Q45.2%2C58.9%2039.5%2C68.4%20M39.5%2C68.4%20Q24.4%2C58.9%2018.3%2C68.4%20M18.3%2C68.4%20Q7.7%2C58.9%200.0%2C68.4%20M89.7%2C0.0%20Q77.1%2C10.2%2089.7%2C24.0%20M89.7%2C24.0%20Q77.1%2C31.9%2089.7%2C51.8%20M89.7%2C51.8%20Q77.1%2C59.2%2089.7%2C89.7%20M89.7%2C89.7%20Q59.2%2C77.1%2051.8%2C89.7%20M51.8%2C89.7%20Q31.9%2C77.1%2024.0%2C89.7%20M24.0%2C89.7%20Q10.2%2C77.1%200.0%2C89.7%20M109.7%2C0.0%20Q94.4%2C12.4%20109.7%2C29.4%20M109.7%2C29.4%20Q94.4%2C39.1%20109.7%2C63.4%20M109.7%2C63.4%20Q94.4%2C72.4%20109.7%2C109.7%20M109.7%2C109.7%20Q72.4%2C94.4%2063.4%2C109.7%20M63.4%2C109.7%20Q39.1%2C94.4%2029.4%2C109.7%20M29.4%2C109.7%20Q12.4%2C94.4%200.0%2C109.7%22%20fill%3D%22none%22%20stroke%3D%22%23c9a227%22%20stroke-width%3D%221.1%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E") top right / contain no-repeat;
  opacity:.34;transform:scaleX(-1);
}
footer .web-foot{
  position:absolute;top:0;right:0;width:62px;height:62px;
  opacity:.42;transform:scaleX(-1);pointer-events:none;
}

/* More of the Countess's webs: top-left corner + second footer web (2026-10-17) */
body::after{
  content:"";position:fixed;top:0;left:0;width:132px;height:132px;z-index:0;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Cpath%20d%3D%22M0.0%2C0.0%20L118.0%2C0.0%20M0.0%2C0.0%20L118.0%2C31.6%20M0.0%2C0.0%20L118.0%2C68.1%20M0.0%2C0.0%20L118.0%2C118.0%20M0.0%2C0.0%20L68.1%2C118.0%20M0.0%2C0.0%20L31.6%2C118.0%20M0.0%2C0.0%20L0.0%2C118.0%20M26.0%2C0.0%20Q22.3%2C2.9%2026.0%2C7.0%20M26.0%2C7.0%20Q22.3%2C9.2%2026.0%2C15.0%20M26.0%2C15.0%20Q22.3%2C17.1%2026.0%2C26.0%20M26.0%2C26.0%20Q17.1%2C22.3%2015.0%2C26.0%20M15.0%2C26.0%20Q9.2%2C22.3%207.0%2C26.0%20M7.0%2C26.0%20Q2.9%2C22.3%200.0%2C26.0%20M47.2%2C0.0%20Q40.6%2C5.3%2047.2%2C12.6%20M47.2%2C12.6%20Q40.6%2C16.8%2047.2%2C27.3%20M47.2%2C27.3%20Q40.6%2C31.1%2047.2%2C47.2%20M47.2%2C47.2%20Q31.1%2C40.6%2027.3%2C47.2%20M27.3%2C47.2%20Q16.8%2C40.6%2012.6%2C47.2%20M12.6%2C47.2%20Q5.3%2C40.6%200.0%2C47.2%20M68.4%2C0.0%20Q58.9%2C7.7%2068.4%2C18.3%20M68.4%2C18.3%20Q58.9%2C24.4%2068.4%2C39.5%20M68.4%2C39.5%20Q58.9%2C45.2%2068.4%2C68.4%20M68.4%2C68.4%20Q45.2%2C58.9%2039.5%2C68.4%20M39.5%2C68.4%20Q24.4%2C58.9%2018.3%2C68.4%20M18.3%2C68.4%20Q7.7%2C58.9%200.0%2C68.4%20M89.7%2C0.0%20Q77.1%2C10.2%2089.7%2C24.0%20M89.7%2C24.0%20Q77.1%2C31.9%2089.7%2C51.8%20M89.7%2C51.8%20Q77.1%2C59.2%2089.7%2C89.7%20M89.7%2C89.7%20Q59.2%2C77.1%2051.8%2C89.7%20M51.8%2C89.7%20Q31.9%2C77.1%2024.0%2C89.7%20M24.0%2C89.7%20Q10.2%2C77.1%200.0%2C89.7%20M109.7%2C0.0%20Q94.4%2C12.4%20109.7%2C29.4%20M109.7%2C29.4%20Q94.4%2C39.1%20109.7%2C63.4%20M109.7%2C63.4%20Q94.4%2C72.4%20109.7%2C109.7%20M109.7%2C109.7%20Q72.4%2C94.4%2063.4%2C109.7%20M63.4%2C109.7%20Q39.1%2C94.4%2029.4%2C109.7%20M29.4%2C109.7%20Q12.4%2C94.4%200.0%2C109.7%22%20fill%3D%22none%22%20stroke%3D%22%23c9a227%22%20stroke-width%3D%221.1%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E") top left / contain no-repeat;
  opacity:.34;
}
footer .web-foot-l{
  position:absolute;top:0;left:0;width:62px;height:62px;
  opacity:.42;pointer-events:none;
}

/* Nav Pip icon sizing (carried from v16; v15 predates the pip-link markup) */
.topnav .pages a.pip-link{
  padding:2px 3px;line-height:0;
  border:0;background:none;box-shadow:none;
}
.topnav .pages a.pip-link img{
  display:block;width:30px;height:30px;border-radius:50%;
  box-shadow:0 0 0 1px rgba(201,162,39,.5), 0 0 10px rgba(201,162,39,.25);
  transition:all .2s ease;
}
.topnav .pages a.pip-link:hover{box-shadow:none}
.topnav .pages a.pip-link:hover img{
  transform:scale(1.12);

/* ---- The House: rooms, doors, mid-century ornaments (v20) ---- */
.entrance-kicker{
  margin-top:14px;font-size:.72rem;font-weight:600;letter-spacing:.34em;
  text-transform:uppercase;color:var(--bronze);
}
.entrance-note{
  margin:10px auto 0;max-width:520px;text-align:center;
  font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.08rem;color:var(--cream-dim);
}
.sunburst{
  width:120px;height:60px;margin:6px auto 0;opacity:.55;
  background:
    conic-gradient(from -90deg at 50% 100%,
      transparent 0deg, rgba(201,162,39,.5) 2deg, transparent 4deg,
      transparent 14deg, rgba(201,162,39,.5) 16deg, transparent 18deg,
      transparent 28deg, rgba(201,162,39,.5) 30deg, transparent 32deg,
      transparent 42deg, rgba(201,162,39,.5) 44deg, transparent 46deg,
      transparent 56deg, rgba(201,162,39,.5) 58deg, transparent 60deg,
      transparent 70deg, rgba(201,162,39,.5) 72deg, transparent 74deg,
      transparent 84deg, rgba(201,162,39,.5) 86deg, transparent 88deg,
      transparent 98deg, rgba(201,162,39,.5) 100deg, transparent 102deg,
      transparent 112deg, rgba(201,162,39,.5) 114deg, transparent 116deg,
      transparent 126deg, rgba(201,162,39,.5) 128deg, transparent 130deg,
      transparent 140deg, rgba(201,162,39,.5) 142deg, transparent 144deg,
      transparent 154deg, rgba(201,162,39,.5) 156deg, transparent 158deg,
      transparent 168deg, rgba(201,162,39,.5) 170deg, transparent 172deg);
  -webkit-mask-image:radial-gradient(ellipse 100% 100% at 50% 100%, #000 30%, transparent 72%);
  mask-image:radial-gradient(ellipse 100% 100% at 50% 100%, #000 30%, transparent 72%);
}
.rooms{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
@media (max-width:600px){ .rooms{grid-template-columns:1fr} }
a.door-card{--spine:var(--gold)}
a.door-card .door-plate{
  display:inline-block;margin-bottom:10px;padding:3px 12px 4px;
  font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#1c1408;
  background:linear-gradient(180deg, var(--gold-bright), var(--bronze));
  border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.5);
}
a.door-card.accent-burgundy{--spine:#7b1e2b}
a.door-card.accent-emerald{--spine:#1d5c3f}
a.door-card.accent-royal{--spine:#3b1d5e}
