/* ============================================================
   彩剪 COLORCUT v77.12 · 五彩琉璃全面版 (07-rainbow.css)
   ─ 全站所有线条 / 边框 / 图案 / 按钮 统一为 ▶ 播放键同款五彩
   ─ 红橙黄绿青蓝紫流光配方：#ffd166 #ff9d58 #ff5fa8 #b06aff #4ad0ff #5cff9d
   ─ 印章启用开源篆书字体（开元小篆 OFL 1.1，见 fonts/FONT-LICENSE.txt）
   本文件最后加载，安全覆盖旧样式；只改观感，不改布局尺寸
   ============================================================ */

/* ---------- 0) 五彩配方变量 ---------- */
:root{
  --rc1:#ffd166;--rc2:#ff9d58;--rc3:#ff5fa8;--rc4:#b06aff;--rc5:#4ad0ff;--rc6:#5cff9d;
  --rc:linear-gradient(115deg,#ffd166 0%,#ff9d58 16%,#ff5fa8 34%,#b06aff 52%,#4ad0ff 72%,#5cff9d 88%,#ffd166 100%);
  --rcH:linear-gradient(90deg,#ffd166,#ff9d58,#ff5fa8,#b06aff,#4ad0ff,#5cff9d);
  --rcLine:linear-gradient(90deg,rgba(255,95,168,.5),rgba(176,106,255,.5),rgba(74,208,255,.5));
  --rcLineV:linear-gradient(180deg,rgba(255,95,168,.5),rgba(176,106,255,.5),rgba(74,208,255,.5));
  --rcGhost:linear-gradient(115deg,rgba(255,209,102,.4),rgba(255,95,168,.4),rgba(176,106,255,.4),rgba(74,208,255,.4));
  --rcGhostBg:linear-gradient(rgba(24,20,34,.55),rgba(24,20,34,.55));
}
@font-face{font-family:'SealFont';src:url('../fonts/seal.woff2') format('woff2');font-display:block}

/* ---------- 1) 全站渐变里的黄色残留 → 五彩 ---------- */
.btn.solid{background:linear-gradient(115deg,#ffd166 0%,#ff9d58 14%,#ff5fa8 32%,#b06aff 52%,#4ad0ff 72%,#5cff9d 88%,#ffd166 100%)}
.chip.on{background:linear-gradient(135deg,#ffd166,#ff9d58,#ff5fa8,#b06aff,#4ad0ff)}
.check.on .bx{background:linear-gradient(135deg,#ffd166,#ff9d58,#ff5fa8,#b06aff,#4ad0ff)}
#aiBgChips .chip.on{background:linear-gradient(135deg,#b06aff,#4ad0ff)}
.mhead::after{background:linear-gradient(90deg,transparent,#ffd166,#ff5fa8,#b06aff,#4ad0ff,transparent)}
#topbar #btnExport{background:linear-gradient(115deg,#ffd166 0%,#ff9d58 14%,#ff5fa8 32%,#b06aff 52%,#4ad0ff 72%,#5cff9d 88%,#ffd166 100%)}

/* ---------- 2) 面板与结构件的五彩长线 ---------- */
#pool{border-right:1px solid transparent;border-image:var(--rcLineV) 1}
#inspector{border-left:1px solid transparent;border-image:var(--rcLineV) 1}
#tl{border-top:1px solid transparent;border-image:var(--rcLine) 1}
#toolbar{border-bottom:1px solid transparent;border-image:var(--rcLine) 1}
#toolbar::before{background:linear-gradient(90deg,transparent,rgba(255,95,168,.18),rgba(74,208,255,.18),transparent)}
#controls{border-top:1px solid transparent;border-image:var(--rcLine) 1}
#trackHeads{border-right:1px solid transparent;border-image:var(--rcLineV) 1}
#trackHeads div{border-bottom:1px solid transparent;border-image:var(--rcLine) 1}
.track{border-bottom:1px solid transparent;border-image:linear-gradient(90deg,rgba(255,95,168,.3),rgba(176,106,255,.3),rgba(74,208,255,.3),rgba(92,255,157,.3)) 1}
.track{background-image:repeating-linear-gradient(90deg,transparent 0,transparent 59px,rgba(255,95,168,.07) 59px,rgba(255,95,168,.07) 60px,transparent 60px,transparent 119px,rgba(176,106,255,.07) 119px,rgba(176,106,255,.07) 120px,transparent 120px,transparent 179px,rgba(74,208,255,.07) 179px,rgba(74,208,255,.07) 180px,transparent 180px,transparent 239px,rgba(92,255,157,.07) 239px,rgba(92,255,157,.07) 240px)}
.sec{border-top:1px solid transparent;border-image:linear-gradient(90deg,rgba(255,95,168,.26),rgba(176,106,255,.26),rgba(74,208,255,.26)) 1}
.sec::before{background:var(--rcH)}
.credit{border-left:1px solid transparent;border-image:var(--rcLineV) 1}
.tsep{background:linear-gradient(180deg,transparent,rgba(255,95,168,.5) 30%,rgba(176,106,255,.5) 55%,rgba(74,208,255,.5) 75%,transparent)}
.diag-row{border-bottom:1px solid transparent;border-image:linear-gradient(90deg,rgba(255,95,168,.25),rgba(176,106,255,.25),rgba(74,208,255,.25)) 1}
.qlist{border:1px solid transparent;border-image:var(--rcLine) 1}
.qitem{border-bottom:1px solid transparent;border-image:linear-gradient(90deg,rgba(255,95,168,.2),rgba(176,106,255,.2),rgba(74,208,255,.2)) 1}
.qitem:last-child{border-bottom:none;border-image:none}
.fix-step{border:1px solid transparent;border-image:var(--rcGhost) 1}
.ai-note{border-top:1px dashed rgba(176,106,255,.38)}
.toast{border-color:transparent;border-image:linear-gradient(180deg,#ffd166,#ff5fa8,#b06aff,#4ad0ff) 1 / 1px 1px 1px 3px}
.ptitle::before,.ihead::before{background:var(--rc);box-shadow:0 0 8px rgba(255,95,168,.55)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(255,95,168,.55),rgba(176,106,255,.55),rgba(74,208,255,.55));border-radius:4px}
::-webkit-scrollbar-track{background:#0c0a12}

/* ---------- 3) 彩色文字点缀（渐变字） ---------- */
.mhead h3,#tcCur,.pval b,.row output,.guide b,.fix-step b,.credit{
  background:var(--rcH);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cv-tag{background:linear-gradient(90deg,#d9c8ff,#ffb7dd,#9be8ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cv-en,.cv-foot{color:#8f84c8}

/* ---------- 4) 按钮：全部换成五彩流光 ---------- */
.btn:not(.solid){border-color:transparent;background:var(--rcGhostBg) padding-box,var(--rc) border-box;background-size:auto,260% 100%;animation:solidFlow 6s ease-in-out infinite;color:#ddd5ec}
.btn:not(.solid):hover,.btn:not(.solid).on{color:#ffeaf6;box-shadow:0 0 16px rgba(255,95,168,.35),0 0 32px rgba(74,208,255,.18)}
.btn:not(.solid).on{background:linear-gradient(rgba(36,26,52,.7),rgba(36,26,52,.7)) padding-box,var(--rc) border-box;background-size:auto,260% 100%}
#topbar .btn:hover{border-color:transparent}
.cbtn:not(.big){border-color:transparent;background:var(--rcGhostBg) padding-box,var(--rc) border-box;background-size:auto,260% 100%;animation:solidFlow 6s ease-in-out infinite;color:#cfc6e4}
.cbtn:not(.big):hover{color:#ffeaf6;box-shadow:0 0 14px rgba(255,95,168,.35),0 0 28px rgba(74,208,255,.18)}
.tbtn{border-color:transparent;background:linear-gradient(rgba(20,17,28,.35),rgba(20,17,28,.35)) padding-box,var(--rcGhost) border-box}
.tbtn:hover{color:#ffeaf6;border-color:transparent;background:linear-gradient(rgba(34,24,50,.6),rgba(34,24,50,.6)) padding-box,linear-gradient(115deg,rgba(255,209,102,.8),rgba(255,95,168,.8),rgba(176,106,255,.8),rgba(74,208,255,.8)) border-box;box-shadow:0 0 14px rgba(255,95,168,.3),0 0 26px rgba(74,208,255,.15)}
.tbtn.on{color:#ffeaf6;border-color:transparent;background:linear-gradient(rgba(44,30,66,.72),rgba(44,30,66,.72)) padding-box,linear-gradient(115deg,#ffd166,#ff5fa8,#b06aff,#4ad0ff) border-box;box-shadow:0 0 16px rgba(255,95,168,.35),0 0 30px rgba(176,106,255,.2)}
.ibtn{border-color:transparent;background:linear-gradient(rgba(14,12,21,.92),rgba(14,12,21,.92)) padding-box,var(--rcH) border-box}
.ibtn:hover{border-color:transparent;color:#ffeaf6;box-shadow:0 0 12px rgba(255,95,168,.4)}
.chip{border-color:transparent;background:linear-gradient(rgba(18,15,27,.5),rgba(18,15,27,.5)) padding-box,var(--rcGhost) border-box}
.chip:hover{color:#ffeaf6;background:linear-gradient(rgba(34,24,50,.6),rgba(34,24,50,.6)) padding-box,linear-gradient(115deg,rgba(255,209,102,.75),rgba(255,95,168,.75),rgba(176,106,255,.75),rgba(74,208,255,.75)) border-box}
.chip.on{background-size:220% 220%;animation:solidFlow 6s ease-in-out infinite}
#verTag{border-color:transparent;background:linear-gradient(rgba(20,17,28,.5),rgba(20,17,28,.5)) padding-box,var(--rcGhost) border-box}
#verTag:hover{color:#ffeaf6;border-color:transparent;background:linear-gradient(rgba(34,24,50,.65),rgba(34,24,50,.65)) padding-box,linear-gradient(115deg,#ffd166,#ff5fa8,#4ad0ff) border-box}
#cvEnter{border:1px solid transparent;background:linear-gradient(rgba(16,13,24,.3),rgba(16,13,24,.3)) padding-box,var(--rc) border-box;background-size:auto,300% 100%;animation:solidFlow 5s ease-in-out infinite;color:#f5ecff}
#cvEnter:hover{background:var(--rc);background-size:300% 100%;color:#1a1024;box-shadow:0 0 40px rgba(255,95,168,.5),0 0 70px rgba(74,208,255,.3)}
@keyframes enterPulse{0%,100%{box-shadow:0 0 20px rgba(255,95,168,.28)}50%{box-shadow:0 0 44px rgba(74,208,255,.45)}}
.check .bx{border-color:rgba(176,106,255,.55)}

/* ---------- 5) 输入控件 ---------- */
select,input[type=number],textarea{border-color:transparent;background:linear-gradient(#0e0c15,#0e0c15) padding-box,var(--rcH) border-box}
select:focus,input[type=number]:focus,textarea:focus{border-color:transparent;outline:none;background:linear-gradient(#141127,#141127) padding-box,linear-gradient(115deg,#ffd166,#ff5fa8,#b06aff,#4ad0ff) border-box;box-shadow:0 0 14px rgba(176,106,255,.3)}
input[type=range]{background:linear-gradient(90deg,rgba(255,209,102,.65),rgba(255,95,168,.65),rgba(176,106,255,.65),rgba(74,208,255,.65),rgba(92,255,157,.65))}
.sw.on{outline-color:#b06aff;box-shadow:0 0 0 2px rgba(176,106,255,.4),0 0 12px rgba(255,95,168,.4)}
#dropzone{border:1px solid transparent;border-image:repeating-linear-gradient(90deg,rgba(255,95,168,.55) 0 6px,rgba(176,106,255,.55) 6px 12px,rgba(74,208,255,.55) 12px 18px) 1}
#dropzone:hover,#dropzone.over{border-color:transparent;border-image:repeating-linear-gradient(90deg,#ffd166 0 6px,#ff5fa8 6px 12px,#4ad0ff 12px 18px) 1;background:rgba(255,95,168,.07);color:#ffeaf6}

/* ---------- 6) 预览区图案：装裱框 / 取景角 / 贴纸选框 ---------- */
#pvFrame{border-color:rgba(176,106,255,.4);box-shadow:0 0 0 1px #191423,0 0 0 4px #0d0b13,0 0 0 5px #33284d,0 0 0 6px #0d0b13,0 0 0 7px rgba(176,106,255,.4),0 30px 80px -18px rgba(0,0,0,.95),0 0 60px rgba(255,95,168,.14),0 0 120px rgba(74,208,255,.12),0 0 200px rgba(176,106,255,.10)}
.vfc{border-color:transparent;border-image:linear-gradient(135deg,#ffd166,#ff5fa8,#b06aff,#4ad0ff) 1}
.pt{border-color:rgba(255,95,168,.5)}
.pt.sel{border-color:#ff5fa8;box-shadow:0 0 0 1px rgba(255,95,168,.7)}
#addRectEl{border-color:#ff5fa8;background:rgba(255,95,168,.12)}
#pvStatus{border-color:rgba(176,106,255,.45)}
#emptyHint .dm{border:1px solid transparent;background:linear-gradient(rgba(14,12,21,.6),rgba(14,12,21,.6)) padding-box,var(--rc) border-box;box-shadow:0 0 24px rgba(255,95,168,.35),0 0 44px rgba(74,208,255,.2)}
#emptyHint .dm::after{background:var(--rcH)}

/* ---------- 7) 时间轴图案：片段 / 播放头 ---------- */
.clip{background:linear-gradient(180deg,#221e30,#171420);border-color:#443761}
.clip.txt{background:linear-gradient(180deg,#2a2138,#1d1728);border-color:#64508f}
.clip.txt .lab{color:#e8d9ff}
.clip.aud{background:linear-gradient(180deg,#15251d,#0f1a14);border-color:#2e5a44}
.clip.sel{border-color:#ffb7dd;box-shadow:0 0 0 1px rgba(255,183,221,.9),0 0 18px rgba(255,95,168,.28),0 0 32px rgba(122,92,255,.16)}
.clip .lab{color:#cfc4e8}
.clip .lab b{color:#ffd166}
.clip .spd{color:#9be8ff}
.clip.sel .hd::after{background:#ffb7dd}
.track.dropping{background-color:rgba(176,106,255,.08)}
#ph::before{border:none;top:-8px;left:-5.5px;width:11px;height:8px;background:linear-gradient(135deg,#ffd166,#ff5fa8 55%,#b06aff);clip-path:polygon(0 0,100% 0,50% 100%)}

/* ---------- 8) 弹窗与杂项图案 ---------- */
.prog{background:#1d1826}
.prog .pin{background:linear-gradient(135deg,#ffd166,#ff5fa8,#b06aff);box-shadow:0 0 8px rgba(255,95,168,.8)}
.done-icon{border:2px solid transparent;border-radius:50%;background:linear-gradient(rgba(20,16,30,.4),rgba(20,16,30,.4)) padding-box,var(--rc) border-box;box-shadow:0 0 24px rgba(255,95,168,.3),0 0 44px rgba(74,208,255,.18)}
.dot.mid{background:#b06aff}
.qitem.on{color:#ffb7dd;background:rgba(255,95,168,.06)}
.asset:hover{border-color:rgba(176,106,255,.6)}
.asset .th .tag{color:#9be8ff}
.asset .th svg,#poolEmpty svg{color:#b9a8e8}
.guide kbd{border-color:transparent;background:linear-gradient(rgba(20,17,28,.5),rgba(20,17,28,.5)) padding-box,linear-gradient(115deg,rgba(255,95,168,.55),rgba(74,208,255,.55)) border-box;color:#9be8ff}
.mark{border:1.5px solid transparent;background:linear-gradient(#0e0c15,#0e0c15) padding-box,var(--rc) border-box;background-size:auto,300% 100%;animation:solidFlow 6s ease-in-out infinite;box-shadow:0 0 12px rgba(255,95,168,.5),0 0 24px rgba(74,208,255,.28)}
#cover::before{border:1px solid transparent;border-image:linear-gradient(135deg,rgba(255,209,102,.55),rgba(255,95,168,.5),rgba(176,106,255,.5),rgba(74,208,255,.55)) 1}
#cover::after{border:1px solid transparent;border-image:linear-gradient(135deg,rgba(255,209,102,.22),rgba(255,95,168,.2),rgba(176,106,255,.2),rgba(74,208,255,.22)) 1}

/* ---------- 9) ▶ 播放键：主体升级为饱和五彩釉 ---------- */
#controls #btnPlay{
  color:#26130a;
  background:
    radial-gradient(130% 130% at 30% 20%,rgba(255,255,255,.9) 0%,rgba(255,255,255,.35) 20%,rgba(255,255,255,0) 46%),
    conic-gradient(from 215deg,#ffd166,#ff9d58,#ff5fa8,#b06aff,#4ad0ff,#5cff9d,#ffd166);
  box-shadow:
    inset 0 2px 3px rgba(255,255,255,.8),
    inset 0 -3px 6px rgba(90,20,80,.4),
    0 3px 10px rgba(0,0,0,.55),
    0 0 18px rgba(255,95,168,.45),
    0 0 34px rgba(74,208,255,.25);
}
#controls #btnPlay:hover{box-shadow:
    inset 0 2px 3px rgba(255,255,255,.85),
    inset 0 -3px 6px rgba(90,20,80,.4),
    0 6px 16px rgba(0,0,0,.55),
    0 0 26px rgba(255,95,168,.5),
    0 0 52px rgba(74,208,255,.3)}
@keyframes gcBreath{
  0%,100%{box-shadow:inset 0 2px 3px rgba(255,255,255,.8),inset 0 -3px 6px rgba(90,20,80,.4),0 3px 10px rgba(0,0,0,.55),0 0 14px rgba(255,95,168,.4),0 0 22px rgba(176,106,255,.18)}
  50%{box-shadow:inset 0 2px 3px rgba(255,255,255,.8),inset 0 -3px 6px rgba(90,20,80,.4),0 3px 10px rgba(0,0,0,.55),0 0 26px rgba(255,95,168,.5),0 0 48px rgba(74,208,255,.3)}
}
/* ▶ 与小三角图标：五彩渐变填充（#rcg 由 index.html 注入） */
#controls .cbtn svg path,#pvFrame #pvBigPlay svg path,#topbar #btnShow svg path{fill:url(#rcg)}
#pvFrame #pvBigPlay svg{filter:drop-shadow(0 0 10px rgba(255,95,168,.7)) drop-shadow(0 0 22px rgba(74,208,255,.4))}
#pvFrame #pvBigPlay::after{background:radial-gradient(circle,rgba(255,95,168,.3) 0%,rgba(74,208,255,.16) 45%,transparent 70%)}

/* ---------- 10) 印章：篆书字体（字序已按传统右起竖排） ---------- */
.cv-seal{font-family:'SealFont','Noto Serif SC','Songti SC','SimSun',serif;font-weight:400;font-size:21px}

/* ---------- 11) 降级与无障碍 ---------- */
@media (prefers-reduced-motion:reduce){
  .btn:not(.solid),.cbtn:not(.big),.tbtn,.chip.on,.mark,#cvEnter{animation:none!important}
}

/* ---------- v77.14 工具栏横向滑动条：五彩流光 ---------- */
#tbSlider{position:relative;height:10px;flex:none;display:flex;align-items:center;padding:0 10px;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}
#tbSlider[hidden]{display:none}
#tbSlider::before{content:'';flex:1;height:3px;border-radius:2px;background:linear-gradient(90deg,rgba(255,209,102,.28),rgba(255,95,168,.28),rgba(176,106,255,.28),rgba(74,208,255,.28));transition:opacity .2s}
#tbSlider:hover::before{background:linear-gradient(90deg,rgba(255,209,102,.5),rgba(255,95,168,.5),rgba(176,106,255,.5),rgba(74,208,255,.5))}
#tbThumb{position:absolute;top:50%;left:10px;height:8px;width:60px;margin-top:-4px;border-radius:5px;background:linear-gradient(90deg,#ffd166,#ff5fa8,#b06aff,#4ad0ff,#ffd166);background-size:280% 100%;box-shadow:0 0 10px rgba(255,95,168,.55),0 0 20px rgba(74,208,255,.32);animation:tbFlow 3.2s linear infinite;cursor:grab}
#tbThumb:active{cursor:grabbing;box-shadow:0 0 14px rgba(255,95,168,.8),0 0 26px rgba(74,208,255,.5)}
@keyframes tbFlow{to{background-position:280% 0}}