/* Skin B 經紀人手帳物語：溫暖木桌、手帳紙、紙膠帶、縫線、貼紙按鈕、軟木公佈欄、拍立得。 */
@import url('https://fonts.googleapis.com/css2?family=Huninn&family=Kiwi+Maru:wght@400;500&family=Zen+Maru+Gothic:wght@500;700;900&display=swap');

:root {
  --ink: #5d5754; --muted: #8a7a70; --paper: #fffdf9; --line: #e9dfd4;
  --pink: #ff829b; --pink-deep: #c7456a; --mint: #78c2a4; --honey: #f6af42;
  --good: #25805a; --bad: #d4405f;
  --focus: #e0587a;
  --title-font: "Kiwi Maru", "Huninn", "Zen Maru Gothic", "Microsoft JhengHei", "PingFang TC", serif;
  --tape-pink: repeating-linear-gradient(45deg, rgba(255, 170, 190, .9) 0 6px, rgba(255, 205, 216, .9) 6px 12px);
  --tape-mint: repeating-linear-gradient(-45deg, rgba(150, 214, 188, .9) 0 6px, rgba(196, 236, 218, .9) 6px 12px);
  --tape-honey: repeating-linear-gradient(90deg, rgba(250, 200, 110, .9) 0 5px, rgba(255, 226, 160, .9) 5px 10px);
  --tape-lav: radial-gradient(circle, rgba(255, 255, 255, .7) 1.5px, transparent 2px) 0 0 / 8px 8px, rgba(196, 176, 240, .9);
  --paper-shadow: 2px 5px 14px rgba(93, 70, 50, .22), 0 1px 1px rgba(93, 70, 50, .12);
}
body {
  /* Huninn (jf open 粉圓) first: Kiwi Maru / Zen Maru Gothic lack common TC glyphs such as 你 她 吧 說 */
  font-family: "Huninn", "Zen Maru Gothic", "Microsoft JhengHei", "PingFang TC", "Noto Sans TC", sans-serif; color: var(--ink);
  background-color: #dcb88c;
  background-image:
    repeating-linear-gradient(0deg, rgba(140, 90, 45, .07) 0 1px, transparent 1px 7px),
    repeating-linear-gradient(0deg, transparent 0 118px, rgba(120, 75, 35, .22) 118px 120px),
    linear-gradient(90deg, rgba(255, 255, 255, .08), transparent 40%, rgba(255, 255, 255, .06));
}
h2, h3, h4, .logo, .mname, .rname { font-family: var(--title-font); font-weight: 500; }

/* 按鈕：軟萌立體貼紙 */
button { color: #fff; background: var(--pink-deep); border: 3px solid #fff; border-radius: 16px; box-shadow: 0 4px 0 #9c3050, 0 6px 14px rgba(93, 70, 50, .25); text-shadow: 0 1px 0 rgba(150, 40, 70, .35); }
button:active { box-shadow: 0 1px 0 #9c3050, 0 2px 5px rgba(93, 70, 50, .2); }
button.secondary { background: #2e8062; box-shadow: 0 4px 0 #1f5e45, 0 6px 14px rgba(93, 70, 50, .25); text-shadow: 0 1px 0 rgba(20, 70, 50, .35); }
button.ghost { color: var(--ink); background: var(--paper); border: 2px solid var(--line); box-shadow: 0 3px 0 var(--line); text-shadow: none; }
.neg { color: var(--bad); }
.muted { color: var(--muted); }

/* 頂欄：手帳上緣 + 紙膠帶 */
.topbar { background: var(--paper); box-shadow: 0 4px 12px rgba(93, 70, 50, .2); }
.topbar::after { content: ''; position: absolute; left: 0; right: 0; bottom: -7px; height: 7px; background: var(--tape-pink); opacity: .9; }
.topbar .logo { color: var(--pink-deep); text-shadow: 2px 2px 0 #ffe1e8; }
.topbar .pill { background: #fff7ec; border: 2px dashed #ecd9c4; border-radius: 999px; }
.topbar .pill > i { background: #fff; box-shadow: 0 0 0 2px #ecd9c4; }
.topbar .pill.date { background: var(--pink-deep); color: #fff; border: 2px solid #fff; box-shadow: 0 2px 0 #9c3050; }
.topbar .pill.money > i { background: #ffe6b3; }
.topbar .pill.money.neg { color: var(--bad); border-color: #f5a3b4; background: #fff0f2; }
.topbar .pill.fame > i { background: #fff3a6; }
.topbar .stage-pill > i { background: #ffd6e0; }
.topbar .pill.race > i { background: #ffe6b3; }
.topbar .pill.race.ahead { border-color: var(--mint); border-style: solid; }
.topbar .pill.race.behind { border-color: #f5a3b4; border-style: solid; }
.topbar .pill.race .trend { margin-left: 4px; font-size: .85em; }
.topbar .pill.race .trend.up { color: #2f9e6e; }
.topbar .pill.race .trend.down { color: var(--bad); }
.topbar .goal-pill > i { background: #d9f2e6; }
.topbar .goal-pill.ok { border-color: var(--mint); border-style: solid; }
.topbar .goal-gift { background: #fff4c8; border-color: #f2c94c; }
.topbar .goal-gift > i { background: #ffe6b3; }
.topbar .pill.danger { background: var(--bad); color: #fff; border: 2px solid #fff; font-weight: bold; animation: wobble 1.6s ease-in-out infinite; }
.topbar .pill.danger > i { background: #fff; }
@keyframes wobble { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-2deg); } 75% { transform: rotate(2deg); } }

/* 休息室：貼在手帳上的照片 */
.boss-note { color: #5d4a3a; background: #fff6a8; border-radius: 2px 2px 10px 2px; box-shadow: 2px 4px 8px rgba(93, 70, 50, .28); }
.monkey-say { color: var(--ink); background: var(--paper); border: 2px solid #8a7a70; border-radius: 12px 12px 12px 2px; box-shadow: 0 3px 8px rgba(93, 70, 50, .25); }
.boss-note small { color: var(--pink-deep); }
.office { border: 8px solid #fff; border-radius: 6px; box-shadow: var(--paper-shadow); }
.office::before { content: ''; position: absolute; top: 8px; right: 10px; z-index: 0; width: 60px; height: 26px; background: var(--tape-mint); transform: rotate(8deg); }   /* fix S-8: under the walkers, so it never covers a lounge bubble */
.walker .name { background: #fff; color: var(--ink); border-radius: 999px; font-weight: bold; box-shadow: 0 1px 3px rgba(93, 70, 50, .25); }
@media (max-width: 700px) { .office { border-width: 6px; } }

/* 卡片：手帳內頁 */
.card {
  background: var(--paper) linear-gradient(transparent 23px, #f4ece1 24px) 0 12px / 100% 24px;
  border-radius: 14px 18px 12px 16px; box-shadow: var(--paper-shadow);
  outline: 2px dashed #eedfce; outline-offset: -7px;
}
.card.member::before, .tip::before { content: ''; position: absolute; top: -9px; left: -14px; width: 74px; height: 24px; transform: rotate(-32deg); background: var(--tape-pink); box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
.card.member[data-who="stella"]::before { background: var(--tape-honey); }
.card.member[data-who="kuu"]::before { background: repeating-linear-gradient(45deg, rgba(255, 176, 122, .9) 0 6px, rgba(255, 214, 180, .9) 6px 12px); }
.card.member[data-who="aity"]::before { background: repeating-linear-gradient(45deg, rgba(140, 200, 240, .9) 0 6px, rgba(200, 232, 250, .9) 6px 12px); }
.card.member[data-who="okami"]::before { background: var(--tape-lav); }
.tip { background: #fff6cf; outline-color: #f3dc90; }
.tip::before { background: var(--tape-mint); }

.member .avatar { background: radial-gradient(circle at 50% 60%, #fff 0 55%, transparent 56%), #ffe4ea; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 2px #f6c7d3, 0 3px 8px rgba(93, 70, 50, .15); width: 84px; height: 84px; }
.member .control { border-top: 2px dashed #eadccb; padding-top: .55em; }
.member .reminder { color: var(--pink-deep); background: #fff0f3; border: 2px dashed var(--pink); border-radius: 999px; }
.member .on-job { font-weight: bold; }
.name-row .avg { background: var(--honey); color: #fff; border-radius: 999px; font-weight: bold; text-shadow: 0 1px 0 #c98418; }
.stat { background: #fff; border: 2px solid var(--tint); border-radius: 999px; box-shadow: 0 2px 0 var(--tint); }
.stat > i { background: var(--tint); }
.stat > small { color: var(--muted); }
.stat.sing { --tint: #ffc6d3; } .stat.dance { --tint: #bfe8d4; } .stat.talk { --tint: #ffe29a; } .stat.charm { --tint: #dccbff; }
.gauge > span { color: var(--muted); }
.gauge.stress > span::before { content: '🌡️'; margin-right: .15em; }
.gauge.mood > span::before { content: '💗'; margin-right: .15em; }
.gauge .bar { background: #f3e8da; border-radius: 999px; box-shadow: inset 0 1px 2px rgba(93, 70, 50, .18); }
.gauge .bar > i { border-radius: 999px; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); }
.gauge.stress .bar > i { background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .25) 0 5px, transparent 5px 10px), linear-gradient(90deg, #ffc2a8, #ff6f7f); }
.gauge.mood .bar > i { background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .25) 0 5px, transparent 5px 10px), linear-gradient(90deg, #b5ecd2, #4fb888); }
@media (max-width: 700px) { .member .avatar { width: 64px; height: 64px; } }

/* 活動貼紙 */
.sticker { color: var(--ink); background: var(--tint); border: 3px solid #fff; border-radius: 18px; box-shadow: 0 3px 0 rgba(93, 70, 50, .16), 0 4px 10px rgba(93, 70, 50, .12); text-shadow: none; transform: rotate(var(--tilt, -1.5deg)); }
.sticker:nth-child(even) { --tilt: 1.5deg; }
.sticker:hover { transform: rotate(var(--tilt)) translateY(-2px); }
.sticker.on { background: var(--tint-on); transform: rotate(0) translateY(2px) scale(1.04); box-shadow: 0 0 0 3px var(--pink-deep), 0 1px 0 rgba(93, 70, 50, .2); }
.sticker.on::after { background: var(--pink-deep); color: #fff; border: 2px solid #fff; }
[data-act="lesson_sing"] { --tint: #ffe0e7; --tint-on: #ffadc0; }
[data-act="lesson_dance"] { --tint: #dcf3e8; --tint-on: #9edcc0; }
[data-act="lesson_talk"] { --tint: #fff2c9; --tint-on: #ffd873; }
[data-act="lesson_charm"] { --tint: #ece3ff; --tint-on: #c8b2ff; }
[data-act="stream"] { --tint: #dcefff; --tint-on: #a4d4fb; }
[data-act="rest"] { --tint: #ffe9da; --tint-on: #ffc39c; }

/* 地圖：地塊名牌、成員小貼紙、案子圖釘 */
.plan-bar button.on, .album-tabs button.on { background: var(--pink-deep); color: #fff; border-color: #fff; box-shadow: 0 2px 0 #9c3050; }
.visit-row > b { color: #5b3d22; background: rgba(255, 253, 249, .85); padding: .05em .7em; border-radius: 999px; }
.visit-row .muted { color: #5b3d22; background: rgba(255, 253, 249, .7); padding: .1em .6em; border-radius: 6px; }
.who { color: var(--ink); background: var(--paper); border: 2px solid #fff; border-radius: 999px; box-shadow: 0 3px 0 var(--line), 0 3px 8px rgba(93, 70, 50, .18); text-shadow: none; }
.who.on { background: #ffe1e8; box-shadow: 0 0 0 3px var(--pink-deep), 0 3px 8px rgba(93, 70, 50, .2); }
.who.done:not(.on) .wn { color: var(--muted); }
.town { border: 8px solid #fff; border-radius: 10px; box-shadow: var(--paper-shadow); }
.plot .tag { color: var(--ink); background: rgba(255, 253, 249, .93); border: 2px solid #fff; border-radius: 12px; box-shadow: 0 2px 0 rgba(93, 70, 50, .25), 0 3px 8px rgba(93, 70, 50, .2); font-weight: bold; }
.plot .tag small { color: var(--muted); }
.plot.act.on .tag { background: #ffe1e8; box-shadow: 0 0 0 3px var(--pink-deep), 0 3px 8px rgba(93, 70, 50, .2); }
.plot.act[aria-disabled="true"] { cursor: default; }
.plot.work .tag { background: #fff5bf; }
.plot.locked .tag { background: rgba(240, 232, 245, .88); color: #7a6a80; font-weight: normal; }
.plot.locked::after { background: #5d5754; color: #fff; border-radius: 6px; }
.plot .eye { background: var(--honey); color: #fff; border-radius: 999px; border: 2px solid #fff; font-weight: bold; text-shadow: 0 1px 0 #c98418; }
.plot.visit .tag { outline: 3px dashed var(--honey); outline-offset: 2px; }
.pin { color: var(--ink); background: #fff; border: 2px solid #fff; border-radius: 8px; box-shadow: 0 2px 4px rgba(60, 35, 10, .3); text-shadow: none; }
.pin.full .pc { color: #256b4f; }
.pin.taken { background: #f1ecff; }
.pin.on { background: var(--pink-deep); color: #fff; }
.pin.on .pc { color: #fff; }
.pin.mandatory { box-shadow: 0 0 0 2px #ff9fb3, 0 2px 4px rgba(60, 35, 10, .3); }
.pin.big { font-weight: 700; background: linear-gradient(135deg, #fff1b8, #ffd9ea); border-color: #f5c04a; box-shadow: 0 0 10px 2px rgba(245, 192, 74, .85); }
.pin.big.on { background: var(--pink-deep); }
.pin.limited { background: #f3eeff; border-color: #b9a6f0; }
.pin.limited.on { background: var(--pink-deep); }
.pin[aria-disabled="true"] { cursor: default; }
.terms .place { background: #fff; }
.name-row .trust { background: #e4f4ec; color: #256b4f; border-radius: 999px; font-weight: bold; }
.walker .bubble { background: #fff; color: var(--ink); border: 2px solid #f6c7d3; border-radius: 12px; box-shadow: 0 2px 6px rgba(93, 70, 50, .25); }
.lounge-say { color: var(--ink); background: rgba(255, 253, 249, .92); border: 2px solid #f6c7d3; box-shadow: 0 2px 6px rgba(93, 70, 50, .2); }
.walker .bubble::after { content: ''; position: absolute; left: var(--tail, 50%); bottom: -8px; margin-left: -6px; border: 6px solid transparent; border-top-color: #f6c7d3; border-bottom: 0; }

/* 軟木公佈欄與通告便條 */
.board {
  align-self: start; padding: 1em .9em .3em; border: 10px solid #b27d4e; border-radius: 12px;
  background: radial-gradient(rgba(95, 60, 25, .3) 1px, transparent 1.6px) 0 0 / 7px 7px, radial-gradient(rgba(255, 240, 210, .25) 1px, transparent 1.6px) 3px 4px / 9px 9px, #cfa476;
  box-shadow: inset 0 2px 8px rgba(60, 35, 10, .35), 2px 6px 16px rgba(93, 70, 50, .3);
}
.board-title { background: var(--paper); padding: .15em .9em; border-radius: 4px; transform: rotate(-2deg); box-shadow: 1px 2px 4px rgba(0, 0, 0, .2); }
.job { background: #fff5bf; border-radius: 3px; outline: none; box-shadow: 1px 4px 8px rgba(60, 35, 10, .3); transform: rotate(-.8deg); padding-top: 1.2em; }
.job:nth-of-type(3n+2) { background: #ffe0e8; transform: rotate(.9deg); }
.job:nth-of-type(3n) { background: #daf3e6; transform: rotate(-.4deg); }
.job::before { content: ''; position: absolute; top: 5px; left: 50%; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #fff 0 2px, #ff6f8e 3px, #d44a6c); box-shadow: 1px 2px 2px rgba(0, 0, 0, .3); }
.job.mandatory { background: #fff; box-shadow: 0 0 0 3px #ff9fb3, 1px 4px 8px rgba(60, 35, 10, .3); }
.job.mandatory h4 { color: var(--pink-deep); }
.job.big { background: linear-gradient(160deg, #fff8dc, #ffeef6); box-shadow: 0 0 0 3px #f5c04a, 1px 4px 10px rgba(245, 192, 74, .45); }
.job.big h4 { color: #b07a00; }
.job.limited { background: #f8f4ff; box-shadow: 0 0 0 3px #b9a6f0, 1px 4px 8px rgba(122, 92, 199, .3); }
.job.limited h4 { color: #7a5cc7; }
.terms span { background: rgba(255, 255, 255, .7); border-radius: 6px; }
.terms .need { background: var(--ink); color: #fff; }
.pick { color: var(--ink); background: #fff; border: 2px solid #fff; border-radius: 999px; box-shadow: 0 2px 0 rgba(93, 70, 50, .2); text-shadow: none; }
.pick.full { border-color: var(--mint); color: #256b4f; }
.pick.on { background: var(--pink-deep); color: #fff; border-color: #fff; box-shadow: 0 0 0 2px var(--pink-deep); }
.job .ok { color: var(--good); font-weight: bold; }
.board > .muted { color: #5b3d22; background: rgba(255, 253, 249, .8); padding: .3em .8em; border-radius: 4px; }

.sticky-footer { background: var(--paper); box-shadow: 0 -4px 14px rgba(93, 70, 50, .25); }
.sticky-footer::before { content: ''; position: absolute; left: 0; right: 0; top: -6px; height: 6px; background: var(--tape-pink); }
.errors { color: var(--bad); }
.hint { color: #5b3d22; }

/* 疊加畫面 */
#scene { background: rgba(80, 55, 35, .5); backdrop-filter: blur(3px); }
#scene.talk, #scene.title, #scene.ending { background: none; backdrop-filter: none; }
#scene.talk::before { filter: blur(3px) brightness(.93) saturate(.95); }
.dialog {
  background: var(--paper) linear-gradient(transparent 27px, #f4ece1 28px) 0 16px / 100% 28px; color: var(--ink);
  border: 3px solid #fff; border-radius: 20px; box-shadow: 0 8px 24px rgba(93, 70, 50, .3);
  outline: 2px dashed #f2c7d2; outline-offset: -10px;
}
.dialog::before { content: ''; position: absolute; top: -10px; right: 36px; width: 90px; height: 24px; background: var(--tape-mint); transform: rotate(5deg); }
.dialog .who { background: var(--pink-deep); color: #fff; border: 3px solid #fff; border-radius: 10px; transform: rotate(-3deg); box-shadow: 0 3px 6px rgba(93, 70, 50, .25); font-family: var(--title-font); }
.stage:has(.boss) .who { background: #3b2a33; box-shadow: 0 0 0 2px #e0405a, 0 3px 6px rgba(0, 0, 0, .3); }
.dialog .next { color: var(--muted); }
.stage img.portrait { filter: drop-shadow(0 10px 18px rgba(93, 70, 50, .35)); }
/* fix V-1: the floor — an opaque band from the dialog's top edge to the bottom of the screen, as wide as the screen, so her cut bottom
   edge is behind something solid even where she is wider than the box (phones, tall desktop windows). It is the box's own shadow, offset
   down by its spread (top edge flat at the box top; no layout change), with a 4px white edge on top. */
.stage .dialog { box-shadow: 0 8px 24px rgba(93, 70, 50, .3), 0 100vmax 0 100vmax #f3e2d8, 0 calc(100vmax - 4px) 0 100vmax #fff; }
.stage img.portrait.boss { background: #fff; border-radius: 4px; padding: 14px 14px 46px; aspect-ratio: 330 / 362; transform: rotate(-2.5deg); box-shadow: 0 10px 24px rgba(60, 35, 10, .35); filter: none; }
.stage .actor.boss .frame::before { content: ''; position: absolute; z-index: 1; top: -12px; left: 50%; width: 110px; height: 28px; margin-left: -55px; background: var(--tape-pink); transform: rotate(-4deg); }
.chip { background: #f6eee4; border-radius: 999px; }
.chip.up { color: var(--good); } .chip.down { color: var(--bad); }

#scene .center.card { border-radius: 16px; outline-offset: -9px; }
#scene .center.card::after { content: ''; position: absolute; top: -12px; left: 32px; right: 32px; height: 24px; background: radial-gradient(circle at 50% 70%, transparent 4px, #a8927c 4px 6px, transparent 6.5px) 0 0 / 30px 24px repeat-x; }
#scene .center.card h3, #scene .center.card h2 { display: inline-block; padding: 0 .3em; background: linear-gradient(transparent 58%, #ffd3de 58% 92%, transparent 92%); }

/* 週結算：拍立得 */
.result-card { background: #fff; border-radius: 3px; box-shadow: 1px 5px 14px rgba(93, 70, 50, .28); transform: rotate(-1.5deg); }
.result-card:nth-child(even) { transform: rotate(1.3deg); }
.result-card::before { content: ''; position: absolute; top: -10px; left: 50%; z-index: 1; width: 72px; height: 22px; margin-left: -36px; background: var(--tape-pink); transform: rotate(-3deg); }
.result-card[data-who="stella"]::before { background: var(--tape-honey); }
.result-card[data-who="kuu"]::before { background: var(--tape-mint); }
.result-card[data-who="aity"]::before { background: var(--tape-lav); }
.result-card .photo { background: linear-gradient(160deg, #fdf0f4, #f4ecff); }
.result-card p { color: var(--ink); }
.stamp { font-family: var(--title-font); border: 3px solid currentColor; border-radius: 10px; background: rgba(255, 255, 255, .88); box-shadow: inset 0 0 0 2px #fff, inset 0 0 0 3.5px currentColor; letter-spacing: .05em; }
.stamp.great { color: #d98200; }
.stamp.fail { color: #4d74c9; }
.stamp.collapse { color: var(--bad); }

/* 星座卡 */
.sign { color: var(--ink); background: #fff; border: 2px solid #fff; border-radius: 14px; box-shadow: 0 3px 0 var(--line), 0 4px 10px rgba(93, 70, 50, .12); text-shadow: none; outline: 2px dashed #efe2d2; outline-offset: -6px; }
.sign .glyph { color: var(--pink-deep); }
.sign small span { background: #f6eee4; border-radius: 6px; color: var(--muted); }
.sign small span.key { background: #ffe29a; color: var(--ink); font-weight: bold; }
.sign.rec { background: #fff6d8; box-shadow: 0 0 0 3px var(--honey), 0 4px 10px rgba(93, 70, 50, .15); }
.sign.rec::before { content: ''; position: absolute; top: -8px; left: 50%; width: 46px; height: 16px; margin-left: -23px; background: var(--tape-honey); transform: rotate(-4deg); }
.sign.birth { background: #fff0f4; box-shadow: 0 0 0 3px var(--pink-deep), 0 4px 10px rgba(93, 70, 50, .15); }
.sign .birth-tag { position: absolute; top: -.85em; left: 50%; transform: translateX(-50%) rotate(-3deg); z-index: 1; white-space: nowrap; padding: 0 .6em; font-size: .7em; color: #fff; background: var(--pink-deep); border: 2px solid #fff; border-radius: 999px; }
.zodiac-pick .muted { color: #6f625a; }

/* 帳本 */
.ledger { background: var(--paper); }
.ledger td { border-bottom: 2px dashed #eadccb; }
.ledger tr.total td { border-top: 3px double var(--ink); border-bottom: 0; font-size: 1.1em; background: #fff3c4; }
.help-list li { background: #fff; border-radius: 10px; box-shadow: 0 2px 6px rgba(93, 70, 50, .12); }
.help-list li:nth-child(odd) { background: #fffaf0; }
.help-list li::before { background: var(--pink-deep); color: #fff; }

/* 標題 */
#scene.title::before { filter: saturate(1.05); }
.title h1 { font-family: var(--title-font); color: var(--pink-deep); text-shadow: 3px 0 0 #fff, -3px 0 0 #fff, 0 3px 0 #fff, 0 -3px 0 #fff, 2px 2px 0 #fff, -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 0 7px 0 #f7b3c4, 0 10px 18px rgba(120, 60, 90, .35); }
.title .sub { color: #fff; background: var(--pink-deep); clip-path: polygon(0 0, 100% 0, 96% 50%, 100% 100%, 0 100%, 4% 50%); padding: .25em 2.2em; }
.title .walkers { background: rgba(255, 253, 249, .88); border-radius: 18px; box-shadow: var(--paper-shadow); position: relative; }
.title .walkers::before { content: ''; position: absolute; top: -10px; left: 18px; width: 70px; height: 22px; background: var(--tape-mint); transform: rotate(-6deg); }
.title .errors { background: rgba(255, 253, 249, .9); border-radius: 10px; padding: .4em 1em; }

/* 結局 */
.lineup img { filter: drop-shadow(0 0 12px rgba(255, 255, 255, .5)); }
.final { color: var(--ink); }

/* 結局收藏冊：手帳裡的貼紙收集頁 */
.album h4 { font-family: var(--title-font); color: var(--pink-deep); }
.album h4 .count { background: var(--honey); color: #fff; border-radius: 999px; text-shadow: 0 1px 0 #c98418; font-family: "Huninn", sans-serif; }
.album-grid li.seen { background: #fff; border: 2px solid #fff; border-radius: 14px; box-shadow: 0 3px 0 var(--line), 0 4px 10px rgba(93, 70, 50, .14); transform: rotate(-1.2deg); }
.album-grid li.seen:nth-child(even) { transform: rotate(1.2deg); background: #fff8ef; }
.album-grid li.seen small { color: var(--muted); }
.album-grid li.unseen { background: rgba(243, 235, 224, .7); border: 2px dashed #decbb6; border-radius: 14px; color: #b7a493; }
.album-grid li.unseen .ico { font-weight: bold; }
.album-note .note-list li { background: #fff; border-radius: 999px; box-shadow: 0 2px 0 var(--line); color: var(--pink-deep); }
.choices .style-tag { display: inline-block; margin-right: .3em; padding: 0 .55em; font-size: .78em; color: var(--pink-deep); background: #fff; border-radius: 999px; text-shadow: none; }
/* 手帳印章（批次 L）：成功紅章、休息綠章、信賴章 */
.stamp.success { color: var(--pink-deep); }
.stamp.rest { color: var(--good); }
.stamp.steady { color: #b86b14; }
.duo-line { color: #b0476b; }
.duo-line.done { color: var(--good); }
.audio-fold > summary { color: var(--ink); background: var(--paper); border: 2px solid var(--line); box-shadow: 0 3px 0 var(--line); }
.stamp.train { color: #e0602a; }