/* Responsive layout for the existing desktop archive, not the mobile templates. */
.wp { box-sizing: border-box; }
.history-rwd-author { display: none; }
.history-menu-toggle, .history-description > summary { display: none; }
.history-sidebar > summary { display: none; }
@media (max-width: 1000px) {
 body[id^="nv_"] .wp, .widthauto .wp { width: auto; max-width: none; margin-left: 16px; margin-right: 16px; }
 body[id^="nv_"] #ct { margin-left: 16px !important; margin-right: 16px !important; }
 #nv { position: static !important; width: auto !important; left: auto !important; top: auto !important; }
 #hd .hdc { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; min-height: 0; }
 .desktop-brand { float: none; max-width: 100%; flex: 1 1 360px; }
 #hd .history-logo-link { max-width: 100%; }
 #hd .fastlg { float: none; padding-top: 0; }
 #scbar table { width: 100%; table-layout: fixed; }
 #scbar_hot { white-space: normal; height: auto; line-height: 1.8; }
 #scbar_txt { width: 100%; box-sizing: border-box; }
 .scbar_txt_td { width: auto; }
 .scbar_hot_td { display: none; }
 .ct2 .mn, .ct2_a .mn, .ct3_a .mn, .ct2 .sd, .ct2_a .appl, .ct3_a .appl, .ct3_a .sd { float: none; width: auto; margin: 0; }
 #ct.ct2_a, #ct.ct3_a { padding-left: 0; background-image: none; }
 .ct2_a .appl, .ct3_a .appl { margin-bottom: 12px; }
 .bdl { float: none; position: static !important; width: auto !important; height: auto !important; margin: 0 0 12px !important; }
 .history-sidebar > summary { display: block; cursor: pointer; padding: 12px; color: #304f42; font-weight: 600; }
 .history-sidebar > summary::after { content: ' ▾'; }
 .history-sidebar[open] > summary::after { content: ' ▴'; }
 #ct .mn { min-width: 0; }
 #diy_chart .column { float: none; width: 100% !important; }
 #diy_chart .frame { margin: 0; }
 #diy_chart .block { margin: 0 0 12px; }
 #diy_chart .slideshow, #diy_chart .slidebar { max-width: 100%; }
 .block img, .bm_c img { max-width: 100%; height: auto; }
 .block .dxb_bc table { width: 100% !important; table-layout: fixed; }
 .block .dxb_bc td { width: auto !important; overflow-wrap: anywhere; }
 .block .dxb_bc td img { max-width: 100%; height: auto !important; }
 .pgt, .pgs { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
 .pgt .pg, .pgs .pg, .pgt .pgb, .pgs .pgb { float: none; margin: 0; }
 .pg { display: flex; flex-wrap: wrap; gap: 4px; }
 .pg a, .pg strong, .pg label { margin: 0; }
 #ft .y, #ft .z { float: none; text-align: left; }
}
@media (max-width: 700px) {
 body[id^="nv_"] { font-size: 15px; }
 body[id^="nv_"] img { max-width: 100%; height: auto; }
 body[id^="nv_"] .wp, .widthauto .wp { margin-left: 12px; margin-right: 12px; }
 body[id^="nv_"] #ct { margin-left: 12px !important; margin-right: 12px !important; }
 #toptb .z, #toptb .y { float: none; display: flex; flex-wrap: wrap; }
 #toptb { height: auto; }
 #toptb a { height: auto; min-height: 32px; }
 #hd .hdc { padding: 18px 0; }
 .desktop-brand { flex-basis: 100%; }
 #hd .desktop-brand h1 { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
 #hd .history-logo-link { width: 260px; }
 #hd .fastlg { width: 100%; text-align: left; }
 #hd .fastlg table { width: 100%; table-layout: fixed; }
 #hd .fastlg td { width: auto !important; white-space: normal; padding: 4px; }
 #hd .fastlg .px { max-width: 100%; width: 100% !important; box-sizing: border-box; min-height: 36px; }
 #hd .fastlg td:first-child { width: 40px !important; }
 #hd .fastlg td:last-child { width: 92px !important; }
 #hd .fastlg .pnc { min-height: 36px; }
 #um { padding-right: 0; max-width: 100%; }
 #um p { white-space: normal; }
 #nv { padding: 4px; }
 #nv .history-menu-toggle { display: block; width: 100%; min-height: 44px; padding: 10px 12px; border: 0; background: transparent; color: #fff; text-align: left; font: inherit; font-weight: 600; cursor: pointer; }
 #nv.history-collapsible-nav:not(.history-menu-open) > ul { display: none; }
 .history-description > summary { display: block; cursor: pointer; color: #657267; line-height: 1.8; }
 .history-description-hint { display: block; color: #304f42; text-decoration: underline; margin-top: 6px; }
 .history-description[open] > summary { font-size: 0; }
 .history-description[open] .history-description-hint { font-size: 14px; }
 .history-description-content { margin-top: 8px; }
 .block .dxb_bc table, .block .dxb_bc tbody, .block .dxb_bc tr, .block .dxb_bc td { display: block; width: 100% !important; box-sizing: border-box; }
 .block .dxb_bc td { padding: 8px 0; height: auto !important; }
 .block .dxb_bc td img { display: block; max-width: 240px; max-height: 300px; width: auto; margin: 0 auto; object-fit: contain; }
 #nv ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
 #nv li, #nv li a { height: auto; min-height: 42px; line-height: 1.5; }
 #nv li a { display: flex; align-items: center; justify-content: center; padding: 8px 6px; text-align: center; white-space: normal; }
 #qmenu { display: none; }
 #scbar { padding: 4px 8px; }
 .scbar_icon_td { display: none; }
 .scbar_type_td { width: 46px; }
 .scbar_btn_td { width: 44px; }
 #scbar_txt { min-width: 0; font-size: 16px; }
 #pt .z, #pt .y { float: none; width: auto; }
 #pt .z { height: auto; }
 #pt { overflow-wrap: anywhere; }
 #an, #an dl, #an dd, #anc, .ancl { width: 100%; max-width: 100%; box-sizing: border-box; }
 #an { height: auto; }
 #online .bm_h { white-space: normal; }
 #online .bm_h .xs1 { white-space: normal; }
 #diy_chart .slideouter { max-width: calc(100vw - 64px) !important; overflow: hidden; }
 body[id^="nv_"] .slideouter { max-width: calc(100vw - 48px); box-sizing: border-box; }
 #anc li, #anc li span { width: auto !important; max-width: 100%; white-space: normal; height: auto; }
 #anc li em { float: none; display: block; }
 body > a img { max-width: 100%; height: auto; }
 .block .title { height: auto; }
 .block .title span { float: none; }
 .tab-title .tb { display: flex; flex-wrap: wrap; }
 .tab-title .tb li { float: none; }
 .history-notice { display: block; padding: 14px; }
 .history-notice > div { width: auto; }
 .history-notice > a { display: inline-block; margin-top: 10px; white-space: normal; }
 .bm_h { padding: 10px 12px; }
 .bm_h .y { float: none; font-size: 12px; }
 .bm_h h1, .bm_h h2 { font-size: 18px; line-height: 1.6; }
 .bm_c { padding: 12px; }
 .chart { padding: 0; }
 .chart .y { float: none; display: block; margin-top: 4px; }
 /* Forum categories become cards; preserve links, counts and last-post details. */
 .fl_tb, .fl_tb > tbody { display: block; width: 100%; }
 .fl_tb > tbody > tr { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 4px 8px; padding: 12px 0; border-bottom: 1px solid #e6eae4; }
 .fl_tb > tbody > tr > td { display: block; width: auto !important; padding: 0; min-width: 0; }
 .fl_tb .fl_i, .fl_tb .fl_by { grid-column: 2; }
 .fl_tb .fl_by { width: auto; }
 .fl_tb .fl_by div { width: auto; white-space: normal; }
 .fl_tb .fl_g dl { margin-left: 48px; }
 .flg .fl_tb > tbody > tr { display: flex; flex-wrap: wrap; padding: 0; border: 0; }
 .flg .fl_tb > tbody > tr > .fl_g { flex: 0 0 100%; padding: 12px 0; border-bottom: 1px solid #e6eae4; }
 .flg .fl_tb > tbody > tr > .fl_g:empty { display: none; }
 /* Thread lists keep the subject prominent and put metadata underneath. */
 .tl .th { overflow-x: auto; }
 .tl .th table { min-width: 500px; }
 #threadlist.tl table, #threadlist.tl tbody { display: block; width: 100%; }
 #threadlist.tl tbody > tr { display: flex; flex-wrap: wrap; gap: 4px 8px; padding: 12px; border-bottom: 1px solid #e6eae4; }
 #threadlist.tl tbody > tr > th, #threadlist.tl tbody > tr > td { display: block; padding: 0; border: 0; min-width: 0; }
 #threadlist.tl tbody > tr > th { flex: 1 1 calc(100% - 54px); width: auto; white-space: normal; }
 #threadlist.tl .icn, #threadlist.tl .o { flex: 0 0 20px; }
 #threadlist.tl .by { flex: 1 1 40%; width: auto; font-size: 12px; }
 #threadlist.tl .by cite { white-space: normal; }
 #threadlist.tl .num { width: auto; flex: 0 0 auto; }
 #threadlist.tl .num::before { content: '回覆／瀏覽 '; }
 #threadlist.tl .xst { font-size: 17px; overflow-wrap: anywhere; }
 #threadlist.tl .emptb { display: none; }
 .tf { display: flex; flex-wrap: wrap; height: auto; gap: 8px; }
 .tf .y { float: none; }
 .ts { font-size: 21px; overflow-wrap: anywhere; }
 /* A post's author stays visible above the article rather than using a wide sidebar. */
 #postlist table.plhin, #postlist table.plhin > tbody, #postlist table.plhin > tbody > tr { display: block; width: 100%; }
 #postlist table.plhin > tbody > tr > td { display: block; width: auto; }
 #postlist > table:first-of-type, #postlist > table:first-of-type > tbody, #postlist > table:first-of-type > tbody > tr { display: block; width: 100%; }
 #postlist > table:first-of-type > tbody > tr > td { display: block; width: auto; }
 #postlist .pls { width: auto; border-right: 0; border-bottom: 1px solid #dce2dc; padding: 10px 14px; }
 #postlist .pls .favatar { padding: 0; border: 0; }
 #postlist .history-rwd-author { display: flex; align-items: center; min-height: 40px; font-weight: 600; }
 #postlist .pls .avatar { float: left; margin: 0 12px 0 0; }
 #postlist .pls .avatar img { width: 40px; height: 40px; padding: 0; border-radius: 50%; }
 #postlist .pls .pi { padding: 0; margin: 0; border: 0; }
 #postlist .pls .authi { padding: 0; }
 #postlist .pls .pil, #postlist .pls .pils, #postlist .pls .tns, #postlist .pls .xl, #postlist .pls .md_ctrl, #postlist .pls .pbm, #postlist .pls .xg1, #postlist .pls .pbg, #postlist .pls .imicn { display: none; }
 #postlist .pls .p_pop { max-width: calc(100vw - 48px); }
 #postlist .plc { padding: 12px 14px; }
 #postlist .plc .pi { margin-bottom: 12px; }
 #postlist .plc .pi .y { float: none; }
 #postlist .plc .pi strong { float: right; }
 #postlist .t_fsz { min-height: 0; }
 #postlist .t_f { font-size: 17px; line-height: 1.85; }
 #postlist .t_f, #postlist .t_f td { overflow-wrap: anywhere; }
 #postlist .t_f img, #postlist .t_f video, #postlist .t_f iframe { max-width: 100% !important; }
 #postlist .t_f table { display: block; max-width: 100%; overflow-x: auto; }
 #postlist .t_f pre, #postlist .blockcode { max-width: 100%; overflow-x: auto; white-space: pre; }
 .pob .pob { padding: 0; }
 .pob .y { float: none; }
 .pob em { display: flex; flex-wrap: wrap; gap: 6px; }
 .pob a { min-height: 32px; }
 #postlist .ad .pls { display: none; }
 #postlist .ad .plc { height: 4px; padding: 0; }
 #postlist > .pl > table { width: 100%; table-layout: fixed; }
 #postlist > .pl > table .pls { width: 70px; }
 #modmenu { display: flex; flex-wrap: wrap; gap: 8px; }
 .history-profile-page .pf_l li { flex-wrap: wrap; gap: 2px 12px; }
 #uhd .mn { margin: 0; }
 #uhd .tb { clear: both; }
 .fwinmask { max-width: calc(100vw - 16px); }
 .fwinmask .m_c { max-width: calc(100vw - 36px); }
 .fwinmask .c { max-width: calc(100vw - 64px); box-sizing: border-box; overflow-x: auto; }
 #scrolltop { right: 8px !important; left: auto !important; }
}
@media (max-width: 420px) {
 #nv ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .pg label { display: none; }
 .block .dxb_bc table, .block .dxb_bc tbody, .block .dxb_bc tr, .block .dxb_bc td { display: block; width: 100% !important; box-sizing: border-box; }
 .block .dxb_bc td { padding: 8px 0; }
}
