:root{--ink:#171513;--dark:#100e0c;--panel:#171310;--line:rgba(255,255,255,.16);--gold:#c7a46e}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--dark);color:#fff;font-family:Inter,Arial,sans-serif}
body{min-height:100vh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden}
a{color:inherit}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px clamp(14px,3vw,34px);border-bottom:1px solid var(--line);background:var(--panel);z-index:20}
.brand{text-decoration:none}
.brand strong{display:block;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(24px,3vw,36px);font-weight:500;line-height:1}
.brand span{display:block;margin-top:4px;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:#bdb3a7}
.top-actions{display:flex;align-items:center;gap:10px}
.lang-switch{display:inline-flex;align-items:center;gap:6px;font-size:8px;letter-spacing:.12em;text-transform:uppercase}
.lang-switch a{text-decoration:none}.lang-switch .active{color:var(--gold);font-weight:600}.lang-switch .sep{color:#82786e}
.action{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 14px;border:1px solid rgba(255,255,255,.27);color:#171513;text-decoration:none;background:#fff;font-size:8px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.action:hover,.action:focus-visible{background:#e7ded2;outline:none}
.desktop-viewer{min-height:0;display:grid;place-items:center;padding:12px;background:#0d0b0a;overflow:hidden}
.page-wrap{position:relative;display:inline-block;line-height:0;max-width:100%;max-height:100%}
.page{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100vh - 150px);object-fit:contain;box-shadow:0 14px 46px rgba(0,0,0,.48);user-select:none;-webkit-user-drag:none}
.link-layer{position:absolute;inset:0;pointer-events:none}
.hotspot{position:absolute;display:block;pointer-events:auto;border:1px solid transparent;background:rgba(255,255,255,0)}
.hotspot:hover,.hotspot:focus{border-color:rgba(255,255,255,.9);background:rgba(255,255,255,.13);outline:none}
.bottom{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;padding:10px clamp(14px,3vw,34px);border-top:1px solid var(--line);background:var(--panel)}
.nav{display:flex;gap:8px}.nav.right{justify-content:flex-end}
.nav button{min-width:118px;height:40px;padding:0 14px;border:1px solid rgba(255,255,255,.27);background:transparent;color:#fff;font:inherit;font-size:9px;letter-spacing:.09em;text-transform:uppercase;cursor:pointer}
.nav button:hover:not(:disabled),.nav button:focus-visible:not(:disabled){background:#fff;color:#171513;outline:none}
.nav button:disabled{opacity:.25;cursor:default}
.meta{text-align:center;min-width:180px}
.meta strong{display:block;font-family:"Cormorant Garamond",Georgia,serif;font-size:22px;font-weight:500;line-height:1}
.meta span{display:block;margin-top:4px;font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:#aaa095}
.mobile-catalog{display:none}
@media(max-width:820px){
  html{scroll-behavior:smooth}
  body{display:block;min-height:100%;overflow:auto;background:#0d0b0a}
  .topbar{position:sticky;top:0;align-items:center;padding:10px 12px;box-shadow:0 8px 24px rgba(0,0,0,.28)}
  .brand strong{font-size:23px}.brand span{display:none}
  .action{min-height:38px;padding:0 10px;font-size:7px;white-space:nowrap}
  .desktop-viewer,.bottom{display:none!important}
  .mobile-catalog{display:block;padding:12px 10px 28px}
  .mobile-intro{margin:0 0 12px;padding:11px 12px;border:1px solid rgba(255,255,255,.16);font-size:9px;line-height:1.5;letter-spacing:.09em;text-transform:uppercase;color:#d9d0c6;text-align:center}
  .mobile-page{position:relative;margin:0 0 16px;background:#111;box-shadow:0 12px 30px rgba(0,0,0,.38);line-height:0}
  .mobile-page img{display:block;width:100%;height:auto}
  .mobile-page .link-layer{position:absolute;inset:0}
  .mobile-page-label{display:block;padding:8px 10px 9px;background:#171310;border-top:1px solid rgba(255,255,255,.12);font-size:8px;line-height:1.2;letter-spacing:.1em;text-transform:uppercase;color:#bfb4a8}
  .mobile-end{padding:16px 10px 8px;text-align:center}
  .mobile-end a{display:inline-flex;min-height:44px;align-items:center;justify-content:center;padding:0 18px;background:#fff;color:#171513;text-decoration:none;font-size:8px;letter-spacing:.12em;text-transform:uppercase}
  .lang-switch{font-size:7px}
}