.interactive-decor { position:absolute; left:50%; bottom:141px; transform:translateX(-50%); z-index:20; width:max-content; max-width:min(500px,calc(100% - 28px)); padding:11px 13px; border:1px solid #cab27b66; border-radius:8px; background:#142a22ed; color:#dfdfc2; box-shadow:0 8px 28px #0004; backdrop-filter:blur(12px); }
.interactive-decor[hidden] { display:none !important; }
.decor-heading { display:flex; justify-content:space-between; gap:18px; align-items:center; margin-bottom:8px; }
.decor-heading strong { font:500 17px 'Cormorant Garamond',Georgia,serif; color:#ead3a4; }
.decor-heading span { font:9px 'Be Vietnam Pro',sans-serif; color:#a9bda0; white-space:nowrap; }
.decor-heading kbd { padding:2px 5px; border:1px solid #a6ba8c70; border-radius:3px; font-size:9px; margin-right:3px; }
.decor-actions { display:flex; gap:5px; flex-wrap:wrap; }
.decor-actions button { min-height:34px; padding:8px 10px; background:#a7b28612; border:1px solid #a7b28655; border-radius:4px; color:#d5dfbf; font:10px 'Be Vietnam Pro',sans-serif; cursor:pointer; }
.decor-actions button[hidden] { display:none !important; }
.decor-actions button:hover,.decor-actions button:focus-visible { background:#c4b78038; border-color:#e0c58b; }
.decor-actions button.decor-primary { border-color:#c9af73b3; background:#b39e5c25; color:#efe0b8; }
.interactive-decor p { margin:7px 0 0; color:#a0b593; font:9px 'Be Vietnam Pro',sans-serif; line-height:1.6; }
.interactive-decor[data-seated='true'] { left:auto; right:20px; bottom:90px; transform:none; max-width:245px; }
.interactive-decor[data-seated='true'] .decor-heading { gap:10px; }
@media(max-width:1050px) and (min-width:761px) { .interactive-decor[data-seated='true'] { bottom:260px; } }
@media(max-width:760px) {
  .interactive-decor,.interactive-decor[data-seated='true'] { left:50%; right:auto; top:134px; bottom:auto; transform:translateX(-50%); max-width:calc(100% - 26px); width:max-content; padding:9px 11px; }
  .decor-heading { margin-bottom:6px; }
  .decor-heading strong { font-size:16px; }
  .decor-actions button { min-height:34px; padding:7px 9px; font-size:9px; }
  .interactive-decor p { font-size:8px; }
  .decor-heading span { font-size:8px; }
}
@media(max-width:420px) { .decor-heading kbd { display:none; } .decor-heading span { font-size:0; } .decor-heading span::after { content:'Chạm để tương tác';font-size:8px; } }
