:root{
 --ep-accent:var(--bp-main-accent,var(--bp-home-accent,var(--bp-site-accent,#1769e0)));
 --ep-accent2:var(--bp-main-accent2,var(--bp-home-accent-2,var(--bp-site-accent-2,#4388eb)));
 --ep-deep:var(--bp-main-deep,var(--bp-home-accent-deep,var(--bp-site-deep,#0d52bc)));
 --ep-soft:var(--bp-main-soft,var(--bp-home-accent-soft,var(--bp-site-soft,#edf5ff)));
 --ep-bg:#f4f7fb;--ep-card:#fff;--ep-ink:#172235;--ep-muted:#68788c;--ep-line:#dbe5f0;
}
html.bp-dark,body.bp-dark,html[data-theme="dark"],body.dark-mode{
 --ep-bg:#0d1722;--ep-card:#142233;--ep-ink:#edf5fc;--ep-muted:#a5b5c5;--ep-line:#2a4055;--ep-soft:#14293d;
}
.ep-theme-root{width:min(calc(100% - 32px),1360px);margin:0 auto;color:var(--ep-ink);box-sizing:border-box}
.ep-theme-root *{box-sizing:border-box}.ep-theme-root a{text-decoration:none}
.ep-hero{margin:20px 0 18px;padding:28px 32px;border-radius:22px;background:radial-gradient(circle at 92% 20%,rgba(255,255,255,.16),transparent 28%),linear-gradient(120deg,var(--ep-deep),var(--ep-accent) 68%,var(--ep-accent2));color:#fff;display:flex;align-items:center;justify-content:space-between;gap:22px;box-shadow:0 15px 38px rgba(15,60,110,.16)}
.ep-kicker{display:block;font-size:11px;letter-spacing:.18em;font-weight:900;opacity:.82;margin-bottom:6px}.ep-hero h1{margin:0;font-size:32px;line-height:1.15}.ep-hero p{margin:8px 0 0;opacity:.9;font-size:14px}.ep-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}
.ep-btn{height:42px;border-radius:11px;border:1px solid var(--ep-line);padding:0 15px;background:var(--ep-card);color:var(--ep-ink);font-size:14px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;white-space:nowrap}
.ep-btn:hover{transform:translateY(-1px)}.ep-btn-primary{background:var(--ep-accent);border-color:var(--ep-accent);color:#fff}.ep-hero .ep-btn{border-color:rgba(255,255,255,.25)}.ep-hero .ep-btn:not(.ep-btn-primary){background:rgba(255,255,255,.12);color:#fff}.ep-hero .ep-btn-primary{background:#fff;color:var(--ep-deep);border-color:#fff}
.ep-content-ad{width:100%;margin:16px auto 20px}.ep-content-ad__label{text-align:center;font-size:9px;letter-spacing:.17em;font-weight:800;color:#8a9bad;margin-bottom:6px}.ep-content-ad__slot{min-height:90px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.bp-side-ad{position:fixed;top:190px;width:160px;z-index:10}.bp-side-ad--left{left:max(6px,calc(50% - 860px))}.bp-side-ad--right{right:max(6px,calc(50% - 860px))}
@media(max-width:1720px){.bp-side-ad{display:none!important}}
.ep-panel{background:var(--ep-card);border:1px solid var(--ep-line);border-radius:18px;box-shadow:0 10px 30px rgba(18,63,118,.08)}
.ep-section{padding:22px}.ep-section-head{display:flex;justify-content:space-between;gap:18px;align-items:end;margin-bottom:16px}.ep-section-head h2{margin:0;font-size:23px}.ep-section-head p{margin:6px 0 0;color:var(--ep-muted);font-size:13px}
.ep-room-tools{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;margin-bottom:16px}.ep-room-tools input{height:43px;border:1px solid var(--ep-line);border-radius:11px;background:var(--ep-card);color:var(--ep-ink);padding:0 13px;font-size:14px}
.ep-room-list{display:grid;gap:10px}.ep-room-row{display:grid;grid-template-columns:94px minmax(0,1fr) 190px 190px;gap:15px;align-items:center;padding:16px;border:1px solid var(--ep-line);border-radius:15px;background:color-mix(in srgb,var(--ep-card) 96%,var(--ep-soft))}
.ep-status{height:31px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;background:color-mix(in srgb,var(--ep-accent) 10%,var(--ep-card));color:var(--ep-accent)}.ep-status.playing{background:#fff1dc;color:#be6c00}.ep-room-main h3{margin:0 0 5px;font-size:17px}.ep-room-main p{margin:0;color:var(--ep-muted);font-size:13px}.ep-room-main small{display:block;margin-top:6px;color:var(--ep-muted)}.ep-room-people b{font-size:15px}.ep-room-people span{display:block;color:var(--ep-muted);font-size:12px;margin-top:5px}.ep-room-enter{display:flex;gap:7px;justify-content:flex-end;flex-wrap:wrap}.ep-room-enter .ep-btn{height:36px;font-size:12px;padding:0 11px}
.ep-empty{padding:54px;text-align:center;color:var(--ep-muted)}
.ep-modal{position:fixed;inset:0;background:rgba(5,10,16,.58);z-index:9999;display:none;align-items:center;justify-content:center;padding:18px}.ep-modal.open{display:flex}.ep-dialog{width:min(520px,100%);background:var(--ep-card);color:var(--ep-ink);border:1px solid var(--ep-line);border-radius:20px;padding:23px;box-shadow:0 30px 80px rgba(0,0,0,.35)}.ep-dialog h2{margin:0 0 16px}.ep-field{display:grid;gap:6px;margin:12px 0}.ep-field label{font-size:13px;color:var(--ep-muted);font-weight:700}.ep-field input,.ep-field select,.ep-field textarea{width:100%;border:1px solid var(--ep-line);border-radius:11px;background:var(--ep-card);color:var(--ep-ink);padding:11px 12px}.ep-field textarea{resize:vertical;min-height:80px}.ep-dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.ep-wait-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px}.ep-player-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.ep-player-card{padding:16px;border-radius:14px;border:1px solid var(--ep-line);background:var(--ep-card)}.ep-player-card b{display:block}.ep-player-card span{display:block;color:var(--ep-muted);font-size:12px;margin-top:5px}.ep-ready{color:#15945d!important;font-weight:800}.ep-chat-placeholder{min-height:340px;padding:18px}
.ep-game-stage{position:relative;height:min(720px,calc(100vh - 280px));min-height:560px;border-radius:18px;overflow:hidden;background:#080b10;border:1px solid var(--ep-line)}
#game{position:absolute;inset:0;width:100%;height:100%;display:block}
.ep-game-hud{position:absolute;top:14px;left:14px;right:14px;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 14px;border-radius:13px;background:rgba(7,13,20,.66);backdrop-filter:blur(10px);color:#fff;border:1px solid rgba(255,255,255,.1)}.ep-game-hud b{color:#f1c86f}.ep-game-hud small{opacity:.7}.ep-avatar-screen{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%);width:min(850px,92%);padding:24px;border-radius:20px;background:rgba(13,21,30,.92);backdrop-filter:blur(16px);color:#fff;border:1px solid rgba(255,255,255,.14)}.ep-avatar-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-top:16px}.ep-avatar{padding:12px;border-radius:13px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;cursor:pointer}.ep-avatar.active{border-color:#f0c96e;background:rgba(240,201,110,.12)}.ep-avatar b,.ep-avatar small{display:block}.ep-avatar small{opacity:.62;margin-top:4px}.ep-start-row{display:flex;gap:9px;justify-content:flex-end;margin-top:18px}.ep-hidden{display:none!important}
.ep-guide{padding:24px}.ep-guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.ep-guide-card{padding:19px;border:1px solid var(--ep-line);border-radius:16px;background:var(--ep-card)}.ep-guide-card b{display:block;margin-bottom:7px}.ep-guide p,.ep-guide li{color:var(--ep-muted);line-height:1.75}.ep-guide h2{margin-top:26px}
@media(max-width:900px){.ep-room-row{grid-template-columns:78px minmax(0,1fr) 130px}.ep-room-enter{grid-column:2/4;justify-content:flex-start}.ep-wait-grid{grid-template-columns:1fr}.ep-player-list{grid-template-columns:repeat(2,1fr)}.ep-guide-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.ep-theme-root{width:min(calc(100% - 20px),1360px)}.ep-hero{padding:23px 20px;align-items:flex-start;flex-direction:column}.ep-actions{justify-content:flex-start}.ep-room-tools{grid-template-columns:1fr 1fr}.ep-room-tools input{grid-column:1/3}.ep-room-row{grid-template-columns:72px 1fr}.ep-room-people{grid-column:2}.ep-room-enter{grid-column:2}.ep-player-list,.ep-guide-grid{grid-template-columns:1fr}.ep-avatar-grid{grid-template-columns:repeat(3,1fr)}}

/* v06: 공개/회원초대 및 방장 관리 UI */
.ep-access-badge{display:inline-flex;vertical-align:middle;margin-left:7px;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:900;color:var(--ep-accent);background:color-mix(in srgb,var(--ep-accent) 11%,var(--ep-card));border:1px solid color-mix(in srgb,var(--ep-accent) 20%,var(--ep-line))}
.ep-room-enter{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.ep-btn-danger{background:#b64040!important;border-color:#b64040!important;color:#fff!important}
.ep-choice-row{display:flex;gap:18px;flex-wrap:wrap;padding:10px 0}
.ep-choice-row label{display:flex;align-items:center;gap:7px;font-weight:800;color:var(--ep-ink)}
.ep-choice-row input{width:auto!important;height:auto!important}
.ep-field small{font-size:11px;color:var(--ep-muted);font-weight:500}
.ep-room-row{grid-template-columns:94px minmax(0,1fr) 145px 330px}
@media(max-width:1120px){.ep-room-row{grid-template-columns:80px minmax(0,1fr) 120px}.ep-room-enter{grid-column:2 / -1;justify-content:flex-start}}


/* =========================================================
   BiblePang theme + complete dark mode foundation
   Future Escape pages should use .ep-theme-root and this CSS.
   ========================================================= */
.ep-theme-root{
 --ep-accent:var(--bp-main-accent,var(--bp-home-accent,var(--bp-site-accent,#1769e0)));
 --ep-accent2:var(--bp-main-accent2,var(--bp-home-accent-2,var(--bp-site-accent-2,#4388eb)));
 --ep-deep:var(--bp-main-deep,var(--bp-home-accent-deep,var(--bp-site-deep,#0d52bc)));
 --ep-soft:var(--bp-main-soft,var(--bp-home-accent-soft,var(--bp-site-soft,#edf5ff)));
 background:linear-gradient(180deg,color-mix(in srgb,var(--ep-soft) 42%,#fff),#fff 44%);
}
.ep-btn-primary{background:linear-gradient(135deg,var(--ep-deep),var(--ep-accent))!important;border-color:var(--ep-accent)!important}
.ep-status,.ep-access-badge{color:var(--ep-accent)!important;border-color:color-mix(in srgb,var(--ep-accent) 25%,var(--ep-line))!important}
.ep-hero{background:radial-gradient(circle at 92% 20%,rgba(255,255,255,.16),transparent 28%),linear-gradient(120deg,var(--ep-deep),var(--ep-accent) 68%,var(--ep-accent2))!important}

/* complete dark surfaces */
html.bp-dark .ep-theme-root,body.bp-dark .ep-theme-root,html[data-theme="dark"] .ep-theme-root,body.dark-mode .ep-theme-root,body.theme-dark .ep-theme-root{
 --ep-bg:#0d1722;--ep-card:#142233;--ep-ink:#edf5fc;--ep-muted:#a5b5c5;--ep-line:#2a4055;
 background:#0b1623!important;color:#edf5fc!important;
}
html.bp-dark :is(.ep-panel,.ep-room-row,.ep-dialog,.ep-player-card,.ep-chat-placeholder,.ep-guide-card,.ep-avatar-screen),
body.bp-dark :is(.ep-panel,.ep-room-row,.ep-dialog,.ep-player-card,.ep-chat-placeholder,.ep-guide-card,.ep-avatar-screen),
html[data-theme="dark"] :is(.ep-panel,.ep-room-row,.ep-dialog,.ep-player-card,.ep-chat-placeholder,.ep-guide-card,.ep-avatar-screen){
 background:#142233!important;color:#edf5fc!important;border-color:#2a4055!important;box-shadow:0 10px 30px rgba(0,0,0,.2)!important;
}
html.bp-dark :is(.ep-field input,.ep-field select,.ep-field textarea,.ep-room-tools input,.ep-theme-root input,.ep-theme-root textarea,.ep-theme-root select),
body.bp-dark :is(.ep-field input,.ep-field select,.ep-field textarea,.ep-room-tools input,.ep-theme-root input,.ep-theme-root textarea,.ep-theme-root select),
html[data-theme="dark"] :is(.ep-field input,.ep-field select,.ep-field textarea,.ep-room-tools input,.ep-theme-root input,.ep-theme-root textarea,.ep-theme-root select){
 background:#0f1c2a!important;color:#eef6fd!important;border-color:#30485f!important;
}
html.bp-dark .ep-btn:not(.ep-btn-primary):not(.ep-btn-danger),
body.bp-dark .ep-btn:not(.ep-btn-primary):not(.ep-btn-danger),
html[data-theme="dark"] .ep-btn:not(.ep-btn-primary):not(.ep-btn-danger){
 background:#1b2c40!important;color:#e9f2fb!important;border-color:#334b63!important;
}
html.bp-dark :is(.ep-room-main p,.ep-room-main small,.ep-field label,.ep-field small,.ep-guide p,.ep-guide li,.ep-player-card span),
body.bp-dark :is(.ep-room-main p,.ep-room-main small,.ep-field label,.ep-field small,.ep-guide p,.ep-guide li,.ep-player-card span),
html[data-theme="dark"] :is(.ep-room-main p,.ep-room-main small,.ep-field label,.ep-field small,.ep-guide p,.ep-guide li,.ep-player-card span){color:#a5b5c5!important}

/* images and visual assets */
html.bp-dark .ep-theme-root img,body.bp-dark .ep-theme-root img,html[data-theme="dark"] .ep-theme-root img{
 filter:brightness(.72) saturate(.86) contrast(1.03);
}
html.bp-dark .ep-game-stage,body.bp-dark .ep-game-stage,html[data-theme="dark"] .ep-game-stage{filter:brightness(.88) saturate(.9)}

/* ads, including Google iframe */
html.bp-dark :is(.bp-side-ad,.ep-content-ad,.ep-content-ad__slot),
body.bp-dark :is(.bp-side-ad,.ep-content-ad,.ep-content-ad__slot),
html[data-theme="dark"] :is(.bp-side-ad,.ep-content-ad,.ep-content-ad__slot){
 background:#0c1724!important;color:#93a8bc!important;border-color:#294159!important;
}
html.bp-dark :is(.bp-side-ad,.ep-content-ad) iframe,
body.bp-dark :is(.bp-side-ad,.ep-content-ad) iframe,
html[data-theme="dark"] :is(.bp-side-ad,.ep-content-ad) iframe{filter:brightness(.76) saturate(.82)!important}
html.bp-dark .ep-content-ad__label,body.bp-dark .ep-content-ad__label,html[data-theme="dark"] .ep-content-ad__label{color:#71879e!important}

/* Stage 1 Adventure Engine */
.ep-avatar-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important}
.ep-avatar{min-height:150px!important;padding:10px 7px!important;overflow:hidden}
.ep-avatar-portrait{display:block;width:58px;height:74px;margin:0 auto 7px;border-radius:28px 28px 16px 16px;border:1px solid rgba(255,203,100,.28);background:
 radial-gradient(circle at 50% 26%,#c78a62 0 16%,transparent 17%),
 linear-gradient(145deg,#3a2a20,#131a21 58%,#0b1016);position:relative}
.ep-avatar-portrait:after{content:"";position:absolute;left:13px;right:13px;top:42px;bottom:6px;border-radius:12px 12px 6px 6px;background:var(--ep-accent)}
.ep-avatar-esther:after{background:#315f91}.ep-avatar-samson:after{background:#795638}.ep-avatar-moses:after{background:#7e3529}.ep-avatar-joseph:after{background:#355f43}.ep-avatar-ruth:after{background:#7b3c37}
.ep-stage-side{position:absolute;right:16px;top:72px;z-index:4;width:250px;pointer-events:none}
.ep-stage-card{background:rgba(7,12,18,.80);backdrop-filter:blur(10px);border:1px solid rgba(226,184,98,.26);border-radius:14px;padding:14px;color:#f6ead5;box-shadow:0 12px 30px rgba(0,0,0,.28)}
.ep-stage-card h3{margin:5px 0 7px;font-size:17px}.ep-stage-card p{margin:0;color:#c6bda9;font-size:12px;line-height:1.6}
.ep-mission-progress{display:grid;gap:6px;margin-top:12px;font-size:12px}.ep-mission-progress span{color:#d6cdbb}.ep-mission-progress span.done{color:#9bd487}
.ep-action-hint{position:absolute;left:50%;bottom:116px;transform:translateX(-50%);z-index:6;min-width:160px;text-align:center;color:#fff;font-weight:800;font-size:13px;text-shadow:0 2px 7px #000}
.ep-game-notice{position:absolute;left:50%;top:105px;transform:translate(-50%,-8px);z-index:7;padding:10px 16px;border-radius:999px;background:rgba(8,12,17,.88);border:1px solid rgba(225,185,99,.4);color:#f4dfb4;font-weight:800;opacity:0;transition:.2s;pointer-events:none}.ep-game-notice.show{opacity:1;transform:translate(-50%,0)}
.ep-hotbar{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:5;display:flex;gap:6px;padding:7px;border-radius:14px;background:rgba(7,12,18,.76);border:1px solid rgba(226,184,98,.26);backdrop-filter:blur(10px)}
.ep-hot-slot{width:74px;height:56px;border:1px solid rgba(255,255,255,.12);border-radius:9px;background:rgba(255,255,255,.035);color:#eee;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer}
.ep-hot-slot b{font-size:10px;opacity:.55}.ep-hot-slot span{font-size:10px}.ep-hot-slot.active{border-color:#d8b65d;background:rgba(216,182,93,.12)}
.ep-key-help{position:absolute;left:14px;bottom:13px;z-index:4;width:180px;padding:10px 12px;border-radius:12px;background:rgba(7,12,18,.72);border:1px solid rgba(255,255,255,.10);backdrop-filter:blur(8px);color:#ddd;font-size:10px;display:grid;grid-template-columns:1fr;gap:3px;pointer-events:none}.ep-key-help b{font-size:11px;color:#e6c875;margin-bottom:3px}
@media(max-width:1100px){.ep-stage-side{display:none}.ep-key-help{display:none}.ep-hot-slot{width:58px}.ep-avatar-grid{grid-template-columns:repeat(3,1fr)!important}}

/* Stage 1 visual asset fix: real character art + prison artwork */
.ep-stage1-visual{
  background:
    linear-gradient(rgba(4,8,12,.18),rgba(4,8,12,.30)),
    url("./stages/stage1_prison.webp") center center/cover no-repeat #080b10 !important;
}
.ep-stage1-visual canvas{
  background:transparent!important;
}
.ep-avatar-screen{
  background:
    linear-gradient(90deg,rgba(7,12,18,.95) 0%,rgba(7,12,18,.80) 58%,rgba(7,12,18,.86) 100%),
    url("./stages/stage1_prison.webp") center/cover no-repeat !important;
}
.ep-avatar-grid .ep-avatar{
  min-height:245px!important;
  padding:8px 8px 12px!important;
  background:rgba(12,19,27,.84)!important;
  overflow:hidden;
}
.ep-avatar-grid .ep-avatar.active{
  border-color:#d6aa4d!important;
  box-shadow:inset 0 0 0 1px rgba(214,170,77,.28),0 0 24px rgba(214,170,77,.12);
}
.ep-avatar-portrait{
  display:block!important;
  width:100%!important;
  height:170px!important;
  margin:0 0 8px!important;
  border-radius:10px!important;
  overflow:hidden!important;
  border:1px solid rgba(221,180,93,.25)!important;
  background:#0c1118!important;
}
.ep-avatar-portrait img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
}
.ep-avatar-portrait:after{display:none!important}
.ep-avatar-grid .ep-avatar b{font-size:15px!important}
.ep-avatar-grid .ep-avatar small{font-size:11px!important;white-space:nowrap}

/* v12 square playfield + external information rail */
.ep-play-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:14px;align-items:start}
.ep-game-stage{aspect-ratio:1/1;height:auto!important;min-height:0!important;position:relative;overflow:hidden;border-radius:16px;background:#080b10;border:1px solid var(--ep-line);outline:none}
.ep-stage1-visual{background:url("./stages/stage1_prison_clean.webp") center/cover no-repeat #080b10!important}
.ep-stage1-visual canvas{position:absolute;inset:0;width:100%!important;height:100%!important;background:transparent!important}
.ep-game-info{display:grid;gap:10px}
.ep-info-card{background:var(--ep-card);border:1px solid var(--ep-line);border-radius:14px;padding:14px;box-shadow:0 8px 22px rgba(0,0,0,.06)}
.ep-info-card h3{margin:5px 0 7px;font-size:19px}.ep-info-card h4{margin:0 0 9px;font-size:14px}.ep-info-card p{margin:0;color:var(--ep-muted);font-size:12px;line-height:1.65}
.ep-info-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.ep-info-head h4{margin:0}
.ep-verse-card blockquote{margin:0;padding:10px 11px;border-radius:10px;background:color-mix(in srgb,var(--ep-accent) 7%,var(--ep-card));font-size:12px;line-height:1.7;color:var(--ep-ink)}
.ep-verse-card small{display:block;margin-top:7px;text-align:right;color:var(--ep-accent);font-weight:800}
.ep-chat-card{padding-bottom:10px}.ep-chat-log{height:170px;overflow-y:auto;margin:10px 0;padding:9px;border-radius:10px;background:color-mix(in srgb,var(--ep-deep) 8%,var(--ep-card));font-size:12px;line-height:1.65}.ep-chat-log .system{color:var(--ep-muted)}
.ep-chat-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.ep-chat-form input{height:39px;border:1px solid var(--ep-line);border-radius:9px;background:var(--ep-card);color:var(--ep-ink);padding:0 10px;min-width:0}
.ep-side-inventory{display:grid;grid-template-columns:repeat(6,1fr);gap:5px}.ep-side-inventory .ep-hot-slot{width:auto;height:50px;padding:2px}
.ep-controls-card{padding-bottom:12px}.ep-control-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px 9px;font-size:11px;color:var(--ep-muted)}.ep-control-grid span{display:flex;align-items:center;gap:7px}.ep-control-grid kbd{min-width:38px;text-align:center;padding:4px 6px;border-radius:6px;background:color-mix(in srgb,var(--ep-deep) 8%,var(--ep-card));border:1px solid var(--ep-line);color:var(--ep-ink);font:700 10px/1.2 inherit}
.ep-avatar-screen{position:absolute!important;inset:0!important;transform:none!important;width:auto!important;max-width:none!important;border-radius:0!important;background:rgba(7,12,18,.93)!important;overflow:auto;padding:18px!important}
.ep-avatar-screen h2{font-size:21px;margin:8px 0 14px}.ep-avatar-grid{grid-template-columns:repeat(3,1fr)!important;gap:8px!important}.ep-avatar-grid .ep-avatar{min-height:150px!important;padding:6px!important}.ep-avatar-portrait{height:95px!important}.ep-avatar-grid .ep-avatar b{font-size:13px!important}.ep-avatar-grid .ep-avatar small{font-size:10px!important}
.ep-action-hint{bottom:18px!important}
.ep-stage-side,.ep-key-help,.ep-hotbar{display:none!important}
@media(max-width:1080px){.ep-play-layout{grid-template-columns:1fr}.ep-game-info{grid-template-columns:repeat(2,minmax(0,1fr))}.ep-chat-card{grid-column:1/-1}}
@media(max-width:700px){.ep-game-info{grid-template-columns:1fr}.ep-control-grid{grid-template-columns:1fr 1fr}.ep-avatar-grid{grid-template-columns:repeat(2,1fr)!important}}

/* ===== STAGE 1 STABLE LAYOUT v20 ===== */
.ep-play-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 360px!important;
  gap:14px!important;
  align-items:start!important;
}
.ep-game-stage{
  position:relative!important;
  width:100%!important;
  aspect-ratio:1/1!important;
  height:auto!important;
  min-height:0!important;
  overflow:hidden!important;
  border-radius:16px!important;
  border:1px solid var(--ep-line)!important;
  background:#080b10!important;
}
.ep-stage1-visual{
  background-image:url("./stages/stage1_prison_clean.webp")!important;
  background-position:center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
}
.ep-stage1-visual canvas{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  background:transparent!important;
}
.ep-game-info{
  display:grid!important;
  gap:10px!important;
  align-content:start!important;
}
.ep-info-card{
  display:block!important;
  background:var(--ep-card)!important;
  border:1px solid var(--ep-line)!important;
  border-radius:14px!important;
  padding:14px!important;
}
.ep-chat-log{height:170px!important;overflow:auto!important}
.ep-side-inventory{display:grid!important;grid-template-columns:repeat(6,1fr)!important;gap:5px!important}
.ep-control-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px 9px!important}

/* avatar chooser compact and real artwork */
.ep-avatar-screen{
  position:absolute!important;
  left:14px!important;right:14px!important;top:14px!important;bottom:auto!important;
  width:auto!important;height:auto!important;max-height:calc(100% - 28px)!important;
  padding:14px!important;overflow:auto!important;
  border-radius:15px!important;background:rgba(7,12,18,.96)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  z-index:20!important;
}
.ep-avatar-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
.ep-avatar-grid .ep-avatar{height:202px!important;min-height:202px!important;padding:6px 6px 9px!important}
.ep-avatar-portrait{display:block!important;width:100%!important;height:145px!important;overflow:hidden!important;border-radius:10px!important;background:#0b1118!important}
.ep-avatar-portrait img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center top!important}
.ep-avatar-grid .ep-avatar b{display:block!important;font-size:13px!important}
.ep-avatar-grid .ep-avatar small{display:block!important;font-size:10px!important;margin-top:3px!important}
.ep-start-row{display:flex!important;justify-content:flex-end!important;margin-top:12px!important}

/* old in-canvas HUD must never return */
.ep-stage-side,.ep-key-help,.ep-hotbar{display:none!important}

@media(max-width:1080px){
 .ep-play-layout{grid-template-columns:1fr!important}
 .ep-game-info{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .ep-chat-card{grid-column:1/-1!important}
}
@media(max-width:700px){
 .ep-game-info{grid-template-columns:1fr!important}
 .ep-avatar-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* v30: clean rebuild */
.ep-stage1-visual{
  background:url("./stages/stage1_prison_v30.webp") center/cover no-repeat #070b10!important;
}
.ep-stage1-visual canvas{background:transparent!important}
.ep-avatar-screen{
  background:#081019!important;
  box-shadow:0 18px 60px rgba(0,0,0,.55)!important;
  overflow:auto!important;
}
.ep-avatar-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.ep-avatar-grid .ep-avatar{height:180px!important;min-height:180px!important;background:#0d1620!important}
.ep-avatar-portrait{height:125px!important;background:#071018!important}
.ep-avatar-portrait img{object-fit:contain!important;object-position:center bottom!important}

/* v31 standalone DOM engine */
.ep-world,.ep-world-items,.ep-players-layer{position:absolute;inset:0;pointer-events:none}
.ep-world-items{z-index:2}.ep-players-layer{z-index:4}
.ep-dom-player{position:absolute;width:8.5%;height:14%;transform:translate(-50%,-100%) translateY(var(--jump-y,0));transform-origin:50% 100%;pointer-events:none;transition:none}
.ep-dom-player img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 4px 4px rgba(0,0,0,.48))}
.ep-player-name{position:absolute;left:50%;bottom:100%;transform:translateX(-50%);white-space:nowrap;padding:2px 6px;border-radius:999px;background:rgba(5,10,15,.72);color:#fff;font-size:10px;font-weight:800;text-shadow:0 1px 2px #000}
.ep-world-item{position:absolute;z-index:3;width:34px;height:34px;border:1px solid rgba(246,198,89,.58);border-radius:50%;background:rgba(7,12,18,.72);display:grid;place-items:center;font-size:18px;pointer-events:none;box-shadow:0 0 14px rgba(240,184,65,.25)}
.ep-world-item.collected{display:none!important}
.ep-item-key{left:24%;top:34%}.ep-item-scroll{left:71%;top:38%}.ep-item-pin{left:66%;top:73%}.ep-item-rope{left:23%;top:71%}
.ep-avatar-screen{left:16px!important;right:16px!important;top:16px!important;bottom:16px!important;width:auto!important;height:auto!important;max-height:none!important;background:#071019!important;overflow:auto!important}
.ep-avatar-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.ep-stage-side,.ep-key-help,.ep-hotbar,.ep-game-hud{display:none!important}

/* v32: character-only animation frames; labels never mirrored */
.ep-dom-player{z-index:6!important;overflow:visible!important}
.ep-dom-player>img{position:absolute;left:0;bottom:0;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;transform-origin:center bottom!important}
.ep-player-name{z-index:8!important;transform:translateX(-50%)!important}

/* v36 approved David: larger display, body-only mirroring */
.ep-dom-player{width:11%!important;height:18%!important}
.ep-dom-player>img{transform-origin:center bottom!important}
.ep-player-name{transform:translateX(-50%)!important}

/* v37: run fix, label position, articulated motion accents */
.ep-player-name{bottom:calc(100% - 15px)!important}

/* Frame sequences already change arm/leg poses. These transforms add body mechanics:
   stride lean, vertical hip motion, landing compression and attack follow-through. */
.ep-dom-player.is-walk>img{animation:epWalkBody .48s steps(2,end) infinite}
.ep-dom-player.is-run>img{animation:epRunBody .30s steps(2,end) infinite}
.ep-dom-player.is-throw>img{animation:epThrow .48s ease-in-out 1}
.ep-dom-player.is-sword>img{animation:epSword .42s ease-in-out 1}
.ep-dom-player.is-spear>img{animation:epSpear .46s ease-in-out 1}
@keyframes epWalkBody{
  0%{translate:0 0;rotate:-1.2deg}
  25%{translate:0 -2px;rotate:1.4deg}
  50%{translate:0 0;rotate:-1deg}
  75%{translate:0 -2px;rotate:1.2deg}
  100%{translate:0 0;rotate:-1.2deg}
}
@keyframes epRunBody{
  0%{translate:-1px 1px;rotate:-4deg}
  25%{translate:1px -4px;rotate:2deg}
  50%{translate:2px 0;rotate:-3deg}
  75%{translate:0 -4px;rotate:2deg}
  100%{translate:-1px 1px;rotate:-4deg}
}
@keyframes epThrow{
  0%{translate:0 0;rotate:0deg}
  28%{translate:-4px 1px;rotate:-8deg}
  58%{translate:5px -2px;rotate:11deg}
  100%{translate:0 0;rotate:0deg}
}
@keyframes epSword{
  0%{translate:-2px 0;rotate:-8deg}
  45%{translate:5px -2px;rotate:13deg}
  75%{translate:7px 0;rotate:6deg}
  100%{translate:0 0;rotate:0deg}
}
@keyframes epSpear{
  0%{translate:-4px 0;scale:.98 1}
  45%{translate:9px -1px;scale:1.04 .98}
  75%{translate:6px 0;scale:1.02 1}
  100%{translate:0 0;scale:1 1}
}

/* v58 sling projectile */
.ep-sling-stone{
  position:absolute;
  z-index:15;
  width:10px;
  height:10px;
  margin:-5px 0 0 -5px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#c1bbb2 0 18%,#817970 38%,#4a4540 70%,#262320 100%);
  box-shadow:0 2px 4px rgba(0,0,0,.65);
  pointer-events:none;
  transition:transform .25s linear,opacity .16s ease;
  will-change:transform,opacity;
}

.ep-item-sling{left:30%;top:76%}

.ep-item-sword{left:72%;top:55%}

/* ===== v74 3D David + prison demo merge ===== */
.ep-game-stage.ep-stage1-visual{
  /* The prison artwork is now a dedicated lowest DOM layer. */
  background:#070b10!important;
  aspect-ratio:1/1!important;
}
.ep-world{position:absolute!important;inset:0!important;overflow:hidden!important;z-index:1!important}
.ep-prison-bg-layer{
  position:absolute!important;inset:0!important;z-index:0!important;
  width:100%!important;height:100%!important;object-fit:fill!important;
  display:block!important;pointer-events:none!important;user-select:none!important;
}
.ep-fx-canvas{
  position:absolute!important;inset:0!important;z-index:1!important;
  width:100%!important;height:100%!important;background:transparent!important;
  pointer-events:none!important;
}
.ep-world-items{z-index:2!important}
.ep-character3d-canvas{
  position:absolute!important;inset:0!important;z-index:4!important;
  width:100%!important;height:100%!important;background:transparent!important;
  pointer-events:none!important;
}
.ep-players-layer{z-index:5!important}
/* The local David DOM image is replaced by the 3D renderer. Keep its label only. */
.ep-dom-player.is-local-3d-david>img{display:none!important}
.ep-dom-player.is-local-3d-david{
  width:1px!important;height:1px!important;overflow:visible!important;
}

/* superseded by the per-character 3D name anchor below */
.ep-avatar-screen{z-index:30!important}
.ep-action-hint,.ep-game-notice{z-index:40!important}


/* v82: 3D David/Moses share the same board layer; DOM player keeps the name tag only. */
.ep-dom-player.is-3d-avatar>img{display:none!important}
.ep-dom-player.is-3d-avatar{
  width:1px!important;height:1px!important;overflow:visible!important;
}
/* superseded by the per-character 3D name anchor below */
.ep-avatar-grid-watch{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  justify-content:stretch!important;
}

/* v82.1: nine character choices in a fixed 3 x 3 board-style grid. */
.ep-avatar-screen .ep-avatar-grid,
.ep-avatar-screen .ep-avatar-grid-watch{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-auto-rows:auto!important;
  gap:8px!important;
}
@media(max-width:700px){
  .ep-avatar-screen .ep-avatar-grid,
  .ep-avatar-screen .ep-avatar-grid-watch{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}


/* v86.2: player name is anchored about 15px above each visible character.
   --ep-avatar-visual-height is the on-screen character height, not a global label height.
   Add each future 3D character here when its model is introduced. */
.ep-dom-player{
  --ep-avatar-visual-height:100%;
}
.ep-dom-player.is-3d-avatar{
  --ep-name-gap:15px;
}
.ep-dom-player.is-3d-david{
  --ep-avatar-visual-height:152px;
}
.ep-dom-player.is-3d-moses{
  --ep-avatar-visual-height:221px;
}
.ep-dom-player.is-3d-avatar .ep-player-name{
  top:auto!important;
  bottom:calc(var(--ep-avatar-visual-height) + var(--ep-name-gap))!important;
  left:50%!important;
  transform:translateX(-50%)!important;
}


/* v87: new 9-character full-body chibi chooser artwork. */
.ep-avatar-grid .ep-avatar{
  overflow:hidden!important;
}
.ep-avatar-grid .ep-avatar .ep-avatar-portrait{
  background:#171b20!important;
}
.ep-avatar-grid .ep-avatar .ep-avatar-portrait img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
}

/* v87: non-3D chibi characters receive a floor shadow and warm fire response.
   David/Moses keep the existing Three.js light + real-time shadow path. */
.ep-dom-player.is-chibi-avatar{
  isolation:isolate;
  --ep-shadow-x:5px;
  --ep-shadow-y:10px;
  --ep-shadow-rot:0deg;
  --ep-shadow-scale:1.15;
  --ep-shadow-opacity:.38;
  --ep-fire-bright:1;
  --ep-fire-warm:1;
}
.ep-dom-player.is-chibi-avatar::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:50%;
  bottom:1px;
  width:70%;
  height:17%;
  border-radius:50%;
  background:radial-gradient(ellipse at center,
    rgba(0,0,0,var(--ep-shadow-opacity)) 0%,
    rgba(0,0,0,calc(var(--ep-shadow-opacity) * .72)) 42%,
    rgba(0,0,0,0) 76%);
  transform:
    translate(calc(-50% + var(--ep-shadow-x)),var(--ep-shadow-y))
    rotate(var(--ep-shadow-rot))
    scaleX(var(--ep-shadow-scale));
  transform-origin:center;
  filter:blur(3px);
  pointer-events:none;
}
.ep-dom-player.is-chibi-avatar>img{
  filter:
    brightness(var(--ep-fire-bright))
    saturate(var(--ep-fire-warm))
    drop-shadow(0 3px 3px rgba(0,0,0,.34))!important;
}


/* v88: character chooser fills the whole selection panel vertically.
   The 3 x 3 cards share all remaining height equally, so there is no large empty area below. */
.ep-avatar-screen{
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}
.ep-avatar-screen>span.ep-kicker,
.ep-avatar-screen>h2{
  flex:0 0 auto!important;
}
.ep-avatar-screen .ep-avatar-grid,
.ep-avatar-screen .ep-avatar-grid-watch{
  flex:1 1 auto!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-template-rows:repeat(3,minmax(0,1fr))!important;
  grid-auto-rows:minmax(0,1fr)!important;
  align-content:stretch!important;
  gap:8px!important;
}
.ep-avatar-screen .ep-avatar-grid .ep-avatar{
  height:auto!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  padding:6px 6px 7px!important;
}
.ep-avatar-screen .ep-avatar-grid .ep-avatar .ep-avatar-portrait{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.ep-avatar-screen .ep-avatar-grid .ep-avatar .ep-avatar-portrait img{
  max-width:100%!important;
  max-height:100%!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
}
.ep-avatar-screen .ep-avatar-grid .ep-avatar b,
.ep-avatar-screen .ep-avatar-grid .ep-avatar small{
  flex:0 0 auto!important;
}
.ep-avatar-screen .ep-start-row{
  flex:0 0 auto!important;
  margin-top:8px!important;
}


/* v89: allow the Game Start / Game Join button to close the character chooser.
   This must come after the v88 flex layout rule. */
.ep-avatar-screen.ep-hidden{
  display:none!important;
}

/* v90: clearer inventory + David action shortcut cards. Uses only site theme variables and keeps dark-mode inheritance. */
.ep-loadout-card,.ep-controls-card-v2{
  border-color:color-mix(in srgb,var(--ep-accent) 30%,var(--ep-line))!important;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--ep-accent) 5%,var(--ep-card)),var(--ep-card) 38%)!important;
  box-shadow:0 10px 28px color-mix(in srgb,var(--ep-deep) 12%,transparent)!important;
}
.ep-loadout-head,.ep-controls-head{align-items:flex-start!important;margin-bottom:10px}
.ep-card-eyebrow{display:block;margin-bottom:2px;font-size:8px;font-weight:900;letter-spacing:.13em;color:var(--ep-accent);opacity:.86}
.ep-loadout-card h4,.ep-controls-card-v2 h4{margin:0!important;font-size:14px;color:var(--ep-ink)}
.ep-loadout-head>small{padding:4px 7px;border-radius:999px;background:color-mix(in srgb,var(--ep-accent) 9%,var(--ep-card));border:1px solid color-mix(in srgb,var(--ep-accent) 20%,var(--ep-line));color:var(--ep-accent);font-size:9px;font-weight:900}
.ep-side-inventory-v2{gap:7px!important}
.ep-side-inventory-v2 .ep-hot-slot{height:56px!important;border-radius:10px!important;border:1px solid color-mix(in srgb,var(--ep-accent) 20%,var(--ep-line))!important;background:color-mix(in srgb,var(--ep-accent) 4%,var(--ep-card))!important;box-shadow:inset 0 1px rgba(255,255,255,.06)}
.ep-side-inventory-v2 .ep-hot-slot b{color:var(--ep-accent)!important;font-size:10px}.ep-side-inventory-v2 .ep-hot-slot span{font-size:9px!important;color:var(--ep-ink)!important;font-weight:800}
.ep-side-inventory-v2 .ep-hot-slot.active{outline:2px solid color-mix(in srgb,var(--ep-accent) 60%,transparent)!important;background:color-mix(in srgb,var(--ep-accent) 11%,var(--ep-card))!important}
.ep-damage-badge{display:inline-flex;align-items:center;justify-content:center;min-height:26px;padding:4px 8px;border-radius:999px;border:1px solid color-mix(in srgb,#d95757 35%,var(--ep-line));background:color-mix(in srgb,#d95757 8%,var(--ep-card));color:#d95757;font-size:9px;font-weight:900;white-space:nowrap}
.ep-shortcut-group{padding:9px;border-radius:11px;border:1px solid color-mix(in srgb,var(--ep-accent) 16%,var(--ep-line));background:color-mix(in srgb,var(--ep-deep) 4%,var(--ep-card));margin-top:8px}
.ep-shortcut-group-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}.ep-shortcut-group-title b{font-size:11px;color:var(--ep-ink)}.ep-shortcut-group-title small{font-size:7px;font-weight:900;letter-spacing:.08em;color:var(--ep-muted)}
.ep-control-grid-v2{grid-template-columns:1fr 1fr!important;gap:6px!important}
.ep-control-grid-v2 span{min-height:32px;padding:5px 6px;border-radius:8px;border:1px solid color-mix(in srgb,var(--ep-accent) 12%,var(--ep-line));background:var(--ep-card);color:var(--ep-ink)!important;gap:6px!important}
.ep-control-grid-v2 span:last-child:nth-child(odd){grid-column:1/-1}
.ep-control-grid-v2 kbd,.ep-special-keys kbd,.ep-shortcut-foot kbd{background:linear-gradient(180deg,color-mix(in srgb,var(--ep-accent) 12%,var(--ep-card)),color-mix(in srgb,var(--ep-deep) 7%,var(--ep-card)))!important;border-color:color-mix(in srgb,var(--ep-accent) 28%,var(--ep-line))!important;color:var(--ep-accent)!important;box-shadow:0 2px 6px color-mix(in srgb,var(--ep-deep) 10%,transparent);font-weight:900!important}
.ep-control-grid-v2 em{font-style:normal;font-size:9px;font-weight:800;color:var(--ep-ink)}
.ep-shortcut-special{background:linear-gradient(135deg,color-mix(in srgb,#d5a83f 7%,var(--ep-card)),color-mix(in srgb,var(--ep-accent) 5%,var(--ep-card)))}
.ep-special-keys{display:grid;grid-template-columns:1fr 1fr;gap:7px}.ep-special-keys>span{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:7px;align-items:center;padding:7px;border-radius:9px;background:var(--ep-card);border:1px solid color-mix(in srgb,#d5a83f 25%,var(--ep-line))}.ep-special-keys kbd{grid-row:1/3}.ep-special-keys strong{font-size:9px;color:var(--ep-ink)}.ep-special-keys small{font-size:8px;color:var(--ep-muted);margin-top:1px}
.ep-shortcut-foot{display:flex;flex-wrap:wrap;gap:6px 10px;margin-top:9px;padding-top:8px;border-top:1px dashed color-mix(in srgb,var(--ep-accent) 20%,var(--ep-line));font-size:9px;color:var(--ep-muted)}.ep-shortcut-foot>span{display:flex;align-items:center;gap:5px}.ep-shortcut-foot>small{width:100%;line-height:1.5;color:var(--ep-muted)}
html.bp-dark .ep-loadout-card,html.bp-dark .ep-controls-card-v2,body.bp-dark .ep-loadout-card,body.bp-dark .ep-controls-card-v2,html[data-theme="dark"] .ep-loadout-card,html[data-theme="dark"] .ep-controls-card-v2{box-shadow:0 12px 30px rgba(0,0,0,.22)!important}


/* v94: pickup interaction states. */
.ep-world-item.is-picking{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.ep-world-item.collected{
  display:none!important;
}

/* v94: explicitly separate floor items from wall/table-height items.
   Ground: key, pin, rope, sling.  Stand-height: scroll, sword. */
.ep-item-key{left:31%!important;top:64%!important}
.ep-item-pin{left:60%!important;top:76%!important}
.ep-item-rope{left:25%!important;top:79%!important}
.ep-item-sling{left:43%!important;top:74%!important}

.ep-item-scroll{left:87%!important;top:40%!important}
.ep-item-sword{left:76%!important;top:29%!important}

.ep-world-item[data-pickup="ground"]{
  z-index:2!important;
}
.ep-world-item[data-pickup="stand"]{
  z-index:3!important;
}


/* v105: 3D character name label 20px higher than the current position. */
.ep-dom-player.is-3d-avatar .ep-player-name{
  bottom:172px!important;
}

/* v107: move 3D character name another 15px higher. */
.ep-dom-player.is-3d-avatar .ep-player-name{
  bottom:187px!important;
}

/* Do not show a floating name before the 3D model is actually ready. */
.ep-dom-player.is-3d-avatar:not(.ep-3d-ready) .ep-player-name{
  opacity:0!important;
  visibility:hidden!important;
}
.ep-dom-player.is-3d-avatar.ep-3d-ready .ep-player-name{
  opacity:1!important;
  visibility:visible!important;
  transition:opacity .10s linear;
}