/* 桌上的物件「拿起來」之後的樣子：對話框鋪滿畫面，物件本身就是介面（收音機、筆電、地圖、筆記本、照片） */
.stage-dialog {
  position: fixed;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: auto;
  overscroll-behavior: contain;
  color: var(--ink);
  background: transparent;
}
.stage-dialog::backdrop { background: transparent; }
/* 背景暗幕放在 ::before，打開時單獨淡入 */
.stage-dialog::before { content: ''; position: fixed; inset: 0; z-index: -1; background: radial-gradient(ellipse at 50% 45%, rgba(46, 30, 18, 0.8), rgba(3, 2, 2, 0.94) 72%); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.stage { display: grid; place-items: center; min-height: 100%; padding: calc(var(--safe-top) + 3.6rem) var(--safe-right) var(--safe-bottom) var(--safe-left); }
.stage-close { position: fixed; z-index: 10; top: var(--safe-top); right: var(--safe-right); display: inline-flex; align-items: center; gap: 0.5rem; min-height: 2.75rem; padding: 0 1rem; border: 1px solid rgba(255, 214, 170, 0.4); border-radius: 999px; color: var(--ink); background: rgba(10, 7, 5, 0.78); font: 600 0.88rem var(--sans); letter-spacing: 0.08em; cursor: pointer; }
.stage-close span { font-size: 1.3rem; line-height: 1; }
.stage-close:hover { border-color: var(--ember-bright); }
.prototype-tag { display: inline-block; margin: 0 0 0.8rem; padding: 0.28rem 0.5rem; border: 1px solid rgba(255,174,118,0.4); color: var(--ember-bright); font-size: 0.67rem; letter-spacing: 0.1em; }

/* ── 收音機：正面照片＋疊在上面的螢幕、按鍵與旋鈕（位置以照片的百分比對齊） ── */
.radio-stage { grid-template-columns: minmax(0, 1fr); gap: clamp(1rem, 3vw, 2.5rem); width: 100%; max-width: 86rem; margin: 0 auto; }
.radio-window { justify-self: center; width: min(100%, calc((100dvh - var(--safe-top) - var(--safe-bottom) - 6rem) * 1.744)); }
.radio { position: relative; width: 100%; aspect-ratio: 1200 / 688; container-type: inline-size; filter: drop-shadow(0 2.5rem 2.2rem rgba(0, 0, 0, 0.7)); user-select: none; }
.radio__body { position: absolute; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }

.radio__lcd { position: absolute; left: 60.4%; top: 26.5%; width: 32.7%; height: 18.2%; display: grid; grid-template-rows: auto auto minmax(0, 1fr); overflow: hidden; padding: 0.8cqw 1.1cqw 0.5cqw; border-radius: 0.45cqw; color: rgba(200, 255, 138, 0.62); background: linear-gradient(180deg, #1b2410, #11170a); box-shadow: inset 0 0 1.4cqw rgba(0, 0, 0, 0.85); font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; transition: background 300ms ease, color 300ms ease; }
.radio__lcd::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(transparent 0 2px, rgba(0, 0, 0, 0.16) 2px 3px); pointer-events: none; }
.radio__lcd[data-playing='true'] { color: #d2ff98; background: radial-gradient(ellipse at 50% 60%, #2c3d18, #161f0c 75%); text-shadow: 0 0 0.6cqw rgba(190, 255, 120, 0.7); }
.lcd__row { display: flex; justify-content: space-between; margin: 0; font-size: 1.12cqw; line-height: 1.3; letter-spacing: 0.14em; }
.lcd__ticker { margin: 0.15cqw 0 0; overflow: hidden; white-space: nowrap; font: 700 1.85cqw/1.35 var(--sans); }
.lcd__ticker span { display: inline-block; }
.lcd__ticker.is-scrolling span { animation: lcd-ticker 9s ease-in-out infinite alternate; }
@keyframes lcd-ticker { 0%, 15% { transform: none; } 85%, 100% { transform: translateX(var(--ticker-shift, 0)); } }
.lcd__scope { display: block; width: 100%; height: 100%; min-height: 0; }

.radio__keys { position: absolute; inset: 0; pointer-events: none; }
.radio__key { position: absolute; top: 52.5%; width: 7%; height: 7.8%; padding: 0; border: 0; border-radius: 0.6cqw; color: rgba(232, 214, 180, 0.72); background: transparent; font: 700 1.15cqw/1 var(--sans); letter-spacing: -0.1em; pointer-events: auto; cursor: pointer; transition: transform 80ms ease, box-shadow 80ms ease, background 120ms ease, color 120ms ease; }
.radio__key:nth-child(1) { left: 60.5%; }
.radio__key:nth-child(2) { left: 69%; }
.radio__key:nth-child(3) { left: 77.6%; }
.radio__key:nth-child(4) { left: 85.97%; }
.radio__key:hover { background: rgba(255, 230, 190, 0.07); color: #f3e2bd; }
.radio__key:active,
.radio__key[aria-pressed='true'] { transform: translateY(0.18cqw); box-shadow: inset 0 0.4cqw 0.7cqw rgba(0, 0, 0, 0.75); color: #c8ff8a; text-shadow: 0 0 0.6cqw rgba(190, 255, 120, 0.8); }
.radio__key:focus-visible,
.radio__knob:focus-visible { outline: 2px solid var(--ember-bright); outline-offset: 2px; }
.radio__print { position: absolute; display: flex; justify-content: space-between; margin: 0; color: rgba(225, 205, 168, 0.55); font: 700 0.92cqw/1 var(--sans); letter-spacing: 0.16em; pointer-events: none; }
.radio__print span { width: 7cqw; text-align: center; }
.radio__print--keys { top: 61.8%; left: 60.5%; width: 32.5%; }
.radio__print--knobs { top: 89.8%; left: 63.5%; width: 28.5%; }
.radio__print--knobs span { width: 9.6cqw; }
.radio__knob { position: absolute; top: calc(80.4% - 4.8cqw); width: 9.6cqw; aspect-ratio: 1; margin-left: -4.8cqw; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer; transform: rotate(var(--turn, 0deg)); transition: transform 420ms cubic-bezier(0.3, 1.4, 0.5, 1); }
.radio__knob::after { content: ''; position: absolute; top: 12%; left: 50%; width: 0.4cqw; height: 2cqw; margin-left: -0.2cqw; border-radius: 1cqw; background: #ead3a0; box-shadow: 0 0 0.5cqw rgba(255, 210, 140, 0.6); }
.radio__knob:hover::after { background: #fff0c8; }
.radio__knob--tune { left: 68.3%; }
.radio__knob--volume { left: 87.2%; }
.radio__knob--volume[aria-pressed='true']::after { background: var(--ember); box-shadow: 0 0 0.6cqw rgba(216, 111, 66, 0.8); }

/* 播放器不顯示，只聽聲音：嵌入的 YouTube／Facebook 播放器移到畫面外（不用 display: none，避免瀏覽器不載入或暫停播放） */
.radio-side { position: fixed; top: 0; left: -10000px; width: 22rem; opacity: 0; pointer-events: none; }
.radio-monitor { padding: 1rem; border: 1px solid rgba(255, 214, 170, 0.22); border-radius: 0.8rem; background: linear-gradient(160deg, #1d1611, #0c0a08); box-shadow: 0 1.2rem 2.5rem rgba(0, 0, 0, 0.6); }
.radio-monitor__speaker { margin: 0 0 0.6rem; color: var(--ink-muted); font-size: 0.76rem; line-height: 1.5; }
.radio-monitor__idle { margin: 0; padding: 1.4rem 1rem; border: 1px dashed var(--line); color: var(--ink-muted); font-size: 0.85rem; text-align: center; }
.audio-embed { position: relative; aspect-ratio: 16 / 9; background: #000; }
.audio-embed--vertical { width: min(100%, calc(46dvh * 0.5625)); margin-inline: auto; aspect-ratio: 9 / 16; }
.audio-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.audio-status { min-height: 1.4rem; margin: 0.6rem 0 0.3rem; color: var(--ink-muted); font-size: 0.76rem; }
.radio-monitor a[hidden] { display: none; }
.radio-postcard { position: relative; margin: 0; padding: 0.5rem 0.5rem 0.45rem; color: #3a2c20; background: #efe6d2; box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.6); transform: rotate(-3deg); }
.radio-postcard::before { content: ''; position: absolute; top: -0.6rem; left: 50%; width: 4.5rem; height: 1.3rem; background: rgba(226, 204, 140, 0.82); transform: translateX(-50%) rotate(4deg); }
.radio-postcard img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.radio-postcard figcaption { padding-top: 0.35rem; color: #6b5a44; font-size: 0.62rem; line-height: 1.45; }
.radio-postcard a { color: inherit; }
/* 寬螢幕：明信片貼在收音機左下角，右欄只放播放器，直式影片才不會把版面撐高 */
@media (min-width: 901px) {
  .radio-stage { position: relative; }
  .radio-postcard { position: absolute; z-index: 2; left: max(0.5rem, 3%); bottom: max(var(--safe-bottom), 6%); width: clamp(11rem, 16vw, 15rem); transform: rotate(-6deg); }
  .audio-embed--vertical { width: min(100%, calc((100dvh - 19rem) * 0.5625)); }
}

/* ── 筆電：螢幕先顯示讀者版，右下角投稿 ── */
/* 外框是筆電正面照（AI 生成），用 border-image 九宮格切：螢幕黑色區域（98–1413 × 42–781 px）留給讀者版，邊框隨畫面伸縮 */
.stage-dialog--laptop .stage { container-type: inline-size; }
.laptop {
  --lw: min(84rem, 100cqw);
  width: var(--lw);
  border-style: solid;
  border-width: calc(var(--lw) * 42 / 1511) calc(var(--lw) * 98 / 1511) calc(var(--lw) * 70 / 1511);
  border-image: url('../assets/images/laptop-front.webp') 42 98 70 stretch;
  filter: drop-shadow(0 2rem 2.4rem rgba(0, 0, 0, 0.7));
}
.laptop__screen { position: relative; display: flex; flex-direction: column; height: calc(100dvh - var(--safe-top) - var(--safe-bottom) - 4rem - var(--lw) * 112 / 1511); min-height: 20rem; overflow: hidden; background: #d9d1c0; }
.laptop__bar { display: flex; align-items: center; gap: 0.8rem; padding: 0.45rem 0.8rem; color: #cfc5b4; background: #2b2723; font: 600 0.74rem var(--sans); }
.laptop__dots { display: flex; gap: 0.35rem; }
.laptop__dots i { width: 0.62rem; height: 0.62rem; border-radius: 50%; background: #d86f42; }
.laptop__dots i:nth-child(2) { background: #e0b54a; }
.laptop__dots i:nth-child(3) { background: #6aa05a; }
.laptop__url { flex: 1; margin: 0 2.6rem 0 0; padding: 0.18rem 0.8rem; border-radius: 999px; background: rgba(255, 255, 255, 0.08); text-align: center; letter-spacing: 0.06em; }
.laptop__view { flex: 1; overflow: auto; overscroll-behavior: contain; padding: clamp(0.5rem, 2vw, 1.5rem) clamp(0.5rem, 2vw, 1.5rem) 5rem; }
.laptop__view .paper { max-width: 68rem; margin: 0 auto; }
.laptop__compose { position: absolute; z-index: 2; right: clamp(0.8rem, 2vw, 1.6rem); bottom: clamp(0.8rem, 2vw, 1.6rem); display: inline-flex; align-items: center; gap: 0.5rem; min-height: 3rem; padding: 0 1.3rem; border: 0; border-radius: 999px; color: #f4ecd6; background: #a3402b; box-shadow: 0 0.8rem 1.6rem rgba(0, 0, 0, 0.45); font: 700 1rem var(--sans); letter-spacing: 0.06em; cursor: pointer; }
.laptop__compose:hover { background: #8a3220; }
.compose { position: absolute; z-index: 3; right: clamp(0.6rem, 2vw, 1.4rem); bottom: clamp(0.6rem, 2vw, 1.4rem); display: flex; flex-direction: column; width: min(36rem, calc(100% - 1.2rem)); max-height: calc(100% - 1.2rem); border: 1px solid rgba(255, 214, 170, 0.25); border-radius: 0.7rem; color: var(--ink); background: linear-gradient(160deg, #241a13, #100c09); box-shadow: 0 1.6rem 3.5rem rgba(0, 0, 0, 0.7); transform-origin: bottom right; animation: compose-in 320ms cubic-bezier(0.2, 0.85, 0.25, 1); }
@keyframes compose-in { from { opacity: 0; transform: translateY(1rem) scale(0.92); } }
.compose__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.6rem 0.6rem 0.6rem 1.1rem; border-bottom: 1px solid var(--line); }
.compose__bar h3 { margin: 0; font: 600 1.1rem var(--serif); }
.compose__close { min-height: 2.5rem; padding: 0 0.6rem; border: 0; color: var(--ink-muted); background: transparent; font: 600 0.85rem var(--sans); cursor: pointer; }
.compose__close:hover { color: var(--ink); }
.compose__form { margin: 0; padding: 1rem 1.1rem 1.1rem; overflow: auto; }

/* ── 地圖：從牆上取下、釘在畫面中央；對照照片是釘在地圖上的拍立得 ── */
/* 地圖本身是一張紙本地圖照片（AI 依 OpenStreetMap 重繪），四角用圖釘釘著 */
.map-sheet { position: relative; display: grid; justify-items: center; gap: 0.7rem; width: min(80rem, 100%); }
.map-sheet__title { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 0.2rem 1rem; margin: 0; }
.map-sheet__title .eyebrow { margin: 0; color: var(--ember-bright); }
.map-sheet__title h2 { margin: 0; color: var(--ink); font: 600 clamp(1.4rem, 3vw, 2.1rem)/1.2 var(--serif); }
.map-sheet { container-type: inline-size; }
.map-body { display: grid; justify-content: center; align-items: start; gap: 1.4rem; width: 100%; }
.map-frame { --map-h: calc(100dvh - var(--safe-top) - var(--safe-bottom) - 12rem); position: relative; width: min(100cqw, var(--map-h) * 1.5); box-shadow: 0 2.4rem 4rem rgba(0, 0, 0, 0.7); transition: width 380ms ease; }
.map-pin { z-index: 4; }
.map-canvas { position: relative; aspect-ratio: 3 / 2; }
.map-canvas__paper { display: block; width: 100%; height: 100%; object-fit: cover; user-select: none; }
.map-pin { position: absolute; z-index: 3; width: 1.15rem; height: 1.15rem; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ff9a80, #b4301d 60%, #6e160b); box-shadow: 0.25rem 0.45rem 0.4rem rgba(0, 0, 0, 0.45); }
.map-pin--tl { top: 0.6rem; left: 0.6rem; }
.map-pin--tr { top: 0.6rem; right: 0.6rem; }
.map-pin--bl { bottom: 0.6rem; left: 0.6rem; }
.map-pin--br { bottom: 0.6rem; right: 0.6rem; }
.map-credit { margin: 0; color: var(--ink-muted); font-size: 0.66rem; text-align: center; }
.map-credit a { color: inherit; }
.place-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem; }
.place-legend button { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 2.6rem; padding: 0.4rem 0.85rem 0.4rem 0.45rem; border: 0; border-radius: 0.2rem; color: #2b1d13; background: #efe4cc; box-shadow: 0 0.4rem 0.8rem rgba(0, 0, 0, 0.4); font: 700 1rem var(--hand); cursor: pointer; }
.place-legend button b { display: grid; width: 1.6rem; height: 1.6rem; place-items: center; border-radius: 50%; color: #fff; background: var(--ember); font-size: 0.75rem; }
.place-legend button[aria-pressed='true'] { border-color: #a3402b; color: #f4ecd6; background: #a3402b; }
.place-legend button[aria-pressed='true'] b { color: #a3402b; background: #f4ecd6; }
/* 地點：紅色圖釘＋手寫標籤，按得到的按鈕 */
.place-pin { position: absolute; z-index: 2; display: block; width: 2.75rem; height: 2.75rem; margin: -1.375rem 0 0 -1.375rem; padding: 0; border: 0; background: transparent; cursor: pointer; }
.place-pin__dot { display: grid; width: 1.8rem; height: 1.8rem; margin: 0.475rem; place-items: center; border-radius: 50%; color: #fff6e4; background: radial-gradient(circle at 35% 30%, #ff9a80, #b4301d 58%, #6e160b); box-shadow: 0.3rem 0.55rem 0.5rem rgba(0, 0, 0, 0.45); font: 800 0.8rem/1 var(--sans); text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); transition: transform 160ms ease; }
.place-pin__name { position: absolute; top: 0.7rem; left: 2.6rem; padding: 0.05rem 0.5rem; white-space: nowrap; color: #2b1d13; background: #fbf6ea; box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.3); font: 700 1rem/1.4 var(--hand); transform: rotate(-2deg); }
.place-pin--left .place-pin__name { right: 2.6rem; left: auto; transform: rotate(2deg); }
.place-pin:hover .place-pin__dot,
.place-pin.is-selected .place-pin__dot { transform: scale(1.2); }
.place-pin.is-selected .place-pin__name { color: #f4ecd6; background: #a3402b; }
.place-pin:focus-visible { outline: none; }
.place-pin:focus-visible .place-pin__dot { outline: 2px solid var(--ember-bright); outline-offset: 3px; }

.place-panel { position: relative; display: grid; align-content: start; gap: 1rem; margin-top: 1rem; animation: panel-in 300ms ease; }
@keyframes panel-in { from { opacity: 0; transform: translateY(0.8rem) rotate(1deg); } }
.place-panel__close { position: absolute; z-index: 2; top: -0.4rem; right: -0.2rem; display: grid; width: 2.4rem; height: 2.4rem; place-items: center; border: 0; border-radius: 50%; color: #f4ecd6; background: #3a2c20; box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.4); font-size: 1.3rem; cursor: pointer; }
.place-card { padding: 1rem 1.2rem 0.9rem; color: var(--paper-ink); background: #fbf6ea; box-shadow: 0 0.8rem 1.6rem rgba(0, 0, 0, 0.35); transform: rotate(-1deg); }
.place-card .eyebrow { margin: 0 0 0.2rem; color: #a3402b; }
.place-card h3 { margin: 0; font: 600 clamp(1.5rem, 3vw, 2rem)/1.2 var(--serif); }
.place-card > p:not([class]) { margin: 0.35rem 0 0; color: #4d3d2f; font-size: 0.88rem; line-height: 1.6; }
.place-reading { margin: 0.5rem 0 0; font-size: 0.8rem; }
.place-reading a { color: #a3402b; font-weight: 700; }
.polaroids { display: grid; grid-template-columns: 1fr 1fr; gap: 0.8rem; padding: 0.2rem 0.3rem; }
.polaroid { position: relative; margin: 0; padding: 0.45rem 0.45rem 0.5rem; color: #2a2018; background: #fffdf7; box-shadow: 0 0.8rem 1.4rem rgba(0, 0, 0, 0.42); transform: rotate(-3deg); }
.polaroid:nth-child(2) { transform: rotate(2.5deg); }
.polaroid::before { content: ''; position: absolute; z-index: 1; top: -0.4rem; left: 50%; width: 0.85rem; height: 0.85rem; margin-left: -0.42rem; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ff9a80, #b4301d 60%, #6e160b); box-shadow: 0 0.25rem 0.4rem rgba(0,0,0,0.4); }
.polaroid img,
.polaroid__placeholder { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.polaroid__placeholder { display: grid; place-items: center; color: #8d8579; background: repeating-linear-gradient(45deg, #c9c4bb 0 0.6rem, #c2bdb3 0.6rem 1.2rem); font: 700 0.85rem var(--sans); }
.polaroid__label { display: block; padding-top: 0.35rem; font: 700 1.05rem/1.3 var(--hand); }
.polaroid figcaption { color: #7a6a52; font-size: 0.58rem; line-height: 1.4; }
.polaroid a { color: inherit; }
/* 寬螢幕：照片釘在地圖右側；地圖點位會往左移，不被擋住 */
/* 寬螢幕：選了地點後，地圖往左讓出位置，照片釘在地圖右邊 */
@media (min-width: 900px) {
  .map-body:has(.place-panel:not([hidden])) { grid-template-columns: auto minmax(17rem, 23rem); }
  .map-body:has(.place-panel:not([hidden])) .map-frame { width: min(100cqw - 24.4rem, var(--map-h) * 1.5); }
  .place-panel { max-height: calc(var(--map-h) + 1rem); margin: 0; overflow: auto; padding: 0.6rem 0.4rem 1rem; scrollbar-width: none; }
  .place-panel__close { top: 0.2rem; right: 0.2rem; }
}

/* ── 筆記本：黑色精裝本，點封面翻開；翻頁時紙張沿著書背翻過去 ── */
.journal { --page-w: min(29rem, 42vw, calc((100dvh - var(--safe-top) - var(--safe-bottom) - 9rem) * 0.72)); position: relative; display: grid; justify-items: center; gap: 0.9rem; width: 100%; }
.journal__book { position: relative; width: var(--page-w); aspect-ratio: 0.72; perspective: 2600px; transition: transform 800ms cubic-bezier(0.3, 0.8, 0.3, 1); }
.journal[data-open='true'] .journal__book { transform: translateX(50%); }
/* 書口：封面右下露出的一疊紙 */
.journal__book::before { content: ''; position: absolute; inset: 0.6% -1.3% -1.8% 0.6%; border-radius: 0 0.4rem 0.4rem 0; background: linear-gradient(90deg, #d9ccb0, #f1e8d4 30%, #e2d6bb); box-shadow: 0 2rem 3rem rgba(0, 0, 0, 0.6); }
.journal__page,
.journal__verso,
.journal__leaf-front,
.journal__leaf-back {
  --rule: 2rem;
  position: absolute;
  inset: 0;
  overflow: auto;
  padding: var(--rule) 1.4rem var(--rule) 1.8rem;
  border-radius: 0 0.35rem 0.35rem 0;
  color: #26355a;
  background:
    linear-gradient(90deg, rgba(60, 40, 20, 0.16), transparent 7%),
    repeating-linear-gradient(transparent 0 calc(var(--rule) - 1px), rgba(84, 122, 168, 0.28) calc(var(--rule) - 1px) var(--rule)),
    #f5eedb;
  background-attachment: local;
  font-family: var(--hand);
  scrollbar-width: none;
}
.journal__page { z-index: 2; }
/* 左頁：翻過去的紙背（第二頁之後才出現） */
.journal__verso { z-index: 3; right: 100%; left: auto; width: 100%; border-radius: 0.35rem 0 0 0.35rem; background: linear-gradient(270deg, rgba(60, 40, 20, 0.16), transparent 7%), repeating-linear-gradient(transparent 0 calc(var(--rule) - 1px), rgba(84, 122, 168, 0.28) calc(var(--rule) - 1px) var(--rule)), #efe7d2; visibility: hidden; }
.journal[data-open='true'][data-turned='true'] .journal__verso { visibility: visible; }
.journal__leaf { position: absolute; inset: 0; z-index: 4; transform-origin: left center; transform-style: preserve-3d; pointer-events: none; }
.journal__leaf-front,
.journal__leaf-back { backface-visibility: hidden; box-shadow: -0.4rem 0 1.4rem rgba(0, 0, 0, 0.25); }
.journal__leaf-back { transform: rotateY(180deg); border-radius: 0.35rem 0 0 0.35rem; background-color: #efe7d2; }

.journal__cover { position: absolute; inset: 0; z-index: 5; padding: 0; border: 0; background: transparent; transform-origin: left center; transform-style: preserve-3d; cursor: pointer; transition: transform 900ms cubic-bezier(0.45, 0.05, 0.25, 1); }
.journal[data-open='true'] .journal__cover { z-index: 1; transform: rotateY(-180deg); }
.journal__cover:focus-visible { outline: none; }
.journal__cover:focus-visible .journal__front { outline: 2px solid var(--ember-bright); outline-offset: 4px; }
.journal__front,
.journal__inside { position: absolute; inset: 0; border-radius: 0.2rem 0.6rem 0.6rem 0.2rem; backface-visibility: hidden; }
.journal__front {
  display: grid;
  align-content: start;
  justify-items: center;
  gap: 1.1rem;
  padding-top: 27%;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(255, 255, 255, 0.07), transparent 55%),
    radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.025) 0 1px, transparent 1.5px) 0 0 / 5px 5px,
    linear-gradient(90deg, #070707, #161616 6%, #121212 60%, #0d0d0d);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05), inset 0.6rem 0 0.9rem rgba(0, 0, 0, 0.55), 0 2rem 3rem rgba(0, 0, 0, 0.7);
}
.journal__shovel { width: 11%; height: auto; filter: drop-shadow(0 1px 0 rgba(0, 0, 0, 0.6)); }
.journal__motto { padding-inline: 1rem; background: linear-gradient(120deg, #f7dd8f, #c4913b 55%, #e8c46c); -webkit-background-clip: text; background-clip: text; color: transparent; font: 500 calc(var(--page-w) * 0.052) / 1.2 Georgia, "Times New Roman", serif; letter-spacing: 0.02em; }
.journal__band { position: absolute; top: -1.2%; bottom: -1.2%; right: 12%; width: 4.4%; border-radius: 0.15rem; background: repeating-linear-gradient(90deg, #050505 0 2px, #1c1c1c 2px 3px), #0a0a0a; box-shadow: -0.25rem 0 0.4rem rgba(0, 0, 0, 0.55), 0.15rem 0 0.3rem rgba(0, 0, 0, 0.4); }
.journal__inside { display: grid; place-items: center; transform: rotateY(180deg); border-radius: 0.6rem 0.2rem 0.2rem 0.6rem; background: linear-gradient(270deg, rgba(0, 0, 0, 0.18), transparent 8%), #e6dcc3; }
.journal__label { padding: 0.8rem 1.3rem; border: 1.5px solid #a3402b; color: #a3402b; background: #f4ecd6; font: 700 1.25rem/1.6 var(--hand); text-align: center; transform: rotate(-3deg); }
.journal__pen { position: absolute; top: 6%; left: calc(50% - var(--page-w) / 2 - 3.2rem); width: auto; height: calc(var(--page-w) / 0.72 * 0.74); filter: drop-shadow(0.6rem 1rem 0.8rem rgba(0, 0, 0, 0.6)); transform: rotate(-5deg); transition: left 800ms cubic-bezier(0.3, 0.8, 0.3, 1), transform 800ms ease; pointer-events: none; }
.journal[data-open='true'] .journal__pen { left: calc(50% + var(--page-w) + 1.4rem); transform: rotate(6deg); }
.journal__nav { gap: 1.5rem; padding: 0; color: #e7dac3; transition: opacity 300ms ease; }
.journal[data-open='true'] .journal__nav { transform: none; }
.journal[data-open='false'] .journal__nav { visibility: hidden; opacity: 0; }
.journal__nav button { color: #f2e4c4; }
.journal__hint { position: absolute; bottom: -0.2rem; margin: 0; color: #e7dac3; font: 700 1.05rem var(--hand); transition: opacity 300ms ease; pointer-events: none; }
.journal[data-open='true'] .journal__hint { opacity: 0; }

.notebook-nav { display: flex; align-items: center; justify-content: space-between; font-size: 0.9rem; }
.notebook-nav button { min-height: 2.75rem; border: 0; background: transparent; font: 700 1.05rem var(--hand); cursor: pointer; }
.notebook-nav button:disabled { opacity: 0.3; cursor: default; }
.note-page { position: relative; }
.note-page > * { margin: 0; line-height: var(--rule); }
.note-tape { position: absolute; z-index: 1; top: -1.4rem; right: 1.4rem; width: 6.5rem; height: 1.7rem; background: rgba(226, 204, 140, 0.78); box-shadow: 0 1px 3px rgba(0,0,0,0.25); transform: rotate(5deg); }
.note-date { display: inline-block; margin: 0.3rem 0 0.2rem !important; padding: 0 0.45rem; line-height: 1.5rem !important; color: #a3402b; box-shadow: inset 0 0 0 1.5px currentColor; font: 700 0.78rem/1.5rem var(--sans); letter-spacing: 0.08em; transform: rotate(-2deg); }
.note-page h3 { font: 700 1.6rem/var(--rule) var(--hand); letter-spacing: 0.02em; }
.note-page p { font-size: 1.08rem; }
.note-page mark { padding: 0 0.1em; color: inherit; background: linear-gradient(transparent 55%, rgba(255, 214, 72, 0.75) 55%); }
.note-page s { text-decoration-color: #b8392b; text-decoration-thickness: 2px; color: rgba(38, 53, 90, 0.6); }
.note-page .note-gap { height: var(--rule); }
.note-page--sparse .note-gap { height: calc(var(--rule) * 2); }
.note-doodle { position: absolute; z-index: 1; top: 0.2rem; right: 0.4rem; color: #a3402b; pointer-events: none; }
.note-doodle--crown { font: 400 2.6rem/1 var(--hand); transform: rotate(10deg); }
.note-doodle--crown i { position: absolute; top: 2.8rem; font: 700 1.3rem/1 var(--hand); font-style: normal; }
.note-doodle--crown i:first-of-type { left: -0.3rem; color: #2f6b3a; }
.note-doodle--crown i:last-of-type { left: 1.6rem; }
.note-doodle--ticket { top: auto; bottom: -5.5rem; right: 0.5rem; display: grid; gap: 0.1rem; width: 7.5rem; padding: 0.45rem 0.6rem; border: 1px dashed rgba(38, 53, 90, 0.5); color: #26355a; background: #e3edf2; box-shadow: 0 2px 6px rgba(0,0,0,0.2); font: 700 0.62rem/1.2 var(--sans); letter-spacing: 0.12em; transform: rotate(7deg); }
.note-doodle--ticket i { font-size: 1.3rem; font-style: normal; }
.note-page .note-margin { margin-top: var(--rule); color: #a3402b; transform: rotate(-1.2deg); transform-origin: left; }

/* ── 照片：拿在手上的一疊，點照片翻到背面看字 ── */
.photo-hand { display: grid; justify-items: center; gap: 0.6rem; width: min(40rem, 100%); }
.photo-hand__meta { margin: 0; color: var(--ink-muted); font: 600 0.8rem var(--sans); letter-spacing: 0.12em; }
.photo-hand__hint { margin: 0; color: #e7dac3; font: 700 1.05rem var(--hand); }
.photo-stack { display: grid; place-items: center; width: 100%; padding: 1.4rem 0.5rem 0.6rem; }
.stack-card { grid-area: 1 / 1; width: min(100%, 34rem, calc((100dvh - var(--safe-top) - var(--safe-bottom) - 15rem) * 1.2)); padding: 0; border: 0; background: transparent; perspective: 1800px; cursor: pointer; transition: transform 320ms ease, opacity 260ms ease; }
.stack-card__inner { position: relative; display: grid; transform-style: preserve-3d; transition: transform 700ms cubic-bezier(0.45, 0.05, 0.3, 1); }
.stack-card.is-flipped .stack-card__inner { transform: rotateY(180deg); }
.stack-card__face { grid-area: 1 / 1; display: grid; align-content: start; padding: 0.65rem 0.65rem 0; color: #403025; background: #e8dcc2; box-shadow: 0 1rem 2.2rem rgba(0, 0, 0, 0.6); backface-visibility: hidden; }
.stack-card__face--back { align-content: center; justify-items: center; gap: 0.9rem; padding: 1.5rem; background: radial-gradient(ellipse at 30% 20%, rgba(255, 255, 255, 0.4), transparent 60%), #ece2cb; text-align: center; transform: rotateY(180deg); }
.stack-card img,
.stack-card__placeholder { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: sepia(0.18); }
.stack-card__placeholder { display: grid; place-items: center; color: #8d8579; background: repeating-linear-gradient(45deg, #c9c4bb 0 0.6rem, #c2bdb3 0.6rem 1.2rem); font: 700 1.1rem var(--sans); letter-spacing: 0.1em; filter: none; }
.stack-card__caption { padding: 0.55rem 0.2rem 0.8rem; text-align: left; font: 700 1.05rem var(--hand); }
.stack-card__date { padding: 0 0.5rem; color: #a3402b; box-shadow: inset 0 0 0 1.5px currentColor; font: 700 0.85rem/1.7 var(--sans); letter-spacing: 0.08em; transform: rotate(-3deg); }
.stack-card__note { color: #26355a; font: 700 clamp(1.3rem, 3.4vw, 2rem)/1.5 var(--hand); }
.stack-card__place { color: #7a6a52; font: 400 0.95rem var(--hand); }
.stack-card[data-depth='0'] { transform: rotate(-1.5deg); }
.stack-card[data-depth='1'] { transform: translate(0.9rem, -0.5rem) rotate(3.5deg); }
.stack-card[data-depth='2'] { transform: translate(-0.9rem, -0.8rem) rotate(-5deg); }
.stack-card:not([data-depth='0']):not([data-depth='1']):not([data-depth='2']) { transform: translate(0.4rem, -1.1rem) rotate(6deg); }
.stack-card:not([data-depth='0']) { pointer-events: none; filter: brightness(0.82); }
.stack-card[data-depth='0']:hover { transform: rotate(-1.5deg) translateY(-0.3rem); }
.stack-card.is-leaving { transform: translateX(70%) rotate(12deg) !important; opacity: 0; }
.photo-stack__nav { display: flex; align-items: center; justify-content: center; gap: 1.2rem; color: var(--ink-muted); font-size: 0.85rem; }
.photo-stack__nav button { width: 2.75rem; height: 2.75rem; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: transparent; cursor: pointer; }
.photo-stack__nav button:hover { border-color: var(--ember-bright); }

/* ── 總編 CHECK LIST：板夾照片（AI 生成）上的紙；收起時板夾滑到畫面下緣，只露出夾子和標題 ── */
.checklist {
  --peek: 8.6rem;
  --cw: min(19rem, calc(100vw - 2rem));
  width: var(--cw);
  aspect-ratio: 564 / 900;
  /* 紙張在板夾照片裡的位置（以板夾寬度換算；padding 的 % 會以視窗為準，所以不用 %） */
  padding: calc(var(--cw) * 0.286) calc(var(--cw) * 0.075) calc(var(--cw) * 0.1);
  border-radius: 0;
  background: url('../assets/images/clipboard.webp') center / 100% 100% no-repeat;
  box-shadow: none;
  filter: drop-shadow(0 1.2rem 1.4rem rgba(0, 0, 0, 0.6));
  transform: rotate(-1.2deg);
  transition: transform 450ms cubic-bezier(0.3, 0.8, 0.3, 1);
}
.checklist::before { content: none; }
.checklist.is-collapsed { transform: rotate(-1.2deg) translateY(calc(100% - var(--peek))); }
.checklist.is-collapsed .checklist__body { display: block; visibility: hidden; transition: visibility 0s 450ms; }
.checklist__toggle,
.checklist__body { background: transparent; }
.checklist__toggle { min-height: 2.6rem; padding: 0 0.2rem 0.3rem; }
.checklist__toggle::after { content: '收起 ▾'; margin-left: 0.4rem; color: #8a7458; font: 400 0.68rem var(--sans); letter-spacing: 0; }
.checklist__toggle[aria-expanded='false']::after { content: '展開 ▴'; }
.checklist__body { padding: 0 0.2rem; }
/* 紅筆打勾：看完物件後，勾勾一筆畫上去 */
.checklist__tick { position: absolute; top: -0.55rem; left: -0.15rem; width: 1.7rem; height: 1.7rem; overflow: visible; fill: none; stroke: #b8392b; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 34; stroke-dashoffset: 34; transition: stroke-dashoffset 520ms cubic-bezier(0.6, 0, 0.3, 1) 120ms; }
.checklist__item.is-checked .checklist__tick { stroke-dashoffset: 0; }
.checklist__item.is-checked .checklist__box::after { content: none; }

@media (max-width: 900px) {
  .radio-stage { grid-template-columns: 1fr; align-content: start; }
  .radio-side { grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr); align-items: start; }
}

@media (max-width: 720px) {
  .stage { padding-top: calc(var(--safe-top) + 3.4rem); }
  /* 手機：收音機拉近，只看右半邊的螢幕和按鍵，按鍵才夠大好按 */
  .radio-window { width: 100%; overflow: hidden; border-radius: 1rem; }
  .radio { width: 232%; margin-left: -130%; filter: none; }
  .radio-side { grid-template-columns: 1fr; }
  .radio-postcard { width: 82%; justify-self: center; }
  .laptop { --lw: 100cqw; border-width: 0.7rem 1.1rem 1.1rem; }
  .laptop__screen { height: calc(100dvh - var(--safe-top) - var(--safe-bottom) - 5.6rem); }
  .laptop__url { margin-right: 0; }
  .laptop__compose { right: 0.7rem; bottom: 0.7rem; }
  .compose { inset: auto 0.35rem 0.35rem; width: auto; max-height: calc(100% - 0.7rem); }
  .board-form__row { grid-template-columns: 1fr; }
  .paper-post:first-child { display: block; }
  /* 手機：地圖放大到可以左右拖著看 */
  .map-frame { width: 100%; box-shadow: none; }
  .map-scroll { overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; box-shadow: 0 1.6rem 3rem rgba(0, 0, 0, 0.7); }
  .map-canvas { width: 130%; }
  .journal { --page-w: min(82vw, calc((100dvh - var(--safe-top) - var(--safe-bottom) - 9rem) * 0.72)); }
  /* 手機放不下跨頁：封面翻開後收起來，只看右頁 */
  .journal[data-open='true'] .journal__book { transform: none; }
  .journal[data-open='true'] .journal__cover { opacity: 0; transition: transform 900ms cubic-bezier(0.45, 0.05, 0.25, 1), opacity 250ms ease 650ms; }
  .journal__verso,
  .journal[data-open='true'][data-turned='true'] .journal__verso { visibility: hidden; }
  .journal__pen { left: calc(50% - var(--page-w) / 2 - 2.1rem); height: calc(var(--page-w) / 0.72 * 0.6); }
  .journal[data-open='true'] .journal__pen { left: calc(50% - var(--page-w) / 2 - 2.1rem); opacity: 0; }
  .journal__page { padding: var(--rule) 1rem var(--rule) 1.4rem; }
  .note-page p { font-size: 1.02rem; }
  .note-tape { right: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  .journal__book,
  .journal__cover,
  .journal__pen,
  .stack-card__inner,
  .radio__knob { transition-duration: 1ms; }
  .lcd__ticker.is-scrolling span { animation: none; }
}

/* ── 出發：抽獎登記＋滿意度（一定要留 Email 才能投票） ── */
.feedback__lottery { display: inline-flex; align-items: center; gap: 0.45rem; margin: 0 0 1.4rem; padding: 0.45rem 0.95rem; color: #f4ecd6; background: #a3402b; box-shadow: 0 0.4rem 0.8rem rgba(0, 0, 0, 0.25); font: 700 1.05rem var(--sans); letter-spacing: 0.04em; transform: rotate(-1.5deg); }
.feedback__vote { display: flex; flex-wrap: wrap; gap: 0.9rem; margin: 0 0 1.3rem; padding: 0; border: 0; }
.feedback__vote legend { width: 100%; margin-bottom: 0.7rem; padding: 0; color: var(--paper-ink); font: 600 1.25rem var(--serif); }
.vote-button { display: grid; justify-items: center; gap: 0.3rem; width: 6.6rem; padding: 0.9rem 0.5rem 0.7rem; border: 2px solid #3a2c20; border-radius: 0.8rem; color: #3a2c20; background: transparent; font: 700 0.9rem var(--sans); cursor: pointer; transition: background 150ms ease, color 150ms ease, transform 150ms ease; }
.vote-button svg { width: 2.4rem; height: 2.4rem; fill: currentColor; }
.vote-button--down svg { transform: rotate(180deg); }
.vote-button:hover { transform: translateY(-2px); }
.vote-button--up[aria-pressed='true'] { border-color: #2f6b3a; color: #f4ecd6; background: #2f6b3a; }
.vote-button--down[aria-pressed='true'] { border-color: #a3402b; color: #f4ecd6; background: #a3402b; }
.feedback__label { display: block; margin-bottom: 0.35rem; color: var(--paper-ink); font: 600 1rem var(--serif); }
.feedback input[type='email'] { width: 100%; min-height: 3rem; padding: 0 0.9rem; border: 1px solid rgba(39, 29, 22, 0.35); border-radius: 0; color: var(--paper-ink); background: #fbf6ea; }
.feedback__consent { display: flex; align-items: flex-start; gap: 0.55rem; margin: 0.9rem 0 0.4rem; color: #4d3d2f; font-size: 0.9rem; cursor: pointer; }
.feedback__consent input { flex: none; width: 1.15rem; height: 1.15rem; margin-top: 0.2rem; accent-color: #a3402b; }
.feedback__privacy { margin: 0 0 0.9rem; color: #7a6a52; font-size: 0.74rem; line-height: 1.65; }
.feedback .form-status { color: #2f5a2c; background: rgba(143, 181, 140, 0.25); }
.feedback .form-status[data-kind='error'] { border-color: #a3402b; color: #8a2a18; background: rgba(163, 64, 43, 0.12); }
.feedback .form-footer small { color: #7a6a52; }
.depart-dialog .eyebrow { color: #a3402b; }

/* 全部確認完：「出發」按鈕一直輕輕跳動、發光，提醒玩家可以出發了 */
.checklist.is-ready .checklist__depart:not(:disabled) { animation: depart-call 1.8s ease-in-out infinite; }
@keyframes depart-call {
  0%, 100% { transform: none; box-shadow: 0 0 0 0 rgba(163, 64, 43, 0.55); }
  12% { transform: scale(1.05) rotate(-1deg); }
  24% { transform: scale(0.98) rotate(0.8deg); }
  36% { transform: none; }
  60% { box-shadow: 0 0 0 0.75rem rgba(163, 64, 43, 0); }
}
.polaroids--single { grid-template-columns: minmax(0, 0.62fr); justify-content: center; }

/* 收合的板夾：滑鼠移上去會往上浮一點，提示可以拉上來 */
.checklist.is-collapsed { cursor: pointer; }
.checklist.is-collapsed:hover,
.checklist.is-collapsed:focus-within { transform: rotate(-1.2deg) translateY(calc(100% - var(--peek) - 1.1rem)); }

/* 手機：板夾佔滿畫面寬度貼在底部、不歪斜；用九宮格（border-image）切板夾照片，高度跟著內容走，夾子不會變形 */
@media (max-width: 720px) {
  .checklist {
    --cw: 100vw;
    --peek: calc(var(--cw) * 160 / 564 + 2.6rem);
    right: 0;
    bottom: 0;
    width: 100%;
    aspect-ratio: auto;
    padding: 0 0.4rem 0.3rem;
    border-style: solid;
    border-width: calc(var(--cw) * 160 / 564) calc(var(--cw) * 40 / 564) calc(var(--cw) * 57 / 564);
    border-image: url('../assets/images/clipboard.webp') 160 40 57 fill stretch;
    background: none;
    transform: none;
  }
  .checklist.is-collapsed { transform: translateY(calc(100% - var(--peek))); }
  .checklist.is-collapsed:hover,
  .checklist.is-collapsed:focus-within { transform: translateY(calc(100% - var(--peek) - 0.6rem)); }
  .checklist__toggle { gap: 0.5rem; font-size: 0.95rem; letter-spacing: 0.04em; white-space: nowrap; }
}

/* 筆記本：頁面本身可以點來翻頁；右下角捲起一點紙角提示 */
.journal[data-open='true'] .journal__page,
.journal[data-open='true'][data-turned='true'] .journal__verso { cursor: pointer; }
.journal__page::after { content: ''; position: absolute; right: 0; bottom: 0; width: 2.2rem; height: 2.2rem; background: linear-gradient(135deg, transparent 50%, rgba(60, 40, 20, 0.08) 50%, #e4d8bd 58%, #f5eedb 100%); box-shadow: -0.2rem -0.2rem 0.4rem rgba(0, 0, 0, 0.12); border-top-left-radius: 0.4rem; opacity: 0; transition: opacity 200ms ease, width 200ms ease, height 200ms ease; pointer-events: none; }
.journal[data-open='true'] .journal__page::after { opacity: 1; }
.journal[data-open='true'] .journal__page:hover::after { width: 3rem; height: 3rem; }

/* 讀者版的「往下捲」提示：滑鼠滾輪圖示＋往下跳的箭頭 */
.scroll-hint { position: absolute; z-index: 2; left: 50%; bottom: 1.1rem; display: grid; justify-items: center; gap: 0.35rem; margin: 0; padding: 0.55rem 0.9rem 1.2rem; border-radius: 1rem; color: #f4ecd6; background: rgba(31, 26, 20, 0.78); font: 600 0.74rem var(--sans); letter-spacing: 0.08em; transform: translateX(-50%); pointer-events: none; transition: opacity 300ms ease; }
.scroll-hint i { position: relative; width: 1.1rem; height: 1.7rem; border: 2px solid currentColor; border-radius: 0.6rem; }
.scroll-hint i::before { content: ''; position: absolute; top: 0.3rem; left: 50%; width: 0.22rem; height: 0.42rem; margin-left: -0.11rem; border-radius: 0.2rem; background: currentColor; animation: scroll-wheel 1.6s ease-in-out infinite; }
.scroll-hint i::after { content: ''; position: absolute; left: 50%; bottom: -0.85rem; width: 0.45rem; height: 0.45rem; margin-left: -0.25rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); animation: scroll-arrow 1.6s ease-in-out infinite; }
.scroll-hint.is-hidden { opacity: 0; }
@keyframes scroll-wheel { 0% { opacity: 1; transform: translateY(0); } 70% { opacity: 0; transform: translateY(0.55rem); } 100% { opacity: 0; } }
@keyframes scroll-arrow { 0%, 100% { opacity: 0.4; transform: translateY(0) rotate(45deg); } 50% { opacity: 1; transform: translateY(0.3rem) rotate(45deg); } }
@media (max-width: 720px) { .scroll-hint { bottom: 4.6rem; } .scroll-hint i { display: none; } .scroll-hint span::after { content: ' ↓'; } }

/* 圖釘：AI 生成的紅色圖釘照片；釘尖在圖片底部中央，對準要釘的位置 */
.map-pin,
.polaroid::before,
.place-pin__dot { background: url('../assets/images/pushpin.webp') center bottom / contain no-repeat; border-radius: 0; box-shadow: none; filter: drop-shadow(0.22rem 0.3rem 0.18rem rgba(0, 0, 0, 0.45)); }
.map-pin { width: 1.05rem; height: 1.65rem; }
.map-pin--tl, .map-pin--tr { top: -0.6rem; }
.map-pin--bl, .map-pin--br { bottom: 0.4rem; }
.polaroid::before { top: -0.9rem; width: 0.95rem; height: 1.5rem; margin-left: -0.48rem; }
.place-pin__dot { position: absolute; left: 50%; bottom: 50%; display: block; width: 1.15rem; height: 1.8rem; margin: 0 0 0 -0.58rem; transform-origin: 50% 100%; }
.place-pin:hover .place-pin__dot,
.place-pin.is-selected .place-pin__dot { transform: scale(1.15) rotate(-6deg); }
.place-pin__name { top: -0.4rem; left: 2.4rem; }
.place-pin--left .place-pin__name { right: 2.4rem; }
.place-pin__name b { margin-right: 0.3rem; color: #a3402b; font: 800 0.8rem var(--sans); }
.place-pin.is-selected .place-pin__name b { color: #f4ecd6; }
.feedback__event { margin: -0.6rem 0 1.2rem; padding: 0.7rem 0.9rem; border-left: 3px solid #a3402b; color: #3a2c20; background: rgba(163, 64, 43, 0.08); font: 600 0.95rem/1.6 var(--serif); }
.feedback__event strong { color: #a3402b; font-family: var(--sans); letter-spacing: 0.04em; }
/* 讀者版沒有報頭，第一則留言就在最上面；置頂留言加一個小標 */
.laptop__view .paper { padding-top: clamp(1rem, 2.5vw, 1.6rem); }
.paper-post__pin { padding: 0.05rem 0.4rem; color: #f4ecd6; background: #a3402b; font-size: 0.65rem; letter-spacing: 0.1em; }