MediaWiki:KuranokaFX.css：修订间差异

2026年10月16日 (五) 14:04的版本

/* STORMBREAK VI — Kuranoka only. Requires JS to add kk-stormbreak-v4 class.
   Does NOT change article typography, colors, font sizes, heading layouts, or Citizen components. */
html.kk-stormbreak-v4 #kk4-pressure,
html.kk-stormbreak-v4 #kk4-sky,
html.kk-stormbreak-v4 #kk4-rain,
html.kk-stormbreak-v4 #kk6-fracture {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  pointer-events: none !important;
  user-select: none !important;
  overflow: hidden !important;
  visibility: hidden;
  transform-origin: center center;
  contain: strict;
}
html.kk-stormbreak-v4 #kk4-pressure {z-index: 408; background: radial-gradient(ellipse 81% 78% at 51% 47%, transparent 27%, rgba(1,6,15,.17) 49%, rgba(0,2,8,.86) 96%), linear-gradient(180deg,rgba(0,5,18,.9),rgba(7,15,29,.07) 56%,rgba(1,5,14,.76));}
html.kk-stormbreak-v4 #kk4-sky {z-index: 409; will-change: transform;}
html.kk-stormbreak-v4 #kk4-rain {z-index: 410; will-change: transform;}
html.kk-stormbreak-v4 #kk6-fracture {z-index: 411; will-change: transform; opacity:.95;}
html.kk-stormbreak-v4.kk-v4-on #kk4-pressure,
html.kk-stormbreak-v4.kk-v4-on #kk4-sky,
html.kk-stormbreak-v4.kk-v4-on #kk4-rain,
html.kk-stormbreak-v4.kk-v4-on #kk6-fracture {visibility: visible;}
/* Protect the central copy without painting over or altering its actual text. */
html.kk-stormbreak-v4 #kk4-sky {
  -webkit-mask-image: radial-gradient(ellipse 62% 61% at 49% 50%, rgba(0,0,0,.12) 3%, rgba(0,0,0,.44) 55%, #000 99%);
  mask-image: radial-gradient(ellipse 62% 61% at 49% 50%, rgba(0,0,0,.12) 3%, rgba(0,0,0,.44) 55%, #000 99%);
}
/* Defeat lingering V2/V3 visual widgets if the browser was previously caching old sheets. */
html.kk-stormbreak-v4 #kk-stormbreak-controls,
html.kk-stormbreak-v4 #kk-stormbreak-canvas,
html.kk-stormbreak-v4 #kk-stormbreak-atmosphere,
html.kk-stormbreak-v4 #kk-sb3-sky,
html.kk-stormbreak-v4 #kk-sb3-glass,
html.kk-stormbreak-v4 #kk-sb3-choke {display:none!important;}
@media (max-width:680px){
  html.kk-stormbreak-v4 #kk4-sky {
    -webkit-mask-image:radial-gradient(ellipse 70% 68% at 49% 49%,rgba(0,0,0,.12) 5%,rgba(0,0,0,.43) 58%,#000 100%);
    mask-image:radial-gradient(ellipse 70% 68% at 49% 49%,rgba(0,0,0,.12) 5%,rgba(0,0,0,.43) 58%,#000 100%);
  }
}
@media (prefers-reduced-motion:reduce){
  html.kk-stormbreak-v4 #kk4-pressure,
  html.kk-stormbreak-v4 #kk4-sky,
  html.kk-stormbreak-v4 #kk4-rain,
  html.kk-stormbreak-v4 #kk6-fracture {display:none!important;}
}
@media print{
  html.kk-stormbreak-v4 #kk4-pressure,
  html.kk-stormbreak-v4 #kk4-sky,
  html.kk-stormbreak-v4 #kk4-rain,
  html.kk-stormbreak-v4 #kk6-fracture {display:none!important;}
}

html.kk-stormbreak-v4 #kk4-rain {
  /* Uniform full-width rainfall, with only a slight central readability cutout. */
  -webkit-mask-image:radial-gradient(ellipse 95% 83% at 50% 48%,rgba(0,0,0,.83),#000 95%);
  mask-image:radial-gradient(ellipse 95% 83% at 50% 48%,rgba(0,0,0,.83),#000 95%);
}

/* Audio is only offered inline with Chapter II; no floating controls or overlay toolbar. */
html.kk-stormbreak-v4 .kk5-audio-toggle {
  float:right;
  font:inherit;
  font-size:12px;
  font-weight:500;
  letter-spacing:.025em;
  line-height:1.8;
  border:1px solid rgba(83,125,165,.35);
  border-radius:5px;
  color:inherit;
  background:rgba(121,158,185,.10);
  padding:1px 8px;
  margin:3px 0 3px 8px;
  cursor:pointer;
  opacity:.72;
}
html.kk-stormbreak-v4 .kk5-audio-toggle:hover,
html.kk-stormbreak-v4 .kk5-audio-toggle:focus-visible{opacity:1;background:rgba(121,158,185,.23);}
html.kk-stormbreak-v4 .kk5-audio-toggle:focus-visible{outline:2px solid currentColor;outline-offset:2px;}
@media(max-width:680px){html.kk-stormbreak-v4 .kk5-audio-toggle{font-size:11px;padding:0 5px;}}

/* Fragment layer is separate from article text; no text or Citizen styles changed. */
html.kk-stormbreak-v4 #kk6-fracture {mix-blend-mode:normal;}