:root {
  color-scheme: dark;
  --room-gold: #f6c66f;
  --room-gold-hot: #ffe1a1;
  --room-ink: #2b170c;
  --room-paper: #d8b983;
  --room-red: #9a3e27;
  --room-shadow: rgba(7, 4, 2, .72);
}

* { box-sizing: border-box; }
html, body { min-height: 100%; margin: 0; }
button, input, select { font: inherit; }
button, a, select { touch-action: manipulation; }

body.immersive-page {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  display: grid;
  grid-template-rows: 92px minmax(0, 1fr);
  color: #2f1c0f;
  background: #0b0705;
  font-family: var(--font-sans, "Microsoft YaHei", sans-serif);
}

.immersive-page > .site-header {
  z-index: 30;
  border-bottom: 1px solid rgba(244, 200, 121, .16);
  background: linear-gradient(180deg, rgba(10, 9, 8, .96), rgba(18, 12, 8, .86));
  box-shadow: 0 12px 34px rgba(0, 0, 0, .36);
  backdrop-filter: blur(16px);
}

.skip-link { position: fixed; z-index: 60; top: 10px; left: 12px; padding: 10px 14px; border-radius: 8px; background: #fff0c5; color: #1b1008; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.detail-room {
  position: relative;
  min-height: 0;
  overflow: hidden;
  display: grid;
  place-items: center;
  isolation: isolate;
  background: #0c0806;
}

.detail-room::before {
  position: absolute;
  inset: -5%;
  z-index: -2;
  content: "";
  background: var(--room-bg) center / cover no-repeat;
  filter: blur(18px) brightness(.52) saturate(.8);
}

body[data-page="competition"] { --room-bg: var(--progressive-bg-image, url("./assets/rooms/competition-room-low.webp")); }
body[data-page="prompts"] { --room-bg: var(--progressive-bg-image, url("./assets/rooms/prompt-room-low.webp")); }
body[data-page="works"] { --room-bg: var(--progressive-bg-image, url("./assets/rooms/works-room-low.webp")); }

.detail-stage {
  position: relative;
  width: min(100vw, calc((100dvh - 92px) * 1.7779));
  aspect-ratio: 1672 / 941;
  overflow: hidden;
  container-type: inline-size;
  /* 舞台基准字号：1440 宽舞台≈13.6px、1920≈16px、1280 兜底 12px。
     面板内字号按 em 派生，各处小字再用 max(Xem, Npx) 保底可读。 */
  font-size: clamp(12px, .95cqw, 16px);
  background: #130b07;
  box-shadow: 0 0 80px rgba(0, 0, 0, .72);
  transform: scale(1);
  opacity: 1;
  transition: transform 320ms cubic-bezier(.2, .8, .2, 1), opacity 280ms ease;
  animation: stage-arrive 560ms cubic-bezier(.2, .8, .2, 1);
}

/* 舞台入场：首帧渲染即播放，不依赖脚本加载 */
@keyframes stage-arrive { from { transform: scale(1.025); opacity: 0; } }
.detail-background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; user-select: none; }

.workshop-trail {
  position: absolute;
  z-index: 8;
  top: 2.1%;
  left: 2.2%;
  display: inline-flex;
  align-items: center;
  gap: .55em;
  min-height: 44px;
  padding: .55em 1em;
  border: 1px solid rgba(246, 198, 111, .36);
  border-radius: 999px;
  color: rgba(255, 229, 177, .82);
  background: rgba(25, 14, 8, .72);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .3);
  backdrop-filter: blur(8px);
  text-decoration: none;
  transition: color 180ms ease, border-color 180ms ease, transform 180ms ease;
}
.workshop-trail:hover, .workshop-trail:focus-visible { color: #fff1ca; border-color: var(--room-gold); transform: translateX(-3px); outline: 2px solid rgba(255, 231, 179, .62); outline-offset: 2px; }

.search-field {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: .55em;
  height: 2.45em;
  padding: 0 .85em;
  border: 1px solid rgba(77, 42, 18, .58);
  border-radius: .45em;
  color: #4b2c18;
  background: rgba(91, 51, 25, .12);
  box-shadow: inset 0 1px 4px rgba(53, 25, 9, .22);
}
.search-field svg { width: 1.2em; fill: none; stroke: currentColor; stroke-width: 1.8; }
.search-field input { min-width: 0; width: 100%; border: 0; outline: 0; color: #382012; background: transparent; }
.search-field input::placeholder { color: rgba(62, 35, 19, .58); }

.wood-tabs { display: flex; align-items: center; gap: .32em; min-width: 0; }
.wood-tab {
  min-height: 2.35em;
  padding: .42em .85em;
  border: 1px solid rgba(92, 51, 24, .5);
  border-radius: .28em;
  color: #563118;
  background: linear-gradient(#d7b477, #bc8f53);
  box-shadow: inset 0 1px rgba(255, 237, 187, .56), 0 2px 4px rgba(61, 28, 10, .24);
  cursor: pointer;
  white-space: nowrap;
  transition: filter 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}
.wood-tab:hover { filter: brightness(1.08); }
.wood-tab:active { transform: scale(.97); }
.wood-tab.is-active { color: #32190c; background: linear-gradient(#f0ce86, #d39a4f); box-shadow: inset 0 1px #fff0bd, 0 0 12px rgba(222, 144, 45, .46); }
.wood-tab:focus-visible, .wood-action:focus-visible, .gallery-card:focus-visible, .competition-card:focus-visible, .prompt-card:focus-visible, .flame-guide:focus-visible { outline: 3px solid #fff0bd; outline-offset: 3px; }

.wood-action {
  min-height: 44px;
  padding: .68em 1.25em;
  border: 1px solid rgba(224, 168, 85, .72);
  border-radius: .3em;
  color: #ffe4aa;
  background: linear-gradient(#75431f, #45230f);
  box-shadow: inset 0 1px rgba(255, 231, 169, .18), 0 7px 18px rgba(21, 9, 3, .34);
  cursor: pointer;
  transition: transform 180ms ease, filter 180ms ease, box-shadow 180ms ease;
}
.wood-action:hover { filter: brightness(1.12); transform: translateY(-1px); }
.wood-action:active { transform: scale(.97); }
.wood-action--primary { color: #3f220f; font-weight: 700; background: linear-gradient(#ffe0a0, #d99d48); box-shadow: inset 0 1px #fff6d6, 0 0 18px rgba(255, 176, 59, .34); }

/* Competition room */
.competition-board { position: absolute; left: 21.4%; top: 20.2%; width: 50.3%; height: 61.8%; display: flex; flex-direction: column; min-height: 0; padding: .9em 1em 1.1em; }
/* 工具栏用可换行的 flex：六个控件在窄舞台上放不下时自动落到第二行，
   并由下面的 flex: 1 把列表压矮——不会像固定高度的 grid 那样让筛选器叠到卡片上。 */
.board-toolbar { flex: 0 0 auto; display: flex; flex-wrap: wrap; align-items: center; gap: .45em .5em; margin-bottom: .6em; }
/* 搜索框可以缩到 6em：矮舞台（1280×720 一类）上六个控件仍留在一行，不折行挤掉卡片高度 */
.board-toolbar .search-field { flex: 1 1 6em; min-width: 6em; max-width: 15em; }
.competition-sort, .competition-scope { flex: 0 0 auto; height: 2.45em; min-width: 0; padding: 0 .5em; border: 1px solid rgba(77, 42, 18, .58); border-radius: .45em; color: #4b2c18; background: rgba(255, 237, 190, .72); font: inherit; font-size: max(.82em, 12px); }

/* 学生五道闸门评级：a 值得投 / b 顺手投 / pending 待确认 / no 不适合 */
.competition-card__badges { position: absolute; right: .6em; top: .55em; display: flex; flex-direction: column; align-items: flex-end; gap: .3em; }
.fit-badge { padding: .1em .45em; border: 1px solid currentColor; border-radius: .2em; font-size: max(.68em, 10px); font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.fit-badge--a { color: #2f6b3d; background: rgba(96, 168, 118, .18); }
.fit-badge--b { color: #7a5a17; background: rgba(198, 158, 70, .18); }
.fit-badge--pending { color: #6d6257; background: rgba(120, 108, 94, .14); }
.fit-badge--no { color: #8d3f31; background: rgba(160, 84, 68, .15); }
.gap-chip { padding: .08em .4em; border: 1px dashed rgba(109, 98, 87, .7); border-radius: .2em; color: #6d6257; font-size: max(.64em, 10px); white-space: nowrap; }
.fit-text--a { color: #2f6b3d; }
.fit-text--b { color: #7a5a17; }
.fit-text--pending { color: #6d6257; }
.fit-text--no { color: #8d3f31; }
.competition-modal__fit-reason { margin: 0; padding: .7rem 2rem .85rem; border-bottom: 1px solid #e5dccc; background: #f3eee4; color: #6b5a49; font-size: .78rem; line-height: 1.6; }
/* 每行最少 min-content：舞台再矮也不裁卡片底行（日期 / 截止 / 查看详情），装不下就在板内滚动 */
.competition-list { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, minmax(min-content, 1fr)); gap: .6em .75em; overflow-y: auto; overscroll-behavior: contain; scrollbar-color: rgba(120, 74, 38, .5) transparent; scrollbar-width: thin; }
.competition-list::-webkit-scrollbar { width: .42em; }
.competition-list::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(120, 74, 38, .5); }
.competition-card > * { flex-shrink: 0; }
.competition-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: .75em .85em .62em 4.75em;
  border: 1px solid rgba(95, 52, 25, .45);
  border-radius: .15em;
  color: #3c2212;
  text-align: left;
  text-decoration: none;
  background: rgba(218, 188, 137, .72);
  box-shadow: 0 3px 8px rgba(65, 31, 12, .17), inset 0 1px rgba(255, 244, 210, .38);
  cursor: pointer;
  width: 100%;
  font: inherit;
  text-align: left;
  overflow: hidden;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.competition-card:hover { transform: translateY(-2px); background: rgba(232, 202, 149, .86); box-shadow: 0 8px 16px rgba(65, 31, 12, .24); }
.competition-card.is-featured { border-color: #d08332; box-shadow: 0 0 16px rgba(226, 137, 39, .38), inset 0 0 10px rgba(255, 227, 153, .32); }
.competition-card__mark { position: absolute; left: .72em; top: .72em; width: 3.35em; aspect-ratio: 1; display: grid; place-items: center; padding: .35em; border-radius: .22em; color: #efd39a; font-family: var(--font-serif, serif); font-size: .83em; text-align: center; background: linear-gradient(145deg, #27382d, #152219); }
.competition-card h3 { margin: 0 0 .35em; padding-right: 4em; overflow: hidden; color: #2e190d; font-family: var(--font-serif, serif); font-size: 1.02em; text-overflow: ellipsis; white-space: nowrap; }
.competition-card__host { margin: .14em 0 .45em; overflow: hidden; color: #6f472d; font-size: max(.78em, 11px); text-overflow: ellipsis; white-space: nowrap; }
.competition-card__meta { display: flex; justify-content: space-between; gap: .5em; color: #694127; font-size: max(.78em, 11px); }
/* 赛道名不参与收缩，奖励文案（可能是很长的 note 兜底）自己省略号截断 */
.competition-card__meta span { flex: 0 0 auto; }
.competition-card__meta strong { min-width: 0; }
.competition-card__meta span, .competition-card__meta strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* footer 在文档流内用 margin-top:auto 贴底（卡片是纵向 flex）：
   空间不够时只被裁切、绝不叠到上面的奖励行；整行强制单行，
   「下届 预计 2027 年 7 月」这类长文案由时间段收缩并省略号截断 */
.competition-card footer { flex: 0 0 auto; margin-top: auto; display: flex; align-items: center; gap: .65em; border-top: 1px solid rgba(94, 53, 27, .2); padding-top: .38em; font-size: max(.74em, 11px); white-space: nowrap; }
.competition-card footer time { flex: 1 1 auto; min-width: 0; overflow: hidden; color: #70472b; font-family: ui-monospace, monospace; text-overflow: ellipsis; }
.status-chip { flex: 0 0 auto; color: #963e29; font-weight: 700; }
.competition-card__action { flex: 0 0 auto; margin-left: auto; color: #6d351a; font-weight: 700; }
/* 窄舞台（窗口不够宽）时字号已到 10px 下限、卡片行高继续缩：
   隐藏主办方行、收紧留白，保住「标题 + 奖励 + 底行」三层不裁切 */
@container (max-width: 1300px) {
  .competition-card { padding-top: .55em; }
  .competition-card h3 { margin-bottom: .18em; }
  .competition-card__host { display: none; }
  .competition-card__meta { margin-bottom: .3em; padding-right: 4em; }
}
.competition-card__action b { margin-left: .25em; font-size: 1.15em; }
.competition-modal[hidden] { display: none; }
.competition-modal { position: fixed; z-index: 50; inset: 0; display: grid; place-items: center; padding: 2rem; }
.competition-modal__backdrop { position: absolute; inset: 0; background: rgba(37, 24, 15, .5); backdrop-filter: blur(5px); }
.competition-modal__panel { position: relative; display: grid; grid-template-rows: auto auto auto minmax(0, 1fr) auto; width: min(68rem, 92vw); height: min(46rem, 90vh); overflow: hidden; border: 1px solid rgba(130, 92, 48, .28); border-radius: 1.15rem; color: #372b22; background: #f8f4eb; box-shadow: 0 2rem 5.5rem rgba(35, 22, 12, .42), 0 1px 0 rgba(255,255,255,.75) inset; }
.competition-modal__header { display: flex; justify-content: space-between; gap: 2rem; padding: 1.75rem 2rem 1.2rem; border-bottom: 1px solid #e5dccc; background: #fbf8f1; }
.competition-modal__close { flex: 0 0 auto; width: 2.2rem; height: 2.2rem; border: 0; border-radius: 50%; color: #74685b; background: #eee8dc; font-size: 1.45rem; line-height: 1; cursor: pointer; transition: background 160ms ease, color 160ms ease, transform 160ms ease; }
.competition-modal__close:hover { color: #3f3024; background: #e2d8c8; transform: rotate(4deg); }
.competition-modal__eyebrow { margin: 0 0 .55rem; color: #9b6b36; font-size: .68rem; font-weight: 700; letter-spacing: .13em; }
.competition-modal__eyebrow span { margin-left: .5rem; padding: .22rem .48rem; border-radius: 999px; color: #8a6b49; background: #efe8da; font-size: .66rem; font-weight: 600; letter-spacing: 0; }
.competition-modal h2 { max-width: 50rem; margin: 0; color: #33271f; font-family: var(--font-serif, serif); font-size: clamp(1.65rem, 3vw, 2.45rem); line-height: 1.18; }
.competition-modal__host { margin: .52rem 0 0; color: #786c60; font-size: .87rem; }
.competition-modal__facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 0; padding: .85rem 2rem; border-bottom: 1px solid #e5dccc; background: #f3eee4; }
.competition-modal__facts div { min-width: 0; padding: .1rem 1.1rem; border-left: 1px solid #ded3c3; }
.competition-modal__facts div:first-child { padding-left: 0; border-left: 0; }
.competition-modal__facts dt { color: #94867a; font-size: .67rem; letter-spacing: .08em; }
.competition-modal__facts dd { overflow: hidden; margin: .24rem 0 0; color: #493a2d; font-size: .88rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.competition-modal__facts dd.fit-text--a, .competition-modal__facts dd.fit-text--b, .competition-modal__facts dd.fit-text--pending, .competition-modal__facts dd.fit-text--no { font-weight: 700; }
.competition-modal__body { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(15rem, .75fr); min-height: 0; gap: 1.35rem; padding: 1.4rem 2rem 1.15rem; overflow: hidden; }
.competition-reader { display: grid; grid-template-rows: auto minmax(0, 1fr); min-height: 0; padding-right: .2rem; }
.competition-reader__meta { display: flex; justify-content: space-between; padding-bottom: .82rem; border-bottom: 1px solid #dfd5c6; color: #9b8b7d; font-size: .7rem; letter-spacing: .08em; }
.competition-reader__meta span:first-child { color: #635447; font-weight: 700; }
.competition-reader__scroll { min-height: 0; margin-top: .25rem; padding-right: 1.2rem; overflow-y: auto; scrollbar-color: #b29a7a transparent; scrollbar-width: thin; }
.competition-reader__scroll::-webkit-scrollbar { width: .42rem; }
.competition-reader__scroll::-webkit-scrollbar-track { background: transparent; }
.competition-reader__scroll::-webkit-scrollbar-thumb { border-radius: 999px; background: #b29a7a; }
.competition-reader__section { padding: 1.25rem 0 1.35rem; border-bottom: 1px solid #e7ded2; }
.competition-reader__section:last-child { border-bottom: 0; }
.competition-reader__section p { margin: 0 0 .38rem; color: #a8783e; font-size: .68rem; font-weight: 700; letter-spacing: .11em; }
.competition-reader__section h3, .competition-modal__team h3 { margin: 0 0 .66rem; color: #382b22; font-family: "Noto Serif SC", "Songti SC", SimSun, serif; font-size: 1.28rem; font-weight: 650; letter-spacing: .025em; }
.competition-reader__prose { max-width: 42rem; color: #4e4035; font-family: "Noto Serif SC", "Songti SC", SimSun, serif; font-size: 1rem; font-weight: 430; line-height: 1.98; letter-spacing: .018em; text-wrap: pretty; }
.competition-reader__section--action { margin: .25rem 0; padding: 1.15rem 1.2rem 1.25rem; border: 1px solid #e4d7c4; border-radius: .72rem; background: #f5efe5; }
.competition-reader__section--action + .competition-reader__section--action { margin-top: .65rem; }
.competition-reader__section--action p { color: #8a6033; }
.competition-modal__team { align-self: stretch; min-height: 0; padding: 1.15rem; overflow-y: auto; border-radius: .85rem; background: #eee7db; scrollbar-color: #c3ae93 transparent; scrollbar-width: thin; }
.competition-modal__team > div { display: flex; align-items: center; justify-content: space-between; }
.competition-modal__team > div span { padding: .22rem .45rem; border-radius: 999px; color: #856b4e; background: rgba(255,255,255,.52); font-size: .72rem; }
.competition-modal__team-hint { margin: .66rem 0; color: #78695c; font-size: .78rem; line-height: 1.58; }
.competition-modal__team ul { display: grid; gap: .38rem; margin: .8rem 0 0; padding: 0; list-style: none; }
.competition-modal__team li { display: flex; gap: .45rem; align-items: center; justify-content: space-between; padding: .58rem .65rem; border-radius: .55rem; color: #59483a; background: rgba(255,255,255,.58); font-size: .8rem; }
.competition-modal__team li span::before { display: inline-grid; width: 1.45rem; height: 1.45rem; place-items: center; margin-right: .45rem; border-radius: 50%; color: #896135; background: #e6d5bb; content: '村'; font-size: .64rem; font-weight: 700; }
.competition-modal__team small { color: #998273; }
.competition-signup-people { display: flex; flex-wrap: wrap; gap: .4rem; margin: .75rem 0 .15rem; }
.competition-signup-people[hidden] { display: none; }
.competition-signup-person { display: inline-flex; gap: .38rem; align-items: center; padding: .3rem .66rem .3rem .5rem; border: 1px solid #ddcdb4; border-radius: 999px; color: #5f4a35; background: rgba(255,255,255,.66); font: inherit; font-size: .74rem; font-weight: 650; cursor: pointer; transition: transform 140ms ease, border-color 140ms ease, background 140ms ease; }
.competition-signup-person::before { display: inline-grid; width: 1.15rem; height: 1.15rem; place-items: center; border-radius: 50%; color: #896135; background: #e6d5bb; content: '火'; font-size: .58rem; font-weight: 700; }
.competition-signup-person:hover { transform: translateY(-1px); border-color: #bb9057; background: #fff; }
.competition-person-pop[hidden] { display: none; }
.competition-person-pop { position: fixed; z-index: 80; width: 15.5rem; padding: .82rem .95rem .92rem; border: 1px solid rgba(130, 92, 48, .32); border-radius: .75rem; color: #372b22; background: #fbf8f1; box-shadow: 0 .9rem 2.4rem rgba(35, 22, 12, .32), 0 1px 0 rgba(255,255,255,.8) inset; }
.competition-person-pop b { margin-right: .5rem; font-family: "Noto Serif SC", "Songti SC", SimSun, serif; font-size: .95rem; font-weight: 700; }
.competition-person-pop span { color: #9a8467; font-size: .68rem; }
.competition-person-pop p { margin: .45rem 0 0; color: #5d4d3f; font-size: .76rem; line-height: 1.62; overflow-wrap: anywhere; }
.competition-modal__source { display: inline-flex; gap: .38rem; align-items: center; margin-top: 1rem; color: #87633a; font-size: .78rem; font-weight: 700; text-decoration: none; }
.competition-modal__source:hover { color: #5e4327; text-decoration: underline; }
.competition-modal__footer { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.25rem; padding: 1rem 2rem 1.25rem; border-top: 1px solid #e5dccc; background: #fbf8f1; }
.competition-modal__note { max-width: 28rem; margin: 0; color: #887b6e; font-size: .73rem; line-height: 1.5; }
.competition-modal__feedback { min-height: 1.2em; margin: .35rem 0 0; color: #9a6d38; font-size: .75rem; }
.competition-modal__actions { display: flex; flex: 0 0 auto; gap: .55rem; }
.competition-modal__action { min-height: 2.65rem; padding: 0 1rem; border-radius: .55rem; font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease; }
.competition-modal__action:hover { transform: translateY(-1px); }
.competition-modal__action--quiet { border: 1px solid #d9cdbc; color: #6b5948; background: transparent; }
.competition-modal__action--quiet:hover { background: #f0e9dc; }
.competition-modal__action--primary { border: 1px solid #ae7638; color: #fffaf1; background: #a86f32; box-shadow: 0 .35rem .8rem rgba(130,83,35,.22); }
.competition-modal__action--primary:hover { background: #925d28; box-shadow: 0 .5rem 1rem rgba(130,83,35,.28); }
.competition-modal__action--primary span { margin-left: .35rem; font-size: 1.05em; }
.competition-pagination { flex: 0 0 auto; height: 2.1em; margin-top: .5em; display: flex; align-items: center; justify-content: center; gap: 1em; color: #68422a; font-size: max(.76em, 11px); }
.competition-pagination button { min-width: 5.5em; min-height: 2.2em; border: 1px solid rgba(91, 49, 23, .36); border-radius: .25em; color: #593219; background: rgba(222, 188, 129, .66); cursor: pointer; }
.competition-pagination button:hover:not(:disabled) { background: rgba(242, 207, 146, .92); }
.competition-pagination button:disabled { opacity: .38; cursor: default; }

/* 两块木框面板：背景图里的木框比 CSS 盒子往内多吃约半个字，左右内边距加大，首字与右侧天数不再压在框影里 */
.deadline-board { position: absolute; left: 75%; top: 20.5%; width: 18.7%; height: 28.5%; padding: .9em 1.5em .9em 1.3em; }
.deadline-board h2, .ai-board h2 { margin: 0 0 .65em; color: #432514; font-family: var(--font-serif, serif); font-size: 1.35em; text-align: center; letter-spacing: .08em; }
.deadline-item { display: grid; grid-template-columns: 1fr auto; gap: .2em .6em; padding: .58em .3em; border-bottom: 1px solid rgba(75, 41, 21, .24); color: inherit; text-decoration: none; transition: background 180ms ease, transform 180ms ease; }
.deadline-item:hover { background: rgba(255, 234, 185, .25); transform: translateX(2px); }
.deadline-item strong { overflow: hidden; font-size: max(.84em, 12px); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.deadline-item time { grid-column: 1; color: #6d472d; font-size: max(.74em, 11px); }
.deadline-item span { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: #983f2a; font-family: ui-monospace, monospace; font-size: .82em; }

.ai-board { position: absolute; left: 75.1%; top: 53.1%; width: 19.2%; height: 36.7%; display: flex; flex-direction: column; min-height: 0; padding: 1em 1.4em .8em 1.6em; }
.recommendation-mode { display: flex; gap: .35em; margin: -.12em 0 .62em; }
.recommendation-mode .wood-tab { flex: 1; min-height: 2em; padding: .3em .35em; font-size: max(.74em, 11px); }
.ai-preferences { display: grid; grid-template-columns: 1fr 1fr; gap: .45em; }
/* min-width:0 让 select 的固有宽度不再把栅格撑出面板（原先右侧下拉框冲出木框） */
.ai-preferences label { display: grid; gap: .22em; min-width: 0; color: #68432a; font-size: max(.74em, 11px); }
.ai-preferences label:last-child { grid-column: 1 / -1; }
.ai-preferences select { width: 100%; min-width: 0; max-width: 100%; height: 2.1em; border: 1px solid rgba(93, 52, 27, .35); border-radius: .25em; color: #3d2515; background: rgba(255, 239, 196, .36); }
.ai-recommendations { flex: 1 1 auto; min-height: 0; margin-top: .55em; overflow-y: auto; scrollbar-color: rgba(120, 74, 38, .5) transparent; scrollbar-width: thin; }
.ai-recommendation { position: relative; display: block; padding: .45em .3em .45em 2em; border-top: 1px solid rgba(85, 47, 23, .24); color: inherit; font-size: max(.74em, 11px); line-height: 1.28; text-decoration: none; transition: background 180ms ease; }
.ai-recommendation:hover { background: rgba(255, 234, 185, .24); }
.ai-recommendation b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-recommendation span { color: #764a2e; }
.ai-recommendation::before { position: absolute; left: .25em; top: .55em; display: grid; place-items: center; width: 1.25em; aspect-ratio: 1; border: 1px solid #9e632d; border-radius: 50%; content: attr(data-rank); color: #753b1d; font-weight: 700; }
.flame-guide { position: absolute; z-index: 7; right: 1.4%; bottom: 2.3%; width: 5.1%; min-width: 50px; padding: 0; border: 0; background: transparent; cursor: pointer; filter: drop-shadow(0 0 12px rgba(255, 159, 50, .62)); animation: flame-float 2.8s ease-in-out infinite; }
.flame-guide svg { display: block; width: 100%; }
@keyframes flame-float { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-5px) rotate(1deg); } }

/* Prompt room */
/* 布局对齐背景图：分类页签横在羊皮纸上沿的深色木梁上（约 23.4%–29%），
   羊皮纸内区（约 22.9%–76.8% × 29.5%–64.6%）整块留给卡片，
   卡片再多也只在板内向下滑，不会溢出压到书桌。 */
.prompt-board { position: absolute; left: 22.4%; top: 23.4%; width: 58.2%; height: 41.4%; display: flex; flex-direction: column; min-height: 0; padding: .4em 1.1em .9em; }
.prompt-toolbar { flex: 0 0 auto; display: flex; flex-wrap: wrap; gap: .5em .8em; align-items: center; }
.prompt-toolbar .wood-tabs { flex: 1 1 auto; flex-wrap: wrap; }
/* 分类页签横在木梁上：深胡桃木牌 + 细木纹 + 金字，选中的像点亮的金木牌（只限提示词页，
   竞赛页同款 .wood-tab 在羊皮纸上保持浅色不动） */
.prompt-toolbar .wood-tab {
  color: #f3d9a4;
  border-color: rgba(150, 96, 45, .65);
  background: repeating-linear-gradient(93deg, rgba(255, 214, 140, .05) 0 2px, rgba(20, 9, 3, .09) 2px 5px), linear-gradient(#6d3f1e, #422310);
  box-shadow: inset 0 1px rgba(255, 219, 150, .28), 0 3px 7px rgba(12, 5, 2, .5);
  text-shadow: 0 1px 2px rgba(15, 6, 2, .65);
}
.prompt-toolbar .wood-tab:hover { filter: brightness(1.2); }
.prompt-toolbar .wood-tab.is-active {
  color: #3a1f0c;
  border-color: #e8b264;
  background: repeating-linear-gradient(93deg, rgba(120, 63, 20, .07) 0 2px, rgba(255, 244, 210, .06) 2px 5px), linear-gradient(#f4cf87, #cf9448);
  box-shadow: inset 0 1px #ffedbd, 0 0 14px rgba(232, 152, 46, .5);
  text-shadow: none;
}
.prompt-list { flex: 1 1 auto; min-height: 0; margin-top: 1.05em; padding-right: .45em; display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: min-content; gap: .65em; overflow-y: auto; overscroll-behavior: contain; scrollbar-color: rgba(120, 74, 38, .55) transparent; scrollbar-width: thin; }
/* 列表底部渐隐：让被书压住的最后一行读起来是「还能往下滚」，而不是被书遮住 */
.prompt-list { -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 2.2em), transparent); mask-image: linear-gradient(180deg, #000 calc(100% - 2.2em), transparent); }
.prompt-list::-webkit-scrollbar { width: .42em; }
.prompt-list::-webkit-scrollbar-track { background: transparent; }
.prompt-list::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(120, 74, 38, .55); }
/* 卡片底色不透明：列表盖满整块羊皮纸后，滚到底部阴影或边缘时文字依然清晰 */
.prompt-card { min-width: 0; min-height: 6em; padding: .7em .75em; border: 1px solid rgba(91, 49, 23, .38); color: #3f2616; text-align: left; background: linear-gradient(#f1dcae, #e2c28c); box-shadow: 0 3px 9px rgba(40, 19, 7, .3); cursor: pointer; transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease; }
.prompt-card:nth-child(2n) { transform: rotate(.35deg); }
.prompt-card:hover { transform: translateY(-2px); background: linear-gradient(#f8e7be, #ecce99); }
.prompt-card.is-active { border-color: #d58a32; box-shadow: 0 0 14px rgba(227, 145, 47, .44); }
.prompt-card h3 { margin: 0 0 .34em; overflow: hidden; font-family: var(--font-serif, serif); font-size: .93em; text-overflow: ellipsis; white-space: nowrap; }
.prompt-card p { margin: 0; display: -webkit-box; overflow: hidden; font-size: max(.78em, 11px); line-height: 1.4; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.prompt-card footer { margin-top: .5em; display: flex; justify-content: space-between; gap: .5em; color: #755039; font-size: max(.7em, 10px); }
.prompt-card__cta { flex: 0 0 auto; color: #8d552c; font-weight: 700; }
/* 书页区对齐背景图里摊开的书（左页约 27.4%–46%，右页约 47.4%–65.4%，纵向 65.6%–92.8%）：
   两栏各贴一页，中缝用列间距空出，外侧留大内边距避开卷曲的页边；字色用深墨色保证纸面上清晰 */
.prompt-book { position: absolute; left: 27.4%; top: 65.6%; width: 38%; height: 23.8%; display: grid; grid-template-columns: 1fr 1fr; gap: 0 3.4em; color: #35200e; pointer-events: none; }
.prompt-book[hidden], .prompt-actions[hidden], .prompt-actions .wood-action[hidden] { display: none; }
.book-summary, .book-copy { overflow: hidden; }
.book-summary { padding: 1.15em .5em .6em 2em; }
/* 右页文字原先起点落在书脊阴影里被吃掉半个字：中缝加宽、左内边距加大 */
.book-copy { padding: 1.15em 1.6em .6em 1em; }
.book-summary #prompt-description { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.book-kicker { margin: 0 0 .35em; color: #7d4a1f; font-size: max(.72em, 10px); font-weight: 700; letter-spacing: .16em; }
.prompt-book h2, .work-detail h2 { margin: 0 0 .42em; font-family: var(--font-serif, serif); font-size: 1.25em; }
.prompt-book h2 { color: #241505; }
.prompt-book p { margin-top: .4em; color: #3a2410; font-size: max(.78em, 11px); line-height: 1.5; }
/* 右页全文：不再 7 行截断，改成书页内向下滑动看完整（书整体仍不拦截点击，只有全文区可交互滚动） */
.book-copy { display: flex; flex-direction: column; min-height: 0; }
.book-copy #prompt-full { flex: 1 1 auto; min-height: 0; margin-bottom: 0; padding-right: .5em; overflow-y: auto; overscroll-behavior: contain; pointer-events: auto; scrollbar-color: rgba(120, 74, 38, .5) transparent; scrollbar-width: thin; }
.book-copy #prompt-full::-webkit-scrollbar { width: .38em; }
.book-copy #prompt-full::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(120, 74, 38, .5); }
.paper-tags { display: flex; flex-wrap: wrap; gap: .35em; }
.paper-tag { padding: .23em .55em; border-radius: 999px; color: #674024; background: rgba(104, 70, 35, .14); font-size: max(.7em, 10px); }
/* 原 top 70.4% + 每个按钮 44px，在 900 高的窗口里最后一个被裁掉；桌面端按舞台比例定高（手机 44px 由 mobile-tap.css 接管） */
.prompt-actions { position: absolute; left: 73.1%; top: 68.6%; width: 16.8%; display: grid; gap: .45em; }
.prompt-actions .wood-action { min-height: 2.6em; padding: .5em 1em; }

/* 提示词预览（放大的书页）：点卡片打开，读全文、复制使用、当场打分 */
.prompt-preview[hidden] { display: none; }
.prompt-preview { position: fixed; z-index: 55; inset: 0; display: grid; place-items: center; padding: 2rem; }
.prompt-preview__backdrop { position: absolute; inset: 0; border: 0; background: rgba(37, 24, 15, .55); backdrop-filter: blur(5px); }
.prompt-preview__panel { position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: min(46rem, 94vw); max-height: min(42rem, 88vh); overflow: hidden; border: 1px solid rgba(130, 92, 48, .3); border-radius: 1.1rem; color: #372b22; background: #f8f4eb; box-shadow: 0 2rem 5rem rgba(35, 22, 12, .45), 0 1px 0 rgba(255, 255, 255, .75) inset; }
.prompt-preview__header { display: flex; justify-content: space-between; gap: 1.5rem; padding: 1.5rem 1.8rem 1.1rem; border-bottom: 1px solid #e5dccc; background: #fbf8f1; }
.prompt-preview__eyebrow { margin: 0 0 .5rem; color: #9b6b36; font-size: .68rem; font-weight: 700; letter-spacing: .13em; }
.prompt-preview__header h2 { margin: 0; color: #33271f; font-family: var(--font-serif, serif); font-size: clamp(1.25rem, 2.4vw, 1.75rem); line-height: 1.22; }
.prompt-preview__description { margin: .5rem 0 .6rem; color: #6b5a49; font-size: .84rem; line-height: 1.6; }
.prompt-preview__header .paper-tag { font-size: .68rem; }
.prompt-preview__close { flex: 0 0 auto; width: 2.2rem; height: 2.2rem; border: 0; border-radius: 50%; color: #74685b; background: #eee8dc; font-size: 1.4rem; line-height: 1; cursor: pointer; transition: background 160ms ease, color 160ms ease; }
.prompt-preview__close:hover { color: #3f3024; background: #e2d8c8; }
.prompt-preview__body { display: grid; grid-template-rows: auto minmax(0, 1fr); min-height: 0; padding: 1.05rem 1.8rem .9rem; }
.prompt-preview__body .book-kicker { font-size: .68rem; }
.prompt-preview__full { min-height: 8rem; margin: .3rem 0 0; padding: 1rem 1.15rem; overflow-y: auto; border: 1px solid #e4d7c4; border-radius: .7rem; background: #f5efe5; color: #4e4035; font-family: inherit; font-size: .9rem; line-height: 1.85; white-space: pre-wrap; overflow-wrap: anywhere; scrollbar-color: #b29a7a transparent; scrollbar-width: thin; }
.prompt-preview__full::-webkit-scrollbar { width: .42rem; }
.prompt-preview__full::-webkit-scrollbar-thumb { border-radius: 999px; background: #b29a7a; }
.prompt-preview__footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .7rem 1.2rem; padding: .95rem 1.8rem 1.15rem; border-top: 1px solid #e5dccc; background: #fbf8f1; }
.prompt-preview__rate { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.prompt-preview__rate > span { color: #887b6e; font-size: .78rem; }
.prompt-preview__rate button { min-height: 2.35rem; padding: 0 .9rem; border: 1px solid #d9cdbc; border-radius: 999px; color: #6b5948; background: transparent; font: inherit; font-size: .8rem; font-weight: 700; cursor: pointer; transition: background 160ms ease, color 160ms ease, border-color 160ms ease; }
.prompt-preview__rate button:hover { background: #f0e9dc; }
.prompt-preview__rate button.is-active { border-color: #ae7638; color: #fffaf1; background: #a86f32; }
.prompt-preview__rate button:disabled { opacity: .55; cursor: default; }
.prompt-preview__actions { display: flex; flex: 0 0 auto; gap: .55rem; }
.prompt-preview__actions .wood-action { font-size: .85rem; }
.prompt-preview__hint { flex: 1 1 100%; min-height: 1.2em; margin: 0; color: #9a6d38; font-size: .76rem; }
.prompt-preview__hint.is-error { color: #a3402c; }

/* Works room */
body[data-page="works"] { --works-ink: #432515; --works-ink-soft: #765038; --works-gold: #d39a4c; --works-gold-bright: #f3cc79; --works-paper: rgba(245, 219, 164, .72); --works-shadow: rgba(31, 14, 6, .42); --gallery-canvas-edge: #251913; --gallery-canvas-center: #3b281e; --gallery-canvas-light: #543724; --gallery-canvas-title: #e3b86f; --gallery-canvas-meta: #a97848; }
.works-toolbar { position: absolute; z-index: 7; left: 30.5%; top: 20%; width: 56%; display: flex; align-items: center; justify-content: space-between; gap: 1.2em; }
.works-toolbar p { display: flex; align-items: center; gap: .72em; margin: 0; color: rgba(255, 228, 180, .78); font-size: max(.74em, 11px); line-height: 1.5; letter-spacing: .035em; text-shadow: 0 1px 3px rgba(10, 5, 2, .85); }
.works-toolbar p span { flex: 0 0 auto; padding-right: .72em; border-right: 1px solid rgba(255, 220, 160, .3); color: #f3cc79; font-weight: 800; letter-spacing: .14em; }
.works-toolbar .wood-action { flex: 0 0 auto; min-height: 2.65em; padding: .55em 1.5em; border-color: rgba(255, 224, 152, .8); border-radius: .36em; color: #3d1e0b; background: linear-gradient(#ffe7b1, #dd9c46); box-shadow: inset 0 1px rgba(255, 252, 232, .9), 0 .3em .8em rgba(58, 28, 10, .3), 0 0 1.1em rgba(255, 183, 72, .45); font-size: .88em; font-weight: 800; letter-spacing: .1em; }
.works-toolbar .wood-action::before { margin-right: .42em; font-weight: 900; content: "＋"; }
.works-toolbar .wood-action:hover { filter: none; border-color: #fff1c4; background: linear-gradient(#fff1c9, #eaad57); box-shadow: inset 0 1px #fffaea, 0 .38em .95em rgba(58, 28, 10, .34), 0 0 1.5em rgba(255, 196, 92, .65); }
.works-level-filter { position: absolute; z-index: 7; left: 18.3%; top: 22.3%; display: flex; align-items: center; gap: .55em; padding: .48em .62em; border: 1px solid rgba(143, 87, 39, .42); border-radius: .42em; color: var(--works-ink); background: linear-gradient(180deg, rgba(55, 30, 16, .86), rgba(27, 14, 8, .82)); box-shadow: inset 0 1px rgba(255, 215, 137, .12), 0 .3em .85em rgba(20, 8, 3, .34); font-size: .9em; }
.works-type-filter { position: absolute; z-index: 7; left: 4.2%; top: 29.5%; display: grid; gap: .5em; width: 9.8%; color: var(--works-ink); font-size: max(.8em, 12px); }
.works-level-filter span, .works-type-filter span { color: var(--works-ink-soft); font-weight: 800; letter-spacing: .14em; }
.works-level-filter span { padding-right: .7em; border-right: 1px solid rgba(221, 169, 86, .34); color: #e7bd76; font-size: max(.86em, 12px); text-shadow: 0 1px 3px rgba(13, 6, 2, .8); }
.works-type-filter span { margin-bottom: .22em; padding-bottom: .52em; border-bottom: 1px solid rgba(88, 48, 23, .28); text-align: center; }
.works-level-filter button, .works-type-filter button { min-height: 2.35em; border: 1px solid rgba(91, 49, 23, .32); border-radius: .28em; color: #57321d; background: linear-gradient(180deg, rgba(235, 204, 144, .66), rgba(197, 151, 83, .5)); box-shadow: inset 0 1px rgba(255, 239, 195, .5), 0 2px 5px rgba(55, 28, 12, .12); font: inherit; cursor: pointer; transition: color 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease; }
.works-level-filter button { min-height: 2.75em; padding: 0 1.05em; font-weight: 800; letter-spacing: .04em; }
.works-type-filter button { padding: .48em .72em; text-align: center; }
.works-level-filter button:hover, .works-type-filter button:hover { border-color: rgba(135, 78, 29, .62); background: linear-gradient(#f0d294, #d6a45d); box-shadow: inset 0 1px #fff0bf, 0 0 .75em rgba(219, 151, 57, .28); }
.works-level-filter button.is-active, .works-type-filter button.is-active { border-color: #8b5527; color: #fff1c9; background: linear-gradient(#9c5f2d, #6f3a1c); box-shadow: inset 0 1px rgba(255, 215, 135, .34), 0 0 .78em rgba(234, 161, 58, .46); }
.works-level-filter button:focus-visible, .works-type-filter button:focus-visible { outline: 2px solid var(--works-gold-bright); outline-offset: 2px; }
.works-gallery { position: absolute; inset: 0; }
.gallery-card { position: absolute; display: flex; flex-direction: column; justify-content: center; min-width: 0; min-height: 0; padding: 1em .8em; border: 0; color: var(--gallery-canvas-title); text-align: center; overflow: hidden; background: repeating-linear-gradient(92deg, rgba(255, 236, 190, .018) 0 1px, rgba(12, 6, 3, .025) 1px 3px), radial-gradient(ellipse at 50% 40%, var(--gallery-canvas-light) 0%, var(--gallery-canvas-center) 48%, var(--gallery-canvas-edge) 100%); box-shadow: inset 0 0 0 1px rgba(227, 184, 111, .08), inset 0 0 1.65em rgba(8, 4, 2, .68); cursor: pointer; transition: filter 180ms ease, text-shadow 180ms ease; }
.gallery-card::before { position: absolute; inset: 7%; border: 1px solid rgba(108, 61, 24, .22); border-radius: .15em; content: ''; opacity: 0; box-shadow: inset 0 0 1em rgba(255, 197, 92, .18), 0 0 .9em rgba(233, 158, 51, .22); pointer-events: none; transition: opacity 180ms ease; }
.gallery-card:hover, .gallery-card:focus-visible, .gallery-card.is-active { z-index: 2; outline: 0; filter: brightness(1.06) saturate(1.02); text-shadow: 0 0 .48em rgba(221, 162, 77, .28); }
.gallery-card:hover::before, .gallery-card:focus-visible::before, .gallery-card.is-active::before { opacity: 1; }
.gallery-card:nth-child(1) { left: 18.3%; top: 30.1%; width: 12%; height: 15%; }
.gallery-card:nth-child(2) { left: 32.8%; top: 30.1%; width: 10.5%; height: 15%; }
.gallery-card:nth-child(3) { --gallery-canvas-center: #422d22; --gallery-canvas-light: #5b3b27; left: 46%; top: 29.4%; width: 22.2%; height: 29.1%; }
.gallery-card:nth-child(4) { left: 14.6%; top: 50.6%; width: 13.3%; height: 15%; }
.gallery-card:nth-child(5) { left: 30.5%; top: 51.1%; width: 14.1%; height: 14.7%; }
.gallery-card:nth-child(6) { left: 14.8%; top: 70.1%; width: 12.2%; height: 15.5%; }
.gallery-card:nth-child(7) { left: 29.8%; top: 73%; width: 13.5%; height: 12.7%; }
.gallery-card:nth-child(8) { left: 45.9%; top: 67.7%; width: 10.1%; height: 17.8%; }
.gallery-card:nth-child(9) { left: 58.2%; top: 67.4%; width: 10.3%; height: 18.1%; }
.gallery-card__number, .gallery-card small, .gallery-card i, .gallery-card strong { position: relative; z-index: 1; }
.gallery-card__number { align-self: center; margin-bottom: .55em; color: var(--gallery-canvas-meta); font-size: max(.6em, 10px); font-weight: 800; letter-spacing: .12em; }
.gallery-card strong { margin: 0 0 .28em; color: var(--gallery-canvas-title); font-family: var(--font-serif, serif); font-size: clamp(.84em, 1vw, 1.22em); font-weight: 700; letter-spacing: .06em; line-height: 1.16; text-shadow: 0 1px 2px rgba(8, 4, 2, .72); text-wrap: balance; }
.gallery-card:nth-child(3) strong { font-size: clamp(1.05em, 1.3vw, 1.55em); }
.gallery-card small { color: #c18d52; font-size: max(.68em, 11px); font-weight: 600; }
.gallery-card i { margin-top: .62em; color: var(--gallery-canvas-meta); font-size: max(.6em, 10px); font-style: normal; font-weight: 700; letter-spacing: .12em; opacity: .82; }
.work-pagination { position: absolute; z-index: 7; left: 42.6%; top: 86.1%; display: flex; align-items: center; justify-content: center; gap: .38em; padding: .28em .42em; border: 1px solid rgba(91, 49, 23, .22); border-radius: 999px; background: rgba(219, 180, 111, .38); box-shadow: inset 0 1px rgba(255, 233, 184, .45); }
.work-pagination button { width: 2.15em; height: 2.15em; border: 1px solid transparent; border-radius: 50%; color: #6c3c20; background: transparent; font: 800 max(.74em, 11px) ui-monospace, monospace; cursor: pointer; transition: color 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease; }
.work-pagination button:hover { border-color: rgba(103, 55, 24, .35); background: rgba(239, 205, 143, .72); }
.work-pagination button.is-active { border-color: #7e4522; color: #fff2d1; background: #82441f; box-shadow: 0 0 .65em rgba(229, 153, 53, .42); }
.work-pagination button:focus-visible { outline: 2px solid var(--works-gold-bright); outline-offset: 2px; }
.work-detail { position: absolute; left: 72.2%; top: 37%; width: 11.7%; height: 43.6%; padding: 1.05em .85em 4.75em; color: var(--works-ink); overflow: hidden; }
.work-detail__eyebrow { display: flex; justify-content: space-between; gap: .5em; padding-bottom: .55em; border-bottom: 1px solid rgba(91, 49, 23, .22); color: var(--works-ink-soft); font-size: max(.62em, 10px); font-weight: 800; letter-spacing: .08em; }
.work-detail h2 { margin: .68em 0 .22em; font-family: var(--font-serif, serif); font-size: 1.18em; line-height: 1.14; letter-spacing: .04em; text-wrap: balance; }
.work-detail p { margin: .42em 0; font-size: max(.74em, 11px); line-height: 1.55; }
.work-author { color: #66391f; font-weight: 800; }
.work-level { color: var(--works-ink-soft); }
.work-detail .paper-tags { display: flex; flex-wrap: wrap; gap: .28em; margin: .66em 0 .35em; }
.work-detail .paper-tag { padding: .24em .5em; border: 1px solid rgba(109, 61, 27, .22); border-radius: 999px; color: #71452a; background: rgba(237, 206, 145, .42); font-size: max(.62em, 10px); }
.work-detail__label { margin: .78em 0 .12em !important; color: var(--works-ink-soft); font-size: max(.62em, 10px) !important; font-weight: 800; letter-spacing: .12em; }
.work-stats { display: flex; gap: .8em; margin: .72em 0; color: #8a4228; font-size: max(.72em, 11px); font-weight: 700; }
/* 喜欢/收藏为真实交互：登录后可点，点亮表示已点过 */
.work-stats .work-react { padding: .3em .85em; border: 1px solid rgba(138, 66, 40, .38); border-radius: 999px; color: #8a4228; background: rgba(138, 66, 40, .07); font: inherit; font-weight: 700; cursor: pointer; transition: background .15s ease, color .15s ease; }
.work-stats .work-react:hover { background: rgba(138, 66, 40, .16); }
.work-stats .work-react.is-active { border-color: #7f4823; color: #f6ecd9; background: #96572a; }
.work-detail .wood-action { position: absolute; left: .8em; right: .8em; bottom: .9em; width: calc(100% - 1.6em); min-height: 3.05em; border-color: rgba(255, 206, 132, .78); color: #fff3d2; background: linear-gradient(#a8632f, #74391a); box-shadow: inset 0 1px rgba(255, 224, 160, .42), 0 .35em .85em rgba(61, 28, 11, .3), 0 0 .95em rgba(214, 137, 47, .34); font-size: .82em; font-weight: 800; letter-spacing: .08em; }
.work-detail .wood-action::after { margin-left: .4em; content: "→"; }
.work-detail .wood-action:hover { border-color: #ffdc9c; background: linear-gradient(#c1763a, #8a4520); box-shadow: inset 0 1px rgba(255, 236, 187, .5), 0 .42em 1em rgba(61, 28, 11, .34), 0 0 1.4em rgba(232, 158, 58, .55); }
.work-preview-popover[hidden] { display: none; }
.work-preview-popover { position: fixed; z-index: 30; width: clamp(460px, 52vw, 860px); height: clamp(320px, 48vh, 620px); max-width: calc(100vw - 32px); max-height: calc(100vh - 32px); overflow: hidden; border: 2px solid #6e3e20; border-radius: .55em; color: #fde8bb; background: #20130c; box-shadow: 0 1.2em 2.5em rgba(22, 12, 5, .46); pointer-events: none; }
.work-preview-popover__bar, .work-preview-modal__bar { display: flex; align-items: center; gap: .6em; min-height: 2.45em; padding: 0 .8em; background: linear-gradient(90deg, #512c17, #85502a); font-size: max(.76em, 12px); }
.work-preview-popover__bar span, .work-preview-modal__bar span:first-child { overflow: hidden; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.work-preview-popover__bar small, .work-preview-modal__bar span:nth-child(2) { margin-left: auto; color: #e8c783; font-size: .84em; }
.work-preview-popover__body { height: calc(100% - 2.45em); background: #f4ead6; }
.work-preview-frame { display: block; width: 100%; height: 100%; border: 0; background: #f4ead6; }
.work-preview-frame[hidden] { display: none; }
/* 全屏预览：作品铺满整屏，右上角悬浮关闭与作者信息 */
.work-preview-modal { width: 100vw; height: 100vh; max-width: 100vw; max-height: 100vh; padding: 0; overflow: hidden; border: 0; border-radius: 0; background: #20130c; }
.work-preview-modal::backdrop { background: rgba(20, 10, 5, .65); backdrop-filter: blur(4px); }
.work-preview-modal__body { height: 100%; background: #f4ead6; }
.work-preview-frame--large { min-height: 100%; }
.work-preview-modal__hud { position: fixed; top: 14px; right: 16px; z-index: 5; display: flex; align-items: center; gap: 1em; max-width: min(38rem, 64vw); padding: .55em .65em .55em 1.05em; border: 1px solid rgba(255, 222, 164, .38); border-radius: .75em; color: #fde8bb; background: rgba(24, 13, 7, .88); box-shadow: 0 .8em 2.2em rgba(15, 8, 3, .5); backdrop-filter: blur(6px); }
.work-preview-modal__meta { display: grid; gap: .12em; min-width: 0; }
.work-preview-modal__meta strong { overflow: hidden; font-size: .92em; text-overflow: ellipsis; white-space: nowrap; }
.work-preview-modal__meta span { color: #e8c783; font-size: .74em; }
.work-preview-modal__meta small { overflow: hidden; color: #c9a76a; font-size: .68em; text-overflow: ellipsis; white-space: nowrap; }
.work-preview-modal__open { flex: none; color: #f1cf8d; font-size: .76em; font-weight: 700; text-decoration: none; }
.work-preview-modal__open:hover { color: #fff3d2; }
.work-preview-modal__hud button { flex: none; width: 2.3em; height: 2.3em; border: 1px solid rgba(255, 222, 164, .55); border-radius: 50%; color: #fff0ca; background: rgba(42, 19, 9, .6); font-size: 1.05em; cursor: pointer; }
.work-preview-modal__hud button:hover { color: #2b180e; background: #f6c66f; }

@media (prefers-reduced-motion: reduce) {
  .gallery-card, .gallery-card::before, .works-level-filter button, .works-type-filter button, .work-pagination button { transition: none; }
}

/* 到达遮罩：首帧渲染完立即自行淡出（纯 CSS 动画，不等任何脚本加载） */
.arrival-light { position: fixed; z-index: 45; inset: 92px 0 0; pointer-events: none; opacity: 0; background: radial-gradient(circle, rgba(255, 213, 133, .72), rgba(20, 10, 5, .97) 64%); animation: arrival-fade 520ms ease-out both; }
@keyframes arrival-fade { from { opacity: 1; } to { opacity: 0; } }
body.is-leaving .arrival-light { animation: none; opacity: 1; transition: opacity 280ms ease; }
body.is-leaving .detail-stage { transform: scale(1.045); opacity: .55; transition-duration: 320ms; }
.room-toast { position: fixed; z-index: 60; left: 50%; bottom: 4vh; min-width: 14em; max-width: min(90vw, 32em); padding: .8em 1.25em; border: 1px solid rgba(246, 198, 111, .56); border-radius: 999px; color: #ffe8ba; background: rgba(29, 17, 10, .94); box-shadow: 0 12px 34px rgba(0, 0, 0, .45); text-align: center; opacity: 0; transform: translate(-50%, 1em); pointer-events: none; transition: opacity 200ms ease, transform 200ms ease; }
.room-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.empty-note { grid-column: 1 / -1; align-self: center; margin: auto; color: #6f462b; text-align: center; }

@media (max-width: 1220px) {
  body.immersive-page { grid-template-rows: 82px minmax(0, 1fr); }
  .detail-stage { width: min(100vw, calc((100dvh - 82px) * 1.7779)); }
  .arrival-light { inset-block-start: 82px; }
}

@media (max-width: 760px) {
  body.immersive-page { height: auto; min-height: 100dvh; overflow: auto; grid-template-rows: 70px auto; }
  .detail-room { display: block; overflow: visible; background: #160c07; }
  .detail-stage { width: 100%; min-height: calc(100dvh - 70px); aspect-ratio: auto; padding: 5.2rem 1rem 2rem; overflow: visible; font-size: 14px; }
  .detail-background { position: fixed; top: 70px; height: calc(100dvh - 70px); object-fit: cover; opacity: .52; filter: blur(2px); }
  .workshop-trail { position: relative; top: auto; left: auto; margin-bottom: 1rem; }
  .competition-board, .deadline-board, .ai-board, .prompt-board, .prompt-book, .prompt-actions, .works-toolbar, .works-gallery, .work-detail { position: relative; inset: auto; width: auto; height: auto; margin: 0 0 1rem; padding: 1rem; border: 1px solid rgba(246, 198, 111, .35); border-radius: .75rem; background: rgba(222, 190, 137, .9); box-shadow: 0 12px 28px rgba(0,0,0,.3); }
  .board-toolbar, .prompt-toolbar { grid-template-columns: 1fr; height: auto; }
  .board-toolbar { flex-direction: column; align-items: stretch; }
  .board-toolbar .search-field { flex: 0 0 auto; max-width: none; }
  .wood-tabs { overflow-x: auto; padding-bottom: .25rem; }
  .competition-list, .prompt-list { flex: 0 0 auto; height: auto; grid-template-columns: 1fr; grid-template-rows: none; }
  .deadline-board, .ai-board, .work-detail { color: #3c2315; }
  .flame-guide { position: fixed; right: .8rem; bottom: .8rem; width: 64px; }
  .prompt-book { grid-template-columns: 1fr; gap: 0; }
  .book-summary, .book-copy { padding: .25rem .25rem .5rem; }
  .prompt-actions { display: flex; flex-wrap: wrap; }
  /* 手机上公告板/书页是自适应高度的流式卡片：列表不再内滚（跟随整页滚动），
     书页全文给个上限高度、超出仍可在框内滑动，避免一条长提示词把页面撑到很长。 */
  .prompt-list { overflow-y: visible; padding-right: 0; }
  .book-copy #prompt-full { max-height: 46vh; }
  .prompt-preview { padding: .9rem; }
  .prompt-preview__header, .prompt-preview__body, .prompt-preview__footer { padding-left: 1.1rem; padding-right: 1.1rem; }
  .works-toolbar { display: grid; }
  .works-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
  .gallery-card, .gallery-card:nth-child(n) { position: relative; inset: auto; width: auto; height: auto; aspect-ratio: 4 / 3; border: 5px solid #5b351c; }
  .arrival-light { inset-block-start: 70px; }

  /* 以下几处桌面端是「贴卡片底部」或「按舞台百分比」的绝对定位。手机布局把容器
     换成高度自适应的流式卡片后，这些定位失去参照，会直接叠在正文上——竞赛卡
     footer 与 meta 重叠（持续进行/已结束、奖励/查看详情 两两压字）即由此而来。 */
  .competition-card footer { position: static; margin-top: .5em; }
  .competition-card__host { display: block; }
  .work-detail .wood-action { position: static; width: 100%; margin-top: .75rem; }
  .works-level-filter,
  .works-type-filter,
  .work-pagination {
    position: relative;
    inset: auto;
    width: auto;
    margin: 0 0 .75rem;
  }
}

/* 作品投递台（悬浮窗）：整体复用 xh-auth 木质弹窗体系，这里只补投递台专属部件 */
.work-studio__panel { width: min(100%, 540px); }
.work-studio__tabs { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 1fr; }
.work-studio__kinds { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 0 14px; }
.work-studio__kinds button { display: grid; gap: 4px; padding: 10px 12px; border: 1px solid rgba(218, 156, 65, .3); border-radius: 12px; color: rgba(247, 229, 195, .75); background: rgba(255, 255, 255, .04); font: inherit; text-align: left; cursor: pointer; }
.work-studio__kinds button span { color: rgba(247, 229, 195, .55); font-size: 12px; }
.work-studio__kinds button.is-active { border-color: rgba(244, 200, 121, .65); color: #ffd98c; background: rgba(244, 200, 121, .1); box-shadow: inset 0 0 0 1px rgba(244, 200, 121, .35); }
.work-studio__kinds button:disabled { opacity: .45; cursor: not-allowed; }
.work-studio__editing { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; padding: 8px 12px; border: 1px solid rgba(244, 200, 121, .4); border-radius: 10px; color: #ffd98c; background: rgba(244, 200, 121, .08); font-size: 13px; }
.work-studio__editing b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-studio__editing button { margin-left: auto; }
.work-studio__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.work-studio__panel select { width: 100%; min-height: 46px; box-sizing: border-box; padding: 0 14px; border: 1px solid rgba(218, 156, 65, .3); border-radius: 12px; color: var(--xh-text, #f7e5c3); background: rgba(255, 255, 255, .04); font: inherit; }
.work-studio__panel select option { color: #2a1707; }
.work-studio__drop { display: grid; gap: 4px; place-items: center; min-height: 84px; padding: 14px; border: 1.5px dashed rgba(218, 156, 65, .45); border-radius: 12px; color: rgba(247, 229, 195, .6); background: rgba(255, 255, 255, .03); font-size: 13px; text-align: center; cursor: pointer; transition: border-color .18s ease, background .18s ease, color .18s ease; }
.work-studio__panel .work-studio__drop input[type="file"] { display: none; }
.work-studio__drop.is-dragover { border-color: #f4c879; color: #ffd98c; background: rgba(244, 200, 121, .12); }
.work-studio__drop.has-file { border-style: solid; border-color: rgba(244, 200, 121, .55); color: #ffd98c; }
.work-studio__row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 12px 0; border-top: 1px solid rgba(218, 156, 65, .18); }
.work-studio__row:first-child { border-top: 0; }
.work-studio__row-info { display: grid; flex: 1; gap: 2px; min-width: 12rem; }
.work-studio__row-info b { color: var(--xh-text, #f7e5c3); font-size: 14px; }
.work-studio__row-info span { color: rgba(247, 229, 195, .55); font-size: 12px; }
.work-studio__row-info .work-studio__reason { color: #e08f6a; }
.work-studio__status { flex: none; padding: 3px 10px; border: 1px solid rgba(218, 156, 65, .35); border-radius: 999px; color: rgba(247, 229, 195, .75); font-size: 12px; }
.work-studio__status.is-approved { color: #7dc290; border-color: rgba(125, 194, 144, .5); }
.work-studio__status.is-rejected { color: #e08f6a; border-color: rgba(224, 143, 106, .5); }
.work-studio__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.work-studio__actions a.xh-profile-mini-btn { display: inline-flex; align-items: center; text-decoration: none; }
.work-studio .work-studio__reject-reason { width: 9.5rem; min-height: 32px; padding: 0 12px; border-radius: 999px; font-size: 12.5px; }
.work-studio__empty { margin: 4px 0 0; color: rgba(247, 229, 195, .55); font-size: 13px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .flame-guide { animation: none; }
}