/* UNBOUND MATRIX 0.3.57 -- unified Game workspace.
   All regular editor views remain unchanged. Game alone removes outer chrome. */
body.game-mode{overflow:hidden;background:#102a20}
body.game-mode #app{display:block;height:100dvh;overflow:hidden}
.game-frame{height:100dvh;min-height:0;display:grid;grid-template-rows:minmax(146px,25vh) minmax(0,1fr) 44px;overflow:hidden;background:#102a20;color:#173e2e}
.game-frame.game-needs-login{grid-template-rows:minmax(0,1fr) 44px}
.game-frame.game-needs-login .game-table-dock{display:none}
.game-dice-dock{min-height:0;position:relative;background:#e6f1e9;border-bottom:2px solid #1f7f54;z-index:5;overflow:visible}
.game-dice-dock #online-dice-slot,.game-dice-dock #online-dice-host{width:100%;height:100%;min-width:0;display:block}
.game-table-dock{min-width:0;min-height:0;overflow:hidden;padding:5px}
.game-table-dock #unbound-table-slot,.game-table-dock .table-host,.game-table-dock .table-app{min-width:0;min-height:0;height:100%;width:100%}
.game-bottom-tabs{display:flex;align-items:stretch;gap:3px;padding:4px 7px 2px;overflow-x:auto;overscroll-behavior-x:contain;background:#092b20;border-top:2px solid #289366;scrollbar-width:thin;z-index:6}
.game-bottom-tabs .build-tab{flex:0 0 auto;padding:5px 10px;min-height:32px;border-radius:4px;font-size:12px;white-space:nowrap}
.game-bottom-tabs .build-tab.active{background:var(--gem);color:var(--green-dark);border:1px solid var(--emerald-light)}
/* Table app becomes the three-column game stage, not a second app page. */
.game-frame .table-app{display:flex;flex-direction:column;gap:0;padding:0;border:0;background:transparent;border-radius:0}
.game-frame .table-heading{display:none}
.game-frame .table-status{margin:0;padding:3px 8px;border-radius:0;min-height:24px;flex:0 0 24px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-size:11px}
.game-frame .table-main{flex:1;min-height:0;overflow:hidden}
.game-room-grid{display:grid!important;grid-template-columns:clamp(215px,19vw,305px) minmax(0,1fr) clamp(260px,25vw,390px)!important;grid-template-rows:minmax(0,1fr);height:100%;gap:5px!important;align-items:stretch!important}
.game-room-grid>.table-people,.game-room-grid>.table-chat,.game-map-center{min-width:0;min-height:0;border:1px solid #326c52;border-radius:5px;background:#f5f8f5}
.game-room-grid>.table-people{overflow-y:auto;overflow-x:hidden;padding:8px;scrollbar-width:thin;display:block}
.game-room-grid>.table-people .table-room-header{display:flex;flex-direction:column;align-items:stretch;gap:5px;padding-bottom:8px;margin-bottom:10px}
.game-room-grid>.table-people .table-room-header h3{font-size:14px;margin:0;overflow-wrap:anywhere}
.game-room-grid>.table-people .table-room-actions{gap:3px}
.game-room-grid>.table-people .table-room-actions .btn{padding:4px 5px;min-height:27px;font-size:10px}
.game-room-grid>.table-people .table-code{font-size:11px}
.game-room-grid>.table-chat{display:flex;flex-direction:column;gap:6px;overflow:hidden;padding:8px}
.game-room-grid>.table-chat h3{font-size:14px;flex:none;margin:0}
.game-room-grid>.table-chat .table-messages{flex:1;min-height:0;max-height:none;overflow-y:auto;scrollbar-width:thin}
.game-room-grid>.table-chat #table-send{flex:none;margin:1px 0 0;grid-template-columns:minmax(0,1fr) auto}
.game-room-grid>.table-chat .table-chat-note{flex:none;margin:2px 0 0;font-size:10px}
.game-room-grid>.table-people .table-people-list{max-height:180px}
.game-room-grid>.table-people .table-audio-devices{margin:6px 0}
.game-room-grid>.table-people .table-person{align-items:center}
.game-room-grid>.table-people .table-person-name{display:block;line-height:1.35}
.game-room-grid>.table-people #table-mic{width:100%}
.game-headshot-picker{display:grid;gap:4px;font-size:11px;font-weight:750;color:#175238;margin:8px 0;padding:8px 0;border-top:1px solid #bed0c4}
.game-headshot-picker select{width:100%;min-width:0}
.game-map-center{position:relative;display:flex;flex-direction:column;overflow:hidden;padding:4px;background:#081912}
.game-map-center #unbound-map-slot,.game-map-center .map-host{flex:1;min-height:0;min-width:0;display:flex;flex-direction:column}
.game-map-center .map-app{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;padding:5px;border:0;background:#12251d;gap:4px;color:#eaf7ec}
.game-map-center .map-capture-controls{flex:0 0 auto;gap:5px}
.game-map-center .map-source-label{max-width:none;color:#e4f2e5;margin-left:0;font-size:11px}
.game-map-center .map-source-label select{min-width:80px}
.game-map-center .map-capture-controls .btn{min-height:30px;padding:5px 8px;font-size:11px}
.game-map-center .map-note{font-size:10px;color:#cbded2;line-height:1.25}
.game-map-center .map-screen-stage{flex:1;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.game-map-center .map-viewport{position:relative;overflow:hidden;flex:none;display:block;background:#07150d;min-height:0;height:auto;width:auto;max-width:100%;max-height:100%;border:1px solid #3f7556;border-radius:3px;touch-action:auto;user-select:none;cursor:default}
.game-map-center .map-viewport video{position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;transform:none!important;object-fit:fill;pointer-events:none}
.game-map-center .map-status{flex:none;font-size:10px;line-height:1.25;padding:3px 6px;white-space:normal}
.game-map-center .map-privacy{flex:none;font-size:10px;line-height:1.25;margin:0;padding:4px 7px}
.game-map-center .map-empty{padding:10px}
.game-map-center .map-empty strong{font-size:15px}
.game-map-center .map-empty p{font-size:11px}
/* A separate, intentionally small GM-only result surface. */
#game-gm-rolls{position:absolute;right:9px;bottom:72px;z-index:4;width:min(182px,40%);max-height:126px;overflow:auto;background:#f7e7ec;box-shadow:0 2px 12px #0009;border:2px solid #8c3e53;color:#581e2a;border-radius:5px;padding:5px;font-size:10px}
#game-gm-rolls[hidden]{display:none!important}
#game-gm-rolls>strong{display:block;font-size:11px;margin-bottom:3px}
#game-gm-rolls>div{display:flex;gap:6px;justify-content:space-between;align-items:center;border-top:1px solid #ba8997;padding:3px 0}
#game-gm-rolls b{font-size:13px}
#game-gm-rolls small{font-size:9px}
/* Name first; condition markers appear ONLY over the portrait on the right. */
.game-avatar{position:relative;display:inline-flex;vertical-align:middle;margin-left:7px;flex:none;width:44px;height:44px;border:1px solid #6a8e77;border-radius:4px;overflow:hidden;background:#16352a;align-items:center;justify-content:center}
.game-avatar>img{display:block;width:100%;height:100%;object-fit:cover}
.game-avatar-empty{color:#e9fff0;font-size:13px}
.game-avatar-bloodied,.game-avatar-nofate{position:absolute;pointer-events:none;width:43%;height:43%;background-repeat:no-repeat;background-position:center;background-size:contain;filter:drop-shadow(0 1px 2px #000);z-index:2}
.game-avatar-bloodied{left:0;top:0;background-image:url('assets/blood-drop.svg');opacity:1}
.game-avatar-nofate{right:0;top:0;background-image:url('assets/no-fate-skull.png');opacity:1;z-index:3}
.game-chat-identity{display:inline-flex;align-items:center;gap:1px;white-space:normal;vertical-align:middle}
.game-chat-identity .game-avatar{width:45px;height:45px}
.game-chat-name{font-weight:800}
.game-dice-sample>div{display:flex;gap:4px;flex-wrap:wrap;max-height:120px;overflow:auto}
.game-dice-sample>div>span{padding:2px 5px;background:#dbeee2;border:1px solid #b2ccb9;border-radius:3px;font-size:10px}
.game-lobby-panel{overflow-y:auto!important;padding:12px;display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,1.15fr);gap:12px}
.game-lobby-panel>.table-lobby{grid-column:1;display:grid;grid-template-columns:1fr;gap:10px}
.game-lobby-panel>.table-recent{grid-column:1;margin:0}
.game-lobby-panel>.table-active-room{grid-column:1}
.game-lobby-panel>.game-map-lobby{grid-column:2;grid-row:1 / span 3;min-height:260px}
.game-lobby-panel .table-lobby article{gap:5px;padding:9px}
.game-lobby-panel .table-recent-row{flex-wrap:wrap}
@media(max-width:1120px){.game-room-grid{grid-template-columns:210px minmax(0,1fr) 265px!important}.game-room-grid>.table-people{padding:5px}.game-room-grid>.table-chat{padding:5px}.game-map-center .map-privacy{display:none}}
@media(max-width:760px){
 .game-frame{grid-template-rows:minmax(185px,29vh) minmax(0,1fr) 43px}
 .game-frame.game-needs-login{grid-template-rows:minmax(0,1fr) 43px}
 .game-table-dock{overflow-y:auto}
 .game-frame .table-main{overflow:visible}
 .game-room-grid{display:flex!important;flex-direction:column;min-height:100%;height:auto;gap:5px}
 .game-room-grid>.game-map-center{order:0;flex:none;height:clamp(245px,48vh,600px)}
 .game-room-grid>.table-chat{order:1;min-height:250px;flex:none;height:clamp(270px,42vh,620px)}
 .game-room-grid>.table-people{order:2;flex:none;max-height:440px}
 .game-lobby-panel{display:flex;flex-direction:column}
 .game-lobby-panel>.game-map-lobby{order:-1;min-height:240px}
 .game-frame .table-app{height:auto}
}
@media print{.game-frame{display:none!important}}

/* 0.3.57 -- compact Dice top strip; reclaim vertical space for live screen. */
.game-frame{grid-template-rows:124px minmax(0,1fr) 44px;grid-template-columns:minmax(0,1fr)}
.game-frame.game-needs-login{grid-template-rows:minmax(0,1fr) 44px}
.game-bottom-tabs .build-tab{color:var(--ivory-light);background:var(--green);opacity:1;font-weight:650;border:1px solid rgba(110,231,170,.42);text-shadow:none}
.game-bottom-tabs .build-tab:not(.active):hover{background:var(--emerald-dark);color:var(--ivory-light)}
.game-bottom-tabs .build-tab:focus-visible{outline:3px solid #7effb9;outline-offset:-3px}
.game-bottom-tabs .build-tab.active{color:var(--green-dark);background:var(--gem);border-color:var(--emerald-light);font-weight:800}
/* Prior GM overlay is replaced by the compact private-roll selector in the header. */
.game-map-center #game-gm-rolls{display:none!important}
.game-room-grid{grid-template-columns:clamp(176px,15vw,240px) minmax(0,1fr) clamp(220px,21vw,320px)!important;gap:4px!important}
.game-frame .table-status{min-height:18px;flex-basis:18px;padding:2px 6px;font-size:10px}
.game-room-grid>.table-people,.game-room-grid>.table-chat{padding:5px}
.game-room-grid>.table-chat{gap:3px}
.game-room-grid>.table-chat h3{font-size:12px}
.game-room-grid>.table-chat .table-chat-note{display:none}
.game-room-grid>.table-chat #table-send{display:block;margin:1px 0 0}
.game-room-grid>.table-chat #table-message{width:100%;min-height:48px;max-height:140px;resize:vertical;padding:7px 9px;font-size:13px}
.game-map-center{padding:2px}
.game-map-center .map-app{padding:2px;gap:2px}
.game-map-center .map-capture-controls .btn{min-height:27px;padding:3px 6px}
.game-map-center .map-note{display:none}
.game-map-center .map-privacy{display:none}
@media(max-width:1120px){.game-room-grid{grid-template-columns:180px minmax(0,1fr) 225px!important}}
@media(max-width:760px){
 .game-frame{grid-template-rows:124px minmax(0,1fr) 43px}
 .game-frame.game-needs-login{grid-template-rows:minmax(0,1fr) 43px}
 .game-room-grid{display:flex!important;flex-direction:column}
 .game-room-grid>.game-map-center{height:clamp(260px,50vh,680px)}
}

/* Keep source-video intrinsic width from enlarging the mobile flex column. */
@media(max-width:760px){
 .game-frame .game-table-dock,.game-frame .table-host,.game-frame .table-app,.game-frame .table-main,.game-room-grid{width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box}
 .game-room-grid>.game-map-center,.game-room-grid>.table-chat,.game-room-grid>.table-people{flex:0 0 auto;width:100%;min-width:0;max-width:100%;box-sizing:border-box}
 .game-map-center #unbound-map-slot,.game-map-center .map-host,.game-map-center .map-app,.game-map-center .map-screen-stage{min-width:0;max-width:100%}
}

/* 0.3.64 -- dark forest-green CHAT DISPLAY ONLY.
   Message cards (ordinary and Dice) deliberately keep their original colors. */
.game-room-grid>.table-chat{
 background:#061b12;
 border-color:#2c6143;
 color:#edf7ef;
}
.game-room-grid>.table-chat .table-messages{
 background:#061b12;
 border-color:#244c35;
 scrollbar-color:#416a50 #061b12;
}
.game-room-grid>.table-chat .table-message{
 color:#172e20; /* readable original dark ink on the unchanged pale cards */
}
.game-room-grid>.table-chat .game-chat-title h3{
 color:#edf7ef;
}
.game-room-grid>.table-chat .table-empty{
 color:#c7e4ce;
}

/* 0.3.64 -- accessible/mutable chat chime, portrait visibility, responsive Game */
.game-chat-title{display:flex;align-items:center;gap:5px;justify-content:space-between;min-width:0}
.game-chat-title h3{min-width:0;overflow-wrap:anywhere;flex:1}
.game-chat-sound{flex:none;white-space:nowrap;min-height:26px;font-size:10px;padding:3px 6px}
.game-avatar{background:#1c3f31;border-color:#638b74;box-shadow:inset 0 0 0 1px #ecf9ed}
.game-avatar>img{image-rendering:auto}
.game-chat-identity{white-space:normal;max-width:100%}
.game-chat-name{overflow-wrap:anywhere}
@media(max-width:760px){
 .game-room-grid>.table-people{max-height:none;overflow:visible}
 .game-table-dock{-webkit-overflow-scrolling:touch}
 .game-frame{width:100%;max-width:100vw}
 .game-bottom-tabs{touch-action:pan-x}
 .game-chat-title{flex-wrap:wrap}
}


/* 0.3.64 — consistent name → portrait alignment, icons remain ON portrait. */
.game-room-grid .table-person-name{display:flex;flex-direction:column;gap:3px;min-width:0}
.game-person-identity,.game-chat-identity{display:inline-flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:8px;min-width:0;max-width:100%;vertical-align:middle;line-height:1.25}
.game-person-display-name,.game-chat-name{flex:0 1 auto;min-width:0;overflow-wrap:anywhere;word-break:normal}
.game-person-identity .game-avatar,.game-chat-identity .game-avatar{margin-left:0;flex:0 0 46px;width:46px;height:46px;vertical-align:middle}
.game-room-grid .table-message header>strong{display:flex;align-items:center;gap:4px;flex:1 1 0;min-width:0;max-width:100%;line-height:1.25}
.game-room-grid .table-message header time{align-self:flex-start;flex:0 0 auto;font-size:10px}
.game-chat-roll-label{font-size:11px;font-weight:700;min-width:0;overflow-wrap:anywhere}
.game-room-grid .table-person .table-moderation{flex:0 0 100%;justify-content:flex-start;padding-left:10px}
@media(max-width:900px){
 .game-frame{grid-template-rows:124px minmax(0,1fr) 44px}
 .game-frame.game-needs-login{grid-template-rows:minmax(0,1fr) 44px}
 .game-frame .game-table-dock{overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
 .game-frame .table-app{height:auto;min-height:100%;overflow:visible}
 .game-frame .table-main{overflow:visible}
 .game-room-grid{display:flex!important;flex-direction:column;width:100%;height:auto;min-height:0;gap:5px}
 .game-room-grid>.game-map-center,.game-room-grid>.table-chat,.game-room-grid>.table-people{width:100%;max-width:100%;min-width:0;flex:0 0 auto;box-sizing:border-box}
 .game-room-grid>.game-map-center{order:0;height:clamp(250px,54dvh,720px)}
 .game-room-grid>.table-chat{order:1;height:clamp(300px,50dvh,720px)}
 .game-room-grid>.table-people{order:2;max-height:none;overflow:visible}
 .game-map-center .map-capture-controls{flex-wrap:wrap}
 .game-map-center .map-source-label{flex:1 1 130px}
 .game-map-center .map-screen-stage{min-height:0}
}
/* On very narrow portrait phones, keep source controls accessible without shrinking video. */
@media(max-width:390px){
 .game-room-grid>.game-map-center{height:clamp(260px,55dvh,540px)}
 .game-map-center .map-source-label{flex-basis:100%}
}
/* CSS expanded screen fallback for iOS WebKit and browsers without Fullscreen API. */
.game-map-center .map-app.map-expanded{position:fixed!important;inset:0!important;z-index:100!important;display:flex;flex-direction:column;box-sizing:border-box;width:100vw!important;max-width:100vw!important;height:100dvh!important;max-height:100dvh!important;overflow:hidden;padding:8px;background:#071b12}
.game-map-center .map-app.map-expanded .map-screen-stage{flex:1;min-height:0;max-height:none}
.game-map-center .map-app.map-expanded .map-viewport{max-height:100%;max-width:100%}


/* 0.3.64 Local-only mic test. Meter does not stream or record the microphone. */
.game-audio-mic-actions{display:flex;flex-wrap:wrap;align-items:stretch;gap:5px}
.game-audio-mic-actions>.btn{flex:1 1 85px;min-height:32px;min-width:0;font-size:11px}
.game-mic-test-readout{margin:4px 0 8px;display:grid;gap:4px;padding:6px;border:1px solid #49795c;border-radius:5px;background:#0b2b1b;color:#f4ffeb;line-height:1.3}
.game-mic-test-readout[hidden]{display:none!important}
.game-mic-level{height:11px;border:1px solid #6fa98c;border-radius:3px;background:#04140d;overflow:hidden}
.game-mic-level-fill{display:block;width:0;height:100%;border-radius:2px;background:#73dda0;transition:width 80ms linear}
.game-mic-test-note{font-size:11px;color:#f1fbea;overflow-wrap:anywhere}
@media(max-width:900px){
}

/* 0.3.64: Single audio-control location, inside the LEFT participant panel.
   Mobile/tablet: a side drawer replaces the removed top-of-screen audio bar. */
.game-audio-launcher,.game-audio-backdrop,.game-audio-close{display:none!important}
#table-audio-status{display:block;min-height:0;color:#195139;font-size:11px;line-height:1.35;overflow-wrap:anywhere}
#table-audio-status:empty{display:none}
.game-room-grid>.table-people{scrollbar-gutter:stable}
@media(max-width:900px){
 .game-room-grid>.table-people{
  display:block!important;
  position:fixed!important;inset:0 auto 0 0!important;
  z-index:82!important;width:min(340px,92vw)!important;
  max-width:min(340px,92vw)!important;height:100dvh!important;
  max-height:100dvh!important;overflow-y:auto!important;overflow-x:hidden!important;
  background:#f5f8f5;box-shadow:5px 0 25px #0009;
  transform:translateX(-110%);transition:transform .18s ease-out;
  overscroll-behavior:contain;padding:10px!important;
 }
 .game-room-grid>.table-people.game-audio-open{transform:translateX(0)}
 .game-audio-launcher{
  display:block!important;position:fixed;left:0;top:53%;z-index:78;
  width:40px;min-height:118px;padding:9px 8px;
  writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg);
  border-radius:0 7px 7px 0;background:#20724e;color:#fff;
  border:1px solid #74c597;font-size:12px;letter-spacing:.03em;
  box-shadow:0 2px 7px #0009;
 }
 .game-audio-launcher[aria-expanded="true"]{display:none!important}
 .game-audio-backdrop:not([hidden]){
  display:block!important;position:fixed;inset:0;z-index:80;
  width:100vw;height:100dvh;border:0;background:#0009;
 }
 .game-room-grid>.table-people .game-audio-close{
  display:block!important;position:sticky;top:0;z-index:2;
  width:100%;min-height:42px;margin:0 0 8px;
  background:#0a4830;color:#fff;border-color:#4b9569;
 }
 /* The map stays first, chat second. Audio is never a strip above the map. */
 .game-room-grid>.game-map-center{order:0}
 .game-room-grid>.table-chat{order:1}
}
@media(prefers-reduced-motion:reduce){.game-room-grid>.table-people{transition:none}}


/* 0.3.64: participant rows cannot let the action strip squeeze the name into
   a one-character column. Actions are a separate grid row at every width. */
.game-room-grid>.table-people .table-people-list{width:100%;max-width:100%;min-width:0;gap:8px;overflow-x:hidden}
.game-room-grid>.table-people .table-person{
 display:grid!important;grid-template-columns:12px minmax(0,1fr)!important;
 grid-template-areas:"presence identity" "actions actions";
 align-items:center;align-content:start;column-gap:5px;row-gap:6px;
 width:100%;min-width:0;box-sizing:border-box;padding:8px 5px;
 border:1px solid #c2d4c7;border-radius:6px;background:#fff;
}
.game-room-grid>.table-people .table-dot{grid-area:presence;align-self:start;padding-top:3px;font-size:13px;line-height:18px;color:#197b4d}
.game-room-grid>.table-people .table-person.offline .table-dot{color:#727d74}
.game-room-grid>.table-people .table-person-name{
 grid-area:identity!important;display:flex!important;flex-direction:column;
 gap:5px;min-width:0!important;width:100%;overflow:visible!important;
 overflow-wrap:normal!important;word-break:normal;line-height:1.25;
}
.game-room-grid>.table-people .game-person-identity{
 display:flex;flex-wrap:nowrap;align-items:center;gap:5px;
 width:100%;max-width:100%;min-width:0;
}
.game-room-grid>.table-people .game-person-display-name{
 flex:1 1 auto;min-width:0;overflow-wrap:break-word!important;word-break:normal!important;
 white-space:normal!important;font-weight:750;font-size:12px;line-height:1.3;
}
.game-room-grid>.table-people .game-person-identity .game-avatar{
 flex:0 0 44px!important;width:44px;height:44px;min-width:44px;max-width:44px;
}
.game-room-grid>.table-people .table-person-presence{display:block;line-height:1.4;white-space:normal;color:#3e5447;font-size:11px}
.game-room-grid>.table-people .table-person-presence strong{color:#08612f}
.game-room-grid>.table-people .table-person.offline .table-person-presence strong{color:#666}
.game-room-grid>.table-people .table-moderation{
 grid-area:actions!important;display:flex!important;flex:initial!important;
 gap:5px;flex-wrap:wrap;justify-content:flex-start;align-items:stretch;
 min-width:0;width:100%;padding:0!important;margin:0;
}
.game-room-grid>.table-people .table-moderation>.btn{min-height:31px;padding:5px 6px;font-size:11px;flex:1 1 auto;white-space:nowrap}
.game-room-grid>.table-people .table-moderation>[data-table-mod="promote"],
.game-room-grid>.table-people .table-moderation>[data-table-mod="demote"]{flex:2 0 100%;font-weight:800}
.game-room-grid>.table-people .table-moderation>.btn:disabled{opacity:.75;cursor:not-allowed}
@media(min-width:901px){.game-room-grid{grid-template-columns:clamp(210px,18vw,285px) minmax(0,1fr) clamp(220px,21vw,320px)!important}}

.game-room-grid>.table-people .table-people-list{max-height:clamp(210px,33dvh,390px)}

/* Game 0.3.64: the SAME portrait-condition artwork used by Identity headshots.
   These are deliberately full-portrait overlays, not small substitute corner icons. */
.game-person-identity .game-avatar-bloodied,.game-chat-identity .game-avatar-bloodied{inset:0;width:100%;height:100%;left:0;top:0;opacity:.78;filter:none;background-image:url('assets/blood-spatter-1.svg');background-size:100% 100%;z-index:4}
.game-person-identity .game-avatar-nofate,.game-chat-identity .game-avatar-nofate{inset:0;width:100%;height:100%;left:0;top:0;opacity:.42;filter:none;background-image:url('assets/no-fate-skull.png');background-size:contain;z-index:5}

/* Game Skill/Saving popover belongs to the top Dice controls, not the character editor. */
.game-roll-dialog{position:fixed;z-index:1800;top:min(120px,20dvh);left:clamp(8px,11vw,150px);width:min(520px,calc(100vw - 16px));max-height:calc(100dvh - 155px);overflow:auto;box-sizing:border-box;background:#edf5ed;color:#153624;border:2px solid #298658;border-radius:6px;box-shadow:0 12px 35px #000b;padding:10px}
.game-roll-dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-bottom:8px;border-bottom:1px solid #85ad94;font-size:14px}
.game-roll-dialog-heading button{flex:none}
.game-roll-dialog p{font-size:12px;line-height:1.45}
.game-roll-options-grid{display:grid;grid-template-columns:minmax(150px,1fr) minmax(175px,1.1fr);gap:12px;margin-top:9px}
.game-roll-list,.game-roll-options-side label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:750}
.game-roll-list select{min-width:0;width:100%;height:260px;font-size:12px;overflow:auto}
.game-roll-options-side{display:grid;align-content:start;gap:8px}
.game-roll-options-side .select{min-width:0;width:100%}
.game-roll-side-title{font-weight:850;color:#125234;font-size:14px}
.game-roll-explanation{margin:4px 0;font-weight:400}
.game-saving-choices{display:grid;gap:8px;margin-top:8px}
.game-saving-choices .btn{display:flex;align-items:center;justify-content:space-between;text-align:left;min-height:38px;font-size:14px;padding:6px 11px}
@media(max-width:520px){.game-roll-dialog{left:8px;top:104px;max-height:calc(100dvh - 130px)}.game-roll-options-grid{grid-template-columns:minmax(110px,1fr) minmax(155px,1.1fr);gap:6px}.game-roll-list select{height:235px}.game-roll-dialog{padding:7px}}

/* 0.3.65: searchable Game-only Skill/Essence roll catalogue. */
.game-roll-list{min-width:0;display:flex;flex-direction:column;gap:5px}
.game-roll-list #game-skill-search{width:100%;min-height:34px;font-size:13px;padding:5px 8px}
.game-skill-choices{display:flex;flex-direction:column;gap:2px;overflow-y:auto;overscroll-behavior:contain;height:270px;min-height:110px;border:1px solid #96baa1;border-radius:4px;background:#fff;padding:3px}
.game-skill-item{display:flex;align-items:center;justify-content:space-between;gap:6px;flex:none;width:100%;min-height:28px;text-align:left;font-size:12px;color:#163c2b;border:1px solid transparent;border-radius:3px;background:transparent;padding:4px 7px;cursor:pointer;font-weight:400;font-style:normal;white-space:normal;overflow-wrap:break-word}
.game-skill-item:hover,.game-skill-item:focus-visible{background:#d9f0e1;border-color:#80b298}
.game-skill-item[aria-pressed="true"]{background:#c2ebd1;border-color:#168052;outline:1px solid #168052}
.game-skill-trained{font-weight:800}
.game-skill-essence{font-style:italic}
.game-skill-mod{font-weight:inherit;white-space:nowrap;flex:0 0 auto}
.game-skill-count{font-size:11px;color:#4a6956;margin:0}
.game-untrained{display:inline-block;font-size:11px;font-weight:500;color:#576f5d}
@media(max-width:520px){.game-roll-list #game-skill-search{min-height:38px}.game-skill-choices{height:255px}.game-skill-item{min-height:34px;font-size:12px}}
.game-skill-item[hidden]{display:none!important}

/* 0.3.70 — Game sidebar consolidation and compact participant identities. */
.game-room-grid>.table-people .table-room-header{margin:0 0 5px;padding:0 0 7px;border-bottom:1px solid #becfc3;gap:5px}
.game-room-grid>.table-people .table-room-actions{display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.game-room-grid>.table-people .game-room-dice-tools{display:flex;align-items:center;flex-wrap:wrap;gap:4px;padding:6px 0 0;border-top:1px solid #bbd0c3}
.game-room-grid>.table-people .game-room-dice-tools .btn{padding:5px 7px;font-weight:800;font-size:10px;min-height:30px}
.game-room-grid>.table-people .game-room-gm-toggle{display:inline-flex;align-items:center;justify-content:space-between;gap:6px;white-space:nowrap;padding:5px 6px;border:1px solid #458d68;border-radius:4px;background:#165238;color:#f6fff6;font-weight:800;font-size:11px;min-height:30px;cursor:pointer}
.game-room-grid>.table-people .game-room-gm-toggle input{width:17px;height:17px;margin:0;accent-color:#62da90}
.game-room-grid>.table-people .game-headshot-picker{border-top:0;margin:5px 0;padding:2px 0;gap:3px}
.game-room-grid>.table-people .table-name-edit{margin:5px 0 9px;display:flex;gap:3px}
.game-room-grid>.table-people .table-name-edit .btn{font-size:10px;white-space:nowrap;flex:none;padding:4px 6px}
.game-room-grid>.table-people .table-people-list{gap:5px;max-height:clamp(180px,32dvh,360px)}
.game-room-grid>.table-people .game-participants-title{display:flex;align-items:baseline;justify-content:flex-start;gap:7px;flex-wrap:wrap;margin:9px 0 5px}
.game-seat-count,.game-room-grid>.table-people #game-gamer-count{font-size:11px;font-weight:750;color:#2a7350}
.game-room-grid>.table-people .table-person{grid-template-columns:10px minmax(0,1fr)!important;row-gap:3px;padding:5px 6px}
.game-room-grid>.table-people .table-person-name{display:flex!important;flex-direction:row;align-items:center;line-height:1.15;gap:0}
.game-room-grid>.table-people .game-person-identity{display:flex;gap:6px;align-items:center;min-width:0}
.game-room-grid>.table-people .game-person-identity .game-avatar{flex:0 0 36px!important;width:36px;max-width:36px;min-width:36px;height:36px;margin:0}
.game-room-grid>.table-people .game-person-name-line{display:flex;gap:5px;flex-wrap:wrap;align-items:baseline;min-width:0}
.game-room-grid>.table-people .game-person-display-name{display:inline;font-size:12px;font-weight:850;flex:none;max-width:100%;overflow-wrap:break-word}
.game-room-grid>.table-people .game-person-role{font-size:10px;color:#35694e;font-weight:750;white-space:nowrap}
.game-room-grid>.table-people .table-moderation{gap:3px;flex-wrap:wrap;align-items:center}
.game-room-grid>.table-people .table-moderation>.btn{min-height:26px;flex:1 1 30%;font-size:10px;padding:4px 3px}
.game-room-grid>.table-people .table-moderation>[data-table-mod="promote"],
.game-room-grid>.table-people .table-moderation>[data-table-mod="demote"]{flex:1 1 40%;font-size:10px}
/* Keep the dot and its accessible title as the only online/offline indicator. */
.game-room-grid>.table-people .table-person-presence{display:none!important}

/* Chat images are displayed as real raster or animated GIFs. Never use SVG/HTML. */
.game-room-grid .table-image img:not([hidden]){display:block;width:auto;max-width:100%;max-height:clamp(180px,50vh,540px);height:auto;object-fit:contain;object-position:left top;border:1px solid #427554;border-radius:4px;background:#0a1a13;margin:7px 0 2px}
.game-room-grid .table-image p{font-size:11px;color:#1f4b33}
/* F outcomes become dark red; only S outcomes continue using the green style. */
.game-room-grid .table-dice.game-roll-failure{background:#f9ebee;border:1px solid #8f263e}
.game-room-grid .table-dice.game-roll-failure .table-dice-total{background:#66182b;border-radius:4px;color:#fff9fa;padding:9px 10px;margin:6px 0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.game-room-grid .table-dice.game-roll-failure .table-equation{background:#f1d7df;color:#63142b}
.game-room-grid .table-dice.game-roll-failure .table-math-rows>div{border-bottom-color:#dcb7c1}
.game-room-grid .table-dice .game-chat-explode{margin-left:5px;min-height:27px;background:#fff5de;color:#622b0c;border:1px solid #98652a;white-space:nowrap}
.game-room-grid .table-dice.game-roll-failure .game-chat-explode{background:#fff1e8;color:#4d1927}
@media(max-width:900px){
 .game-room-grid>.table-people .game-room-dice-tools{flex-wrap:wrap}
 .game-room-grid>.table-people .game-room-dice-tools .btn{min-height:35px}
 .game-room-grid>.table-people .table-person{grid-template-columns:12px minmax(0,1fr)!important}
}

/* 0.3.70 — compact left column. Destructive room actions on the left,
   invitation/code tools directly beside them on the right. This removes
   the separate full-width invitation row and frees vertical space. */
.game-room-grid>.table-people .game-room-command-line{
 display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);
 gap:5px;align-items:start;width:100%;min-width:0;
}
.game-room-grid>.table-people .game-room-command-line>.table-room-actions{
 width:auto!important;min-width:0;display:grid!important;
 grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;
 align-content:start;align-items:stretch;
}
.game-room-grid>.table-people .game-room-command-line>.table-room-actions .btn{
 width:100%;max-width:100%;min-width:0;min-height:28px;
 white-space:normal;overflow-wrap:normal;line-height:1.05;
 padding:5px 2px;font-size:9.5px;
}
.game-room-grid>.table-people .game-room-command-line #table-delete{
 grid-column:span 2;
}
.game-room-grid>.table-people .game-room-invite{
 min-width:0;max-width:100%;display:grid;align-content:start;gap:4px;
 padding:4px;border:1px solid #bed2c4;border-radius:4px;background:#e7f2eb;
}
.game-room-grid>.table-people .game-room-invite .table-code{
 display:block;min-width:0;max-width:100%;font-size:10px;line-height:1.25;
 color:#16472e;overflow-wrap:anywhere;word-break:normal;
}
.game-room-grid>.table-people .game-room-invite .table-code strong{
 font-size:10px;white-space:normal;overflow-wrap:anywhere;
}
.game-room-grid>.table-people .game-room-invite-buttons{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;
}
.game-room-grid>.table-people .game-room-invite-buttons>.btn{
 width:100%;min-width:0;min-height:29px;padding:4px 2px;
 font-size:9px;white-space:normal;line-height:1.1;
}
.game-room-grid>.table-people .table-room-header{
 padding-bottom:5px;margin-bottom:3px;gap:4px;
}
.game-room-grid>.table-people .game-room-dice-tools{
 padding-top:4px;
}
@media(max-width:370px){
 .game-room-grid>.table-people .game-room-command-line{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px}
 .game-room-grid>.table-people .game-room-command-line>.table-room-actions .btn{font-size:9px}
}

/* Independent Dice tab, no Game media panel is mounted. */
.dice-only-frame{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr) auto!important}
.dice-only-frame .game-dice-dock{grid-column:1;grid-row:1;min-width:0;min-height:0;overflow:hidden}
.dice-only-frame .game-bottom-tabs{grid-column:1;grid-row:2}
#tray-dice-slot,#tray-dice-host{width:100%;height:100%;min-width:0;min-height:0}
@media(max-width:760px){.dice-only-frame .game-dice-dock{min-height:0;overflow:auto}}

/* 0.3.84: reserve room for the critical/fumble row in the Game dice dock. */
.game-frame{--game-dice-dock-height:152px}
.game-frame:not(.dice-only-frame):not(.game-needs-login){grid-template-rows:var(--game-dice-dock-height) minmax(0,1fr) 44px}
@media(max-width:800px){
 .game-frame{--game-dice-dock-height:216px}
}

/* 0.3.96 — readable recorder and consolidated history commands. */
.game-room-command-line .table-room-actions #game-open-recorder{grid-column:1 / -1;flex:1 1 100%;min-width:0;width:100%;white-space:normal;min-height:34px}
#game-room-dice-history{white-space:normal;line-height:1.2;min-height:34px}