/* Arial is available on Windows/IIS clients; no external font download required. */
#chat-feed,#chat-input,#chat-status,.message-header,.message-text,.chat-system{font-family:Arial,"Noto Sans","Segoe UI",sans-serif;font-style:normal;letter-spacing:normal}
#chat-feed .message-text{font-size:14px;line-height:1.65;overflow-wrap:anywhere;white-space:pre-wrap;color:#e3e8e3}
#chat-feed .message-header{font-size:12px;line-height:1.5}
#chat-feed .chat-system{font-size:12px;line-height:1.65;overflow-wrap:anywhere}
#chat-input{font-size:14px;line-height:1.5}#chat-status{font-size:11px;line-height:1.5}
.message-body{min-width:0}.watch-button{border-color:#8b79a6!important;color:#e0d4f3!important;background:#302b3c!important}
.game-card{isolation:isolate;border-radius:10px;border-color:#a18b60;padding:10px;box-shadow:0 4px 12px #0005,inset 0 0 0 3px #10181d;min-height:204px}
.game-card:after{content:'';position:absolute;inset:4px;border:1px solid #d7ba8238;border-radius:7px;pointer-events:none;z-index:-1}
.card-surface{position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 50% 24%,var(--glow),transparent 62%),linear-gradient(160deg,#222631,#10151d 75%);pointer-events:none}
.tone-crimson{--accent:#efa694;--glow:#933f4659}.tone-violet{--accent:#c5b5ff;--glow:#735caa66}.tone-emerald{--accent:#a7dac0;--glow:#397d6766}.tone-rose{--accent:#efb5cc;--glow:#9a527666}.tone-gold{--accent:#efcf8e;--glow:#9e783d66}
.card-top{font-size:9px;letter-spacing:1px;color:#c5b185;position:relative}
.card-art{height:67px;margin:4px 0;color:var(--accent);background:radial-gradient(ellipse,var(--glow),transparent 70%)}
.card-art:before{width:46px;height:46px;border:1px solid currentColor;opacity:.25;transform:rotate(45deg);border-radius:8px}
.card-art:after{content:'';position:absolute;width:56px;height:56px;border:1px solid currentColor;border-radius:50%;opacity:.2}
.card-art .icon{width:36px;height:36px;stroke-width:1.25;filter:drop-shadow(0 2px 6px var(--glow))}
.art-orbit{position:absolute;width:64px;height:40px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;border-radius:50%;transform:rotate(-35deg);opacity:.23}
.art-stars{position:absolute;right:7px;top:8px;font-size:9px;opacity:.65}
.card-name{font-family:Arial,"Noto Sans",sans-serif;font-weight:700;font-size:12px;white-space:normal;line-height:1.4;min-height:25px;color:#f4e6c8}
.card-rule{font-family:Arial,"Noto Sans",sans-serif;font-size:10px;line-height:1.5;color:#deded7;-webkit-line-clamp:3}
.card-foot{font-size:7px;letter-spacing:.8px;color:#b4a07b}
.action-detail .game-card{width:156px;min-height:265px}.action-detail .card-art{height:79px}.action-detail .card-rule{display:block;font-size:11px}.action-detail .card-name{font-size:15px}
.game-card:focus-visible{outline:2px solid #f6dca3;outline-offset:3px}
@media(max-height:800px) and (min-width:801px){.game-card{min-height:178px}.card-art{height:45px}.card-rule{font-size:9px}.card-art .icon{width:29px;height:29px}}
@media(max-width:800px){.game-card{width:112px;min-height:174px;padding:8px}.card-art{height:43px}.card-art .icon{width:29px;height:29px}.card-art:after{width:40px;height:40px}.card-art:before{width:32px;height:32px}.art-orbit{width:48px;height:29px}.card-name{font-size:11px}.card-rule{font-size:9px}.card-foot{font-size:6px}.hand{min-height:182px}.action-detail{align-items:flex-start}.action-detail .game-card{width:132px}.action-detail .card-art{height:62px}}
@media(prefers-reduced-motion:reduce){.game-card{transition:none}.game-card.is-new,.game-card.card-flying{animation:none}}

.private-result{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:18px;margin:12px 0;border:1px solid #d7ba8255;border-radius:8px;background:#d7ba820d;font-family:Arial,sans-serif}.private-result strong{overflow-wrap:anywhere;min-width:0}.private-result b{color:var(--gold);flex-shrink:0}#private-dialog .eyebrow{line-height:1.7;letter-spacing:1px}

#action-status{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:100;padding:10px 16px;border-radius:8px;background:#172829;border:1px solid var(--gold);color:var(--cream);font:14px Arial,sans-serif;pointer-events:none}.action-busy #draw-card,.action-busy #hand [data-card],.action-busy [data-night]{pointer-events:none;opacity:.65}
/* Fullscreen targets the document so dialogs and both game/chat stay in view. */
#fullscreen-button{font-size:25px;line-height:1}
#fullscreen-play{white-space:nowrap;flex-shrink:0}
html.fullscreen-layout,html.fullscreen-layout body{width:100%;height:100dvh;overflow:hidden}
html.fullscreen-layout{--sidebar:clamp(170px,26vw,360px)}
.fullscreen-layout #app{width:100%;height:100dvh}
.fullscreen-layout #app:not(.is-home) #stage{width:calc(100% - var(--sidebar))}
.fullscreen-layout #sidebar{width:var(--sidebar);transform:none;box-shadow:none}
.fullscreen-layout #mobile-chat{display:none}
.expanded-view #app{position:fixed;inset:0;z-index:50}
@media(max-width:800px){#fullscreen-play{padding:7px;min-height:34px}#fullscreen-play span{display:none}.fullscreen-layout .sidebar-title{padding:15px 10px}.fullscreen-layout .chat-feed{padding:12px 10px}.fullscreen-layout .chat-form{padding:10px}.fullscreen-layout .message-header time{display:none}.fullscreen-layout .turn-bar{flex-wrap:wrap}.fullscreen-layout .turn-actions{flex-wrap:wrap;gap:6px}.fullscreen-layout .hand-zone{padding-left:8px;padding-right:8px}.fullscreen-layout #stage .role-badge{max-width:125px}}

/* Compact, non-interactive shared announcement; top of game stage only. */
.card-announcement{position:absolute;z-index:9;top:14px;left:50%;transform:translateX(-50%);width:max-content;max-width:min(740px,calc(100% - 220px));padding:10px 17px;display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap;background:#101c20eb;border:1px solid #c9ae7766;border-radius:10px;box-shadow:0 8px 22px #0008;color:#f3ecde;pointer-events:none;text-align:center;animation:card-announce-in .22s ease both}
.card-announcement[hidden]{display:none!important}
.announcement-player{font-size:clamp(13px,1.25vw,17px);font-weight:700;overflow-wrap:anywhere}
.announcement-action{font-size:11px;letter-spacing:1px;color:#a8b6aa;white-space:nowrap}
.announcement-card{font-size:clamp(17px,1.7vw,24px);color:#f2d394;white-space:nowrap}
.announcement-target{font-size:clamp(13px,1.25vw,17px);font-weight:700;color:#f5e4ba;overflow-wrap:anywhere}.announcement-target[hidden]{display:none!important}
.announcement-note{width:100%;font-size:12px;color:#e0bca8}
@keyframes card-announce-in{from{opacity:0;transform:translate(-50%,-7px)}to{opacity:1;transform:translate(-50%,0)}}
@media(max-width:900px){.card-announcement{top:15px;max-width:calc(100% - 24px);padding:8px 11px;gap:6px}.announcement-card{font-size:18px}.announcement-player{font-size:14px}}
@media(prefers-reduced-motion:reduce){.card-announcement{animation:none}}

/* Vietnamese headings: Georgia can substitute unsupported accented glyphs with a
   different font, creating broken-looking spacing in Chromium/Windows. */
h1,h2,h3,.card-name,.phase-timer,.timer,.avatar{
  font-family:"Times New Roman","Noto Serif","DejaVu Serif",serif;
  font-kerning:normal;
}
h1,h2,h3,.card-name{letter-spacing:normal;overflow-wrap:break-word}