/* 16:9 cafe redesign */
#scene-cafe{isolation:isolate;background:#d9944c}
#scene-cafe .cafe-stage{position:absolute;inset:0;overflow:hidden;background:#d9944c;transform-origin:78% 58%;transition:transform .85s cubic-bezier(.2,.8,.2,1),filter .45s}
#scene-cafe.conversation-mode .cafe-stage{transform:scale(1.28) translateX(-4%);filter:brightness(.65)}
#scene-cafe.message-focus .cafe-stage{transform:none;filter:none}
#scene-cafe.message-focus .cafe-background{left:0;top:-33.333333%;transform:scale(2);transform-origin:top left}
#scene-cafe.message-focus .cafe-table,
#scene-cafe.message-focus .cafe-character,
#scene-cafe.message-focus .cafe-entry{opacity:0;visibility:hidden;pointer-events:none}
#scene-cafe.conversation-mode::after,#scene-cafe.message-focus::after{content:"";position:absolute;z-index:10;inset:0;background:rgba(0,0,0,.4);pointer-events:none}
.cafe-background{position:absolute;z-index:0;inset:0;width:100%;height:100%;display:block;object-fit:cover;pointer-events:none;transition:left .85s cubic-bezier(.2,.8,.2,1),top .85s cubic-bezier(.2,.8,.2,1),transform .85s cubic-bezier(.2,.8,.2,1)}
.cafe-table{position:absolute;z-index:1;left:calc(16.6% - 40px);bottom:3.7%;width:31.8%;height:auto;display:block;pointer-events:none}
.cafe-dots{position:absolute;z-index:2;left:50%;top:0;width:100%;height:auto;display:block;transform:translateX(-50%);object-fit:contain;pointer-events:none}
.cafe-character{position:absolute;z-index:4;left:56%;bottom:calc(-2% + 5px);width:48%;height:90%;display:block;object-fit:contain;object-position:center bottom;transform:scale(.77);transform-origin:center bottom;pointer-events:none;background:transparent}
.cafe-character-intro{left:calc(56% - 3px);transform:scale(.7773);opacity:1;visibility:visible}
.cafe-character-idle{opacity:0;visibility:hidden}
.cafe-character-note{z-index:0;left:calc(8% - 20px);right:auto;opacity:0;visibility:hidden}
#scene-cafe.cafe-idle-active .cafe-character-intro{opacity:0;visibility:hidden}
#scene-cafe.cafe-idle-active .cafe-character-idle{opacity:1;visibility:visible}
#scene-cafe.cafe-note-active .cafe-character-intro,
#scene-cafe.cafe-note-active .cafe-character-idle{opacity:0;visibility:hidden}
#scene-cafe.cafe-note-active .cafe-character-note{opacity:1;visibility:visible}
#scene-cafe.cafe-note-active .cafe-entry{opacity:0;visibility:hidden;pointer-events:none}
#scene-cafe.message-focus .cafe-character,
#scene-cafe.message-focus.cafe-idle-active .cafe-character{display:none!important;opacity:0;visibility:hidden;pointer-events:none}
.cafe-ui-button{position:absolute;z-index:12;top:var(--corner-icon-top);width:var(--corner-icon-size);height:auto;aspect-ratio:1;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;transition:transform .2s,filter .2s}
.cafe-ui-button img,.cafe-entry img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.cafe-ui-button:hover,.cafe-ui-button:focus-visible,.cafe-entry:hover,.cafe-entry:focus-visible{transform:scale(1.09);filter:drop-shadow(0 6px 7px rgba(66,31,20,.28));outline:0}
.cafe-return{left:var(--corner-icon-left)}
.cafe-sound{right:var(--corner-sound-right)}
.cafe-voice{right:var(--corner-settings-right)}
.cafe-entry{position:absolute;z-index:7;width:5.35%;height:auto;aspect-ratio:1;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;transition:transform .2s,filter .2s}
.message-wall{position:absolute;z-index:6;left:21.8%;top:42.3%;width:6.4%;height:13%;padding:0;background:transparent;border:0;box-shadow:none}
.cafe-message-entry{left:8%;top:7%;width:84%}
#scene-cafe .cafe-curator{position:absolute;z-index:7;left:calc(67.7% - 10px);right:auto;top:68.1%;bottom:auto;width:5.35%;height:auto;padding:0;border:0;background:transparent;filter:none}
.cafe-message-entry>img{animation:cafeGuideUp 1.8s ease-in-out infinite}
#scene-cafe .cafe-curator>img{animation:cafeGuideRight 1.8s .18s ease-in-out infinite}
.cafe-entry:hover>img,.cafe-entry:focus-visible>img{animation-play-state:paused}
@keyframes cafeGuideUp{0%,100%{transform:translateY(0);filter:brightness(1)}50%{transform:translateY(-5%);filter:brightness(1.12)}}
@keyframes cafeGuideRight{0%,100%{transform:translateX(0);filter:brightness(1)}50%{transform:translateX(5%);filter:brightness(1.12)}}
.game.cafe-mode>.hud,.game.cafe-mode>.dialogue,.game.cafe-mode>.hint{display:none}
#scene-cafe .chat-panel{left:4%;right:auto;top:15%;bottom:6%;width:51%;height:auto;max-height:none;transform:translateX(-30px) scale(.96)}
#scene-cafe.conversation-mode .chat-panel{transform:none}
@media(prefers-reduced-motion:reduce){.cafe-entry>img{animation:none!important}}

/* Curator conversation — positioned from the supplied 2048 × 1152 comp. */
#scene-cafe.conversation-mode .cafe-stage{transform:none;filter:none}
#scene-cafe.conversation-mode::after{display:none}
#scene-cafe.conversation-mode .cafe-stage::after{content:"";position:absolute;z-index:3;inset:0;background:rgba(35,24,16,.53);pointer-events:none}
#scene-cafe.conversation-mode .cafe-background{transform:translateY(3%) scale(1.18);transform-origin:68% 52%}
#scene-cafe.conversation-mode .cafe-table{transform:scale(1.18);transform-origin:28% 52%}
#scene-cafe.conversation-mode .cafe-entry,
#scene-cafe.conversation-mode .cafe-character-intro,
#scene-cafe.conversation-mode .cafe-character-note{opacity:0;visibility:hidden;pointer-events:none}
#scene-cafe.conversation-mode .cafe-character-idle{z-index:11;left:48.5%;bottom:-33%;width:60%;height:120%;transform:scale(1.24);transform-origin:center bottom;object-position:center bottom;opacity:1;visibility:visible}
#scene-cafe .chat-panel{position:absolute;z-index:18;left:7.8%;right:auto;top:20.2%;bottom:auto;width:50.7%;height:60.3%;max-height:none;margin:0;padding:0;overflow:visible;border:0;border-radius:0;background:transparent;color:#75401f;box-shadow:none;opacity:0;visibility:hidden;transform:translateX(-2%) scale(.98);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1),visibility .35s}
#scene-cafe.conversation-mode .chat-panel{opacity:1;visibility:visible;transform:none}
.chat-frame{position:absolute;z-index:0;inset:0;width:100%;height:100%;display:block;object-fit:contain;pointer-events:none;user-select:none}
#scene-cafe .chat-message{position:absolute;z-index:2;left:6.6%;top:29.7%;width:86.8%;height:23.4%;margin:0;padding:2.2% 3.5%;overflow:auto;border:0;border-radius:0;background:transparent;color:#75401f;font:normal clamp(12px,1.25vw,25px)/1.55 "PingFang SC","Microsoft YaHei",sans-serif}
#scene-cafe .chat-options{position:absolute;z-index:2;left:6.5%;top:56.2%;width:87%;height:22%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));column-gap:2.5%;row-gap:8%}
#scene-cafe .chat-option{width:100%;height:100%;padding:0 5%;border:0;border-radius:0;background:transparent url("assets/cafe-v2/chat-option-idle.png") center/100% 100% no-repeat;color:#75401f;font:600 clamp(11px,1.18vw,23px)/1 "PingFang SC","Microsoft YaHei",sans-serif;cursor:pointer;transition:filter .18s,transform .18s}
#scene-cafe .chat-option:hover,
#scene-cafe .chat-option:focus-visible,
#scene-cafe .chat-option.is-selected{background-image:url("assets/cafe-v2/chat-option-selected.png");filter:brightness(1.02);outline:0}
#scene-cafe .chat-option:active{transform:translateY(1px)}
#scene-cafe .chat-resume-hotspot{position:absolute;z-index:3;left:18%;top:80.1%;width:64%;height:12.6%;display:block;margin:0;padding:0;border:0;border-radius:999px;background:transparent;color:transparent;text-decoration:none;cursor:pointer}
#scene-cafe .chat-resume-hotspot:focus-visible{outline:4px solid rgba(255,255,255,.96);outline-offset:-5px}
#scene-cafe .chat-resume-hotspot span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#scene-cafe .chat-close{position:absolute;z-index:4;left:50%;right:auto;top:103.7%;width:8.8%;height:auto;aspect-ratio:1;transform:translateX(-50%);display:block;padding:0;border:0;background:transparent;cursor:pointer;box-shadow:none;transition:transform .18s,filter .18s}
#scene-cafe .chat-close img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
#scene-cafe .chat-close:hover,#scene-cafe .chat-close:focus-visible{transform:translateX(-50%) scale(1.08);filter:brightness(1.08);outline:0}
@media(max-width:760px){
  #scene-cafe .chat-panel{left:7.8%;top:20.2%;width:50.7%;padding:0}
  #scene-cafe .chat-message{margin:0;padding:2.2% 3.5%;font-size:clamp(9px,1.25vw,13px)}
  #scene-cafe .chat-options{grid-template-columns:repeat(2,minmax(0,1fr))}
  #scene-cafe .chat-option{font-size:clamp(8px,1.18vw,12px)}
}

/* Guestbook artwork: the supplied transparent board is the complete visual. */
.note-editor,.note-editor[open]{
  position:fixed;
  z-index:11;
  left:var(--stage-left,0px);
  top:var(--stage-top,0px);
  right:auto;
  bottom:auto;
  width:var(--stage-width,100vw);
  height:var(--stage-height,56.25vw);
  max-width:none;
  max-height:none;
  margin:0;
  padding:0;
  overflow:visible;
  background:transparent;
  box-shadow:none;
  border:0;
  border-radius:0;
}
.note-editor[open]{display:block}
.note-editor form{position:static;width:100%;height:100%;margin:0;padding:0}
.note-editor::backdrop{background:rgba(42,25,16,.4);backdrop-filter:none}
.note-board-wrap{position:absolute;left:50%;top:10.5%;width:70%;aspect-ratio:1420 / 813;transform:translateX(-50%)}
.note-board-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}
.note-board-wrap textarea{position:absolute;left:10.2%;top:31.5%;width:79.5%;height:28%;resize:none;border:0;outline:0;background:transparent;color:#72552f;font:normal clamp(16px,2.2vw,34px)/1.35 serif;padding:1% 2%;z-index:2;transform:translateY(2px)}
.note-board-wrap textarea::placeholder{color:#c5b182;opacity:.82;font-style:italic}
.note-close{
  position:absolute;
  z-index:3;
  left:50%;
  /* Measured from the supplied 2048 × 1152 layout: centre at x=50%,
     y≈86% of the full scene, directly below the green shelf. */
  top:105.8%;
  right:auto;
  bottom:auto;
  transform:translate(-50%,-8px);
  width:6.4%;
  aspect-ratio:1;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
}
.note-close img{display:block;width:100%;height:100%;object-fit:contain}
.note-submit{position:absolute;z-index:3;left:36%;top:78%;width:28%;height:14%;padding:0;border:0;background:transparent;color:transparent;cursor:pointer}
.note-editor .note-preview,.note-editor #noteName,.note-editor input[type=radio],.note-editor #noteCount{display:none!important}
