/* BLACKVEIL_DIALOG_V1 - themed center popups (loaded as a file: site CSP blocks inline <style>) */
.bvd-backdrop{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:16px;background:rgba(8,5,12,.66);backdrop-filter:blur(3px);opacity:0;transition:opacity .16s ease}
.bvd-backdrop.bvd-in{opacity:1}
.bvd-box{width:min(440px,100%);box-sizing:border-box;background:linear-gradient(180deg,#202020,#161616);color:#f4e7dc;border:1px solid #4e4e4e;border-radius:14px;box-shadow:0 24px 70px rgba(0,0,0,.6),inset 0 1px 0 rgba(239,209,163,.08);padding:22px 22px 18px;font:15px/1.6 system-ui,-apple-system,"Segoe UI",sans-serif;transform:translateY(8px) scale(.97);transition:transform .16s ease}
.bvd-in .bvd-box{transform:none}
.bvd-kicker{font-size:10px;letter-spacing:.18em;font-weight:700;color:#dba572;margin:0 0 6px}
.bvd-title{font:600 20px/1.3 Georgia,serif;color:#f8e9dc;margin:0 0 10px}
.bvd-msg{margin:0 0 20px;color:#c8c8c8;white-space:pre-line;overflow-wrap:anywhere}
.bvd-field{display:grid;gap:5px;margin:0 0 14px;font-size:13px;color:#d8c7b4}
.bvd-field input{font:500 14px/1.4 ui-monospace,Consolas,monospace;padding:9px 11px;border-radius:8px;border:1px solid #4e4e4e;background:#101010;color:#f4e7dc;width:100%;box-sizing:border-box}
.bvd-field input:focus{outline:none;border-color:#efd1a3}
.bvd-field small{color:#8f8a84;font-size:12px}
.bvd-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.bvd-btn{font:inherit;font-size:14px;font-weight:700;cursor:pointer;min-width:96px;padding:9px 16px;border-radius:8px;border:1px solid #efd1a3;background:#efd1a3;color:#141414}
.bvd-btn:hover{background:#f6dfba}
.bvd-btn.bvd-ghost{background:transparent;color:#efd1a3;border-color:#595959}
.bvd-btn.bvd-ghost:hover{border-color:#efd1a3}
.bvd-btn.bvd-danger{background:#7c2f3e;border-color:#b05a6b;color:#ffe3e5}
.bvd-btn.bvd-danger:hover{background:#923a4b}
.bvd-btn:focus-visible{outline:2px solid #efd1a3;outline-offset:2px}
.bvd-toast{position:fixed;left:50%;top:50%;z-index:5001;transform:translate(-50%,-50%) scale(.96);opacity:0;pointer-events:none;max-width:min(420px,calc(100vw - 32px));box-sizing:border-box;padding:14px 20px;border-radius:12px;background:#252525;border:1px solid #656565;color:#d9f2e1;font:600 15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;text-align:center;box-shadow:0 18px 50px rgba(0,0,0,.55);transition:opacity .18s ease,transform .18s ease}
.bvd-toast.bvd-bad{background:#212121;border-color:#6f6f6f;color:#ffd6db}
.bvd-toast.bvd-in{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* BLACKVEIL_MUSIC_V1 */
.bv-music { position: fixed; left: 16px; bottom: 16px; z-index: 70; display: flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 999px; background: #0e0e0ecc; border: 1px solid #ffffff12; box-shadow: 0 8px 30px #000a; color: #e4d6b8; opacity: .75; transition: opacity .2s; }
.bv-music:hover, .bv-music:focus-within { opacity: 1; }
.bv-music[hidden] { display: none; }
.bv-music-toggle { width: 32px; height: 32px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #e2bd8318; color: inherit; cursor: pointer; padding: 0; }
.bv-music-toggle svg { width: 18px; height: 18px; }
.bv-music-toggle:hover { background: #e2bd832e; }
.bv-music-volume { width: 96px; accent-color: #cdb083; cursor: pointer; }
.bv-music.bv-muted { color: #8d8a82; }
@media (max-width: 760px) { .bv-music-volume { width: 70px; } .bv-music { left: 10px; bottom: 10px; } }

/* BLACKVEIL_MUSIC_V2 — vertical, sits in the page gutter; slider opens upward on hover/focus */
.bv-music { left: 6px; bottom: 10px; flex-direction: column-reverse; gap: 6px; padding: 4px; border-radius: 999px; width: 40px; align-items: center; }
.bv-music-volume { writing-mode: vertical-lr; direction: rtl; width: 20px !important; height: 0; opacity: 0; pointer-events: none; transition: height .2s ease, opacity .2s ease; margin: 0; }
.bv-music:hover .bv-music-volume, .bv-music:focus-within .bv-music-volume { height: 96px; opacity: 1; pointer-events: auto; }
@media (max-width: 760px) { .bv-music { left: 4px; bottom: 6px; } }

/* BLACKVEIL_GATE — "tap to come ashore" (only when the browser blocks sound) */
.bv-gate { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; align-content: center; gap: 14px; width: 100%; border: 0; padding: 24px; cursor: pointer; color: #e9e3d4;
  background: radial-gradient(ellipse 50% 45% at 50% 45%, #1c1a16f2, #070707fa 70%); font-family: "Noto Sans Thai", sans-serif; animation: bv-gate-in .6s ease both; }
.bv-gate[hidden] { display: none; }
.bv-gate img { width: min(220px, 52vw); height: auto; filter: drop-shadow(0 0 40px #cfa96133) drop-shadow(0 16px 30px #000); }
.bv-gate-title { font: 700 clamp(20px,2.4vw,28px)/1.2 "Cinzel Decorative", "Noto Serif Thai", serif; letter-spacing: .04em; color: #e8cf93; text-shadow: 0 0 24px #cfa96155; animation: bv-gate-pulse 2.4s ease-in-out infinite; }
.bv-gate-sub { font-size: 13px; color: #a8a59d; }
.bv-gate:focus-visible { outline: 2px solid #cfa961; outline-offset: -8px; }
.bv-gate-out { animation: bv-gate-out .5s ease both; pointer-events: none; }
@keyframes bv-gate-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes bv-gate-out { to { opacity: 0; transform: scale(1.04); } }
@keyframes bv-gate-pulse { 0%,100% { opacity: .7; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .bv-gate, .bv-gate-title, .bv-gate-out { animation: none; } }

/* BLACKVEIL_JOIN_V1 — not in the town Discord: notice + invite */
.bv-join { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 20px; background: radial-gradient(ellipse at 50% 40%, #1a1712f2, #070707fa 70%); }
.bv-join-card { display: grid; justify-items: center; gap: 12px; max-width: 460px; text-align: center; color: #e9e3d4; font-family: "Noto Sans Thai", system-ui, sans-serif; }
.bv-join-card img { width: 120px; height: auto; filter: drop-shadow(0 0 24px #cfa96133); }
.bv-join-card h2 { margin: 4px 0 0; font: 700 22px/1.35 "Noto Serif Thai", serif; color: #ece5d3; }
.bv-join-card p { margin: 0; color: #bdb8ac; line-height: 1.6; }
.bv-join-count { min-height: 1.6em; color: #cfa961 !important; font-size: 14px; }
.bv-join-go { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; min-width: 280px; padding: 0 24px; border-radius: 8px; border: 1px solid #cfa96188; background: linear-gradient(180deg, #1b1a18, #0d0d0c); color: #e8cf93; font-weight: 700; text-decoration: none; box-shadow: 0 0 26px #cfa96122; }
.bv-join-go:hover, .bv-join-go:focus-visible { border-color: #e2c27e; color: #f3dca4; box-shadow: 0 0 36px #cfa96144; outline: none; }
.bv-join-back { border: 0; background: none; color: #a8a59d; font: inherit; font-size: 14px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; min-height: 40px; }
.bv-join-back:hover { color: #e9e3d4; }