body { flex-direction: column; background: radial-gradient(ellipse at 50% 15%, #223241, #0a101b 68%); }
#stage { width: min(calc(100vw - 16px), calc((100dvh - 68px) * 10 / 7), 1120px); }
#game { border-color: #69745d !important; }
.edition { color: #b8ac78; font-size: 10px; letter-spacing: 3px; line-height: 1.6; }
.panel { border-color: #556352; background: linear-gradient(150deg, #192b31, #111622); box-shadow: 0 20px 90px #0009; }
.panel h1 { color: #e7cb83; text-shadow: 0 0 22px #d4a95230, 2px 2px #423624; }
.panel .story { color: #cbd1cd; }
.quests button { border-color: #6c765c; background: #263738; }
.quests button:hover, .quests button:focus-visible { background: #364839; border-color: #e7cb83; }
#resumeQuest { border-color: #dfc783; background: #4a4b32; color: #f5e3a5; font-size: 14px; }
[hidden] { display: none !important; }
.adventure-tools { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 0; flex-wrap: wrap; }
.adventure-tools button, .journal-header button { border: 1px solid #66715e; border-radius: 5px; color: #e4d7af; background: #17252c; font-family: inherit; font-size: 11px; min-height: 36px; padding: 8px 12px; cursor: pointer; }
.adventure-tools span { color: #96a397; font-size: 10px; margin-left: 10px; }
.volume-row { display: flex; align-items: center; gap: 12px; margin: 16px 0; font-size: 13px; }
.volume-row input[type="range"] { flex: 1; accent-color: #e0c17b; }
.journal-panel { width: min(96%, 900px); max-width: 900px; }
.journal-header { display: flex; align-items: center; gap: 20px; justify-content: space-between; position: sticky; top: -26px; padding: 12px 0; background: #192831; z-index: 1; }
.journal-header h1 { text-align: left !important; font-family: Georgia, serif; font-size: 28px; letter-spacing: 0; text-transform: none; text-shadow: none; }
#journalContent p { font: 14px/1.8 system-ui, sans-serif; color: #c7d1ce; }
#journalContent h4 { color: #e4cb8a; margin: 12px 0 4px; font-size: 13px; }
#journalContent details { border-bottom: 1px solid #8a997f44; padding: 14px 0; }
#journalContent summary { color: #e4cb8a; cursor: pointer; font-size: 14px; }
.journal-map { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
.journal-map article { padding: 10px 14px; border: 1px solid #647c6240; background: #12242a; border-radius: 5px; }
.journal-map .current-room { border-color: #e6c879; }
.journal-map p { font-size: 12px !important; }
button:focus-visible, summary:focus-visible, input:focus-visible { outline: 2px solid #ffe3a1; outline-offset: 3px; }
canvas:focus { outline: none; }
@media (max-width: 600px) {
  #stage { width: calc(100vw - 12px); }
  .journal-header { flex-direction: column; align-items: stretch; gap: 5px; top: -14px; }
  .adventure-tools span { display: none; }
  .adventure-tools button { font-size: 10px; min-height: 40px; }
  .journal-map { grid-template-columns: 1fr; }
}
@media (max-height: 500px) and (orientation: landscape) {
  #stage { width: min(calc(100vw - 140px), calc((100dvh - 56px) * 10 / 7)); }
  .adventure-tools { padding: 4px 0; }
  .adventure-tools button { min-height: 32px; padding: 4px 10px; }
}
@media (orientation: portrait) and (max-width: 700px) { body { justify-content: flex-start; } }
