*{box-sizing:border-box}html,body{margin:0;padding:0}
body{background:#eee7d4;font-family:Georgia,"Times New Roman",serif}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.poster-wrap,.book-wrap{position:relative;width:100%;max-width:1100px;margin:0 auto}
.art{font-size:0;line-height:0}.art img{display:block;width:100%;height:auto;margin:0;border:0}
.hotspot{position:absolute;display:block;z-index:4;border-radius:999px;cursor:pointer;-webkit-tap-highlight-color:rgba(255,255,255,.25)}
.hotspot:focus-visible{outline:3px solid #1f6f63;outline-offset:3px}
.home-link{position:absolute;z-index:5;top:12px;left:12px;padding:7px 14px;border-radius:999px;background:rgba(251,245,230,.92);color:#273126;font-family:Arial,sans-serif;font-size:14px;font-weight:700;text-decoration:none;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.home-link:hover,.home-link:focus-visible{background:#fff}
@media(max-width:600px){.home-link{top:8px;left:8px;padding:5px 11px;font-size:12px}}
.notfound{max-width:640px;margin:80px auto;padding:0 20px;color:#273126}.notfound a{font-family:Arial,sans-serif;font-weight:700}
.art{position:relative}
.soon{position:absolute;z-index:5;display:flex;align-items:center;justify-content:center;background:#39523b;color:#fff;border:2px solid rgba(255,255,255,.55);border-radius:12px;box-shadow:0 3px 10px rgba(0,0,0,.25);transform:rotate(-3deg);pointer-events:none}
.soon span{font-family:Arial,sans-serif;font-weight:800;letter-spacing:.12em;font-size:clamp(11px,2.2vw,24px);line-height:1;white-space:nowrap}

/* ---- phone layout ---- */
.m-only{display:none}
.row-link{position:absolute;display:block;z-index:3;-webkit-tap-highlight-color:rgba(255,255,255,.2)}
@media (max-width:700px){
  .d-only{display:none!important}
  .m-only{display:block}
  .m-home{background:#f1e4c6}
  .m-home .art,.m-book{font-size:0;line-height:0}
  .m-book{position:relative}
  .m-book>img{display:block;width:100%;height:auto}
  .m-letter{position:relative;line-height:normal;font-size:16px;padding:28px 16px 120px;background-color:#c9c9c9;background-image:linear-gradient(90deg,rgba(255,255,255,.35) 50%,transparent 50%),linear-gradient(rgba(255,255,255,.35) 50%,transparent 50%);background-size:28px 28px}
  .paper{background:#efe9dd;padding:22px 20px 26px;border-radius:3px;box-shadow:0 4px 14px rgba(0,0,0,.18);font-family:Lora,Georgia,serif;font-size:18px;line-height:1.6;color:#222}
  .paper p{margin:0 0 1em}
  .about-photo{display:block;width:62%;max-width:260px;height:auto;margin:-46px auto 18px;border:7px solid #fff;box-shadow:0 3px 10px rgba(0,0,0,.25);transform:rotate(-4deg)}
  .sig{font-family:"Dancing Script",cursive;font-size:26px;text-align:right;margin:0!important}
  .about-mouse{position:absolute;right:6px;bottom:6px;width:96px;height:auto}
  .m-desc{padding:6px 18px 22px;line-height:normal;font-size:16px}
  .m-box{border-radius:16px;padding:20px 20px 6px;box-shadow:0 2px 8px rgba(0,0,0,.12)}
  .m-box p{margin:0 0 1em}
  .m-box.serif{font-family:Lora,Georgia,serif;font-style:italic;font-size:19px;line-height:1.55}
  .m-box.hand{font-family:"Patrick Hand","Comic Sans MS",cursive;font-size:21px;line-height:1.45}
  .m-info{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:26px 18px 34px;line-height:normal;font-size:16px}
  .blob{flex:0 0 52%;border-radius:38% 30% 34% 28% / 14% 18% 16% 20%;padding:22px 18px;font-family:Arial,Helvetica,sans-serif;color:#111}
  .blob h2{font-size:19px;margin:0 0 10px;text-decoration:underline}
  .blob ul{margin:0;padding-left:20px;font-weight:700;font-size:15px;line-height:1.6}
  .m-price{display:block;text-align:center;font-size:26px;margin-top:12px}
  .m-buy{position:relative;flex:1 1 auto;max-width:44%}
  .m-buy img{display:block;width:100%;height:auto}
  .m-buy .soon span{font-size:13px;letter-spacing:.08em}
  .home-link{position:fixed}
}