/* 第一阶段覆盖样式。保留原 styles.css，旧美术切片仍独立使用它。 */
:root { --desktop-taskbar-height:48px; }
body { padding-bottom:48px; }
#app { min-height:calc(100svh - 48px); }
.game-taskbar { position:fixed; bottom:0; left:0; right:0; height:var(--desktop-taskbar-height); z-index:45; display:flex; align-items:center; justify-content:space-between; border-top:1px solid #c4cecf; background:#d9e0dfed; backdrop-filter:blur(8px); padding:0 20px; color:#61736c; }
.taskbar-apps,.taskbar-system { display:flex; height:100%; align-items:center; gap:7px; }
.taskbar-app { height:100%; min-width:145px; display:flex; align-items:center; justify-content:center; gap:10px; padding:0 18px; font-size:12px; position:relative; border-bottom:3px solid transparent; }
.taskbar-app > .icon { width:20px; height:20px; color:#698575; }
.taskbar-app > img { width:23px; height:23px; }
.taskbar-app.active { background:#edf1ef; border-bottom-color:#7d9b8d; color:#435e50; }
.taskbar-app:hover { background:#f0f3f0; }
.taskbar-unread { width:6px; height:6px; background:#b56f61; border-radius:50%; }
.desktop-clock { font:12px/1.3 Arial,sans-serif; text-align:center; padding:0 13px; color:#6f8179; }
.desktop-clock > small { display:block; font-size:9px; margin-top:3px; color:#91a097; }
.taskbar-system .icon-button { border-left:1px solid #bfcac4; border-radius:0; padding-left:12px; width:36px; }
.taskbar-system .icon { width:17px; height:17px; }
.school-desktop { padding-bottom:24px; }
.browser-toolbar { width:calc(100% - 56px); max-width:1160px; margin:22px auto 0; display:flex; gap:14px; align-items:center; background:#e4e9ed; border:1px solid #cfd9df; padding:8px 13px; color:#8a9aa6; }
.browser-controls { display:flex; gap:3px; }
.browser-toolbar .icon-button { width:27px; height:27px; }
.browser-toolbar .icon { width:15px; height:15px; }
.browser-back .icon { transform:rotate(180deg); }
.browser-toolbar button:disabled { opacity:.3; }
.browser-toolbar button:disabled:hover { background:none; }
.browser-address { flex:1; height:27px; display:flex; align-items:center; gap:9px; padding:0 11px; background:#f9fbfc; border:1px solid #d4dfe6; border-radius:2px; font:11px Arial,var(--sans); color:#8b9eab; }
.browser-address .icon { width:12px; height:12px; }
.browser-address > small { margin-left:auto; font:9px var(--sans); color:#acb9c2; }
.school-site { margin-top:0; }
.school-masthead { background:#fff; }
.school-utility { font-size:11px; }
.school-footer p { font-size:10px; }
.school-nav { grid-template-columns:repeat(7,1fr); }
.school-nav a { font-size:14px; }
.school-friendly a:hover { color:var(--blue); }
.article-body { font-size:15px; color:#5c656c; }
.article-meta { font-size:10px; }
.article-body .large-text { font-size:18px; }
.article-body.large-text { font-size:18px; }
.preserved-photo .photo-button img { height:auto; object-fit:contain; max-height:none; }
.preserved-photo { max-width:760px; margin:24px auto; }
.preserved-photo figcaption { display:flex; flex-direction:column; gap:4px; line-height:1.8; font-size:11px; }
.preserved-photo figcaption > span:last-child { font-size:9px; color:#a9b1b7; }
.preserved-photo .photo-enlarge { opacity:1; }
.photo-date { color:#75818a; }
.banner-photo { filter:saturate(.8) contrast(.96); }
.original-record-link { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:9px; padding:14px 10px; background:#f3f6f8; border:1px solid #dfe7ed; margin:19px 0 24px; color:#7791a4; font:12px/1.8 var(--sans); }
.original-record-link > .icon { width:17px; height:17px; }
.original-record-link > button { display:flex; align-items:center; gap:12px; padding:0; color:#456e8c; font-size:12px; }
.original-record-link button:hover { text-decoration:underline; }
.original-record-link button .icon { width:14px; height:14px; }
.original-record-link small { flex-basis:100%; font-size:9px; color:#a3b1bc; text-align:center; }
.updated-record { display:flex; gap:10px; align-items:center; padding:12px 15px; border:1px solid #d8e5dc; background:#f3f7f3; color:#78917e; font:12px/1.7 var(--sans); margin-bottom:23px; }
.updated-record > .icon { width:19px; height:19px; }
.updated-record > span > span { margin-left:18px; font-size:10px; color:#a1afa3; }
.sidebar-note a { display:flex; align-items:center; gap:12px; margin-top:13px; font-size:11px; color:#85917c; }
.sidebar-note a .icon { width:14px; height:14px; }
.section-heading { border-bottom:1px dashed #d9e2e8; padding:7px 0 23px; margin-bottom:25px; }
.section-heading > span { font-size:10px; color:#99aab7; letter-spacing:2px; }
.section-heading h2 { font:24px/1.8 var(--serif); letter-spacing:2px; color:#44657d; margin-top:6px; }
.section-heading > p { font-size:12px; line-height:1.9; color:#9aabb6; margin-top:7px; }
.archive-explanation { background:#f6f8fa; border:1px solid #e2e8ed; padding:18px 20px; margin-bottom:25px; }
.archive-explanation h3 { font-size:13px; font-weight:normal; color:#728da1; }
.archive-explanation p { font:13px/2 var(--serif); color:#94a3ae; margin-top:7px; }
.correction-table { white-space:normal; font-size:12px; min-width:420px; }
.correction-table td:first-child { font:12px/1.8 var(--sans); text-align:left; color:#758b9a; }
.correction-table td { padding:15px; }
.correction-table a { color:#5680a0; font-size:11px; }
.correction-table a:hover { text-decoration:underline; }
.neutral-status { color:#9ba7ae; }
.resolved-detail { margin:30px 0; padding:20px; border:1px solid #dfe7ec; }
.resolved-detail h3 { font-size:14px; font-weight:normal; color:#708da0; margin-bottom:15px; }
.resolved-detail dl,.registration-card dl { display:grid; grid-template-columns:100px 1fr; margin:0; }
.resolved-detail dt,.resolved-detail dd { padding:7px 0; font-size:12px; margin:0; color:#8b9eaa; }
.resolved-detail dd { color:#657e8e; }
.topic-date { display:flex; align-items:center; justify-content:space-between; gap:20px; background:#f8f7f2; border:1px solid #e7e1d3; padding:21px; color:#a2957f; font-size:12px; margin:24px 0; }
.topic-date > strong { color:#9c7056; font:20px var(--serif); }
.article-index { padding:0; margin:0; list-style:none; }
.article-index li { border-bottom:1px dotted #dce5eb; }
.article-index a { display:flex; justify-content:space-between; align-items:center; padding:19px 2px; font:14px var(--serif); color:#6b879c; }
.article-index .icon { width:14px; height:14px; color:#a4b5c0; }
.news-index { padding:0; list-style:none; margin:0; }
.news-index > li { display:flex; gap:24px; padding:22px 0; border-bottom:1px dotted #dce4e9; }
.news-index time { font:11px/2 Arial,sans-serif; color:#a7b3bc; flex:0 0 auto; }
.news-index > li > div > a { font:16px/1.5 var(--serif); color:#587994; }
.news-index p { font-size:10px; color:#a8b5be; margin-top:9px; }
.news-index p a { margin-left:12px; color:#92a8b7; }
.news-index a:hover { color:var(--red); }
.school-photo-list { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.school-photo-list > * { padding:0; text-align:left; }
.school-photo-list img { width:100%; aspect-ratio:1.5; object-fit:cover; }
.school-photo-list h3 { font:15px/1.7 var(--serif); color:#6c879b; margin-top:13px; }
.school-photo-list p { font-size:10px; color:#a4b0b8; margin-top:6px; }
.school-photo-list a:hover h3,.school-photo-list button:hover h3 { color:var(--blue); }

/* 只读的逐条演出，不提供玩家自由输入。 */
body[data-surface="chat"] { background:linear-gradient(145deg,#dce5e3,#cbd8d5); }
.chat-desktop { margin-top:29px; }
.chat-desktop-caption { color:#7c9189; }
.chat-desktop-caption > small { color:#8ca298; font-size:10px; }
.chat-window { height:min(790px,calc(100svh - 150px)); min-height:520px; box-shadow:0 16px 45px #304c3e1c; }
.message-bubble { font-size:14px; }
.message-name { font-size:10px; }
.chat-time { font-size:10px; }
.contact-copy > strong { font-size:13px; padding-right:22px; }
.contact-copy > small { font-size:11px; }
.contact-copy > strong .friend-label { font-style:normal; font-size:8px; font-weight:normal; color:#8b9a8b; padding:0 4px; border:1px solid #c6d3c6; border-radius:2px; }
.contact-item time { font-size:9px; }
.presence-label { margin-left:8px; color:#a6b3a7; font-size:9px; }
.scripted-chat-footer { display:flex; align-items:center; justify-content:space-between; gap:15px; min-height:67px; padding:18px 24px; border-top:1px solid #dde5dc; background:#f9fbf7; }
.conversation-status { display:flex; align-items:center; gap:7px; font-size:10px; color:#a3afa1; }
.presence-indicator { width:5px; height:5px; background:#bbc4b8; border-radius:50%; }
.presence-indicator.online { background:#92ad85; }
.quiet-button,.alumni-notification { display:inline-flex; align-items:center; gap:8px; padding:0; font-size:11px; color:#8ba17b; }
.quiet-button:hover,.alumni-notification:hover { color:#557942; }
.quiet-button .icon,.alumni-notification .icon { width:14px; height:14px; }
.record-reading { font-size:9px; color:#bbc4b4; }
.chat-link-card { width:290px; }
.chat-link-card strong { font-size:13px; }

/* 校史馆单选勘误与原始登记卡。所有需阅读文字均为HTML。 */
.correction-reasons { border:0; margin:22px 0 0; padding:0; }
.correction-reasons legend { font-size:11px; color:#7c93a4; margin-bottom:10px; }
.correction-reasons > label { display:flex; align-items:center; gap:11px; padding:12px 13px; border:1px solid #e0e7ec; background:#fff; margin-top:8px; color:#7f95a5; font-size:12px; cursor:pointer; }
.correction-reasons > label:has(input:checked) { background:#edf4f8; border-color:#94b3c8; color:#486e8c; }
.correction-reasons > label:hover { background:#f5f8fa; }
.correction-reasons input { accent-color:#356789; width:14px; height:14px; margin:0; }
.correction-feedback { min-height:32px; margin-top:13px; font-size:11px; line-height:1.9; color:#a08c6d; }
.submission-receipt { text-align:center; padding:55px 30px; }
.submission-receipt > span { display:inline-flex; justify-content:center; align-items:center; border:1px solid #cddfd3; color:#8baa95; width:45px; height:45px; border-radius:50%; margin-bottom:18px; }
.submission-receipt h2 { font:19px/1.9 var(--serif); color:#668499; }
.submission-receipt p { color:#a4b1ba; font-size:11px; margin-top:12px; }
.record-dialog { width:min(650px,calc(100% - 32px)); }
.registration-card { padding:28px 32px 25px; background:#fbfaf6; position:relative; }
.registration-heading { text-align:center; border-bottom:2px solid #a5b0ac; padding-bottom:16px; }
.registration-heading > span { font-size:10px; letter-spacing:4px; color:#a0a79d; }
.registration-heading h2 { font:27px/1.8 var(--serif); color:#62756d; letter-spacing:6px; margin-top:5px; }
.registration-heading p { font:10px/1.7 Arial,var(--sans); color:#9ba79f; margin-top:4px; }
.registration-photo { display:flex; gap:15px; align-items:center; margin:21px 0; }
.registration-photo img { width:125px; height:83px; object-fit:cover; }
.registration-photo > span { color:#a8b1a3; font:11px/1.9 var(--serif); }
.registration-card dl { border-top:1px solid #d0d6cc; border-left:1px solid #d0d6cc; grid-template-columns:115px minmax(0,1fr); }
.registration-card dt,.registration-card dd { margin:0; border-bottom:1px solid #d0d6cc; border-right:1px solid #d0d6cc; padding:12px 14px; font:13px/1.7 var(--serif); color:#7b8b7b; }
.registration-card dt { background:#f0f1e9; color:#929d8d; }
.registration-card .original-photo-date { color:#526c60; font-size:16px; }
.registration-signature { display:flex; align-items:center; justify-content:flex-end; gap:18px; margin-top:20px; }
.registration-signature p { font:11px/1.9 var(--serif); color:#a4aa9a; text-align:right; }
.registration-signature > span { border:2px solid #ba8e7b; color:#b28f7f; padding:7px 5px; font:12px/1.6 var(--serif); text-align:center; transform:rotate(-8deg); opacity:.75; }
.register-note { font:10px/1.9 var(--serif); color:#a7b09e; margin-top:20px; }
.menu-dialog { width:min(410px,calc(100% - 32px)); }
.game-menu-body { padding:27px; }
.game-menu-body h2 { font:23px/1.8 var(--serif); letter-spacing:2px; color:#59768b; margin-bottom:20px; }
.game-menu-body > p { font-size:12px; line-height:2; color:#94a6b1; }
.menu-row { display:flex; align-items:center; justify-content:space-between; padding:15px 0; width:100%; border-bottom:1px solid #e5ebef; text-align:left; font-size:12px; color:#7b96a8; }
.menu-row .icon { width:16px; height:16px; }
.menu-row:hover { color:var(--blue); }
.game-menu-body > .save-status { color:#a1b4a4; font-size:10px; margin-top:22px; }
.game-menu-body > small { display:block; font-size:9px; line-height:1.9; color:#b8c1c7; margin-top:20px; }
.maintenance { inset:0; background:#f5f7f9; }
.toast { bottom:68px; }

@media(min-width:1500px) { .school-site { margin-top:0; } }
@media(max-width:1100px) { .browser-toolbar { width:calc(100% - 36px); } }
@media(max-width:850px) { .message-bubble { font-size:13px; } .chat-window { grid-template-columns:50px 215px minmax(0,1fr); } .contact-copy > strong { font-size:12px; } .contact-copy > small { font-size:10px; } .school-photo-list { gap:17px; } .topic-date { flex-direction:column; align-items:flex-start; gap:10px; } }
@media(max-width:650px) {
  :root { --desktop-taskbar-height:46px; }
  .game-taskbar { padding:0 8px; }
  body { padding-bottom:46px; }
  #app { min-height:calc(100svh - 46px); }
  .taskbar-apps { gap:0; }
  .taskbar-app { min-width:0; padding:0 12px; font-size:10px; gap:7px; }
  .taskbar-app .icon { width:17px; height:17px; }
  .taskbar-app img { width:19px; height:19px; }
  .desktop-clock { font-size:10px; padding:0 4px; }
  .desktop-clock small { font-size:7px; }
  .taskbar-system { gap:6px; }
  .taskbar-system .icon-button { padding-left:7px; width:29px; }
  .browser-toolbar { width:100%; margin-top:0; padding:6px 8px; gap:8px; border-left:0; border-right:0; }
  .browser-address { gap:5px; padding:0 7px; font-size:9px; }
  .browser-address small { font-size:7px; }
  .browser-controls { gap:0; }
  .school-site { margin-top:10px; }
  .school-utility { font-size:8px; }
  .school-nav a { font-size:10px; }
  .school-nav { grid-template-columns:repeat(4,1fr); }
  .school-footer p { font-size:8px; }
  .article-body { font-size:14px; }
  .article-meta { font-size:8px; }
  .preserved-photo .photo-button img { height:auto; }
  .preserved-photo figcaption { font-size:10px; }
  .preserved-photo figcaption > span:last-child { font-size:8px; }
  .original-record-link { padding:12px 8px; font-size:10px; gap:7px; }
  .original-record-link button { font-size:11px; }
  .original-record-link small { font-size:8px; }
  .updated-record { font-size:10px; padding:10px; }
  .updated-record > span > span { display:block; font-size:8px; margin-left:0; }
  .section-heading h2 { font-size:22px; }
  .section-heading > p { font-size:11px; }
  .archive-explanation { padding:14px; }
  .archive-explanation p { font-size:12px; }
  .correction-table { min-width:380px; }
  .correction-table td { padding:10px; }
  .correction-table td:first-child { font-size:10px; }
  .resolved-detail { padding:15px; }
  .resolved-detail dl { grid-template-columns:80px 1fr; }
  .news-index > li { gap:13px; padding:20px 0; }
  .news-index time { font-size:9px; }
  .news-index > li > div > a { font-size:14px; }
  .school-photo-list { grid-template-columns:1fr; gap:26px; }
  .school-photo-list h3 { font-size:15px; }
  .chat-desktop { margin-top:0; }
  .chat-window { height:calc(100svh - 81px); min-height:430px; display:block; }
  .chat-desktop-caption { height:35px; }
  .chat-desktop-caption > small { font-size:8px; }
  .message-bubble { font-size:13px; }
  .contact-copy > strong { font-size:14px; }
  .contact-copy > small { font-size:11px; }
  .scripted-chat-footer { min-height:64px; padding:15px 13px; gap:9px; }
  .conversation-status { font-size:9px; }
  .quiet-button,.alumni-notification { font-size:10px; gap:5px; }
  .quiet-button .icon,.alumni-notification .icon { width:12px; height:12px; }
  .chat-link-card { width:255px; }
  .chat-link-card strong { font-size:12px; }
  .registration-card { padding:22px 18px; }
  .registration-heading h2 { font-size:24px; }
  .registration-card dl { grid-template-columns:82px minmax(0,1fr); }
  .registration-card dt,.registration-card dd { padding:10px 9px; font-size:12px; }
  .registration-card .original-photo-date { font-size:15px; }
  .registration-photo img { width:105px; height:70px; }
  .registration-photo > span { font-size:10px; }
  .correction-reasons > label { font-size:12px; padding:12px; }
  .maintenance { inset:0; }
}
@media(max-width:360px) { .taskbar-app { padding:0 8px; font-size:9px; gap:5px; } .desktop-clock { padding:0 2px; } .chat-link-card { width:215px; } }