/* ============================================================
   展示循環（Attract Loop）— 編輯器樣式
   只在 attract 模式用到；不影響 story 模式既有節點外觀
   ============================================================ */

/* 各型別節點的辨識色：和劇情節點一樣是上緣色條，顏色由專案設定產生的動態樣式決定（applyProjectStyles，.node.attract-node.<型別>）。
   這裡只留保底色。2026-10-18 以前是左緣色條：這條規則在專案樣式之後載入、連顏色一起蓋掉，所以畫面上都是灰的（Jin 回報） */
.node.attract-node { border-top: 4px solid #8d99a6; }

/* 多出口節點（封面/隨機）的出口標籤列：埠對齊到每列中央 */
.node-attract-out {
    position: relative;
    /* 上下留白要撐開到「連線圓點不會疊在一起」——圓點直徑 24px，列距至少要 30px 以上。
       原本 3px 時列距只有 26px，兩顆圓點幾乎重疊，看起來像只有一個出口。 */
    padding: 8px 10px 8px 8px;
    margin-top: 4px;
    font-size: 12px;
    color: #cdd;
    background: rgba(255,255,255,0.05);
    border-radius: 4px;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 語意出口（如封面「按鍵」→主選單）：無連線圓點，弱化樣式標示不可連 */
.node-attract-out-semantic {
    color: #90a4c4;
    font-style: italic;
    background: rgba(120,150,220,0.08);
}

/* 展示循環編輯面板的節點說明（node-defs 的 panelNote） */
.attract-panel-note {
    font-size: 12px;
    color: #bcd;
    background: #1e2740;
    border-left: 3px solid #4a90d9;
    padding: 7px 9px;
    border-radius: 4px;
    line-height: 1.55;
}

/* toolbar：attract 節點新增鈕（進出模式改由深度選單切換） */
.attract-node-btn { display: none; }

/* ============================================================
   展示循環播放器（attract-player）
   ============================================================ */
.al-stage {
    position: absolute;
    inset: 0;
    background: #000;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    user-select: none;
}
.al-media { max-width: 100%; max-height: 100%; object-fit: contain; }
.al-cover-bg { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: cover; }
/* 封面背景模式：填滿裁切 / 等比留黑邊（圖片與影片共用，覆蓋上面兩條的 object-fit） */
.al-bg-fill { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: cover; }
/* 等比留邊時「邊」的顏色＝節點自己的背景色（_clear 設在舞台上），
   所以這裡不能自帶 background —— 帶了會蓋掉設計師設的背景色（Logo/警語都吃這條）。 */
.al-bg-fit { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: contain; }
.al-cover-title { position: absolute; top: 12%; left: 50%; transform: translateX(-50%); max-width: 60%; max-height: 35%; }
.al-cover-prompt {
    position: absolute;
    bottom: 14%;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    font-size: clamp(14px, 3vmin, 30px);
    text-shadow: 0 2px 8px rgba(0,0,0,0.8);
    text-align: center;
}
.al-blink { animation: alBlink 1.6s ease-in-out infinite; }
@keyframes alBlink { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
.al-notice-text {
    max-width: 78%;
    color: #ddd;
    font-size: clamp(12px, 2.4vmin, 24px);
    line-height: 1.9;
}
.al-placeholder { color: #667; font-size: clamp(12px, 2.5vmin, 22px); }
/* 浮水印：內容＝富文本、位置＝設計解析度座標（由 attract-player 以 inline style 定位／縮放）。
   下列只是「沒被富文本覆蓋時」的預設觀感；字級用設計解析度 px（整塊再乘 scale）。 */
.al-watermark {
    position: absolute;
    color: rgba(255,255,255,0.55);
    font-size: 28px;
    font-weight: bold;
    letter-spacing: 4px;
    white-space: nowrap;
    z-index: 5;
    pointer-events: none;
}
