/* @workspace/ui-novel — стили новеллы. Тема — через переменные --nv-* на .nv (или через opts.theme). */
.nv{
  --nv-stage-bg:#08090e;
  --nv-panel-bg:rgba(14,16,24,.86);
  --nv-panel-fg:#fff;
  --nv-panel-border:rgba(255,255,255,.07);
  --nv-name-bg:#ff7a45;
  --nv-name-fg:#fff;
  --nv-accent:#ffd9a8;
  --nv-choice-bg:rgba(255,255,255,.96);
  --nv-choice-fg:#2d2620;
  --nv-font:inherit;
  --nv-radius:18px;
  --nv-text-size:18px;
  position:fixed;inset:0;z-index:60;background:var(--nv-stage-bg);overflow:hidden;
  display:flex;align-items:center;justify-content:center;font-family:var(--nv-font);
  user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;
  animation:nv-in .4s ease;
}
.nv.nv-out{opacity:0;transition:opacity .4s ease;pointer-events:none}
@keyframes nv-in{from{opacity:0}to{opacity:1}}
.nv-backdrop{position:absolute;inset:0;background-size:cover;background-position:center;
  filter:blur(42px) brightness(.4);transform:scale(1.25);transition:background-image .6s}
.nv-stage{position:relative;width:100%;height:100%;overflow:hidden}
@media (min-width:700px){
  .nv-stage{width:auto;aspect-ratio:9/16;border-radius:var(--nv-radius);box-shadow:0 14px 80px rgba(0,0,0,.8)}
}
/* прозрачный узел: под новеллой видна сама игра */
.nv.nv-transparent{background:transparent}
.nv.nv-transparent .nv-backdrop{display:none}
.nv.nv-transparent .nv-stage{box-shadow:none;border-radius:0;width:100%;aspect-ratio:auto;pointer-events:none}
.nv.nv-transparent .nv-panel,.nv.nv-transparent .nv-overlay,.nv.nv-transparent .nv-host,.nv.nv-transparent .nv-exit{pointer-events:auto}

.nv-bgs{position:absolute;inset:0}
.nv-bg{position:absolute;inset:0;background-size:cover;background-position:center top;animation:nv-bg .6s ease}
.nv-bg-out{animation:nv-bg-out .6s ease forwards}
@keyframes nv-bg{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}
@keyframes nv-bg-out{to{opacity:0}}
.nv-sprite{position:absolute;left:50%;bottom:0;transform:translateX(-50%);height:84%;max-width:96%;z-index:1;
  object-fit:contain;object-position:bottom;filter:drop-shadow(0 12px 26px rgba(0,0,0,.45))}
.nv-sprite-in{animation:nv-sprite .35s ease}
.nv-sprite-out{opacity:0;transition:opacity .3s}
@keyframes nv-sprite{from{opacity:0;transform:translateX(-50%) translateY(14px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.nv-load{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;
  font-size:44px;background:var(--nv-stage-bg);animation:nv-pulse 1.1s ease infinite}
.nv-load[hidden]{display:none}
@keyframes nv-pulse{50%{opacity:.45}}

/* эффекты сцены */
.nv-fx{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.nv-fx-rain i{position:absolute;top:-14%;width:1.5px;height:11%;
  background:linear-gradient(rgba(255,255,255,0),rgba(208,224,255,.55));animation:nv-rain 1s linear infinite}
@keyframes nv-rain{to{transform:translateY(1150%)}}
.nv-fx-bubbles i{position:absolute;bottom:-6%;border-radius:50%;border:1px solid rgba(220,245,255,.55);
  background:rgba(220,245,255,.12);animation:nv-bubble 4s linear infinite}
@keyframes nv-bubble{0%{transform:translateY(0);opacity:0}12%{opacity:.9}100%{transform:translateY(-110vh) translateX(12px);opacity:0}}
.nv-fx-snow i{position:absolute;top:-6%;border-radius:50%;background:rgba(255,255,255,.85);animation:nv-snow 5s linear infinite}
@keyframes nv-snow{to{transform:translateY(115vh) translateX(18px)}}
.nv-fx-steam{left:50%;top:45%;inset:auto}
.nv-fx-steam i{position:absolute;bottom:0;left:0;width:20px;height:20px;border-radius:50%;background:#fff;
  filter:blur(7px) drop-shadow(0 0 6px rgba(255,255,255,.9));animation:nv-steam 2.8s ease-in infinite}
.nv-fx-steam i:nth-child(2){left:17px;animation-delay:.95s}
.nv-fx-steam i:nth-child(3){left:-17px;animation-delay:1.85s}
@keyframes nv-steam{0%{opacity:0;transform:translateY(0) scale(.9)}20%{opacity:.9}100%{opacity:0;transform:translateY(-110px) scale(3)}}

/* слой мини-игры хоста */
.nv-host{position:absolute;inset:0;z-index:3}
.nv-host[hidden]{display:none}

/* панель реплик */
.nv-panel{position:absolute;left:10px;right:10px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:4;
  background:var(--nv-panel-bg);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid var(--nv-panel-border);border-radius:var(--nv-radius);padding:16px 16px 12px;color:var(--nv-panel-fg);
  animation:nv-panel .25s ease;cursor:pointer;min-height:84px}
.nv-panel[hidden]{display:none}
@keyframes nv-panel{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.nv-name{position:absolute;top:-13px;left:16px;background:var(--nv-name-bg);color:var(--nv-name-fg);font-weight:800;
  font-size:11.5px;letter-spacing:1.5px;text-transform:uppercase;padding:4px 13px;border-radius:999px;
  box-shadow:0 3px 10px rgba(0,0,0,.3)}
.nv-name[hidden]{display:none}
.nv-text{font-size:var(--nv-text-size);font-weight:700;line-height:1.5;min-height:1.5em}
/* печатная машинка не дёргает высоту панели: невидимый полный текст задаёт размер, живой печатается поверх */
.nv-textwrap{position:relative}
.nv-sizer{visibility:hidden}
.nv-live{position:absolute;inset:0}
.nv-sub{color:var(--nv-sub-fg,#b9c3da);font-size:14px;margin-top:7px;line-height:1.45}
.nv-sub[hidden]{display:none}
.nv-note{margin-top:8px;font-size:13px;background:rgba(255,207,94,.12);border-left:3px solid var(--nv-note-accent,#ffcf5e);
  border-radius:10px;padding:8px 10px;color:var(--nv-note-fg,#ffd9a8);line-height:1.5}
.nv-note[hidden]{display:none}
.nv-tools{display:flex;gap:8px;margin-top:10px;align-items:center}
.nv-toolbtns{display:flex;gap:8px;flex-wrap:wrap}
.nv-toolbtns:empty{display:none}
.nv-stool{border:none;background:rgba(255,255,255,.12);color:var(--nv-accent);border-radius:10px;padding:5px 12px;
  font-size:12.5px;font-weight:800;font-family:inherit;cursor:pointer}
.nv-stool:active{transform:scale(.96)}
.nv-tap{margin-left:auto;text-align:right;font-size:11px;opacity:.6;animation:nv-blink 1.6s ease infinite;min-height:13px;white-space:nowrap}
@keyframes nv-blink{0%,100%{opacity:.4}50%{opacity:.9}}
.nv-corner{position:absolute;top:14px;right:14px;z-index:6;display:flex;gap:8px}
.nv-corner .nv-exit{position:static;font-size:15px}
.nv-hidden{display:none !important}
.nv-badge{margin-left:8px;font-size:13px;opacity:.7;font-weight:800}

/* выборы / ввод / конец */
.nv-overlay{position:absolute;inset:0;z-index:5}
.nv-overlay[hidden]{display:none}
.nv-choices{position:absolute;inset:0;background:rgba(8,9,14,.6);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  display:flex;flex-direction:column;justify-content:center;gap:12px;padding:26px;animation:nv-panel .3s ease}
.nv-choices-title{text-align:center;color:var(--nv-accent);font-weight:800;letter-spacing:2px;text-transform:uppercase;
  font-size:13px;margin-bottom:6px;min-height:0}
.nv-choices-title:empty{display:none}
.nv-choice{border:none;border-radius:16px;background:var(--nv-choice-bg);padding:16px;font-size:16px;font-family:inherit;
  font-weight:800;color:var(--nv-choice-fg);box-shadow:0 6px 18px rgba(0,0,0,.3);cursor:pointer;transition:transform .08s}
.nv-choice:active{transform:scale(.97)}
.nv-field{border:2px solid rgba(255,255,255,.25);border-radius:16px;padding:15px 18px;font-size:19px;font-weight:700;
  font-family:inherit;text-align:center;background:rgba(255,255,255,.96);color:#2d2620;outline:none}
.nv-field:focus{border-color:var(--nv-accent)}
.nv-shake{animation:nv-shake .4s ease}
@keyframes nv-shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.nv-exit{position:absolute;top:14px;left:14px;z-index:6;width:38px;height:38px;border-radius:50%;border:none;
  background:rgba(16,18,26,.55);color:#cfd6e8;font-size:15px;backdrop-filter:blur(4px);cursor:pointer}
