/*
 * Adventure Engine shared visual system.
 * Landing page is the visual reference: translucent noir glass, warm gold accents,
 * readable typography and restrained borders. Loaded last so page-specific layouts
 * remain intact while all screens share the same visual language.
 */

:root{
    --er-ui-text:#f0eee9;
    --er-ui-text-strong:#f7f5f0;
    --er-ui-text-secondary:#b5bec8;
    --er-ui-text-muted:#929eaa;
    --er-ui-gold:#d5a74a;
    --er-ui-gold-soft:#dfc481;
    --er-ui-gold-bright:#f1d58d;
    --er-ui-line:rgba(255,255,255,.085);
    --er-ui-line-soft:rgba(255,255,255,.06);
    --er-ui-line-gold:rgba(218,172,78,.20);
    --er-ui-line-gold-strong:rgba(218,172,78,.34);
    --er-ui-glass:
        radial-gradient(circle at 10% 0,rgba(214,166,70,.045),transparent 38%),
        linear-gradient(145deg,rgba(13,17,23,.64),rgba(6,9,13,.54));
    --er-ui-glass-strong:
        radial-gradient(circle at 10% 0,rgba(214,166,70,.05),transparent 36%),
        linear-gradient(145deg,rgba(12,16,22,.74),rgba(5,8,11,.66));
    --er-ui-glass-subtle:rgba(5,8,11,.46);
    --er-ui-input:linear-gradient(180deg,rgba(9,13,18,.78),rgba(6,9,13,.72));
    --er-ui-shadow:0 18px 54px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.014);
    --er-ui-shadow-strong:0 28px 90px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.018);
    --er-ui-radius:18px;
    --er-ui-radius-lg:22px;
    --er-ui-blur:blur(7px) saturate(108%);
    --er-ui-blur-strong:blur(10px) saturate(110%);
}

html,
body{
    color:var(--er-ui-text);
    font-size:16px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}

body:not(.er-home-page){
    --text:var(--er-ui-text);
    --muted:var(--er-ui-text-muted);
    --gold:var(--er-ui-gold);
    --gold-soft:var(--er-ui-gold-soft);
    --line:var(--er-ui-line);
}

/* Page rhythm and hero typography */
body:not(.er-home-page) :where(
    .er-setup,
    .er-account-shell,
    .er-pricing-shell,
    .er-auth-shell,
    .er-library,
    .er-character-library,
    .er-character-editor,
    .er-ai-config
){
    padding-top:clamp(30px,4vw,54px);
}

body:not(.er-home-page) :where(
    .er-hero,
    .er-auth-intro,
    .er-account-head,
    .er-pricing-head,
    .er-library__head,
    .er-character-library__hero,
    .er-character-editor__hero,
    .er-ai-config__hero
) h1{
    color:var(--er-ui-text-strong)!important;
    font-weight:780;
    text-wrap:balance;
}

body:not(.er-home-page) :where(
    .er-hero,
    .er-auth-intro,
    .er-account-head,
    .er-pricing-head,
    .er-library__head,
    .er-character-library__hero,
    .er-character-editor__hero,
    .er-ai-config__hero
) p{
    color:var(--er-ui-text-secondary)!important;
    font-size:clamp(.98rem,1.15vw,1.08rem)!important;
    line-height:1.66!important;
}

body:not(.er-home-page) :where(.er-kicker,.er-character-library__kicker,.er-ai-config__hero small){
    color:var(--er-ui-gold-soft)!important;
    font-size:.72rem!important;
    font-weight:900!important;
    letter-spacing:.17em!important;
    text-transform:uppercase;
}

/* Main glass surfaces */
body:not(.er-home-page) :where(
    .er-card,
    .er-auth-intro,
    .er-auth-card,
    .er-account-card,
    .er-pricing-card,
    .er-billing-hero,
    .er-game-card,
    .er-rail-card,
    .er-chat-panel,
    .er-launchbar,
    .er-admin-bar,
    .er-library__imagination,
    .er-library__head,
    .er-library__tabs,
    .er-empty,
    .er-character-library__hero,
    .er-character-editor__hero,
    .er-character-library__empty,
    .er-character-card,
    .er-character-editor__section,
    .er-character-editor__footer,
    .er-audio-popover,
    .er-drawer,
    .er-ai-config__card,
    .er-ai-config__footer,
    .er-npc-live,
    .er-narrative-style-field,
    .er-live-admin
){
    border-color:var(--er-ui-line-gold)!important;
    background:var(--er-ui-glass)!important;
    box-shadow:var(--er-ui-shadow)!important;
    -webkit-backdrop-filter:var(--er-ui-blur)!important;
    backdrop-filter:var(--er-ui-blur)!important;
}

body:not(.er-home-page) :where(
    .er-library__head,
    .er-character-library__hero,
    .er-character-editor__hero,
    .er-billing-hero,
    .er-ai-config__footer,
    .er-launchbar
){
    background:var(--er-ui-glass-strong)!important;
    box-shadow:var(--er-ui-shadow-strong)!important;
    -webkit-backdrop-filter:var(--er-ui-blur-strong)!important;
    backdrop-filter:var(--er-ui-blur-strong)!important;
}

body:not(.er-home-page) :where(
    .er-card,
    .er-auth-intro,
    .er-auth-card,
    .er-account-card,
    .er-pricing-card,
    .er-game-card,
    .er-rail-card,
    .er-character-card,
    .er-character-editor__section,
    .er-ai-config__card
){
    border-radius:var(--er-ui-radius-lg);
}

body:not(.er-home-page) :where(
    .er-engine-option,
    .er-participant-editor,
    .er-account-fact,
    .er-provider-row,
    .er-cost-strip span,
    .er-game-card__fact,
    .er-character-stat-grid>span,
    .er-ai-level-control
){
    border-color:var(--er-ui-line)!important;
    background:var(--er-ui-glass-subtle)!important;
    -webkit-backdrop-filter:blur(6px) saturate(106%);
    backdrop-filter:blur(6px) saturate(106%);
}

body:not(.er-home-page) :where(
    .er-game-header,
    .er-chat-panel>header,
    .er-composer,
    .er-audio-popover,
    .er-drawer
){
    border-color:var(--er-ui-line-gold)!important;
    background:var(--er-ui-glass-strong)!important;
    -webkit-backdrop-filter:var(--er-ui-blur-strong)!important;
    backdrop-filter:var(--er-ui-blur-strong)!important;
}

body:not(.er-home-page) :where(
    .er-card,
    .er-account-card,
    .er-pricing-card,
    .er-game-card,
    .er-character-card,
    .er-ai-config__card
):hover{
    border-color:var(--er-ui-line-gold-strong)!important;
}

/* Typography */
body:not(.er-home-page) :where(
    .er-card,
    .er-auth-card,
    .er-account-card,
    .er-pricing-card,
    .er-game-card,
    .er-character-card,
    .er-character-editor__section,
    .er-ai-config__card,
    .er-rail-card
) :where(p,li){
    color:var(--er-ui-text-secondary);
    font-size:.91rem;
    line-height:1.58;
}

body:not(.er-home-page) :where(
    .er-card,
    .er-auth-card,
    .er-account-card,
    .er-pricing-card,
    .er-game-card,
    .er-character-card,
    .er-character-editor__section,
    .er-ai-config__card,
    .er-rail-card
) :where(h2,h3,strong){
    color:var(--er-ui-text-strong);
}

body:not(.er-home-page) :where(
    .er-section-head h2,
    .er-account-card__head h2,
    .er-character-editor__section-head h2,
    .er-ai-config__group-head h2
){
    font-size:1.12rem!important;
    line-height:1.25;
}

body:not(.er-home-page) :where(
    .er-section-head small,
    .er-model-note,
    .er-muted,
    .er-character-card__head small,
    .er-character-editor__section-head p,
    .er-ai-config__group-head span,
    .er-ai-model-description,
    .er-ai-level-note,
    .er-scenario-ai-status
){
    color:var(--er-ui-text-muted)!important;
    font-size:.78rem!important;
    line-height:1.5!important;
}

body:not(.er-home-page) :where(
    .er-label,
    .er-field>span,
    .er-character-form-grid label,
    .er-character-stats-editor label,
    .er-ai-game-field>span,
    .er-style-preset label,
    .er-audio-popover label
){
    color:#c6cdd4!important;
    font-size:.79rem!important;
    font-weight:800!important;
    line-height:1.35;
}

body:not(.er-home-page) :where(
    .er-field small,
    .er-ai-game-field small,
    .er-style-help,
    .er-audio-note,
    .er-character-form-grid label>span small
){
    color:var(--er-ui-text-muted)!important;
    font-size:.75rem!important;
    line-height:1.5!important;
}

body:not(.er-home-page) :where(.er-pricing-card__description,.er-pricing-features li){
    font-size:.87rem!important;
    line-height:1.55!important;
}

body:not(.er-home-page) :where(.er-account-fact strong,.er-provider-row strong){font-size:.91rem!important}
body:not(.er-home-page) :where(.er-account-fact small,.er-provider-row small){font-size:.72rem!important;color:var(--er-ui-text-muted)!important}

/* Gameplay information stays readable instead of collapsing to micro-text. */
.er-game :where(.er-rail-card p,.er-world-presence,.er-world-empty){font-size:.94rem!important;line-height:1.62!important}
.er-game :where(.er-player-state strong,.er-world-location__head strong){font-size:.92rem!important}
.er-game :where(.er-player-state small,.er-world-location__head small,.er-world-pin span){font-size:.78rem!important;line-height:1.45!important}
.er-game .er-rail-card>span{font-size:.74rem!important;letter-spacing:.13em!important}
.er-game .er-story-line{font-size:.96rem!important;line-height:1.72!important}
.er-game .er-npc-live__title strong{font-size:.9rem!important}
.er-game .er-npc-live__action{font-size:.84rem!important;line-height:1.5!important}

/* Inputs */
body:not(.er-home-page) :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select,
    textarea
){
    border-color:rgba(255,255,255,.11)!important;
    background:var(--er-ui-input)!important;
    color:var(--er-ui-text)!important;
    font-size:.9rem!important;
    line-height:1.45;
    box-shadow:inset 0 1px 5px rgba(0,0,0,.24)!important;
}

body:not(.er-home-page) :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select
){
    min-height:44px;
}

body:not(.er-home-page) :where(input,select,textarea)::placeholder{color:#737d88;opacity:1}

body:not(.er-home-page) :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select,
    textarea
):focus{
    border-color:rgba(219,173,79,.58)!important;
    outline:none!important;
    box-shadow:0 0 0 3px rgba(210,162,64,.09),inset 0 1px 5px rgba(0,0,0,.22)!important;
}

/* Buttons and links */
body:not(.er-home-page) :where(
    .er-btn,
    .er-icon-btn,
    .er-action-secondary,
    .er-external button,
    .er-audio-button,
    .er-npc-live__tools button,
    .er-character-photo-tools button,
    .er-live-admin button
){
    border:1px solid rgba(255,255,255,.10)!important;
    background:linear-gradient(180deg,rgba(24,30,38,.78),rgba(12,16,21,.76))!important;
    color:#e4e8ec!important;
    font-size:.82rem!important;
    font-weight:800!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}

body:not(.er-home-page) :where(
    .er-btn,
    .er-action-secondary,
    .er-external button,
    .er-audio-button,
    .er-npc-live__tools button,
    .er-character-photo-tools button,
    .er-live-admin button
):hover{
    border-color:rgba(218,172,78,.34)!important;
    color:#f4dfb0!important;
}

body:not(.er-home-page) :where(
    .er-btn--launch,
    .er-btn--send,
    .er-auth-submit,
    .er-action-primary,
    .er-ai-config__footer button
){
    border-color:rgba(241,197,101,.62)!important;
    background:linear-gradient(135deg,#d5b56e,#a47d39)!important;
    color:#130f08!important;
    font-size:.82rem!important;
    font-weight:900!important;
    letter-spacing:.045em;
    box-shadow:0 10px 28px rgba(166,116,35,.15),inset 0 1px 0 rgba(255,255,255,.18)!important;
}

body:not(.er-home-page) a:not(.er-site-header__brand):not(.er-site-header__link):not(.er-site-header__account){
    text-underline-offset:3px;
}

/* Tabs, badges and notices */
body:not(.er-home-page) :where(
    .er-character-library__tabs a,
    .er-library__tabs a,
    .er-pricing-card__badge,
    .er-report-links a
){
    border-color:var(--er-ui-line)!important;
    background:rgba(5,8,11,.38)!important;
    color:#b7c0ca!important;
    font-size:.78rem!important;
}

body:not(.er-home-page) :where(
    .er-character-library__tabs a.is-active,
    .er-library__tabs a.is-active,
    .er-pricing-card__badge
){
    border-color:var(--er-ui-line-gold-strong)!important;
    background:rgba(201,164,95,.09)!important;
    color:#efd9aa!important;
}

body:not(.er-home-page) :where(
    .er-alert,
    .er-status-banner,
    .er-auth-note,
    .er-ai-config__notice,
    .er-ai-game-note
){
    border-radius:13px!important;
    -webkit-backdrop-filter:blur(7px);
    backdrop-filter:blur(7px);
    font-size:.84rem!important;
    line-height:1.55!important;
}

body:not(.er-home-page) :where(.er-auth-note,.er-ai-config__notice,.er-ai-game-note){
    border-color:var(--er-ui-line-gold)!important;
    background:rgba(201,164,95,.065)!important;
    color:#d8c79d!important;
}

/* AI configuration uses local inline CSS, so these explicit overrides keep it aligned. */
body:not(.er-home-page) .er-ai-config__card{padding:20px!important}
body:not(.er-home-page) .er-ai-config__card h3{
    margin:0 0 .45rem!important;
    color:var(--er-ui-text-strong)!important;
    font-size:1.08rem!important;
}
body:not(.er-home-page) .er-ai-config__card>p{
    color:var(--er-ui-text-secondary)!important;
    font-size:.88rem!important;
    line-height:1.55!important;
}
body:not(.er-home-page) .er-ai-level-control{padding:.9rem 1rem .8rem!important}
body:not(.er-home-page) .er-ai-level-head{font-size:.86rem!important;color:#b5bec8!important}
body:not(.er-home-page) .er-ai-level-head strong{font-size:.94rem!important;color:#f2eee5!important}
body:not(.er-home-page) .er-ai-level-cost{font-size:.88rem!important;color:#b8c0c9!important}

/* Character library */
body:not(.er-home-page) .er-character-card__head h2{
    color:#f2ead8!important;
    font-size:1.48rem!important;
}
body:not(.er-home-page) .er-character-card__profile p{font-size:.86rem!important;line-height:1.5!important}
body:not(.er-home-page) .er-character-card__profile strong{color:#d3d9df!important}
body:not(.er-home-page) .er-character-card__profile span{color:#a4aeb8!important}
body:not(.er-home-page) .er-character-stat-grid small{font-size:.66rem!important;color:#8995a1!important}
body:not(.er-home-page) .er-character-stat-grid strong{font-size:1rem!important;color:#ead8ad!important}

/* Chat and game */
body:not(.er-home-page) .er-chat-panel{border-color:rgba(218,172,78,.17)!important}
body:not(.er-home-page) .er-chat-log{
    background:linear-gradient(180deg,rgba(4,7,10,.20),rgba(4,7,10,.08))!important;
}
body:not(.er-home-page) .er-msg{
    border-color:rgba(255,255,255,.075)!important;
    background:rgba(13,18,24,.58)!important;
    -webkit-backdrop-filter:blur(5px);
    backdrop-filter:blur(5px);
}
body:not(.er-home-page) .er-msg--speech{border-color:rgba(218,172,78,.16)!important;background:rgba(20,20,17,.58)!important}
body:not(.er-home-page) .er-msg--private{border-color:rgba(218,172,78,.28)!important;background:rgba(34,28,18,.58)!important}
body:not(.er-home-page) .er-msg__meta{font-size:.72rem!important;color:#929eaa!important}
body:not(.er-home-page) .er-msg p{font-size:.92rem;line-height:1.58}

@media(max-width:900px){
    html,body{font-size:15.5px}

    body:not(.er-home-page) :where(
        .er-setup,
        .er-account-shell,
        .er-pricing-shell,
        .er-auth-shell,
        .er-library,
        .er-character-library,
        .er-character-editor,
        .er-ai-config
    ){
        padding-top:24px;
    }

    body:not(.er-home-page) :where(
        .er-card,
        .er-auth-intro,
        .er-auth-card,
        .er-account-card,
        .er-pricing-card,
        .er-game-card,
        .er-character-card,
        .er-character-editor__section,
        .er-ai-config__card
    ){
        border-radius:18px;
    }

    .er-game .er-story-line{font-size:.92rem!important;line-height:1.68!important}
}

@media(max-width:520px){
    html,body{font-size:15px}

    body:not(.er-home-page) :where(
        .er-card,
        .er-auth-card,
        .er-account-card,
        .er-pricing-card,
        .er-character-card,
        .er-character-editor__section,
        .er-ai-config__card
    ){
        padding:18px!important;
        border-radius:17px;
    }

    body:not(.er-home-page) :where(.er-section-head small,.er-ai-config__group-head span){font-size:.74rem!important}
    .er-game .er-story-line{font-size:.89rem!important;line-height:1.64!important}
}

@media(prefers-reduced-transparency:reduce){
    body:not(.er-home-page) :where(
        .er-card,
        .er-auth-intro,
        .er-auth-card,
        .er-account-card,
        .er-pricing-card,
        .er-billing-hero,
        .er-game-card,
        .er-rail-card,
        .er-chat-panel,
        .er-launchbar,
        .er-library__head,
        .er-character-card,
        .er-character-editor__section,
        .er-ai-config__card,
        .er-ai-config__footer
    ){
        -webkit-backdrop-filter:none!important;
        backdrop-filter:none!important;
        background:linear-gradient(145deg,rgba(13,17,23,.94),rgba(6,9,13,.93))!important;
    }
}