/* Public reading pages opt in through ViewData["PublicPage"].
   Navigation additions are shared; game tools keep their existing content styles. */
.public-navigation .nk-nav-table { display: flex; align-items: center; gap: 18px; }
.public-navigation .nk-nav-table > .nk-nav { margin-left: auto; }
.public-navigation .nk-nav-table > .nk-nav-icons { width: auto; margin-left: 0; }
.public-navigation .public-wordmark { flex: 0 0 auto; color: #e4c48e; font-size: 24px; line-height: 1.1; }
.public-wordmark span { display: block; margin-top: 6px; font: 10px/1.3 "Roboto Condensed", sans-serif; letter-spacing: .14em; color: #c7bac5; text-transform: uppercase; }
.public-navigation .nk-nav > li > a { padding-right: 9px; padding-left: 9px; font-size: 14px; }
.public-navigation .nk-nav > .public-sign-in > a { display: inline-flex; align-items: center; gap: 9px; }
.public-navigation .public-sign-in .nk-icon-toggle { width: 18px; }
.nk-navbar .nk-nav > .public-app-nav > a { border: 1px solid #b99a66; color: #efd7a3; margin: 10px 0 10px 12px; padding: 10px 15px; }
.public-navigation a:focus-visible, #nk-nav-mobile a:focus-visible { outline: 2px solid #efd7a3; outline-offset: 4px; }

.public-site { --public-gold: #e4c48e; --public-ink: #f0e7da; --public-muted: #c7bac5; --public-line: rgba(215, 186, 144, .22); color: var(--public-ink); font-size: 18px; line-height: 1.65; }
.public-site h1, .public-site h2, .public-site h3 { color: var(--public-ink); line-height: 1.18; font-weight: 400; }
.public-site h2 { font-size: clamp(28px, 3.2vw, 40px); margin-bottom: 22px; }
.public-site h3 { font-size: 28px; }
.public-site a { color: var(--public-gold); }
.public-site a:hover { color: #fff1d2; }
.public-site a:focus-visible { outline: 2px solid #efd7a3; outline-offset: 5px; }
.public-site p { margin-bottom: 20px; }
.public-site strong { color: #f7e9d4; font-weight: 700; }
.public-site .public-eyebrow { color: var(--public-gold); font-size: 12px; font-weight: 700; letter-spacing: .2em; line-height: 1.5; text-transform: uppercase; margin-bottom: 18px; }
.public-site .public-meta { color: var(--public-muted); font-size: 14px; line-height: 1.6; }
.public-site .public-lead { font-size: clamp(20px, 2.4vw, 25px); line-height: 1.5; }
.public-site .public-section { margin-top: 64px; margin-bottom: 64px; }
.public-site .public-panel { position: relative; overflow: hidden; isolation: isolate; padding: 36px; background: rgba(24, 19, 28, .96); border: 1px solid var(--public-line); box-shadow: 0 12px 32px rgba(0, 0, 0, .2); }
.public-site .public-panel > .bg-image { z-index: -1; pointer-events: none; }
.public-site .public-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin: 28px 0; }
.public-site .public-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px; padding: 13px 24px; border: 1px solid #d7b781; background: #e4c48e; color: #251c27; font: 700 16px/1.4 "Roboto Condensed", sans-serif; text-align: center; text-decoration: none; transition: background-color .2s, border-color .2s; }
.public-site .public-button:hover { color: #251c27; background: #f6dfb2; border-color: #f6dfb2; }
.public-site .public-button-secondary { background: rgba(24, 19, 28, .68); border-color: #aa8d67; color: #f1d6a5; }
.public-site .public-button-secondary:hover { background: #302431; color: #fff1d2; }
.public-site .public-text-link { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; text-decoration: underline; text-underline-offset: 5px; }
.public-site .public-notice { padding: 24px 28px; margin: 28px 0; border-left: 3px solid #b58955; background: #2a202c; color: #e5d9df; }
.public-site .public-notice p:last-child { margin-bottom: 0; }
.public-site .public-notice h2 { font-size: 28px; }
.public-site .public-reading { max-width: 800px; margin-right: auto; margin-left: auto; padding: 48px 52px; overflow-wrap: break-word; }
.public-site .public-reading section + section { padding-top: 38px; margin-top: 38px; border-top: 1px solid var(--public-line); }
.public-site .public-reading > h2 { margin-top: 40px; }
.public-site .public-reading p a:not(.public-button) { text-decoration: underline; text-underline-offset: 3px; }
.public-site .public-reading li { padding-left: 6px; margin-bottom: 14px; }
.public-site .public-step-list { padding-left: 26px; }
.public-site .public-step-list li { padding-left: 10px; margin-bottom: 24px; }
.public-site .public-step-list li::marker { font-weight: 700; color: var(--public-gold); }
.public-site [id] { scroll-margin-top: 115px; }
.public-site .public-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.public-site .public-card { display: flex; flex-direction: column; min-width: 0; }
.public-site .public-card > .public-text-link:last-child { margin-top: auto; }
.public-site .public-card h2 a { color: inherit; }

/* Retain the existing parallax, collage and typed phrases. */
.public-site .home-hero .nk-header-table { min-height: 700px; padding-top: 86px; }
.public-site .home-hero .nk-header-table-cell { padding: 64px 0 70px; }
.public-site .home-hero::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(12, 9, 15, .12), rgba(12, 9, 15, .38) 65%, rgba(12, 9, 15, .76)); }
.public-site .home-hero .nk-header-table { position: relative; z-index: 1; }
.public-site .home-hero .nk-title { font-size: clamp(42px, 5.5vw, 76px); line-height: 1.1; letter-spacing: -.025em; }
.public-site .home-hero .nk-title-sep { margin-top: 26px; margin-bottom: 26px; }
.public-site .home-hero-description { font-family: "Marcellus SC", serif; font-size: 25px; margin-bottom: 12px; }
.public-site .home-hero-intro { max-width: 640px; margin-right: auto; margin-left: auto; color: #e5ddd9; line-height: 1.5; }
.public-site .home-hero-typed { min-height: 23px; margin: 22px 0; font-size: 12px; letter-spacing: .22em; color: #e4c48e; }
.public-site .home-hero-actions { justify-content: center; margin: 26px 0 18px; }
.public-site .home-development-note { font-size: 14px; color: #e4dadb; margin-bottom: 10px; }
.public-site .public-status { display: inline-block; color: #efd7a3; margin-right: 9px; font-weight: 700; }
.public-site .public-status::before { content: ""; display: inline-block; width: 6px; height: 6px; background: #b96c76; border-radius: 50%; margin-right: 8px; vertical-align: middle; }
.public-site .home-hero-links { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px 15px; font-size: 15px; }
.public-site .home-hero-links a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: 4px; }
.public-site .home-content { margin-top: 48px; }
.public-site .home-news { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(200px, 1fr); gap: 40px; align-items: center; padding: 44px 48px; }
.public-site .home-news h2 a { color: inherit; }
.public-site .home-news .public-eyebrow { margin-bottom: 8px; }
.public-site .home-news .public-actions { margin-bottom: 0; }
.public-site .home-news-art img { width: 100%; }
.public-site .home-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 36px; margin-bottom: 30px; }
.public-site .home-section-heading h2 { margin-bottom: 0; }
.public-site .home-section-heading > p { flex-basis: 340px; flex-shrink: 0; margin-bottom: 3px; color: var(--public-muted); font-size: 16px; }
.public-site .home-section-heading .public-eyebrow { margin-bottom: 12px; }
.public-site .home-destination-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.public-site .home-destination-grid .public-card { padding: 30px 28px; }
.public-site .home-card-number { color: #8b707d; font: 32px/1 "Marcellus SC", serif; margin-bottom: 25px; }
.public-site .home-destination-grid .public-eyebrow { font-size: 10px; letter-spacing: .13em; margin-bottom: 12px; }
.public-site .home-destination-grid p { font-size: 17px; }
.public-site .home-app-card { border-top: 2px solid #ba9863; }
.public-site .home-card-links { display: flex; flex-direction: column; align-items: flex-start; margin-top: auto; font-size: 16px; }
.public-site .home-card-links > a { display: inline-flex; align-items: center; min-height: 44px; }
.public-site .home-card-links > a:last-child { font-size: 15px; color: #d1bec6; text-decoration: underline; text-underline-offset: 4px; }
.public-site .home-mud-address { display: flex; flex-wrap: wrap; gap: 6px 20px; padding-top: 12px; border-top: 1px solid var(--public-line); color: var(--public-muted); }
.public-site .home-mud-address strong { display: block; font-size: 17px; }
.public-site .home-lore { padding: 44px 32px; text-align: center; }
.public-site .home-lore-content > p:not(.public-eyebrow) { color: var(--public-muted); max-width: 620px; margin: 0 auto 30px; font-size: 16px; }
.public-site .home-spheres { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
.public-site .home-sphere { --sphere-color: #b98c62; display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 8px 0; font: 16px/1.3 "Marcellus SC", serif; color: #eee0db; text-decoration: none; }
.public-site .home-sphere-portrait { display: block; width: 100%; max-width: 112px; aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 2px solid var(--sphere-color); box-shadow: 0 5px 22px color-mix(in srgb, var(--sphere-color) 22%, transparent); }
.public-site .home-sphere img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.public-site .home-sphere:hover img { transform: scale(1.06); }
.public-site .home-sphere-vampire { --sphere-color: #bb3759; }
.public-site .home-sphere-demon { --sphere-color: #d89650; }
.public-site .home-sphere-wraith { --sphere-color: #7fa0e0; }
.public-site .home-sphere-hunter { --sphere-color: #ba9c43; }
.public-site .home-sphere-mage { --sphere-color: #bca5e2; }
.public-site .home-sphere-changeling { --sphere-color: #77bb9b; }
.public-site .home-sphere-werewolf { --sphere-color: #8ca271; }
.public-site .home-featured-inline { display: grid; grid-template-columns: minmax(220px, 1fr) 2fr; padding: 0; }
.public-site .home-featured-portrait { overflow: hidden; }
.public-site .home-featured-portrait img { display: block; width: 100%; height: 100%; max-height: 420px; object-fit: cover; object-position: center 25%; transition: transform .35s; }
.public-site .home-featured-portrait:hover img { transform: scale(1.03); }
.public-site .home-featured-copy { padding: 42px; align-self: center; }
.public-site .home-featured-copy h3 { font-size: 38px; }
.public-site .home-featured-copy .nk-title-sep-icon { margin-top: 20px; margin-bottom: 22px; }
.public-site .home-npc-header h3 { margin-bottom: 0; }
.public-site .home-npc-count { color: #c7bac5; }
.public-site .npc-grid .nk-post-title { font-size: 23px; line-height: 1.3; margin-bottom: 0; }
.public-site .public-page-hero .nk-header-table { min-height: 380px; padding-top: 90px; }
.public-site .public-page-hero .nk-header-table-cell { padding: 55px 0; }
.public-site .public-page-hero h1 { max-width: 900px; margin: 0 auto 25px; font-size: clamp(34px, 4.2vw, 56px); }
.public-site .public-page-hero .public-lead { max-width: 680px; margin-right: auto; margin-left: auto; }
.public-site .public-page-hero .public-actions { justify-content: center; }
.public-site .public-page-hero .public-meta { margin-bottom: 0; }
.public-site .nk-footer { font-size: 16px; line-height: 1.65; }
.public-site .nk-footer-links a { min-height: 36px; }

@media (max-width: 1199px) {
    .public-navigation .nk-nav-table > .nk-nav-icons { margin-left: auto; }
    #nk-nav-mobile .public-app-nav > a { margin: 12px 0; text-align: center; }
    #nk-nav-mobile .public-sign-in .nk-icon-toggle { display: none; }
}
@media (max-width: 991px) {
    .public-site .home-destination-grid { grid-template-columns: 1fr; }
    .public-site .home-card-number { float: right; }
    .public-site .home-section-heading { align-items: flex-start; flex-direction: column; gap: 18px; }
    .public-site .home-section-heading > p { flex-basis: auto; max-width: 620px; }
    .public-site .home-spheres { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 16px; }
    .public-site .home-news { gap: 20px; padding: 32px; }
    .public-site .public-reading { padding: 40px; }
}
@media (max-width: 767px) {
    .public-site { font-size: 17px; }
    .public-site .public-section { margin-top: 40px; margin-bottom: 40px; }
    .public-site .public-panel, .public-site .public-reading { padding: 28px 24px; }
    .public-site .public-card-grid { grid-template-columns: 1fr; }
    .public-site .home-hero .nk-header-table { min-height: 620px; padding-top: 82px; }
    .public-site .home-hero .nk-header-table-cell { padding: 42px 0; }
    .public-site .home-hero-intro { max-width: 450px; }
    .public-site .home-hero-description { font-size: 21px; }
    .public-site .home-hero .nk-title-sep { margin: 20px auto; }
    .public-site .home-news { grid-template-columns: 1fr; gap: 0; }
    .public-site .home-news-art { max-width: 190px; margin: 20px auto -10px; }
    .public-site .home-news .public-actions { gap: 12px 24px; }
    .public-site .home-featured-inline { padding: 0; grid-template-columns: 1fr; }
    .public-site .home-featured-portrait img { max-height: 340px; aspect-ratio: 4 / 3; }
    .public-site .home-featured-copy { padding: 30px 24px; }
    .public-site .public-page-hero .nk-header-table { min-height: 350px; }
    .public-site .public-page-hero .nk-header-table-cell { padding: 38px 0; }
    .public-site .public-notice { padding: 20px; }
    .public-site .public-reading section + section { padding-top: 28px; margin-top: 28px; }
}
@media (max-width: 420px) {
    .public-navigation .public-wordmark { font-size: 22px; }
    .public-site .home-hero .nk-title { font-size: 38px; }
    .public-site .public-actions { gap: 12px; }
    .public-site .home-hero-actions .public-button { flex: 1 1 100%; }
    .public-site .home-spheres { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 12px; }
    .public-site .home-sphere { font-size: 14px; }
    .public-site .public-panel, .public-site .public-reading { padding: 24px 18px; }
    .public-site .home-featured-inline { padding: 0; }
    .public-site .public-reading .public-button { width: 100%; }
    .public-site .home-development-note .public-status { display: block; }
}