:root { color-scheme: light; --ink:#343940; --paper:#f4ead9; --edge:#555b63; }
.towns-button,.towns-dialog button,.towns-dialog input,.towns-dialog textarea { font:inherit; color:var(--ink); border:1.5px solid var(--edge); border-radius:7px; box-sizing:border-box; }
.towns-button,.towns-dialog { font:15px/1.4 Georgia,serif; }
.towns-button,.towns-dialog button { cursor:pointer; background:#eed8a6; min-height:40px; padding:8px 14px; box-shadow:0 2px 0 #34394055; }
.towns-button { position:fixed; top:12px; left:12px; z-index:5; }
.towns-button:disabled { display:none; }
.towns-dialog button:hover,.towns-button:hover { filter:brightness(1.06); }
.towns-dialog button:active,.towns-button:active { transform:translateY(1px); box-shadow:none; }
.towns-dialog :focus-visible,.towns-button:focus-visible { outline:3px solid #536cb2; outline-offset:3px; }
.towns-dialog button:disabled { cursor:default; opacity:.5; }
.towns-dialog button[hidden],.towns-frame-controls button[hidden] { display:none; }
.towns-dialog { color:var(--ink); background:var(--paper); width:min(720px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); border:2px solid var(--edge); border-radius:12px; padding:24px; box-sizing:border-box; box-shadow:0 15px 60px #141e3555; }
.towns-dialog::backdrop { background:#17232c77; }
.towns-dialog h1 { font-size:26px; margin:0; }
.towns-dialog h2 { font-size:18px; margin:0 0 12px; }
.towns-head,.towns-actions,.towns-save { display:flex; align-items:center; gap:12px; }
.towns-head { justify-content:space-between; margin-bottom:24px; }
.towns-section + .towns-section { border-top:1px solid #555b6333; padding-top:24px; margin-top:24px; }
.towns-save { align-items:end; }
.towns-field { display:grid; gap:8px; flex:1; }
.towns-dialog input,.towns-dialog textarea { width:100%; padding:10px 12px; background:#fffaf0; min-height:42px; }
.towns-dialog textarea { min-height:90px; resize:vertical; font:13px/1.5 monospace; }
.towns-actions { flex-wrap:wrap; margin-top:12px; }
.towns-dialog .towns-secondary { background:#dbd9db; }
.towns-dialog .towns-blue { background:#b4d4e1; }
.towns-status { min-height:21px; margin:12px 0 0; overflow-wrap:anywhere; }
.towns-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.towns-card { display:grid; gap:10px; padding:12px; border:1px solid #555b6355; border-radius:9px; background:#fffaed; overflow:hidden; }
.towns-card img { width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:5px; background:#618e98; }
.towns-card strong { overflow-wrap:anywhere; }
.towns-card time { font-size:12px; }
.towns-card .towns-actions { margin:0; gap:8px; }
.towns-card [hidden],.towns-removed[hidden] { display:none; }
.towns-rename { display:grid; gap:12px; }
.towns-removed > .towns-grid { padding:12px; }
.towns-card button { font-size:13px; padding:7px 10px; min-height:36px; }
.towns-empty { margin:0; }
@media(max-width:560px) { .towns-dialog { padding:18px; } .towns-save { flex-direction:column; align-items:stretch; } .towns-grid { grid-template-columns:1fr; } }
.towns-frame { position:fixed; inset:0; pointer-events:none; z-index:6; }
.towns-frame[hidden] { display:none; }
.towns-frame-border { position:fixed; border:2px solid #f4ead9; box-sizing:border-box; box-shadow:0 0 0 100vmax #17232c66; }
.towns-frame-controls { position:fixed; left:50%; bottom:16px; transform:translateX(-50%); width:max-content; max-width:calc(100vw - 32px); display:flex; flex-wrap:wrap; justify-content:center; gap:12px; padding:12px; border:1.5px solid var(--edge); border-radius:9px; background:var(--paper); color:var(--ink); font:15px/1.4 Georgia,serif; pointer-events:auto; }
.towns-frame-controls button { min-height:40px; padding:8px 14px; border:1.5px solid var(--edge); border-radius:7px; background:#b4d4e1; color:var(--ink); font:inherit; cursor:pointer; }
.towns-frame-controls button:hover { filter:brightness(1.06); }
.towns-frame-controls button:focus-visible { outline:3px solid #536cb2; outline-offset:3px; }
.towns-frame-controls button:disabled { opacity:.5; cursor:default; }
.towns-frame-controls [role=status]:empty { display:none; }
.towns-frame-controls [role=status] { flex-basis:100%; min-width:0; text-align:center; overflow-wrap:anywhere; }
.towns-settings { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 16px; }
.towns-toggle { display:flex; gap:12px; align-items:center; min-height:44px; cursor:pointer; }
.towns-dialog .towns-toggle input { appearance:none; flex:0 0 24px; width:24px; height:24px; min-height:24px; padding:0; margin:0; border-radius:5px; display:grid; place-content:center; cursor:pointer; }
.towns-toggle input:checked { background:#b4d4e1; }
.towns-toggle input:checked::before { content:''; width:10px; height:6px; border-left:2px solid var(--ink); border-bottom:2px solid var(--ink); transform:rotate(-45deg) translateY(-1px); }
.towns-toggle input:disabled { opacity:.5; cursor:default; }
.towns-help { font-size:13px; margin:12px 0 0; }
@media(max-width:560px) { .towns-settings { grid-template-columns:1fr; gap:8px; } }
.towns-volume { display:flex; align-items:center; gap:24px; margin-top:16px; }
.towns-volume output { font-size:13px; }
.towns-dialog .towns-volume input[type=range] { appearance:none; width:100%; height:12px; min-height:12px; padding:0; border-radius:6px; background:#b4d4e1; cursor:pointer; margin:8px 0; }
.towns-volume input[type=range]::-webkit-slider-thumb { appearance:none; width:24px; height:24px; border:1.5px solid var(--edge); border-radius:5px; background:#f4ead9; }
.towns-volume input[type=range]::-moz-range-thumb { width:22px; height:22px; border:1.5px solid var(--edge); border-radius:5px; background:#f4ead9; }
.towns-volume .towns-toggle { flex:0 0 auto; }
.audio-check-button { top:auto; bottom:12px; z-index:7; }
.audio-check-button:disabled { display:block; opacity:.6; }
.towns-key-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 24px; margin-top:20px; }
.towns-key-row { display:flex; align-items:center; justify-content:space-between; gap:12px; min-width:0; }
.towns-key-row span { overflow-wrap:anywhere; }
.towns-key-row button { min-width:64px; max-width:130px; }
.towns-key-row button[aria-pressed=true] { background:#b4d4e1; outline:3px solid #536cb2; outline-offset:2px; }
@media(max-width:560px) { .towns-key-list { grid-template-columns:1fr; gap:12px; } }
.towns-controller-help { margin-top:12px; border:1.5px solid var(--edge); border-radius:7px; background:#fffaed; }
.towns-controller-help summary { cursor:pointer; list-style:none; position:relative; min-height:40px; box-sizing:border-box; padding:9px 44px 9px 12px; }
.towns-controller-help summary::-webkit-details-marker { display:none; }
.towns-controller-help summary::after { content:''; position:absolute; right:16px; top:50%; width:7px; height:7px; border-right:1.5px solid var(--ink); border-bottom:1.5px solid var(--ink); transform:translateY(-50%) rotate(45deg); }
.towns-controller-help[open] summary::after { transform:translateY(-50%) rotate(225deg); }
.towns-controller-help dl { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px 16px; padding:0 12px 12px; margin:8px 0 0; font-size:13px; }
.towns-controller-help dd { margin:0; }
.towns-gamepad-cursor { position:fixed; width:18px; height:18px; transform:translate(-50%,-50%); box-sizing:border-box; border:2px solid #f4ead9; border-radius:50%; box-shadow:0 0 0 1.5px #343940aa; pointer-events:none; z-index:4; }
.towns-gamepad-cursor[hidden] { display:none; }
.towns-gamepad-cursor[data-action=remove] { border-color:#e98e87; }
.towns-gamepad-replay { position:fixed; top:12px; right:64px; z-index:7; width:min(540px,calc(100vw - 96px)); padding:12px; display:flex; flex-wrap:wrap; gap:8px; font:13px/1.4 Georgia,serif; }
.towns-gamepad-replay strong,.towns-gamepad-replay p { flex-basis:100%; margin:0; }
.towns-gamepad-replay button { min-height:36px; padding:6px 10px; font:inherit; }
.towns-gamepad-legend { position:fixed; right:16px; bottom:16px; z-index:4; max-width:min(420px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow:auto; box-sizing:border-box; padding:16px; border:1.5px solid var(--edge); border-radius:9px; background:var(--paper); color:var(--ink); font:13px/1.4 Georgia,serif; pointer-events:none; }
.towns-gamepad-legend[hidden] { display:none; }
.towns-gamepad-legend h2 { font-size:16px; margin:0 0 12px; }
.towns-gamepad-legend dl { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px 16px; margin:0; }
.towns-gamepad-legend dd { margin:0; }
.towns-bounds-check{position:fixed;z-index:40;top:16px;right:16px;width:min(300px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;display:grid;gap:12px;padding:16px}
.towns-pad-row { align-items:start; }
.towns-pad-row > span { padding-top:8px; }
.towns-pad-row button { flex:0 0 52%; max-width:none; overflow-wrap:anywhere; }
.towns-pads .towns-key-list { grid-template-columns:1fr; }
.towns-language-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:12px; }
.towns-language-list button { overflow-wrap:anywhere; }
.towns-language-list button[aria-pressed=true] { background:#b4d4e1; border-width:2px; }
.towns-languages > .towns-status { margin:0; padding:0 12px 12px; }
.towns-languages > .towns-status:empty { display:none; }
.towns-instructions { display:grid; gap:8px; padding:0 16px 12px 32px; margin:12px 0 0; }
.towns-credit-author { font-size:24px; text-align:center; margin:24px 0; }
.towns-credits .towns-section { padding-top:24px; margin-top:24px; border-top:1px solid #555b6333; }
.towns-credit-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 24px; list-style:none; margin:0; padding:0; }
@media(max-width:560px) { .towns-language-list { grid-template-columns:repeat(2,minmax(0,1fr)); } .towns-credit-list { grid-template-columns:1fr; } }

.towns-credits { overflow:hidden; }
.towns-credit-roll { max-height:calc(100dvh - 162px); overflow:auto; overscroll-behavior:contain; scrollbar-gutter:stable; padding:0 8px 8px; }
.shared-hud { position:fixed; z-index:8; top:12px; left:12px; max-width:calc(100vw - 24px); box-sizing:border-box; padding:12px 16px; border:1.5px solid var(--edge); border-radius:9px; background:var(--paper); color:var(--ink); box-shadow:0 3px 12px #141e3533; font:14px/1.4 Georgia,serif; }
.shared-heading { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.shared-heading strong { font-size:21px; }
.shared-heading span { margin-right:8px; }
.shared-hud p { margin:8px 0; min-height:20px; }
.shared-hud small { display:block; margin-top:8px; font-size:11px; }
.shared-hud a { color:inherit; }
.shared-cooldown { height:4px; border-radius:3px; background:#34394022; overflow:hidden; }
.shared-cooldown span { display:block; height:100%; background:#c57b58; transform-origin:left center; }
@media(max-width:560px) { .shared-hud { padding:10px 12px; } .shared-heading { gap:8px; } .shared-hud small { max-width:270px; } }