/* Compact layouts for the secondary public pages: leave room for the moving frontier. */

/* Laws: the section tabs sit immediately below the introduction. */
main.laws-page {
  display: flex !important;
  flex-direction: column !important;
  width: min(920px, calc(100% - 52px)) !important;
  margin: 24px auto 52px !important;
  padding: 10px 10px 32px !important;
}
.laws-page .laws-hero { order: 1; min-height: 220px !important; padding: 30px 38px !important; }
.laws-page .laws-hero h1 { font-size: clamp(40px, 5vw, 62px) !important; }
.laws-page .laws-hero p { margin-top: 14px !important; font-size: 14px !important; }
.laws-page .law-index { order: 2; width: min(100% - 24px, 850px) !important; margin: 20px auto 20px !important; }
.laws-page .law-index a { min-height: 68px !important; padding: 12px 14px !important; }
.laws-page .law-office { order: 3; width: min(100% - 24px, 760px) !important; margin: 18px auto 18px !important; }
.laws-page .law-proclamation { order: 4; width: min(100% - 24px, 820px) !important; margin-bottom: 20px !important; padding: 14px 17px !important; }
.laws-page .law-dossiers { order: 5; width: min(100% - 24px, 860px) !important; gap: 18px !important; }
.laws-page .law-dossier summary { min-height: 72px !important; padding: 13px 17px !important; }
.laws-page .dossier-body { padding: 16px !important; }
.laws-page .rule-block { padding: 17px !important; }

/* Lore: chapter tabs move directly under its cover, with a shorter cover panel. */
main.lore-gazette {
  display: flex !important;
  flex-direction: column !important;
  width: min(920px, calc(100% - 52px)) !important;
  margin: 24px auto 52px !important;
  padding: 10px 10px 32px !important;
}
.lore-gazette .story-hero { order: 1; min-height: 220px !important; padding: 30px 38px !important; }
.lore-gazette .story-hero h1 { font-size: clamp(40px, 5vw, 62px) !important; }
.lore-gazette .story-hero p { margin-top: 14px !important; font-size: 14px !important; }
.lore-gazette .story-contents { order: 2; width: min(100% - 24px, 850px) !important; margin: 20px auto !important; }
.lore-gazette .story-contents a { min-height: 78px !important; padding: 13px 16px !important; font-size: 19px !important; }
.lore-gazette .story-narrator { order: 3; width: min(100% - 24px, 760px) !important; margin: 18px auto 20px !important; }
.lore-gazette .story-divider { order: 4; width: min(100% - 24px, 820px) !important; margin-bottom: 17px !important; }
.lore-gazette .story-entry { order: 5; width: min(100% - 24px, 820px) !important; margin-bottom: 18px !important; padding: 25px 30px !important; }
.lore-gazette .story-entry h2 { margin-bottom: 12px !important; font-size: clamp(28px, 3vw, 40px) !important; }
.lore-gazette .story-closing { order: 6; width: min(100% - 24px, 740px) !important; margin-top: 24px !important; padding: 22px 27px !important; }

/* Privacy remains a clear document, but no longer fills the whole screen. */
.privacy-main {
  width: min(850px, calc(100% - 52px)) !important;
  margin: 24px auto 52px !important;
  padding: 25px 32px 32px !important;
  background: rgba(17, 14, 11, .78) !important;
  border: 1px solid rgba(232,224,207,.19) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.28) !important;
}
.privacy-hero { padding: 10px 0 25px !important; }
.privacy-hero h1 { margin: 12px 0 10px !important; font-size: clamp(34px, 4.5vw, 54px) !important; }
.privacy-grid { grid-template-columns: 165px 1fr !important; gap: 22px !important; padding: 23px 0 !important; }
.privacy-note { margin-top: 22px !important; padding: 15px 18px !important; }

@media (max-width: 760px) {
  main.laws-page, main.lore-gazette, .privacy-main { width: min(100% - 24px, 920px) !important; margin-top: 18px !important; }
  main.laws-page, main.lore-gazette { padding: 7px 7px 25px !important; }
  .laws-page .laws-hero, .lore-gazette .story-hero { min-height: 250px !important; padding: 24px !important; }
  .laws-page .law-index { grid-template-columns: repeat(2, 1fr) !important; }
  .lore-gazette .story-contents { grid-template-columns: 1fr !important; }
  .laws-page .law-office, .lore-gazette .story-narrator { grid-template-columns: 1fr !important; }
  .privacy-main { padding: 22px 20px 26px !important; }
  .privacy-grid { grid-template-columns: 1fr !important; gap: 10px !important; padding: 19px 0 !important; }
}
