.screen{
  position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:1.2rem;overflow:auto;
  background:radial-gradient(ellipse at 50% 0%,rgba(37,99,235,.20),transparent 62%),rgba(5,8,16,.74);
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);animation:fadeIn .25s ease
}
.panel{width:min(640px,100%);padding:2.2rem 2rem;text-align:center;animation:riseIn .5s var(--ease) both}
.panel.narrow{width:min(440px,100%)}
.panel h1{font-size:clamp(2.1rem,7.5vw,3.5rem);font-weight:800;letter-spacing:-.02em;line-height:1.08;margin-bottom:.2rem}
.panel h1 span{background:linear-gradient(135deg,var(--primary-2),var(--amber));-webkit-background-clip:text;background-clip:text;color:transparent}
.panel h2{font-size:clamp(1.45rem,4.5vw,2.05rem);font-weight:800;margin-bottom:.3rem}
.lead{color:var(--muted);font-size:.97rem;line-height:1.9;margin:.9rem auto 1.45rem;max-width:46ch}
.diff-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-bottom:1.5rem}
.diff{
  padding:.85rem .5rem;border-radius:14px;border:1.5px solid var(--border);background:var(--panel-2);
  color:var(--text);cursor:pointer;font-family:inherit;transition:transform .18s var(--ease),border-color .2s,box-shadow .2s
}
.diff b{display:block;font-size:1rem;font-weight:800}
.diff span{display:block;font-size:.7rem;color:var(--muted);margin-top:.15rem}
.diff:hover{transform:translateY(-2px);border-color:var(--border-strong)}
.diff.is-active{border-color:var(--primary);background:linear-gradient(135deg,rgba(220,38,38,.24),rgba(37,99,235,.16));box-shadow:0 10px 28px rgba(220,38,38,.28)}
.keys{list-style:none;display:flex;flex-wrap:wrap;gap:.7rem 1.4rem;justify-content:center;margin-top:1.7rem;font-size:.79rem;color:var(--muted)}
.keys li{display:flex;align-items:center;gap:.35rem}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:.65rem;margin:1.4rem 0 .3rem}
.stats > div{padding:.85rem .4rem;border-radius:14px;background:var(--panel-2);border:1px solid var(--border)}
.stats .stat-label{display:block;font-size:.66rem;color:var(--muted);letter-spacing:.06em}
.stats b{display:block;font-size:1.55rem;font-weight:900;margin:.2rem 0 .1rem}
.stats small{color:var(--muted);font-size:.66rem}
.record{margin-top:1rem;font-weight:800;color:var(--amber);letter-spacing:.04em;animation:pulse 1.5s ease-in-out infinite}
#countdown{position:absolute;inset:0;z-index:25;display:grid;place-items:center;pointer-events:none}
#countdown-num{
  font-size:clamp(5rem,24vw,12rem);font-weight:900;color:#fff;
  text-shadow:0 0 70px rgba(220,38,38,.85),0 0 24px rgba(255,255,255,.5);animation:countIn .78s var(--ease)
}
#toast{
  position:absolute;bottom:1.6rem;left:50%;transform:translateX(-50%);z-index:30;
  padding:.7rem 1.35rem;border-radius:999px;font-size:.84rem;color:var(--text);
  background:var(--panel);border:1px solid var(--border-strong);backdrop-filter:blur(14px);animation:fadeIn .2s ease
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes riseIn{from{opacity:0;transform:translateY(26px) scale(.97)}to{opacity:1;transform:none}}
@keyframes countIn{from{opacity:0;transform:scale(.45)}55%{opacity:1;transform:scale(1.18)}to{opacity:1;transform:scale(1)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}