/* ═══════════════════════════════════════════════════════
   PREMIUM EFFECTS — Scoped under .kc-page
   ═══════════════════════════════════════════════════════ */

/* ── 1. Liquid Glass Timer Panel — interactive platinum sheen ── */
.kc-timer-wrap::before{
  content:'';position:absolute;inset:0;border-radius:24px;
  background:radial-gradient(ellipse at var(--glass-x,50%) var(--glass-y,30%),
    rgba(207,216,220,0.18) 0%, transparent 55%);
  pointer-events:none;opacity:0.85;
  transition:opacity 0.3s;
  z-index:0;
}

/* ── 2. Neon Countdown Ring ── */
.kc-ring-arc{
  transition:stroke 0.8s ease, filter 0.8s ease;
}
.kc-ring.normal .kc-ring-arc{
  stroke:#1abc9c;
  filter:drop-shadow(0 0 8px rgba(26,188,156,0.35));
}
.kc-ring.warn .kc-ring-arc{
  stroke:#f1c40f;
  filter:drop-shadow(0 0 12px rgba(241,196,15,0.5));
}
.kc-ring.critical .kc-ring-arc{
  stroke:#e74c3c;
  filter:drop-shadow(0 0 18px rgba(231,76,60,0.55));
  animation:kcNeonPulse 1.2s ease-in-out infinite;
}
@keyframes kcNeonPulse{
  0%,100%{filter:drop-shadow(0 0 14px rgba(231,76,60,0.4))}
  50%{filter:drop-shadow(0 0 28px rgba(231,76,60,0.75))}
}
.kc-ring.idle .kc-ring-arc{
  stroke:var(--gold);filter:drop-shadow(0 0 12px rgba(201,168,76,0.25));
}

/* ── 3. Smart Final Seconds ── */
.kc-ring.final{
  transform:scale(1.15);
  transition:transform 0.6s cubic-bezier(0.34,1.56,0.64,1);
}
.kc-ring.final .kc-ring-time{
  animation:kcHeartbeat 1s ease-in-out infinite;
}
@keyframes kcHeartbeat{
  0%,100%{transform:scale(1)}
  30%{transform:scale(1.04)}
  50%{transform:scale(1)}
}

/* ── 4. Mirror Shine Sweep ── */
.kc-ring-time::after{
  content:'';position:absolute;
  top:-50%;left:-50%;width:200%;height:200%;
  background:linear-gradient(115deg,
    transparent 42%,rgba(255,255,255,0.25) 48%,
    rgba(255,255,255,0.08) 52%,transparent 58%);
  animation:kcShineSweep 20s linear infinite;
  pointer-events:none;
}
@keyframes kcShineSweep{
  0%,94%{transform:translateX(-120%)}
  97%{transform:translateX(120%)}
  100%{transform:translateX(120%)}
}

/* ── 5. Magnetic Buttons (CSS transition for snap-back) ── */
.kc-magnetic{
  transition:transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94);
  will-change:transform;
}

/* ── 6. Tactile Button Press ── */
.kc-btn:active,.kc-pt-btn:active,.kc-ded-btn:active,.kc-pen-row:active,
.kc-senshu-btn:active,.kc-dq-btn:active,.kc-icon-btn:active,.kc-period-btn:active{
  transform:translateY(2px) scale(0.97)!important;
  box-shadow:0 1px 4px rgba(0,0,0,0.12)!important;
  transition:transform 0.06s ease!important;
}
/* spring return */
.kc-btn,.kc-pt-btn,.kc-ded-btn,.kc-pen-row,
.kc-senshu-btn,.kc-dq-btn,.kc-icon-btn,.kc-period-btn{
  transition:transform 0.2s cubic-bezier(0.34,1.56,0.64,1),
             box-shadow 0.2s ease,border-color 0.2s ease;
}

/* ── 7. Championship Glow Scorecards ── */
.kc-fighter.aka{
  box-shadow:0 4px 24px rgba(0,0,0,0.06),0 0 0 1px rgba(192,32,32,0.15),
             0 0 28px rgba(192,32,32,0.08);
}
.kc-fighter.ao{
  box-shadow:0 4px 24px rgba(0,0,0,0.06),0 0 0 1px rgba(21,101,192,0.15),
             0 0 28px rgba(21,101,192,0.08);
}
.kc-score-flash{
  animation:kcScoreFlash 0.4s ease-out;
}
@keyframes kcScoreFlash{
  0%{transform:scale(1);filter:brightness(1)}
  35%{transform:scale(1.18);filter:brightness(1.6)}
  100%{transform:scale(1);filter:brightness(1)}
}

/* ── 8. Matte Split Theme (subtle tints) ── */
.kc-fighter.aka{background:linear-gradient(180deg,#fff 0%,rgba(255,240,240,0.7) 100%)}
.kc-fighter.ao{background:linear-gradient(180deg,#fff 0%,rgba(235,245,255,0.7) 100%)}

/* ── 9. Crowd Silence Mode ── */
.kc-page.kc-silence .kc-fighter{opacity:0.5;transition:opacity 0.5s}
.kc-page.kc-silence .kc-footer{opacity:0.4;transition:opacity 0.5s}
.kc-page.kc-silence .kc-pen-list{opacity:0.35}
.kc-page.kc-silence .kc-timer-wrap{opacity:1}
.kc-page.kc-silence .kc-controls{opacity:1}
.kc-page.kc-silence .kc-hero{
  background:#010410;border-bottom-color:rgba(201,168,76,0.25);
}
.kc-silence-btn{
  background:transparent;border:1px solid rgba(255,255,255,0.12);color:var(--fg);
  width:36px;height:36px;border-radius:var(--ks-r-control);cursor:pointer;font-size:15px;
  display:grid;place-items:center;transition:border-color .2s,background .2s;
}
.kc-silence-btn:hover{border-color:var(--gold-dim)}
.kc-silence-btn.active{background:rgba(201,168,76,0.15);border-color:var(--gold)}

/* ── 10. Full Screen Match Mode ── */
.kc-page.kc-matchmode{background:#050A14}
.kc-page.kc-matchmode .kc-topbar{display:none}
.kc-page.kc-matchmode .kc-hero{padding:0.8rem 1rem;border-bottom-width:2px}
.kc-page.kc-matchmode .kc-hero-title{font-size:clamp(1rem,3vw,1.4rem)}
.kc-page.kc-matchmode .kc-hero-lockup{height:clamp(32px,4vw,44px)}
.kc-page.kc-matchmode .kc-main{max-width:100%;padding:8px 16px}
.kc-page.kc-matchmode .kc-timer-wrap{
  background:rgba(10,19,36,0.85);backdrop-filter:blur(20px);
  border-color:rgba(201,168,76,0.2);
}
.kc-page.kc-matchmode .kc-ring{width:min(320px,65vw)}
.kc-page.kc-matchmode .kc-ring-time{
  color:#fff;font-size:clamp(50px,12vw,120px);
}
.kc-page.kc-matchmode .kc-status{color:#aaa}
.kc-page.kc-matchmode .kc-status.live{color:#4caf50}
.kc-page.kc-matchmode .kc-fighter{
  background:rgba(10,19,36,0.7);backdrop-filter:blur(10px);
  border-color:rgba(255,255,255,0.08);
}
.kc-page.kc-matchmode .kc-fighter.aka{
  background:linear-gradient(180deg,rgba(10,19,36,0.75),rgba(80,20,20,0.35));
}
.kc-page.kc-matchmode .kc-fighter.ao{
  background:linear-gradient(180deg,rgba(10,19,36,0.75),rgba(15,40,90,0.35));
}
.kc-page.kc-matchmode .kc-bigscore-num{
  font-size:clamp(80px,20vw,160px);
}
.kc-page.kc-matchmode .kc-fighter.aka .kc-bigscore-num{
  color:var(--aka-lt);text-shadow:0 0 30px rgba(192,32,32,0.4);
}
.kc-page.kc-matchmode .kc-fighter.ao .kc-bigscore-num{
  color:var(--ao-lt);text-shadow:0 0 30px rgba(21,101,192,0.4);
}
/* Hide non-essential in match mode */
.kc-page.kc-matchmode .kc-section-label,
.kc-page.kc-matchmode .kc-grid-3,
.kc-page.kc-matchmode .kc-grid-2,
.kc-page.kc-matchmode .kc-pen-list,
.kc-page.kc-matchmode .kc-senshu-btn,
.kc-page.kc-matchmode .kc-dq-btn,
.kc-page.kc-matchmode .kc-footer,
.kc-page.kc-matchmode .kc-page-footer,
.kc-page.kc-matchmode .kc-winner-banner{display:none!important}
.kc-page.kc-matchmode .kc-cell-label,
.kc-page.kc-matchmode .kc-cell-num{color:#ccc}
.kc-page.kc-matchmode .kc-cell{
  background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.08);
}
.kc-page.kc-matchmode .kc-corner-tag{font-size:18px;padding:10px 20px}
.kc-page.kc-matchmode .kc-btn{
  background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.15);
  color:#fff;
}
.kc-page.kc-matchmode .kc-btn-start{
  background:linear-gradient(180deg,rgba(201,168,76,0.25),rgba(201,168,76,0.08));
  border-color:rgba(201,168,76,0.45);
}
.kc-page.kc-matchmode .kc-period-btn{
  background:rgba(255,255,255,0.06);border-color:rgba(255,255,255,0.12);color:#ccc;
}
.kc-page.kc-matchmode .kc-period-btn.active{
  color:var(--gold);border-color:var(--gold);background:rgba(201,168,76,0.12);
}
/* Exit fullscreen button floating */
.kc-exit-fs{
  position:fixed;top:12px;right:12px;z-index:9999;
  background:rgba(10,18,40,0.85);border:1px solid rgba(201,168,76,0.35);
  color:var(--gold);padding:8px 16px;border-radius:var(--ks-r-control);cursor:pointer;
  font-weight:800;font-size:13px;letter-spacing:.1em;font-family:inherit;
  backdrop-filter:blur(8px);display:none;
  transition:transform 0.2s,box-shadow 0.2s;
}
.kc-exit-fs:hover{transform:scale(1.05);box-shadow:0 0 16px rgba(201,168,76,0.3)}
.kc-page.kc-matchmode .kc-exit-fs{display:block}

/* ── Reduced motion: disable ALL animations/pulses ── */
@media(prefers-reduced-motion:reduce){
  .kc-ring,.kc-ring-time,.kc-bigscore-num,.kc-fighter,
  .kc-ring-arc,.kc-btn-stop{
    animation:none!important;
    transition:none!important;
  }
  .kc-ring.final{transform:none!important}
  .kc-ring-time::after{animation:none!important;display:none}
  .kc-magnetic{transition:none!important}
  .kc-score-flash{animation:none!important}
}

/* Quick-score buttons flanking the timer (desktop) */
.kc-quickscore{
  display:flex;align-items:center;justify-content:center;gap:clamp(16px,3vw,32px);
  margin:12px 0 4px;
}
.kc-qs-side{
  display:flex;align-items:center;gap:8px;
}
.kc-qs-label{
  font-weight:900;letter-spacing:.15em;text-transform:uppercase;
  font-size:clamp(11px,1.2vw,14px);
}
.kc-qs-label.aka{color:var(--aka-lt)}
.kc-qs-label.ao{color:var(--ao-lt)}
.kc-qs-num{
  font-weight:900;font-size:clamp(24px,3vw,36px);
  min-width:30px;text-align:center;font-variant-numeric:tabular-nums;
}
.kc-qs-num.aka{color:var(--aka-lt)}
.kc-qs-num.ao{color:var(--ao-lt)}
.kc-qs-btn{
  width:clamp(36px,5vw,48px);height:clamp(36px,5vw,48px);
  border-radius:50%;border:2px solid rgba(255,255,255,0.2);
  background:rgba(255,255,255,0.04);color:rgba(255,255,255,0.7);
  font-size:clamp(18px,2.5vw,26px);font-weight:300;
  cursor:pointer;display:grid;place-items:center;
  transition:transform .08s,background .12s,border-color .15s;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.kc-qs-btn:hover{border-color:rgba(255,255,255,0.4);background:rgba(255,255,255,0.08)}
.kc-qs-btn:active{transform:scale(0.88);background:rgba(255,255,255,0.12)}
.kc-qs-btn.aka{border-color:rgba(192,32,32,0.4);color:var(--aka-lt)}
.kc-qs-btn.aka:hover{border-color:var(--aka);background:rgba(192,32,32,0.1)}
.kc-qs-btn.ao{border-color:rgba(21,101,192,0.4);color:var(--ao-lt)}
.kc-qs-btn.ao:hover{border-color:var(--ao);background:rgba(21,101,192,0.1)}