:root { color-scheme: dark; background: #08070b; --app-height: 100dvh; }
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; min-height: 100%; margin: 0; padding: 0; overflow: hidden; overscroll-behavior: none; }
body { background: radial-gradient(circle at 50% 35%, #24131c 0, #09080d 60%, #030305 100%); font-family: Georgia, serif; }
#unity-container { position: fixed; inset: 0; width: 100vw; height: var(--app-height); min-width: 0; min-height: 0; overflow: hidden; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
#unity-canvas { display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%; margin: 0; padding: 0; border: 0; outline: 0; background: #09080d; touch-action: none; }
#unity-canvas:focus { outline: none; }
/* Ключевой арт с героями трёх историй. Заголовок и полоса разведены по краям экрана,
   чтобы не ложиться на лица: сверху — марка, снизу — прогресс. */
#unity-loading-bar { position: absolute; inset: 0; display: grid; grid-template-rows: auto 1fr auto; gap: 0; padding: clamp(20px, 5vh, 56px) 24px; text-align: center; background: #09080d; transition: opacity .45s ease; }
#unity-loading-bar::before { content: ""; position: absolute; inset: 0; background: url("splash.jpg") center 22% / cover no-repeat; }
/* Затемнение сверху и снизу: под текстом фон гасим, лица в середине оставляем светлыми. */
#unity-loading-bar::after { content: ""; position: absolute; inset: 0; background:
  linear-gradient(180deg, rgba(6,5,9,.92) 0%, rgba(6,5,9,.42) 26%, rgba(6,5,9,.28) 52%, rgba(6,5,9,.88) 82%, rgba(6,5,9,.97) 100%),
  radial-gradient(ellipse at 50% 45%, rgba(0,0,0,0) 40%, rgba(4,3,7,.72) 100%); }
#unity-loading-bar > * { position: relative; z-index: 1; }
#unity-loading-bar.hidden { opacity: 0; pointer-events: none; }
.splash-top, .splash-bottom { display: block; }
.brand { font-size: clamp(30px, 7vw, 74px); letter-spacing: .22em; text-indent: .22em; font-weight: 400;
  background: linear-gradient(180deg, #fbf0d6 0%, #e6c98a 42%, #b8873c 72%, #f2ddab 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 2px 10px rgba(0,0,0,.85)) drop-shadow(0 0 26px rgba(198,150,66,.35)); }
.chapter { margin-top: 14px; color: #cfa464; font-size: clamp(11px, 1.9vw, 17px); letter-spacing: .18em; text-indent: .18em; text-shadow: 0 2px 8px rgba(0,0,0,.9); }
/* Тонкие золотые линии по бокам подзаголовка — тот же приём, что в интерфейсе игры. */
.chapter::before, .chapter::after { content: "◇"; margin: 0 .9em; color: rgba(207,164,100,.55); }
#unity-progress { width: min(520px, 78vw); height: 5px; margin: 14px auto 0; overflow: hidden; background: rgba(36,29,36,.85); border: 1px solid rgba(184,138,66,.55); }
#unity-progress-fill { width: 0; height: 100%; background: linear-gradient(90deg, #6f1c35, #d0a354); transition: width .18s ease; }
#unity-loading-text { color: #bdb1a2; font: 14px/1.4 Arial, sans-serif; }
#unity-warning { position: fixed; left: 12px; right: 12px; top: max(12px, env(safe-area-inset-top)); z-index: 20; padding: 10px 14px; color: #f5f1e8; background: rgba(72,26,38,.95); border: 1px solid #b88a42; text-align: center; font: 14px Arial, sans-serif; }
#unity-warning:empty { display: none; }
@media (max-width: 700px) { .brand { letter-spacing: .08em; text-indent: .08em; } }
/* В портрете cover обрезал бы 16:9 до одной фигуры, поэтому берём отдельный вертикальный арт.
   Незадействованный media query браузер не загружает, так что вес экрана загрузки не растёт. */
@media (orientation: portrait) {
  #unity-loading-bar::before { background-image: url("splash_portrait.jpg"); background-position: center 30%; }
  #unity-loading-bar::after { background:
    linear-gradient(180deg, rgba(6,5,9,.93) 0%, rgba(6,5,9,.40) 20%, rgba(6,5,9,.22) 55%, rgba(6,5,9,.84) 84%, rgba(6,5,9,.97) 100%); }
}

html, body { width:100%; height:100%; overflow:hidden; background:#080006 }
#unity-container.unity-desktop { left:0; top:0; width:100%; height:100%; transform:none }
#unity-canvas { width:100% !important; height:100% !important; display:block }
#unity-footer { display:none }