/* Reading and controls remain comfortable at desktop and phone widths. */
#attack-ranges { scroll-margin-top: 110px; }
.attack-ranges-table { display: table; table-layout: fixed; font-size: 16px; }
.attack-ranges-table caption { padding: 0 0 12px; color: #51432f; text-align: left; }
.attack-ranges-table th, .attack-ranges-table td { overflow-wrap: anywhere; }
@media (max-width: 600px) { .attack-ranges-table { font-size: 14px; } .attack-ranges-table th, .attack-ranges-table td { padding: 12px 6px; } }
.hero-lede,.chapter-heading p,.feature-scene p,.first-campaign p,.atlas-invitation p,.home-guide p,.faq-list details p,.siege-intro>p,.content-section p,.content-section li,.library-card p { font-size:16px; line-height:1.75; }
.site-button,.site-nav .nav-play,.site-nav-links a,.text-link,.faq-list summary,.guide-filter,.article-index a,.guide-next a,.guide-learning-path a { font-size:14px; min-height:44px; }
.feature-choices small,.play-reassurance,.guide-figure figcaption,.article-byline { font-size:13px; line-height:1.6; }
.content-section p,.content-section li { color:#51432f; }.chapter-heading p,.home-guide p,.first-campaign p { color:#5d503d; }
.practice-board { background:#eee1c4; color:#403320; border:1px solid #b79b6c; min-width:0; }
.practice-board[hidden],.practice-play[hidden],.tour-scene[hidden],.tour-controls[hidden] { display:none; }
.practice-heading { display:flex; justify-content:space-between; gap:12px; padding:17px 22px; border-bottom:1px solid #b59b74; font:12px/1.5 system-ui,sans-serif; }
.practice-heading strong { letter-spacing:1px; }.practice-map { height:155px; position:relative; overflow:hidden; background:linear-gradient(#ded0ae,#e9ddc3); }
.practice-home,.practice-target { position:absolute; object-fit:contain; bottom:20px; }.practice-home { left:4%; }.practice-target { right:5%; }.practice-route { position:absolute; top:55%; left:21%; right:22%; border-top:2px dashed #786f4b; }.practice-army { color:#753640; position:absolute; top:48%; left:23%; font-size:30px; opacity:0; transition:left 1s ease-in-out; }.practice-board[data-stage="2"] .practice-army { opacity:1; left:65%; }.practice-board[data-stage="3"] .practice-army,.practice-board[data-stage="4"] .practice-army { opacity:1; left:71%; }
.practice-seal { position:absolute; left:50%; top:10px; transform:translateX(-50%); font:700 12px/1.4 system-ui,sans-serif; background:#f1e7d3; color:#66363a; border:1px solid #9c7852; padding:6px 10px; white-space:nowrap; }
.practice-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-block:1px solid #b8a17b; }.practice-stats span { text-align:center; padding:12px 5px; font:12px/1.5 system-ui,sans-serif; }.practice-stats span+span { border-left:1px solid #c8b38f; }.practice-stats strong { display:block; font:28px/1.3 Georgia,serif; }
.practice-orders { padding:20px 22px 4px; }.practice-orders label { display:flex; justify-content:space-between; font-weight:600; }.practice-orders output { color:#71383c; font-size:23px; }.practice-orders input { width:100%; height:44px; accent-color:#74373d; cursor:pointer; }.practice-orders input:disabled { cursor:default; }.practice-orders p { margin:0; font-size:14px; color:#65563d; }
.practice-report { padding:14px 22px 8px; min-height:170px; }.practice-report h3 { font:28px/1.2 Georgia,serif; margin:0 0 14px; color:#61343a; }.practice-report p { font:16px/1.7 system-ui,sans-serif; color:#51432f; margin:0; }.practice-buttons { display:flex; align-items:center; gap:15px; padding:14px 22px 24px; flex-wrap:wrap; }.practice-buttons .text-link { background:none; border:0; text-decoration:underline; color:#61343a; cursor:pointer; }.practice-play { display:block; background:#d5dabd; padding:18px 22px; color:#3e4a2f; border-top:1px solid #9ba27d; font-weight:600; }
.tour-controls { display:flex; align-items:center; flex-wrap:wrap; gap:15px; margin-bottom:22px; }.tour-controls>div { display:flex; flex-wrap:wrap; gap:6px; }.tour-controls>div button { min-height:44px; padding:10px 15px; border:1px solid #ae976e; color:#55382b; background:#e8dcc0; font-size:14px; cursor:pointer; }.tour-controls [aria-pressed="true"] { background:#6e343b; color:#fff1d9; }.tour-status { font-size:13px; color:#6c573e; }
.tour-scene { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(220px,1fr); margin:0 0 24px; background:#e5d8b9; border:1px solid #b79f78; }.tour-scene>a { position:relative; display:grid; align-items:center; background:#3a3827; }.tour-scene img { display:block; width:100%; height:auto; object-fit:contain; }.tour-scene figcaption { padding:28px; }.tour-scene h3 { font:28px/1.2 Georgia,serif; color:#5b3134; margin:14px 0; }.tour-scene p { font-size:16px; line-height:1.7; }.tour-scan { position:absolute; inset:0; border:3px solid #b6985966; pointer-events:none; }.campaign-tour[data-playing="true"] .tour-scene:not([hidden]) img { animation:tour-inspect 5s ease-in-out both; }.campaign-tour[data-playing="true"] .tour-scene:not([hidden]) .tour-scan { animation:tour-focus 5s ease-in-out both; }
@keyframes tour-inspect { from { opacity:.85; } to { opacity:1; } }@keyframes tour-focus { 0% { opacity:0; } 30%,70% { opacity:1; } 100% { opacity:.2; } }
.guide-quick { padding:22px 24px; background:#e1d7bb; border-left:4px solid #6c784e; margin-bottom:26px; }.guide-quick h2 { margin:0 0 14px; font:26px Georgia,serif; color:#4b4f30; }.guide-quick ol { padding-left:22px; margin:0; }.guide-quick li { font-size:16px; line-height:1.8; }.guide-quick p { font-size:15px; line-height:1.7; }.annotated-shot { position:relative; display:block; }.shot-pin { position:absolute; display:grid; place-items:center; width:28px; height:28px; border:2px solid #fff4db; border-radius:50%; background:#78373f; color:#fff5e5; font:700 15px system-ui,sans-serif; box-shadow:0 1px 6px #251d16aa; transform:translate(-50%,-50%); }.shot-key { list-style:none; padding:10px 0 0; margin:0; display:grid; gap:10px; }.shot-key li { font:15px/1.6 system-ui,sans-serif; color:#514330; display:flex; gap:10px; }.shot-key b { background:#743a40; color:#fff0d6; display:inline-grid; place-items:center; flex:0 0 25px; height:25px; border-radius:50%; }.guide-figure .inspect-hint { margin:8px 0; font-size:13px; }
.lightbox { width:min(1240px,95vw); }.lightbox-image-scroll { overflow:auto; max-height:72vh; }.lightbox img { max-width:none; width:1280px; max-height:none; height:auto; }.lightbox p { font-size:14px; }.lightbox-tools { display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }.lightbox-tools button { margin:0 0 10px; }.lightbox[data-fit="true"] img { width:100%; max-width:1280px; }
.support-form { max-width:700px; display:grid; gap:12px; margin-top:24px; }.support-form label { font-size:16px; font-weight:600; }.support-form label span { font-weight:400; }.support-form input,.support-form select,.support-form textarea { font:16px/1.6 system-ui,sans-serif; width:100%; padding:12px; border:1px solid #a8916a; color:#352b20; background:#fff7e9; border-radius:3px; box-sizing:border-box; }.support-form textarea { resize:vertical; }.support-form button { justify-self:start; }.support-confirmation { display:none; border:2px solid #748254; background:#e1e7d3; padding:20px; }.support-confirmation:target { display:block; }.support-confirmation:target~form { display:none; }
@media(max-width:700px) { .site-button,.site-nav .nav-play { font-size:14px; }.hero-actions { flex-wrap:wrap; gap:16px; }.feature-choices { grid-template-columns:1fr; }.feature-choices button { min-height:94px; padding:16px 18px 16px 42px; }.feature-choices button>span { left:16px; top:22px; }.feature-choices strong { font-size:21px; }.feature-choices small { font-size:14px; }.home-guide { grid-template-columns:90px minmax(0,1fr); gap:14px; }.guide-image { height:155px; }.guide-image img { max-width:85px; }.first-campaign { grid-template-columns:1fr; }.first-campaign li+li { padding:22px 0; border-left:0; border-top:1px solid #b7a688; }.chapter-heading p,.hero-lede,.home-guide p,.first-campaign p,.content-section p,.content-section li,.siege-intro>p { font-size:16px; }.faq-list summary { font-size:16px; }.article-index a { display:block; font-size:15px; padding:12px 0; }.tour-scene { grid-template-columns:1fr; }.tour-scene figcaption { padding:22px; }.tour-controls { align-items:flex-start; }.tour-controls>div { width:100%; }.tour-controls>div button { flex:1; padding:10px; }.practice-heading { padding:14px; font-size:11px; }.practice-orders,.practice-report { padding-left:16px; padding-right:16px; }.practice-report { min-height:215px; }.practice-buttons { padding:15px 16px 24px; }.guide-quick { padding:20px 16px; }.guide-figure figcaption { font-size:13px; }.shot-pin { width:23px; height:23px; font-size:13px; }.lightbox { padding:10px; }.lightbox p { margin:12px 0; } }
@media(prefers-reduced-motion:reduce) { .practice-army { transition:none; }.campaign-tour[data-playing="true"] .tour-scene img,.campaign-tour[data-playing="true"] .tour-scan { animation:none; } }
@media(max-width:700px) { .site-nav { flex-wrap:nowrap; gap:8px; }.site-nav .site-brand { font-size:16px; gap:6px; }.site-nav .site-brand img { width:26px; height:26px; }.site-nav-actions { flex-shrink:0; gap:6px; }.site-nav .nav-play,.site-menu-toggle { padding:10px; font-size:13px; min-height:44px; } }
@media(max-width:380px) { .site-nav .site-brand img { display:none; }.site-nav { gap:5px; }.site-nav .site-brand { font-size:15px; } }
.lightbox img { width:auto; }
.lightbox[data-fit="true"] img { width:auto; height:auto; max-width:100%; max-height:64vh; object-fit:contain; }
.campaign-tour .tour-scene:not([hidden]) img { animation:tour-inspect 5s ease-in-out both paused; }.campaign-tour .tour-scene:not([hidden]) .tour-scan { animation:tour-focus 5s ease-in-out both paused; }.campaign-tour[data-playing="true"] .tour-scene:not([hidden]) img,.campaign-tour[data-playing="true"] .tour-scene:not([hidden]) .tour-scan { animation-play-state:running; }
@media(prefers-reduced-motion:reduce) { .campaign-tour .tour-scene img,.campaign-tour .tour-scan { animation:none !important; } }