/* Everything is scoped to the attached banner. No global theme reset. */
.for-above.et-orbit-above {
    background: #03080f;
}
.et-orbit-above .for-news {
    --thyuu--color-font: 210 25% 90%;
    --thyuu--main-color: 210 25% 90%;
    --thyuu--subs-color: 210 18% 72%;
    color: #e4ebf3;
    background: #03080f;
    color-scheme: dark;
}
.et-orbit-above .for-news .post {
    --color-font: 210 25% 90%;
    color: #e4ebf3;
    background: #ffffff0b;
    border: 1px solid #b9d4ee14;
}
.et-orbit-above .for-news .post:hover { background: #ffffff12; }
.et-orbit-above .for-news :is(.post-meta, time, .excerpt) { color: #b4c3d2; }
.et-orbit-above .for-news :is(.switch-nav, .more-link) { background: #14202e; color: #d7e5f2; }
.for-focus.et-orbit-focus {
    /* Thyuu switches this to static on wide screens; otherwise figure sizes to
       .for-above, including all of the news cards beneath the first screen. */
    position: relative;
}
.for-focus .post.for-first.et-orbit-host {
    isolation: isolate;
    --back-color: #03080f;
}
.for-focus .post.for-first.et-orbit-host > figure {
    --mask-back: linear-gradient(#03080f70, #0000 8rem, #0000 48%, #03080fee 100%);
    inset: 0;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    margin: 0;
    overflow: hidden;
    pointer-events: none;
}
.et-orbit {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background: #03080f;
    pointer-events: auto;
    color: #f0f4f5;
    font: 12px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
    contain: layout paint;
}
.et-orbit__poster,
.et-orbit__canvas,
.et-orbit__shade {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.et-orbit__poster {
    background-size: cover;
    background-position: center;
    transition: opacity 700ms ease;
}
.et-orbit__canvas {
    display: block;
    opacity: 0;
    cursor: crosshair;
    touch-action: pan-y;
    transition: opacity 900ms ease;
}
.et-orbit__canvas:active { cursor: crosshair; }
.et-orbit__controls button.is-boosting { background:#1b566d; border-color:#87dcff; box-shadow:0 0 15px #46c1f550; }
.et-orbit__canvas:focus-visible { outline: 1px solid #9ee9f1; outline-offset: -5px; }
.et-orbit[data-state="ready"] .et-orbit__canvas { opacity: 1; }
.et-orbit[data-state="ready"] .et-orbit__poster { opacity: 0; }
.et-orbit__shade {
    pointer-events: none;
    background: linear-gradient(180deg, #02050d55 0%, transparent 22%, transparent 55%, #02050d88 100%);
}
.et-orbit-host > .et-orbit__controls {
    position: absolute;
    z-index: 5;
    right: clamp(18px, 3vw, 54px);
    top: 94px;
    display: flex;
    align-items: center;
    gap: 6px;
    width: auto;
    color: #c2d3dc;
    font: 11px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
    letter-spacing: .08em;
}
.et-orbit__hint { margin-right: 10px; opacity: .65; }
.et-orbit__controls button {
    appearance: none;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    min-width: 34px;
    padding: 0;
    margin: 0;
    border: 1px solid #c1eafa30;
    border-radius: 50%;
    color: #ddf3fa;
    background: #0c1d2d88;
    backdrop-filter: blur(8px);
    cursor: pointer;
    transition: background .2s, border-color .2s;
}
.et-orbit__controls button:hover { background: #254d6088; border-color: #a5ecff90; }
.et-orbit__controls button:focus-visible { outline: 2px solid #a5ecff; outline-offset: 3px; }
.et-orbit__controls button:disabled { opacity: .3; cursor: default; }
.et-orbit__controls button svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.et-orbit__controls[hidden] { display: none !important; }
.et-orbit-host > hgroup { z-index: 2; pointer-events: none; }
/* Keep the site title in negative space, clear of the lettering on the terrain. */
.for-focus .post.for-first.et-orbit-host > hgroup {
    grid-area: auto;
    position: absolute;
    inset: auto auto 8% 9%;
    width: 82%;
    height: auto;
    max-width: none;
    margin: 0;
    align-items: flex-start;
    text-align: left;
}
@media (min-width: 761px) and (min-aspect-ratio: 21/20) {
    .for-focus .post.for-first.et-orbit-host > hgroup {
        inset: max(100px, 13%) auto auto 5.5%;
        width: 40%;
        max-width: 640px;
    }
}
.et-orbit-host > hgroup :is(a, button, input) { pointer-events: auto; }
.et-orbit-host.et-orbit-ready > figure > :not(.et-orbit) { visibility: hidden; }
.for-focus .post.for-first.et-orbit-host > figure::after { pointer-events: none; }
@media (max-width: 760px), (pointer: coarse) {
    .et-orbit-host > .et-orbit__controls { top: 78px; right: 16px; gap: 7px; }
    .et-orbit__hint { display: none; }
    .et-orbit__controls button { width: 44px; height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
    .et-orbit__canvas, .et-orbit__poster { transition: none; }
}
@media (max-height: 650px) and (min-aspect-ratio: 6/5) {
    .for-focus .post.for-first.et-orbit-host > hgroup { top: 76px; gap: .6em; }
    .for-focus .post.for-first.et-orbit-host > hgroup h1 { font-size: clamp(26px, 3.5vw, 40px); }
    .et-orbit-host > .et-orbit__controls { top: 76px; }
}