:root { color-scheme: light; }
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: #0a0a0a; }
body { font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif; }
.page-shell {
  position: relative;
  width: min(100%, 1024px);
  margin: 0 auto;
  background: #f5efe5;
  overflow: hidden;
}
.page-image {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  -webkit-user-drag: none;
}
.hotspot {
  position: absolute;
  display: block;
  z-index: 5;
  text-indent: -9999px;
  overflow: hidden;
  white-space: nowrap;
  border-radius: 6px;
}
.hotspot:focus-visible {
  outline: 3px solid #d7a43a;
  outline-offset: -3px;
}
/* Header navigation: coordinates are percentage-based against the 1024px design. */
.nav-top      { left: 34.0%; top: 0.8%; width: 7.0%; height: 3.3%; }
.nav-kodawari { left: 41.5%; top: 0.8%; width: 8.0%; height: 3.3%; }
.nav-menu     { left: 50.1%; top: 0.8%; width: 7.5%; height: 3.3%; }
.nav-shop     { left: 58.0%; top: 0.8%; width: 9.0%; height: 3.3%; }
.nav-access   { left: 67.3%; top: 0.8%; width: 8.0%; height: 3.3%; }
.nav-news     { left: 75.7%; top: 0.8%; width: 8.4%; height: 3.3%; }
.nav-contact  { left: 84.4%; top: 0.35%; width: 14.0%; height: 4.0%; }
.access-phone { left: 7.0%; top: 42.0%; width: 31.5%; height: 10.5%; }
.access-map   { left: 42.0%; top: 35.7%; width: 54.0%; height: 22.7%; }
@media (max-width: 640px) {
  .hotspot { border-radius: 3px; }
}
@media print {
  html, body { background: #fff; }
  .page-shell { width: 100%; }
}

/* Mobile readable layout for image-based pages */
.mobile-content{display:none}
@media (max-width:640px){
  body{background:#f5efe5;color:#1b1713}
  .page-shell.desktop-art{display:none}
  .mobile-content{display:block;background:#f5efe5;min-height:100vh}
  .m-head{position:sticky;top:0;z-index:20;background:#17120e;color:#fff;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px}
  .m-brand{font-family:'Yu Mincho','Hiragino Mincho ProN',serif;font-size:22px;font-weight:700;white-space:nowrap}
  .m-brand small{font-size:12px;font-weight:400;margin-left:5px}
  .m-reserve{background:#a36d08;color:#fff;padding:9px 12px;border-radius:6px;font-size:12px;white-space:nowrap;text-decoration:none}
  .m-hero{background:#251b14;color:#fff;padding:34px 20px}
  .m-hero h1{font-family:'Yu Mincho','Hiragino Mincho ProN',serif;font-size:34px;line-height:1.35;margin:0 0 12px}
  .m-hero p{margin:0;line-height:1.9;color:#eee2d4}
  .m-section{padding:30px 20px;border-bottom:1px solid #ded2bf}
  .m-section h2{font-family:'Yu Mincho','Hiragino Mincho ProN',serif;font-size:27px;margin:0 0 12px}
  .m-section h3{font-size:18px;margin:18px 0 6px}
  .m-section p,.m-section li{font-size:15px;line-height:1.9}
  .m-card{background:#fff;padding:18px;border-radius:12px;margin:12px 0}
  .m-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .m-chip{background:#2f241c;color:#fff;padding:14px;border-radius:10px;line-height:1.5}
  .m-phone{display:inline-block;background:#a36d08;color:#fff;padding:12px 18px;border-radius:999px;text-decoration:none;font-weight:700}
}