html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    background: #05070a;
    overflow: hidden;
    font-family: 'Consolas', 'Courier New', monospace;
}

#app { height: 100%; }
.page, .page main { height: 100%; }

/* ---- entry gate ---- */
.fes-gate {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(ellipse at 50% 30%, #232a14 0%, #05070a 75%);
    color: #d8c26a;
}

.fes-gate-inner { text-align: center; max-width: 860px; padding: 0 20px; }

.fes-title {
    font-size: 4.6em;
    letter-spacing: 0.30em;
    margin: 0 0 0.15em 0;
    color: #d8c26a;
    text-shadow: 0 0 22px #7a6a20;
}

.fes-sub {
    font-size: 0.95em;
    letter-spacing: 0.28em;
    color: #8ca060;
    margin-bottom: 2.0em;
}

.fes-play {
    font-family: inherit;
    font-size: 1.5em;
    letter-spacing: 0.25em;
    line-height: 1.5;
    padding: 0.75em 2.2em;
    background: #16200e;
    color: #e6d47e;
    border: 2px solid #d8c26a;
    border-radius: 6px;
    cursor: pointer;
    text-shadow: 0 0 10px #7a6a20;
    box-shadow: 0 0 24px rgba(216, 194, 106, 0.25);
    transition: all 0.15s;
}
.fes-play:hover { background: #24340f; box-shadow: 0 0 40px rgba(216, 194, 106, 0.5); }

.fes-loadwrap { margin: 1.4em auto 0 auto; width: 420px; max-width: 84vw; }
.fes-loadlabel { font-size: 0.85em; letter-spacing: 0.12em; color: #b8c890; margin-bottom: 0.7em; }
.fes-loadbar {
    height: 14px;
    border: 1px solid #8ca060;
    border-radius: 4px;
    background: #0b0f08;
    overflow: hidden;
}
.fes-loadfill { height: 100%; background: linear-gradient(90deg, #6a7a30, #d8c26a); transition: width 0.15s; }
.fes-loadsub { margin-top: 0.6em; font-size: 0.7em; color: #5e6e46; letter-spacing: 0.1em; }

.fes-plays { margin-top: 2.0em; font-size: 1.0em; letter-spacing: 0.22em; color: #e6d47e; }

.fes-controls {
    margin-top: 2.2em;
    font-size: 0.75em;
    line-height: 1.9;
    letter-spacing: 0.06em;
    color: #7e8e62;
}

.fes-credit { margin-top: 2.2em; font-size: 0.68em; letter-spacing: 0.3em; color: #55603e; }

.fes-dots { animation: fesblink 1.2s steps(4) infinite; }
@keyframes fesblink { 0% { opacity: 0.2; } 50% { opacity: 1; } 100% { opacity: 0.2; } }

/* ---- game canvas ---- */
.fes-holder {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000;
}
#theCanvas {
    max-width: 100%;
    max-height: 100%;
}

#blazor-error-ui { display: none; }