/* OneOneTyping v6 — 打字高考 (exam.html, assets/js/pages/exam.js).
   An official look: navy and gold for the exam centre, a sheet of paper for
   the papers themselves, red and gold for the admission letter. */

.ex-page { --ex-navy: #14284f; --ex-navy-2: #1f3a6b; --ex-gold: #e2b85c; --ex-red: #b3121d; --ex-paper: #fffdf7; }

/* ---------------------------------------------------------------- hero */
.ex-hero { position: relative; width: calc(min(var(--max), 100%) - 2 * var(--gutter)); margin: calc(var(--nav-h) + 20px) auto 0; border-radius: 24px; padding: 44px 0 46px; background: radial-gradient(900px 400px at 85% -10%, rgba(226, 184, 92, .28), transparent 70%), linear-gradient(160deg, var(--ex-navy) 0%, var(--ex-navy-2) 70%, #2a4a82 100%); color: #eef2fa; overflow: hidden; }
.ex-hero::after { content: ''; position: absolute; inset: auto 0 0 0; height: 4px; background: linear-gradient(90deg, transparent, var(--ex-gold), transparent); opacity: .7; }
.ex-hero > .wrap { max-width: none; padding: 0 40px; }
.ex-hero-in { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 40px; align-items: center; }
.ex-eyebrow { margin: 0 0 10px; color: var(--ex-gold); font-size: 13px; font-weight: 700; letter-spacing: .12em; }
.ex-hero h1 { margin: 0; color: #fff; font-size: clamp(26px, 3.3vw, 46px); white-space: nowrap; line-height: 1.2; font-family: 'Songti SC', 'STSong', 'Noto Serif SC', serif; font-weight: 900; letter-spacing: .02em; }
.ex-lead { margin: 16px 0 0; max-width: 560px; color: #c9d3e6; font-size: 16px; line-height: 1.7; }
.ex-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.ex-meta li { padding: 5px 12px; border: 1px solid rgba(226, 184, 92, .35); border-radius: 999px; color: #e7ecf6; font-size: 13px; }
.ex-meta b { color: var(--ex-gold); }
.ex-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.ex-cta .btn svg { width: 18px; height: 18px; margin-right: 6px; }
.ex-cta .btn-ghost { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .3); color: #fff; }
.ex-free { margin: 16px 0 0; color: #9fb0cf; font-size: 13px; }
.ex-free a { color: #fff; text-decoration: underline; }
.ex-mine { display: flex; flex-direction: column; gap: 6px; padding: 24px; border: 1px solid rgba(226, 184, 92, .4); border-radius: 20px; background: rgba(255, 255, 255, .06); backdrop-filter: blur(6px); }
.ex-mine-k { color: #9fb0cf; font-size: 13px; }
.ex-mine-total { color: var(--ex-gold); font-size: 56px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.ex-mine-total small { color: #9fb0cf; font-size: 18px; font-weight: 600; }
.ex-mine-total.is-none { color: #c9d3e6; font-size: 34px; }
.ex-mine-tier { color: #fff; font-size: 16px; font-weight: 700; }
.ex-mine-rank { color: #c9d3e6; font-size: 13.5px; }
.ex-mine-rank b { color: #fff; }
.ex-mine .btn { align-self: flex-start; margin-top: 8px; background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .3); color: #fff; }
.ex-mine .btn svg { width: 15px; height: 15px; margin-right: 5px; }

/* ---------------------------------------------------------------- body */
.ex-body { padding-top: 36px; padding-bottom: 64px; }
.ex-sec { margin-bottom: 28px; }
.ex-h { margin: 0 0 14px; color: var(--text-strong); font-size: 20px; }
.ex-card { padding: 22px 24px; border: 1px solid var(--line-soft); border-radius: 20px; background: var(--bg-elevated); box-shadow: var(--shadow-sm); }
.ex-papers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ex-paper-card { position: relative; padding: 20px 22px; border: 1px solid var(--line-soft); border-radius: 18px; background: var(--bg-elevated); box-shadow: var(--shadow-sm); overflow: hidden; }
.ex-paper-card.is-yuwen { --c: #c8202a; }
.ex-paper-card.is-waiyu { --c: #2f8be0; }
.ex-paper-card.is-zonghe { --c: #d69e2e; }
/* 科目用一枚淡色小牌子区分，不用卡片顶上的彩色条（站长不喜欢边上的彩条） */
.ex-paper-no { display: inline-block; padding: 3px 10px; border-radius: 999px; background: color-mix(in srgb, var(--c) 12%, transparent); color: var(--c); font-size: 12.5px; font-weight: 700; }
.ex-paper-card h3 { margin: 4px 0 6px; color: var(--text-strong); font-size: 22px; font-family: 'Songti SC', 'STSong', 'Noto Serif SC', serif; }
.ex-paper-card p { margin: 0 0 14px; color: var(--text-muted); font-size: 13.5px; line-height: 1.6; min-height: 2.6em; }
.ex-paper-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
.ex-paper-card dl div { padding: 8px 10px; border-radius: 10px; background: var(--bg-soft); }
.ex-paper-card dt { color: var(--text-dim); font-size: 11.5px; }
.ex-paper-card dd { margin: 0; color: var(--text-strong); font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ex-paper-card dd small { color: var(--text-dim); font-size: 11px; font-weight: 600; }
.ex-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; margin-bottom: 28px; }
.ex-two .ex-sec { margin: 0; }
.ex-rules { display: grid; gap: 8px; margin: 0 0 20px; padding: 0; list-style: none; }
.ex-rules li { position: relative; padding-left: 16px; color: var(--text-muted); font-size: 14px; line-height: 1.6; }
.ex-rules li::before { content: ''; position: absolute; left: 0; top: .65em; width: 6px; height: 6px; border-radius: 50%; background: var(--ex-gold); }
.ex-rules b { color: var(--text-strong); }
.ex-rules:last-child { margin-bottom: 0; }
.ex-tiers { width: 100%; border-collapse: collapse; }
.ex-tiers td { padding: 10px 8px; border-bottom: 1px solid var(--line-soft); vertical-align: middle; }
.ex-tiers tr:last-child td { border-bottom: 0; }
.ex-tier-range { width: 88px; color: var(--text-strong); font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ex-tier-level { display: inline-block; min-width: 52px; padding: 3px 8px; border-radius: 999px; background: var(--bg-soft); color: var(--text-muted); font-size: 12px; font-weight: 700; text-align: center; }
.ex-tiers b { display: block; color: var(--text-strong); font-size: 14.5px; }
.ex-tiers small { color: var(--text-dim); font-size: 12.5px; }
.ex-tiers .is-t1 .ex-tier-level { background: linear-gradient(135deg, #f6d27a, #d69e2e); color: #4a2d00; }
.ex-tiers .is-t2 .ex-tier-level { background: #e6edf9; color: #1f3a6b; }
.ex-tiers .is-t3 .ex-tier-level { background: #e5f7ec; color: #1f7a45; }
.ex-note { margin: 12px 0 0; color: var(--text-dim); font-size: 12.5px; }
.ex-board-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.ex-board-head .ex-h { margin: 0; }
.ex-board { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.ex-board li { display: grid; grid-template-columns: 30px 32px minmax(0, 1fr) auto 64px; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; }
.ex-board li.is-me { background: var(--accent-tint); }
.ex-rank { color: var(--text-dim); font-weight: 800; text-align: center; font-variant-numeric: tabular-nums; }
.ex-board li:nth-child(1) .ex-rank { color: #d69e2e; }
.ex-board li:nth-child(2) .ex-rank { color: #8a99ad; }
.ex-board li:nth-child(3) .ex-rank { color: #c07a43; }
.ex-av { width: 32px; height: 32px; border-radius: 50%; }
.ex-board-name { display: grid; min-width: 0; }
.ex-board-name b { overflow: hidden; color: var(--text-strong); font-size: 14.5px; text-overflow: ellipsis; white-space: nowrap; }
.ex-board-name small { color: var(--text-dim); font-size: 12px; }
.ex-board-papers { display: flex; gap: 6px; }
.ex-board-papers i { padding: 2px 8px; border-radius: 8px; background: var(--bg-soft); color: var(--text-muted); font-size: 12px; font-style: normal; white-space: nowrap; }
.ex-board-total { color: var(--text-strong); font-size: 20px; text-align: right; font-variant-numeric: tabular-nums; }
.ex-empty { margin: 8px 0; padding: 18px; border-radius: 14px; background: var(--bg-soft); color: var(--text-dim); text-align: center; }

/* ---------------------------------------------------------------- 准考证 */
.ex-overlay { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 16px; overflow-y: auto; background: rgba(10, 18, 36, .62); backdrop-filter: blur(4px); animation: ex-fade .2s ease-out; }
@keyframes ex-fade { from { opacity: 0; } }
.ex-ticket-wrap, .ex-letter-wrap { display: grid; gap: 14px; width: min(640px, 100%); }
.ex-ticket { position: relative; padding: 26px 28px 22px; border-radius: 14px; background: #fbf8f1; color: #132648; box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .6), inset 0 0 0 3px #1f3a6b, inset 0 0 0 9px #fbf8f1, inset 0 0 0 10px #1f3a6b; animation: ex-pop .3s cubic-bezier(.34, 1.4, .64, 1); }
@keyframes ex-pop { from { transform: translateY(16px) scale(.97); opacity: 0; } }
.ex-ticket-top { text-align: center; }
.ex-ticket-top span { color: #5b6b86; font-size: 13px; }
.ex-ticket-top h2 { margin: 4px 0 16px; color: #1f3a6b; font: 900 34px/1.2 'Songti SC', 'STSong', 'Noto Serif SC', serif; letter-spacing: .3em; }
.ex-ticket-top h2 small { font-size: 14px; letter-spacing: 0; }
.ex-ticket-body { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 20px; align-items: start; }
.ex-photo { display: grid; place-items: center; width: 112px; height: 140px; border: 2px solid #1f3a6b; background: #fff; color: #8a97ad; overflow: hidden; }
.ex-photo .ex-photo-img { width: 100px; height: 100px; border-radius: 6px; font-size: 40px; }
.ex-ticket-kv { display: grid; gap: 10px; margin: 0; }
.ex-ticket-kv div { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 8px; padding-bottom: 6px; border-bottom: 1px solid #d9dee8; }
.ex-ticket-kv dt { color: #5b6b86; font-size: 13.5px; }
.ex-ticket-kv dd { margin: 0; color: #132648; font-size: 15.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ex-ticket-kv .is-mono { font-family: var(--font-mono); letter-spacing: .06em; }
.ex-ticket-sched { width: 100%; margin: 18px 0 14px; border-collapse: collapse; font-size: 13.5px; }
.ex-ticket-sched th, .ex-ticket-sched td { padding: 6px 8px; border: 1px solid #cfd6e2; text-align: center; }
.ex-ticket-sched th { background: #eef2f8; color: #1f3a6b; }
.ex-agree { display: flex; gap: 8px; align-items: flex-start; color: #3b4a66; font-size: 13px; line-height: 1.5; cursor: pointer; }
.ex-agree input { margin-top: 3px; }
.ex-seal-stamp { position: absolute; right: 26px; top: 120px; display: grid; place-items: center; width: 92px; height: 92px; border: 3px solid rgba(200, 32, 42, .75); border-radius: 50%; color: rgba(200, 32, 42, .8); font-size: 12px; font-weight: 800; transform: rotate(-14deg); pointer-events: none; }
.ex-ticket-acts { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.ex-ticket-acts .btn svg { width: 16px; height: 16px; margin-right: 5px; }
.ex-letter-img { display: grid; place-items: center; min-height: 300px; }
.ex-letter-img img { width: min(420px, 100%); height: auto; border-radius: 12px; box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .7); animation: ex-pop .4s cubic-bezier(.34, 1.4, .64, 1); }

/* ---------------------------------------------------------------- 考场 */
.ex-room { min-height: 100vh; padding: calc(var(--nav-h) + 16px) 0 24px; background: linear-gradient(#eef1f6, #e6eaf1); }
/* the exam takes the window's width (exam.js fitRoom sizes the type and the rows) */
.ex-room > .wrap { max-width: min(1680px, 100%); padding: 0 clamp(16px, 2.4vw, 40px); }
html[data-theme='dark'] .ex-room { background: linear-gradient(#0f1522, #0b101a); }
.ex-room-bar { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; padding: 12px 18px; border-radius: 14px; background: var(--ex-navy); color: #dfe6f3; }
.ex-room-title { font-size: 13.5px; }
.ex-room-title b { color: var(--ex-gold); font-family: var(--font-mono); }
.ex-steps { display: flex; gap: 6px; margin: 0 auto; padding: 0; list-style: none; }
.ex-steps li { padding: 4px 12px; border-radius: 999px; background: rgba(255, 255, 255, .08); color: #9fb0cf; font-size: 13px; }
.ex-steps li.is-now { background: var(--ex-gold); color: #3a2600; font-weight: 800; }
.ex-steps li.is-done { color: #fff; }
.ex-steps li.is-done::before { content: '✓ '; }
.ex-warn { padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, .08); color: #9fb0cf; font-size: 12.5px; }
.ex-warn.is-hot { background: #e5484d; color: #fff; }
.ex-clock { min-width: 84px; color: #fff; font: 800 28px/1 var(--font-mono); text-align: right; font-variant-numeric: tabular-nums; }
.ex-clock.is-low { color: #ff7a7a; animation: ex-blink 1s steps(2) infinite; }
@keyframes ex-blink { 50% { opacity: .55; } }
.ex-sheet { position: relative; padding: 26px 30px 22px; border-radius: 6px; background: var(--ex-paper); box-shadow: 0 20px 50px -24px rgba(20, 30, 60, .35), 0 1px 0 #d9dee8; }
html[data-theme='dark'] .ex-sheet { background: #161d2b; }
.ex-sheet::before { content: '密　封　线　内　不　要　答　题'; position: absolute; left: 8px; top: 30px; bottom: 30px; writing-mode: vertical-rl; color: #b9c2d3; font-size: 11px; letter-spacing: .3em; border-right: 1px dashed #cfd6e2; padding-right: 4px; }
.ex-sheet-head { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; margin: 0 0 14px 14px; padding-bottom: 12px; border-bottom: 2px solid #1f3a6b; }
.ex-sheet-head b { color: var(--text-strong); font: 900 26px/1.2 'Songti SC', 'STSong', 'Noto Serif SC', serif; }
.ex-sheet-head span { color: var(--text-muted); font-size: 13.5px; }
.ex-sheet-head span:last-child { margin-left: auto; color: var(--text-dim); }
.ex-paper { position: relative; min-height: 220px; margin-left: 14px; background: none; --type-size: 26px; --type-pitch: 50px; }
.ex-room-tip { margin: 12px 0 0 14px; color: var(--text-dim); font-size: 12.5px; }
.ex-cover { position: absolute; inset: -8px; z-index: 3; display: none; place-items: center; border-radius: 10px; }
.ex-cover.is-sealed, .ex-cover.is-opening, .ex-cover.is-count, .ex-cover.is-break { display: grid; background: color-mix(in srgb, var(--ex-paper) 92%, transparent); backdrop-filter: blur(3px); }
html[data-theme='dark'] .ex-cover.is-sealed, html[data-theme='dark'] .ex-cover.is-count, html[data-theme='dark'] .ex-cover.is-break { background: rgba(22, 29, 43, .94); }
.ex-envelope { position: relative; width: min(420px, 90%); border-radius: 10px; background: #f4ead2; box-shadow: 0 18px 40px -18px rgba(60, 40, 0, .5), inset 0 0 0 2px #d8c08a; overflow: hidden; }
.ex-env-flap { position: absolute; inset: 0 0 auto 0; height: 46%; background: linear-gradient(160deg, #ead9b0, #dcc58f); clip-path: polygon(0 0, 100% 0, 50% 100%); transform-origin: top; transition: transform .6s ease; }
.ex-env-flap::after { content: '密'; position: absolute; left: 50%; top: 58%; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: #c8202a; color: #fff; font: 900 20px/1 'Songti SC', serif; transform: translate(-50%, -50%); box-shadow: 0 2px 6px rgba(0, 0, 0, .3); }
.ex-env-body { display: grid; justify-items: center; gap: 8px; padding: 120px 20px 26px; }
.ex-env-body b { color: #5a3d00; font: 900 24px/1.2 'Songti SC', 'STSong', serif; }
.ex-env-body span { color: #7a6233; font-size: 13.5px; }
.ex-env-body .btn kbd, .ex-break .btn kbd { margin-left: 6px; font-size: 11px; opacity: .7; }
.ex-cover.is-opening .ex-env-flap { transform: rotateX(180deg) translateY(-100%); }
.ex-cover.is-opening .ex-envelope { animation: ex-open .7s ease-in forwards; }
@keyframes ex-open { 60% { transform: translateY(0); opacity: 1; } to { transform: translateY(40px) scale(.96); opacity: 0; } }
.ex-num, .ex-go { color: var(--ex-navy-2); font: 900 96px/1 Quicksand, system-ui, sans-serif; animation: ex-num .9s ease-out; }
.ex-go { color: #1f7a45; font-family: 'Songti SC', 'STSong', serif; font-size: 72px; }
@keyframes ex-num { from { transform: scale(1.4); opacity: 0; } 30% { transform: scale(1); opacity: 1; } }
.ex-break { display: grid; justify-items: center; gap: 10px; text-align: center; }
.ex-break-done { display: inline-flex; align-items: center; gap: 6px; color: #1f7a45; font-weight: 700; }
.ex-break-done svg { width: 18px; height: 18px; }
.ex-break b { color: var(--text-strong); font-size: 24px; }
.ex-break span { color: var(--text-muted); font-size: 14px; }

/* ---------------------------------------------------------------- 阅卷 · 成绩单 */
.ex-marking { min-height: 80vh; padding: 140px 0 60px; background: linear-gradient(160deg, var(--ex-navy), var(--ex-navy-2)); }
.ex-mark-card { width: min(460px, 100%); margin: 0 auto; padding: 32px; border-radius: 20px; background: var(--bg-elevated); text-align: center; }
.ex-mark-card h2 { margin: 0 0 6px; color: var(--text-strong); font: 900 28px/1.2 'Songti SC', 'STSong', serif; }
.ex-mark-card p { margin: 0 0 18px; color: var(--text-muted); }
.ex-mark-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ex-mark-list li { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border-radius: 12px; background: var(--bg-soft); color: var(--text-strong); font-weight: 600; }
.ex-mark-list i { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--line); border-top-color: var(--accent); animation: ex-spin .8s linear infinite, ex-tick .01s linear forwards; animation-delay: 0s, calc(var(--d) + 1s); }
@keyframes ex-spin { to { transform: rotate(360deg); } }
@keyframes ex-tick { to { border-color: #1f7a45; background: #1f7a45; animation-play-state: paused; } }
.ex-report { padding: 100px 0 64px; background: linear-gradient(180deg, #eef1f6 0, var(--bg) 420px); }
html[data-theme='dark'] .ex-report { background: var(--bg); }
.ex-report .wrap { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.ex-score-card { padding: 26px 28px; border-radius: 20px; background: var(--bg-elevated); box-shadow: var(--shadow-md); }
.ex-score-card .ex-eyebrow { color: var(--ex-navy-2); }
html[data-theme='dark'] .ex-score-card .ex-eyebrow { color: var(--ex-gold); }
.ex-total { display: flex; align-items: baseline; gap: 8px; margin: 4px 0 6px; }
.ex-total b { color: var(--text-strong); font-size: 84px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.ex-total small { color: var(--text-dim); font-size: 22px; font-weight: 600; }
.ex-place { margin: 0 0 18px; color: var(--text-muted); font-size: 15px; }
.ex-place b { color: var(--text-strong); }
.ex-place.is-bad { color: #b53a3a; }
.ex-score-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.ex-score-table th { padding: 8px; border-bottom: 2px solid var(--line-soft); color: var(--text-dim); font-size: 12.5px; font-weight: 600; text-align: left; }
.ex-score-table td { padding: 10px 8px; border-bottom: 1px solid var(--line-soft); color: var(--text-muted); font-variant-numeric: tabular-nums; }
.ex-score-table td b { color: var(--text-strong); }
.ex-score-table small { color: var(--text-dim); font-size: 11.5px; }
.ex-score-bar { display: block; height: 4px; margin-top: 4px; border-radius: 2px; background: var(--bg-soft); overflow: hidden; }
.ex-score-bar i { display: block; height: 100%; background: var(--ex-navy-2); }
.ex-admit { position: relative; padding: 26px 26px 22px; border-radius: 20px; background: linear-gradient(160deg, #b3121d, #8c0c14); color: #f5e3c0; box-shadow: var(--shadow-md); overflow: hidden; }
.ex-admit::after { content: ''; position: absolute; inset: 10px; border: 1px solid rgba(232, 196, 119, .55); border-radius: 14px; pointer-events: none; }
.ex-admit-level { display: inline-block; padding: 3px 12px; border-radius: 999px; background: var(--ex-gold); color: #4a2d00; font-size: 12.5px; font-weight: 800; }
.ex-admit-k { margin: 12px 0 2px; color: #e8c477; font-size: 13px; }
.ex-admit h2 { margin: 0; color: #fff; font: 900 26px/1.3 'Songti SC', 'STSong', serif; }
.ex-admit-major { margin: 4px 0 10px; color: var(--ex-gold); font-weight: 700; }
.ex-admit p { line-height: 1.6; }
.ex-admit-acts { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.ex-admit-acts .btn svg { width: 16px; height: 16px; margin-right: 5px; }
.ex-admit-acts .btn-ghost { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .35); color: #fff; }
.ex-report-acts { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }

@media (max-width: 900px) {
  .ex-hero { margin-top: calc(var(--nav-h) + 12px); padding: 26px 0 28px; border-radius: 18px; }
  .ex-hero > .wrap { padding: 0 20px; }
  .ex-hero-in, .ex-two, .ex-report .wrap { grid-template-columns: minmax(0, 1fr); }
  .ex-papers { grid-template-columns: minmax(0, 1fr); }
  .ex-board li { grid-template-columns: 26px 30px minmax(0, 1fr) 54px; }
  .ex-board-papers { display: none; }
  .ex-sheet { padding: 18px 14px; }
  .ex-sheet::before { display: none; }
  .ex-paper, .ex-sheet-head, .ex-room-tip { margin-left: 0; }
  .ex-paper { --type-size: 20px; --type-pitch: 40px; }
  .ex-steps { order: 3; width: 100%; margin: 0; }
  .ex-seal-stamp { display: none; }
}

@media (max-width: 560px) { .ex-hero h1 { white-space: normal; } }