/* NOVA stage styles, scoped. Generated by scripts/port-prototype.py from the prototype. */
.nova-stage {
    --void: #040706;
    --ink: #e8eee9;
    --mute: #8d9891;
    --mint: #3fe0b0;
    --gold: #ffcf8a;
    --rose: #ff7a8a;
    --line: rgba(232, 238, 233, .12);
  }
.nova-stage, .nova-stage * { box-sizing: border-box; margin: 0; padding: 0; }
.nova-stage { color: var(--ink); font-family: var(--nova-sans); -webkit-font-smoothing: antialiased; }
.nova-stage .mono { font-family: var(--nova-mono); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.nova-stage #world { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; display: block; }
.nova-stage #terraSrc { display: none; }
.nova-stage.no-webgl #world { display: none; }
.nova-stage.no-webgl #terraSrc { display: block; position: fixed; left: 50%; bottom: 0; transform: translateX(-50%); height: 92vh; width: auto; z-index: 0; opacity: .55; filter: sepia(.3) hue-rotate(110deg) saturate(1.4); }
.nova-stage .hud { position: fixed; inset: 0; z-index: 1; pointer-events: none; }
.nova-stage .hud svg.lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.nova-stage .hud svg.lines path { fill: none; stroke: rgba(63, 224, 176, .55); stroke-width: 1; }
.nova-stage .hud svg.lines circle { fill: var(--mint); }
.nova-stage .reticle { position: absolute; left: 0; top: 0; width: 132px; height: 132px; margin: -66px 0 0 -66px; opacity: 0; will-change: transform; }
.nova-stage .reticle svg { width: 100%; height: 100%; overflow: visible; }
.nova-stage .reticle .spin { transform-origin: 66px 66px; animation: nova-spin 14s linear infinite; }
.nova-stage .reticle .spin.rev { animation-duration: 9s; animation-direction: reverse; }
@keyframes nova-spin {
 to { transform: rotate(360deg); }
}
.nova-stage .tag { position: absolute; left: 0; top: 0; padding: 9px 12px 10px; min-width: 170px; border: 1px solid rgba(63, 224, 176, .32); border-radius: 2px; background: rgba(3, 14, 11, .58); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); font-family: var(--nova-mono); font-size: 11px; letter-spacing: .05em; line-height: 1.55; color: var(--ink); white-space: nowrap; opacity: 0; will-change: transform, opacity; }
.nova-stage .tag i { display: block; font-style: normal; color: var(--mint); text-transform: uppercase; }
.nova-stage .tag b { font-weight: 500; color: var(--gold); font-variant-numeric: tabular-nums; }
.nova-stage .tag::before { content: ""; position: absolute; left: -1px; top: -1px; width: 8px; height: 8px; border-left: 1px solid var(--mint); border-top: 1px solid var(--mint); }
.nova-stage[data-mood="happy"] #mood { color: var(--mint); }
.nova-stage[data-mood="upset"] #mood { color: var(--rose); }
.nova-stage .corner { position: fixed; top: 22px; left: 28px; z-index: 3; display: flex; align-items: center; gap: 10px; opacity: 0; transition: opacity 1s; }
.nova-stage .corner.on { opacity: .8; }
.nova-stage .ctl { position: fixed; top: 14px; right: 18px; z-index: 5; display: grid; gap: 6px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 14px; background: rgba(4, 10, 9, .55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); color: var(--mute); font-size: 11px; opacity: 0; transition: opacity 1s; }
.nova-stage .ctl.on { opacity: .85; }
.nova-stage .ctl:hover { opacity: 1; color: var(--ink); }
.nova-stage .ctl label { display: grid; grid-template-columns: 14px 108px 110px; white-space: nowrap; align-items: center; gap: 6px; }
.nova-stage .ctl input { width: 110px; accent-color: var(--mint); cursor: pointer; }
.nova-stage .ctl input[type="checkbox"] { width: 18px; height: 18px; margin: 0; justify-self: end; }
.nova-stage .ctl button { justify-self: end; margin-top: 2px; padding: 5px 12px; border: 1px solid rgba(63, 224, 176, .45); border-radius: 999px; background: rgba(4, 16, 12, .6); color: var(--ink); font: inherit; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.nova-stage .ctl button:hover { border-color: var(--mint); box-shadow: 0 0 18px rgba(63, 224, 176, .3); }
@media (max-width: 860px) {
.nova-stage .ctl { top: 10px; right: 10px; padding: 8px 10px; }
.nova-stage .ctl .bl { display: none; }
.nova-stage .ctl label { grid-template-columns: 14px 84px; }
.nova-stage .ctl input { width: 84px; }
}
.nova-stage .dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 12px var(--mint); animation: nova-blink 1.4s infinite; }
@keyframes nova-blink {
 50% { opacity: .3; }
}
.nova-stage .dock { position: fixed; left: 50%; bottom: 34px; z-index: 4; transform: translate(-50%, 20px); width: min(560px, calc(100vw - 32px)); display: grid; justify-items: center; gap: 14px; opacity: 0; transition: opacity 1s, transform 1.2s cubic-bezier(.2, .8, .2, 1); }
.nova-stage .dock.on { opacity: 1; transform: translate(-50%, 0); }
.nova-stage .caption { max-width: 100%; margin: 0; padding: 12px 20px 13px; border-radius: 16px; background: rgba(3, 8, 6, .72); backdrop-filter: blur(14px) saturate(.6); -webkit-backdrop-filter: blur(14px) saturate(.6); border: 1px solid rgba(232, 238, 233, .08); text-align: center; font-size: 20px; font-weight: 400; line-height: 1.45; color: #f2f6f3; text-wrap: balance; transition: opacity .4s; }
.nova-stage .caption:empty { opacity: 0; padding: 0; border: 0; }
.nova-stage .caption small { display: block; margin-bottom: 6px; color: #b4c2bb; font-size: 14px; line-height: 1.4; }
.nova-stage .caption small b { color: var(--mint); font-weight: 500; }
.nova-stage .caption .kar { display: block; font-size: 30px; font-weight: 500; line-height: 1.25; letter-spacing: -.01em; min-height: 1.25em; }
.nova-stage .caption .kar span { display: inline-block; margin: 0 .14em; color: rgba(242, 246, 243, .38); transition: color .12s, text-shadow .12s, transform .12s; }
.nova-stage .caption .kar span.done { color: #f2f6f3; }
.nova-stage .caption .kar span.now { color: var(--mint); text-shadow: 0 0 18px rgba(63, 224, 176, .65); transform: translateY(-1px) scale(1.06); }
.nova-stage .log { position: fixed; left: 0; top: 96px; bottom: 150px; z-index: 6; width: min(380px, calc(100vw - 56px)); display: flex; transform: translateX(calc(-100% + 46px)); transition: transform .55s cubic-bezier(.2, .8, .2, 1); }
.nova-stage .log:hover, .nova-stage .log:focus-within, .nova-stage .log.open { transform: translateX(0); }
.nova-stage .log.shut, .nova-stage .log.shut:hover, .nova-stage .log.shut:focus-within { transform: translateX(calc(-100% + 46px)); }
.nova-stage .log .pane { flex: 1; min-width: 0; display: flex; flex-direction: column; border: 1px solid rgba(63, 224, 176, .22); border-left: 0; border-radius: 0 16px 16px 0; background: rgba(3, 9, 7, .8); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); opacity: .25; transition: opacity .45s; }
.nova-stage .log:hover .pane, .nova-stage .log:focus-within .pane, .nova-stage .log.open .pane { opacity: 1; }
.nova-stage .log.shut .pane { opacity: .25; }
.nova-stage .log .head { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.nova-stage .log .head h2 { border-bottom: 0; }
.nova-stage .log .x { width: 34px; height: 34px; margin-right: 10px; border-radius: 50%; border: 1px solid rgba(232, 238, 233, .2); background: rgba(255, 255, 255, .04); color: var(--ink); font-size: 16px; line-height: 1; cursor: pointer; transition: border-color .2s, color .2s, background .2s; }
.nova-stage .log .x:hover { border-color: var(--rose); color: var(--rose); background: rgba(255, 122, 138, .08); }
.nova-stage .log h2 { margin: 0; padding: 16px 18px 10px; font: 500 11px var(--nova-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--mint); border-bottom: 1px solid var(--line); }
.nova-stage .log ol { list-style: none; margin: 0; padding: 12px 18px 18px; overflow-y: auto; flex: 1; display: grid; align-content: start; gap: 12px; scrollbar-width: thin; scrollbar-color: rgba(63, 224, 176, .3) transparent; }
.nova-stage .log li { font-size: 15px; line-height: 1.45; color: #e3ebe6; }
.nova-stage .log li i { display: block; font: 500 10px var(--nova-mono); letter-spacing: .12em; text-transform: uppercase; font-style: normal; margin-bottom: 2px; }
.nova-stage .log li.you i { color: var(--mint); }
.nova-stage .log li.her i { color: var(--gold); }
.nova-stage .log li.you { color: #b9c7c0; }
.nova-stage .log li.sep { text-align: center; font: 10px var(--nova-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--mute); }
.nova-stage .log .empty { color: var(--mute); font-size: 13px; }
.nova-stage .log .tab { align-self: center; width: 46px; height: 210px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; border: 1px solid rgba(63, 224, 176, .85); border-left: 0; border-radius: 0 16px 16px 0; background: linear-gradient(90deg, rgba(10, 52, 40, .92), rgba(16, 78, 60, .92)); color: #d9fff2; cursor: pointer; padding: 0; box-shadow: 0 0 26px rgba(63, 224, 176, .45), inset 0 0 18px rgba(63, 224, 176, .18); animation: nova-tabGlow 2.6s ease-in-out infinite; transition: background .3s, box-shadow .3s; }
.nova-stage .log .tab:hover { background: linear-gradient(90deg, rgba(16, 78, 60, .95), rgba(30, 120, 92, .95)); box-shadow: 0 0 40px rgba(63, 224, 176, .7), inset 0 0 18px rgba(63, 224, 176, .3); }
.nova-stage .log .tab svg { width: 20px; height: 20px; flex: none; }
.nova-stage .log .tab span { writing-mode: vertical-rl; transform: rotate(180deg); font: 600 13px var(--nova-mono); letter-spacing: .18em; text-transform: uppercase; }
@keyframes nova-tabGlow {
 50% { box-shadow: 0 0 40px rgba(63, 224, 176, .7), inset 0 0 18px rgba(63, 224, 176, .3); }
}
.nova-stage .log .tab .new { width: 9px; height: 9px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 10px var(--gold); opacity: 0; transition: opacity .3s; }
.nova-stage .log.unread .tab .new { opacity: 1; animation: nova-blink 1.4s infinite; }
.nova-stage .row { display: flex; align-items: center; gap: 10px; }
.nova-stage .talk { position: relative; display: inline-flex; align-items: center; gap: 12px; height: 58px; padding: 0 26px 0 20px; border: 1px solid rgba(63, 224, 176, .5); border-radius: 999px; background: rgba(4, 16, 12, .6); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: var(--ink); font: 500 16px var(--nova-sans); cursor: pointer; box-shadow: 0 0 34px rgba(63, 224, 176, .18); transition: box-shadow .3s, border-color .3s, transform .3s cubic-bezier(.2, .8, .2, 1); }
.nova-stage .talk:hover { transform: translateY(-2px); box-shadow: 0 0 44px rgba(63, 224, 176, .35); }
.nova-stage .talk:disabled { opacity: .6; cursor: progress; }
.nova-stage .talk .orb { position: relative; width: 30px; height: 30px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #b8ffe9, var(--mint) 45%, #0b4a39 100%); box-shadow: 0 0 calc(10px + var(--lvl, 0) * 40px) var(--mint); transform: scale(calc(1 + var(--lvl, 0) * .35)); transition: transform .08s linear; }
.nova-stage .talk.live { border-color: var(--mint); }
.nova-stage .face { height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(255, 207, 138, .45); background: rgba(14, 10, 4, .55); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: var(--gold); font: 500 14px var(--nova-sans); cursor: pointer; transition: box-shadow .3s, border-color .3s, transform .3s cubic-bezier(.2, .8, .2, 1); }
.nova-stage .face:hover { transform: translateY(-2px); border-color: var(--gold); box-shadow: 0 0 28px rgba(255, 207, 138, .3); }
.nova-stage .end { height: 44px; width: 44px; border-radius: 50%; border: 1px solid var(--line); background: rgba(4, 7, 6, .5); color: var(--mute); font-size: 18px; cursor: pointer; display: none; }
.nova-stage .end.on { display: inline-block; }
.nova-stage .end:hover { color: var(--rose); border-color: var(--rose); }
.nova-stage .status { color: var(--mute); }
.nova-stage .status.err { color: var(--rose); text-transform: none; letter-spacing: 0; font-size: 13px; }
@media (max-width: 860px) {
.nova-stage .corner { top: 16px; left: 18px; }
.nova-stage .dock { bottom: 22px; }
.nova-stage .caption { font-size: 17px; padding: 10px 14px 11px; }
.nova-stage .caption .kar { font-size: 24px; }
.nova-stage .log { top: 70px; bottom: 170px; }
.nova-stage .tag { min-width: 0; font-size: 10px; padding: 7px 9px 8px; }
}
@media (prefers-reduced-motion: reduce) {
.nova-stage .reticle .spin, .nova-stage .dot { animation: none; }
}

/* Chats: a second left-edge tab above Conversation, listing the latest chats (one per Talk). The side panels only catch the
   pointer on their tab and pane, so the two tabs stacked in the same strip don't fight over hover. */
.nova-stage .log { pointer-events: none; }
.nova-stage .log .tab, .nova-stage .log .pane { pointer-events: auto; }
.nova-stage .log.chats { z-index: 7; }
.nova-stage .log.chats .tab { height: 124px; position: relative; top: -176px; }
.nova-stage .log.chats ol { gap: 4px; padding: 10px 12px 14px; }
.nova-stage .log.chats li button { width: 100%; display: grid; gap: 3px; padding: 10px 12px; text-align: left; border-radius: 12px; border: 1px solid transparent; background: transparent; color: #e3ebe6; font: inherit; font-size: 14.5px; cursor: pointer; transition: background .2s, border-color .2s; }
.nova-stage .log.chats li button:hover:not(:disabled) { background: rgba(63, 224, 176, .08); border-color: rgba(63, 224, 176, .3); }
.nova-stage .log.chats li button.on { background: rgba(63, 224, 176, .12); border-color: rgba(63, 224, 176, .45); }
.nova-stage .log.chats li button b { font-weight: 500; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nova-stage .log.chats li button small { font: 10px var(--nova-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--mute); }
.nova-stage .log.chats li button:disabled { opacity: .45; cursor: not-allowed; }
.nova-stage .ctl .btns { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.nova-stage .ctl button[aria-pressed="true"] { border-color: var(--mint); background: rgba(63, 224, 176, .16); }
.nova-stage .log.chats.locked li button { opacity: .45; cursor: not-allowed; pointer-events: none; }
