/*
 * NEXORIA 守り神（常駐オーブ）
 * - 全画面 canvas は使わない。
 * - 見た目の箱は 188px 四方だけ。
 * - クリックできるのは中心の小さな円だけ。
 */

.nexoria-guardian-layer {
  position: fixed;
  inset: 0;
  z-index: 760;
  pointer-events: none;
  overflow: hidden;
  contain: layout style paint;
  isolation: isolate;
}

.nexoria-guardian-layer[hidden] {
  display: none !important;
}

.nexoria-guardian-orb {
  position: absolute;
  top: 0;
  left: 0;
  width: 188px;
  height: 188px;
  pointer-events: none;
  opacity: .92;
  will-change: transform;
  transition:
    opacity .22s ease,
    filter .22s ease;
}

.nexoria-guardian-canvas {
  display: block;
  width: 188px;
  height: 188px;
  pointer-events: none;
  user-select: none;
  transition: opacity .9s ease;
}

/* 起動の間は「ロゴの N の後ろの丸い球体」（ロゴと同じ、ライムのガラスの大きな球）。
   動き出すと .9 秒でその球が縮んで、小さな相棒（canvas の光）だけになる（2026-10-07 Kim） */
.nexoria-guardian-orb::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 168px;
  height: 168px;
  margin: -84px 0 0 -84px;
  border-radius: 50%;
  pointer-events: none;
  background:
    radial-gradient(circle at 72% 30%, rgba(236, 255, 160, .85), rgba(196, 255, 60, .55) 22%, transparent 48%),
    radial-gradient(circle at 50% 50%, rgba(120, 170, 30, .42), rgba(40, 70, 10, .30) 62%, rgba(20, 30, 8, .05) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(214, 255, 120, .22),
    0 0 46px rgba(166, 255, 0, .22);
  opacity: 0;
  transform: scale(.24);
  transition:
    opacity .9s ease,
    transform .9s cubic-bezier(.2, .8, .2, 1);
}

html.nx-guardian-home .nexoria-guardian-orb::before {
  opacity: 1;
  transform: scale(1);
}

html.nx-guardian-home .nexoria-guardian-canvas {
  opacity: .55;
}

html.nx-guardian-home .nexoria-guardian-hit {
  pointer-events: none;
}

.nexoria-guardian-hit {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 58px;
  height: 58px;
  transform: translate(-50%, -50%);
  border: 0;
  border-radius: 50%;
  padding: 0;
  margin: 0;
  background: transparent;
  color: transparent;
  pointer-events: auto;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.nexoria-guardian-hit:hover {
  background: rgba(166, 255, 0, .045);
}

.nexoria-guardian-hit:focus-visible {
  outline: 2px solid rgba(166, 255, 0, .95);
  outline-offset: 4px;
  background: rgba(166, 255, 0, .055);
}

/*
 * スクロール中は目立たせず、
 * 読んでいる文章の邪魔をしない。
 */
.nexoria-guardian-layer.is-reading-rest
.nexoria-guardian-orb {
  opacity: .46;
}

/*
 * 危険時だけ少し存在感を強くする。
 * ここでは画面そのものを切り替えない。
 */
.nexoria-guardian-layer[data-mood="guard"]
.nexoria-guardian-orb {
  opacity: 1;
  filter: saturate(1.08);
}

/*
 * 監視停止中は少し静かにする。
 */
.nexoria-guardian-layer[data-mood="sleepy"]
.nexoria-guardian-orb {
  opacity: .70;
}

/*
 * Windows 側で
 * 「アニメーションを減らす」が有効な場合。
 *
 * guardian.js 側でも巡回を止めるため、
 * ここでは見た目だけ静止状態にそろえる。
 */
@media (prefers-reduced-motion: reduce) {
  .nexoria-guardian-orb {
    opacity: .82;
    transition: none;
    will-change: auto;
  }

  .nexoria-guardian-layer.is-reading-rest
  .nexoria-guardian-orb {
    opacity: .82;
  }

  .nexoria-guardian-hit {
    width: 54px;
    height: 54px;
  }
}