*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#777b6c;color:#fff;font-family:Arial,Helvetica,sans-serif}#water{position:fixed;inset:0;touch-action:none;cursor:crosshair}#water canvas,.fallback{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover}header,footer{position:fixed;left:0;right:0;z-index:1;padding:32px 38px;pointer-events:none;text-shadow:0 1px 16px #0008}header{top:0;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#20271d42,transparent)}.mark{font-size:13px;letter-spacing:.26em;font-weight:500}.edition{font-size:11px;letter-spacing:.06em;opacity:.85}footer{bottom:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:max(30px,env(safe-area-inset-bottom));background:linear-gradient(transparent,#20271d55)}#hint{font-size:13px;letter-spacing:.02em}.controls{pointer-events:auto;display:flex;gap:8px}button{border:1px solid #fff5;color:white;background:#28302538;backdrop-filter:blur(16px);border-radius:24px;padding:12px 18px;font:12px Arial,sans-serif;cursor:pointer;min-height:44px;transition:background .2s}button:hover{background:#28302570}button:focus-visible{outline:2px solid #fff;outline-offset:4px}button span{margin-left:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:600px){header,footer{padding:24px}.edition{display:none}footer{align-items:flex-start;flex-direction:column;gap:16px;padding-bottom:max(24px,env(safe-area-inset-bottom))}#hint{font-size:12px}}

/* Preserve the complete original 3:4 photograph on every viewport. */
body{display:grid;place-items:center;background:#292c27}
.portrait{position:relative;width:min(100vw,75vh);width:min(100vw,75dvh);aspect-ratio:3/4;overflow:hidden;container-type:inline-size}
#water{position:absolute}
header,footer{position:absolute}
footer{flex-wrap:wrap}
@container(max-width:560px){
  header,footer{padding:24px}
  .edition{display:none}
  footer{align-items:flex-start;flex-direction:column;gap:16px;padding-bottom:max(24px,env(safe-area-inset-bottom))}
  #hint{font-size:12px}
}
@container(max-width:320px){
  header,footer{padding:14px}
  #hint{display:none}
  button{padding:10px 12px}
}

header,footer{display:none}