/* PC向けの配置。タッチ端末・狭いウィンドウは既存のCSSを使う。 */
@media (min-width: 1100px) and (min-height: 600px) and (hover: hover) and (pointer: fine) {
  html.pc-input #app:is(.board-camera-active, .in-combat) {
    width: calc(100% - 32px); max-width: 1440px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    grid-template-rows: auto auto minmax(100px, 1fr) auto auto;
    grid-template-areas: "top top" "scene party" "scene log" "scene commands" "haul dock";
    overflow: hidden;
  }
  html.pc-input #app:is(.board-camera-active, .in-combat) > #topbar { grid-area: top; }
  html.pc-input #app:is(.board-camera-active, .in-combat) > #screen {
    grid-area: scene; min-width: 0; min-height: 0; align-self: stretch;
    padding: 12px 10px 8px; align-items: flex-start;
  }
  html.pc-input #app:is(.board-camera-active, .in-combat) > #party {
    grid-area: party; align-self: start; padding: 12px 10px 6px;
  }
  html.pc-input #app:is(.board-camera-active, .in-combat) > #hud {
    grid-area: log; min-height: 100px; min-width: 0; padding: 6px 10px;
  }
  html.pc-input #app:is(.board-camera-active, .in-combat) #log { min-height: 54px; font-size: 14px; }
  html.pc-input #app:is(.board-camera-active, .in-combat) > #controls {
    grid-area: commands; min-height: 0; max-height: 45dvh; overflow-y: auto;
  }
  html.pc-input #app:is(.board-camera-active, .in-combat) > #runbar { grid-area: haul; margin: 0 10px 8px; }
  html.pc-input #app:is(.board-camera-active, .in-combat) > #hint { grid-area: dock; min-width: 0; }
  html.pc-input #app.board-camera-active #hint.dg-dock { flex-wrap: wrap; }
  html.pc-input #app.board-camera-active #hint.dg-dock::before {
    content: "移動: 矢印キー / WASD ・ 戻る: Esc";
    flex: 1 0 100%; padding: 2px 4px; color: #b9ad94; font-size: 12px;
  }
  html.pc-input #app.board-camera-active #hint .dk-idle { display: none; }
  html.pc-input #app.board-camera-active #hint .dk-btn { flex: 1 1 auto; }
  html.pc-input #app.board-camera-active #runbar { align-self: end; }
  html.pc-input #app.in-combat #enemy-names {
    top: calc(12px + var(--pc-view-height)); bottom: auto; transform: translateY(-100%);
  }
  html.pc-input #app:is(.board-camera-active, .in-combat) :is(button, [role="button"]):focus-visible {
    outline: 2px solid #f3d58b; outline-offset: -2px;
  }
}

/* 閉じる操作はPCのウィンドウにだけ表示する。タッチ端末の寸法は変えない。 */
.ui-pc-close { display: none; }
.jr-text { display: contents; }

@media (min-width: 1100px) and (min-height: 600px) and (hover: hover) and (pointer: fine) {
  /* 画面全体と常設の施設メニュー。画面を替えても同じ場所から移動する。 */
  html.pc-input { --game-width: min(1440px, calc(100vw - 32px)); }
  html.pc-input #app, html.pc-input #town-shell {
    width: min(1440px, calc(100vw - 32px)); max-width: 1440px;
  }
  html.pc-input #town-shell {
    display: grid; grid-template-columns: 152px minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr); gap: 0;
    border-inline: 1px solid #493a2b;
  }
  html.pc-input #town-shell > .ts-head { grid-column: 2; grid-row: 1; }
  html.pc-input #town-shell > .ts-coaching { grid-column: 2; grid-row: 2; }
  html.pc-input #town-shell > #town-screen {
    grid-column: 2; grid-row: 3; min-width: 0; padding: 12px 20px 16px;
  }
  html.pc-input #town-shell > .ui-tabbar {
    grid-column: 1; grid-row: 1 / -1; height: auto; min-height: 0;
    display: flex; flex-direction: column; justify-content: center; gap: 12px;
    padding: 24px 10px; border-right: 1px solid #493a2b; border-top: 0;
  }
  html.pc-input #town-shell .ui-tab {
    flex: 0 0 auto; height: 76px; width: 100%; padding: 10px 4px;
    border: 1px solid transparent; border-radius: 4px;
  }
  html.pc-input #town-shell .ui-tab.on { border-color: #8a6d2e; background: rgba(201,162,74,.1); }
  html.pc-input #town-shell .ui-tab-l { font-size: 14px; letter-spacing: .08em; }
  html.pc-input #town-shell .ui-tab.center { justify-content: center; gap: 4px; }
  html.pc-input #town-shell .ui-tab.center .ui-tab-icw {
    position: relative; inset: auto; transform: none; width: 36px; height: 36px;
  }
  html.pc-input #town-shell .ui-gate-medal { box-shadow: none; }
  html.pc-input #town-shell .ui-gate-medal::after { content: none; }
  html.pc-input #town-shell .ui-gate-ic { width: 28px; height: 32px; }
  html.pc-input #town-shell .ui-tab.center .ui-tab-l { padding: 2px 8px; }
  html.pc-input :is(button, [role="button"], input, select, textarea):focus-visible {
    outline: 2px solid #f3d58b; outline-offset: -2px;
  }
  html.pc-input button:not(:disabled):hover { filter: brightness(1.12); }
  html.pc-input :is(.ui-chips-in, .wpc-character-strip) { flex-wrap: wrap; overflow-x: visible; }
  html.pc-input .ui-sheet :is(.ui-chips-in, .wpc-character-strip) { overflow-x: auto; }

  /* 街は風景と目標を並べ、その下へ施設・依頼を続ける。 */
  html.pc-input #town-screen > .hb {
    display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto; align-content: start; gap: 16px;
    overflow-y: auto;
  }
  html.pc-input .hb > .hb-hero { grid-column: 1; grid-row: 1; height: clamp(240px, 40dvh, 420px) !important; }
  html.pc-input .hb > .hb-actions { grid-column: 2; grid-row: 1; margin: 0; min-width: 0; }
  html.pc-input .hb > .hb-fac { grid-column: 1 / -1; margin: 0; }
  html.pc-input .hb > .hb-mid { grid-column: 1 / -1; }
  html.pc-input .hb-sug-list { grid-template-columns: minmax(0, 1fr); }
  html.pc-input .hb-sug { min-height: 56px; }
  html.pc-input .hb .hb-tile { height: 112px; }

  /* 館では魂と能力を見比べられ、装備と共有袋は幅いっぱいを使う。 */
  html.pc-input .pt-root.m-town > .pt-overview {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px;
    align-items: start; align-content: start;
  }
  html.pc-input .pt-overview > [data-mansion-section="equip"] { grid-column: 1 / -1; }
  html.pc-input .pt-overview .pt-slots { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  html.pc-input .pt-form { gap: 14px; }
  html.pc-input .pt-slotp { width: 60px; }
  html.pc-input .pt-slotp-n { max-width: 60px; font-size: 12px; }
  html.pc-input .pt-bagwrap .pt-bag { grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); }

  /* 商会・図鑑・依頼・魂などの一覧。中身だけをスクロールする。 */
  html.pc-input .wpc-list:is(.buy, .rf-list, .ec-list) {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start;
    align-items: start; gap: 12px;
  }
  html.pc-input .wpc-list:is(.buy, .rf-list, .ec-list) > .wpc-empty { grid-column: 1 / -1; }
  html.pc-input .wpc-character { flex-basis: 76px; min-height: 76px; }
  html.pc-input .wpc-character > span { max-width: 70px; font-size: 12px; }
  html.pc-input .wa-pgrid {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
    grid-auto-rows: minmax(112px, auto) !important;
  }
  html.pc-input :is(.jr-results, .pt-chl, .dp-gates) {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-content: start;
  }
  html.pc-input .dp-gates > :is(.dp-chap, .dp-sealed, .dp-abyss) { grid-column: 1 / -1; }

  /* 共通シートは中央のウィンドウ。短い確認や祝祭は読みやすい幅を保つ。 */
  html.pc-input .ui-sheet-wrap { justify-content: center; padding: 24px; }
  html.pc-input .ui-sheet:not(.k-celebrate) {
    width: min(960px, calc(100vw - 48px)); max-width: 960px;
    max-height: calc(100dvh - 64px); border: 1px solid var(--sheet-accent, #8a6d2e);
    border-radius: 8px; padding-top: 18px;
  }
  html.pc-input .ui-sheet:is(.ui-confirm, .dp-brief-sheet, .pt-pick-sheet, .player-name-sheet) { max-width: 600px; }
  html.pc-input .ui-sheet.k-celebrate { max-width: 460px; }
  html.pc-input .ui-sheet .ui-grab { display: none; }
  html.pc-input .ui-sheet-head { padding-inline: 56px; }
  html.pc-input .ui-sheet-body { padding: 12px 24px 20px; }
  html.pc-input .ui-sheet-foot { padding: 12px 24px 18px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
  html.pc-input .ui-sheet-foot > .dp-ready { grid-column: 1 / -1; }
  html.pc-input .ui-pc-close {
    display: flex; align-items: center; justify-content: center;
    position: absolute; right: 8px; top: 6px; z-index: 4;
    width: 44px; height: 44px; border: 1px solid #665338; border-radius: 4px;
    background: #1d171c; color: #eadbb3; font: 24px/1 var(--font); cursor: pointer;
  }
  html.pc-input .ui-sheet :is(.ui-lines, .jr-text, .dp-brief-l) { max-width: 48em; margin-inline: auto; }
  html.pc-input .ui-sheet:is(.cx-sheet, .pt-sheet) { height: calc(100dvh - 64px); }
  html.pc-input .stg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
  html.pc-input .stg > .stg-h { grid-column: 1 / -1; }
  html.pc-input .stg-row { min-width: 0; }
  html.pc-input .stg > .stg-stack { grid-column: 1 / -1; }
  html.pc-input .jr-detail:has(.jr-illustration) .ui-sheet-body {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start;
  }
  html.pc-input .jr-detail .ui-sheet-title { grid-column: 1 / -1; }
  html.pc-input .jr-detail .jr-illustration { grid-column: 1; grid-row: 2; margin-top: 0; }
  html.pc-input .jr-detail .jr-text { grid-column: 2; grid-row: 2; }
  html.pc-input .jr-text { display: block; min-width: 0; }
  html.pc-input .jr-results > :is(.jr-group, .jr-empty) { grid-column: 1 / -1; }
  html.pc-input .jr-results .jr-card { margin: 0; height: 100%; }
  html.pc-input .jr-results .jr-note { min-width: 0; }


  /* タイトルと物語。本文の長い行を抑え、絵と操作を左右に配置する。 */
  html.pc-input .ttl-ui {
    max-width: 1280px; margin: auto; padding: 48px;
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr);
    gap: 48px; align-content: center; align-items: center;
  }
  html.pc-input .ttl-space { display: none; }
  html.pc-input .ttl-menu:is(.has-save, .no-save) { max-width: 540px; display: flex; }
  html.pc-input .ttl-menu.no-save .ttl-btns { flex-direction: column; }
  html.pc-input .ttl-note { line-height: 1.7; }
  html.pc-input .ttl-main { font-size: clamp(64px, 8vw, 110px); }
  html.pc-input .ttl-en { font-size: 12px; }
  html.pc-input .sc-stage {
    max-width: 1200px; padding: 48px 32px;
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto minmax(0, 1fr) auto; column-gap: 40px;
  }
  html.pc-input .sc-stage > .sc-head { grid-column: 1; grid-row: 1 / -1; align-self: center; }
  html.pc-input .sc-stage > .sc-art { grid-column: 1; grid-row: 1 / -1; align-self: center; margin: 0; }
  html.pc-input .sc-stage > :is(.sc-kicker, .sc-title, .sc-page, .sc-foot) { grid-column: 2; }
  html.pc-input .sc-stage > .sc-kicker { grid-row: 1; }
  html.pc-input .sc-stage > .sc-title { grid-row: 2; }
  html.pc-input .sc-stage > .sc-page { grid-row: 4; }
  html.pc-input .sc-stage > .sc-foot { grid-row: 5; }
  html.pc-input .sc-art :is(img, canvas) { width: 100% !important; height: auto !important; max-height: 70dvh; object-fit: contain; }
  html.pc-input .sc-line { font-size: 16px; line-height: 1.9; }
  html.pc-input .op-text { width: min(760px, calc(100% - 64px)); max-width: 760px; margin-inline: auto; font-size: clamp(16px, 2vh, 20px); }
  html.pc-input :is(.ui-sheet-body, .pt-overview, .wa-parea, .wpc-list, .hb, .fc-tav-body, .pt-bag, .sc-page) { scrollbar-width: thin !important; scrollbar-color: #8a6d2e #17121a; }
  html.pc-input :is(.ui-sheet-body, .pt-overview, .wa-parea, .wpc-list, .hb, .fc-tav-body, .pt-bag, .sc-page)::-webkit-scrollbar { display: block !important; width: 8px !important; height: 8px !important; }
  html.pc-input :is(.ui-sheet-body, .pt-overview, .wa-parea, .wpc-list, .hb, .fc-tav-body, .pt-bag, .sc-page)::-webkit-scrollbar-thumb { background: #8a6d2e; border-radius: 4px; }

  /* 館の会話、魂の一覧、認証など、独立して開く画面にも同じPC幅を使う。 */
  html.pc-input .iv-scene { max-width: min(1200px, calc(100vw - 48px)); }
  html.pc-input .iv-art { left: 0; right: 44%; top: 48px; bottom: 48px; height: auto; }
  html.pc-input .iv-stage { left: 58%; right: 32px; top: 72px; bottom: 48px; justify-content: center; padding: 0; }
  html.pc-input .iv-say .pt-kp-l { font-size: 16px; }
  html.pc-input .story-card { max-width: 760px; }
  html.pc-input .confirm-card { max-width: 520px; }
  html.pc-input .cloud-panel { max-width: 480px; padding: 28px; border: 1px solid #65736e; border-radius: 8px; background: #171d1a; }
  html.pc-input .sp-pick-sheet .sp-plist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }
  html.pc-input .pt-chl > :is(.pt-chl-new, .pt-chl-s, .pt-ch-sep) { grid-column: 1 / -1; }
  html.pc-input .jg-overlay { max-width: var(--game-width); margin-inline: auto; }
  html.pc-input .jg-close { min-height: 44px; }

  html.pc-input body:has(.test-play-banner) :is(.iv-scene, .sc-scene, .op-overlay, .jg-overlay) { top: 38px; }

}

/* PC専用部品。狭い窓へ切り替えても、開いている本文と操作は残す。 */
.pc-panel { min-width: 0; border: 1px solid #493a2b; border-radius: 4px; background: var(--grain), #100d12; padding: 12px; }
.pc-heading { margin: 0 0 12px; font-size: 15px; color: #e8d08a; line-height: 1.5; }
.pc-muted { color: #b3a78f; font-size: 12px; line-height: 1.6; }
.pc-person-text, .pc-stock-summary { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; text-align: left; }
.pc-person-text b, .pc-stock-summary b { white-space: normal; overflow-wrap: anywhere; font-size: 14px; }
.pc-master { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; min-height: 0; min-width: 0; }
.pc-master-list { display: flex; flex-direction: column; gap: 8px; min-height: 0; min-width: 0; }
.pc-search { width: 100%; min-height: 44px; border: 1px solid #665338; border-radius: 4px; padding: 8px 12px; font: 14px var(--font); color: var(--ink); background: #151019; }
.pc-count { font-size: 12px; color: #b3a78f; }
.pc-rows { display: flex; flex-direction: column; gap: 6px; min-height: 0; overflow-y: auto; max-height: 40dvh; padding: 2px; }
.pc-list-row { flex: 0 0 auto; width: 100%; padding: 10px 12px; justify-content: flex-start; }
.pc-list-row[aria-pressed="true"], .pc-roster-row[aria-pressed="true"] { border-color: #e8d08a; background: #34291b; box-shadow: inset 3px 0 #e8d08a; }
.pc-roster.recruiting .pc-roster-row[aria-pressed="true"] { border-color: #493a2b; background: #17121a; box-shadow: none; }
.pc-detail { min-width: 0; min-height: 0; overflow-y: auto; padding: 12px; border: 1px solid #493a2b; background: #100d12; text-align: left; }
.pc-unread { font-size: 11px; color: #e8d08a; }
.pc-reader-categories, .pc-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.pc-settings { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
.pc-settings-nav { display: flex; flex-wrap: wrap; gap: 8px; align-content: start; }
.pc-settings-body { min-width: 0; }

@media (min-width: 1100px) and (min-height: 600px) and (hover: hover) and (pointer: fine) {
  html.pc-input .pc-dashboard {
    flex: 1 1 0; min-height: 0; display: grid; overflow-y: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-content: start; padding: 2px;
  }
  html.pc-input .pc-dashboard > :is(.hb-hero, .pc-summary) { grid-column: 1 / -1; }
  html.pc-input .pc-dashboard > .hb-hero { height: 56px; }
  html.pc-input .pc-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
  html.pc-input .pc-summary-cell { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px; border: 1px solid #493a2b; background: #151019; }
  html.pc-input .pc-summary-cell b { color: #e8d08a; font-size: 18px; }
  html.pc-input .pc-service-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
  html.pc-input :is(.pc-dashboard-tasks, .pc-dashboard-more) { display: flex; flex-direction: column; gap: 8px; }
  html.pc-input .pc-dashboard-tasks .hb-sug { flex: 0 0 auto; }
  html.pc-input .pc-dashboard-party { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-content: start; }
  html.pc-input .pc-dashboard-party .pc-heading { grid-column: 1 / -1; }
  html.pc-input .pc-party-card { justify-content: flex-start; gap: 10px; padding: 8px; min-height: 90px; }
  html.pc-input .pc-party-card canvas { width: 44px; height: 44px; flex: 0 0 auto; }

  html.pc-input .pt-root.pc-mansion { display: grid; grid-template-columns: 220px minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); gap: 12px; }
  html.pc-input .pc-roster { grid-column: 1; grid-row: 1 / -1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
  html.pc-input .pc-roster-row { flex: 0 0 auto; display: flex; justify-content: flex-start; gap: 8px; padding: 8px; }
  html.pc-input .pc-roster-row canvas { width: 44px; height: 44px; flex: 0 0 auto; }
  html.pc-input .pc-roster-row .pc-person-text { font-size: 11px; }
  html.pc-input .pc-mansion-head { grid-column: 2; grid-row: 1; min-width: 0; }
  html.pc-input .pc-mansion-head h1 { display: inline; font-size: 20px; margin-right: 12px; color: #e8d08a; }
  html.pc-input .pc-mansion-head .pc-actions { margin-top: 12px; }
  html.pc-input .pc-mansion-head .pc-actions > button { width: auto; flex: 0 0 auto; }
  html.pc-input .pc-actions > .pt-equip-actions { display: flex; flex-direction: row; flex-wrap: wrap; margin-left: auto; }
  html.pc-input .pc-actions :is(.pt-bench, .pt-order) { width: auto; flex-direction: row; padding: 6px 12px; }
  html.pc-input .pc-mansion-columns { grid-column: 2; grid-row: 2; min-height: 0; display: grid; gap: 12px; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-rows: minmax(0, 1fr) minmax(150px, .65fr); }
  html.pc-input .pc-mansion-section { min-width: 0; min-height: 0; overflow-x: hidden; overflow-y: auto; touch-action: pan-y; }
  html.pc-input .pc-mansion-section[data-section="stats"] { grid-column: 1 / -1; }
  html.pc-input .pc-mansion-section > .pc-heading { position: sticky; top: -12px; z-index: 2; padding: 10px 0; background: #100d12; }
  html.pc-input .pc-mansion-section .pt-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html.pc-input .pc-mansion-section .pt-bagwrap .pt-bag { grid-template-columns: repeat(4, minmax(0, 1fr)); max-height: none; overflow: visible; }

  html.pc-input .wpc-list.buy.pc-shop-browser { display: flex; overflow: hidden; }
  html.pc-input .pc-master { flex: 1 1 0; grid-template-columns: minmax(240px, .85fr) minmax(0, 1.15fr); height: 100%; }
  html.pc-input .pc-rows { max-height: none; flex: 1 1 0; }
  html.pc-input .pc-detail .wpc-srow { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
  html.pc-input .pc-detail .wpc-srow-info { width: 100%; }
  html.pc-input .pc-detail .wpc-buy { width: 100%; padding: 0 10px 10px; box-sizing: border-box; }
  html.pc-input .pc-detail .wpc-buy-main { width: 100%; min-height: 52px; }
  html.pc-input .pc-reader-sheet .ui-sheet-body { display: flex; flex-direction: column; overflow: hidden; gap: 12px; }
  html.pc-input .pc-reader-sheet { height: calc(100dvh - 64px); }
  html.pc-input .pc-reader-sheet .pc-master { grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); }
  html.pc-input .pc-reader-sheet .jr-line { max-width: 100%; font-size: 15px; }
  html.pc-input .pc-settings { grid-template-columns: 172px minmax(0, 1fr); }
  html.pc-input .pc-settings-nav { flex-direction: column; flex-wrap: nowrap; }
  html.pc-input .pc-settings-nav button { text-align: left; justify-content: flex-start; }
  html.pc-input .pc-settings-nav [aria-pressed="true"] { border-color: #e8d08a; background: #34291b; }
  html.pc-input .pc-settings .stg { display: flex; flex-direction: column; }

  html.pc-input #app.has-pc-tools { grid-template-rows: auto auto auto minmax(100px, 1fr) auto auto; grid-template-areas: "top top" "tools tools" "scene party" "scene log" "scene commands" "haul dock"; }
  html.pc-input #pc-explore-tools { grid-area: tools; display: flex; gap: 8px; padding: 8px 12px; border-bottom: 1px solid #493a2b; background: #151019; }
  html.pc-input .pc-tool { flex: 1 1 0; min-height: 44px; min-width: 0; padding: 6px; font: 13px var(--font); border: 1px solid #665338; border-radius: 4px; background: #221b22; color: #eadbb3; cursor: pointer; }
  html.pc-input :is(.pc-dashboard, .pc-roster, .pc-mansion-section, .pc-rows, .pc-detail) { scrollbar-width: thin !important; scrollbar-color: #8a6d2e #17121a; }
  html.pc-input :is(.pc-dashboard, .pc-roster, .pc-mansion-section, .pc-rows, .pc-detail)::-webkit-scrollbar { display: block !important; width: 8px !important; height: 8px !important; }
  html.pc-input :is(.pc-dashboard, .pc-roster, .pc-mansion-section, .pc-rows, .pc-detail)::-webkit-scrollbar-thumb { background: #8a6d2e; border-radius: 4px; }
}

@media (min-width: 1100px) and (min-height: 600px) and (hover: hover) and (pointer: fine) {
  html.pc-input #town-shell > .ui-tabbar:has(.pc-town-shortcuts) { justify-content: flex-start; padding: 12px 10px; gap: 6px; overflow-y: auto; }
  html.pc-input #town-shell .ui-tabbar:has(.pc-town-shortcuts) > .ui-tab { height: 58px; }
  html.pc-input .pc-town-shortcuts { display: flex; flex-direction: column; gap: 6px; width: 100%; margin-top: 12px; padding-top: 12px; border-top: 1px solid #665338; }
  html.pc-input .pc-town-link { min-height: 44px; padding: 6px; background: #1d171c; border: 1px solid #493a2b; border-radius: 3px; color: #eadbb3; font: 13px var(--font); cursor: pointer; }
  html.pc-input .pc-palace { display: grid; grid-template-columns: 160px minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); gap: 12px; }
  html.pc-input .pc-palace > .kp-full { grid-column: 1 / -1; }
  html.pc-input .pc-palace-nav { grid-column: 1; grid-row: 2; display: flex; flex-direction: column; gap: 8px; min-height: 0; overflow-y: auto; }
  html.pc-input .pc-palace > .pl-body { grid-column: 2; grid-row: 2; min-width: 0; }
}

@media (min-width: 1100px) and (min-height: 600px) and (hover: hover) and (pointer: fine) {
  html.pc-input #app.in-combat {
    grid-template-rows: auto auto minmax(100px, 1fr) auto 36px auto;
    grid-template-areas: "top top" "scene party" "scene log" "scene commands" "message commands" "haul dock";
  }
  html.pc-input #app.in-combat > #combat-message { grid-area: message; min-width: 0; }
}