/* Website v2: original selection art, readable archive cards, and a focused map workspace. */
:root { --bg:#1c1e22; --panel:#2b2d32; --panel-soft:#25272c; --line:#505158; --line-soft:#3b3d43; --text:#efeee9; --muted:#bebdc0; --faint:#a1a0a6; --gold:#e7c17c; --gold-hover:#f6d596; --green:#94bea0; }
body { background:radial-gradient(ellipse at 90% 0,#75707822,transparent 680px),radial-gradient(ellipse at 5% 15%,#77757c0e,transparent 700px),var(--bg); }
.site-header { height:72px; max-width:1536px; padding-inline:40px; gap:60px; }
.brand { font-size:18px; }
.brand small { color:#a3ada7; }
.site-header nav a { font-size:14px; }
.page { max-width:1536px; padding-inline:40px; }
.hall-hero { isolation:isolate; margin-top:24px; min-height:242px; padding:28px 32px; border:1px solid #68716a66; border-radius:12px; background:#1c252a; box-shadow:0 12px 36px #0003; }
.hero-scene { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:70% 40%; z-index:-3; }
.hall-hero::before { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,#111b21fa 0%,#142026ed 30%,#15212783 58%,#1420260a 85%),linear-gradient(0deg,#142026a0,transparent 65%); }
/* Layered original scene: static reading plane, moving light and atmosphere behind it. */
.hall-hero { min-height:260px; background:radial-gradient(ellipse at 18% 30%,#77717b26,transparent 65%),#292b31; border-color:#a29ba45c; box-shadow:0 18px 45px #0005,inset 0 1px #ebd5a018; transition:border-color .3s,box-shadow .3s; }
.hero-scene { left:auto; right:-2%; top:-8%; width:78%; height:116%; object-position:70% 38%; filter:brightness(1.1) saturate(1); transform-origin:75% 40%; translate:var(--hero-pan-x,0px) var(--hero-pan-y,0px); transition:translate .65s cubic-bezier(.2,.7,.2,1); animation:hero-scene-float 14s ease-in-out infinite; }
.hall-hero::before { background:linear-gradient(90deg,#292b31 0%,#292b31f7 27%,#292b31c4 43%,#292b3145 65%,#292b310a 88%),linear-gradient(0deg,#25272dbd,transparent 66%); }
.hall-hero::after { content:""; position:absolute; inset:-4%; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at 82% 3%,#ffbd6155,transparent 42%),radial-gradient(ellipse at 75% 94%,#67d2cf2b,transparent 44%); opacity:.5; animation:hero-light-breathe 6s ease-in-out infinite; }
.hero-atmosphere { position:absolute; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
.hero-mist { position:absolute; inset:45% -5% -35% 38%; background:radial-gradient(ellipse,#83c1be20,transparent 65%); opacity:.6; animation:hero-mist-drift 18s ease-in-out infinite; }
.hero-fireflies i { position:absolute; left:var(--spark-x); top:var(--spark-y); width:3px; height:3px; border-radius:50%; background:var(--spark-color); box-shadow:0 0 7px 2px color-mix(in srgb,var(--spark-color) 45%,transparent); animation:hero-spark-rise var(--spark-duration) ease-in-out var(--spark-delay) infinite; opacity:0; }
.hero-fireflies i:nth-child(3n) { width:2px; height:2px; }
.hero-pointer-light { position:absolute; left:0; top:0; width:380px; height:300px; border-radius:50%; background:radial-gradient(ellipse,#c1dec619,transparent 65%); translate:calc(var(--hero-light-x,80%) - 190px) calc(var(--hero-light-y,40%) - 150px); opacity:0; transition:opacity .6s; }
.hall-hero[data-pointer=active] .hero-pointer-light { opacity:1; }
.hall-hero:focus-within { border-color:#e4c785a0; box-shadow:0 20px 50px #0006,0 0 28px #d8b67612,inset 0 1px #f5dc9f2b; }
@media(hover:hover) and (pointer:fine) { .hall-hero:hover { border-color:#c4bf919e; box-shadow:0 20px 50px #0006,0 0 32px #7bc6c412,inset 0 1px #f5dc9f2b; } }
@keyframes hero-scene-float { 0%,100% { transform:scale(1.035) translate3d(0,3px,0); } 50% { transform:scale(1.06) translate3d(-6px,-5px,0); } }
@keyframes hero-light-breathe { 0%,100% { opacity:.38; } 50% { opacity:.82; } }
@keyframes hero-mist-drift { 0%,100% { transform:translate3d(-15px,6px,0) scale(1); } 50% { transform:translate3d(22px,-8px,0) scale(1.07); } }
@keyframes hero-spark-rise { 0%,100% { opacity:0; transform:translate3d(0,12px,0); } 25% { opacity:.75; } 70% { opacity:.35; } 90% { opacity:0; transform:translate3d(10px,-25px,0); } }
.hall-hero[data-motion=paused] .hero-scene,.hall-hero[data-motion=paused] .hero-mist,.hall-hero[data-motion=paused] .hero-fireflies i,.hall-hero[data-motion=paused]::after { animation-play-state:paused; }
.hero-content { position:relative; max-width:610px; }
.hero-content .eyebrow { font-size:10px; color:#e6c98f; letter-spacing:1.7px; }
.hall-hero h1 { font-size:clamp(30px,3vw,44px); line-height:1.35; margin-top:12px; letter-spacing:1px; text-shadow:0 2px 18px #0008; }
.hall-hero h1 span { color:#f4d49d; }
.hero-description { color:#c2cec9; font-size:14px; margin-top:10px; }
.hero-content .search-box { margin-top:22px; background:#101a20de; border-color:#84928a80; box-shadow:0 5px 18px #0003; backdrop-filter:blur(8px); }
.search-box input { font-size:14px; }
.search-box input::placeholder { color:#a1afa9; }
.search-box .button { font-size:13px; min-height:38px; }
.hero-caption { position:absolute; right:24px; bottom:23px; display:flex; gap:20px; color:#f4e5c4; font-size:12px; text-shadow:0 1px 6px #000; }
.hero-caption span { display:flex; align-items:center; gap:7px; }
.hero-caption .icon { width:16px; height:16px; }
.hall-tools { margin:0; }
.hall-layout { grid-template-columns:190px minmax(0,1fr); gap:28px; margin-top:28px; }
.filter-sidebar { padding-right:20px; }
.filter-heading { margin-bottom:18px; }
.filter-heading h2 { font-size:14px; }
.filter-sidebar legend { font-size:13px; color:#d0d8d0; }
.filter-sidebar legend small { display:none; }
.character-choice { font-size:13px; color:#b7c4bc; padding-block:10px; }
.character-choice:has(input:checked) { background:#d4b77915; border-color:#c2a66d65; color:#f0d7a6; }
.choice-count { color:#9eada3; font-size:11px; }
.select-label,.select-label select,.tag-filter span { font-size:12px; }
.select-label { color:#a6b4aa; }
.sidebar-note { color:#9ba99e; font-size:12px; }
.results-heading { margin-bottom:16px; align-items:center; }
.results-heading h2 { font-size:23px; }
.results-heading p { color:#a1b0a5; font-size:12px; }
.sort-label { font-size:12px; color:#b4c1b5; }
.seed-grid { gap:18px; }
.seed-card { padding:0; border-color:#49514c; border-radius:10px; background:linear-gradient(140deg,#263032,#1d2528); box-shadow:0 5px 18px #0002; }
.seed-card::before { display:none; }
.seed-card:hover { border-color:color-mix(in srgb,var(--role-color) 75%,#dfbe7c); box-shadow:0 12px 32px #0005; transform:translateY(-3px); }
.card-cover { height:116px; position:relative; isolation:isolate; overflow:hidden; border-bottom:1px solid color-mix(in srgb,var(--role-color) 35%,#263032); background:color-mix(in srgb,var(--role-color) 15%,#161e21); }
.card-scene { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:70% 34%; z-index:-2; transition:transform .3s; }
.card-cover::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,#182023f5,transparent 90%),linear-gradient(90deg,#12191c65,transparent 80%); }
.seed-card:hover .card-scene { transform:scale(1.035); }
.card-archive { position:absolute; top:12px; left:15px; color:#efe7d6bd; font:10px var(--mono); letter-spacing:1px; text-shadow:0 1px 4px #000; }
.card-cover .ascension { position:absolute; top:10px; right:12px; margin:0; font:600 12px var(--mono); padding:5px 7px; background:#151c21cf; color:#ffe1aa; border-color:#e3bd7470; }
.card-role { position:absolute; bottom:12px; left:15px; gap:10px; }
.role-emblem { width:34px; height:38px; border-radius:5px 5px 11px 11px; background:#11191c9c; }
.role-emblem .icon { width:26px; height:26px; }
.card-role small { font-size:8px; color:#e5d7c7; letter-spacing:1.7px; }
.card-role h3 { font:600 19px/1.3 var(--serif); color:#fff3df; text-shadow:0 2px 5px #0008; }
.card-body { padding:14px 16px 10px; }
.card-description { height:44px; margin:0 0 10px; font-size:14px; line-height:1.55; color:#e0e5db; }
.card-tags { min-height:24px; gap:5px; }
.card-tags>span { font-size:10px; padding:2px 6px; }
.card-seed { margin-top:10px; padding:8px 0; border:0; border-block:1px solid #c2c9ae1b; border-radius:0; background:none; justify-content:space-between; gap:8px; }
.card-seed>span { font-size:11px; color:#a8b8a8; flex-shrink:0; }
.card-seed code { font-size:12px; color:#f0d8a8; letter-spacing:.6px; }
.card-environment { margin:8px 0 0; color:#a2b2a5; font-size:10px; }
.mod-state { color:#a2b2a5; font-size:10px; }
.card-footer { margin-top:8px; padding-top:0; }
.card-view { font-size:13px; color:#ebc78a; }
.copy-button { font-size:12px; min-width:92px; padding:7px 9px; background:#c5bb8e0a; border-color:#93977b45; border-radius:5px; }
.card-date { display:block; margin-top:8px; font-size:10px; color:#8f9f93; }
.detail-page { padding-top:0; }
.detail-page .back-link { margin-top:18px; font-size:12px; }
.detail-heading { position:relative; isolation:isolate; overflow:hidden; border:1px solid #61695a70; border-radius:10px; padding:21px 25px; margin-top:14px; margin-bottom:20px; background:#2b2d33; gap:20px; min-height:128px; }
.detail-scene { position:absolute; z-index:-3; inset:0 0 0 auto; width:65%; height:100%; object-fit:cover; object-position:70% 35%; }
.detail-heading::before { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,#292b31 22%,#292b31d9 50%,#292b3126 100%); }
.detail-title { gap:14px; flex:1; }
.detail-title>div:last-child { min-width:0; }
.detail-title h1 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; }
.detail-role { background:#162025aa; width:49px; height:57px; }
.detail-title h1 { font-size:28px; line-height:1.5; color:#fff0d5; }
.detail-title h1 span { font-size:14px; color:#c0cabd; }
.detail-title>div>p:last-child { color:#b6c2b1; font-size:12px; margin-top:4px; }
.detail-title .eyebrow { font-size:10px; }
.dossier-id { color:#a6b5a7; }
.detail-copy { position:relative; flex-direction:column; align-items:stretch; gap:8px; }
.detail-copy code { font-size:14px; color:#ffe4ac; text-shadow:0 2px 5px #000; }
.detail-copy .button { min-height:36px; padding:7px 14px; }
.detail-layout { grid-template-columns:minmax(0,1fr) 254px; gap:20px; }
.map-board { background:#282a2f; border-color:#8f899070; border-radius:10px; }
.board-header { padding:13px 18px 9px; }
.board-header h2 { font-size:23px; margin:0; }
.map-meta { max-width:none; font-size:11px; color:#a9b79b; }
.preview-notice { margin:0 14px 10px; padding:8px 10px; font-size:12px; line-height:1.6; color:#d0c5a8; background:#d3b97809; }
.map-view-switch { padding:10px 14px; gap:8px; }
.map-view-switch button { padding:7px 12px; font-size:12px; }
.map-view-switch .act-tabs button span { display:block; font-size:11px; color:#b8c1a6; margin-top:1px; }
.map-view-switch button[aria-selected=true] { background:#514a3e; border-color:#c6b77b; color:#fff0c3; }
.map-view-switch button[aria-selected=true] span { color:#e0d7ae; }
.act-header { padding:10px 16px; min-height:56px; }
.act-header strong { font-size:14px; }
.act-header small { font-size:12px; color:#c3bdb1; }
.act-roman { color:#d7bf70; }
.act-en { font-size:10px; }
.act-panel { background:radial-gradient(ellipse at 50% 30%,#a19a8f16,transparent 70%),#303137; }
.annotation-tools { padding:7px 10px; gap:5px; background:#303137f5; }
.tool-modes { display:flex; gap:4px; }
.annotation-tools button { min-height:34px; font-size:12px; }
.annotation-tools button[data-ink-action=undo],.annotation-tools button[data-ink-action=redo] { font:22px/1 var(--font); width:32px; padding:0; }
.annotation-settings { position:relative; margin-left:auto; font-size:12px; }
.annotation-settings summary { border:1px solid #77856870; border-radius:5px; padding:7px 9px; cursor:pointer; color:#d7d9c6; list-style:none; background:#24252a; }
.annotation-settings summary::after { content:"⌄"; margin-left:5px; color:#c9b87d; }
.annotation-settings[open] summary { border-color:#d8bc74; color:#ffe9b0; }
.annotation-settings summary:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }
.ink-options { position:absolute; right:0; top:calc(100% + 8px); width:200px; background:#34353c; border:1px solid #96919b; border-radius:8px; box-shadow:0 10px 30px #0008; padding:14px; display:grid; gap:10px; }
.ink-options>span,.ink-options label { color:#d2dacb; font-size:12px; }
.ink-palette { display:flex; gap:8px; }
.ink-options label { display:flex; align-items:center; justify-content:space-between; }
.ink-options select { margin:0; }
.annotation-tools .ink-help { font-size:11px; color:#adbaa5; }
.info-panel { background:linear-gradient(135deg,#34353b,#2b2d33); border-color:#98919a5e; padding:18px; }
.info-panel h2 { font-size:18px; }
.full-description { font-size:14px; color:#d0d9cc; line-height:1.8; margin-top:12px; }
.seed-facts { margin-top:14px; padding-top:12px; }
.seed-facts>div { font-size:12px; padding-block:6px; }
.seed-facts dt { color:#a0a5ad; }
.seed-facts dd { color:#e5e1d8; font-weight:500; }
.seed-facts .fact-character { color:#c8d7af; font-weight:600; }
.seed-facts .fact-ascension { color:#e5c181; font-weight:600; }
.seed-facts .fact-version,.seed-facts .fact-date { font-variant-numeric:tabular-nums; }
.seed-facts .fact-version { color:#c4cad5; }
.seed-facts .fact-channel { font-weight:600; }
.seed-facts .fact-channel.stable { color:#9fcbb9; }
.seed-facts .fact-channel.beta { color:#e5c181; }
.seed-facts .fact-channel.unknown { color:#b6bbc4; }
.seed-facts .fact-date { color:#b6bbc4; }
.node-placeholder,.node-selection>p,.route-total,.route-counts>div { font-size:12px; }
.route-note { font-size:11px; color:#a1b096; }
.site-footer { padding-inline:40px; color:#95a296; font-size:11px; }
@media(min-width:1600px) { .hall-hero { min-height:260px; padding:32px 38px; } .card-cover { height:134px; } }
@media(max-width:1200px) { .hall-layout { grid-template-columns:170px minmax(0,1fr); gap:20px; } .seed-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .hero-content { max-width:57%; } .hero-caption { flex-direction:column; gap:4px; } .detail-layout { grid-template-columns:minmax(0,1fr) 230px; gap:16px; } }
@media(max-width:940px) { .site-header,.page { padding-inline:24px; } .site-header { gap:35px; } .hall-hero { padding:26px; } .hero-content { max-width:70%; } .hall-hero h1 { font-size:32px; } .hero-caption { display:none; } .detail-layout { grid-template-columns:minmax(0,1fr); } .detail-sidebar { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; } .detail-sidebar .info-panel { margin:0; } .detail-sidebar .info-panel:first-child { grid-column:1/-1; } .seed-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 30px; } .detail-heading { flex-direction:row; align-items:center; } .detail-copy { width:auto; } }
@media(max-width:740px) { .site-header { height:66px; gap:22px; padding-inline:18px; } .brand { font-size:16px; gap:8px; } .brand-mark { width:24px; } .brand small { font-size:7px; } .site-header nav { gap:18px; } .site-header nav a { font-size:12px; } .local-badge { display:none; } .page { padding-inline:16px; } .hall-hero { margin-top:16px; min-height:0; padding:24px 20px; border-radius:9px; } .hero-content { max-width:100%; } .hall-hero::before { background:linear-gradient(90deg,#292b31ed,#292b31a0),linear-gradient(0deg,#292b319c,transparent); } .hero-scene { object-position:75% 40%; opacity:.8; } .hall-hero h1 { font-size:29px; line-height:1.45; margin-top:10px; } .hall-hero h1 span { display:block; } .hero-content .eyebrow { font-size:9px; letter-spacing:1px; } .hero-description { font-size:12px; line-height:1.8; max-width:240px; } .hero-content .search-box { margin-top:18px; padding:5px 5px 5px 10px; gap:8px; } .search-box input { font-size:12px; } .search-box kbd { display:none; } .search-box .button { padding-inline:15px; } .hall-tools { margin:16px 0; justify-content:flex-end; } .filter-toggle { display:inline-flex; min-height:36px; padding:6px 12px; border-color:#65736080; background:#303137; } .hall-layout { display:block; margin-top:0; } .filter-sidebar { display:none; border:1px solid #505158; padding:18px; margin-bottom:18px; border-radius:8px; } .filter-sidebar.open { display:block; } .filter-sidebar form { display:block; } .results-heading { margin-bottom:14px; } .results-heading h2 { font-size:22px; } .results-heading p { font-size:11px; } .seed-grid { gap:14px; } .card-cover { height:110px; } .card-body { padding:13px 14px 10px; } .card-description { font-size:14px; height:44px; } .detail-heading { padding:18px; flex-direction:column; align-items:stretch; gap:16px; min-height:0; } .detail-title { gap:12px; } .detail-title h1 { font-size:25px; } .detail-title h1 span { font-size:12px; margin-left:5px; } .detail-title .eyebrow { font-size:9px; } .detail-copy { flex-direction:row; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; } .detail-copy code { font-size:12px; } .detail-scene { width:100%; opacity:.85; } .detail-heading::before { background:linear-gradient(90deg,#292b31ee,#292b3155); } .board-header { padding:12px 14px 8px; flex-wrap:wrap; } .board-header h2 { font-size:21px; } .map-meta { font-size:10px; } .preview-notice { font-size:11px; padding:8px; margin-inline:10px; } .map-view-switch { padding:9px; gap:6px; } .map-view-switch button { padding:6px 9px; font-size:11px; } .map-view-switch .act-tabs { gap:5px; } .map-view-switch .act-tabs button span { font-size:10px; } .annotation-tools { padding:7px; gap:4px; } .annotation-tools .ink-separator { display:none; } .annotation-settings summary { padding-inline:7px; font-size:11px; } .detail-sidebar { display:flex; flex-direction:column; } .seed-facts { display:block; } .site-footer { padding-inline:16px; font-size:10px; } }
@media(max-width:550px) { .seed-grid { grid-template-columns:minmax(0,1fr); } .card-cover { height:132px; } .card-description { height:auto; min-height:22px; margin-bottom:10px; } .card-date { margin-top:8px; } .card-environment { font-size:11px; } .mod-state { font-size:11px; } .card-seed code { font-size:13px; } .card-tags>span { font-size:11px; } }
@media(max-width:440px) { .board-header { align-items:center; } .map-meta { flex-basis:100%; text-align:left; } .annotation-tools { gap:3px; } .annotation-tools .game-drawing-tool { width:32px; flex-basis:32px; height:34px; } .annotation-tools .drawing-tool-icon,.annotation-tools .drawing-tool-glow { width:26px; height:26px; } .tool-modes { gap:3px; } .annotation-tools button[data-ink-action=undo],.annotation-tools button[data-ink-action=redo] { width:27px; } .annotation-settings summary { font-size:10px; padding-inline:5px; } }
@media(prefers-reduced-motion:reduce) { .seed-card,.card-scene { transition:none; animation:none; } .seed-card:hover,.seed-card:hover .card-scene { transform:none; } }

/* Seed information leads; artwork and community counts support browsing. */
.card-cover { height:86px; }
.card-scene { opacity:.73; }
.card-role h3 { font-size:16px; }
.card-role small { font-size:7px; }
.card-role { bottom:9px; }
.role-emblem { width:30px; height:33px; }
.role-emblem .icon { width:23px; height:23px; }
.card-archive { font-size:9px; top:9px; }
.card-body { padding:17px 17px 11px; }
.card-description { height:auto; min-height:60px; margin:0 0 12px; font-size:18px; font-weight:600; line-height:1.65; color:#fff2dc; }
.card-description a { -webkit-line-clamp:3; }
.card-description a:hover { color:#ffe0a6; }
.card-tags>span { font-size:11px; padding:3px 7px; }
.card-seed { margin-top:12px; padding-block:10px; }
.card-seed>span { font-size:12px; color:#c1cdbb; }
.card-seed code { font-size:14px; font-weight:600; color:#f9dda8; }
.card-environment,.mod-state { font-size:11px; color:#b8c4b6; }
.community-stats { display:flex; flex-wrap:wrap; align-items:center; gap:9px 13px; color:#b6c2b2; font-size:11px; }
.community-stats>span { display:inline-flex; align-items:center; gap:4px; white-space:nowrap; cursor:default; }
.community-stats .icon { width:14px; height:14px; color:#a6b6a0; }
.community-stats strong { color:#e7d7b4; font:600 12px var(--mono); }
.card-body>.community-stats { padding-block:12px; margin-top:9px; border-block:1px solid #bac6aa1a; }
.card-footer { margin-top:10px; }
.card-link::after { content:""; position:absolute; inset:0; z-index:1; border-radius:10px; cursor:pointer; }
.seed-card:has(.card-link:focus-visible) { outline:2px solid var(--gold); outline-offset:4px; }
.card-link:focus-visible { outline:none; }
.card-footer .copy-button { position:relative; z-index:2; }
.card-footer .card-date { margin:0; }
.sort-control { display:flex; flex-shrink:0; align-items:center; gap:8px; font-size:12px; color:#b4c1ad; }
.sort-control select { width:140px; margin:0; font-size:13px; background:#32333a; border-color:#97909a70; padding:8px 10px; color:#e7d9b5; }
.seed-summary { display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:24px; align-items:center; margin:-4px 0 20px; padding:20px 24px; border:1px solid #8b805442; border-left:3px solid #dfbe7c; border-radius:7px; background:linear-gradient(115deg,#393638,#2d2e34); }
.summary-label { font-size:11px; letter-spacing:1px; color:#c9b784; margin-bottom:6px; }
.seed-summary h2 { color:#fff0d6; font:600 20px/1.7 var(--font); white-space:pre-wrap; overflow-wrap:anywhere; }
.seed-summary .detail-tags { margin-top:12px; }
.seed-summary .detail-tags>span { font-size:12px; }
.summary-community { border-left:1px solid #d9c48c26; padding-left:22px; }
.summary-community .community-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; font-size:12px; }
.summary-community>a { display:inline-flex; gap:6px; align-items:center; color:#e5c58b; font-size:12px; margin-top:15px; }
.summary-community>a .icon { width:15px; height:15px; }
.detail-sidebar .seed-facts { margin-top:10px; }
.comments-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.comments-heading h2 { scroll-margin-top:24px; }
.comments-heading h2>span { font:12px var(--mono); color:#b9c3a8; margin-left:4px; }
.read-only-label { font-size:10px; color:#b5c2ab; border:1px solid #71806270; padding:2px 5px; border-radius:4px; white-space:nowrap; }
.comments-source { margin-top:7px; font-size:11px; color:#9fad98; }
.comment-list { max-height:380px; overflow:auto; scrollbar-width:thin; margin-top:12px; overscroll-behavior:contain; }
.comment-item { padding:13px 2px; border-top:1px solid #b6c29e20; }
.comment-item header { display:flex; align-items:center; gap:8px; }
.comment-item .character-icon { width:24px; height:24px; }
.comment-author { font-size:11px; color:#b9d99c; border:1px solid #b9d99c55; border-radius:4px; padding:1px 5px; white-space:nowrap; }
.comment-item time { font-size:11px; color:#a5b29a; }
.comment-item p { white-space:pre-wrap; overflow-wrap:anywhere; font-size:14px; color:#e4e8dc; line-height:1.8; margin-top:8px; }
.comment-pagination { display:flex; justify-content:space-between; align-items:center; gap:6px; padding-top:12px; border-top:1px solid #b6c29e20; font-size:11px; color:#c6cbb8; }
.comment-pagination .page-button { width:30px; height:30px; }
.comments-empty { font-size:13px; color:#a9b89f; padding-block:22px; }
#comments-content[aria-busy=true] { opacity:.6; }
@media(max-width:940px) { .seed-summary { grid-template-columns:minmax(0,1fr); gap:16px; } .summary-community { padding:12px 0 0; border-left:0; border-top:1px solid #d9c48c26; display:flex; align-items:center; justify-content:space-between; gap:14px; } .summary-community .community-stats { display:flex; flex-wrap:wrap; } .summary-community>a { margin-top:0; flex-shrink:0; } }
@media(max-width:740px) { .seed-summary { padding:17px; margin-top:-4px; } .seed-summary h2 { font-size:18px; } .summary-community { display:block; } .summary-community>a { margin-top:12px; } .results-heading { gap:8px; } .results-heading p { max-width:155px; } .sort-control { gap:5px; font-size:11px; } .sort-control select { width:114px; font-size:12px; padding:7px; } .community-stats { font-size:11px; gap:9px 13px; } .card-description { height:auto; min-height:60px; font-size:18px; } .card-cover { height:86px; } .card-seed code { font-size:14px; } .card-role h3 { font-size:16px; } .comment-list { max-height:420px; } }

/* Shared emphasis across the hero, archive heading and card interactions. */
.hall-hero h1 span { color:#ffe0a0; text-shadow:0 2px 18px #0007,0 0 28px #edba7020; }
.hero-content .search-box { background:#22242bed; border-color:#b8afb877; box-shadow:0 7px 24px #0005,inset 0 1px #ffffff05; transition:border-color .25s,box-shadow .25s; }
.hero-content .search-box:focus-within { border-color:#e2c184; box-shadow:0 0 0 3px #e2c18412,0 8px 26px #0005; }
.hero-content .primary { position:relative; overflow:hidden; background:linear-gradient(135deg,#f1d495,#cda869); border-color:#e9cd93; box-shadow:0 3px 12px #0003,inset 0 1px #fff4d65c; }
.hero-content .primary::after { content:""; position:absolute; inset:0; background:linear-gradient(110deg,transparent 25%,#fff9d95c 50%,transparent 75%); transform:translateX(-130%); transition:transform .65s; pointer-events:none; }
.hero-content .primary:hover::after,.hero-content .primary:focus-visible::after { transform:translateX(130%); }
.hero-caption { gap:8px; bottom:20px; right:20px; }
.hero-caption>span { border:1px solid #c2d5b52b; border-radius:5px; padding:6px 10px; background:#22242ba6; color:#e0e6d5; box-shadow:0 3px 14px #0002; }
.hero-caption>span:last-child::before { content:""; width:5px; height:5px; border-radius:50%; background:#e9c47e; box-shadow:0 0 7px #e9c47e80; }
.results-heading h2::before { content:""; width:3px; height:22px; border-radius:2px; background:linear-gradient(#ebcb87,#817746); box-shadow:0 0 12px #d8b47420; }
.seed-card::before { display:block; inset:0; height:auto; z-index:0; opacity:0; background:radial-gradient(ellipse at 100% 0,color-mix(in srgb,var(--role-color) 11%,transparent),transparent 65%); pointer-events:none; transition:opacity .25s; }
.seed-card:hover::before,.seed-card:focus-within::before { opacity:1; }
.card-scene { transition:transform .4s,opacity .4s; }
.seed-card:hover .card-scene { opacity:.95; }
.seed-card:hover .card-description a { color:#ffe1a8; }
.card-footer .copy-button:hover { border-color:#ceb67b9c; background:#bca36818; }
@media(max-width:740px) { .hall-hero { min-height:0; } .hero-scene { width:112%; right:-12%; opacity:.9; } .hero-fireflies i:nth-child(even) { display:none; } .hero-pointer-light { display:none; } }
@media(prefers-reduced-motion:reduce) { .hero-scene,.hero-mist,.hero-fireflies i,.hall-hero::after { animation:none; } .hero-scene { transform:scale(1.035); translate:0 0; transition:none; } .hero-fireflies,.hero-pointer-light { display:none; } .hall-hero,.hero-content .search-box,.hero-content .primary::after,.seed-card::before { transition:none; } .hall-hero:hover { transform:none; } .hero-content .primary::after { display:none; } }

/* Neutral control surfaces; native map and character artwork keep their own colors. */
.map-view-switch button,.annotation-tools button,.annotation-tools select { background:#27292f; border-color:#81798570; color:#d1cbd3; }
.map-view-switch button[aria-selected=true],.map-view-switch button[aria-pressed=true],.annotation-tools button[aria-pressed=true] { background:#514a3e; border-color:#c6b77b; color:#fff0c3; }