Sheelba.jpg

World Styling Editor

SELECT THEME

CUSTOM CSS

/* =========================================================
NEHWON — COMPLETE WORLD CSS  ·  cleaned 29 Sep 2026
One copy only. The file had been pasted into itself; the older
inner copy was removed (it held nothing the outer copy lacked).
========================================================= */

/* =========================================================
FONT FILES
========================================================= */

/* Alegreya — normal, variable weight 400–900 */
@font-face {
font-family: AlegreyaWA;
font-style: normal;
font-weight: 400 900;
font-display: swap;
src: url(https://fonts.gstatic.com/s/alegreya/v39/4UaBrEBBsBhlBjvfkSLhx6g.woff2);
}

/* Alegreya — italic, variable weight 400–900 */
@font-face {
font-family: AlegreyaWA;
font-style: italic;
font-weight: 400 900;
font-display: swap;
src: url(https://fonts.gstatic.com/s/alegreya/v39/4UaHrEBBsBhlBjvfkSLk96rp5w.woff2);
}

/* Germania One — headings */
@font-face {
font-family: GermaniaOneWA;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/germaniaone/v21/Fh4yPjrqIyv2ucM2qzBjeS3uywhP.woff2);
}

/* Make the "Go to Nehwon Homepage" button readable */
.user-css .backtoworld a,
.user-css-extended .backtoworld a {
  color: #e6b65c !important;
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
  text-decoration: none;
}
.user-css .backtoworld a:hover,
.user-css-extended .backtoworld a:hover {
  color: #ffffff !important;
  text-decoration: underline;
}/* =========================================================
GENERAL WORLD SETTINGS
========================================================= */

.user-css {
--nehwon-max-width: 1500px;
--nehwon-radius: 14px;
--nehwon-border: rgba(140, 140, 140, 0.28);
--nehwon-soft: rgba(0, 0, 0, 0.12);
}

/* Hide the world maps section */
.user-css .world-content .world-maps {
display: none;
}

/* =========================================================
CUSTOM NAVIGATION SKULL
========================================================= */

/* Main floating navigation trigger — the fire-eyed gold skull GIF */
.world-navigation-palette-trigger {
width: 180px !important;
height: 180px !important;
padding: 0 !important;

background-color: transparent !important;
border: none !important;
box-shadow: none !important;

background-image: url(https://wa-cdn.nyc3.digitaloceanspaces.com/user-data/production/e44b2833-b031-44f8-8d69-69884ac75ec6/uploads/images/691a0a4cfe34571f7964b0ba6f723d25.gif) !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: 152px 152px !important;

/* smooth transition for the hover */
transition: transform 0.35s ease-in-out !important;
}

/* SCALE UP ON HOVER — he leans toward you */
.world-navigation-palette-trigger:hover {
transform: scale(1.25) !important;
filter: brightness(2);
}/* Hide the built-in glyph so only the skull shows */
.world-navigation-palette-trigger i,
.world-navigation-palette-trigger svg {
opacity: 0 !important;
}

/* Keyboard focus */
.world-navigation-palette-trigger:focus {
outline: 2px solid rgba(255, 255, 255, 0.35);
outline-offset: 3px;
}

/* =========================================================
   ARTICLE WIDTH AND READABILITY
   ========================================================= */

.user-css .article-content,
.user-css .page-content,
.user-css .content,
.user-css .article- {
  max-width: var(--nehwon-max-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: clamp(12px, 2vw, 22px);
  padding-right: clamp(12px, 2vw, 22px);
}

/* =========================================================
HEADINGS
========================================================= */

.user-css h1,
.user-css h2,
.user-css h3,
.user-css h4 {
line-height: 1.2;
margin-top: 1.2em;
margin-bottom: 0.5em;
letter-spacing: 0.01em;
}

.user-css h2 {
padding-bottom: 0.25em;
border-bottom: 1px solid var(--nehwon-border);
}

/* =========================================================
LINKS
========================================================= */

.user-css a {
text-decoration-thickness: 0.12em;
text-underline-offset: 0.18em;
}

/* =========================================================
IMAGES
========================================================= */

.user-css img {
border-radius: var(--nehwon-radius);
}/* =========================================================
TABLES
========================================================= */

.user-css table {
width: 100%;
border-collapse: collapse;
overflow: hidden;
border-radius: var(--nehwon-radius);
box-shadow: 0 6px 18px var(--nehwon-soft);
}

.user-css th,
.user-css td {
padding: 0.6em 0.7em;
border-bottom: 1px solid var(--nehwon-border);
vertical-align: top;
}

.user-css tr:last-child td {
border-bottom: none;
}

/* =========================================================
QUOTES
========================================================= */

.user-css blockquote {
margin: 1em 0;
padding: 0.85em 1em;
border-left: 4px solid var(--nehwon-border);
border-radius: var(--nehwon-radius);
box-shadow: 0 6px 18px var(--nehwon-soft);
}

/* =========================================================
WELCOME TO NEHWON — GATEWAY ARTICLE
========================================================= */

/* Opening proclamation */
.user-css .nehwon-prologue {
  margin: 1.5rem auto 2rem auto;
  padding: 1.6rem 2rem;
  max-width: 900px;
  border-top: 1px solid rgba(190, 155, 82, 0.55);
  border-bottom: 1px solid rgba(190, 155, 82, 0.55);
  background: rgba(0, 0, 0, 0.18);
  text-align: center;
  font-size: 1.25rem;
  line-height: 1.75;
}

/* Introductory subtitle */
.user-css .nehwon-kicker {
margin: 1.5rem auto;
text-align: center;
letter-spacing: 0.09em;
text-transform: uppercase;
font-size: 1.15rem;
line-height: 1.4;
opacity: 0.9;
}/* General lore box */
.user-css .nehwon-lorebox {
margin: 1.5rem 0;
padding: 1rem 1.25rem;
border-left: 4px solid rgba(190, 155, 82, 0.72);
border-radius: 10px;
background: rgba(0, 0, 0, 0.16);
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.13);
}

/* Dramatic warning box */
.user-css .nehwon-warning {
margin: 1.75rem 0;
padding: 1.15rem 1.35rem;
border: 1px solid rgba(155, 75, 60, 0.48);
border-radius: 12px;
background: rgba(55, 10, 10, 0.20);
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}

/* Reading guide cards */
.user-css .nehwon-path {
height: 100%;
margin: 0.6rem 0;
padding: 1rem 1.1rem;
border: 1px solid rgba(190, 155, 82, 0.34);
border-radius: 12px;
background: rgba(0, 0, 0, 0.14);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.11);
}

.user-css .nehwon-path h3 {
margin-top: 0.1rem;
text-align: center;
}

/* Image captions */
.user-css .nehwon-caption {
margin-top: -0.4rem;
margin-bottom: 1.4rem;
text-align: center;
font-size: 0.86rem;
font-style: italic;
opacity: 0.75;
}

/* Decorative divider */
.user-css .nehwon-divider {
margin: 2rem auto;
text-align: center;
letter-spacing: 0.55em;
opacity: 0.65;
}

/* Drop cap refinement */
.user-css .dropcap,
.user-css span.dropcap {
line-height: 0.85;
}/* =========================================================
SHORTER ARTICLE HEADER
========================================================= */

/*
This targets the image areas, not the title text itself.
Change 180px to 140px for an even shorter header.
*/

.user-css .article-title-image,
.user-css .article-title-image-wrapper {
min-height: 180px !important;
height: 180px !important;
max-height: 180px !important;
overflow: hidden;
}

/* Crop rather than distort the header image */
.user-css .article-title-image img,
.user-css .article-title-image-wrapper img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
}

/* =========================================================
   ARTICLE BODY TEXT SIZE
   ========================================================= */

.user-css .article-content p,
.user-css .article-content li,
.user-css .article- p,
.user-css .article- li,
.user-css .page-content p,
.user-css .page-content li {
  font-size: 1.18rem !important;
  line-height: 1.7 !important;
}

.user-css .article-content ul,
.user-css .article-content ol,
.user-css .article- ul,
.user-css .article- ol {
  font-size: inherit !important;
}

.user-css .article-content li strong,
.user-css .article-content li b,
.user-css .article- li strong,
.user-css .article- li b {
  font-size: inherit !important;
}/* =========================================================
NEHWON TYPOGRAPHY
========================================================= */

/* Main article prose */
.user-css,
.user-css p,
.user-css li,
.user-css td,
.user-css blockquote,
.user-css .article-content,
.user-css .article- {
font-family: AlegreyaWA, Georgia, serif !important;
font-optical-sizing: auto;
font-weight: 400;
}

/* Article titles and section headings */
.user-css h1,
.user-css h2,
.user-css h3,
.user-css h4,
.user-css h5,
.user-css h6,
.user-css .article-title h1,
.user-css .world-title {
font-family: GermaniaOneWA, Georgia, serif !important;
font-weight: 400 !important;
}

/* Bold prose */
.user-css strong,
.user-css b {
font-family: AlegreyaWA, Georgia, serif !important;
font-weight: 700 !important;
}

/* Italics and atmospheric passages */
.user-css em,
.user-css blockquote,
.user-css .nehwon-prologue {
  font-family: AlegreyaWA, Georgia, serif !important;
  font-style: italic;
}/* =========================================================
   SHORTER HOMEPAGE COVER
   ========================================================= */

.user-css.page-world-homepage .world-cover,
.user-css.page-world-homepage .cover,
.user-css.page-world-homepage .world-header,
.user-css.page-world-homepage .world-header-image,
.user-css.page-world-homepage .world-cover-image {
  height: 260px !important;
  min-height: 260px !important;
  max-height: 260px !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center 35% !important;
}

/* =========================================================
   HIDE ARTICLE AND CATEGORY TITLE ICONS
   ========================================================= */

.user-css .article-title-icon,
.user-css .category-title-icon,
.user-css .world-category-title .fa,
.user-css .world-category-title .fas,
.user-css .world-category-title .far,
.user-css .world-category-title .fab,
.user-css .world-category-title .ra,
.user-css .world-article-title .fa,
.user-css .world-article-title .fas,
.user-css .world-article-title .far,
.user-css .world-article-title .fab,
.user-css .world-article-title .ra {
  display: none !important;
}/* =========================================================
   NEHWON — MINIMUM READABLE TEXT SIZE
   No ordinary website text should appear smaller than 19px
   ========================================================= */

.user-css {
  font-size: 19px;
  line-height: 1.65;
}

/* Ordinary text throughout articles and category pages */
.user-css p,
.user-css li,
.user-css dd,
.user-css dt,
.user-css td,
.user-css th,
.user-css label,
.user-css figcaption,
.user-css caption,
.user-css small,
.user-css .small,
.user-css .text-small,
.user-css .text-muted {
  font-size: 19px !important;
  line-height: 1.65 !important;
}

/* Child articles and sub-article lists */
.user-css .article-children,
.user-css .article-children-list,
.user-css .article-children li,
.user-css .article-children a,
.user-css .subarticles,
.user-css .subarticles li,
.user-css .subarticles a,
.user-css .children-list,
.user-css .children-list li,
.user-css .children-list a {
  font-size: 19px !important;
  line-height: 1.65 !important;
}

/* Article sidebar and metadata boxes */
.user-css .article-sidebar,
.user-css .article-sidebar p,
.user-css .article-sidebar li,
.user-css .article-sidebar dd,
.user-css .article-sidebar dt,
.user-css .article-metadata,
.user-css .article-metadata p,
.user-css .metadata,
.user-css .metadata p,
.user-css .panel,
.user-css .panel p,
.user-css .card,
.user-css .card p {
  font-size: 19px !important;
  line-height: 1.6 !important;
}/* Breadcrumbs, navigation details, excerpts, and secondary text */
.user-css .breadcrumb,
.user-css .breadcrumbs,
.user-css .article-excerpt,
.user-css .article-subheading,
.user-css .world-navigation,
.user-css .category-list,
.user-css .category-list a {
  font-size: 19px !important;
  line-height: 1.6 !important;
}

/* Child article links should be especially easy to read */
.user-css .article-children a,
.user-css .subarticles a,
.user-css .children-list a {
  font-size: 20px !important;
}

/* =========================================================
   NEHWON — ARTICLE RELATIONSHIP LINKS AND SIDEBAR METADATA
   ========================================================= */

/* Scale sidebar metadata down one step */
.user-css .article-sidebar,
.user-css .article-sidebar p,
.user-css .article-sidebar li,
.user-css .article-sidebar dd,
.user-css .article-sidebar dt,
.user-css .article-metadata,
.user-css .article-metadata p,
.user-css .metadata,
.user-css .metadata p,
.user-css .panel,
.user-css .panel p,
.user-css .card,
.user-css .card p {
  font-size: 18px !important;
  line-height: 1.55 !important;
}

/* =========================================================
   NEHWON — FORCE READABLE ARTICLE LINKS
   ========================================================= */

/* Bulleted links beneath article titles */
.user-css li,
.user-css li a {
  font-size: 20px !important;
  line-height: 1.6 !important;
}/* Article information and metadata boxes */
.user-css .article-sidebar *,
.user-css .sidebar *,
.user-css .metadata *,
.user-css .article-metadata *,
.user-css .panel- *,
.user-css .card- * {
  font-size: 18px !important;
  line-height: 1.55 !important;
}

/* =========================================================
   NEHWON — READABLE LINKS WITHIN ARTICLE CONTENT
   Catches links not rendered as ordinary list items
   ========================================================= */

.user-css .article-content a,
.user-css .article- a,
.user-css .article-page-content a,
.user-css .article-relationship a,
.user-css .article-relations a,
.user-css .relation a,
.user-css .relations a {
  font-size: 20px !important;
  line-height: 1.6 !important;
}

/* =========================================================
   NEHWON — FORCE DOCUMENT AND ARTICLE BODY TEXT TO 18PX
   ========================================================= */

.user-css .article-content,
.user-css .article-content p,
.user-css .article-content li,
.user-css .article-content li p,
.user-css .article-content div,
.user-css .article-,
.user-css .article- p,
.user-css .article- li,
.user-css .article- li p,
.user-css .article- div,
.user-css .article-content-left,
.user-css .article-content-left p,
.user-css .article-content-left li,
.user-css .article-content-left li p,
.user-css .article-content-left div {
  font-size: 18px !important;
  line-height: 1.6 !important;
}/* Preserve readable emphasis within the  */
.user-css .article-content strong,
.user-css .article-content b,
.user-css .article-content em,
.user-css .article-content i,
.user-css .article- strong,
.user-css .article- b,
.user-css .article- em,
.user-css .article- i,
.user-css .article-content-left strong,
.user-css .article-content-left b,
.user-css .article-content-left em,
.user-css .article-content-left i {
  font-size: inherit !important;
}

/* =========================================================
   EXPAND ARTICLES WHEN THE RIGHT COLUMN IS UNUSED
   ========================================================= */

.user-css-extended .article-content-right:has(> .world-global-article-additional:not(:has(*))) {
  display: none !important;
}

.user-css-extended .article-content-left:has(+ .article-content-right > .world-global-article-additional:not(:has(*))) {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  float: none !important;
}

/* Autolinked article words throughout the world */
.user-css a,
.user-css-extended a {
    color: #8b1a0e !important;
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.user-css a:hover,
.user-css-extended a:hover {
    color: #c12b18 !important;
    text-decoration-thickness: 2px;
}/* TITLE-ONLY MAP DIRECTORY */

/* Each map card becomes the positioning area */
.user-css .world-maps .map-box {
    position: relative !important;
    min-height: 110px !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/*
Keep the genuine World Anvil link alive and stretch it across
the entire card.
*/
.user-css .world-maps .map-box a {
    position: absolute !important;
    inset: 0 !important;
    z-index: 20 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    text-decoration: none !important;
}

/* Hide the map artwork without deleting its clickable element */
.user-css .world-maps .map-box a img,
.user-css .world-maps .map-box a iframe,
.user-css .world-maps .map-box a canvas,
.user-css .world-maps .map-box a .map-,
.user-css .world-maps .map-box a .map-thumbnail {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Keep the visible map title above the invisible artwork */
.user-css .world-maps .map-box .map-title,
.user-css .world-maps .map-box h3,
.user-css .world-maps .map-box h4 {
    position: relative !important;
    z-index: 21 !important;
    pointer-events: none !important;
}/* Hover indication */
.user-css .world-maps .map-box:hover {
    background: rgba(139, 26, 14, 0.08) !important;
}

/* Hide map-deion text while preserving the linked map title */
.user-css .world-maps .map-box small {
    font-size: 0 !important;
    line-height: 0 !important;
}

/* Restore the map title link */
.user-css .world-maps .map-box small a[href*="/map/"] {
    display: block !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    font-weight: 600 !important;
}

/* Hide spacers, notes, and edit links inside the deion area */
.user-css .world-maps .map-box small .line-spacer,
.user-css .world-maps .map-box small .nehwon-note,
.user-css .world-maps .map-box small .world-editor-link {
    display: none !important;
}/* ============================================================
   THE SALT TOWER — CYCLE COMPONENT SYSTEM  ·  world-CSS edition
   Moved from article CSS so the hub + all five Canto articles
   inherit it. Everything fires ONLY inside [:st-tower].
   KEEP THIS BLOCK AT THE VERY END OF WORLD CSS.
   ------------------------------------------------------------
   Changes from article-CSS v4:
   · selectors hardened (ancestor-prefixed) to out-specify the
     world font-size !important rules in ALL load orders
   · page-darkening rescoped to .article-content only — fixes
     the fog/dark background leaking onto the global 
   · card sway stagger extended to 5 cards (the 5 Cantos)
   ============================================================ */

/* --- expand the article column (scoped: won't touch sidebar articles) ----- */
.user-css .article-content-left:has(.st-tower),
.user-css .article-content:has(.st-tower) .article-content-left{
  width:100% !important; max-width:100% !important; flex:0 0 100% !important;
}
.user-css .article-content:has(.st-tower) .article-content-right,
.user-css .article-content-left:has(.st-tower) ~ .article-content-right{
  display:none !important;
}/* --- darken the page area behind the manu (LEAK FIX) ----------------
   Was: .user-css:has(.st-tower){...} — that selector sits on the page ROOT,
   so it wiped the world's textured background on the whole .
   Now scoped to the article content area only. -------------------------- */
.user-css .article-content:has(.st-tower),
.user-css:has(.st-tower) .article-content{
  background-color:#141a1f !important;
  background-image:none !important;
}

/* --- the page: a dark, textured, framed manu ------------------------ */
.user-css .article-content .st-tower,
.user-css .st-tower{
  position:relative;
  max-width:880px; margin:1.5em auto; padding:3.4em clamp(1.4em,4vw,3.4em);
  color:#dbe4ec;
  font-family:AlegreyaWA,'EB Garamond',Georgia,serif;
  font-size:1.16rem; line-height:1.9; text-align:justify; hyphens:auto;
  /* dark overlay OVER the fog plate — keeps text crisp, lets fog breathe */
  background:
    linear-gradient(180deg, rgba(10,14,19,.84) 0%, rgba(12,17,24,.78) 45%, rgba(9,13,18,.88) 100%),
    url(https://wa-cdn.nyc3.digitaloceanspaces.com/user-data/production/e44b2833-b031-44f8-8d69-69884ac75ec6/uploads/images/14ce341788b0e90890a21c4ba7c157d5.png);
  background-size:cover;
  background-position:center;
  background-attachment:fixed;
  background-repeat:no-repeat;
  border-radius:3px;
  box-shadow:
    0 0 0 1px rgba(150,180,205,.10),
    0 0 34px rgba(0,0,0,.55),
    inset 0 0 120px rgba(0,0,0,.45);
}/* ornamental inner frame (double-rule look) */
.user-css .st-tower::before{
  content:""; position:absolute; inset:14px; pointer-events:none;
  border:1px solid rgba(150,185,210,.22);
  box-shadow:inset 0 0 0 4px rgba(14,19,25,.6), inset 0 0 22px rgba(120,170,210,.06);
  border-radius:2px;
}
.user-css .st-tower > *{ position:relative; z-index:1; }

/*  text — ancestor-prefixed so it beats the world 18px rules
   no matter where this block sits */
.user-css .article-content .st-tower p,
.user-css .st-tower p{
  margin:0 0 1.35em 0;
  font-size:1.16rem !important; line-height:1.9 !important; color:#dbe4ec;
}

/* --- opening tagline ------------------------------------------------------ */
.user-css .st-tower .st-hero{
  text-align:center; font-family:GermaniaOneWA,serif; letter-spacing:.14em;
  color:#9fb6c8; font-size:1.35rem !important; margin:.2em 0 1.6em;
  text-shadow:0 0 18px rgba(120,170,210,.28);
}

/* --- epigraph verse ------------------------------------------------------- */
.user-css .st-tower .st-verse i{ display:block; }
.user-css .st-tower .st-verse{
  position:relative; text-align:center; font-style:italic;
  font-size:1.28rem !important; line-height:2.05; color:#cfe0ee;
  padding:1.7em 1.4em; margin:1.2em auto 2.6em; max-width:600px;
  border-top:1px solid rgba(150,185,210,.32);
  border-bottom:1px solid rgba(150,185,210,.32);
  text-shadow:0 0 16px rgba(120,170,210,.25);
}.user-css .st-tower .st-verse::before,
.user-css .st-tower .st-verse::after{
  content:"❆"; position:absolute; left:50%; transform:translateX(-50%);
  color:#87b0d0; font-size:1rem; text-shadow:0 0 12px rgba(120,190,230,.6);
}
.user-css .st-tower .st-verse::before{ top:-.72em; }
.user-css .st-tower .st-verse::after{ bottom:-.72em; }

/* --- section titles with flanking rules ----------------------------------- */
.user-css .st-tower .st-title{
  text-align:center; font-family:GermaniaOneWA,serif; font-weight:normal;
  letter-spacing:.16em; font-size:2.15rem !important; color:#d3dfe9;
  margin:2.8em 0 .1em; line-height:1.18;
  text-shadow:0 0 22px rgba(120,170,210,.32);
}
.user-css .st-tower .st-title .st-num{
  display:block; font-size:1.15rem !important; letter-spacing:.28em;
  color:#7f97ab; margin-bottom:.5em; text-shadow:none;
}
/* divider: a hairline with a centered snowflake */
.user-css .st-tower .st-div{
  text-align:center; color:#87b0d0; font-size:1.1rem !important;
  letter-spacing:.5em; margin:.7em auto 1.9em; max-width:340px;
  position:relative; text-shadow:0 0 16px rgba(120,190,230,.55);
}
.user-css .st-tower .st-div::before,
.user-css .st-tower .st-div::after{
  content:""; position:absolute; top:50%; width:34%; height:1px;
  background:linear-gradient(90deg,transparent,rgba(150,185,210,.5));
}
.user-css .st-tower .st-div::before{ left:0; }
.user-css .st-tower .st-div::after{ right:0; transform:scaleX(-1); }/* --- drop cap (aligned; the cresset-fire) --------------------------------- */
.user-css .st-tower .st-cap{
  float:left; font-family:GermaniaOneWA,serif; font-size:3.9rem !important;
  line-height:1; padding:0; margin:0 .12em 0 0; color:#e6b65c;
  position:relative; top:-.26em;
  text-shadow:0 0 24px rgba(230,182,92,.6);
}

/* --- QUOTEBLOCK (the pull-quotes) ----------------------------------------- */
.user-css .st-tower .st-pull{
  position:relative; margin:2.6em auto; max-width:660px; padding:.4em 1em .2em;
  font-family:AlegreyaWA,Georgia,serif; font-style:italic; font-weight:500;
  font-size:1.7rem !important; line-height:1.4; text-align:center; color:#e7eef5;
  text-shadow:0 0 20px rgba(120,170,210,.28);
}
.user-css .st-tower .st-pull::before{
  content:"\201C";
  display:block; font-family:GermaniaOneWA,Georgia,serif; font-style:normal;
  font-size:3.2rem; line-height:.2; color:#e6b65c; margin:.35em 0 .15em;
  text-shadow:0 0 22px rgba(230,182,92,.5);
}
.user-css .st-tower .st-pull::after{
  content:""; display:block; width:70px; height:1px; margin:.7em auto 0;
  background:linear-gradient(90deg,transparent,rgba(230,182,92,.6),transparent);
}/* --- framed art plate ----------------------------------------------------- */
.user-css .st-tower .st-plate{
  text-align:center; margin:2em auto; max-width:760px; padding:.7em;
  border:1px solid rgba(150,185,210,.22);
  box-shadow:inset 0 0 0 4px rgba(14,19,25,.7), 0 0 26px rgba(0,0,0,.5);
  border-radius:2px; background:rgba(0,0,0,.2);
}
.user-css .st-tower .st-plate img{ border-radius:1px; box-shadow:0 6px 22px rgba(0,0,0,.55); }
.user-css .st-tower .st-plate .cap{
  display:block; margin-top:.7em; font-style:italic; font-size:.95rem !important;
  letter-spacing:.06em; color:#8ea3b6;
}
.user-css .st-tower .st-plate:empty::before,
.user-css .st-tower .st-plate.ph{ color:#7d94a8; font-style:italic; }

/* --- closing coda --------------------------------------------------------- */
.user-css .st-tower .st-coda{
  text-align:center; font-family:AlegreyaWA,serif; font-style:italic;
  font-size:1.4rem !important; color:#e7eef5; margin:.2em 0 1.1em;
  text-shadow:0 0 18px rgba(120,170,210,.3);
}

/* ============================================================
   RAINBOW PALACE — rp-* article styling
   Add this block to your World CSS (alongside the st-* Salt Tower rules).
   Prefix rp- avoids collision with st- and world classes.
   ============================================================ */

/* ---- Illuminated drop-cap (opening of a section) ---- */
.user-css .rp-article .rp-cap{
  float:left;
  font-family:'Cinzel','Trajan Pro',Georgia,serif;
  font-size:5.4em;
  line-height:.78;
  padding:.02em .12em 0 0;
  margin:.02em .08em 0 0;
  color:#7a5a1e;
  text-shadow:0 1px 0 rgba(0,0,0,.35);
  font-weight:700;
}

/* ---- Ornamental section divider ---- */
.user-css .rp-article .rp-div{
  text-align:center;
  color:#8a6a2a;
  font-size:1.35em;
  letter-spacing:.6em;
  margin:1.5em 0 1.2em;
  padding-left:.6em; /* balance the letter-spacing so the glyph row stays centred */
  border:0;
}

/* ---- Quick-facts panel (boxed, near the top) ---- */
.user-css .rp-article .rp-facts{
  border:1px solid rgba(122,90,30,.55);
  border-left:4px solid #7a5a1e;
  background:rgba(122,90,30,.07);
  padding:1em 1.2em;
  margin:1.2em 0 1.6em;
  border-radius:2px;
  font-size:.96em;
  line-height:1.5;
}
.user-css .rp-article .rp-facts .rp-facts-title{
  font-family:'Cinzel',Georgia,serif;
  font-size:1.05em;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#8a6a2a;
  border-bottom:1px solid rgba(122,90,30,.35);
  padding-bottom:.4em;
  margin-bottom:.6em;
}

/* ---- Floating aside box (right-floated sidebar) ---- */
.user-css .rp-article .rp-aside{
  float:right !important;
  width:38%;
  min-width:220px;
  margin:.3em 0 1.1em 1.4em;
  padding:1em 1.15em;
  border:1px solid rgba(90,60,120,.5);      /* violet-tinted, for "iris" */
  border-top:3px solid #5a3c78;
  background:rgba(90,60,120,.08);
  border-radius:2px;
  font-size:.92em;
  line-height:1.5;
}
.user-css .rp-article .rp-aside .rp-aside-title{
  font-family:'Cinzel',Georgia,serif;
  font-size:1.05em;
  letter-spacing:.1em;
  color:#6a4a8c;
  text-transform:uppercase;
  margin-bottom:.5em;
  display:block;
}
/* clear the float so following sections don't wrap oddly on narrow screens */
.user-css .rp-article .rp-clear{ clear:both; }

/* ---- Ominous pull-quote ---- */
.user-css .rp-article .rp-pull{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-style:italic;
  font-size:1.5em;
  line-height:1.35;
  text-align:center;
  color:#6a4a8c;
  margin:1.4em 2em;
  padding:.4em 0;
  border-top:1px solid rgba(90,60,120,.35);
  border-bottom:1px solid rgba(90,60,120,.35);
}

/* ---- Eldritch warning callout ---- */
.user-css .rp-article .rp-warn{
  border:1px solid rgba(60,80,90,.5);
  border-left:4px solid #3a4a52;
  background:rgba(40,55,60,.10);
  padding:.9em 1.15em;
  margin:1.3em 0;
  border-radius:2px;
  font-style:italic;
  color:#4a5a62;
}

/* Mobile: let the aside stack full-width instead of floating narrow */
@media (max-width:767px){
  .user-css .rp-article .rp-aside{
    float:none !important; width:auto; margin:1em 0;
  }
}

/* ============================================================
   THE LAW OF THE TIDES — tide-* article styling  (v4: for LIGHT/parchment bg)
   Dark celestial blues that pop against a light tan page.
   Uses !important on colors to beat the world's base text color.
   Add to your World CSS (replaces any earlier tide-* block).
   ============================================================ */

/* ---- Deep-blue drop-cap ---- */
.user-css .tide-article .tide-cap{
  float:left;
  font-family:'Cinzel','Trajan Pro',Georgia,serif;
  font-size:5.4em;
  line-height:.78;
  padding:.02em .12em 0 0;
  margin:.02em .08em 0 0;
  color:#1f3a63 !important;
  text-shadow:0 1px 2px rgba(0,0,0,.15);
  font-weight:700;
}

/* ---- Ornamental divider (moon-phase glyphs) ---- */
.user-css .tide-article .tide-div{
  text-align:center;
  color:#2f4d78 !important;
  font-size:1.2em;
  letter-spacing:.55em;
  margin:1.5em 0 1.2em;
  padding-left:.55em;
  border:0;
}

/* ---- Quick-facts panel ---- */
.user-css .tide-article .tide-facts{
  border:1px solid rgba(40,70,120,.5);
  border-left:4px solid #2f4d78;
  background:rgba(70,110,170,.14);
  padding:1em 1.2em;
  margin:1.2em 0 1.6em;
  border-radius:2px;
  font-size:.97em;
  line-height:1.6;
  color:#22374f !important;
}
.user-css .tide-article .tide-facts *{ color:#22374f !important; }
.user-css .tide-article .tide-facts .tide-facts-title{
  font-family:'Cinzel',Georgia,serif;
  font-size:1.08em;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#1f3a63 !important;
  border-bottom:1px solid rgba(40,70,120,.4);
  padding-bottom:.4em;
  margin-bottom:.6em;
}

/* ---- Floating aside (the two moons) ---- */
.user-css .tide-article .tide-aside{
  float:right !important;
  width:38%;
  min-width:220px;
  margin:.3em 0 1.1em 1.4em;
  padding:1em 1.15em;
  border:1px solid rgba(40,70,120,.45);
  border-top:3px solid #35547f;
  background:rgba(70,110,170,.12);
  border-radius:2px;
  font-size:.93em;
  line-height:1.6;
  color:#22374f !important;
}
.user-css .tide-article .tide-aside *{ color:#22374f !important; }
.user-css .tide-article .tide-aside .tide-aside-title{
  font-family:'Cinzel',Georgia,serif;
  font-size:1.08em;
  letter-spacing:.1em;
  color:#1f3a63 !important;
  text-transform:uppercase;
  margin-bottom:.5em;
  display:block;
}
.user-css .tide-article .tide-clear{ clear:both; }

/* ---- Pull-quote (deep blue, elegant) ---- */
.user-css .tide-article .tide-pull{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-style:italic;
  font-size:1.65em;
  line-height:1.35;
  text-align:center;
  color:#284a75 !important;
  margin:1.4em 2em;
  padding:.4em 0;
  border-top:1px solid rgba(40,70,120,.4);
  border-bottom:1px solid rgba(40,70,120,.4);
}

/* ---- "The truer reading" callout ---- */
.user-css .tide-article .tide-deep{
  border:1px solid rgba(40,70,120,.5);
  border-left:4px solid #294668;
  background:rgba(40,70,120,.10);
  padding:.95em 1.2em;
  margin:1.3em 0;
  border-radius:2px;
  color:#22374f !important;
}
.user-css .tide-article .tide-deep *{ color:#22374f !important; }
.user-css .tide-article .tide-deep .tide-deep-title{
  font-family:'Cinzel',Georgia,serif;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#1f3a63 !important;
  font-size:.97em;
  display:block;
  margin-bottom:.4em;
}

/* stop the h2 underline from crossing the floating aside */
.user-css .tide-article h2{
  border-bottom:none !important;
  padding-bottom:0 !important;
}

/* Mobile: stack the aside */
@media (max-width:767px){
  .user-css .tide-article .tide-aside{
    float:none !important;
    width:auto;
    margin:1em 0;
  }
}

/* ============================================================
   CYCLE GALLERY — the 5 Canto portal cards (hub) + nav
   ============================================================ */

/* anchor jump-offset so a target doesn't land under WA's edit bar */
.user-css .st-tower [id]{ scroll-margin-top:70px; }.user-css .st-tower .st-card{
  height:100%; display:flex; flex-direction:column;
  padding:.9em .9em 1.1em; margin:.4em 0;
  /* translucent so the page fog shows through, with a soft inner darkening for text */
  background:linear-gradient(180deg, rgba(16,22,30,.42), rgba(10,14,19,.58));
  backdrop-filter:blur(2px);
  border:1px solid rgba(150,185,210,.20);
  box-shadow:inset 0 0 0 3px rgba(14,19,25,.35), 0 4px 20px rgba(0,0,0,.4);
  border-radius:3px; text-align:center;
  transition:border-color .25s, box-shadow .25s, transform .35s ease;
  /* gentle ship-on-a-swell sway */
  animation:st-swell 7s ease-in-out infinite;
  transform-origin:center bottom;   /* pivots from the waterline, like a keel */
}
/* the swell: a slow bob + subtle roll, peaks offset so it never looks mechanical */
@keyframes st-swell{
  0%   { transform: translateY(0)      rotate(-0.6deg); }
  25%  { transform: translateY(-2.5px) rotate(0.3deg);  }
  50%  { transform: translateY(-1px)   rotate(0.7deg);  }
  75%  { transform: translateY(-3px)   rotate(-0.2deg); }
  100% { transform: translateY(0)      rotate(-0.6deg); }
}
/* stagger the FIVE canto cards so they rock independently, like separate boats */
.user-css .st-tower .row > *:nth-child(1) .st-card{ animation-delay: 0s;    }
.user-css .st-tower .row > *:nth-child(2) .st-card{ animation-delay: -1.8s; }
.user-css .st-tower .row > *:nth-child(3) .st-card{ animation-delay: -3.4s; }.user-css .st-tower .row > *:nth-child(4) .st-card{ animation-delay: -0.9s; }
.user-css .st-tower .row > *:nth-child(5) .st-card{ animation-delay: -2.6s; }
/* hover = steady the boat and lift, like grabbing the rail */
.user-css .st-tower .st-card:hover{
  border-color:rgba(230,182,92,.45);
  box-shadow:inset 0 0 0 3px rgba(14,19,25,.6), 0 6px 26px rgba(0,0,0,.6), 0 0 22px rgba(230,182,92,.15);
  animation-play-state:paused;
  transform:translateY(-4px);
}
/* respect readers who prefer reduced motion (accessibility) */
@media (prefers-reduced-motion: reduce){
  .user-css .st-tower .st-card{ animation:none; }
}

/* the cover-art slot (placeholder now; drop [img:ID] in later) */
.user-css .st-tower .st-card-plate{
  aspect-ratio:3/4; margin:-.9em -.9em .8em;
  position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.22); border-bottom:1px solid rgba(150,185,210,.18);
  color:#8ea3b6; font-style:italic; font-size:.85rem !important; letter-spacing:.05em;
}
.user-css .st-tower .st-card-plate *{
  position:static !important; height:auto !important; overflow:visible !important;
  margin:0 !important; padding:0 !important;
}
.user-css .st-tower .st-card-plate img{
  position:absolute !important;
  top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
  width:100% !important; height:100% !important;
  object-fit:cover; object-position:center 40%; border-radius:0;
}
.user-css .st-tower .st-card-num{
  font-family:GermaniaOneWA,serif; color:#e6b65c; font-size:1.1rem !important;
  letter-spacing:.3em; text-shadow:0 0 16px rgba(230,182,92,.5); margin-bottom:.15em;
}.user-css .st-tower .st-card-name{
  font-family:GermaniaOneWA,serif; color:#dbe4ec; font-size:1.28rem !important;
  line-height:1.15; letter-spacing:.04em; margin-bottom:.5em;
  text-shadow:0 0 18px rgba(120,170,210,.28);
}
.user-css .st-tower .st-card-line{
  font-family:AlegreyaWA,serif; font-style:italic; color:#9fb6c8;
  font-size:.98rem !important; line-height:1.4; flex:1 0 auto; margin-bottom:.9em;
}
.user-css .st-tower .st-card a{ text-decoration:none !important; }
.user-css .st-tower .st-card-go{
  display:inline-block; font-family:GermaniaOneWA,serif; letter-spacing:.18em;
  font-size:.85rem !important; color:#bcd6ea !important; padding:.35em .9em;
  border:1px solid rgba(150,185,210,.35); border-radius:2px;
  transition:background .2s, color .2s, border-color .2s;
}
.user-css .st-tower .st-card:hover .st-card-go{
  color:#0e1319 !important; background:#e6b65c; border-color:#e6b65c;
}

.user-css .st-tower .st-wing .artist-credits{
  display:none !important;
}

.user-css .st-tower .st-wing .artist-credits,
.user-css .st-tower .st-plate .artist-credits,
.user-css .st-tower .st-plate figcaption,
.user-css .st-tower .st-plate .caption,
.user-css .st-tower .st-plate small,
.user-css .st-tower .st-card-plate .artist-credits,
.user-css .st-tower .st-card-plate figcaption,
.user-css .st-tower .st-card-plate .caption,
.user-css .st-tower .st-card-plate small{
  display:none !important;
}

.user-css .st-artcredits{
  max-width:1000px; margin:1.6em auto 1em;
  padding:1.4em 1.8em;
  border-top:1px solid rgba(150,150,150,.25);
  color:#9aa6b2 !important;
  font-size:.82rem; line-height:1.8;
}
.user-css .st-artcredits *{
  color:#9aa6b2 !important;
}
.user-css .st-artcredits h4{
  color:#b8a06a !important; font-size:.9rem; letter-spacing:.2em;
  text-transform:uppercase; margin:0 0 .8em; text-align:center;
}
.user-css .st-artcredits a{
  color:#a9c0d4 !important; text-decoration:underline;
}/* END OF SALT TOWER CYCLE BLOCK */

/* ============================================================
   SALT TOWER — ST-DIPTYCH  (Lankhmar wall-section)   [LEVEL-SET, clean]
   Stained timber + blackened iron. Riveted corner brackets,
   a kraken buttress divider, a CARVED LINTEL (real art), threshold base.
   Fires only inside [:st-tower].
   ------------------------------------------------------------
   TWO KNOBS you can dial by eye:
     · WING SHAPE  -> .st-wing  padding-bottom
         70% = full Piero landscape (wide)   75% = clean 4:3
         80% = squarer (the look you liked)
     · CROP BIAS   -> .st-wing img  object-position  (the "42%")
         lower % shows more of the TOP of each plate; higher shows more bottom
   PANEL BORDERS: the two "box-shadow:0 0 0 1px ..." lines (wing + hinge).
         Delete BOTH to remove the three-panel frame edges.
   ============================================================ */

.user-css .st-tower .st-diptych{
  --dip-timber:#231a13;
  --dip-iron:#15171a;
  --dip-iron-hi:#454b52;
  --dip-bronze:#6e5a33;
  --dip-verdi:#3f5a4e;
  --dip-rivet:#5a5f66;

position:relative;
  display:flex !important; justify-content:center; align-items:stretch; gap:6px;
  max-width:1000px; margin:0px auto 1.2em;
  padding:34px 30px 40px;

background:
    linear-gradient(90deg, var(--dip-iron) 0 14px, transparent 14px),
    linear-gradient(270deg, var(--dip-iron) 0 14px, transparent 14px),
    repeating-linear-gradient(90deg, rgba(0,0,0,.24) 0 2px, rgba(255,255,255,.012) 2px 7px),
    linear-gradient(180deg, #2b2018 0%, var(--dip-timber) 40%, #150f0a 100%);
  border-radius:2px;
  box-shadow:
    inset 0 0 0 1px rgba(110,90,51,.30),
    inset 0 0 46px rgba(0,0,0,.75),
    0 30px 70px rgba(0,0,0,.8);
}

/* LINTEL — carved beam, sun-disc at the right third.
   Ratio locked to the artwork (8016x1028) so it never squashes. */
.user-css .st-tower .st-lintel{
  display:block !important;
  width:100% !important;
  max-width:1000px;
  height:0 !important;
  padding-bottom:12.82% !important;
  margin:0 auto -4px;
  background:url(https://wa-cdn.nyc3.digitaloceanspaces.com/user-data/production/e44b2833-b031-44f8-8d69-69884ac75ec6/uploads/images/20e73a2b04cc919460132145be57a01a.png) center/cover no-repeat !important;
}

/* BASE — shipwreck threshold panel, ratio-locked to the art (3776x1248) */
.user-css .st-tower .st-base{
  display:block !important;
  width:100% !important;
  max-width:1000px;
  height:0 !important;
  padding-bottom:33.05% !important;
  margin:-4px auto 0;
  background:url(https://wa-cdn.nyc3.digitaloceanspaces.com/user-data/production/e44b2833-b031-44f8-8d69-69884ac75ec6/uploads/images/fbee19a5e267ce1cf7dd03bf19d96be0.png) center/cover no-repeat !important;
}

.user-css .st-tower .st-hinge,
.user-css .st-tower .st-base{
  font-size:0 !important;
}

/* THRESHOLD BASE + wave motif */
.user-css .st-tower .st-diptych::after{
  content:none;   /* retired: real shipwreck art (.st-base) now provides the threshold */
}

/* RIVETED CORNER BRACKETS */
.user-css .st-tower .st-bracket{
  position:absolute; width:52px; height:52px; z-index:3; pointer-events:none;
  background:linear-gradient(135deg, var(--dip-iron-hi), var(--dip-iron) 60%);
  box-shadow:0 2px 6px rgba(0,0,0,.8), inset 0 0 0 1px rgba(0,0,0,.6);
}
.user-css .st-tower .st-bracket::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(circle at 12px 12px, var(--dip-rivet) 0 2.6px, transparent 3px),
    radial-gradient(circle at 38px 12px, var(--dip-rivet) 0 2.6px, transparent 3px),
    radial-gradient(circle at 12px 38px, var(--dip-rivet) 0 2.6px, transparent 3px);
}
.user-css .st-tower .st-bracket.tl{ top:4px; left:4px; clip-path:polygon(0 0,100% 0,0 100%); }
.user-css .st-tower .st-bracket.tr{ top:4px; right:4px; clip-path:polygon(0 0,100% 0,100% 100%); }
.user-css .st-tower .st-bracket.bl{ bottom:4px; left:4px; clip-path:polygon(0 0,0 100%,100% 100%); }
.user-css .st-tower .st-bracket.br{ bottom:4px; right:4px; clip-path:polygon(100% 0,100% 100%,0 100%); }

/* ---- THE WING BOX (this is the piece that was missing — it SIZES the wing) */
.user-css .st-tower .st-diptych .st-wing{
  flex:1 1 0 !important;
  min-width:0;
  align-self:flex-start;
  position:relative;
  height:0;
  padding-bottom:75%;            /* <-- WING SHAPE KNOB (70 wide / 75 4:3 / 80 squarer) */
  overflow:hidden;
  background:#0a0908;
  box-shadow:0 0 0 1px rgba(110,90,51,.55);   /* panel border (delete to remove) */
}

/* neutralise WA's injected image wrapper so the WING is the containing block */
.user-css .st-tower .st-diptych .st-wing *{
  position:static !important;
  height:auto !important;
  overflow:visible !important;
  margin:0 !important;
  padding:0 !important;
}

/* the plate fills the wing box exactly */
.user-css .st-tower .st-diptych .st-wing img{
  position:absolute !important;
  top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
  width:100% !important; height:100% !important;
  object-fit:cover;
  object-position:center 42%;    /* <-- CROP BIAS KNOB */
  border-radius:1px;
  filter:saturate(1.02) contrast(1.03);
}

/* the KRAKEN buttress dividing the two windows */
.user-css .st-tower .st-diptych .st-hinge{
  flex:0 0 58px;
  align-self:stretch;
  margin:0;                      /* kraken matches wing height exactly */
  position:relative;
  z-index:2;
  background:url(https://wa-cdn.nyc3.digitaloceanspaces.com/user-data/production/e44b2833-b031-44f8-8d69-69884ac75ec6/uploads/images/a58ff065b73cf7b08dc6cba23adf3bec.png) center center / cover no-repeat;
  opacity:.85;
  box-shadow:0 0 0 1px rgba(110,90,51,.55);   /* panel border (delete to remove) */
}

/* caption */
.user-css .st-tower .st-dipcap{
  max-width:1000px; margin:.2em auto 2.8em; text-align:center;
  font-family:AlegreyaWA,Georgia,serif; font-style:italic;
  font-size:.98rem !important; letter-spacing:.02em; color:#8fa3b5;
}
.user-css .st-tower .st-dipcap::before,
.user-css .st-tower .st-dipcap::after{
  content:"❆"; color:#6d8ba6; margin:0 .7em; font-style:normal;
}

/* mobile: stack; kraken pier becomes a horizontal beam */
@media (max-width:640px){
  .user-css .st-tower .st-diptych{ flex-direction:column; padding:22px 18px 26px; margin-top:120px; gap:6px; }
  .user-css .st-tower .st-diptych .st-hinge{
    flex:0 0 30px; margin:0; align-self:stretch;
    background:
      repeating-linear-gradient(180deg, rgba(0,0,0,.5) 0 2px, transparent 2px 9px),
      linear-gradient(180deg, #0d0906 0%, #2e2318 26%, #46351f 50%, #2e2318 74%, #0d0906 100%);
  }
  .user-css .st-tower .st-bracket{ width:38px; height:38px; }
}/* END ST-DIPTYCH */

/* ============================================================
   MIRA SOLVEN-ASHK — "SHOW THE SKY" chart reveal
   Pure CSS :target toggle — no JavaScript, no raw <input>.
   Everything fires ONLY inside .mira-sky — safe on all articles.
   Append at the very end of WORLD CSS.
   ============================================================ */

/* wrapper: a dark framed panel matching the Nehwon theme */
.user-css .mira-sky{
  position:relative;
  max-width:820px; margin:2em auto; padding:1.8em clamp(1em,3vw,2.4em);
  text-align:center;
  background:linear-gradient(180deg, rgba(12,16,24,.82), rgba(9,12,19,.9));
  border:1px solid rgba(150,170,210,.22);
  box-shadow:inset 0 0 0 4px rgba(12,16,22,.6), 0 0 30px rgba(0,0,0,.5);
  border-radius:3px;
}

/* the portrait */
.user-css .mira-sky .mira-portrait{
  max-width:300px; width:100%; height:auto;
  border-radius:2px; margin:0 auto .4em;
  box-shadow:0 6px 24px rgba(0,0,0,.55);
}

/* her name / title under the portrait */
.user-css .mira-sky .mira-name{
  font-family:GermaniaOneWA,serif; letter-spacing:.14em;
  color:#cdd8e6; font-size:1.5rem !important; margin:.3em 0 .05em;
  text-shadow:0 0 18px rgba(120,160,210,.3);
}
.user-css .mira-sky .mira-role{
  font-family:AlegreyaWA,serif; font-style:italic;
  color:#93a6bd; font-size:1rem !important; margin:0 0 1em;
}/* the trigger + the close control share this button look */
.user-css .mira-sky .mira-btn{
  display:inline-block; cursor:pointer;
  font-family:GermaniaOneWA,serif; letter-spacing:.2em;
  font-size:1rem !important; color:#e9dcae !important;
  padding:.5em 1.5em; margin:.3em auto;
  border:1px solid rgba(214,190,120,.5); border-radius:2px;
  text-decoration:none !important;
  transition:background .25s, color .25s, border-color .25s, box-shadow .25s;
}
.user-css .mira-sky .mira-btn:hover{
  color:#0e1319 !important; background:#d6be78; border-color:#d6be78;
  box-shadow:0 0 22px rgba(214,190,120,.3);
}

/* the collapsible chart panel — closed by default (max-height 0) */
.user-css .mira-sky .mira-chart{
  overflow:hidden; max-height:0; opacity:0;
  transition:max-height .8s ease, opacity .8s ease, margin .8s ease;
  margin:0 auto;
}
.user-css .mira-sky .mira-chart img{
  max-width:100%; height:auto; border-radius:2px;
  box-shadow:0 8px 30px rgba(0,0,0,.6); margin:0 auto;
}
.user-css .mira-sky .mira-cap{
  display:block; font-family:AlegreyaWA,serif; font-style:italic;
  color:#8ea3b6; font-size:.95rem !important; letter-spacing:.04em;
  margin:.9em auto 0;
}

/* when the panel is targeted (Show the Sky clicked), it opens */
.user-css .mira-chart:target{
  max-height:2000px; opacity:1; margin:1.4em auto 0;
}

/* hide the "Show the Sky" trigger once open, show it otherwise */
.user-css .mira-chart:target ~ .mira-open{ display:none; }
.user-css .mira-close{ display:none; }.user-css .mira-chart:target ~ .mira-close{ display:inline-block; }

/* respect reduced-motion preference */
@media (prefers-reduced-motion: reduce){
  .user-css .mira-sky .mira-chart{ transition:none; }
}
/* END MIRA SHOW THE SKY BLOCK */

/* ============================================================
   NEHWON HOMEPAGE — LORE ACCORDION ("the traveller's log")
   Pure CSS :target reveal — no JavaScript, no raw <input>.
   Everything scoped to .neh-lore — safe on all other articles.
   Append at the very end of WORLD CSS.
   ============================================================ */

.user-css .neh-lore{
  max-width:900px; margin:1.4em auto 2em;
}

/* each collapsible entry */
.user-css .neh-lore .neh-fold{
  border:1px solid rgba(150,170,210,.20);
  border-left:3px solid rgba(190,155,82,.55);
  background:linear-gradient(180deg, rgba(14,18,26,.6), rgba(10,13,20,.72));
  margin:.55em 0; border-radius:2px; overflow:hidden;
}

/* the clickable title bar (an anchor link styled as a bar) */
.user-css .neh-lore .neh-bar{
  display:block; cursor:pointer; text-decoration:none !important;
  font-family:GermaniaOneWA,serif; letter-spacing:.1em;
  color:#d8c39a !important; font-size:1.18rem !important;
  padding:.7em 1em; position:relative;
  transition:background .25s, color .25s;
}
.user-css .neh-lore .neh-bar:hover{
  background:rgba(190,155,82,.1); color:#f0e4bf !important;
}/* the ▸ marker, rotates when open */
.user-css .neh-lore .neh-bar::after{
  content:"\25B8"; position:absolute; right:1em; top:50%;
  transform:translateY(-50%); color:#be9b52; font-size:.9em;
  transition:transform .3s ease;
}

/* the hidden  — collapsed by default */
.user-css .neh-lore .neh-{
  max-height:0; opacity:0; overflow:hidden;
  transition:max-height .7s ease, opacity .7s ease, padding .7s ease;
  padding:0 1.2em;
}
.user-css .neh-lore .neh- p{
  margin:0 0 1em; font-size:1.1rem !important; line-height:1.7 !important;
  color:#cdd6e2;
}

/* OPEN STATE — when the fold is the :target */
.user-css .neh-lore .neh-fold:target .neh-{
  max-height:600px; opacity:1; padding:.4em 1.2em 1em;
}
.user-css .neh-lore .neh-fold:target .neh-bar{
  background:rgba(190,155,82,.14); color:#f4e9c6 !important;
}
.user-css .neh-lore .neh-fold:target .neh-bar::after{
  transform:translateY(-50%) rotate(90deg);
}

/* the permanent hook text above the folds */
.user-css .neh-lore .neh-hook{
  font-family:AlegreyaWA,serif; font-style:italic;
  font-size:1.2rem !important; line-height:1.7; color:#d3dae4;
  text-align:center; margin:1em auto 1.6em; max-width:760px;
}

@media (prefers-reduced-motion: reduce){
  .user-css .neh-lore .neh-{ transition:none; }
  .user-css .neh-lore .neh-bar::after{ transition:none; }
}/* END NEHWON HOMEPAGE LORE ACCORDION */

/* ============================================================
   FAR FROM COURT — the dispatches of Phinneas Werrish
   An arcane facsimile: cream page, engraved masthead, rules.
   Everything fires ONLY inside [:ffc-page].
   Append at the very end of WORLD CSS.
   ============================================================ */

/* --- expand the column on FFC pages (scoped, safe) --- */
.user-css .article-content-left:has(.ffc-page),
.user-css .article-content:has(.ffc-page) .article-content-left{
  width:100% !important; max-width:100% !important; flex:0 0 100% !important;
}
.user-css .article-content:has(.ffc-page) .article-content-right{
  display:none !important;
}/* --- THE PAGE: a sheet laid upon the page --------------------------------- */
.user-css .ffc-page{
  position:relative;
  /* narrower than a wiki column — a printed page has margins */
  max-width:700px; margin:2.4em auto; padding:4em clamp(2em,6vw,4.6em);
  color:#241d14;
  /* FINER, WHITER STOCK than the aged parchment beneath it.
     Phinneas commissions good paper. This is the whole trick. */
  background:#fbf6ea;
  background-image:
    radial-gradient(ellipse at 22% 12%, rgba(170,145,95,.045), transparent 62%),
    radial-gradient(ellipse at 78% 88%, rgba(150,120,70,.04), transparent 62%);
  border-radius:1px;
  /* deep shadow = a sheet lying ON the page, not part of it */
  box-shadow:
    0 0 0 1px rgba(70,52,28,.30),
    0 2px 4px rgba(0,0,0,.18),
    0 22px 60px rgba(0,0,0,.45),
    inset 0 0 70px rgba(160,130,80,.06);
}
/* the printed double-rule frame */
.user-css .ffc-page::before{
  content:""; position:absolute; inset:16px; pointer-events:none;
  border:1px solid rgba(90,70,40,.45);
  box-shadow:inset 0 0 0 3px transparent, inset 0 0 0 4px rgba(90,70,40,.22);
}
.user-css .ffc-page > *{ position:relative; z-index:1; }

/*  text — ancestor-prefixed to beat the world 18px rules */
.user-css .article-content .ffc-page p,
.user-css .ffc-page p{
  margin:0 0 1.3em 0; color:#241d14;
  font-family:AlegreyaWA,'EB Garamond',Georgia,serif;
  font-size:1.13rem !important; line-height:1.85 !important;
  text-align:justify; hyphens:auto;
}/* links must survive on cream, not the world's red-on-dark */
.user-css .ffc-page a,
.user-css .ffc-page a:visited{
  color:#7a2618 !important; text-decoration-thickness:1px;
  text-underline-offset:2px;
}
.user-css .ffc-page a:hover{ color:#a83a22 !important; }

/* --- THE MASTHEAD --------------------------------------------------------- */
.user-css .ffc-masthead{
  text-align:center; margin:0 0 .2em;
  font-family:GermaniaOneWA,serif !important;
  font-weight:400; font-size:3.6rem !important; line-height:1.05;
  letter-spacing:.08em;
  color:#3a2a16;
}
.user-css .ffc-sub{
  text-align:center; font-family:AlegreyaWA,Georgia,serif; font-style:italic;
  font-size:.98rem !important; line-height:1.5; color:#6b563a;
  max-width:560px; margin:.2em auto 1.1em;
}
/* the issue line: small caps, rules either side */
.user-css .ffc-issue{
  text-align:center; font-family:GermaniaOneWA,serif;
  letter-spacing:.34em; font-size:.95rem !important; color:#6b563a;
  margin:.6em auto 0; position:relative; max-width:340px;
}
.user-css .ffc-issue::before,
.user-css .ffc-issue::after{
  content:""; position:absolute; top:50%; width:28%; height:1px;
  background:rgba(90,70,40,.5);
}
.user-css .ffc-issue::before{ left:0; }
.user-css .ffc-issue::after{ right:0; }

/* heavy rule under the whole masthead block */
.user-css .ffc-page .ffc-rule{
  height:4px;
  margin:1.5em auto 2em;
  border-top:3px solid rgba(90,70,40,.6);
  border-bottom:1px solid rgba(90,70,40,.45);
}/* --- the article title within the issue ----------------------------------- */
.user-css .ffc-page .ffc-title{
  text-align:center; font-family:GermaniaOneWA,serif; font-weight:normal;
  letter-spacing:.1em; font-size:1.9rem !important; color:#3a2a16;
  margin:.4em 0 1.6em; line-height:1.2;
}

/* --- section break: a small printer's ornament ---------------------------- */
.user-css .ffc-page .ffc-div{
  text-align:center; color:#8a6d44; font-size:1.1rem !important;
  letter-spacing:.6em; margin:2.1em auto; max-width:300px;
}

/* --- drop cap ------------------------------------------------------------- */
.user-css .ffc-page .ffc-cap{
  float:left; font-family:GermaniaOneWA,serif; font-size:3.7rem !important;
  line-height:1; margin:0 .1em 0 0; color:#7a2618;
  position:relative; top:-.24em;
}

/* --- the verdict box (his closing rubric) --------------------------------- */
.user-css .ffc-page .ffc-verdict{
  margin:2.4em auto; max-width:640px; padding:1.1em 1.4em;
  border-top:1px solid rgba(90,70,40,.5);
  border-bottom:1px solid rgba(90,70,40,.5);
  text-align:center; font-style:italic;
  font-family:AlegreyaWA,Georgia,serif;
  font-size:1.2rem !important; line-height:1.6; color:#4a3722;
}/* --- the signature + standing sign-off ------------------------------------ */
.user-css .ffc-page .ffc-sign{
  text-align:right; margin:2em 0 .1em;
  font-family:GermaniaOneWA,serif !important;
  font-weight:400; font-size:2.2rem !important; line-height:1;
  letter-spacing:.04em;
  color:#3a2a16;
}
.user-css .ffc-page .ffc-motto{
  text-align:right; font-family:AlegreyaWA,Georgia,serif; font-style:italic;
  font-size:1rem !important; color:#6b563a; margin:.2em 0 0;
}

/* --- the subscriber's mark (foot of the sheet) ---------------------------- */
.user-css .ffc-page .ffc-mark{
  margin:3em auto 0; padding-top:1.2em;
  border-top:1px solid rgba(90,70,40,.35);
  text-align:center; font-family:AlegreyaWA,Georgia,serif; font-style:italic;
  font-size:.92rem !important; letter-spacing:.05em; color:#7d6749;
}
.user-css .article-content .ffc-page .ffc-cap,
.user-css .ffc-page .ffc-cap{
  float:left !important;
  font-family:GermaniaOneWA,serif !important;
  font-size:4rem !important;
  line-height:.82 !important;
  margin:0 .12em 0 0 !important;
  padding:0 !important;
  color:#7a2618 !important;
  position:relative; top:.06em;
}

/* END FAR FROM COURT BLOCK */

/* ============================================================
   THE KINDLY MAN — kind-* article styling
   A grief-haunted eldritch palette: ash-grey, bone, cold candle-amber,
   on the world's parchment. Muted, mournful, wrong.
   Add to your World CSS (alongside st-*, rp-*, tide-*).
   Everything fires only inside [:kind-article].
   ============================================================ */

/* ---- Drop-cap: bone-pale, faintly wrong ---- */
.user-css .kind-article .kind-cap{
  float:left;
  font-family:'Cinzel','Trajan Pro',Georgia,serif;
  font-size:5.4em;
  line-height:.78;
  padding:.02em .12em 0 0;
  margin:.02em .08em 0 0;
  color:#5e5344 !important;
  text-shadow:0 1px 2px rgba(0,0,0,.25);
  font-weight:700;
}

/* ---- Ornamental divider ---- */
.user-css .kind-article .kind-div{
  text-align:center;
  color:#6b5d49 !important;
  font-size:1.2em;
  letter-spacing:.5em;
  margin:1.6em 0 1.3em;
  padding-left:.5em;
  border:0;
}

/* ---- Quick-facts panel ---- */
.user-css .kind-article .kind-facts{
  border:1px solid rgba(70,60,48,.5);
  border-left:4px solid #4a4034;
  background:rgba(70,60,48,.09);
  padding:1em 1.2em;
  margin:1.2em 0 1.6em;
  border-radius:2px;
  font-size:.97em;
  line-height:1.6;
  color:#2c2519 !important;
}
.user-css .kind-article .kind-facts *{ color:#2c2519 !important; }
.user-css .kind-article .kind-facts .kind-facts-title{
  font-family:'Cinzel',Georgia,serif;
  font-size:1.06em;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#4a4034 !important;
  border-bottom:1px solid rgba(70,60,48,.35);
  padding-bottom:.4em;
  margin-bottom:.6em;
}

/* ---- The warning callout (the folk-rule) ---- */
.user-css .kind-article .kind-warn{
  border:1px solid rgba(120,40,30,.4);
  border-left:4px solid #7a2618;
  background:rgba(120,40,30,.07);
  padding:1em 1.2em;
  margin:1.4em 0;
  border-radius:2px;
  color:#3a2016 !important;
  font-style:italic;
  text-align:center;
  font-size:1.12em;
  line-height:1.5;
}
.user-css .kind-article .kind-warn *{ color:#3a2016 !important; }

/* ---- Eyewitness account block (testimony) ---- */
.user-css .kind-article .kind-account{
  border:1px solid rgba(70,60,48,.4);
  background:rgba(60,55,45,.06);
  padding:.9em 1.15em .9em 1.3em;
  margin:1.1em 0;
  border-radius:2px;
  border-left:3px solid #6b5d49;
  font-size:.97em;
  line-height:1.6;
  color:#2c2519 !important;
}
.user-css .kind-article .kind-account *{ color:#2c2519 !important; }
.user-css .kind-article .kind-account .kind-account-src{
  display:block;
  margin-top:.6em;
  font-style:italic;
  font-size:.9em;
  color:#5a4d3a !important;
  text-align:right;
}

/* ---- The unspeakable name — corrupted tranion ---- */
.user-css .kind-article .kind-name{
  text-align:center;
  margin:1.6em auto;
  max-width:560px;
  padding:1.2em 1em;
  border-top:1px solid rgba(70,60,48,.4);
  border-bottom:1px solid rgba(70,60,48,.4);
}
.user-css .kind-article .kind-name .kind-glyph{
  font-family:'Cinzel',Georgia,serif;
  font-size:1.9em;
  letter-spacing:.18em;
  color:#453a2c !important;
  line-height:1.3;
  /* the wrongness: skew + faint blur shadow so the eye can't settle */
  display:inline-block;
  transform:skewX(-4deg);
  text-shadow:1px 0 2px rgba(90,40,30,.35), -1px 0 3px rgba(40,50,60,.3);
  filter:blur(.3px);
}
.user-css .kind-article .kind-name .kind-glyph-note{
  display:block;
  margin-top:.9em;
  font-style:italic;
  font-size:.86em;
  color:#5a4d3a !important;
  letter-spacing:.02em;
  transform:none; text-shadow:none; filter:none;
}

/* ---- Pull-quote (mournful) ---- */
.user-css .kind-article .kind-pull{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-style:italic;
  font-size:1.6em;
  line-height:1.4;
  text-align:center;
  color:#4a4034 !important;
  margin:1.5em 2em;
  padding:.4em 0;
  border-top:1px solid rgba(70,60,48,.35);
  border-bottom:1px solid rgba(70,60,48,.35);
}

/* ---- Framed image plate ---- */
.user-css .kind-article .kind-plate{
  text-align:center; margin:1.6em auto; max-width:620px; padding:.5em;
  border:1px solid rgba(70,60,48,.4);
  box-shadow:inset 0 0 0 4px rgba(60,55,45,.15), 0 4px 22px rgba(0,0,0,.3);
  border-radius:2px; background:rgba(40,36,28,.08);
}
.user-css .kind-article .kind-plate img{ border-radius:1px; }
.user-css .kind-article .kind-plate .kind-cap-txt{
  display:block; margin-top:.6em; font-style:italic;
  font-size:.92em !important; color:#5a4d3a !important; letter-spacing:.02em;
}

/* h2 headings: no crossing underline, so nothing strikes through */
.user-css .kind-article h2{
  border-bottom:none !important;
  padding-bottom:0 !important;
  clear:both !important;
}

/* ============================================================
   THE DISTRICT CAGE — cage-* article styling (moderate)
   Warm, homely palette: brass-gold, blackwood, songbird-yellow accent.
   On the world's parchment. Add to your World CSS.
   ============================================================ */

/* Drop-cap: warm brass */
.user-css .cage-article .cage-cap{
  float:left;
  font-family:'Cinzel','Trajan Pro',Georgia,serif;
  font-size:5.2em; line-height:.78;
  padding:.02em .12em 0 0; margin:.02em .08em 0 0;
  color:#8a6a2a !important;
  text-shadow:0 1px 1px rgba(0,0,0,.2);
  font-weight:700;
}

/* Divider — little perched-bird flourish */
.user-css .cage-article .cage-div{
  text-align:center; color:#8a6a2a !important;
  font-size:1.15em; letter-spacing:.5em;
  margin:1.5em 0 1.2em; padding-left:.5em; border:0;
}

/* Quick-facts panel */
.user-css .cage-article .cage-facts{
  border:1px solid rgba(138,106,42,.5);
  border-left:4px solid #8a6a2a;
  background:rgba(138,106,42,.08);
  padding:1em 1.2em; margin:1.2em 0 1.6em; border-radius:2px;
  font-size:.97em; line-height:1.6; color:#3a2c14 !important;
}
.user-css .cage-article .cage-facts *{ color:#3a2c14 !important; }
.user-css .cage-article .cage-facts .cage-facts-title{
  font-family:'Cinzel',Georgia,serif; font-size:1.05em;
  letter-spacing:.12em; text-transform:uppercase;
  color:#6e5320 !important;
  border-bottom:1px solid rgba(138,106,42,.35);
  padding-bottom:.4em; margin-bottom:.6em;
}

/* District list — each district's cage flavor as a styled row */
.user-css .cage-article .cage-district{
  border-left:3px solid #b08a3a;
  background:rgba(138,106,42,.05);
  padding:.6em .9em; margin:.55em 0; border-radius:2px;
  color:#2c2416 !important;
}
.user-css .cage-article .cage-district *{ color:#2c2416 !important; }
.user-css .cage-article .cage-district .cage-dname{
  font-family:'Cinzel',Georgia,serif;
  color:#6e5320 !important; letter-spacing:.06em;
  text-transform:uppercase; font-size:.95em;
}

/* Pull-quote */
.user-css .cage-article .cage-pull{
  font-family:'Cormorant Garamond',Georgia,serif; font-style:italic;
  font-size:1.55em; line-height:1.4; text-align:center;
  color:#6e5320 !important; margin:1.4em 2em; padding:.4em 0;
  border-top:1px solid rgba(138,106,42,.35);
  border-bottom:1px solid rgba(138,106,42,.35);
}

/* Framed image plate */
.user-css .cage-article .cage-plate{
  text-align:center; margin:1.5em auto; max-width:600px; padding:.5em;
  border:1px solid rgba(138,106,42,.45);
  box-shadow:inset 0 0 0 4px rgba(138,106,42,.12), 0 3px 16px rgba(0,0,0,.25);
  border-radius:2px; background:rgba(138,106,42,.06);
}
.user-css .cage-article .cage-plate .cage-cap-txt{
  display:block; margin-top:.5em; font-style:italic;
  font-size:.92em !important; color:#5a4520 !important;
}

/* h2 — no crossing underline */
.user-css .cage-article h2{
  border-bottom:none !important; padding-bottom:0 !important; clear:both !important;
  color:#6e5320 !important;
}

/* ============================================================
   THE LAMPLIGHTER'S DREAM — lamp-* article styling (moderate)
   Warm lamp-amber against fog-grey, on the world's parchment.
   Add to your World CSS.
   ============================================================ */

/* Drop-cap: warm flame-amber */
.user-css .lamp-article .lamp-cap{
  float:left;
  font-family:'Cinzel','Trajan Pro',Georgia,serif;
  font-size:5.2em; line-height:.78;
  padding:.02em .12em 0 0; margin:.02em .08em 0 0;
  color:#b5731e !important;
  text-shadow:0 0 10px rgba(210,150,60,.35), 0 1px 1px rgba(0,0,0,.25);
  font-weight:700;
}

/* Divider — flame glyphs */
.user-css .lamp-article .lamp-div{
  text-align:center; color:#9a6a2a !important;
  font-size:1.15em; letter-spacing:.5em;
  margin:1.5em 0 1.2em; padding-left:.5em; border:0;
}

/* Quick-facts panel */
.user-css .lamp-article .lamp-facts{
  border:1px solid rgba(150,106,42,.5);
  border-left:4px solid #9a6a2a;
  background:rgba(180,120,50,.09);
  padding:1em 1.2em; margin:1.2em 0 1.6em; border-radius:2px;
  font-size:.97em; line-height:1.6; color:#3a2c14 !important;
}
.user-css .lamp-article .lamp-facts *{ color:#3a2c14 !important; }
.user-css .lamp-article .lamp-facts .lamp-facts-title{
  font-family:'Cinzel',Georgia,serif; font-size:1.05em;
  letter-spacing:.12em; text-transform:uppercase;
  color:#6e4c18 !important;
  border-bottom:1px solid rgba(150,106,42,.35);
  padding-bottom:.4em; margin-bottom:.6em;
}

/* The children's rhyme block */
.user-css .lamp-article .lamp-rhyme{
  text-align:center; margin:1.5em auto; max-width:460px;
  padding:1.1em 1.4em;
  border:1px solid rgba(150,106,42,.4);
  border-radius:2px;
  background:rgba(180,120,50,.07);
  font-family:'Cormorant Garamond',Georgia,serif;
  font-style:italic; font-size:1.25em; line-height:1.7;
  color:#5a3d14 !important;
}
.user-css .lamp-article .lamp-rhyme *{ color:#5a3d14 !important; }

/* The shadow callout (the grim truth) */
.user-css .lamp-article .lamp-shadow{
  border:1px solid rgba(60,66,74,.5);
  border-left:4px solid #3a424a;
  background:rgba(40,46,54,.10);
  padding:1em 1.2em; margin:1.4em 0; border-radius:2px;
  color:#33383e !important; font-style:italic;
}
.user-css .lamp-article .lamp-shadow *{ color:#33383e !important; }

/* Pull-quote */
.user-css .lamp-article .lamp-pull{
  font-family:'Cormorant Garamond',Georgia,serif; font-style:italic;
  font-size:1.55em; line-height:1.4; text-align:center;
  color:#6e4c18 !important; margin:1.4em 2em; padding:.4em 0;
  border-top:1px solid rgba(150,106,42,.35);
  border-bottom:1px solid rgba(150,106,42,.35);
}

/* Framed image plate */
.user-css .lamp-article .lamp-plate{
  text-align:center; margin:1.5em auto; max-width:600px; padding:.5em;
  border:1px solid rgba(150,106,42,.45);
  box-shadow:inset 0 0 0 4px rgba(150,106,42,.12), 0 3px 16px rgba(0,0,0,.28);
  border-radius:2px; background:rgba(150,106,42,.06);
}
.user-css .lamp-article .lamp-plate .lamp-cap-txt{
  display:block; margin-top:.5em; font-style:italic;
  font-size:.92em !important; color:#5a4520 !important;
}

/* h2 — no crossing underline */
.user-css .lamp-article h2{
  border-bottom:none !important; padding-bottom:0 !important; clear:both !important;
  color:#6e4c18 !important;
}

/* ============================================================
   HEKKTHA / THE SPRING OF AB-DOHL — hek-* article styling (moderate)
   Deep still-water palette: drowned blue-green, black idol-stone,
   a rose bloom of the perfumed water. On the world's parchment.
   Add to your World CSS.
   ============================================================ */

/* Drop-cap: deep water-teal */
.user-css .hek-article .hek-cap{
  float:left;
  font-family:'Cinzel','Trajan Pro',Georgia,serif;
  font-size:5.2em; line-height:.78;
  padding:.02em .12em 0 0; margin:.02em .08em 0 0;
  color:#1f5359 !important;
  text-shadow:0 1px 2px rgba(0,0,0,.25);
  font-weight:700;
}

/* Divider */
.user-css .hek-article .hek-div{
  text-align:center; color:#2c6169 !important;
  font-size:1.15em; letter-spacing:.5em;
  margin:1.5em 0 1.2em; padding-left:.5em; border:0;
}

/* Quick-facts panel */
.user-css .hek-article .hek-facts{
  border:1px solid rgba(30,80,88,.5);
  border-left:4px solid #1f5359;
  background:rgba(40,100,110,.10);
  padding:1em 1.2em; margin:1.2em 0 1.6em; border-radius:2px;
  font-size:.97em; line-height:1.6; color:#173338 !important;
}
.user-css .hek-article .hek-facts *{ color:#173338 !important; }
.user-css .hek-article .hek-facts .hek-facts-title{
  font-family:'Cinzel',Georgia,serif; font-size:1.05em;
  letter-spacing:.12em; text-transform:uppercase;
  color:#1f5359 !important;
  border-bottom:1px solid rgba(30,80,88,.35);
  padding-bottom:.4em; margin-bottom:.6em;
}

/* The ritual steps block */
.user-css .hek-article .hek-rite{
  border:1px solid rgba(150,70,90,.4);
  border-left:4px solid #8a3a55;
  background:rgba(170,80,105,.07);
  padding:1em 1.2em; margin:1.3em 0; border-radius:2px;
  color:#3a1c26 !important;
}
.user-css .hek-article .hek-rite *{ color:#3a1c26 !important; }
.user-css .hek-article .hek-rite .hek-rite-title{
  font-family:'Cinzel',Georgia,serif; letter-spacing:.1em;
  text-transform:uppercase; color:#7a2e46 !important;
  font-size:1em; display:block; margin-bottom:.5em;
}

/* The dark-truth callout */
.user-css .hek-article .hek-deep{
  border:1px solid rgba(20,40,46,.55);
  border-left:4px solid #12262c;
  background:rgba(15,32,38,.12);
  padding:1em 1.2em; margin:1.4em 0; border-radius:2px;
  color:#122428 !important; font-style:italic;
}
.user-css .hek-article .hek-deep *{ color:#122428 !important; }

/* Pull-quote */
.user-css .hek-article .hek-pull{
  font-family:'Cormorant Garamond',Georgia,serif; font-style:italic;
  font-size:1.55em; line-height:1.4; text-align:center;
  color:#1f5359 !important; margin:1.4em 2em; padding:.4em 0;
  border-top:1px solid rgba(30,80,88,.35);
  border-bottom:1px solid rgba(30,80,88,.35);
}

/* Framed image plate */
.user-css .hek-article .hek-plate{
  text-align:center; margin:1.5em auto; max-width:600px; padding:.5em;
  border:1px solid rgba(30,80,88,.45);
  box-shadow:inset 0 0 0 4px rgba(30,80,88,.12), 0 3px 16px rgba(0,0,0,.28);
  border-radius:2px; background:rgba(30,80,88,.06);
}
.user-css .hek-article .hek-plate .hek-cap-txt{
  display:block; margin-top:.5em; font-style:italic;
  font-size:.92em !important; color:#2c4a50 !important;
}

/* h2 — no crossing underline */
.user-css .hek-article h2{
  border-bottom:none !important; padding-bottom:0 !important; clear:both !important;
  color:#1f5359 !important;
}

/* ============================================================
   THE FOURTEENTH HOUSE — xiv-* article styling  ·  v9
   Summer Camp 2026 · "A religion that no longer exists"
   Template: Organization

PALETTE (luminance ladder — read by brightness, not hue):
     #1c1815  L≈9   deepest near-black ... the Third Forgetting
     #28353c  L≈20  cold slate .......... containment / the stone
     #47433a  L≈27  mid ash ............. the Second Forgetting
     #6f6353  L≈41  warm stone .......... borders, rules, ornament
     #a2937c  L≈60  pale dust ........... hairlines, faint fills
     #241f1a  L≈12   text inside panels (on light parchment)

The three Forgetting columns DARKEN left to right (41 → 27 → 9)
   while their prose gets shorter and finally fades UP toward the
   parchment. Both effects are pure luminance — no hue needed.

v9 = v8 + !important on every font-size.
   REQUIRED: the world rule `.user-css .article-content div{font-size:18px
   !important}` hits every BBCode  and would otherwise flatten the
   drop caps, pull-quotes and column numerals to 18px.

REPLACE the old xiv block entirely — it is the LAST block in the world
   CSS, so select from its banner comment to the end of the file and paste
   this over it. Do not stack.
   ============================================================ */

/* ---------- Drop-cap ---------- */
.user-css .xiv-article .xiv-cap{
  float:left;
  font-family:GermaniaOneWA,'Cinzel',Georgia,serif;
  font-size:4.6em !important;
  line-height:.82 !important;
  padding:0 !important;
  margin:0 .1em 0 0 !important;
  position:relative;
  top:-.18em;
  color:#28353c !important;
  text-shadow:0 1px 2px rgba(0,0,0,.28);
  font-weight:700;
}

/* ---------- Divider ---------- */
.user-css .xiv-article .xiv-div{
  text-align:center; color:#6f6353 !important;
  font-size:1.3em !important; letter-spacing:.7em;
  margin:1.6em 0 1.3em; padding-left:.7em; border:0;
}

/* ---------- Epigraph / subtitle ---------- */
.user-css .xiv-article .xiv-subtitle{
  border:1px solid rgba(111,99,83,.45);
  border-left:4px solid #28353c;
  border-right:4px solid #28353c;
  background:rgba(162,147,124,.10);
  padding:1.1em 1.5em; margin:1.2em 0 1.8em; border-radius:2px;
  font-family:'Cormorant Garamond',Georgia,serif;
  font-style:italic; font-size:1.18em !important; line-height:1.6;
  text-align:center; color:#241f1a !important;
}
.user-css .xiv-article .xiv-subtitle *{ color:#241f1a !important; }

/* ---------- Quick-facts panel ---------- */
.user-css .xiv-article .xiv-facts{
  border:1px solid rgba(40,53,60,.45);
  border-left:4px solid #28353c;
  background:rgba(40,53,60,.08);
  padding:1em 1.2em; margin:1.2em 0 1.6em; border-radius:2px;
  font-size:.97em !important; line-height:1.65; color:#241f1a !important;
}
.user-css .xiv-article .xiv-facts *{ color:#241f1a !important; }
.user-css .xiv-article .xiv-facts .xiv-facts-title{
  font-family:'Cinzel',Georgia,serif; font-size:1.05em !important;
  letter-spacing:.12em; text-transform:uppercase;
  color:#28353c !important;
  border-bottom:1px solid rgba(40,53,60,.35);
  padding-bottom:.4em; margin-bottom:.6em;
}

/* ============================================================
   NEW IN v2 — the rhythm devices
   ============================================================ */

/* THE BEAT — a single short line standing alone between blocks.
   This is the pop. Use sparingly: 4–6 in the whole article. */
.user-css .xiv-article .xiv-beat{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.3em !important; line-height:1.45;
  text-align:center; font-style:italic;
  color:#1c1815 !important;
  margin:1.3em auto; padding:.2em 1em; max-width:80%;
}
.user-css .xiv-article .xiv-beat *{ color:#1c1815 !important; }

/* THE DOCUMENT — a quoted artifact (the ledger leaf). Dashed edge so
   it reads as a torn-out thing, not as a callout. */
.user-css .xiv-article .xiv-doc{
  border:1px dashed rgba(111,99,83,.75);
  background:rgba(162,147,124,.13);
  padding:1em 1.3em; margin:1.3em 1.5em; border-radius:1px;
  font-size:.94em !important; line-height:1.65;
  color:#332c24 !important;
}
.user-css .xiv-article .xiv-doc *{ color:#332c24 !important; }
.user-css .xiv-article .xiv-doc .xiv-doc-title{
  font-family:'Cinzel',Georgia,serif; font-size:.85em !important;
  letter-spacing:.14em; text-transform:uppercase;
  color:#6f6353 !important;
  margin-bottom:.7em;
}

/* SPOKEN — the Warden exchange. Left rule only, no box: dialogue
   should feel like it's happening in the margin of the record. */
.user-css .xiv-article .xiv-said{
  border-left:3px solid #28353c;
  background:transparent;
  padding:.3em 0 .3em 1.2em; margin:1.2em 0 1.2em 1.2em;
  font-size:1em !important; line-height:1.7;
  color:#241f1a !important;
}
.user-css .xiv-article .xiv-said *{ color:#241f1a !important; }

/* SECOND HAND — a note in someone else's voice inside a block.
   Lighter luminance, indented. Not rotated: the cursive/margin
   device is reserved for Far From Court. */
.user-css .xiv-article .xiv-hand{
  font-style:italic;
  color:#5c5346 !important;
  padding-left:.9em;
  border-left:1px solid rgba(111,99,83,.5);
  margin-top:.3em;
}

/* THE FADE — the last line of Column III lifts toward the parchment.
   Stops at L≈52, still legible, but the eye loses grip on it. */
.user-css .xiv-article .xiv-fade{
  color:#8d8271 !important;
  font-style:italic;
  letter-spacing:.04em;
}

/* ============================================================
   THE THREE-COLUMN DEVICE
   WA stamps d-block (display:block !important) on every BBCode
    — the flex parent MUST re-declare display:flex
   with !important or nothing happens.
   ============================================================ */
.user-css .xiv-article .xiv-cols{
  display:flex !important;
  flex-wrap:wrap;
  gap:1em;
  align-items:stretch;      /* equal heights — Column III's emptiness
                               becomes deliberate air, not a gap */
  margin:1.4em 0 1.6em;
}

/* WA injects a .visibility-toggler-trigger div as the FIRST CHILD of
   every . In a flex row that becomes a phantom 4th column.
   Kill anything that is not one of our three. */
.user-css .xiv-article .xiv-cols > *:not(.xiv-col){
  display:none !important;
}

.user-css .xiv-article .xiv-col{
  flex:1 1 200px;
  min-width:200px;
  padding:.9em 1.05em;
  border:1px solid rgba(111,99,83,.35);
  border-top:3px solid #6f6353;
  background:rgba(162,147,124,.09);
  border-radius:2px;
  font-size:.95em !important; line-height:1.62;
  color:#241f1a !important;
}
.user-css .xiv-article .xiv-col *{ color:#241f1a !important; }

/* the fade and the second hand must survive the wildcard above */
.user-css .xiv-article .xiv-col .xiv-fade{ color:#8d8271 !important; }
.user-css .xiv-article .xiv-col .xiv-hand{ color:#5c5346 !important; }

/* Progressive darkening, left to right — the faith going out */
.user-css .xiv-article .xiv-col:nth-child(2){
  border-top-color:#47433a;
  background:rgba(71,67,58,.11);
}
.user-css .xiv-article .xiv-col:nth-child(3){
  border-top-color:#1c1815;
  background:rgba(28,24,21,.13);
}

/* Roman numeral */
.user-css .xiv-article .xiv-col .xiv-col-num{
  font-family:'Cinzel','Trajan Pro',Georgia,serif;
  font-size:1.9em !important; line-height:1; letter-spacing:.08em;
  color:#6f6353 !important;
  margin-bottom:.15em;
}
.user-css .xiv-article .xiv-col:nth-child(2) .xiv-col-num{ color:#47433a !important; }
.user-css .xiv-article .xiv-col:nth-child(3) .xiv-col-num{ color:#1c1815 !important; }

/* Column heading */
.user-css .xiv-article .xiv-col .xiv-col-title{
  font-family:'Cinzel',Georgia,serif;
  font-size:.92em !important; letter-spacing:.08em; text-transform:uppercase;
  color:#28353c !important;
  border-bottom:1px solid rgba(111,99,83,.35);
  padding-bottom:.45em; margin-bottom:.7em;
}
.user-css .xiv-article .xiv-col:nth-child(3) .xiv-col-title{ color:#1c1815 !important; }

/* ---------- Pull-quote ---------- */
.user-css .xiv-article .xiv-pull{
  font-family:'Cormorant Garamond',Georgia,serif; font-style:italic;
  font-size:1.5em !important; line-height:1.4; text-align:center;
  color:#28353c !important; margin:1.5em 2em; padding:.45em 0;
  border-top:1px solid rgba(111,99,83,.4);
  border-bottom:1px solid rgba(111,99,83,.4);
}
.user-css .xiv-article .xiv-pull *{ color:#28353c !important; }

/* ---------- Framed image plate ---------- */
.user-css .xiv-article .xiv-plate{
  text-align:center; margin:1.5em auto; max-width:600px; padding:.5em;
  border:1px solid rgba(111,99,83,.45);
  box-shadow:inset 0 0 0 4px rgba(40,53,60,.12), 0 3px 16px rgba(0,0,0,.28);
  border-radius:2px; background:rgba(162,147,124,.07);
}
.user-css .xiv-article .xiv-plate .xiv-cap-txt{
  display:block; margin-top:.5em; font-style:italic;
  font-size:.92em !important; color:#3a352c !important;
}

/* ---------- h2/h3 — kill the global crossing underline ---------- */
.user-css .xiv-article h2{
  border-bottom:none !important;
  padding-bottom:0 !important;
  clear:both !important;
  color:#28353c !important;
}
.user-css .xiv-article h3{
  border-bottom:none !important;
  clear:both !important;
  color:#28353c !important;
}
/* ============================================================
   ADDENDUM — the palimpsest block (the scribe's leaf)
   Append to the existing xiv-* CSS. Nothing else changes.

LUMINANCE LOGIC:
      text inside panels ....... #241f1a   L≈12
     the recovered ghost ........... #6b6152   L≈40  (faded, legible)
     the lacunae ................... #8d8271   L≈52  (fainter still)
     the last line (xiv-fade) ...... #8d8271   L≈52  (already defined)

The ghost sits a full 28 points of luminance above  text, so it
   reads as recovered-not-written on sight, without relying on hue.
   ============================================================ */

.user-css .xiv-article .xiv-ghost{
  border:1px solid rgba(111,99,83,.55);
  border-left:4px solid rgba(111,99,83,.75);
  background:rgba(162,147,124,.16);
  padding:1.15em 1.4em; margin:1.4em 1em; border-radius:1px;
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.06em !important; line-height:1.72;
  font-style:italic;
  color:#6b6152 !important;
}
.user-css .xiv-article .xiv-ghost *{ color:#6b6152 !important; }

/* the one word he managed to force out — stays at ghost weight but
   bolds, so it reads as emphasis inside a faded hand */
.user-css .xiv-article .xiv-ghost b{
  color:#3f3930 !important;
  font-style:normal;
  letter-spacing:.06em;
}

.user-css .xiv-article .xiv-ghost .xiv-ghost-title{
  font-family:'Cinzel',Georgia,serif;
  font-size:.8em !important; letter-spacing:.14em; text-transform:uppercase;
  font-style:normal;
  color:#6f6353 !important;
  border-bottom:1px solid rgba(111,99,83,.4);
  padding-bottom:.5em; margin-bottom:.9em;
}

/* lacuna — where the ink is gone. Inline, centred, unemphatic. */
.user-css .xiv-article .xiv-ghost .xiv-lac{
  display:inline !important;
  color:#8d8271 !important;
  font-style:normal;
  font-size:.9em !important;
  letter-spacing:.04em;
}

/* the missing-third-of-the-leaf marker sits on its own line */
.user-css .xiv-article .xiv-ghost > .xiv-lac:first-of-type{
  display:block !important;
  text-align:center;
  margin-bottom:.9em;
}

/* the fade must survive the wildcard colour rule above */
.user-css .xiv-article .xiv-ghost .xiv-fade{
  color:#8d8271 !important;
  font-style:italic;
}
/* ============================================================
   ADDENDUM — THE LEAF REVEAL
   Styles World Anvil's native [spoiler] button so it reads as an
   archival action rather than a "Show spoiler" widget, and gives
   the leaf a slide-open animation when it appears.

Append AFTER the existing xiv-* CSS.

HOW WA'S SPOILER WORKS
   [spoiler]content|Button Label[/spoiler] renders a link with the
   class .spoiler-button followed by the hidden content. Toggling
   does not reload the page. An extra pipe anywhere inside the
   content breaks it — the leaf block has none, so it is safe.

LUMINANCE:
     button face ...... #e2dacb  L≈86   at rest
     button face ...... #d3c9b6  L≈79   on hover (7 points down,
                                        readable as a state change
                                        without relying on hue)
     button text ...... #3a352c  L≈21
   ============================================================ */

/* ---------- the wrapper ---------- */
.user-css .xiv-article .xiv-leafwrap{
  margin:1.6em 0;
  padding:0;
}

/* ---------- the button ---------- */
.user-css .xiv-article .xiv-leafwrap a.spoiler-button{
  display:block !important;
  width:100%;
  text-align:center;
  font-family:'Cinzel',Georgia,serif;
  font-size:.95em !important;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#3a352c !important;
  background:#e2dacb;
  border:1px solid rgba(111,99,83,.6);
  border-left:4px solid #6f6353;
  border-right:4px solid #6f6353;
  border-radius:2px;
  padding:.85em 1.2em;
  margin:0;
  text-decoration:none !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 1px 4px rgba(0,0,0,.14);
  transition:background .25s ease, letter-spacing .25s ease, box-shadow .25s ease;
}

.user-css .xiv-article .xiv-leafwrap a.spoiler-button:hover,
.user-css .xiv-article .xiv-leafwrap a.spoiler-button:focus{
  background:#d3c9b6;
  letter-spacing:.2em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3), 0 2px 9px rgba(0,0,0,.22);
  color:#241f1a !important;
  text-decoration:none !important;
}

/* ---------- the reveal ----------
   WA toggles the hidden content from display:none. A CSS animation
   fires the moment an element is first displayed, so this runs on
   open and not on page load. Targeting .xiv-ghost directly avoids
   depending on WA's internal wrapper class names, which are not
   guaranteed stable.
   ------------------------------------------------------------ */
@keyframes xiv-unfold{
  from{ opacity:0; transform:translateY(-10px) scaleY(.97); transform-origin:top center; }
  to  { opacity:1; transform:translateY(0)     scaleY(1);   transform-origin:top center; }
}

.user-css .xiv-article .xiv-leafwrap .xiv-ghost{
  animation:xiv-unfold .55s ease-out both;
  margin-top:1em;
  margin-left:0;
  margin-right:0;
}

/* ============================================================
   THE AGES OF LANKHMAR — ages-* article styling
   A Warden's public instruction. Ink, ledger-brown, and the
   red of the city's seal. On the world's light parchment.
   Append to World CSS.

PALETTE (luminance ladder — read by brightness, not hue):
     #241f1a  L≈12   text in panels
     #3d2f1c  L≈19  ledger brown — era names
     #6e5320  L≈34  warm brass — rules, ornament
     #7a2618  L≈24  seal red — pull-quotes
     #a2937c  L≈60  pale dust — hairlines

NOTE: every font-size carries !important. The world rule
   `.user-css .article-content div{font-size:18px !important}`
   hits every BBCode  and will otherwise flatten
   drop caps and era headings.
   ============================================================ */

/* ---------- Drop-cap ---------- */
.user-css .ages-article .ages-cap{
  float:left;
  font-family:GermaniaOneWA,'Cinzel',Georgia,serif;
  font-size:4.6em !important;
  line-height:.82 !important;
  padding:0 !important;
  margin:0 .1em 0 0 !important;
  position:relative;
  top:-.18em;
  color:#3d2f1c !important;
  text-shadow:0 1px 2px rgba(0,0,0,.25);
  font-weight:700;
}

/* ---------- Subtitle / statement of purpose ---------- */
.user-css .ages-article .ages-subtitle{
  border-top:1px solid rgba(110,83,32,.5);
  border-bottom:1px solid rgba(110,83,32,.5);
  padding:1em 1.5em; margin:1.2em 0 1.8em;
  font-family:'Cormorant Garamond',Georgia,serif;
  font-style:italic; font-size:1.14em !important; line-height:1.6;
  text-align:center; color:#3a3226 !important;
}
.user-css .ages-article .ages-subtitle *{ color:#3a3226 !important; }

/* ---------- Divider ---------- */
.user-css .ages-article .ages-div{
  text-align:center; color:#6e5320 !important;
  font-size:1.25em !important; letter-spacing:.65em;
  margin:1.7em 0 1.4em; padding-left:.65em; border:0;
}

/* ---------- The era blocks ---------- */
.user-css .ages-article .ages-era{
  border:1px solid rgba(110,83,32,.45);
  border-left:5px solid #6e5320;
  background:rgba(162,147,124,.10);
  padding:1.2em 1.5em 1em; margin:1.5em 0; border-radius:2px;
  color:#241f1a !important;
}
.user-css .ages-article .ages-era *{ color:#241f1a !important; }

.user-css .ages-article .ages-era-name{
  font-family:GermaniaOneWA,'Cinzel',Georgia,serif;
  font-size:1.85em !important; line-height:1.15;
  letter-spacing:.05em;
  color:#3d2f1c !important;
  margin-bottom:.1em;
}

.user-css .ages-article .ages-era-span{
  font-family:'Cinzel',Georgia,serif;
  font-size:.9em !important; letter-spacing:.2em;
  text-transform:uppercase;
  color:#6e5320 !important;
  border-bottom:1px solid rgba(110,83,32,.35);
  padding-bottom:.5em; margin-bottom:.9em;
}

/* Each successive era sits a touch darker — the count deepening */
.user-css .ages-article .ages-era:nth-of-type(2){ background:rgba(150,132,104,.11); }
.user-css .ages-article .ages-era:nth-of-type(3){ background:rgba(130,114,90,.12); }
.user-css .ages-article .ages-era:nth-of-type(4){ background:rgba(110,96,76,.13); }

/* ---------- Pull-quote ---------- */
.user-css .ages-article .ages-pull{
  font-family:'Cormorant Garamond',Georgia,serif; font-style:italic;
  font-size:1.5em !important; line-height:1.4; text-align:center;
  color:#7a2618 !important; margin:1.6em 2em; padding:.45em 0;
  border-top:1px solid rgba(122,38,24,.4);
  border-bottom:1px solid rgba(122,38,24,.4);
}
.user-css .ages-article .ages-pull *{ color:#7a2618 !important; }

/* ---------- Framed image plate ---------- */
.user-css .ages-article .ages-plate{
  text-align:center; margin:1.5em auto; max-width:640px; padding:.5em;
  border:1px solid rgba(110,83,32,.45);
  box-shadow:inset 0 0 0 4px rgba(110,83,32,.12), 0 3px 16px rgba(0,0,0,.25);
  border-radius:2px; background:rgba(162,147,124,.07);
}
.user-css .ages-article .ages-plate .ages-cap-txt{
  display:block; margin-top:.5em; font-style:italic;
  font-size:.92em !important; color:#5a4d3a !important;
}

/* ---------- h2 — kill the global crossing underline ---------- */
.user-css .ages-article h2{
  border-bottom:none !important;
  padding-bottom:0 !important;
  clear:both !important;
  color:#3d2f1c !important;
}

/* ============================================================
   EPHEMERIS TABLES — eph-* article styling
   For The Traveler and The Dark Lady sign tables.
   Append to World CSS. Everything fires only inside
   [:eph-table].

PALETTE (luminance ladder — read by brightness, not hue):
     #fdfbf6  L≈98  panel face — brighter than the parchment,
                    so the table lifts off the page
     #efe9dc  L≈92  header row and alternating stripe
     #6e5320  L≈34  warm brass — rules and ornament
     #3d2f1c  L≈19  ledger brown — sign names
     #241f1a  L≈12   figures

Panel to header is 6 points of luminance — enough to read as
   a distinct band without a hard edge. Header to  text is
   80 points, which is well past any legibility threshold.

NOTE: every font-size carries !important. The world rule
   `.user-css .article-content div{font-size:18px !important}`
   hits every BBCode  and will otherwise flatten the
   header row and the figures to a single size.
   ============================================================ */

.user-css .eph-table{
  max-width:640px;
  margin:1.6em auto;
  padding:0;
  background:#fdfbf6;
  border:1px solid rgba(110,83,32,.45);
  border-radius:2px;
  box-shadow:0 2px 10px rgba(0,0,0,.14);
  overflow:hidden;
}

/* the caption bar above the grid */
.user-css .eph-table .eph-cap{
  font-family:'Cinzel',Georgia,serif;
  font-size:.9em !important;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#6e5320 !important;
  background:#efe9dc;
  padding:.75em 1.1em;
  border-bottom:1px solid rgba(110,83,32,.4);
  text-align:center;
}

.user-css .eph-table table{
  width:100% !important;
  border-collapse:collapse !important;
  border-radius:0 !important;
  box-shadow:none !important;
  margin:0 !important;
  background:transparent;
}

/* header row */
.user-css .eph-table th{
  background:#efe9dc;
  font-family:'Cinzel',Georgia,serif;
  font-size:.82em !important;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#3d2f1c !important;
  text-align:left;
  padding:.7em 1.1em !important;
  border-bottom:2px solid #6e5320 !important;
}

/*  cells */
.user-css .eph-table td{
  font-size:1em !important;
  line-height:1.5 !important;
  color:#241f1a !important;
  padding:.6em 1.1em !important;
  border-bottom:1px solid rgba(110,83,32,.22) !important;
  vertical-align:middle;
}
.user-css .eph-table tr:last-child td{ border-bottom:none !important; }

/* first column — the sign name, set apart */
.user-css .eph-table td:first-child{
  font-family:'Cinzel',Georgia,serif;
  font-size:.98em !important;
  letter-spacing:.04em;
  color:#3d2f1c !important;
  border-right:1px solid rgba(110,83,32,.22) !important;
}

/* the two time columns — align the figures */
.user-css .eph-table td:nth-child(2),
.user-css .eph-table td:nth-child(3){
  font-variant-numeric:tabular-nums;
  letter-spacing:.02em;
}

/* the whole-day column — quieter, it is the rough guide */
.user-css .eph-table td:last-child{
  color:#5a4d3a !important;
  font-style:italic;
  text-align:right;
}

/* alternating stripe, so the eye holds its row across four columns */
.user-css .eph-table tr:nth-child(even) td{
  background:#f7f3ea;
}

/* footnote under the grid */
.user-css .eph-table .eph-note{
  font-size:.86em !important;
  line-height:1.55 !important;
  color:#5a4d3a !important;
  font-style:italic;
  padding:.85em 1.2em;
  background:#f7f3ea;
  border-top:1px solid rgba(110,83,32,.3);
}

@media (max-width:520px){
  .user-css .eph-table td,
  .user-css .eph-table th{ padding:.5em .6em !important; }
  .user-css .eph-table td:last-child,
  .user-css .eph-table th:last-child{ display:none; }
}

/* END EPHEMERIS TABLE BLOCK */

/* ============================================================
   BBCODE — the real World Anvil table syntax.
   Markdown pipe-tables DO NOT render in WA articles; pipes are
   only used inside "Generic, Random Table" statblocks. Article
   tables must use [table]/[tr]/[th]/[td].
   The ready-made tables are in the two eph-BBCODE-*.txt files.
   Shape:

[:eph-table]
[:eph-cap]The Traveler · twenty-eight days[/]
[table]
[tr][th:34]Sign[/th][th:22]Enter[/th][th:22]Exit[/th][th:22]Whole day[/th][/tr]
[tr][td]Ram[/td][td]0d 00h[/td][td]2d 08h[/td][td]0 – 2[/td][/tr]
... twelve rows ...
[/table]
[:eph-note]Day nought is the hour he enters Ram.[/]
[/]

The [th:NN] argument is a width percentage — 34/22/22/22.
   ============================================================ */

/* ============================================================
   NEHWON HOMEPAGE — THE REVEAL BARS
   ONE block covering BOTH the calendar and the folded sections.

⚠ BEFORE PASTING THIS, DELETE BOTH OLD BLOCKS:
       · everything from "NEHWON HOMEPAGE — THE CALENDAR REVEAL"
         to "END NEHWON HOMEPAGE CALENDAR REVEAL"
       · everything from "NEHWON HOMEPAGE — THE FOLDED SECTIONS"
         to "END NEHWON HOMEPAGE FOLDED SECTIONS"
   Then paste this at the very end. Do not stack.

They are combined precisely so that one cannot overwrite the
   other by accident — which is what kept happening.

PALETTE (luminance ladder — read by brightness, not hue):
     #2e2418  L≈16  bar face at rest — deep ink-brown
     #46351f  L≈25  bar face on hover (9 points up)
     #e6b65c  L≈73  label at rest — the world's gold
     #f4e9c6  L≈92  label on hover
     #6e5320  L≈34  brass rules on both edges

Face to label is 57 points at rest, 67 on hover. The bar sits
   roughly 65 points below the parchment, so it reads as a solid
   object on the page rather than a tint of it.

NOTE: every font-size carries !important — the world rule
   `.user-css .article-content div{font-size:18px !important}`
   would otherwise flatten the labels and the calendar's links.
   ============================================================ */

.user-css .neh-cal,
.user-css .neh-sect{
  width:100%;
  max-width:100%;
  margin:.5em auto;
  padding:0;
  text-align:center;
}

/* the calendar gets a little more air above and below, being the
   one that opens something large */
.user-css .neh-cal{
  margin:1.6em auto 2em;
}

/* ---------- THE BAR — identical for both ---------- */
.user-css .neh-cal a.spoiler-button,
.user-css .neh-sect a.spoiler-button{
  display:block !important;
  position:relative;
  width:100%;
  max-width:820px;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center;
  font-family:GermaniaOneWA,'Cinzel',Georgia,serif;
  font-size:1.3rem !important;
  letter-spacing:.2em;
  line-height:1.35;
  text-transform:uppercase;
  color:#e6b65c !important;
  background:linear-gradient(180deg, #35291b 0%, #2e2418 60%, #241c12 100%);
  border:1px solid rgba(110,83,32,.55);
  border-left:5px solid #6e5320;
  border-right:5px solid #6e5320;
  border-radius:2px;
  padding:1.05em 3em;
  text-decoration:none !important;
  box-shadow:
    inset 0 1px 0 rgba(230,182,92,.20),
    0 4px 14px rgba(0,0,0,.40);
  transition:background .22s ease, color .22s ease,
             letter-spacing .22s ease, box-shadow .22s ease;
}

/* the ▾ marker */
.user-css .neh-cal a.spoiler-button::after,
.user-css .neh-sect a.spoiler-button::after{
  content:"\25BE";
  position:absolute;
  right:1.4em;
  top:50%;
  transform:translateY(-50%);
  color:#6e5320;
  font-size:1.1em !important;
  transition:transform .25s ease, color .22s ease;
}

.user-css .neh-cal a.spoiler-button:hover,
.user-css .neh-cal a.spoiler-button:focus,
.user-css .neh-sect a.spoiler-button:hover,
.user-css .neh-sect a.spoiler-button:focus{
  background:linear-gradient(180deg, #4e3b23 0%, #46351f 60%, #372a19 100%);
  color:#f4e9c6 !important;
  letter-spacing:.24em;
  text-decoration:none !important;
  box-shadow:
    inset 0 1px 0 rgba(244,233,198,.24),
    0 6px 20px rgba(0,0,0,.50);
  outline:none;
}

.user-css .neh-cal a.spoiler-button:hover::after,
.user-css .neh-cal a.spoiler-button:focus::after,
.user-css .neh-sect a.spoiler-button:hover::after,
.user-css .neh-sect a.spoiler-button:focus::after{
  color:#e6b65c;
  transform:translateY(-50%) translateY(3px);
}

/* ---------- the revealed prose (sections) ---------- */
.user-css .neh-sect > div,
.user-css .neh-sect .spoiler-content{
  max-width:820px;
  margin:0 auto !important;
  background:rgba(46,36,24,.055);
  border-left:5px solid rgba(110,83,32,.45);
  border-right:1px solid rgba(110,83,32,.18);
  border-bottom:1px solid rgba(110,83,32,.18);
  border-radius:0 0 2px 2px;
  padding:1em 1.4em .6em 1.4em !important;
  text-align:left;
}

.user-css .neh-sect p{
  margin:.7em 0 !important;
}

/* ---------- the revealed calendar ----------
   WA renders it inside its own wrappers, which inherit whatever
   width they are given. Force the chain to full width, then let
   the table fill it. Scoped so it touches nothing else. ------ */
.user-css .neh-cal > div,
.user-css .neh-cal > div > div,
.user-css .neh-cal .spoiler-content,
.user-css .neh-cal [class*="calendar"]{
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

.user-css .neh-cal table{
  width:100% !important;
  max-width:100% !important;
  margin:1.4em 0 0 !important;
  table-layout:auto !important;
}

.user-css .neh-cal td,
.user-css .neh-cal th{
  padding:.5em .4em !important;
  white-space:normal;
}

/* the month-name row across the top of the widget */
/* the month-name row across the top of the widget —
   must NOT catch the button, which is also an <a> */
.user-css .neh-cal a:not(.spoiler-button){
  font-size:1rem !important;
}

/* END NEHWON HOMEPAGE REVEAL BARS */

/* force both bars to the same label size — px rather than rem,
   and a doubled class for specificity, so nothing outranks it */
.user-css .neh-cal a.spoiler-button.spoiler-button,
.user-css .neh-sect a.spoiler-button.spoiler-button{
  font-size:21px !important;
}

.user-css .neh-cal a.spoiler-button,
.user-css .neh-sect a.spoiler-button{
  white-space:normal !important;
  overflow-wrap:break-word;
}

/* ---------- the Lorekeepers' Circle, foot of the homepage ---------- */
.user-css .neh-circle{
  max-width:820px;
  margin:2.6em auto 1.4em;
  padding:1.4em 1.6em 1em;
  border-top:1px solid rgba(110,83,32,.45);
  border-bottom:1px solid rgba(110,83,32,.25);
  text-align:center;
}

.user-css .neh-circle .neh-circle-title{
  font-family:GermaniaOneWA,'Cinzel',Georgia,serif;
  font-size:22px !important;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#6e5320 !important;
  margin-bottom:.8em;
}

.user-css .neh-circle,
.user-css .neh-circle p,
.user-css .neh-circle div{
  font-size:18px !important;
  line-height:1.7 !important;
  color:#5a4d3a !important;
}

/* END LOREKEEPERS CIRCLE */

/* ============================================================
   THE GODS OF LANKHMAR — gol-* article styling
   The hub AND all fourteen god articles inherit this.
   Everything fires only inside [:gol-article] or
   [:gol-gallery].

Append at the very end of World CSS.

PALETTE (luminance ladder — read by brightness, not hue):
     #1c1712  L≈9   deepest ink — the crypt
     #2e2418  L≈16  card face and bar face
     #46351f  L≈25  card face on hover (9 points up)
     #6e5320  L≈34  warm brass — rules and ornament
     #e6b65c  L≈73  the world's gold — names and numerals
     #f4e9c6  L≈92  gold on hover
     #241f1a  L≈12   text inside light panels
     #5a4d3a  L≈37  captions and secondary text

Deliberately the same ink-and-gold family as the homepage
   reveal bars, so the hub reads as continuous with the front
   page rather than as a separate design.

NOTE: every font-size carries !important. The world rule
   `.user-css .article-content div{font-size:18px !important}`
   hits every BBCode  and would otherwise flatten the
   drop caps, card names and pull-quotes to 18px.
   ============================================================ */

/* ---------- expand the column on gol pages (scoped, safe) ---------- */
.user-css .article-content-left:has(.gol-gallery),
.user-css .article-content:has(.gol-gallery) .article-content-left{
  width:100% !important; max-width:100% !important; flex:0 0 100% !important;
}
.user-css .article-content:has(.gol-gallery) .article-content-right{
  display:none !important;
}

/* ---------- Drop-cap ---------- */
.user-css .gol-article .gol-cap{
  float:left;
  font-family:GermaniaOneWA,'Cinzel',Georgia,serif;
  font-size:4.6em !important;
  line-height:.82 !important;
  padding:0 !important;
  margin:0 .1em 0 0 !important;
  position:relative;
  top:-.18em;
  color:#6e5320 !important;
  text-shadow:0 1px 2px rgba(0,0,0,.28);
  font-weight:700;
}

/* ---------- Subtitle ---------- */
.user-css .gol-article .gol-subtitle{
  border-top:1px solid rgba(110,83,32,.5);
  border-bottom:1px solid rgba(110,83,32,.5);
  padding:1.1em 1.5em; margin:1.2em 0 1.8em;
  font-family:'Cormorant Garamond',Georgia,serif;
  font-style:italic; font-size:1.16em !important; line-height:1.6;
  text-align:center; color:#3a3226 !important;
}
.user-css .gol-article .gol-subtitle *{ color:#3a3226 !important; }

/* ---------- Quick-facts panel ---------- */
.user-css .gol-article .gol-facts{
  border:1px solid rgba(110,83,32,.45);
  border-left:4px solid #6e5320;
  background:rgba(162,147,124,.10);
  padding:1em 1.2em; margin:1.2em 0 1.6em; border-radius:2px;
  font-size:.97em !important; line-height:1.65; color:#241f1a !important;
}
.user-css .gol-article .gol-facts *{ color:#241f1a !important; }
.user-css .gol-article .gol-facts .gol-facts-title{
  font-family:'Cinzel',Georgia,serif; font-size:1.05em !important;
  letter-spacing:.12em; text-transform:uppercase;
  color:#6e5320 !important;
  border-bottom:1px solid rgba(110,83,32,.35);
  padding-bottom:.4em; margin-bottom:.6em;
}

/* ---------- Divider ---------- */
.user-css .gol-article .gol-div{
  text-align:center; color:#6e5320 !important;
  font-size:1.25em !important; letter-spacing:.65em;
  margin:1.7em 0 1.4em; padding-left:.65em; border:0;
}

/* ---------- Pull-quote ---------- */
.user-css .gol-article .gol-pull{
  font-family:'Cormorant Garamond',Georgia,serif; font-style:italic;
  font-size:1.5em !important; line-height:1.4; text-align:center;
  color:#6e5320 !important; margin:1.6em 2em; padding:.45em 0;
  border-top:1px solid rgba(110,83,32,.4);
  border-bottom:1px solid rgba(110,83,32,.4);
}
.user-css .gol-article .gol-pull *{ color:#6e5320 !important; }

/* ---------- Framed image plate ---------- */
.user-css .gol-article .gol-plate{
  text-align:center; margin:1.5em auto; max-width:640px; padding:.5em;
  border:1px solid rgba(110,83,32,.45);
  box-shadow:inset 0 0 0 4px rgba(110,83,32,.12), 0 3px 16px rgba(0,0,0,.25);
  border-radius:2px; background:rgba(162,147,124,.07);
}
.user-css .gol-article .gol-plate .gol-cap-txt{
  display:block; margin-top:.5em; font-style:italic;
  font-size:.92em !important; color:#5a4d3a !important;
}

/* ---------- h2 / h3 — kill the global crossing underline ---------- */
.user-css .gol-article h2{
  border-bottom:none !important;
  padding-bottom:0 !important;
  clear:both !important;
  color:#3d2f1c !important;
}
.user-css .gol-article h3{
  border-bottom:none !important;
  clear:both !important;
  color:#6e5320 !important;
}

/* ============================================================
   THE FOURTEEN — CARD GALLERY
   The Feathered King alone above; thirteen below in rows.

WA stamps d-block (display:block !important) on every BBCode
   , so the flex parents MUST re-declare display:flex
   with !important or nothing happens.

WA also injects a .visibility-toggler-trigger div as the FIRST
   CHILD of every . In a flex row that becomes a phantom
   card. Anything that is not a .gol-card is killed.
   ============================================================ */

.user-css .gol-gallery,
.user-css .gol-crown{
  display:flex !important;
  flex-wrap:wrap;
  justify-content:center;
  align-items:stretch;
  gap:.75em;
  margin:1.6em 0 2.2em;
  padding:0;
}

.user-css .gol-crown{
  margin-bottom:1.1em;
}

/* kill WA's phantom first child in both rows */
.user-css .gol-gallery > *:not(.gol-card),
.user-css .gol-crown > *:not(.gol-card){
  display:none !important;
}

/* ---------- the card ---------- */
.user-css .gol-card{
  flex:0 1 calc(14.28% - .75em);
  min-width:140px;
  max-width:200px;
  display:flex !important;
  flex-direction:column;
  padding:0 0 .9em;
  background:linear-gradient(180deg, #35291b 0%, #2e2418 60%, #241c12 100%);
  border:1px solid rgba(110,83,32,.45);
  border-radius:2px;
  text-align:center;
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(230,182,92,.14), 0 3px 12px rgba(0,0,0,.38);
  transition:border-color .25s, box-shadow .25s, transform .3s ease;
}

/* the Feathered King's card sits wider and alone */
.user-css .gol-crown .gol-card{
  flex:0 1 260px;
  max-width:260px;
  border-color:rgba(230,182,92,.5);
  box-shadow:inset 0 1px 0 rgba(230,182,92,.22), 0 5px 20px rgba(0,0,0,.48);
}

.user-css .gol-card:hover{
  border-color:rgba(230,182,92,.6);
  box-shadow:inset 0 1px 0 rgba(230,182,92,.24), 0 7px 24px rgba(0,0,0,.55);
  transform:translateY(-4px);
  background:linear-gradient(180deg, #4e3b23 0%, #46351f 60%, #372a19 100%);
}

/* ---------- the Deithar plate ---------- */
.user-css .gol-card .gol-card-plate{
  aspect-ratio:1/1;
  margin:0 0 .7em;
  position:relative;
  overflow:hidden;
  background:rgba(0,0,0,.28);
  border-bottom:1px solid rgba(110,83,32,.4);
}
/* neutralise WA's injected image wrapper so the plate is the box */
.user-css .gol-card .gol-card-plate *{
  position:static !important; height:auto !important;
  overflow:visible !important; margin:0 !important; padding:0 !important;
}
.user-css .gol-card .gol-card-plate img{
  position:absolute !important;
  top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
  width:100% !important; height:100% !important;
  object-fit:cover; object-position:center 40%;
  border-radius:0 !important;
}

/* hide WA's auto artist credit inside the small plates */
.user-css .gol-card .gol-card-plate .artist-credits,
.user-css .gol-card .gol-card-plate figcaption,
.user-css .gol-card .gol-card-plate small{
  display:none !important;
}

/* ---------- card text ---------- */
.user-css .gol-card .gol-card-name{
  font-family:GermaniaOneWA,'Cinzel',Georgia,serif;
  color:#e6b65c !important;
  font-size:1.02rem !important;
  line-height:1.15;
  letter-spacing:.03em;
  padding:0 .5em;
  margin-bottom:.3em;
}
.user-css .gol-crown .gol-card .gol-card-name{
  font-size:1.28rem !important;
}

.user-css .gol-card .gol-card-arch{
  font-family:'Cinzel',Georgia,serif;
  color:#a08a5e !important;
  font-size:.72rem !important;
  letter-spacing:.14em;
  text-transform:uppercase;
  padding:0 .4em;
  flex:1 0 auto;
}

.user-css .gol-card a{ text-decoration:none !important; }
.user-css .gol-card:hover .gol-card-name{ color:#f4e9c6 !important; }
.user-css .gol-card:hover .gol-card-arch{ color:#c9ad78 !important; }

/* ---------- mobile: three across, then two ---------- */
@media (max-width:900px){
  .user-css .gol-card{ flex:0 1 calc(25% - .75em); }
}
@media (max-width:640px){
  .user-css .gol-card{ flex:0 1 calc(33.33% - .75em); min-width:110px; }
  .user-css .gol-card .gol-card-name{ font-size:.9rem !important; }
  .user-css .gol-card .gol-card-arch{ font-size:.64rem !important; }
}

/* END GODS OF LANKHMAR BLOCK */

/* ============================================================================
   NEHWON — NAVIGATION CSS BUNDLE  ·  v2 (SPECIFICITY-HARDENED)
   Breadcrumb trail + session-report prev/next bar.
 
 
   WHY v2 EXISTS — three rules already in your World CSS were beating v1:
 
     1. .user-css .breadcrumb { font-size:19px !important }
        (from the MINIMUM READABLE TEXT SIZE block)
        v1 set .78em with no !important, so 19px won.
 
     2. .user-css li          { font-size:20px !important }
        .user-css li a        { font-size:20px !important }
        (from FORCE READABLE ARTICLE LINKS)
        Breadcrumb crumbs ARE <li> elements, so every crumb was forced to 20px.
 
     3. .user-css .article-content div { font-size:18px !important }
        (from FORCE DOCUMENT AND ARTICLE BODY TEXT TO 18PX)
        [:sr-nav] renders as a div, so the nav bar was flattened to
        18px. This is the same trap your own xiv-* block warns about in its
        header comment.
 
   THE FIX — every font-size here now carries !important, and the selectors
   are raised above the world rules:
     .user-css .breadcrumb li        (0,2,1)  beats  .user-css li        (0,1,1)
     .user-css .breadcrumb li a      (0,2,2)  beats  .user-css li a      (0,1,2)
     .user-css .sr-nav.sr-nav        (0,3,0)  beats  .user-css .article-content div (0,2,1)
   The doubled-class trick is the same one you already use on
   .neh-cal a.spoiler-button.spoiler-button.
 
   AFTER PASTING: copy the whole World CSS field back out and re-upload it
   over Living-World-CSS-Bible in the project, or the backup drifts.
 
   PALETTE
     parchment #e2dacb · ink #3a352c · brown rule #6f6353
     muted #a8977c · gold #e6b65c · hover ink #8a5a1e
   ============================================================================ */

/* ==========================================================================
   PART 1 — BREADCRUMB TRAIL          (all articles, active immediately)
   ========================================================================== */

.user-css .breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.15em;
  margin:0 0 .5em 0;
  padding:.5em .9em;
  background:rgba(226,218,203,.30);
  border-top:1px solid rgba(111,99,83,.40);
  border-bottom:1px solid rgba(111,99,83,.40);
  border-radius:0;
  list-style:none;
  font-family:'Cinzel',Georgia,serif !important;
  font-size:15px !important;
  letter-spacing:.10em;
  text-transform:uppercase;
  line-height:1.5 !important;
}

/* ---------- items ----------
   These selectors exist specifically to out-rank
   .user-css li and .user-css li a, which force 20px !important. */
.user-css .breadcrumb li,
.user-css .breadcrumb .breadcrumb-item{
  display:inline-flex;
  align-items:center;
  color:#6f6353;
  font-size:15px !important;
  line-height:1.5 !important;
}

.user-css .breadcrumb li a,
.user-css .breadcrumb .breadcrumb-item a{
  font-size:15px !important;
  line-height:1.5 !important;
}

/* ---------- links ----------
   Also overrides the world autolink red (#8b1a0e) and its underline. */
.user-css .breadcrumb a{
  color:#6f6353 !important;
  text-decoration:none !important;
  font-weight:500 !important;
  border-bottom:1px solid transparent;
  padding-bottom:1px;
  transition:color .25s ease, border-color .25s ease;
}

.user-css .breadcrumb a:hover,
.user-css .breadcrumb a:focus{
  color:#8a5a1e !important;
  border-bottom-color:#e6b65c;
  text-decoration:none !important;
}

/* ---------- the current page ---------- */
.user-css .breadcrumb li:last-child,
.user-css .breadcrumb .breadcrumb-item.active,
.user-css .breadcrumb .breadcrumb-item:last-child{
  color:#3a352c;
  font-weight:600;
}

/* ---------- separators ----------
   ⚠ If the trail loses its separators entirely, WA's security filter has
   eaten the quoted content value. DELETE THIS ONE BLOCK — Bootstrap's
   default divider returns and everything else still works. */
.user-css .breadcrumb li + li::before,
.user-css .breadcrumb .breadcrumb-item + .breadcrumb-item::before{
  content:'\203A';
  color:#a8977c;
  padding:0 .55em 0 .45em;
  font-family:Georgia,serif;
  font-size:18px !important;
  letter-spacing:0;
  float:none;
}

/* ---------- icons ----------
   NOTE: your HIDE ARTICLE AND CATEGORY TITLE ICONS block hides
   .article-title-icon and .category-title-icon outright. If you ever want
   icons in the trail, check that block first — it may be suppressing them. */
.user-css .breadcrumb i,
.user-css .breadcrumb .ra,
.user-css .breadcrumb .fa,
.user-css .breadcrumb .far,
.user-css .breadcrumb .fas{
  color:#a8977c;
  margin-right:.4em;
  font-size:16px !important;
  opacity:.9;
}

.user-css .breadcrumb li:last-child i,
.user-css .breadcrumb li:last-child .ra,
.user-css .breadcrumb li:last-child .fa{
  color:#8a5a1e;
  opacity:1;
}

/* ---------- mobile ---------- */
@media (max-width:600px){
  .user-css .breadcrumb,
  .user-css .breadcrumb li,
  .user-css .breadcrumb li a,
  .user-css .breadcrumb .breadcrumb-item,
  .user-css .breadcrumb .breadcrumb-item a{
    font-size:13px !important;
  }
  .user-css .breadcrumb{
    letter-spacing:.06em;
    padding:.45em .7em;
  }
  .user-css .breadcrumb li + li::before,
  .user-css .breadcrumb .breadcrumb-item + .breadcrumb-item::before{
    padding:0 .35em;
  }
}

/* ==========================================================================
   PART 2 — SESSION REPORT NAVIGATION      (inert until .sr-nav blocks exist)

BBCode that activates this, top and bottom of a session report:

[:sr-nav sr-nav-top]
     [section:sr-nav-prev]@[◄ 0048 : The Yellow Dream](article:UUID)[/section]
     [section:sr-nav-index]@[All Sessions](article:UUID)[/section]
     [section:sr-nav-next]@[0050 : The Ivy ►](article:UUID)[/section]
     [/]

Doubled class (.sr-nav.sr-nav) raises specificity above
   .user-css .article-content div { font-size:18px !important }.
   ========================================================================== */

.user-css .sr-nav.sr-nav{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:1em;
  margin:0 0 2.2em 0;
  padding:.7em 1.1em;
  background:rgba(226,218,203,.55);
  border-top:1px solid rgba(111,99,83,.55);
  border-bottom:1px solid rgba(111,99,83,.55);
  font-family:'Cinzel',Georgia,serif !important;
  font-size:17px !important;
  line-height:1.45 !important;
  letter-spacing:.09em;
  text-transform:uppercase;
}

/* WA injects a .visibility-toggler-trigger div as the first child of every
   . In a flex row that becomes a phantom fourth column — the same
   problem your xiv-cols and gol-gallery blocks solve. Kill anything that
   isn't one of our three sections. */
.user-css .sr-nav.sr-nav > *:not([class*=sr-nav-]){
  display:none !important;
}

.user-css .sr-nav.sr-nav a{
  color:#3a352c !important;
  text-decoration:none !important;
  font-size:17px !important;
  font-weight:600 !important;
  border-bottom:1px solid transparent;
  transition:color .25s ease, border-color .25s ease;
}

.user-css .sr-nav.sr-nav a:hover,
.user-css .sr-nav.sr-nav a:focus{
  color:#8a5a1e !important;
  border-bottom-color:#e6b65c;
  text-decoration:none !important;
}

.user-css .sr-nav.sr-nav .sr-nav-prev { flex:1 1 0; text-align:left;  font-size:17px !important; }
.user-css .sr-nav.sr-nav .sr-nav-index{ flex:0 0 auto; opacity:.72;   font-size:17px !important; }
.user-css .sr-nav.sr-nav .sr-nav-next { flex:1 1 0; text-align:right; font-size:17px !important; }

/* stack on phones */
@media (max-width:600px){
  .user-css .sr-nav.sr-nav{
    flex-direction:column;
    gap:.45em;
    font-size:15px !important;
  }
  .user-css .sr-nav.sr-nav a,
  .user-css .sr-nav.sr-nav .sr-nav-prev,
  .user-css .sr-nav.sr-nav .sr-nav-index,
  .user-css .sr-nav.sr-nav .sr-nav-next{
    font-size:15px !important;
    text-align:center;
  }
}

/* ==========================================================================
   PART 3 — THE JOIN
   ========================================================================== */

.user-css .breadcrumb + .sr-nav,
.user-css .breadcrumb + * .sr-nav-top{
  border-top:0;
  margin-top:0;
}

/* ==========================================================================
   OPTIONAL — BREADCRUMB ABOVE THE TITLE, SESSION REPORTS ONLY
   Requires the arc- tags to be applied first. Uncomment when they are.
   ========================================================================== */

/*
.user-css.page[class*=tag-arc-] .article-title{
  display:flex;
  flex-direction:column;
}
.user-css.page[class*=tag-arc-] .article-title .breadcrumb{ order:1; margin-bottom:.9em; }
.user-css.page[class*=tag-arc-] .article-title .m-b-0     { order:2; }
.user-css.page[class*=tag-arc-] .article-title-author     { order:3; }
*/

/* END NEHWON NAVIGATION BUNDLE v2 */

/* ============================================================
   BREADCRUMB — SIZE & SINGLE-LINE OVERRIDE
   Shrinks the trail and forces it onto one line. If it ever
   outruns the  it scrolls sideways instead of wrapping.
   To tune: change the three 11px values together.
   ============================================================ */

.user-css .breadcrumb{
  flex-wrap:nowrap !important;
  white-space:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  gap:0;
  padding:.4em .8em;
  letter-spacing:.05em;
  font-size:11px !important;
  line-height:1.4 !important;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

/* hide the scrollbar but keep the scrolling */
.user-css .breadcrumb::-webkit-scrollbar{ display:none; }

.user-css .breadcrumb li,
.user-css .breadcrumb li a,
.user-css .breadcrumb .breadcrumb-item,
.user-css .breadcrumb .breadcrumb-item a{
  font-size:11px !important;
  line-height:1.4 !important;
  white-space:nowrap;
  flex:0 0 auto;
}

.user-css .breadcrumb li + li::before,
.user-css .breadcrumb .breadcrumb-item + .breadcrumb-item::before{
  padding:0 .35em;
  font-size:12px !important;
}

.user-css .breadcrumb i,
.user-css .breadcrumb .ra,
.user-css .breadcrumb .fa,
.user-css .breadcrumb .far,
.user-css .breadcrumb .fas{
  font-size:11px !important;
  margin-right:.3em;
}

@media (max-width:600px){
  .user-css .breadcrumb,
  .user-css .breadcrumb li,
  .user-css .breadcrumb li a,
  .user-css .breadcrumb .breadcrumb-item,
  .user-css .breadcrumb .breadcrumb-item a{
    font-size:10px !important;
  }
}

/* ---- fade the right edge so overflow reads as intentional ---- */
.user-css .breadcrumb{
  -webkit-mask-image:linear-gradient(to right, #000 92%, transparent 100%);
          mask-image:linear-gradient(to right, #000 92%, transparent 100%);
}

/* ---- make the scroll discoverable ----
   A thin, in-palette scrollbar. Only drawn when the trail
   actually overflows, so shallow trails stay clean. */
.user-css .breadcrumb{
  scrollbar-width:thin !important;
  scrollbar-color:#a8977c rgba(111,99,83,.15);
  padding-bottom:.6em;
}

.user-css .breadcrumb::-webkit-scrollbar{
  display:block !important;
  height:4px;
}
.user-css .breadcrumb::-webkit-scrollbar-track{
  background:rgba(111,99,83,.15);
  border-radius:2px;
}
.user-css .breadcrumb::-webkit-scrollbar-thumb{
  background:#a8977c;
  border-radius:2px;
}
.user-css .breadcrumb:hover::-webkit-scrollbar-thumb{
  background:#8a5a1e;
}

/* ============================================================================
   NEHWON — CATHLYNN ARTICLE  ·  cath-*  ·  v2  ·  2026-08-23
   A character-article family. Green and parchment, not the world's brown.

⚠ REPLACES v1 ENTIRELY. Do NOT paste this below an existing cath-* block.
     Search the World CSS for "CATHLYNN ARTICLE", delete every block you find
     — banner line down to its "END cath-*" line — then paste this once at
     the very end. There must be exactly one cath-* block in the file.

v2 changes: drop cap enlarged and lifted; mature block now signals by
   luminance rather than hue; palette documented as a luminance ladder.

PALETTE (luminance ladder — read by brightness, not hue)
     #3a3a35  L≈24  the mature block's rules — the darkest thing on the page
     #2f4230  L≈25  deep green — headings, drop cap
     #4a6b45  L≈40  living green — rules, accents
     #41503d  L≈31  aside text
     #3a352c  L≈21  ink —  (inherited)
     #a8977c  L≈63  muted grey-brown (inherited)
     #e2dacb  L≈87  parchment — the ground (inherited)
     #e6b65c  L≈76  the world's gold — hover only

⚠ THE MATURE BLOCK MUST NOT RELY ON HUE. Its job is to announce itself
   before it is read. It does that with 4px near-black rules against L≈87
   parchment — a 63-point luminance gap, which reads for every reader
   regardless of colour vision. Do not "soften" those borders to a tint;
   the weight IS the signal. Same principle as the three darkening columns
   in your xiv-* block.

SPECIFICITY NOTES — three world rules fight anything placed in an article:
     .user-css .article-content div { font-size:18px !important }
     .user-css li                   { font-size:20px !important }
     .user-css li a                 { font-size:20px !important }
   Containers render as <div>, so every font-size below carries !important and
   the doubled-class trick (.cath-x.cath-x) is used where the world rule would
   otherwise win. Same pattern as your .neh-cal a.spoiler-button.spoiler-button.

⚠ SINGLE QUOTES ONLY. WA's CSS filter eats double quotes.
   ============================================================================ */

/* ---------- wrapper ---------- */
.user-css .cath-article.cath-article{
  font-size:18px !important;
  line-height:1.72 !important;
}

/* WA injects .visibility-toggler-trigger as the first child of every
   . Harmless here (we are not flexing), but kill it for tidiness. */
.user-css .cath-article > .visibility-toggler-trigger{ display:none !important; }

/* ---------- standfirst — the line under the title ---------- */
.user-css .cath-lede.cath-lede{
  font-family:'Cormorant Garamond',Georgia,serif !important;
  font-size:21px !important;
  line-height:1.55 !important;
  font-style:italic;
  color:#2f4230 !important;
  text-align:center;
  max-width:34em;
  margin:0 auto 2.2em auto;
  padding:0 0 1.3em 0;
  border-bottom:1px solid rgba(74,107,69,.35);
}

/* ---------- drop cap ----------
   TWO TUNING KNOBS, and only these two:
     · SIZE     -> font-size   (6.6em spans about three lines of  text)
     · VERTICAL -> top         (more negative = higher; less = lower)

Follows the same formula as your ages-cap and xiv-cap, which sit correctly:
   padding and margin-top ZEROED, and a negative `top` doing the lifting.
   The v1 version had .02em padding-top and .04em margin-top pushing it down
   with nothing pulling it back up, which is why it sat low. */
.user-css .cath-article .cath-cap{
  float:left;
  font-family:'Cinzel','Trajan Pro',Georgia,serif !important;
  font-size:6.6em !important;
  line-height:.78 !important;
  padding:0 !important;
  margin:0 .1em 0 0 !important;
  position:relative;
  top:-.16em;
  color:#2f4230 !important;
  font-weight:700;
  text-shadow:0 1px 2px rgba(0,0,0,.22);
}

/* ---------- section headings ---------- */
.user-css .cath-article h2{
  font-family:'Cinzel',Georgia,serif !important;
  color:#2f4230 !important;
  letter-spacing:.06em;
  border-bottom:none !important;
  padding-bottom:0 !important;
  margin:2.4em 0 .2em 0;
  clear:both !important;
}

/* the small green rule under an h2 */
.user-css .cath-article h2::after{
  content:'';
  display:block;
  width:3.2em;
  height:1px;
  margin-top:.55em;
  background:#4a6b45;
}

.user-css .cath-article h3{
  font-family:'Cinzel',Georgia,serif !important;
  font-size:1.02em !important;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:#4a6b45 !important;
  margin:1.9em 0 .5em 0;
  clear:both !important;
}

/* ---------- divider ---------- */
.user-css .cath-article .cath-div{
  text-align:center;
  color:#4a6b45 !important;
  font-size:1.1em !important;
  letter-spacing:.55em;
  margin:2.1em 0 1.8em;
  padding-left:.55em;
  border:0;
}

/* ---------- pull quote ---------- */
.user-css .cath-pull.cath-pull{
  font-family:'Cormorant Garamond',Georgia,serif !important;
  font-size:24px !important;
  line-height:1.42 !important;
  font-style:italic;
  text-align:center;
  color:#2f4230 !important;
  margin:1.9em auto;
  max-width:30em;
  padding:.7em 0;
  border-top:1px solid rgba(74,107,69,.32);
  border-bottom:1px solid rgba(74,107,69,.32);
}

/* ---------- quick-facts panel ---------- */
.user-css .cath-facts.cath-facts{
  font-size:16px !important;
  line-height:1.62 !important;
  border:1px solid rgba(74,107,69,.42);
  border-left:4px solid #4a6b45;
  background:rgba(74,107,69,.075);
  padding:1em 1.25em;
  margin:1.5em 0 2em;
  border-radius:2px;
  color:#2d2a23 !important;
}
.user-css .cath-facts.cath-facts *{ color:#2d2a23 !important; }

.user-css .cath-facts .cath-facts-title{
  font-family:'Cinzel',Georgia,serif !important;
  font-size:15px !important;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#2f4230 !important;
  border-bottom:1px solid rgba(74,107,69,.32);
  padding-bottom:.42em;
  margin-bottom:.62em;
}

/* ---------- present-day block ----------
   Campaign facts that will go stale. Visually distinct from the permanent
   biography, so a reader can see at a glance which half of the article is
   history and which half is this month. Dashed border = provisional. */

.user-css .cath-current.cath-current{
  font-size:17px !important;
  line-height:1.66 !important;
  background:rgba(226,218,203,.42);
  border:1px dashed rgba(74,107,69,.55);
  border-radius:2px;
  padding:1.1em 1.35em;
  margin:1.4em 0 2em;
}

.user-css .cath-current .cath-facts-title{ margin-bottom:.75em; }

/* ---------- the mature-content block ----------
   Deliberately colourless. The rest of the article is green and alive;
   this one section is ash, and that does the work no warning label can. */

.user-css .cath-mature.cath-mature{
  font-size:18px !important;
  line-height:1.7 !important;
  background:rgba(58,58,53,.13);
  border-top:4px solid #3a3a35;
  border-bottom:4px solid #3a3a35;
  padding:1.7em 1.5em;
  margin:2.2em 0;
}

.user-css .cath-mature.cath-mature h2,
.user-css .cath-mature.cath-mature h3{ color:#6b6b63 !important; }
.user-css .cath-mature.cath-mature h2::after{ background:#6b6b63; }

/* the content-advisory line above the spoiler button */
.user-css .cath-warn.cath-warn{
  font-family:'Cinzel',Georgia,serif !important;
  font-size:14px !important;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:#6b6b63 !important;
  text-align:center;
  margin:1.6em 0 .7em 0;
}

/* ---------- the spoiler button ----------
   Doubled class beats the world default, same trick you already use on
   .neh-cal a.spoiler-button.spoiler-button */
.user-css .cath-article a.spoiler-button.spoiler-button{
  display:inline-block;
  font-family:'Cinzel',Georgia,serif !important;
  font-size:15px !important;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#6b6b63 !important;
  background:transparent !important;
  border:1px solid rgba(107,107,99,.55) !important;
  border-radius:2px;
  padding:.5em 1.4em !important;
  text-decoration:none !important;
  transition:color .25s ease, border-color .25s ease, background .25s ease;
}

/* the ▾ marker — the affordance lives here, so the label can be prose */
.user-css .cath-article a.spoiler-button.spoiler-button::after{
  content:'\25BE';
  margin-left:.75em;
  color:#a8977c;
  font-size:.9em !important;
  transition:transform .25s ease;
  display:inline-block;
}

.user-css .cath-article a.spoiler-button.spoiler-button:hover::after,
.user-css .cath-article a.spoiler-button.spoiler-button:focus::after{
  transform:translateY(2px);
  color:#3a3a35;
}

.user-css .cath-article a.spoiler-button.spoiler-button:hover,
.user-css .cath-article a.spoiler-button.spoiler-button:focus{
  color:#3a352c !important;
  border-color:#a8977c !important;
  background:rgba(168,151,124,.14) !important;
  text-decoration:none !important;
}

/* ---------- an aside — for Cuuthalion's voice ---------- */
.user-css .cath-aside.cath-aside{
  font-size:17px !important;
  line-height:1.66 !important;
  font-style:italic;
  color:#41503d !important;
  border-left:3px solid rgba(74,107,69,.45);
  padding:.25em 0 .25em 1.2em;
  margin:1.5em 0 1.5em 1.4em;
}

/* ---------- mobile ---------- */
@media (max-width:600px){
  .user-css .cath-lede.cath-lede{ font-size:18px !important; }
  .user-css .cath-pull.cath-pull{ font-size:20px !important; }
  .user-css .cath-article .cath-cap{ font-size:5.2em !important; top:-.13em; }
  .user-css .cath-facts.cath-facts,
  .user-css .cath-mature.cath-mature{ padding:1em; }
}

/* ---------- note ---------- */
/* 'Cinzel' and 'Cormorant Garamond' have no @font-face rule in your World
   CSS, so both currently fall back to Georgia — the same as every other
   family in the file. This block is consistent with the rest; it does not
   fix the underlying issue, which is still item 2 on your CSS bible's
   OUTSTANDING list. */

/* END cath-* v2 · 2026-08-23 */

/* === MISSING DISPLAY FONTS === */
/* Cinzel and Cormorant Garamond are called by rp-, tide-, kind-, cage-, */
/* lamp-, hek-, xiv-, ages-, eph-, gol-, cath-, breadcrumb and sr-nav.   */
/* Without these they all silently fell back to Georgia.                 */

@font-face {
  font-family: Cinzel;
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/cinzel/v26/8vIJ7ww63mVu7gt79mT7.woff2);
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/cormorantgaramond/v21/co3umX5slCNuHLi8bLeY9MK7whWMhyjypVO7abI26QOD_v86KnTOig.woff2);
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/cormorantgaramond/v21/co3smX5slCNuHLi8bLeY9MK7whWMhyjYrGFEsdtdc62E6zd58jD-iNM8.woff2);
}

/* === HOMEPAGE CALENDAR BREAKOUT === */
/* World intro sits in col-md-8 col-md-offset-2 (633px), so the bar */
/* cannot reach its own 820px max-width. Let it break out evenly.   */
.user-css.page-world-homepage .col-md-8.col-md-offset-2 .neh-cal{
  width:min(820px, 92vw) !important;
  max-width:none !important;
  margin-left:calc((min(820px, 92vw) - 100%) / -2) !important;
  margin-right:calc((min(820px, 92vw) - 100%) / -2) !important;
}

/* === CENTER IMAGES IN A NEH-SECT REVEAL (text stays left) === */
.user-css .neh-sect img{
  display:block;
  margin-left:auto !important;
  margin-right:auto !important;
  max-width:100%;
  height:auto;
}

/* === TIDE DIVIDER — bigger crescents, full moon held === */
.user-css .tide-article .tide-div{
  font-size:1.7em !important;
  letter-spacing:.35em;
}

/* === ENTER THE GATES — gateway article closing link === */
.user-css .neh-enter{
  max-width:420px;
  margin:1.6em auto 3em;
  text-align:center;
}
.user-css .neh-enter a{
  display:block;
  font-family:GermaniaOneWA,'Cinzel',Georgia,serif;
  font-size:22px !important;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#e6b65c !important;
  background:linear-gradient(180deg, #35291b 0%, #2e2418 60%, #241c12 100%);
  border:1px solid rgba(110,83,32,.55);
  border-left:5px solid #6e5320;
  border-right:5px solid #6e5320;
  border-radius:2px;
  padding:.9em 2em;
  text-decoration:none !important;
  box-shadow:inset 0 1px 0 rgba(230,182,92,.20), 0 4px 14px rgba(0,0,0,.40);
  transition:background .22s ease, color .22s ease, letter-spacing .22s ease;
}
.user-css .neh-enter a:hover{
  background:linear-gradient(180deg, #4e3b23 0%, #46351f 60%, #372a19 100%);
  color:#f4e9c6 !important;
  letter-spacing:.26em;
}

/* === THE GATE — full-bleed closing plate === */
.user-css .neh-gate{
  position:relative;
  width:min(1140px, 96vw) !important;
  max-width:none !important;
  margin-left:calc((min(1140px, 96vw) - 100%) / -2) !important;
  margin-right:calc((min(1140px, 96vw) - 100%) / -2) !important;
  margin-top:2.6em;
  overflow:hidden;
  border-top:1px solid rgba(110,83,32,.55);
  border-bottom:1px solid rgba(110,83,32,.55);
}
.user-css .neh-gate img{
  display:block;
  width:100% !important;
  height:auto;
  border-radius:0 !important;
  filter:brightness(.9);
  transition:filter 1.2s ease;
}
.user-css .neh-gate:hover img{ filter:brightness(1.05); }

/* ============================================================
   NIN-* — NINGAUBLE PLATE, WORLD CODEX CENTRE COLUMN
   ------------------------------------------------------------
   Base plate carries all seven eyes at 40% so he is never dark.
   Three overlay plates brighten different subsets on 7s / 11s /
   13s cycles. Coprime periods — the pattern does not repeat for
   1001 seconds.
     A  eyes 1, 4, 6
     B  eyes 2, 5
     C  eyes 3, 7
   All four plates are 1792x2688; they stack via background-size
   contain so the eyes track the figure at any width.

WA QUIRK: the BBCode parser DROPS empty s — only the
   first of three survived. Each .nin-eyes  therefore
   holds a single period, hidden by font-size:0 / transparent /
   line-height:0 below. Do not remove the periods from the
   BBCode or two of the three plates disappear.

EDGE MASK: the source PNG's feather never reached zero — the
   fog is still ~28% opaque at the left and right canvas edges at
   arm height, and fully opaque along the bottom. The mask-image
   pair below fades those edges in CSS rather than re-exporting.
   It sits on .nin-plate so it clips the overlays too.

ADDED: 8 September 2026
   ============================================================ */

.user-css .nin-plate{
  position:relative !important;
  display:block !important;
  width:100%;
  max-width:520px;
  margin:0 auto;
  aspect-ratio:2 / 3;
  background-image:url(https://wa-cdn.nyc3.digitaloceanspaces.com/user-data/production/e44b2833-b031-44f8-8d69-69884ac75ec6/uploads/images/0a79447a52bb5875f5a49f2d23c9b423.png);
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;

-webkit-mask-image:
    linear-gradient(to right,  transparent 0, #000 13%, #000 87%, transparent 100%),
    linear-gradient(to bottom, #000 0, #000 93%, transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:
    linear-gradient(to right,  transparent 0, #000 13%, #000 87%, transparent 100%),
    linear-gradient(to bottom, #000 0, #000 93%, transparent 100%);
  mask-composite:intersect;
}

.user-css .nin-plate .nin-eyes{
  position:absolute !important;
  inset:0;
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
  pointer-events:none;
  font-size:0 !important;
  color:transparent !important;
  line-height:0 !important;
}

.user-css .nin-plate .nin-a{
  background-image:url(https://wa-cdn.nyc3.digitaloceanspaces.com/user-data/production/e44b2833-b031-44f8-8d69-69884ac75ec6/uploads/images/39dab82470363a2080b413923ecd2d46.png);
  animation:nin-flicker-a 7s ease-in-out infinite;
}
.user-css .nin-plate .nin-b{
  background-image:url(https://wa-cdn.nyc3.digitaloceanspaces.com/user-data/production/e44b2833-b031-44f8-8d69-69884ac75ec6/uploads/images/3dfad9722cfdbaf13da1cb2d41ed1ba6.png);
  animation:nin-flicker-b 11s ease-in-out infinite;
}
.user-css .nin-plate .nin-c{
  background-image:url(https://wa-cdn.nyc3.digitaloceanspaces.com/user-data/production/e44b2833-b031-44f8-8d69-69884ac75ec6/uploads/images/24472c1b77d6d186b00e5cd872d8f26a.png);
  animation:nin-flicker-c 13s ease-in-out infinite;
}

@keyframes nin-flicker-a{
  0%,100%{opacity:.15}  18%{opacity:.85}  34%{opacity:.30}
  56%{opacity:1}        72%{opacity:.40}
}
@keyframes nin-flicker-b{
  0%,100%{opacity:.55}  22%{opacity:.10}  47%{opacity:.90}
  63%{opacity:.25}      88%{opacity:.70}
}
@keyframes nin-flicker-c{
  0%,100%{opacity:.35}  12%{opacity:.95}  40%{opacity:.20}
  68%{opacity:.60}      85%{opacity:.10}
}

@media (prefers-reduced-motion: reduce){
  .user-css .nin-plate .nin-eyes{ animation:none; opacity:.6; }
}

/* =========================================================================
   NEHWON — SIDEBAR TEXT WRAP  (session reports)
   Body text runs beside the sidebar, then closes to full width beneath it.

HOW IT WORKS
   The sidebar column comes AFTER the  in World Anvil's DOM, so it cannot
   be floated — a float only wraps text that follows it. Instead the sidebar
   is lifted out of flow (position:absolute) and a hidden floated block of the
   same size reserves the space. Text wraps the block; the sidebar sits on it.

⚠ REQUIRES a spacer in the article , immediately AFTER the top nav
     (NOT at the very top — that squeezes the nav bar):
        [:sr-nav sr-nav-top] ... [/]
        [:wrapspacer].[/]
     The period is load-bearing — WA's parser drops empty s.

⚠ WHY NOT ::before — `content` does NOT generate on pseudo-elements
     attached to World Anvil's OWN classes (.article-content-left etc).
     It works on custom classes; 27 such rules in this file do. Verified
     10 Sep 2026 from BOTH the Article CSS field and World CSS.

⚠ SESSION REPORT SIDEBARS ARE METADATA-ONLY as of 10 Sep 2026. Thirty
     images across 23 early reports were moved out of sidebarcontent and
     into the article bodies: a 366px-wide column made battle maps
     unreadable and, on a 400-word report, produced a sidebar longer than
     the article. If you put an image back in a sidebar, regenerate below.

⚠ HEIGHTS ARE PER-ARTICLE and computed, not guessed: a metadata panel
     sized by populated fields and related persons, plus the --wrap-navtop
     offset, because the sidebar starts that far down but the spacer does
     not. Range 330–735px, median 567. Fallback 900px.
   ========================================================================= */

.user-css .article-content:has(.wrapspacer){ --wrap-navtop:220px; }

.user-css .article-content:has(.wrapspacer) .article-content-left{
  width:100% !important; max-width:100% !important; flex:0 0 100% !important;
}
.user-css .article-content:has(.wrapspacer) .row:has(> .article-content-right){
  position:relative;
}
.user-css .article-content:has(.wrapspacer) .article-content-right{
  position:absolute !important; top:var(--wrap-navtop); right:0;
  width:41.66667%; padding-left:15px;
}
.user-css .wrapspacer{
  float:right; width:41.66667%; height:900px;
  font-size:0; color:transparent; line-height:0;
}
/* nav bars span the full article width, above and below, clear of the float */
.user-css .article-content:has(.wrapspacer) .sr-nav{ clear:both; width:100%; }

/* safety net if an image is ever returned to a session-report sidebar */
.user-css .article-content:has(.wrapspacer) .article-content-right img{
  max-height:420px; width:auto; max-width:100%;
}
.user-css .article-content:has(.wrapspacer) .article-content-left img{
  max-width:100%; height:auto;
}

/* --- per-article spacer heights (generated 10 Sep 2026) --- */
.article-ffe2924a-4f72-4e10-a6cc-6a139fb359b1 .wrapspacer{ height:489px !important; }  /* Session 0000 - The Dark Oak Trading Compan */
.article-d50567c1-0a18-4627-81e9-8eb4f93eb3a7 .wrapspacer{ height:914px !important; }  /* Session 0001 -  A New Quest (+sidebar image) */
.article-7da83753-067a-4d88-94ad-81c2e0be36c1 .wrapspacer{ height:539px !important; }  /* Session 0002 - The Broken Tower */
.article-ea91501d-8a78-4510-80a9-ce1472491ac7 .wrapspacer{ height:539px !important; }  /* Session 0003 - The Canary */
.article-83be8b2f-1b99-46c8-9601-c09514ef0f57 .wrapspacer{ height:2437px !important; }  /* Session 0004 - The Order of Ix (+sidebar image) */
.article-241eddee-1859-4a92-8de8-1a70fa74ee64 .wrapspacer{ height:489px !important; }  /* Session 0005 - The Blue Fey */
.article-b1ecdb06-94bd-4c99-9125-5c54681bf028 .wrapspacer{ height:567px !important; }  /* Session 0006 -  Black Lightning */
.article-d4b5d781-63b3-4831-b781-85f748d2515b .wrapspacer{ height:567px !important; }  /* Session 0007 - Return to Karja Tal */
.article-25a70ea2-9df5-401a-9764-c74a22951aef .wrapspacer{ height:623px !important; }  /* Session 0008 - The Prison */
.article-8d4e35ac-ced3-490b-a10c-5d78df0c648b .wrapspacer{ height:651px !important; }  /* Session 0009 - Rats, Everywhere */
.article-a2e4fe74-b10d-46f8-91ae-44ad5e03f521 .wrapspacer{ height:679px !important; }  /* Session 0010 - Cathlynn's Death */
.article-0d3ed481-5ac6-4062-b26f-bd29c44fe4c2 .wrapspacer{ height:1034px !important; }  /* Session 0011 - Verbena's Death (+sidebar image) */
.article-62c8a974-724c-4653-8835-b5a59f22003a .wrapspacer{ height:1294px !important; }  /* Session 0012 - The Temple (+sidebar image) */
.article-cc60bf64-3a1a-42f6-b72d-9107952f5ae8 .wrapspacer{ height:601px !important; }  /* Session 0013 - Waves of Ghouls */
.article-d9b7dd57-ea43-44c3-b708-62040b0de707 .wrapspacer{ height:1341px !important; }  /* Session 0014 - The Rescue (+sidebar image) */
.article-1818f97a-331f-4344-a153-9a68a7342c5a .wrapspacer{ height:679px !important; }  /* Session 0015 - Back to Black */
.article-519fd6dc-a6a1-4c36-84e1-f0c64269e8eb .wrapspacer{ height:629px !important; }  /* Session 0016 - Return to the Temple */
.article-1fcfc543-eb00-47b5-889f-592891251b18 .wrapspacer{ height:629px !important; }  /* Session 0017 - The Death of Sken */
.article-cf6d07d0-bbc4-49b6-87d4-ddc699f8fdc9 .wrapspacer{ height:629px !important; }  /* Session 0018 - The Owlbear */
.article-cf9323e0-f9a6-4da2-aad6-0139e0203f0e .wrapspacer{ height:657px !important; }  /* Session 0019 : The Umber Hulk */
.article-fe5dd65c-5258-4b28-b813-389565ebfb4f .wrapspacer{ height:657px !important; }  /* Session 0020 : The Umber Hulk Falls */
.article-050dec4d-9453-4bc2-aed2-aaf1f9f4f538 .wrapspacer{ height:685px !important; }  /* Session 0021 : Gargoyles */
.article-a5c48f29-4865-42bf-b89c-d71ce9f47087 .wrapspacer{ height:657px !important; }  /* Session 0022 : The Trouble with Giants */
.article-084e8871-1431-4e2d-86cb-f0138ef19fe1 .wrapspacer{ height:735px !important; }  /* Session 0023 : Rescue and Reprieve */
.article-bfc2d76c-5305-4c3f-a794-b60e4efc735f .wrapspacer{ height:567px !important; }  /* Session 0024:  Into the Well */
.article-88ff7072-2f2e-4624-b0ce-7d8b3f7f98d8 .wrapspacer{ height:1280px !important; }  /* Session 0025a: Can't Shake It (+sidebar image) */
.article-3ebcb759-566f-4cdd-9cd2-12e6dd1e13d3 .wrapspacer{ height:483px !important; }  /* Session 0025b:  Cathlynn's Journey */
.article-44733293-2893-4e76-82dc-bebe697e0d03 .wrapspacer{ height:567px !important; }  /* Session 0026:  Oh Man, Manticores! */
.article-9e9933b3-b5f9-4032-be83-2c067c7f1442 .wrapspacer{ height:567px !important; }  /* Session 0027 : We got Trolled */
.article-7b88b8fe-804c-4007-a5f8-bea21454025b .wrapspacer{ height:567px !important; }  /* Session 0028 : A Sword for my Life */
.article-4653b236-d9ec-410b-a600-3bfc75a38aee .wrapspacer{ height:567px !important; }  /* Session 0029 :  Regrouping */
.article-2558766c-8cac-42e2-b656-a5d23758cc46 .wrapspacer{ height:567px !important; }  /* Session 0030 :Preparing for the Road , Aga */
.article-b470879c-68ab-4a74-be29-996f05ad30f6 .wrapspacer{ height:567px !important; }  /* Session 0031 : The Book Delivery */
.article-8277f44e-afdd-4f22-be00-be30b5d506ab .wrapspacer{ height:567px !important; }  /* Session 0032 : Crossing the Sinking Lands */
.article-0745a655-fe63-40bf-85bb-4a2638d1af51 .wrapspacer{ height:567px !important; }  /* Session 0033 : The Hills Have Eyes.  Well, */
.article-e85dce9f-7362-4c03-9fa6-a2223cc8fdfe .wrapspacer{ height:623px !important; }  /* Session 0034 : Another Feathertoes */
.article-97981cf2-d022-4a8f-a57e-04ef9f27791b .wrapspacer{ height:942px !important; }  /* Session 0035 : Home again, home again, jig (+sidebar image) */
.article-22a63c77-bba1-4b0a-abf6-49d87e8282dc .wrapspacer{ height:495px !important; }  /* Session 0036 : The Rot Within */
.article-c101223c-f37f-43b7-8e01-880f34a7e170 .wrapspacer{ height:461px !important; }  /* Session 0037 : Well, well, well */
.article-0b73bd7b-92d1-4508-ba46-c7df476f7288 .wrapspacer{ height:411px !important; }  /* Session 0038 : Something Wicked This Way C */
.article-8bb741d6-0de1-405d-8ecb-d8eac7068da2 .wrapspacer{ height:467px !important; }  /* Session 0039 :  Everywhere, Darkness */
.article-5ea2dc03-154c-4f92-a499-35338b413472 .wrapspacer{ height:573px !important; }  /* Session 0040 : The Scent of Trouble */
.article-3afc1046-9fc1-4506-81f5-731ad445e9a4 .wrapspacer{ height:330px !important; }  /* Session 0041 :  Book, Lost - Dragon, Found */
.article-63831d7e-2474-4a2a-a7f1-7b4695dcd926 .wrapspacer{ height:545px !important; }  /* Session 0042 : The Dorian Show */
.article-d7f51e1a-f5fb-462f-bf74-d8bc2aab981f .wrapspacer{ height:545px !important; }  /* Session 0043 : A Flower for Thee */
.article-2db6ac8d-f157-4950-ba40-da5460d26252 .wrapspacer{ height:545px !important; }  /* Session 0044 : Beneath the Broken Pool */
.article-6bccf0d6-0f10-4c57-9212-94b3d5f1cf52 .wrapspacer{ height:601px !important; }  /* Session 0045: Rest, Recuperate, Reorganize */
.article-e3f9bc91-ad67-42ea-8e39-2419589670d2 .wrapspacer{ height:595px !important; }  /* Session 0046 : North on Starfall */
.article-7a5c4180-f8f6-4b59-86b1-814eece7d1e0 .wrapspacer{ height:545px !important; }  /* Session 0047  : The Gate of Ilthmar */
.article-e36af387-6bbb-4543-892a-3a4e824417a3 .wrapspacer{ height:573px !important; }  /* Session 0048 : The Yellow Dream */
.article-ca71cfbb-9585-4dec-b41e-2d0ee835e5c5 .wrapspacer{ height:495px !important; }  /* Session 0049 :  Filthmar */
.article-dbb0487d-006c-4a01-813b-0c5d732ede7a .wrapspacer{ height:495px !important; }  /* Session 0050 : The Ivy */
.article-2252b285-d5cb-4596-a888-8d5505cd94ec .wrapspacer{ height:567px !important; }  /* Session 0051 : What Came off the Wall */
.article-5b8212d8-7e4b-4b72-8944-08b0070fcded .wrapspacer{ height:1091px !important; }  /* Session 0052 : The Orchard (+sidebar image) */
.article-7fdfee29-5178-489b-b357-dbd9840fff3f .wrapspacer{ height:595px !important; }  /* Session 0053 : The Wake */

/* =========================================================================
   NEHWONIAN CALENDAR — our own build            (added 11 September 2026)

Class is nyr-* — NOT neh-cal, which is already taken by the homepage
   .

⚠ SIZES ARE IN px WITH !important, NOT rem. This world forces document and
     article  text to 18px, so a rem value silently SHRINKS against that
     baseline — .92rem reads as ~14.7px and looks tiny. The doubled class
     (.nyr-cal.nyr-cal) is the same specificity trick already used on
     .neh-cal a.spoiler-button.spoiler-button elsewhere in this file. Used by "The Nehwonian Year" and the homepage month block. Twelve month grids, generated by ,
   ordered so the CURRENT month comes first. Holidays and both moons are
   baked into the cells. Regenerate when the in-game date moves.

⚠ WORLD ANVIL REJECTS 4-BYTE UTF-8 IN ARTICLE CONTENT. Moon emoji
     (U+1F311 etc.) return HTTP 422 on save — verified 11 Sep 2026 by
     isolating it against a plain article and a 30,000-character one, both
     of which saved fine. The moon glyphs here are 3-byte BMP circles:
     ● new · ◔ crescent · ◐ waxing quarter · ◕ gibbous · ○ full · ◑ waning.

⚠ NO [section] TAGS IN THE GRID. World Anvil attaches a visibility-toggler
     (the little eyeball) to every section, and 730 of them made the calendar
     unusable — they covered the cells on hover. The moon letters carry the
     meaning without any wrapper, so the sections were removed entirely.

⚠ SPOILER SYNTAX IS [spoiler]content|Label[/spoiler]. The colon form
     [spoiler:Label]content[/spoiler] that appears in some references DOES
     NOT PARSE — it renders as literal text. Verified 11 Sep 2026 the hard
     way, across 76 festival entries. The label consumes the one pipe a
     spoiler is allowed, so labelled spoilers can hold no other pipe.

⚠ BOTH MOONS APPEAR IN EVERY SQUARE, prefixed T (The Traveler, 28-day)
     and D (The Dark Lady, 88-day). The letter carries the meaning, NOT the
     colour — Chad is partially colourblind and navigates by hex and Lab
     value, so colour must never be the only differentiator. Style these
     for weight and spacing; do not make them depend on hue.
   ========================================================================= */

.user-css .nyr-cal table{
  width:100%;
  table-layout:fixed;
  border-collapse:collapse;
  margin:0 0 6px;
}
 .user-css .nyr-cal.nyr-cal th{
  font-size:15px !important;
  letter-spacing:.06em;
  text-transform:uppercase;
  opacity:.75;
  font-weight:600;
  padding:6px 3px !important;
  border-bottom:1px solid rgba(110,83,32,.4);
}
.user-css .nyr-cal.nyr-cal td{
  vertical-align:top;
  height:104px;
  padding:7px 8px !important;
  font-size:19px !important;
  line-height:1.3 !important;
  border:1px solid rgba(110,83,32,.18);
}
/* holiday names */
.user-css .nyr-cal.nyr-cal td b{
  display:block;
  margin-top:5px;
  font-size:15px !important;
  line-height:1.3 !important;
  font-weight:600;
  color:#6e5320;
}
.user-css .nyr-cal td:empty,
.user-css .nyr-cal td:has(> br:only-child){
  background:rgba(0,0,0,.03);
  border-color:rgba(110,83,32,.08);
}

/* -------------------------------------------------------------------------
   These two articles have NO sidebar content — only the default cover — so
   the right column was reserving 40% of the width for almost nothing.
   They use the same wrapspacer mechanism as the session reports, but with a
   much smaller reserve and a smaller --wrap-navtop, because there is no
   sr-nav bar above the  to clear.
   Measured 11 Sep 2026 on The Nehwonian Year: navtop 0, sidebar 89px tall.
   A 40% column was being reserved for 89 pixels of content.
   ------------------------------------------------------------------------- */

/* The Nehwonian Year */
.user-css.article-6213bb05-59b2-4e70-91a7-989a2026d716 .article-content:has(.wrapspacer){
  --wrap-navtop:0px;
}
.article-6213bb05-59b2-4e70-91a7-989a2026d716 .wrapspacer{ height:103px !important; }

/* Nehwon's Calendar */
.user-css.article-5278dbcf-8f34-4115-b03a-c28cf137aaf4 .article-content:has(.wrapspacer){
  --wrap-navtop:0px;
}
.article-5278dbcf-8f34-4115-b03a-c28cf137aaf4 .wrapspacer{ height:103px !important; }

/* The single-month block on the world homepage. Sits inside the existing
   [:neh-cal][spoiler] on homepageContent4, where WA's widget was. */
.user-css .nyr-cal.nyr-home table{ margin-bottom:6px; }
/* the link under the homepage grid — it sits INSIDE the  so this
   selector can reach it. Doubled class to beat the world default. */
.user-css .nyr-cal.nyr-home > a,
.user-css .nyr-cal.nyr-home a{
  display:inline-block;
  margin-top:8px;
  font-size:19px !important;
  line-height:1.35 !important;
}
.user-css .nyr-cal.nyr-home td{ height:88px; font-size:17px !important; }
.user-css .nyr-cal.nyr-home td b{ font-size:14px !important; }

/* -------------------------------------------------------------------------
   FESTIVAL LIST — one per line.
   WA renders a spoiler's button as <a class="btn btn-sm btn-primary
   spoiler-button" data-toggle="collapse">, which is inline, so seventy-six
   of them ran together as a wall of text. Scoped to The Nehwonian Year by
   its article-UUID  class so spoiler buttons elsewhere are untouched.
   ------------------------------------------------------------------------- */

.article-6213bb05-59b2-4e70-91a7-989a2026d716 .spoiler-button{
  display:block;
  width:100%;
  text-align:left;
  white-space:normal;
  margin:0 0 5px;
  padding:6px 10px;
  font-size:.92rem;
  line-height:1.25;
}
/* the revealed account */
.article-6213bb05-59b2-4e70-91a7-989a2026d716 .spoiler-button + *,
.article-6213bb05-59b2-4e70-91a7-989a2026d716 .collapse{
  margin:0 0 10px;
  padding:0 4px 0 14px;
  font-size:.94rem;
  line-height:1.45;
}

/* =========================================================================
   SKULL MENU                                    (added 11 September 2026)

1. HOME LINK.
      The world field `worldSidebarContent` renders at the very TOP of the
      skull panel, above "World Codex". It accepts BBCode. That is where the
      homepage link now lives — WA's own nav is a generated <ul
      class="category-list"> of category links and cannot be added to.

2. MAP LIST.
      WA renders the maps block as .maps-list containing an
      <h2 class="maps-list-header"> plus every map as a sibling. Fully
      expanded it pushed Timelines and the category list off the panel.

⚠ THE CLASS IS ON TWO ELEMENTS. Both the outer wrapper and the inner
        <ul> carry `maps-list`, so a rule written against `.maps-list`
        applies to both and they fight. Target `ul.maps-list` for the list
        and `.world-maps` for the block.

⚠ HOVER, NOT CLICK. A click-to-toggle needs a :target anchor, a hidden
        checkbox, or <details>/<summary>. All three require injecting markup
        into HTML World Anvil generates, and no JavaScript is available. The
        open list is also capped at 14em with its own scrollbar, so even
        while open it can never push Timelines off the panel again.
   ========================================================================= */

/* ---------- 1. the home link ---------- */
.user-css .neh-homelink{
  padding:.5em 0 .8em;
  margin-bottom:.4em;
  border-bottom:1px solid rgba(110,83,32,.3);
}
.user-css .neh-homelink a{
  font-family: GermaniaOneWA, Georgia, serif !important;
  font-size: 1.65rem !important;
  font-weight: normal;
  letter-spacing: normal;
  line-height: 1.25;
}

/* ---------- 2. the map list ---------- */
/* ⚠ `maps-list` is on TWO elements — the outer wrapper AND the inner <ul>.
   Target ul.maps-list specifically or the rules fight each other. */

.user-css ul.maps-list{
  display:none;
}
.user-css .world-maps:hover ul.maps-list,
.user-css .world-maps:focus-within ul.maps-list{
  display:block;
  max-height:14em;
  overflow-y:auto;
}
.user-css .world-maps .maps-list-header{
  cursor:pointer;
  position:relative;
  padding-right:1.6em;
  margin-bottom:.2em;
}
.user-css .world-maps .maps-list-header::after{
  content:"\25BE";
  position:absolute;
  right:.3em;
  opacity:.6;
  transition:transform .25s ease;
}
.user-css .world-maps:hover .maps-list-header::after{
  transform:rotate(180deg);
}
/* generous hit area so a small mouse movement does not close it */
.user-css .world-maps{
  padding:.3em .5em .6em;
  margin:0 -.5em;
}

/* =========================================================================
   ARTICLE FIGURES                                (added 12 September 2026)

World Anvil renders [img:ID] at full column width, and [img:ID|right]
   floats it without constraining it, so a 1024px plate swallows the column.
   Wrapping each image in [:tc-fig ...] puts the sizing under our
   control and drops the pipe from the img tag, which also makes these safe
   to place inside a [spoiler] or [quote] later.

Usage in the article :
     [:tc-fig tc-fig-right][img:ID][/]
     [:tc-fig tc-fig-left][img:ID][/]
     [:tc-fig tc-fig-wide][img:ID][/]

⚠ Use [:], NOT [section:] — WA hangs a visibility-toggler eyeball
     on every section, which is what ruined the calendar cells on 11 Sep.
   ========================================================================= */

.user-css .tc-fig img{
  display:block;
  width:100%;
  height:auto;
  border-radius:2px;
}

.user-css .tc-fig-right{
  float:right;
  width:34%;
  margin:.35em 0 1.1em 1.8em;
  shape-outside:margin-box;
}
.user-css .tc-fig-left{
  float:left;
  width:34%;
  margin:.35em 1.8em 1.1em 0;
  shape-outside:margin-box;
}
.user-css .tc-fig-wide{
  clear:both;
  width:72%;
  margin:1.8em auto;
}

/* keep a float from hanging past its section */
.user-css .tc-fig-right::after,
.user-css .tc-fig-left::after{ content:""; display:block; clear:both; }
.user-css [class*=article-content] h2,
.user-css [class*=article-content] h3{ clear:both; }

/* narrow screens: no floats, nothing over half the height of the view */
@media (max-width: 780px){
  .user-css .tc-fig-right,
  .user-css .tc-fig-left,
  .user-css .tc-fig-wide{
    float:none;
    width:100%;
    margin:1.2em auto;
  }
  .user-css .tc-fig img{ max-height:60vh; width:auto; margin:0 auto; }
}

/* Landscape plates need more width than a portrait one to read at all.
   Add tc-fig-lg alongside tc-fig-left or tc-fig-right for a wide float. */
.user-css .tc-fig-lg{ width:46%; }
@media (max-width: 780px){ .user-css .tc-fig-lg{ width:100%; } }

/* ---- FIGURES: clearance fix (added 12 Sep 2026) -------------------------
   A float was riding up over the last line of the paragraph above it.
   Something else in this stylesheet pulls s upward, so the top
   margin needs !important and a real value, and the box needs its own
   height rather than collapsing around a floated child. */
.user-css .tc-fig{
  display:block;
  overflow:hidden;
  position:relative;
  clear:both;
}
.user-css .tc-fig-left,
.user-css .tc-fig-right{
  margin-top:1.6em !important;
  margin-bottom:1.4em !important;
}
.user-css .tc-fig-wide{
  margin-top:2em !important;
  margin-bottom:2em !important;
}

/* ---- VELLUM PLATES: blend instead of cutting out ------------------------
   Midjourney cannot output an alpha channel and its Editor only gives a
   hard cutout, which is wrong for a wash drawing with soft bleeding edges.
   multiply makes light pixels transparent and dark ones opaque: the cream
   vellum falls away into the parchment, the ink and washes stay.
     [:tc-fig tc-fig-left tc-fig-vellum][img:ID][/] */
.user-css .tc-fig-vellum{
  background:transparent;
}
.user-css .tc-fig-vellum img{
  mix-blend-mode:multiply;
  border-radius:0;
  filter:brightness(1.06) contrast(.96);
}

/* ---- FULL-BLEED ARTICLES (added 12 Sep 2026) ---------------------------
   An article with nothing in its sidebar still has WA reserving the right
   column, so the  is squeezed into 60% of the page for no reason. The
   wrapspacer trick wraps text around the empty column; this removes it.

Put this at the top of the article  (the period is load-bearing,
   WA discards an empty ):

[:fullbleed].[/]

Use only where the sidebar is genuinely empty. Anything in the metadata
   panel will be hidden along with it. */

.user-css .article-content:has(.fullbleed) .article-content-right{
  display:none !important;
}
.user-css .article-content:has(.fullbleed) .article-content-left{
  width:100% !important;
  max-width:100% !important;
  flex:0 0 100% !important;
}
.user-css .fullbleed{
  height:0;
  overflow:hidden;
  margin:0;
  padding:0;
}

/* Aschen — sidebar carries only the primary source and the host, so the text
   wraps past it and then runs full width. Heights are estimates until
   measured; see the console snippet in the session notes. */
.user-css.article-0bf0f442-d864-49bb-950d-9a6d2cfe8109 .article-content:has(.wrapspacer){
  --wrap-navtop:0px;
}
/* retired 12 Sep 2026 — Aschen now uses fullbleed instead
.article-0bf0f442-d864-49bb-950d-9a6d2cfe8109 .wrapspacer{ height:178px !important; } */

/* ---- ASCHEN HEADING SPACING (added 12 Sep 2026) ------------------------
   WA gives an h3 a bottom margin and then gives the paragraph after it a
   top margin, and the two add up to a gap you could park a cart in.
   Collapsing both. Scoped to this article; lift the scope if it should
   apply world-wide. */
.article-0bf0f442-d864-49bb-950d-9a6d2cfe8109 .user-css h3,
.user-css.article-0bf0f442-d864-49bb-950d-9a6d2cfe8109 h3{
  margin-bottom:.15em !important;
  padding-bottom:0 !important;
}
.article-0bf0f442-d864-49bb-950d-9a6d2cfe8109 .user-css h3 + p,
.user-css.article-0bf0f442-d864-49bb-950d-9a6d2cfe8109 h3 + p{
  margin-top:0 !important;
  padding-top:0 !important;
}
.article-0bf0f442-d864-49bb-950d-9a6d2cfe8109 .user-css h3 + br,
.user-css.article-0bf0f442-d864-49bb-950d-9a6d2cfe8109 h3 + br{
  display:none;
}

/* A centred plate at half width, for a tall portrait image that would
   otherwise fill the column. Use with tc-fig-vellum where the ground is
   cream and should blend:
       [:tc-fig tc-fig-narrow tc-fig-vellum][img:ID][/] */
.user-css .tc-fig-narrow{
  clear:both;
  width:48%;
  margin:1.6em auto 1.8em;
}
@media (max-width: 780px){
  .user-css .tc-fig-narrow{ width:80%; }
}

/* === DEFAULT JUSTIFIED BODY TEXT — added 16 Sep 2026 (M'Brell 11) ===
   Justifies ordinary paragraph text in the main article column on every
   article, so new articles no longer need [justify] tags.
   Sidebars, tables, headings and centred blocks are left alone.
   Paste at the END of World CSS (World > Edit > Design > World CSS). */

.user-css .article-content-left p,
.user-css .article-content-left .article-content-text{
  text-align: justify;
  hyphens: auto;
}
.user-css .article-content-left td,
.user-css .article-content-left th,
.user-css .article-content-left .text-center,
.user-css .article-content-left [class*="center"]{
  text-align: inherit;
}

/* === GODS OF LANKHMAR — AT A GLANCE TITLE FIX — 19 Sep 2026 (M'Brell 11) ===
   The existing rule only styles .gol-facts-title when it sits INSIDE .gol-facts.
   If World Anvil will not parse the nested container, the title has to live
   outside the box; this rule styles it either way and closes the gap between
   the title and the box beneath it.
   Paste at the VERY END of World CSS (World > Edit > Design > World CSS). */

.user-css .gol-article .gol-facts-title{
  font-family: 'Cinzel', Georgia, serif;
  font-size: 1.05em !important;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #6e5320 !important;
  border-bottom: 1px solid rgba(110,83,32,.35);
  padding-bottom: .4em;
  margin: 1.2em 0 0;
}

/* When the title sits directly above the facts box, join them up */
.user-css .gol-article .gol-facts-title + .gol-facts{
  margin-top: .4em;
}

/* The Last Wrapping — larger opening drop cap */
.user-css .tide-article .tide-cap{
  font-size: 6.5em !important;
  line-height: .76 !important;
}

/* === SEARCH BOX: right-hand end of the banner — 20 Sep 2026 === */
.user-css form.search-form{
  text-align: right !important;
  width: 100% !important;
}

.user-css form.search-form .form-group{
  float: right !important;
  margin: 16px 50px 0 0 !important;   /* top, right, bottom, left */
}

.user-css form.search-form .typeahead-input{
  max-width: 230px !important;
}

@media (max-width: 767px){
  .user-css form.search-form{ text-align: left !important; }
  .user-css form.search-form .form-group{ float: none !important; margin: 0 !important; }
}

/* === GLOBAL FOOTER: Ko-fi button + legal line — 20 Sep 2026 ===
   The legal text is wrapped in [container:neh-legal] in the World's global
   footer. This halves its size, quietens it, and sits the Ko-fi button neatly
   at the left of the same block.
   Paste at the VERY END of World CSS.
   */

.user-css .neh-legal{
  font-size: .62em !important;     /* about half the body size */
  line-height: 1.5 !important;
  opacity: .72;
  text-align: left !important;
  margin: 1.4em 0 .4em !important;
  padding-top: .8em;
  border-top: 1px solid rgba(110,83,32,.30);
  clear: both;
}

.user-css .neh-legal *{
  font-size: inherit !important;
}

.user-css .neh-legal img{
  max-height: 26px !important;
  width: auto !important;
  float: left !important;
  margin: 0 12px 4px 0 !important;
  opacity: .95;
}

/* --- Put the Ko-fi button and legal line BELOW the follow/share buttons --- */
.user-css .article-footer{
  display: flex !important;
  flex-direction: column !important;
}

/* the follow / share / flag row first */
.user-css .article-footer > .do-not-print{
  order: 1 !important;
}

/* then whatever block holds the legal line */
.user-css .article-footer > .neh-legal,
.user-css .article-footer > *:has(.neh-legal){
  order: 99 !important;
}

/* competition entries stay at the top */
.user-css .article-footer > .article-competition-entries{
  order: 0 !important;
}

/* === BREADCRUMB — THE RULE THAT ACTUALLY MATCHES — 20 Sep 2026 ===
   WA renders the trail as  div.breadcrumb > span.breadcrumb-*-wrapper > a,
   NOT as a <ul> of <li>. Every earlier rule written against
   ".breadcrumb li" and ".breadcrumb li a" matched nothing at all, which is
   why the trail stayed large. The size it was actually inheriting came from
       .user-css .article-content a { font-size:20px !important }
   because the breadcrumb sits inside .article-content.

The doubled class (.breadcrumb.breadcrumb) raises specificity above that
   rule — the same trick already used on .neh-cal a.spoiler-button.spoiler-button.

ONE NUMBER TO TUNE: change all four 11px values together.
   Paste at the VERY END of World CSS. */

.user-css .breadcrumb.breadcrumb,
.user-css .breadcrumb.breadcrumb span,
.user-css .breadcrumb.breadcrumb a,
.user-css .breadcrumb.breadcrumb i{
  font-size: 11px !important;
  line-height: 1.45 !important;
}

/* the chevrons and the globe icon, a touch smaller again */
.user-css .breadcrumb.breadcrumb i.fas,
.user-css .breadcrumb.breadcrumb .fa-chevron-right,
.user-css .breadcrumb.breadcrumb .fa-globe-stand{
  font-size: 10px !important;
  opacity: .8;
}

/* tighten the bar around the smaller text */
.user-css .breadcrumb.breadcrumb{
  padding: .35em .8em !important;
  letter-spacing: .06em !important;
}

@media (max-width: 600px){
  .user-css .breadcrumb.breadcrumb,
  .user-css .breadcrumb.breadcrumb span,
  .user-css .breadcrumb.breadcrumb a,
  .user-css .breadcrumb.breadcrumb i{
    font-size: 10px !important;
  }
}

/* === SKULL PANEL LINKS — homepage + campaign quick links — 20 Sep 2026 ===
   Matches the World Codex category links: same size, bold.
   Replaces the earlier .neh-quicklinks block and the font-size line in
   the older .neh-homelink block. Paste at the VERY END of World CSS. */

.user-css .neh-homelink a,
.user-css .neh-quicklinks a{
  font-family: GermaniaOneWA, Georgia, serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: normal;
  line-height: 1.35 !important;
}

.user-css .neh-quicklinks{
  padding: .4em 0 .7em;
  margin-bottom: .5em;
  border-bottom: 1px solid rgba(110,83,32,.3);
}

/* === WORLD INDEX — three-column bullet lists — 20 Sep 2026 ===
   Each section's links sit in [container:widx-list][ul]...[/ul][/container].
   Paste at the VERY END of World CSS. */

.user-css .widx-list.widx-list ul{
  column-count: 3;
  column-gap: 2.2em;
  margin: .4em 0 1.8em;
  padding-left: 1.1em;
}

.user-css .widx-list.widx-list li,
.user-css .widx-list.widx-list li a{
  font-size: 16px !important;
  line-height: 1.55 !important;
  break-inside: avoid;
}

@media (max-width: 900px){ .user-css .widx-list.widx-list ul{ column-count: 2; } }
@media (max-width: 560px){ .user-css .widx-list.widx-list ul{ column-count: 1; } }

.user-css .world-menu a.toc-article-link{
  font-family: GermaniaOneWA, Georgia, serif !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  color: #8B1A0E !important;
  text-decoration: underline !important;
  line-height: 1.6 !important;
}

/* Article/mention links inside headings inherit the heading's type
   — prefixed to out-specify .user-css .article-content a {20px !important} */
.user-css .article-content h1 a.article-link,
.user-css .article-content h2 a.article-link,
.user-css .article-content h3 a.article-link,
.user-css .article-content h4 a.article-link,
.user-css .article-content h5 a.article-link,
.user-css .article-content h6 a.article-link,
.user-css .article-content-left h1 a.article-link,
.user-css .article-content-left h2 a.article-link,
.user-css .article-content-left h3 a.article-link,
.user-css .article-content-left h4 a.article-link,
.user-css .article-content-left h5 a.article-link,
.user-css .article-content-left h6 a.article-link {
  font-size: inherit !important;
  font-weight: inherit !important;
  font-family: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  color: inherit !important;
}

/* =========================================================================
   NEHWON — SESSION METADATA BESIDE THE SIDEBAR   (26–29 Sep 2026)
   Session reports only (anything with a .wrapspacer).

1. Block boxes (tables, header underlines) run UNDER a float instead of
      wrapping it. flow-root makes them narrow to the space LEFT of the
      sidebar. width:auto is required: an explicit 100% width stops a
      flow-root box from narrowing and pushes it below the sidebar instead,
      which is the empty gap on 0052.
   2. Eight reports carry an image at the top of the sidebar
      (sidepanelcontenttop). Their spacer heights were computed for text
      only, so the sidebar outran the spacer and overlapped the body.
      Those heights are folded into the per-article list above.
   3. The ARTICLE FIGURES block gives every h2/h3 clear:both, which
      dropped the Session Metadata heading below the sidebar. Cleared
      back to none on session reports only.
   ========================================================================= */

.user-css .article-content:has(.wrapspacer) .sr-meta,
.user-css .article-content:has(.wrapspacer) .article-content-left h2,
.user-css .article-content:has(.wrapspacer) .article-content-left h3{
  display:flow-root; width:auto !important; max-width:none;
}
.user-css .article-content:has(.wrapspacer) .sr-meta table{
  width:100% !important; max-width:100% !important; table-layout:auto;
}
.user-css .article-content:has(.wrapspacer) .sr-meta th,
.user-css .article-content:has(.wrapspacer) .sr-meta td{
  overflow-wrap:anywhere; word-break:normal; white-space:normal;
}
.user-css .article-content:has(.wrapspacer) .article-content-left h2,
.user-css .article-content:has(.wrapspacer) .article-content-left h3{
  clear:none !important;
}
/* END SESSION METADATA */

/* =========================================================================
   NEHWON — SESSION METADATA BESIDE THE SIDEBAR, v3      (29 Sep 2026)
   Paste at the VERY END of World CSS, after "END SESSION METADATA".
   (Replaces the v2 file — if v2 is already pasted, this overrides it.)

CAUSE: the live page puts the metadata table OUTSIDE the .sr-meta
   container (WA's parser closes the container before the table), so every
   .sr-meta rule missed it. The bare table keeps the world default
   width:100%, can't fit beside the floated .wrapspacer, and drops below
   the sidebar. Reproduced exactly in a test render.

FIX: aim at the table itself. In session reports the metadata table is
   the only table, so it gets an explicit width equal to the space left of
   the sidebar, and fixed layout so no cell can widen it. .sr-meta is set
   to display:contents so this works whether or not the table sits inside
   it. Desktop only; below 768px the columns stack and nothing changes.

⚠ If a session report ever gets a SECOND table (XP, loot), it will be
     narrowed too. Give that one its own container class and exempt it.
   ========================================================================= */
@media (min-width:768px){
  .user-css .article-content:has(.wrapspacer) .sr-meta{
    display:contents !important;
  }
  .user-css .article-content:has(.wrapspacer) .article-content-left table{
    width:calc(58.33333% - 15px) !important;
    max-width:calc(58.33333% - 15px) !important;
    table-layout:fixed !important;
    margin-left:0 !important;
  }
}
/* END SESSION METADATA v3 */

/* SESSION METADATA v3.2 — lift the heading level with the sidebar (29 Sep 2026)
   From the live DOM: nav > br > span.line-spacer > wrapspacer > h3 > sr-meta.
   The heading is an H3. WA's span.line-spacer is a blank line of its own. */
.user-css .article-content:has(.wrapspacer) .sr-nav-top + br,
.user-css .article-content:has(.wrapspacer) .sr-nav-top + br + .line-spacer,
.user-css .article-content:has(.wrapspacer) .sr-nav-top + .line-spacer{
  display:none !important;
}
.user-css .article-content:has(.wrapspacer) .sr-nav-top{
  margin-bottom:10px !important;
}
.user-css .article-content:has(.wrapspacer) .wrapspacer + h3{
  margin-top:0 !important;
  padding-top:0 !important;
}
/* END v3.2 */

/* SESSION METADATA v3.3 — drop the sidebar level with the table (29 Sep 2026)
   Moves the sidebar down 53px and lengthens the spacer by the same 53px so
   the sidebar's bottom stays clear of the body text. Session reports only. */
.user-css .article-content:has(.sr-nav-top){
  --wrap-navtop:280px;
}
.user-css .article-content:has(.sr-nav-top) .wrapspacer{
  margin-bottom:60px !important;
}
/* END v3.3 */

/* =========================================================================
   NEHWON HOMEPAGE — THE CARVED INSCRIPTION BORDER   v3     (30 Sep 2026)
   Ancient Lankhmarian charm, cut into the parchment in New Rocker, framing
   the homepage top, right and left. A slow ember-gold wave runs through
   the grooves.

The three [container:neh-runes ...] blocks live at the start of the
   world's HOMEPAGE CONTENT 2 field (above Mira's panel). NOT the
   Description: that field strips container tags.

Fonts use the plain @font-face pattern only. World Anvil drops rules
   that carry format() or unicode-range. Two names, so the second file
   supplies the long vowels (ē, ō).

LAYOUT: the side bands start one band-height below the top line, so
   each top corner is a clean empty square. The RIGHT band reads downward.
   The LEFT band is turned so its letter-tops face outward and it reads
   upward; it is pinned to its TOP end (flex-end, then rotated), so it
   finishes cleanly on "Heimaz." at the corner and any cut-off word falls
   at the foot of the page.

THREE KNOBS (in the first rule):
     --rune-top    where the top line sits (just under the banner)
     --rune-bottom how far above the page foot the side bands stop
     --rune-band   band thickness
   ========================================================================= */

@font-face{font-family:NewRockerWA;font-style:normal;font-weight:400;font-display:swap;
  src:url(https://fonts.gstatic.com/s/newrocker/v17/MwQzbhjp3-HImzcCU_cJoGQfiA.woff2);}
@font-face{font-family:NewRockerWAX;font-style:normal;font-weight:400;font-display:swap;
  src:url(https://fonts.gstatic.com/s/newrocker/v17/MwQzbhjp3-HImzcCU_cJoGofiIlP.woff2);}

.user-css.page-world-homepage{
  position:relative !important;
  --rune-top:260px;
  --rune-bottom:24px;
  --rune-inset:0px;
  --rune-band:30px;
}
.user-css.page-world-homepage *:has(.neh-runes){ position:static !important; }

.user-css.page-world-homepage .neh-runes.neh-runes{
  position:absolute !important;
  overflow:hidden !important;
  white-space:nowrap !important;
  margin:0 !important; padding:0 !important;
  font-family:NewRockerWA,NewRockerWAX,Georgia,serif !important;
  font-size:18px !important;
  line-height:var(--rune-band) !important;
  letter-spacing:.08em;
  text-align:left !important;
  color:transparent !important;
  -webkit-background-clip:text; background-clip:text;
  background-repeat:repeat;
  filter:drop-shadow(0 1px 0 rgba(255,244,214,.85)) drop-shadow(0 -1px 0 rgba(45,28,8,.55));
  pointer-events:none; user-select:none;
  z-index:3;
}
.user-css.page-world-homepage .neh-runes-top{
  top:var(--rune-top); left:var(--rune-band); right:var(--rune-band); height:var(--rune-band);
  background-image:linear-gradient(90deg,#6b5434 0,#6b5434 40%,#e6b65c 50%,#6b5434 60%,#6b5434 100%);
  background-size:700px 100%;
  animation:neh-rune-wave-x 11s linear infinite;
}
.user-css.page-world-homepage .neh-runes-right,
.user-css.page-world-homepage .neh-runes-left{
  top:calc(var(--rune-top) + var(--rune-band)); bottom:var(--rune-bottom); width:var(--rune-band);
  writing-mode:vertical-rl;
  background-image:linear-gradient(180deg,#6b5434 0,#6b5434 40%,#e6b65c 50%,#6b5434 60%,#6b5434 100%);
  background-size:100% 700px;
  animation:neh-rune-wave-y 11s linear infinite;
}
.user-css.page-world-homepage .neh-runes-right{ right:var(--rune-inset); animation-delay:-3.7s; }
.user-css.page-world-homepage .neh-runes-left{
  left:var(--rune-inset); animation-delay:-7.3s;
  transform:rotate(180deg);
  display:flex !important; flex-direction:row; justify-content:flex-end;
}

@keyframes neh-rune-wave-x{ from{background-position:0 0} to{background-position:700px 0} }
@keyframes neh-rune-wave-y{ from{background-position:0 0} to{background-position:0 700px} }

@media (max-width:991px){ .user-css.page-world-homepage .neh-runes{ display:none !important; } }
@media (prefers-reduced-motion:reduce){ .user-css.page-world-homepage .neh-runes{ animation:none !important; } }
/* END CARVED INSCRIPTION BORDER */

Need help? Check out the CSS Styling Guide

World Styling Editor

Sheelba.jpg

Comments