/* ==========================================================================
   卡片鼠标跟随灯效（纯色）
   --------------------------------------------------------------------------
   之前这份样式是从深色卡片 demo 直接搬过来的：
   - 选择器是 .card / .glow，而站内卡片叫 .profile-panel / .mask-panel /
     .panel-card / .nav-group，所以灯效根本没被渲染出来；
   - 里面的 * / body / h1 / p 全局规则会把整站排版冲掉（本文件在最后加载）。
   现在只保留灯效本身，作用到站内真实存在的卡片上，颜色为纯色。

   颜色、粗细、弧长都在下面 :root 里改，鼠标角度由 js/main.js 写入 --start。
   ========================================================================== */

:root {
    /* 纯色灯效颜色（默认取站点主色，可换成任意纯色） */
    --card-light-color: #C69A63;
    /* 灯带粗细 */
    --card-light-width: 2px;
    /* 灯带弧长（无单位，实际单位是 deg），数值越大尾巴越长 */
    --card-light-arc: 120;
    /* 没有鼠标数据时的默认角度，0 = 正上方 */
    --card-light-angle: 0;
    /* 亮起 / 熄灭的过渡时间 */
    --card-light-fade: 0.45s;
    /* 悬停时的外发光（在原卡片阴影上叠一层纯色光） */
    --card-light-shadow:
        var(--shadow-card, 0 22px 55px -22px rgba(122, 106, 80, 0.35)),
        0 0 0 1px rgba(198, 154, 99, 0.30),
        0 0 30px -10px rgba(198, 154, 99, 0.70);
}

/* --------------------------------------------------------------------------
   卡片外壳：给灯带一个定位容器
   -------------------------------------------------------------------------- */
:is(.profile-panel, .mask-panel, .panel-card, .nav-group) {
    position: relative;
    transition: box-shadow var(--card-light-fade) ease;
}

/* --------------------------------------------------------------------------
   沿卡片边缘游走的纯色灯带
   - inset: 0 让灯带贴合卡片内边缘，不会溢出被 overflow:hidden 裁掉
   - mask-composite 把渐变中间挖空、只留 padding 那一圈 → 得到「边框灯带」
   - conic-gradient 起始角 = 鼠标方向 - 半个弧长，灯带头部始终指向鼠标
   -------------------------------------------------------------------------- */
:is(.profile-panel, .mask-panel, .panel-card, .nav-group)::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 5;
    padding: var(--card-light-width);
    border-radius: inherit;
    background: conic-gradient(from calc((var(--start, var(--card-light-angle)) - var(--card-light-arc) * 0.5) * 1deg),
            transparent 0deg,
            var(--card-light-color) calc(var(--card-light-arc) * 0.5 * 1deg),
            transparent calc(var(--card-light-arc) * 1deg));
    /* 只保留外圈那一环 */
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--card-light-fade) ease;
}

/* 鼠标进入卡片（或键盘聚焦）：灯带亮起 + 外发光 */
:is(.profile-panel, .mask-panel, .panel-card, .nav-group):hover::after,
:is(.profile-panel, .mask-panel, .panel-card, .nav-group):focus-within::after {
    opacity: 0.95;
}

:is(.profile-panel, .mask-panel, .panel-card, .nav-group):hover,
:is(.profile-panel, .mask-panel, .panel-card, .nav-group):focus-within {
    box-shadow: var(--card-light-shadow);
}

/* 触屏设备没有鼠标跟随，直接关掉这层灯效 */
@media (hover: none) {

    :is(.profile-panel, .mask-panel, .panel-card, .nav-group)::after {
        display: none;
    }

    :is(.profile-panel, .mask-panel, .panel-card, .nav-group):hover,
    :is(.profile-panel, .mask-panel, .panel-card, .nav-group):focus-within {
        box-shadow: var(--shadow-card, 0 22px 55px -22px rgba(122, 106, 80, 0.35));
    }
}

/* 关闭动效时只留静态灯带，不做渐显 */
@media (prefers-reduced-motion: reduce) {

    :is(.profile-panel, .mask-panel, .panel-card, .nav-group),
    :is(.profile-panel, .mask-panel, .panel-card, .nav-group)::after {
        transition-duration: 0.01s;
    }
}