.palace-explorer { display: grid; grid-template-columns: 228px minmax(0,1fr); align-items: start; gap: 20px; min-width: 0; width: 100%; scroll-margin-top: calc(var(--topbar-height,88px) + 12px); }
.palace-picker { position: sticky; top: calc(var(--topbar-height,88px) + 8px); z-index: 3; min-width: 0; max-height: calc(100dvh - var(--topbar-height,88px) - 24px); overflow-y: auto; padding: 13px; border: 1px solid #b5a17b; border-radius: 12px; background: #f3efe4; box-shadow: 0 4px 16px rgba(39,42,39,.06); }
.explorer-label { display: block; margin-bottom: 9px; color: #65502d; font-size: 14px; font-weight: 600; }
.explorer-native-row { display: grid; grid-template-columns: minmax(0,1fr) 44px 44px; gap: 5px; align-items: stretch; }
.explorer-native-row select { min-width: 0; width: 100%; min-height: 44px; padding: 7px; border: 1px solid #b8ad94; border-radius: 7px; color: #292a26; background: #fffdf7; font: inherit; font-size: 16px; }
.explorer-step { min-height: 44px; padding: 3px; border: 1px solid #b5aa91; border-radius: 7px; color: #494337; background: #e8e2d2; font-size: 12px; font-weight: 500; white-space: nowrap; }
.explorer-choices { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; margin-top: 12px; }
.explorer-choices button { min-width: 0; min-height: 52px; padding: 7px 4px; border: 1px solid #c7bca4; border-radius: 8px; background: #fbf9f2; color: #4d473b; }
.explorer-choices strong { display: block; font-size: 13px; font-weight: 600; }
.explorer-choices small { display: block; margin-top: 3px; font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.explorer-choices button[aria-pressed="true"] { background: #263d35; color: #fffaf0; border-color: #263d35; }
.explorer-choices button:hover, .explorer-step:hover { border-color: #65502d; }
.explorer-content, .explorer-panels, .palace-explorer-panel { min-width: 0; max-width: 100%; }
.palace-explorer-panel:not(.card) { padding: 16px; border: 1px solid var(--page-border,#b5a17b); border-radius: 12px; background: #fbf9f2; }
.palace-explorer-panel.life-reminder + .life-reminder { margin-top: 0; padding-top: 16px; }
.explorer-context { color: #6c5140; font-size: 13px; }
.explorer-pager { display: grid; grid-template-columns: 80px minmax(0,1fr) 80px; gap: 10px; align-items: center; margin-top: 16px; }
.explorer-pager span { text-align: center; color: #5b5b53; font-size: 13px; }
.palace-picker :is(button,select):focus-visible { outline: 3px solid #65502d; outline-offset: 2px; }
.short-story-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 18px; }
.short-story-pair > section { min-width: 0; padding: 18px; border-radius: 10px; }
#app .short-story-pair h3 { padding: 8px 10px; margin: 0 0 14px; border-radius: 5px; }
#app .short-story-pair .story-best h3 { color: #fffaf0; background: #65502d; }
#app .short-story-pair .story-worst h3 { color: #272a27; background: #dedfd7; }
.short-story-pair article p { margin: 0; line-height: 1.95; }
@media (max-width:860px) {
  .palace-explorer { display: block; }
  .palace-picker { padding: 10px 12px; overflow: visible; max-height: none; margin-bottom: 14px; }
  .explorer-label { margin-bottom: 6px; font-size: 13px; }
  .explorer-choices { display: none; }
  .explorer-native-row { grid-template-columns: minmax(0,1fr) 50px 50px; gap: 6px; }
  .short-story-pair { grid-template-columns: minmax(0,1fr); }
}