/* Fitted iron, readable paper and a quiet register for the creature world. */
.echoes-standalone { margin:0; background:#101415; color:#e3dbc7; font:16px/1.65 Georgia,serif; }
.echoes-standalone * { box-sizing:border-box; }
.echoes-standalone a,.echoes-standalone button { color:inherit; }
.echoes-studio-header,.echoes-studio-footer { max-width:1450px; margin:auto; display:flex; justify-content:space-between; gap:20px; padding:22px 35px; border-bottom:1px solid #455050; font:12px/1.5 system-ui,sans-serif; letter-spacing:.12em; }
.echoes-studio-header>a { font-weight:750; text-decoration:none; }
.echoes-studio-header nav { display:flex; gap:24px; letter-spacing:.04em; }
.echoes-studio-footer { border-top:1px solid #455050; border-bottom:0; }
.echoes-skip { position:absolute; top:-100px; }
.echoes-skip:focus { top:10px; left:10px; z-index:999; background:#e7dac0; color:#151919; padding:10px; }
.echoes-folio { color:#ddd6c4; background:#182022; border:1px solid #697575; box-shadow:inset 0 1px #a4aaaa,inset 0 0 0 7px #202b2d,0 14px 60px #000a; font:16px/1.65 Georgia,serif; }
.echoes-standalone .echoes-folio { max-width:1380px; margin:30px auto; }
.echoes-folio h1,.echoes-folio h2,.echoes-folio h3 { color:#eee5cc; font-family:Georgia,serif; font-weight:400; line-height:1.1; margin:0 0 20px; text-wrap:balance; }
.echoes-folio h1 { font-size:clamp(36px,5vw,72px); letter-spacing:-.035em; }
.echoes-folio h2 { font-size:clamp(29px,3vw,44px); }
.echoes-folio h3 { font-size:25px; }
.echoes-folio p { margin:0 0 20px; }
.echoes-folio a,.echoes-folio button { text-decoration:none; }
.echoes-folio a:hover { text-decoration:underline; }
.echoes-folio button { cursor:pointer; }
.echoes-folio a:focus-visible,.echoes-folio button:focus-visible,.echoes-folio summary:focus-visible { outline:3px solid #d7be81; outline-offset:5px; }
.echoes-reel { background:#080d0f; padding:24px 28px 12px; border-bottom:2px solid #485352; }
.echoes-reel video { display:block; max-height:440px; width:100%; background:#070c0e; object-fit:contain; }
.echoes-reel p { font:11px/1.5 system-ui,sans-serif; letter-spacing:.12em; color:#a9b7af; margin:12px 0 0; }
.echoes-cover { display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); background:linear-gradient(110deg,#111919,#243233); border-bottom:5px solid #080c0d; }
.echoes-cover figure { margin:0; position:relative; background:#090d0e; overflow:hidden; }
.echoes-cover figure>img { width:100%; height:100%; max-height:630px; display:block; object-fit:cover; }
.echoes-cover figcaption { position:absolute; bottom:14px; left:18px; right:18px; padding:8px 12px; background:#0b1011dd; color:#ded9c9; font:11px/1.5 system-ui,sans-serif; }
.echoes-cover-type { padding:50px 42px 38px; align-self:center; }
.echoes-rubric { color:#b1bcad; font:11px/1.5 system-ui,sans-serif !important; letter-spacing:.16em; text-transform:uppercase; }
.echoes-subtitle { color:#b9c8c1; font:13px/1.5 system-ui,sans-serif; }
.echoes-line { font-size:24px; color:#d9caa7; }
.echoes-edition { border-top:1px solid #52635f; padding-top:16px; font:12px/1.5 system-ui,sans-serif; color:#bfc4b6; }
.echoes-actions { display:flex; flex-wrap:wrap; gap:10px; }
.echoes-actions a,.echoes-actions button,.echoes-download,[data-echoes-game-mount]>button { font:13px/1.4 system-ui,sans-serif; padding:14px 18px; color:#eee6d0; background:linear-gradient(#364446,#222c2d); border:1px solid #81908b; border-bottom-color:#05090a; border-right-color:#0b0f0f; box-shadow:inset 0 1px #a0aaa766,0 2px #0008; }
.echoes-actions a:first-child,.echoes-actions button:first-child,.echoes-download { color:#221d16; background:linear-gradient(#dccb9c,#af9969); border-top-color:#f1e4c4; border-left-color:#d5c595; }
.echoes-actions small,.echoes-download small { display:block; font-size:11px; margin-top:4px; letter-spacing:0; }
.echoes-opening,.echoes-origin { padding:38px 50px; background:#d3c6a7; color:#2b2b22; border-top:1px solid #f3e7c4; border-bottom:2px solid #0b1314; }
.echoes-opening .echoes-rubric,.echoes-origin .echoes-rubric { color:#4c5c4e; }
.echoes-lede { font-size:clamp(20px,2vw,28px); max-width:990px; line-height:1.6; margin-bottom:0!important; }
.echoes-world-spread { display:grid; grid-template-columns:.9fr 1.1fr; gap:40px; padding:45px 45px; background:linear-gradient(#253033,#172023); border-bottom:1px solid #65716b; }
.echoes-world-spread>div { align-self:center; }
.echoes-world-spread figure { margin:0; padding:10px; background:#080d0f; border:1px solid #63706b; box-shadow:inset 0 0 0 4px #2a3837; }
.echoes-world-spread figure img { display:block; width:100%; }
.echoes-world-spread figcaption,.echoes-world-spread small { color:#aebcb3; font:12px/1.55 system-ui,sans-serif; display:block; }
.echoes-world-spread figcaption { padding:14px 8px 4px; }
.echoes-features { display:grid; grid-template-columns:repeat(3,1fr); gap:0; padding:28px 30px; background:#131b1d; }
.echoes-features article { padding:20px; border-right:1px solid #455451; }
.echoes-features article:last-child { border:0; }
.echoes-features article p:last-child { margin-bottom:0; color:#bec5b9; }
.echoes-creatures,.echoes-player { padding:36px 40px; border-top:3px solid #070c0d; border-bottom:1px solid #66776e; background:#25312f; }
.echoes-section-head { display:flex; justify-content:space-between; gap:24px; align-items:center; margin-bottom:12px; }
.echoes-section-head h2 { margin-bottom:0; }
.echoes-section-head>a { flex:none; font:12px/1.5 system-ui,sans-serif; color:#dccb9c; border-bottom:1px solid #897950; }
.echoes-archive-tally { display:flex; flex-wrap:wrap; gap:22px; border-top:1px solid #687868; border-bottom:1px solid #687868; padding:15px 0; margin:23px 0; font:12px/1.5 system-ui,sans-serif; color:#c1c9b6; }
.echoes-archive-tally strong { font:30px/1 Georgia,serif; color:#eadbbb; margin-right:7px; }
.echoes-codex-frame { width:100%; height:760px; background:#111b1d; border:1px solid #64786d; }
.echoes-game-frame { width:100%; height:900px; border:1px solid #77877d; background:#121a1c; }
.echoes-player { background:#141e20; }
.echoes-release { display:grid; grid-template-columns:1.15fr .85fr; gap:40px; padding:40px 45px; background:#172021; }
.echoes-release aside { padding:23px; align-self:start; background:#232d2e; border:1px solid #67716a; box-shadow:inset 0 0 0 5px #101b1c; }
.echoes-download { display:block; text-align:center; }
.echoes-release details { margin-top:20px; font:13px/1.65 system-ui,sans-serif; }
.echoes-release summary { cursor:pointer; color:#d5c9a7; }
.echoes-release details p { margin-top:15px; }
.echoes-small { font:12px/1.7 system-ui,sans-serif!important; color:#bac4b7; }
.echoes-origin .echoes-small { color:#4d5040; margin-bottom:0; }
.echoes-related { padding:25px 40px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px; color:#d9c697; font:13px/1.5 system-ui,sans-serif; }
@media(max-width:900px) { .echoes-cover,.echoes-world-spread,.echoes-release { grid-template-columns:1fr; } .echoes-cover figure { max-height:440px; } .echoes-cover-type { padding:30px; } .echoes-features { grid-template-columns:1fr; } .echoes-features article { border-right:0; border-bottom:1px solid #455451; } .echoes-section-head { align-items:start; flex-direction:column; } .echoes-opening,.echoes-origin,.echoes-world-spread,.echoes-creatures,.echoes-player,.echoes-release { padding:28px 24px; } .echoes-studio-header { padding:18px; } }
@media(max-width:540px) { .echoes-standalone .echoes-folio { margin:15px 10px; } .echoes-studio-header { display:block; } .echoes-studio-header nav { margin-top:15px; flex-wrap:wrap; } .echoes-cover-type { padding:25px 20px; } .echoes-actions a,.echoes-actions button { width:100%; } .echoes-archive-tally { gap:14px; } .echoes-codex-frame { height:680px; } .echoes-game-frame { height:1050px; } .echoes-studio-footer { padding:18px; flex-direction:column; } }

.echoes-cover:has(img[src*="native-cover"]) figure>img { object-fit:contain; padding:30px; image-rendering:pixelated; background:radial-gradient(ellipse at 45% 40%,#334245,#11191c 65%); }

/* Three distinct films on each Echoes folio. */
.echoes-film-library video{display:block;width:100%;aspect-ratio:16/9;max-height:650px;background:#090c0d;object-fit:contain}
.echoes-film-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:15px 22px;background:#182021;border-top:1px solid #6f6a56}
.echoes-film-choices button{display:flex;align-items:center;gap:13px;color:#d9cfb5;background:#222b29;border:1px solid #7f7150;padding:9px;text-align:left;font:16px/1.3 Georgia,serif;cursor:pointer;min-width:0}
.echoes-film-choices button[aria-pressed=true]{background:#35392d;border-color:#c4aa70;box-shadow:inset 0 0 0 1px #c4aa7044}
.echoes-film-choices button:focus-visible{outline:2px solid #dfce95;outline-offset:3px}
.echoes-film-choices img{width:91px;height:55px;object-fit:cover;border:1px solid #656755}
.echoes-film-choices span{display:block;min-width:0}.echoes-film-choices small{display:block;color:#aeb09d;font:10px/1.5 system-ui,sans-serif;margin-top:4px}
.echoes-film-library [data-echoes-film-caption]{padding:0 25px 15px;font:12px/1.6 system-ui,sans-serif;color:#b9b69f}
@media(max-width:700px){.echoes-film-choices{gap:7px;padding:12px;grid-template-columns:1fr}.echoes-film-choices button{font-size:16px}.echoes-film-choices img{width:86px;height:48px}.echoes-film-library [data-echoes-film-caption]{padding:0 15px 13px;font-size:11px}}