/* Мобильный портрет: фиолетово-золотая тема игры, тонкие рамки 1px. */
@import url("/shared/css/style.css");

:root{--m-frame:#54407a;--m-inner:#332a4a;--m-gold:#d4a54a;--m-gold-br:#f5d27a;--m-dim:#948aa0;--m-ink:#e9e2d4;--m-top:calc(env(safe-area-inset-top) + 49px);--m-exit-h:34px;--m-chat-h:50dvh;--m-chat-x:min(80dvh,calc(var(--m-chat-h) + 20dvh));--m-actor-h:19dvh;--m-hero-h:34dvh;--m-chat-alpha:.62;--m-bg-pos:50%}
html,body{width:100%;height:100%;height:100dvh;overflow:hidden;overscroll-behavior:none;touch-action:manipulation}
body{min-width:0;min-height:0}
#screens{width:100%;height:100%;height:100dvh;min-height:0}
#sc-game{height:100%;height:100dvh;min-height:0}
#sc-game>.scene-wrap{position:absolute;inset:0;min-height:0;z-index:0!important;background-position:center var(--m-bg-pos)!important}
#sc-game .loc-overlay{top:calc(env(safe-area-inset-top) + 48px);left:12px;right:12px}
#wintoolbar{display:none!important}

/* Верхняя панель кнопок */
.mobile-nav{display:none;position:fixed;z-index:9000;left:5px;right:5px;top:calc(env(safe-area-inset-top) + 3px);height:43px;padding:3px 5px;gap:2px;align-items:stretch;justify-content:space-around;background:rgba(16,13,26,.95);border:1px solid var(--m-frame);box-shadow:0 5px 18px rgba(0,0,0,.4)}
.mobile-nav.visible{display:flex}
.mobile-nav button{flex:1;min-width:0;padding:2px 1px;border:0;border-radius:2px;background:transparent;color:var(--m-dim);font-size:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;line-height:1;touch-action:manipulation}
.mobile-nav button small{font-size:9px;color:inherit;white-space:nowrap}
.mobile-nav button.active{color:var(--m-gold-br);background:rgba(212,165,74,.1);box-shadow:inset 0 -2px var(--m-gold)}
.mobile-more{display:none;position:fixed;z-index:9001;right:8px;top:calc(env(safe-area-inset-top) + 48px);min-width:170px;padding:5px;border:1px solid var(--m-frame);border-radius:4px;background:rgba(16,13,26,.98);box-shadow:0 8px 24px rgba(0,0,0,.5)}
.mobile-more.visible{display:grid;gap:4px}
.mobile-more button{text-align:left;background:transparent;border:0;color:var(--m-ink);padding:8px;border-radius:2px}

/* Окна: компакт, без шапок/крестов, шрифт 80% */
.win{position:fixed!important;left:5px!important;right:5px!important;top:var(--m-top)!important;bottom:calc(var(--m-chat-h) + var(--m-exit-h) + 5px)!important;width:auto!important;height:auto!important;max-width:none!important;max-height:none!important;min-width:0!important;min-height:0!important;border-radius:4px!important;z-index:10!important;background:linear-gradient(180deg,rgba(24,19,39,.96),rgba(16,13,26,.96))!important;border:1px solid var(--m-frame)!important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.4),0 0 14px rgba(0,0,0,.4)!important}
#sc-game>.win{z-index:10!important}
.win::before{content:"";position:absolute;inset:3px;border:1px solid var(--m-inner);pointer-events:none;z-index:3}
.win::after{content:"";position:absolute;inset:-1px;pointer-events:none;z-index:4;background:radial-gradient(circle at 0 0,rgba(212,165,74,.55) 1.5px,transparent 2.5px),radial-gradient(circle at 100% 0,rgba(212,165,74,.55) 1.5px,transparent 2.5px),radial-gradient(circle at 0 100%,rgba(212,165,74,.55) 1.5px,transparent 2.5px),radial-gradient(circle at 100% 100%,rgba(212,165,74,.55) 1.5px,transparent 2.5px)}
.win-head,.win-title,.win-x,.win-pin,.win-grip{display:none!important}
.win-body{position:relative;z-index:1;padding:5px!important;min-height:0;overflow:auto!important;-webkit-overflow-scrolling:touch}
.win.pinned{background:linear-gradient(180deg,rgba(24,19,39,.96),rgba(16,13,26,.96))!important;border:1px solid var(--m-frame)!important}
.win button,.win input,.win select{font-size:80%}
.win .chip,.win .stat-row,.win .mentor-req,.win .mentor-lock,.win .empty-note{font-size:80%;padding:3px 5px}
.win:not(.win-clear) .section-title,.win:not(.win-clear) .combat-head,.win:not(.win-clear) .inv-head{margin:0 0 4px;padding:3px 4px;border-bottom:1px solid var(--m-inner);font-size:11px;letter-spacing:1px}
/* Кресты не нужны: окна тогглятся повторным нажатием */
#btnCloseInv,.combat-head button{display:none!important}

/* Прозрачные окна без обводок */
.win-clear,.win-through{border:0!important;background:transparent!important;box-shadow:none!important}
.win-clear::before,.win-clear::after,.win-through::before,.win-through::after{display:none!important}

/* Свои/Чужие — сплит пополам выше выходов */
#w-actors-l,#w-actors-r{top:auto!important;bottom:calc(var(--m-chat-h) + var(--m-exit-h) + 5px)!important;height:var(--m-actor-h)!important;width:50vw!important;z-index:6!important;pointer-events:none!important}
#w-actors-l{left:0!important;right:auto!important}
#w-actors-r{left:auto!important;right:0!important}
#w-actors-l .win-body,#w-actors-r .win-body{overflow:visible!important;padding:0!important;height:100%}
#w-actors-l .actors-col,#w-actors-r .actors-col{height:100%;touch-action:pan-x;overscroll-behavior-x:contain;scrollbar-width:none}
#w-actors-l .actors-col::-webkit-scrollbar,#w-actors-r .actors-col::-webkit-scrollbar{display:none}
#w-actors-l .actor-wrap,#w-actors-l .actor,#w-actors-r .actor-wrap,#w-actors-r .actor{pointer-events:auto!important}
#w-actors-l .actor,#w-actors-r .actor{height:calc(var(--m-actor-h) - 4dvh)!important;max-width:26vw}
#w-actors-l .name-tag,#w-actors-r .name-tag{font-size:10px}

/* Герой — всегда сверху, название карты внутри */
#w-hero.win{top:var(--m-top)!important;bottom:auto!important;max-height:var(--m-hero-h)!important}
#w-hero .hero-card{padding-bottom:4px}
#w-hero .bar-hp{margin:1px 0}
#w-hero #locName{font-size:12px;color:var(--m-gold-br);letter-spacing:1px;margin-bottom:2px;cursor:pointer}

/* Мир: описание в чат, чипы верхней полосой */
#mobileWorldStrip{display:none;position:fixed;z-index:650;top:var(--m-top);left:5px;right:5px;max-height:24dvh;overflow:auto;padding:4px;gap:3px;flex-wrap:wrap;background:rgba(16,13,26,.94);border:1px solid var(--m-frame)}
#mobileWorldStrip.visible{display:flex}
#mobileWorldStrip #locDesc{width:100%;max-height:8dvh;overflow:auto;color:var(--m-ink);font-size:80%;padding:3px}
#mobileWorldStrip #locActions{display:contents}

/* Полоса переходов над чатом */
.mobile-exits{display:flex;position:fixed;z-index:640;left:5px;right:5px;bottom:calc(var(--m-chat-h) + 5px);height:var(--m-exit-h);gap:4px;align-items:stretch;overflow-x:auto;padding:2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.mobile-exits::-webkit-scrollbar{display:none}
.mobile-exits:empty{display:none}
.mobile-exits .stage-exit{position:static!important;flex:0 0 auto;display:flex;align-items:center;padding:2px 10px;border:1px solid var(--m-frame);border-radius:3px;background:rgba(16,13,26,.9);color:var(--m-gold-br);font-size:80%;white-space:nowrap}
.mobile-exits .stage-exit-name{font-size:80%}
#sc-game:has(#w-chat.expanded) .mobile-exits{bottom:calc(var(--m-chat-x) + 5px)}
#sc-game:has(#w-chat.expanded) #w-actors-l,#sc-game:has(#w-chat.expanded) #w-actors-r{bottom:calc(var(--m-chat-x) + var(--m-exit-h) + 5px)}

/* Чат: пол-экрана снизу, раскрытие выше; фон только у блоков */
#w-chat.win{top:auto!important;left:5px!important;right:5px!important;bottom:5px!important;height:var(--m-chat-h)!important;min-height:130px!important;max-height:var(--m-chat-x)!important;border-radius:4px!important;border:0!important;background:transparent!important;box-shadow:none!important;z-index:700!important;transition:height .22s ease}
#w-chat.win::before,#w-chat.win::after{display:none!important}
#w-chat.win.expanded{height:var(--m-chat-x)!important}
#w-chat .win-body{display:flex;flex-direction:column;overflow:hidden!important;gap:3px;padding:2px!important}
#w-chat #chatLog{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:2px 3px;background:transparent}
#w-chat .chat-log .line{font-size:80%;padding:3px 6px;line-height:1.3;margin:2px 0;border:1px solid rgba(84,64,122,.6);border-radius:3px;background:rgba(16,13,26,var(--m-chat-alpha));box-shadow:inset 0 0 0 1px rgba(0,0,0,.3);border-left-width:3px}
#w-chat .chat-log .line.npc{border-left-color:rgba(224,168,120,.75)}
#w-chat .chat-log .line.private{border-left-color:rgba(167,139,250,.8)}
#w-chat .chat-log .line.error{border-left-color:rgba(224,82,82,.75)}
#w-chat .chat-log .line.sys{opacity:.8}
#w-chat .input-row{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;z-index:auto!important;margin:0;padding:4px 5px;background:rgba(16,13,26,.88);border:1px solid var(--m-frame);border-radius:3px;flex-shrink:0;gap:4px}
#w-chat #cmdText{min-width:0;font-size:16px;padding:8px}
#w-chat #cmdSend,#w-chat #cmdPaletteBtn{min-height:38px;padding:5px 10px}
#w-chat #modePill{max-width:30vw;overflow:hidden}
.mobile-expand{display:inline-flex;align-items:center;justify-content:center;width:38px;height:15px;border:1px solid var(--m-frame);border-radius:2px;background:rgba(16,13,26,.94);color:var(--m-gold);font-size:12px;position:absolute;top:-15px;left:50%;transform:translateX(-50%);z-index:5}
body.mobile-game>.input-row{display:none!important}

/* Полоса выбора — компактно под верхней панелью */
#selBar{top:calc(env(safe-area-inset-top) + 48px);max-width:96vw;padding:4px 8px;gap:5px;background:rgba(16,13,26,.94);border:1px solid var(--m-frame);border-radius:3px;z-index:640}
#selBar button{font-size:80%;padding:3px 7px}

/* Прочее */
button,select,.actor-wrap,.chip{touch-action:manipulation}
input,select,textarea{font-size:16px}
.actor-stage{padding-left:2%;padding-right:2%;padding-bottom:23%}
.actor-stage .actors-col{height:58%;gap:4px}
.actor{height:min(34dvh,270px);max-width:34vw}
.loc-id{display:none}
#sc-game .stage-exits{display:none!important}
.stage-exits{max-width:96vw;overflow-x:auto;white-space:nowrap}
#battleOverlay.win{top:var(--m-top)!important;bottom:calc(var(--m-chat-h) + var(--m-exit-h) + 5px)!important}
#battleOverlay .bt-log{max-height:30dvh}
#invOverlay .win-body{display:flex;flex-direction:column}
#invOverlay .inv-cols{display:flex;flex-direction:column;overflow:auto;flex:1;min-height:0}
#invOverlay .paperdoll{width:100%;max-width:none}
/* Иконки сумки и куклы — квадраты 48px */
#invOverlay .bag-img,#invOverlay .bag-icon,#invOverlay .pd-icon,#invOverlay .det-icon,#invOverlay .det-noicon{width:48px;height:48px;min-width:48px;min-height:48px;object-fit:contain}
#invOverlay .bags-col{min-width:0}
#invOverlay .bags-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
#eventOverlay,#tradeOverlay,#buildOverlay,#constructOverlay,#bureauOverlay,#spellOverlay{overflow:hidden}
.mobile-hidden{display:none!important}

@media(min-width:600px) and (orientation:portrait){
  #w-chat.win{height:var(--m-chat-h)!important;max-height:var(--m-chat-x)!important}
  #w-chat.win.expanded{height:var(--m-chat-x)!important}
  .actor{height:min(36dvh,360px)}
}
