:root{
  --bg:#fff8e9; --ink:#2f2a25; --accent:#ff8a55; --accent2:#78b769; --panel:#fffdf5;
  --line:#d8c9af; --shadow:0 10px 30px rgba(65,47,25,.16);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:system-ui,-apple-system,"Segoe UI","Noto Sans JP",sans-serif;color:var(--ink);background:linear-gradient(#fff7dd,#f6edcf)}
button{font:inherit;color:inherit;border:2px solid #3d352c;background:#fffaf0;border-radius:12px;padding:.65rem 1rem;cursor:pointer;box-shadow:0 3px 0 #3d352c;transition:.08s transform,.08s box-shadow}
button:active{transform:translateY(2px);box-shadow:0 1px 0 #3d352c}
button.primary{background:#ff9a63;color:#2d211b;font-weight:800}
.screen{display:none;min-height:100vh}.screen.active{display:block}
#town{display:none;place-items:center;padding:24px;min-height:100vh;background:
  radial-gradient(circle at 20% 20%,#dff0b8 0 10%,transparent 10.5%),
  radial-gradient(circle at 80% 15%,#d8ebaf 0 7%,transparent 7.5%),
  linear-gradient(#dff0c3,#f9efc9 52%,#d9b688 52% 100%)}
#town.active{display:grid}
.town-card{width:min(900px,100%);background:rgba(255,253,245,.94);border:4px solid #4d4338;border-radius:28px;padding:clamp(18px,4vw,42px);text-align:center;box-shadow:var(--shadow)}
.title-kicker{font-weight:900;color:#d8673f;letter-spacing:.08em}.town-card h1{font-size:clamp(2rem,7vw,4.6rem);margin:.2em 0 .35em;line-height:1.05}
.hero-art{margin:auto;width:min(420px,100%);border:3px solid #bfae8f;border-radius:18px;background:#ffe9a8;overflow:hidden}.hero-art canvas{width:100%;display:block;image-rendering:pixelated}
.town-copy{line-height:1.8}.town-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:22px 0}.town-actions button{min-width:160px}
.record-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.record-grid div{padding:12px;border:1px solid var(--line);border-radius:14px;background:#fff}.record-grid span{display:block;font-size:.8rem;color:#796f62}.record-grid b{font-size:1.25rem}
#game{padding:10px;background:#201f1b;min-height:100vh}.hud{max-width:1400px;margin:auto;background:#131313;color:#fff;border:3px solid #b99b6b;border-radius:12px;padding:9px 14px;box-shadow:0 4px 18px #0008}.hud-main,.hud-sub{display:flex;gap:clamp(10px,3vw,32px);align-items:center;flex-wrap:wrap}.hud-main{font-size:clamp(1rem,2.3vw,1.45rem);font-weight:800}.hud-sub{font-size:.9rem;margin-top:6px;color:#ddd}.hpbar{height:16px;background:#362a26;border:2px solid #f1e2c2;border-radius:4px;margin:7px 0;overflow:hidden}.hpbar>div{height:100%;width:100%;background:linear-gradient(90deg,#6dcf5f 0 12%,#ef4d2f 12% 100%);transition:width .15s}
.game-main{max-width:1400px;margin:10px auto 0;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:10px}.canvas-wrap{position:relative;background:#090909;border:3px solid #6e5c45;border-radius:10px;overflow:hidden;min-height:0}.canvas-wrap canvas{width:100%;height:auto;display:block;image-rendering:pixelated;background:#0b0b0b;outline:none;touch-action:none;aspect-ratio:3/2;object-fit:contain}.status-badges{position:absolute;top:8px;right:8px;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.status-badges span{background:#000c;color:#fff;border:1px solid #fff6;border-radius:999px;padding:4px 8px;font-size:.8rem}
.side-panel{display:grid;grid-template-rows:1fr 1.3fr;gap:10px;min-height:0}.panel-block{background:#fffaf1;border:3px solid #6e5c45;border-radius:10px;padding:10px;overflow:hidden}.panel-block h2{font-size:1rem;margin:0 0 8px}.log{height:100%;max-height:235px;overflow:auto;font-size:.84rem;line-height:1.55;background:#171616;color:#f2efe9;padding:8px;border-radius:7px}.log div+div{border-top:1px dotted #665;padding-top:2px}.panel-heading{display:flex;justify-content:space-between;align-items:center}.inventory{display:flex;flex-direction:column;gap:6px;max-height:360px;overflow:auto}.inv-item{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:8px;border:1px solid #c9bda9;background:#fff;border-radius:9px;padding:7px;transition:.12s border-color,.12s background,.12s box-shadow}.inv-item small{display:block;color:#756c61}.inv-item button{padding:.35rem .55rem;border-width:1px;box-shadow:none;border-radius:7px;font-size:.8rem}.inv-icon{font-size:1.45rem;text-align:center;filter:drop-shadow(0 1px 0 #fff)}.inv-text{min-width:0}.inv-text b{overflow-wrap:anywhere}.inv-item.equipped{border:3px solid #d9a51b;background:linear-gradient(135deg,#fff8c9,#ffe59b);box-shadow:0 0 0 2px #fff5bc inset,0 3px 10px #9d741a55}.inv-item.equipped button{background:#5f4b17;color:#fff;border-color:#3f300b}.equip-badge{display:inline-block;margin-left:6px;padding:2px 6px;border-radius:999px;background:#7a5d10;color:#fff7bd;font-size:.68rem;font-weight:900;vertical-align:2px}.equipped-label{color:#ffe27a}.inv-empty{color:#84796c;font-size:.85rem}
.mobile-controls{display:none;max-width:1400px;margin:10px auto;justify-content:space-between;gap:12px}.dpad{display:grid;grid-template-columns:repeat(3,54px);grid-template-rows:repeat(3,48px);gap:4px}.dpad button{padding:0}.dpad button[data-move="up"]{grid-column:2}.dpad button[data-move="left"]{grid-column:1;grid-row:2}.dpad button[data-move="wait"]{grid-column:2;grid-row:2}.dpad button[data-move="right"]{grid-column:3;grid-row:2}.dpad button[data-move="down"]{grid-column:2;grid-row:3}.action-pad{display:grid;grid-template-columns:repeat(2,minmax(72px,1fr));gap:8px;align-content:center}.action-pad button:nth-child(3){grid-column:1/3}.action-pad #mobileBgmBtn,.action-pad #mobileSfxBtn{font-size:.72rem;padding:.35rem}
.game-buttons{max-width:1400px;margin:10px auto;display:flex;gap:8px;flex-wrap:wrap}.game-buttons button{font-size:.86rem;padding:.5rem .75rem}
dialog{border:3px solid #493d32;border-radius:16px;max-width:520px;width:calc(100% - 28px);padding:22px;background:#fffaf1;box-shadow:0 20px 80px #0008}dialog::backdrop{background:#0009}dialog h2{margin-top:0}
@media(max-width:900px){#game{padding:5px}.game-main{grid-template-columns:1fr}.side-panel{grid-template-columns:1fr;grid-template-rows:auto auto}.log{max-height:130px}.inventory{max-height:180px}.mobile-controls{display:flex}.game-buttons{display:none}.hud-sub{font-size:.76rem}.record-grid{grid-template-columns:1fr}}
@media(max-width:520px){.town-card{padding:16px;border-radius:18px}.town-card h1{font-size:2.2rem}.mobile-controls{align-items:flex-end}.dpad{grid-template-columns:repeat(3,46px);grid-template-rows:repeat(3,43px)}.action-pad{grid-template-columns:repeat(2,68px)}.hud-main{gap:10px;font-size:.96rem}}

/* v1.2: pixel-art / audio UI */
.audio-controls{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap;margin:-8px 0 14px}.audio-controls button,.game-buttons #bgmBtn,.game-buttons #sfxBtn{background:#f4ead7}.audio-controls small{width:100%;color:#7a6d5e;font-size:.72rem}.town-audio button{font-size:.82rem;padding:.42rem .7rem}
.canvas-wrap::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 3px);mix-blend-mode:screen;opacity:.45}
#gameCanvas{cursor:crosshair}
.hud{image-rendering:pixelated}.hud-main b,.hud-sub b{font-variant-numeric:tabular-nums}
@media(max-width:900px){.game-buttons #bgmBtn,.game-buttons #sfxBtn{display:none}}

/* v1.4: item throwing / town shop / warehouse / save-load */
.inv-item{grid-template-columns:36px minmax(0,1fr) auto}
.inv-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end;max-width:150px}
.inv-actions button{min-width:42px;padding:.3rem .45rem}
.inv-actions .drop-btn{background:#edf6ea}
.inv-actions .throw-btn{background:#fff0dc}
.dialog-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog-title-row h2{margin:0}.dialog-title-row>b{font-size:1.25rem;color:#a45a2e;background:#fff1c9;border:1px solid #d9bf82;border-radius:999px;padding:.3rem .7rem;white-space:nowrap}
.wide-dialog{max-width:900px;max-height:min(86vh,820px);overflow:auto}.dialog-note{color:#756758;line-height:1.65;margin:.7rem 0 1rem}.wide-dialog h3{margin:1.1rem 0 .5rem}
.shop-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.shop-card{display:grid;grid-template-columns:38px 1fr auto;gap:8px;align-items:center;border:1px solid #d1c1a8;border-radius:11px;padding:9px;background:#fff}.shop-card .shop-icon{font-size:1.5rem;text-align:center}.shop-card small{display:block;color:#756b61}.shop-price{font-weight:900;color:#a45a2e;white-space:nowrap}.shop-card button{padding:.35rem .55rem;box-shadow:none;border-width:1px;border-radius:8px}
.storage-list{display:flex;flex-direction:column;gap:6px;max-height:300px;overflow:auto;padding-right:2px}.storage-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:7px;align-items:center;background:#fff;border:1px solid #d4c7b5;border-radius:9px;padding:7px}.storage-row small{display:block;color:#786e63}.storage-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}.storage-actions button{padding:.3rem .5rem;box-shadow:none;border-width:1px;border-radius:7px;font-size:.78rem}.warehouse-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px}.storage-empty{padding:14px;border:1px dashed #cdbfae;border-radius:9px;color:#8a7d6f;text-align:center;background:#fffdf8}
#loadBtn:disabled{opacity:.48;cursor:not-allowed;box-shadow:none}.save-good{color:#3f7f48!important}.save-none{color:#8e8172!important}
.action-pad{grid-template-columns:repeat(2,minmax(72px,1fr))}.action-pad button:nth-child(3){grid-column:auto}.action-pad #mobileBgmBtn,.action-pad #mobileSfxBtn{font-size:.72rem;padding:.35rem}
@media(max-width:900px){.record-grid{grid-template-columns:repeat(2,1fr)}.warehouse-columns{grid-template-columns:1fr}.storage-list{max-height:230px}.shop-grid{grid-template-columns:1fr}.inv-actions{max-width:130px}}
@media(max-width:520px){.record-grid{grid-template-columns:1fr 1fr}.wide-dialog{padding:14px}.storage-row,.shop-card{grid-template-columns:32px minmax(0,1fr)}.storage-actions,.shop-card button,.shop-price{grid-column:2;justify-self:start}.inv-item{grid-template-columns:32px minmax(0,1fr)}.inv-actions{grid-column:2;justify-content:flex-start;max-width:none}}


/* v1.6: reference-like HUD, 128px physical pixel rendering, bottom message window, mobile zoom fix */
html{-webkit-text-size-adjust:100%;touch-action:manipulation}
body{overscroll-behavior:none}
button,.mobile-controls,.dpad,.action-pad{touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
#game{font-family:"MS Gothic","Yu Gothic UI","Noto Sans JP",ui-monospace,monospace}
.hud{background:linear-gradient(#161616,#090909);border:4px solid #71573d;border-radius:8px;box-shadow:0 0 0 2px #21180f inset,0 4px 18px #000a;padding:8px 13px}
.hud-main{font-family:"MS Gothic","Yu Gothic UI",ui-monospace,monospace;font-weight:900;font-size:clamp(1.12rem,2.6vw,1.7rem);letter-spacing:.025em;color:#f5f1e8;text-shadow:-2px -2px 0 #0a0a0a,2px -2px 0 #0a0a0a,-2px 2px 0 #0a0a0a,2px 2px 0 #0a0a0a,0 3px 0 #000}
.hud-sub{font-family:"MS Gothic","Yu Gothic UI",ui-monospace,monospace;color:#f2eee4;text-shadow:1px 1px 0 #000}
.hpbar{height:19px;background:#1b1b1b;border:3px solid #d7d6cf;border-radius:1px;box-shadow:0 0 0 2px #3b3b3b inset;margin:6px 0 7px}
.hpbar>div{height:100%;background:linear-gradient(90deg,#4ed04e 0 7%,#ef431f 7% 100%);box-shadow:inset 0 2px 0 #ff8c58,inset 0 -2px 0 #a51d12;transition:width .12s steps(6,end)}
.canvas-wrap{border:4px solid #664c34;border-radius:5px;box-shadow:0 0 0 2px #1a130e inset,0 8px 30px #0008}
.canvas-wrap canvas{image-rendering:pixelated;image-rendering:crisp-edges}
.latest-message{position:absolute;left:3%;right:3%;bottom:2.5%;min-height:74px;display:flex;align-items:center;padding:12px 22px;background:rgba(9,10,16,.94);border:4px solid #f08b47;border-radius:10px;box-shadow:0 0 0 3px #242027 inset,0 5px 18px #0009;color:#fff;pointer-events:none;z-index:5;font-family:"MS Gothic","Yu Gothic UI",ui-monospace,monospace;font-weight:800;font-size:clamp(1rem,2vw,1.35rem);line-height:1.55;letter-spacing:.02em;text-shadow:2px 2px 0 #000}
.latest-message::before{content:"";position:absolute;left:8px;top:8px;right:8px;height:2px;background:#ffffff10}
.inv-icon,.shop-icon{font-family:"Segoe UI Emoji","Apple Color Emoji",sans-serif}
@media(max-width:900px){
  .latest-message{left:2%;right:2%;bottom:2%;min-height:56px;padding:8px 12px;border-width:3px;font-size:.86rem}
  .mobile-controls button{font-size:16px!important;min-height:44px}
  .dpad button{min-width:44px;min-height:44px}
}
@media(max-width:520px){
  .latest-message{font-size:.78rem;min-height:48px;padding:6px 9px}
  button{font-size:16px}
}


/* v1.7: poison clarity, guide/manual screens, stronger item/magic presentation */
.poison-hud{display:inline-flex!important;align-items:center;gap:.35em;padding:.12em .5em;border:2px solid #f3b6ff;border-radius:4px;background:#652884;color:#fff1ff!important;text-shadow:-2px -2px 0 #2c0739,2px -2px 0 #2c0739,-2px 2px 0 #2c0739,2px 2px 0 #2c0739,0 0 10px #d84cff;animation:poisonHudPulse .8s steps(2,end) infinite}
.poison-hud[hidden]{display:none!important}
@keyframes poisonHudPulse{50%{background:#8c37af;filter:brightness(1.25)}}
.poison-flash{position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 45%,rgba(202,88,255,.42),rgba(91,0,128,.68));mix-blend-mode:screen}
.poison-flash.active{animation:poisonScreenFlash .42s steps(4,end)}
@keyframes poisonScreenFlash{0%,100%{opacity:0}18%{opacity:.9}42%{opacity:.18}66%{opacity:.72}84%{opacity:.1}}
.title-guide-preview{margin:22px auto 6px;text-align:left;display:grid;grid-template-columns:minmax(280px,.9fr) minmax(300px,1.1fr);gap:18px;align-items:center;padding:16px;background:#fff7e5;border:3px solid #6b5238;border-radius:18px;box-shadow:inset 0 0 0 3px #f0d9a8}
.title-guide-preview h2{margin:.1em 0 .45em;color:#8d4935}.title-guide-preview ol{margin:.4em 0;padding-left:1.4em;line-height:1.65}.title-guide-preview p{line-height:1.65;margin:.55em 0 0;color:#65594e}
.guide-preview-art,.guide-canvas{border:3px solid #6b513b;border-radius:12px;background:#201b17;overflow:hidden;box-shadow:0 4px 12px #0003}.guide-preview-art canvas,.guide-canvas{width:100%;height:auto;display:block;image-rendering:pixelated}
.guide-preview-art canvas{border:0;border-radius:0;box-shadow:none}
.guide-dialog{max-width:1040px}.guide-dialog p{line-height:1.7}.guide-dialog h3{color:#804b38}
.guide-hero-row{display:grid;grid-template-columns:minmax(300px,1fr) minmax(280px,1fr);gap:18px;align-items:center;margin:14px 0}.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}.guide-grid section,.manual-columns section{background:#fff;border:1px solid #d7c3a5;border-radius:12px;padding:12px}.guide-grid h3,.manual-columns h3{margin:0 0 .35em}.guide-art-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.intro-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px 0 18px}.intro-cards article{display:flex;flex-direction:column;gap:4px;padding:10px 12px;background:#fff;border:1px solid #d8c8ad;border-radius:10px}.intro-cards b{color:#5d4030}.intro-cards span{font-size:.88rem;line-height:1.55;color:#6f6256}
.manual-screen{position:fixed;inset:0;z-index:10020;display:none;background:rgba(8,8,11,.96);overflow:auto;padding:18px}.manual-screen.active{display:block}.manual-panel{width:min(1100px,100%);margin:auto;background:#fff7e8;border:4px solid #f08b47;border-radius:14px;box-shadow:0 0 0 4px #242027 inset,0 22px 80px #000c;padding:18px}.manual-top{display:flex;align-items:center;justify-content:space-between;gap:18px;position:sticky;top:-18px;z-index:2;background:#fff7e8;border-bottom:2px solid #d9c39e;padding:10px 0}.manual-top h2{margin:.1em 0;font-size:clamp(1.5rem,4vw,2.5rem)}.manual-kicker{font-weight:900;color:#cb6338;letter-spacing:.12em;font-size:.78rem}.manual-art{max-width:720px;margin:16px auto}.manual-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.manual-columns ul{line-height:1.8;margin:.4em 0;padding-left:1.3em}
@media(max-width:760px){.title-guide-preview,.guide-hero-row,.guide-grid,.guide-art-row,.intro-cards,.manual-columns{grid-template-columns:1fr}.title-guide-preview{padding:12px}.manual-screen{padding:6px}.manual-panel{padding:12px;border-width:3px}.manual-top{top:-12px;align-items:flex-start}.manual-top button{white-space:nowrap;padding:.55rem .7rem}.guide-dialog{padding:14px}}


/* v1.9: sleep snore, easier mobile D-pad, dramatic game over */
.mobile-controls{padding-bottom:max(16px,env(safe-area-inset-bottom));}
@media(max-width:900px){
  .mobile-controls{position:sticky;bottom:0;z-index:30;margin:8px -5px 0;padding:10px 8px max(18px,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(32,31,27,.7),rgba(18,17,15,.98) 28%);border-top:1px solid #ffffff22;align-items:flex-end}
  .dpad{grid-template-columns:repeat(3,62px);grid-template-rows:repeat(3,58px);gap:7px;flex:0 0 auto;padding:3px 3px 6px;touch-action:none}
  .dpad button{min-width:62px!important;min-height:58px!important;border-radius:14px;font-size:24px!important;font-weight:900;touch-action:none;padding:0!important}
  .dpad button[data-move="down"]{min-height:66px!important;margin-bottom:4px;background:#fff2d5;border-width:3px;box-shadow:0 4px 0 #3d352c,0 0 0 2px #ffad5d66 inset}
  .dpad button[data-move="wait"]{background:#e8e3db}
  .action-pad{align-self:stretch;grid-auto-rows:minmax(48px,auto)}
  .action-pad button{min-height:48px}
}
@media(max-width:520px){
  .mobile-controls{gap:8px;padding-left:6px;padding-right:6px}
  .dpad{grid-template-columns:repeat(3,56px);grid-template-rows:repeat(3,54px);gap:6px}
  .dpad button{min-width:56px!important;min-height:54px!important;font-size:22px!important}
  .dpad button[data-move="down"]{min-height:62px!important}
  .action-pad{grid-template-columns:repeat(2,minmax(62px,1fr));gap:6px}
  .action-pad button{font-size:15px!important;padding:.35rem .4rem;min-height:46px}
}
.game-over-overlay{display:none;position:fixed;inset:0;z-index:9998;pointer-events:none;overflow:hidden;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(circle at 50% 44%,rgba(167,18,35,.35),rgba(8,0,4,.94) 64%);font-family:"MS Gothic","Yu Gothic UI",monospace}
.game-over-overlay.active{display:flex;pointer-events:auto;animation:gameOverScreen 1.7s steps(1,end) both}
.game-over-overlay::before,.game-over-overlay::after{content:"";position:absolute;inset:-20%;background:repeating-conic-gradient(from 0deg,rgba(255,58,53,.22) 0 4deg,transparent 4deg 13deg);animation:gameOverSpin 1.35s linear both;mix-blend-mode:screen}
.game-over-overlay::after{inset:0;background:linear-gradient(transparent 48%,rgba(255,255,255,.18) 49% 51%,transparent 52%);animation:gameOverScan .16s steps(2,end) 8;mix-blend-mode:screen}
.game-over-title{position:relative;z-index:2;color:#fff0d9;font-size:clamp(3rem,12vw,9rem);font-weight:1000;letter-spacing:.05em;line-height:.9;text-shadow:-5px -5px 0 #210006,5px -5px 0 #210006,-5px 5px 0 #210006,5px 5px 0 #210006,0 0 22px #ff3939,0 0 60px #c30023;animation:gameOverTitle 1.7s cubic-bezier(.12,.84,.2,1) both}
.game-over-sub{position:relative;z-index:2;margin-top:24px;padding:10px 22px;border:3px solid #ff704d;background:#10080be8;color:#ffe2c7;font-size:clamp(1rem,3.7vw,1.8rem);font-weight:900;text-shadow:2px 2px 0 #000;animation:gameOverSub 1.7s both}
.latest-message.gameover-message{border-color:#ff4545;background:#26080de8;color:#fff1e8;box-shadow:0 0 0 3px #4b0b12 inset,0 0 24px #ff2d3c88}
#gameOverDialog{border-color:#a51422;background:linear-gradient(#25090e,#10070a);color:#fff2e7;text-align:center;box-shadow:0 0 0 3px #ff6b55 inset,0 20px 100px #000;min-width:min(860px,92vw)}
#gameOverDialog h2{font-family:"MS Gothic",monospace;font-size:clamp(2.2rem,8vw,4.4rem);letter-spacing:.08em;color:#ffe9d2;text-shadow:3px 3px 0 #5b0611,0 0 18px #ff3d42;margin:.05em 0 .35em}

.game-over-dialog-body{display:flex;align-items:center;justify-content:center;gap:22px;padding:6px 2px}
.game-over-hero{flex:0 0 118px;display:flex;align-items:flex-end;justify-content:flex-start;align-self:stretch;border-right:2px solid #5f141c;padding-right:12px}
.game-over-hero-sprite{width:104px;height:112px;background:url("assets/gameover_hero_walk.png") 0 0/416px 112px no-repeat;image-rendering:pixelated;filter:drop-shadow(0 0 10px rgba(255,95,95,.35));animation:gameOverHeroWalk 1s steps(4) infinite,gameOverHeroBob 1.2s ease-in-out infinite}
.game-over-copy{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:min(480px,62vw)}
@keyframes gameOverHeroWalk{from{background-position:0 0}to{background-position:-416px 0}}
@keyframes gameOverHeroBob{0%,100%{transform:translateY(0)}50%{transform:translateY(2px)}}
@media(max-width:680px){#gameOverDialog{min-width:unset;width:min(94vw,520px)}.game-over-dialog-body{flex-direction:column;gap:10px}.game-over-hero{border-right:0;border-bottom:2px solid #5f141c;padding-right:0;padding-bottom:8px;flex-basis:auto}.game-over-copy{min-width:unset}}
@keyframes gameOverScreen{0%{background:#fff}7%{background:#8e001a}14%{background:#fff}22%,100%{background:radial-gradient(circle at 50% 44%,rgba(167,18,35,.35),rgba(8,0,4,.94) 64%)}}
@keyframes gameOverSpin{0%{transform:scale(.15) rotate(-20deg);opacity:1}100%{transform:scale(1.35) rotate(35deg);opacity:.18}}
@keyframes gameOverScan{0%,100%{transform:translateY(-55%)}50%{transform:translateY(55%)}}
@keyframes gameOverTitle{0%{transform:scale(3.2) rotate(-4deg);opacity:0}12%{opacity:1}32%{transform:scale(.88) rotate(2deg)}48%{transform:scale(1.08) rotate(-1deg)}66%,100%{transform:scale(1) rotate(0)}}
@keyframes gameOverSub{0%,48%{transform:translateY(34px);opacity:0}68%,100%{transform:translateY(0);opacity:1}}


/* v1.13: original-reference title treatment + 5-floor boss warning */
#town{background:
  radial-gradient(circle at 50% 18%,rgba(116,83,49,.30),transparent 28%),
  repeating-linear-gradient(135deg,#1a1715 0 28px,#241d18 28px 54px,#151313 54px 82px);padding:18px}
#town::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 34%,transparent 0 42%,rgba(0,0,0,.58) 78%)}
.town-card{position:relative;width:min(1060px,100%);background:linear-gradient(rgba(22,20,19,.93),rgba(12,12,13,.96));border:5px solid #7c5b37;border-radius:10px;box-shadow:0 0 0 3px #201610 inset,0 18px 70px #000c;color:#f6efe3}
.title-kicker{font-family:"MS Gothic","Yu Gothic UI",ui-monospace,monospace;color:#ffb66b;font-size:clamp(.9rem,2vw,1.25rem);letter-spacing:.16em;text-shadow:2px 2px 0 #000}
.town-card h1{font-family:"MS Gothic","Yu Gothic UI",ui-monospace,monospace;color:#fff;font-weight:1000;font-size:clamp(2.4rem,7vw,5.3rem);letter-spacing:.02em;text-shadow:-4px -4px 0 #151515,4px -4px 0 #151515,-4px 4px 0 #151515,4px 4px 0 #151515,0 6px 0 #000;margin:.13em 0 .24em}
.hero-art{width:min(760px,100%);background:#151313;border:5px solid #805b37;border-radius:6px;box-shadow:0 0 0 3px #20150f inset,0 8px 28px #0009}.hero-art canvas{aspect-ratio:16/9;object-fit:cover}
.town-copy{font-family:"MS Gothic","Yu Gothic UI",monospace;font-size:1.03rem;color:#f3e9d7;text-shadow:1px 1px 0 #000}
.title-guide-preview{background:#171619;color:#f6efe7;border:4px solid #e88645;border-radius:8px;box-shadow:0 0 0 3px #33251f inset,0 8px 24px #0007}.title-guide-preview h2{color:#ffbd77}.title-guide-preview p{color:#d9d1c7}.guide-preview-art{border-color:#7e5d3c}
.town-actions button,.town-audio button{background:#211d1b;color:#fff1dc;border-color:#e48a4d;box-shadow:0 3px 0 #8e4b25}.town-actions button.primary{background:#d96f36;color:#fff8ec;border-color:#ffc17b}.record-grid div{background:#151517;border:2px solid #705239;color:#fff}.record-grid span{color:#cbbca8}.record-grid b{color:#fff1cc}
.audio-controls small{color:#bfb2a2}.save-good{color:#8bdd89!important}.save-none{color:#aaa099!important}
@media(max-width:600px){#town{padding:7px}.town-card{border-width:3px}.town-card h1{font-size:2.35rem}.hero-art{border-width:3px}}

.boss-warning-overlay{display:none;position:fixed;inset:0;z-index:9994;pointer-events:none;overflow:hidden;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(circle at 50% 50%,rgba(135,11,14,.18),rgba(0,0,0,.78) 68%);font-family:"MS Gothic","Yu Gothic UI",ui-monospace,monospace;text-align:center}
.boss-warning-overlay.active{display:flex;animation:bossWarnScreen 2.05s steps(1,end) both}
.boss-warning-overlay::before{content:"";position:absolute;inset:-30%;background:repeating-conic-gradient(from 0deg,rgba(255,74,39,.22) 0 5deg,transparent 5deg 15deg);animation:bossWarnSpin 2s linear both;mix-blend-mode:screen}
.boss-warning-scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 13px,rgba(255,109,56,.12) 13px 16px);animation:bossWarnScan .18s linear 11}
.boss-warning-kicker{position:relative;z-index:2;color:#ffdb79;font-size:clamp(1.1rem,4vw,2.4rem);font-weight:1000;letter-spacing:.45em;text-indent:.45em;text-shadow:0 0 13px #ff4c2e,3px 3px 0 #240000}
.boss-warning-title{position:relative;z-index:2;margin:.05em 0;color:#fff2da;font-size:clamp(3.6rem,13vw,10rem);font-weight:1000;line-height:.88;letter-spacing:.04em;text-shadow:-6px -6px 0 #270305,6px -6px 0 #270305,-6px 6px 0 #270305,6px 6px 0 #270305,0 0 24px #ff432d,0 0 65px #bb001a;animation:bossWarnTitle 2.05s cubic-bezier(.12,.82,.2,1) both}
.boss-warning-floor{position:relative;z-index:2;color:#ffca6d;font-size:clamp(2rem,7vw,4.8rem);font-weight:1000;text-shadow:3px 3px 0 #160000,0 0 15px #ff3d24}
.boss-warning-name{position:relative;z-index:2;margin-top:10px;max-width:min(760px,90vw);padding:9px 20px;background:#11090be8;border:3px solid #f28447;color:#fff4df;font-weight:900;font-size:clamp(1rem,3vw,1.55rem);text-shadow:2px 2px 0 #000}
@keyframes bossWarnScreen{0%{background:#fff}5%{background:#b41111}10%{background:#120000}14%{background:#fff}18%,100%{background:radial-gradient(circle at 50% 50%,rgba(135,11,14,.18),rgba(0,0,0,.78) 68%)}}
@keyframes bossWarnSpin{0%{transform:scale(.35) rotate(-18deg);opacity:1}100%{transform:scale(1.45) rotate(40deg);opacity:.25}}
@keyframes bossWarnScan{from{transform:translateY(-20px)}to{transform:translateY(20px)}}
@keyframes bossWarnTitle{0%,9%{transform:scale(3.2);opacity:0}18%{opacity:1}32%{transform:scale(.82)}47%{transform:scale(1.12)}62%,100%{transform:scale(1)}}

/* v1.14 title-image reliability + one-line title */
.town-card h1{
  font-size:clamp(1.9rem,5.2vw,4.25rem);
  line-height:1.05;
  white-space:nowrap;
  word-break:keep-all;
  overflow-wrap:normal;
  letter-spacing:-.035em;
  max-width:100%;
}
.hero-art{
  width:min(820px,100%);
  aspect-ratio:16/9;
  background:#f7f5e9;
  border:5px solid #805b37;
  border-radius:8px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-art .hero-title-image{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  background:#f7f5e9;
}
@media(max-width:600px){
  .town-card h1{font-size:clamp(1.45rem,7.5vw,2.2rem);letter-spacing:-.06em}
  .hero-art{border-width:3px;aspect-ratio:4/3}
  .hero-art .hero-title-image{object-fit:cover}
}


/* v1.15: title page returned to the v1.12 light picnic design. */
#town{
  background:
    radial-gradient(circle at 20% 20%,#dff0b8 0 10%,transparent 10.5%),
    radial-gradient(circle at 80% 15%,#d8ebaf 0 7%,transparent 7.5%),
    linear-gradient(#dff0c3,#f9efc9 52%,#d9b688 52% 100%);
  padding:24px;
  color:var(--ink);
}
#town::before{display:none!important;content:none!important}
.town-card{
  width:min(900px,100%);
  background:rgba(255,253,245,.94);
  border:4px solid #4d4338;
  border-radius:28px;
  padding:clamp(18px,4vw,42px);
  text-align:center;
  box-shadow:var(--shadow);
  color:var(--ink);
}
.title-kicker{
  font-family:system-ui,-apple-system,"Segoe UI","Noto Sans JP",sans-serif;
  font-weight:900;color:#d8673f;font-size:inherit;letter-spacing:.08em;text-shadow:none
}
.town-card h1{
  font-family:system-ui,-apple-system,"Segoe UI","Noto Sans JP",sans-serif;
  color:var(--ink);font-weight:800;
  font-size:clamp(1.85rem,5vw,4.25rem);
  margin:.2em 0 .35em;line-height:1.05;
  white-space:nowrap;word-break:keep-all;overflow-wrap:normal;
  letter-spacing:-.035em;text-shadow:none;max-width:100%
}
.hero-art{
  margin:auto;width:min(420px,100%);aspect-ratio:auto;
  border:3px solid #bfae8f;border-radius:18px;background:#ffe9a8;
  overflow:hidden;display:block;box-shadow:none
}
.hero-art canvas{width:100%;height:auto;display:block;image-rendering:pixelated;aspect-ratio:auto;object-fit:initial}
.town-copy{font-family:system-ui,-apple-system,"Segoe UI","Noto Sans JP",sans-serif;color:var(--ink);line-height:1.8;text-shadow:none}
.title-guide-preview{background:#fffaf1;color:var(--ink);border:3px solid #6e5c45;border-radius:12px;box-shadow:none}
.title-guide-preview h2{color:var(--ink)}.title-guide-preview p{color:#675d52}.guide-preview-art{border-color:#bfae8f}
.town-actions button,.town-audio button{background:#fffaf0;color:var(--ink);border-color:#3d352c;box-shadow:0 3px 0 #3d352c}
.town-actions button.primary{background:#ff9a63;color:#2d211b;border-color:#3d352c}
.record-grid div{background:#fff;border:1px solid var(--line);color:var(--ink)}
.record-grid span{color:#796f62}.record-grid b{color:var(--ink)}
.audio-controls small{color:#7a6d5e}.save-good{color:#3f7f48!important}.save-none{color:#8e8172!important}
@media(max-width:600px){
  #town{padding:7px}.town-card{border-width:3px;border-radius:18px;padding:16px}
  .town-card h1{font-size:clamp(1.42rem,7vw,2.05rem);letter-spacing:-.06em}
  .hero-art{border-width:3px;width:min(420px,100%)}
}

/* v1.16 manual overlay state */
body.manual-open{overflow:hidden}


/* v1.18: title version label */
.town-card{position:relative}
.game-version{position:absolute;right:14px;bottom:9px;font:700 .72rem/1 ui-monospace,"MS Gothic",monospace;color:#8a7a68;letter-spacing:.05em;opacity:.82;pointer-events:none}
@media(max-width:600px){.game-version{right:8px;bottom:7px;font-size:.62rem}}

/* v1.23: optional debug.txt start settings */
.debug-panel{
  margin:16px auto 10px;max-width:760px;padding:13px 15px 12px;
  border:2px solid #bd5147;border-radius:14px;background:#fff0e9;
  box-shadow:inset 0 0 0 3px #ffd8c7;text-align:left
}
.debug-panel-title{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px;color:#742c28}
.debug-panel-title b{font:1000 1rem/1 ui-monospace,"MS Gothic",monospace;letter-spacing:.08em}
.debug-panel-title span{font-size:.76rem;color:#8b6259}
.debug-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 10px}
.debug-grid label{display:flex;flex-direction:column;gap:4px;font-size:.75rem;font-weight:800;color:#594b42}
.debug-grid input{width:100%;min-width:0;border:2px solid #8c7464;border-radius:8px;background:#fff;padding:.5rem .55rem;font:800 .95rem/1.2 ui-monospace,"MS Gothic",monospace;color:#2e2824;outline:none}
.debug-grid input:focus{border-color:#d2614c;box-shadow:0 0 0 3px #f4b9a955}
.debug-panel small{display:block;margin-top:8px;color:#705e53;line-height:1.45}
.debug-badge{position:absolute;left:14px;bottom:8px;padding:4px 7px;border:2px solid #a43e34;border-radius:6px;background:#d95b4d;color:#fff8e8;font:1000 .65rem/1 ui-monospace,"MS Gothic",monospace;letter-spacing:.08em;box-shadow:0 2px 0 #74302b}
@media(max-width:600px){
  .debug-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .debug-panel{padding:11px 10px}.debug-panel-title{align-items:flex-start;flex-direction:column;gap:4px}
  .debug-badge{left:8px;bottom:6px;font-size:.58rem}
}
[hidden]{display:none!important}

/* v1.25 inventory sorting */
.inventory-sort-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;margin:0 0 8px;font-size:.78rem}.inventory-sort-row label{font-weight:800;color:#655849;white-space:nowrap}.inventory-sort-row select{width:100%;min-width:0;padding:6px 8px;border:1px solid #b8aa96;border-radius:7px;background:#fffdf8;color:#342d27;font:inherit;font-weight:700}.inventory-sort-row select:focus{outline:2px solid #d7a83a;outline-offset:1px}@media(max-width:520px){.inventory-sort-row{grid-template-columns:1fr;gap:4px}.inventory-sort-row select{font-size:.74rem}}


/* v1.28 pilot: reference-sheet chibi pixel art direction */
.canvas-wrap{background:#3b3431;border-color:#806d5f;box-shadow:0 0 0 3px #f0dbc6 inset,0 10px 30px #5b453d66}
.canvas-wrap::after{background:repeating-linear-gradient(0deg,rgba(255,250,240,.025) 0 1px,transparent 1px 4px);opacity:.28}
#gameCanvas{image-rendering:pixelated;image-rendering:crisp-edges;background:#3e3934}
.hero-art{background:#eef3dc;border-color:#b79c83;box-shadow:0 5px 18px #806e5b2c}
.hero-art canvas{image-rendering:pixelated;image-rendering:crisp-edges}
.guide-preview-art,.guide-canvas{background:#eef2df!important;border-color:#b9a88d!important;image-rendering:pixelated}


/* v1.36 unified soft-pastel UI polish */
:root{--ui-cream:#f7f2e9;--ui-cream-deep:#efe7d7;--ui-line:#8d6d58;--ui-accent:#e79a73;--ui-accent-2:#cfc6f2;--ui-green:#bed8ab;--ui-ink:#3e342f;--ui-panel:#fbf7f0;--ui-shadow:#d2c3b2;}
#game{background:linear-gradient(#23201d,#1b1916);}
.side-panel,.inventory-panel,.log-panel,dialog{border-color:var(--ui-line)!important;background:var(--ui-panel)!important;color:var(--ui-ink)!important;box-shadow:0 0 0 3px var(--ui-shadow) inset,0 8px 24px #0002!important;}
.panel-title,h2,h3,.dialog-title-row h2{color:#6e5647!important}.dialog-note,.town-copy,.inventory-empty,.log-panel{color:#5d5148!important}
button{background:linear-gradient(#fffaf4,#ece3d7)!important;border-color:var(--ui-line)!important;color:#4c4038!important;box-shadow:0 2px 0 #b89d87!important}
button.primary,.town-actions button.primary{background:linear-gradient(#f7b382,#e58f61)!important;color:#fff7f1!important;border-color:#bf7350!important;box-shadow:0 3px 0 #8f5637!important}
#town{background:radial-gradient(circle at 20% 15%,rgba(232,244,206,.75),transparent 24%),radial-gradient(circle at 85% 12%,rgba(232,244,206,.7),transparent 18%),linear-gradient(#dfecc4,#dce9be 55%,#d0b188 55%,#d0b188)!important;}
.town-card{background:linear-gradient(rgba(251,248,242,.95),rgba(245,240,232,.96))!important;color:#3e342f!important;border-color:#6f5b50!important;box-shadow:0 0 0 2px #bdaea2 inset,0 18px 50px #0002!important}
.town-card h1{color:#3b322c!important;text-shadow:none!important}.title-kicker{color:#eb8957!important;text-shadow:none!important}.title-guide-preview{background:#f9f5ee!important;color:#4d433d!important;border-color:#b19782!important;box-shadow:0 0 0 2px #ded4c8 inset!important}.title-guide-preview h2{color:#7d614d!important}.record-grid div{background:#fbf7f0!important;color:#54473f!important;border-color:#b49b89!important}.record-grid b{color:#3e342f!important}.record-grid span,.audio-controls small{color:#6b5b50!important}
.game-over-overlay{background:radial-gradient(circle at 50% 44%,rgba(119,22,33,.38),rgba(12,2,6,.94) 64%)!important}
#gameOverDialog{background:linear-gradient(#34161b,#19090d)!important;border-color:#b04e56!important;box-shadow:0 0 0 3px #ffb9a2 inset,0 20px 100px #000!important}
.game-over-dialog-body{gap:26px;padding:10px 8px!important}.game-over-hero{flex:0 0 152px;justify-content:flex-start;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.06));border-right:2px solid #7d2831;padding:4px 14px 4px 2px;border-radius:8px}.game-over-hero-sprite{width:104px;height:112px;filter:drop-shadow(0 0 14px rgba(255,86,86,.42))}


/* v1.36.2 game over readability polish */
.game-over-title{color:#fff8ef!important;letter-spacing:.08em!important;text-shadow:-4px -4px 0 #220307,4px -4px 0 #220307,-4px 4px 0 #220307,4px 4px 0 #220307,0 0 12px rgba(255,120,120,.55)!important;font-size:clamp(3.2rem,12.5vw,9.2rem)!important}
.game-over-sub{background:rgba(18,6,8,.92)!important;border:3px solid #ff8d73!important;color:#ffffff!important;font-size:clamp(1.05rem,3.9vw,1.85rem)!important;line-height:1.45!important;text-shadow:2px 2px 0 #000,0 0 8px rgba(0,0,0,.55)!important;border-radius:10px!important;box-shadow:0 0 0 2px rgba(255,255,255,.08) inset,0 0 18px rgba(255,72,72,.18)!important}
#gameOverDialog{min-width:min(940px,94vw)!important;border-color:#c95e67!important;background:linear-gradient(#321217,#14080c)!important;box-shadow:0 0 0 3px #ffccb8 inset,0 24px 110px rgba(0,0,0,.86)!important}
#gameOverDialog h2{font-size:clamp(2.5rem,8.5vw,4.8rem)!important;color:#fffaf4!important;letter-spacing:.1em!important;text-shadow:0 2px 0 #4b0a12,0 0 10px rgba(255,116,116,.36)!important;margin:.02em 0 .28em!important}
#gameOverText{color:#ffffff!important;font-size:1.18rem!important;line-height:1.68!important;font-weight:700!important;text-shadow:1px 1px 0 #000,0 0 8px rgba(0,0,0,.25)!important;max-width:30em!important;margin:0 auto 8px auto!important}
.game-over-dialog-body{gap:32px!important;padding:12px 10px!important}
.game-over-hero{flex:0 0 190px!important;padding:6px 16px 6px 2px!important;border-right:2px solid #8b2e38!important;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.08))!important}
.game-over-hero-sprite{width:132px!important;height:144px!important;background:url("assets/gameover_hero_walk.png") 0 0/528px 144px no-repeat!important;image-rendering:auto!important;filter:drop-shadow(0 0 18px rgba(255,102,102,.34))!important;animation:gameOverHeroWalk1362 1s steps(4) infinite,gameOverHeroBob 1.2s ease-in-out infinite!important}
@keyframes gameOverHeroWalk1362{from{background-position:0 0}to{background-position:-528px 0}}
@media(max-width:680px){.game-over-hero{flex-basis:auto!important;padding:0 0 10px 0!important}.game-over-hero-sprite{width:118px!important;height:128px!important;background-size:472px 128px!important}}


/* v1.36.5 readability + game over hero size/trudge */
.game-over-dialog-body{align-items:center!important;gap:24px!important}
.game-over-hero{flex:0 0 210px!important;min-width:210px!important;padding:10px 22px 10px 8px!important}
.game-over-hero-sprite{width:160px!important;height:174px!important;background:url("assets/gameover_hero_walk.png") 0 0/640px 174px no-repeat!important;image-rendering:auto!important;filter:drop-shadow(0 0 18px rgba(255,120,120,.38))!important;animation:gameOverHeroWalk1365 1.25s steps(4) infinite,gameOverHeroTrudge 1.25s ease-in-out infinite!important}
@keyframes gameOverHeroWalk1365{from{background-position:0 0}to{background-position:-640px 0}}
@keyframes gameOverHeroTrudge{0%{transform:translate(0,0) rotate(-1.2deg)}25%{transform:translate(-2px,2px) rotate(-.2deg)}50%{transform:translate(0,4px) rotate(.8deg)}75%{transform:translate(2px,2px) rotate(.2deg)}100%{transform:translate(0,0) rotate(-1.2deg)}}
