/*
  Project: Aeterna Knot 內在頻率探索
  Version: v2.0.0
  Date: 2026-03-04
  Author: Gemini (小蔥)
  Description: 生命靈數大百科樣式表 (配合 Tailwind CSS 使用)
*/

/* 全域字體設定 */
body {
  font-family: "Noto Sans TC", sans-serif;
}

/* 九宮格容器設定 - 固定寬高以確保連線座標準確 */
.grid-container {
  width: 320px;
  height: 320px;
  position: relative;
  margin: 0 auto;
}

/* 單一格子設定 */
.grid-cell {
  height: 100px;
  width: 100px;
  position: relative;
  background: #fff;
  border: 1px solid #f1f5f9;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

/* 同心圓層級設定 - 顯示能量強度 */
.circle-layer {
  position: absolute;
  border: 2.5px solid #ef4444;
  border-radius: 50%;
  z-index: 10;
  max-width: 90px;
  max-height: 90px;
}

/* 連線通用設定 */
.connection-line {
  position: absolute;
  background: rgba(99, 102, 241, 0.4);
  border-radius: 10px;
  z-index: 50;
  display: none; /* 預設隱藏，由 JS 計算後控制顯示 */
  pointer-events: none;
}

/* --- 連線精確位置定義 (絕對定位) --- */

/* 橫向連線 */
.line-123 {
  bottom: 16%;
  left: 5%;
  right: 5%;
  height: 8px;
}

.line-456 {
  top: 50%; /* 垂直置中 */
  left: 5%;
  right: 5%;
  height: 8px;
  transform: translateY(-50%);
}

.line-789 {
  top: 16%;
  left: 5%;
  right: 5%;
  height: 8px;
}

/* 縱向連線 */
.line-147 {
  left: 16%;
  top: 5%;
  bottom: 5%;
  width: 8px;
}

.line-258 {
  left: 50%; /* 水平置中 */
  top: 5%;
  bottom: 5%;
  width: 8px;
  transform: translateX(-50%);
}

.line-369 {
  left: 84%;
  top: 5%;
  bottom: 5%;
  width: 8px;
}

/* 斜向連線 */
.line-159 {
  top: 5%;
  left: 5%;
  width: 135%; /* 根號2 約為 1.414，取 135% 覆蓋斜對角 */
  height: 8px;
  transform: rotate(45deg);
  transform-origin: top left;
}

.line-357 {
  top: 5%;
  right: 5%;
  width: 135%;
  height: 8px;
  transform: rotate(-45deg);
  transform-origin: top right;
}

/* 列印樣式設定 - 隱藏非報告內容 */
@media print {
  .no-print {
    display: none;
  }
}