/* 設定在 html 或 body 確保全站套用 */
html, body {
    /* 1. 優先使用系統內建黑體，確保中英文風格一致 */
    font-family: ui-monospace, Consolas, "Microsoft JhengHei", monospace;

    /* 2. 讓字體渲染更細膩 (針對 macOS/iOS) */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    /* 3. 防止手機端字體自動縮放 */
    text-size-adjust: 100%;
	
	/* 移除所有點擊觸發的縮放與延遲 */
    touch-action: manipulation;
    
    /* 防止在 iOS 上長按圖片或連結彈出選單（選填） */
    -webkit-touch-callout: none;
    
    /* 防止文字選取（選填，適合全螢幕視覺作品） */
    -webkit-user-select: none;
    user-select: none;
}

/* 針對所有的 Form 元素（select、button、input）強制繼承字體 */
/* 注意：瀏覽器預設這些元素不會繼承 body 的字體，所以要特別寫這行 */
button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
}
#container { position: fixed; /* 改用 fixed 確保不會隨網頁滾動 */
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	display: block; 
	touch-action: none; /* 重要：防止瀏覽器攔截觸控事件 */
}

#overlay {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
	text-align: center; color: #999; cursor: pointer; z-index: 100;
	padding: 30px; border: 0px solid #000; transition: 0.4s; letter-spacing: 4px; font-size: 12px;
	background: rgba(0, 0, 0, 0.6);
	overflow: hidden; display: flex; align-items: center; justify-content: center;
}
#overlay:hover { background: rgba(0, 0, 0, 0.7); color: #fff; }

/* 這是「外圍發光層」 */
#${rootId} #overlay::before {
	content: '';
	position: absolute;
	
	/* 旋轉的漸層：這裡用稍微亮一點的灰白，模擬幽光 */
	background: conic-gradient(
		from 0deg,
		transparent 0%,
		rgba(0, 0, 0, 1.0) 15%, /* 這是流光的中心點 */
		transparent 40%
	);
	
	/* 【關鍵】大幅度模糊，讓它看起來是「暈」出來的，而不是一條線 */
	filter: blur(30px);
	
	/* 執行旋轉動畫 */
	animation: rotate-glow 6s linear infinite;
	
	/* 放在 overlay 背景的下方 */
	z-index: -1;
	border-radius: 50%; 
}

@keyframes rotate-glow {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

#link {
	position: absolute; bottom: 20px; left: 20px; font-size: 9px; color: #999;
	letter-spacing: 1px; pointer-events: auto; z-index: 101;
}

#ui-layer {
	position: fixed; top: 50%; left: 50%;
	z-index: 1100; pointer-events: auto; touch-action: auto;
	opacity: 0; transform: translate(-50%, -50%) scale(0.9); filter: blur(10px);
}

#ui-layer.show {
	opacity: 1;
	transform: translate(-50%, -50%) scale(1);
	filter: blur(0px);
	transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); /* 帶點彈性的曲線 */
}
