/* LAST ORBIT - 디자인 토큰 */
:root {
  /* 배경 계열 */
  --bg-void:      #050A12;
  --bg-deep:      #0B1220;
  --bg-panel:     rgba(14, 24, 40, 0.78);
  --bg-panel-2:   rgba(20, 33, 54, 0.92);
  --bg-glass:     rgba(11, 20, 34, 0.72);

  /* 라인 / 테두리 */
  --line:         rgba(79, 195, 247, 0.28);
  --line-strong:  rgba(79, 195, 247, 0.55);
  --line-soft:    rgba(156, 190, 220, 0.16);

  /* 텍스트 */
  --tx:           #E8F1F8;
  --tx-dim:       #A9BDD1;
  --tx-faint:     #6C819A;

  /* 강조 */
  --acc:          #4FC3F7;
  --acc-dim:      #2E7FA8;
  --warn:         #FF7A5C;
  --ok:           #6FE3A8;
  /* Ko-fi 브랜드 퍼플 (타이틀 좌하단 후원 링크) */
  --kofi:         #794BC4;

  /* 캐릭터 테마 */
  --c-seira:      #4FC3F7;
  --c-noa:        #B39DDB;
  --c-rin:        #FFB74D;

  /* 타이포 */
  --ff-ui: "Pretendard", "Noto Sans KR", "Malgun Gothic", "맑은 고딕",
           system-ui, -apple-system, sans-serif;
  --ff-mono: "JetBrains Mono", "Consolas", "D2Coding", monospace;

  /* 사이즈 */
  --fs-body: 21px;
  --radius: 10px;
  --radius-lg: 16px;

  /* 모션 */
  --t-fast: 140ms;
  --t-mid: 280ms;
  --t-slow: 620ms;
  /* 표정 전환 디졸브. stage.js 의 POSE_FADE 와 같은 값이어야 한다 */
  --t-pose: 260ms;
  /* 커서 추종 지연. 둘의 '차이'가 트레일의 길이다 — 여기서만 조절한다 */
  --t-cur-dot: 90ms;
  --t-cur-ring: 250ms;
  --ease: cubic-bezier(.22,.61,.36,1);
}

* { box-sizing: border-box; }

html, body {
  margin: 0; padding: 0; height: 100%;
  background: var(--bg-void);
  color: var(--tx);
  font-family: var(--ff-ui);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}

/* 텍스트 드래그/선택 방지.
 * 대사 진행이 화면 클릭이라, 손이 조금만 밀려도 지문이 블록 선택된다.
 * 이미지·SVG 도 끌면 브라우저 기본 드래그 고스트가 떠서 같이 막는다. */
html, body {
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

img, svg { -webkit-user-drag: none; }

/* 입력 요소는 예외. 이름 입력에서 선택/커서 이동까지 막히면 안 된다. */
input, textarea, [contenteditable] {
  -webkit-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

button { font-family: inherit; color: inherit; cursor: pointer; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: rgba(0,0,0,.3); }
::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: var(--acc); }

/* 근미래 HUD 모서리 브래킷 */
.hud-bracket { position: relative; }
.hud-bracket::before, .hud-bracket::after {
  content: ""; position: absolute; width: 16px; height: 16px;
  border: 2px solid var(--line-strong); pointer-events: none;
}
.hud-bracket::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.hud-bracket::after  { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }

/* 스캔라인 오버레이 */
.scanlines::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 90;
  background: repeating-linear-gradient(
    to bottom, rgba(255,255,255,.022) 0 1px, transparent 1px 3px);
  mix-blend-mode: overlay;
}