跳转到内容
打开/关闭菜单
  • 451 条目
  • 806 文件
  • 22 用户
  • 9205 编辑
Blockland Wiki
打开/关闭外观设置菜单
打开/关闭个人菜单
未登录
未登录用户的IP地址会在进行任意编辑后公开展示。

MediaWiki:KuranokaPageTransition.js:修订间差异

MediaWiki界面页面
无编辑摘要
无编辑摘要
 
(未显示同一用户的34个中间版本)
第1行: 第1行:
/* ====================================================================
/* ============================================================
   KURANOKA / KURONATA V9 — FATE / EROSION
   Kuranoka / Kuronata — Page Transition V40 / V25 faithful restore
   MediaWiki:KuranokaPageTransition.js
   V25 ORIGINAL fire edge, translucent fire pockets, smoke and dawn.
   Same-origin iframe + history.pushState: NO full reload on toggles.
   Lightweight WebGL2 is restricted to subtle ember points, NEVER the
   Hard chiaroscuro: preserved sky / incandescent tearing edge /
  fire curtain nor the reverse transition. Carbon sheets are 2D.
   persistent burning wake / residual soot / torn paper / blood-red world.
   Both cues start three seconds before the V25 curtains, fade in over
   Wiki easter eggs: [[Kuronata|...]] / [[Kuranoka|...]].
   those three seconds, then fade OUT over 18 seconds after reveal.
   Backgrounds are prewarmed on page load. Zero external dependencies.
   Only this page-scoped JS/CSS; never modify Citizen or loader.js.
   ==================================================================== */
   Real page navigation after the transition; iframe is visual-only.
(function () {
   ============================================================ */
(function initKkpt(retry) {
     'use strict';
     'use strict';
    retry=retry||0;
    if (!window.mw || !mw.config || typeof mw.config.get!=='function') {
        if(retry<40)setTimeout(()=>initKkpt(retry+1),100);
        return;
    }


    // The preview is a complete MediaWiki page. It must NOT spawn another.
    if (window !== window.top || window.__kkptV9) return;
    if (!window.mw || !mw.config) return;
    // The URL is the source of truth if a skin/extension restored a page
    // without immediately updating mw.config (soft navigation / bfcache).
     const pathMatch = location.pathname.match(/\/wiki\/(Kuranoka|Kuronata)\/?$/);
     const pathMatch = location.pathname.match(/\/wiki\/(Kuranoka|Kuronata)\/?$/);
     const urlPage = pathMatch ? pathMatch[1] : new URLSearchParams(location.search).get('title');
     const urlPage = pathMatch ? pathMatch[1]
     const basePage = ['Kuranoka', 'Kuronata'].includes(urlPage)
        : new URLSearchParams(location.search).get('title');
     const basePage = ['Kuranoka','Kuronata'].includes(urlPage)
         ? urlPage : mw.config.get('wgPageName');
         ? urlPage : mw.config.get('wgPageName');
     const action = new URLSearchParams(location.search).get('action') || 'view';
     const action = new URLSearchParams(location.search).get('action') || 'view';
     if (!['Kuranoka', 'Kuronata'].includes(basePage) || action !== 'view') return;
     if (!['Kuranoka','Kuronata'].includes(basePage) || action !== 'view') return;


     window.__kkptV9 = true;
     // V24: the two article worlds have deliberate, deterministic palettes.
     window.__kkptVersion = '9.0';
    // "os" is NOT a light theme: it can resolve to dark on the reader's
    // computer. Session storage may also be unavailable. Therefore, never
    // restore a stale "os" token when landing back on Kuranoka.
    const root=document.documentElement;
    const themeNames=['skin-theme-clientpref-day','skin-theme-clientpref-os',
        'skin-theme-clientpref-night','skin-theme-clientpref-black',
        'skin-citizen-light'];
    let wantsNight=basePage==='Kuronata';
    let changingTheme=false;
    function syncTheme(){
        if(changingTheme)return;
        const wanted=wantsNight?'skin-theme-clientpref-night':
            'skin-theme-clientpref-day';
        const shadow=wantsNight?'kkpt-kuronata-dark':null;
        const unexpected=themeNames.filter(c=>c!==wanted)
            .concat(wantsNight?[]:['kkpt-kuronata-dark']);
        if(root.classList.contains(wanted)&&
            (!shadow||root.classList.contains(shadow))&&
            unexpected.every(c=>!root.classList.contains(c))){
            return;
        }
        changingTheme=true;
        root.classList.remove(...themeNames,'kkpt-kuronata-dark');
        root.classList.add(wanted);
        if(shadow)root.classList.add(shadow);
        changingTheme=false;
    }
    function showTheme(dark){wantsNight=dark;syncTheme();}
     syncTheme();
    // Citizen may reapply OS-preference classes after its own scripts load.
    // Keep each world's class correct without changing the user's setting.
    new MutationObserver(syncTheme).observe(root,{
        attributes:true,attributeFilter:['class']
    });
    // V31's page-style retry solves occasional initial unstyled portals.
    function ensureWorldStyles(){
        if(!document.head || document.getElementById('kkpt-css-retry'))return;
        try{
            if(getComputedStyle(root).getPropertyValue('--kkpt-css-v40').trim()==='ready')return;
        }catch(_){}
        const link=document.createElement('link');
        link.id='kkpt-css-retry';
        link.rel='stylesheet';
        const target=new URL('/index.php',location.origin);
        target.searchParams.set('title','MediaWiki:KuranokaPageTransition.css');
        target.searchParams.set('action','raw');
        target.searchParams.set('ctype','text/css');
        target.searchParams.set('kkptv','40');
        link.href=target.href;
        document.head.appendChild(link);
    }
    setTimeout(ensureWorldStyles,1200);
    function navigateRealPage(href){
        window.location.assign(href);
    }


     // For the easter egg: links inside the Wiki are the default trigger.
     // V17: the dark-world extras run in *both* the visible document and
     // Change to true only if you also want the fixed switch button.
    // its same-origin preview iframe. They never alter other Wiki pages.
    const SHOW_FLOATING_BUTTON = false;
     function installKuronataAfterglow() {
        if(basePage!=='Kuronata'||window.__kkptDarkExtrasReady)return;
        window.__kkptDarkExtrasReady=true;
        const prefersReduced=window.matchMedia('(prefers-reduced-motion: reduce)');
        // Multiline .heimu cannot use a single nowrap pseudo-element:
        // it piles all copied text onto line one. Project each rendered
        // line into two SHORT clipped chromatic slices only on hover.
        // Range measurements leave the original article DOM and wrapping
        // entirely untouched, including italic/link children.
        const spoilerOverlays=new WeakMap();
        const renderedSpoilerLines=(node)=>{
            const lines=[];
            const walk=document.createTreeWalker(node,NodeFilter.SHOW_TEXT);
            const range=document.createRange();
            let text,budget=0;
            while((text=walk.nextNode())&&budget<340){
                for(let i=0;i<text.length&&budget<340;i++,budget++){
                    const ch=text.nodeValue[i];
                    if(ch==='\n'||ch==='\r')continue;
                    range.setStart(text,i);
                    range.setEnd(text,i+1);
                    const r=range.getBoundingClientRect();
                    if(!r.width||!r.height)continue;
                    let line=lines.find(row=>Math.abs(row.top-r.top)<3);
                    if(!line){
                        line={top:r.top,left:r.left,right:r.right,
                            height:r.height,text:''};
                        lines.push(line);
                    }
                    line.left=Math.min(line.left,r.left);
                    line.right=Math.max(line.right,r.right);
                    line.height=Math.max(line.height,r.height);
                    line.text+=ch;
                }
            }
            range.detach?.();
            return lines.sort((a,b)=>a.top-b.top);
        };
        const spoilerFault=(node)=>{
            if(prefersReduced.matches)return;
            const rects=node.getClientRects();
            if(rects.length<2)return;
            const lines=renderedSpoilerLines(node);
            if(lines.length<2)return;
            node.setAttribute('data-kkpt-multiline','1');
            spoilerOverlays.get(node)?.remove();
            const overlay=document.createElement('div');
            overlay.className='kkpt-heimu-fault';
            overlay.setAttribute('aria-hidden','true');
            const font=getComputedStyle(node);
            for(const row of lines){
                const fragment=document.createElement('span');
                fragment.className='kkpt-heimu-fault-line';
                fragment.dataset.copy=row.text;
                fragment.style.left=row.left+'px';
                fragment.style.top=row.top+'px';
                fragment.style.width=(row.right-row.left+6)+'px';
                fragment.style.height=(row.height+4)+'px';
                fragment.style.fontFamily=font.fontFamily;
                fragment.style.fontSize=font.fontSize;
                fragment.style.fontWeight=font.fontWeight;
                fragment.style.fontStyle=font.fontStyle;
                fragment.style.lineHeight=font.lineHeight;
                fragment.style.letterSpacing=font.letterSpacing;
                overlay.append(fragment);
            }
            document.body.append(overlay);
            spoilerOverlays.set(node,overlay);
        };
        const clearSpoilerFault=(node)=>{
            const overlay=spoilerOverlays.get(node);
            if(!overlay)return;
            spoilerOverlays.delete(node);
            overlay.classList.add('kkpt-fault-away');
            setTimeout(()=>overlay.remove(),210);
        };
        const decorateSpoilers=()=>{
            document.querySelectorAll('span.heimu').forEach(node=>{
                if(node.dataset.kkptBound)return;
                node.dataset.kkptBound='1';
                const label=(node.textContent||'').replace(/\s+/g,' ').trim();
                if(label&&label.length<=240&&!node.children.length)
                    node.setAttribute('data-kkpt-glitch',label);
                node.addEventListener('mouseenter',()=>spoilerFault(node));
                node.addEventListener('mouseleave',()=>clearSpoilerFault(node));
            });
        };
        const decorateLinks=()=>{
            const article=document.querySelector('#mw-content-text,.mw-parser-output');
            if(!article)return;
            article.querySelectorAll('a[href]').forEach(link=>{
                if(link.dataset.kkptLinkReady ||
                    link.classList.contains('kkpt-fate-gear') ||
                    link.querySelector('img,svg,video'))return;
                link.dataset.kkptLinkReady='1';
                link.classList.add('kkpt-link-glitch');
                try{
                    const url=new URL(link.href,document.baseURI);
                    const path=url.pathname.match(/\/wiki\/([^/?#]+)/);
                    const name=url.searchParams.get('title')||
                        (path?decodeURIComponent(path[1]):'');
                    if(url.origin===location.origin &&
                        name.replace(/_/g,' ')==='Kuranoka'){
                        link.classList.add('kkpt-link-origin');
                        // Copy a link only if it truly occupies one
                        // rendered line. Multiline links keep real text.
                        const label=(link.textContent||'').trim();
                        if(!link.children.length &&
                          link.getClientRects().length===1 &&
                          label.length>0&&label.length<100)
                            link.dataset.kkptLinkCopy=label;
                    }
                }catch(_){}
            });
        };
        // V29's useful identity faults, transplanted without its transition
        // shaders. Only text nodes are wrapped; Wiki links stay clickable.
        const decorateIdentityMentions=()=>{
            const article=document.querySelector('#mw-content-text,.mw-parser-output');
            if(!article)return;
            const hasIdentity=/Kuranoka|Kurano\s+Kanata|天野[ \u00a0\u3000]*彼方/i;
            const exactIdentity=/Kuranoka|Kurano\s+Kanata|天野[ \u00a0\u3000]*彼方/gi;
            const walker=document.createTreeWalker(article,NodeFilter.SHOW_TEXT,{
                acceptNode(node){
                    if(!node.nodeValue||!hasIdentity.test(node.nodeValue))
                        return NodeFilter.FILTER_REJECT;
                    const parent=node.parentElement;
                    if(!parent||parent.closest('script,style,textarea,code,pre,'+
                        'input,button,select,[contenteditable="true"],'+
                        '.kkpt-identity-glitch,.kkpt-heimu-fault,'+
                        'span.heimu,a.kkpt-link-origin,'+
                        '#kkpt-afterglow,#kkpt-toggle'))
                        return NodeFilter.FILTER_REJECT;
                    return NodeFilter.FILTER_ACCEPT;
                }
            });
            const matches=[];
            let node;
            while((node=walker.nextNode())&&matches.length<1800)matches.push(node);
            let index=0;
            for(const textNode of matches){
                const raw=textNode.nodeValue;
                const fragment=document.createDocumentFragment();
                let previous=0,match;
                exactIdentity.lastIndex=0;
                while((match=exactIdentity.exec(raw))){
                    if(match.index>previous)
                        fragment.append(document.createTextNode(raw.slice(previous,match.index)));
                    const el=document.createElement('span');
                    el.className='kkpt-identity-glitch';
                    el.dataset.kkptIdentity=match[0];
                    el.textContent=match[0];
                    el.style.setProperty('--kkpt-identity-delay',
                        (-((index++*7)%23)*.21).toFixed(2)+'s');
                    fragment.append(el);
                    previous=match.index+match[0].length;
                }
                if(previous<raw.length)
                    fragment.append(document.createTextNode(raw.slice(previous)));
                textNode.replaceWith(fragment);
            }
        };
        const createAmbience=()=>{
            if(prefersReduced.matches||document.getElementById('kkpt-afterglow')||!document.body)return;
            const overlay=document.createElement('div');
            overlay.id='kkpt-afterglow';
            overlay.setAttribute('aria-hidden','true');
            const el=(type,i)=>{
                const part=document.createElement('span');
                part.className=type==='soot'?'kkpt-soot-cell':'kkpt-ash-cell';
                const smoke=type==='soot';
                // All sprites are static layers with compositor-only
                // transform/opacity animation. No persistent canvas or RAF.
                // The soot is a side-bank haze, not a random full-screen
                // spread of isolated circular clouds.
                const fromLeft=i%2===0;
                part.style.left=(smoke
                    ? (fromLeft?-26+Math.random()*22:79+Math.random()*21)
                    : Math.random()*100)+'%';
                part.style.top=(smoke?8+Math.random()*94:15+Math.random()*94)+'%';
                part.style.setProperty('--size',(smoke?220+Math.random()*240:2+Math.random()*4).toFixed(1)+'px');
                part.style.setProperty('--delay',(-Math.random()*(smoke?29:18)).toFixed(2)+'s');
                part.style.setProperty('--duration',(smoke?18+Math.random()*14:8+Math.random()*11).toFixed(2)+'s');
                part.style.setProperty('--wind',((Math.random()-.5)*(smoke?100:230)).toFixed(1)+'px');
                return part;
            };
            for(let i=0;i<(innerWidth<700?8:16);i++)overlay.append(el('soot',i));
            for(let i=0;i<30;i++)overlay.append(el('ash',i));
            document.body.append(overlay);
        };
        const init=()=>{
            decorateSpoilers();
            decorateLinks();
            decorateIdentityMentions();
            createAmbience();
            mw.hook('wikipage.content').add(()=>{
                decorateSpoilers();
                decorateLinks();
                decorateIdentityMentions();
            });
        };
        if(document.readyState==='loading')
            document.addEventListener('DOMContentLoaded',init,{once:true});
        else init();


    const otherPage = basePage === 'Kuranoka' ? 'Kuronata' : 'Kuranoka';
        // One brief spatial fault roughly every 14-36 seconds, never a
    const baseUrl = location.href;
        // full-screen white strobe. Pause while the iframe is hidden.
    const baseTitle = document.title;
        const pulse=()=>{
    const otherUrl = new URL('/wiki/' + encodeURIComponent(otherPage), location.href);
            const inactive=document.hidden||prefersReduced.matches||
    const clipSide = basePage === 'Kuranoka' ? 'right' : 'left';
                root.classList.contains('kkpt-frame-inactive')||
    const hideClip = clipSide === 'right' ? 'inset(0 0 0 100%)' : 'inset(0 100% 0 0)';
                root.classList.contains('kkpt-world-suspended')||
    const sleep = ms => new Promise(r => setTimeout(r, ms));
                (window!==window.top&&window.frameElement?.getAttribute('aria-hidden')==='true');
    const smooth = t => t * t * (3 - 2 * t);
            if(!inactive){
     const imagePool = new Map();
                root.style.setProperty('--kkpt-rift-y',(14+Math.random()*70).toFixed(1)+'%');
                root.classList.add('kkpt-rift');
                window.setTimeout(()=>root.classList.remove('kkpt-rift'),390);
            }
            window.setTimeout(pulse,5000+Math.random()*15000);
        };
        window.setTimeout(pulse,5000+Math.random()*15000);
     }
    installKuronataAfterglow();


     let active = false; // false: original top-level doc; true: otherPage iframe
    // The nested preview only applies its own theme; no recursive iframe.
    if (window!==window.top || window.__kkptV12) return;
    window.__kkptV12=true;
    window.__kkptVersion='40.0';
 
    // Easter eggs + Infobox gear are the default. No floating pill.
    const SHOW_FLOATING_BUTTON=false;
    const otherPage=basePage==='Kuranoka'?'Kuronata':'Kuranoka';
    const baseUrl=location.href;
    const baseTitle=document.title;
    const otherUrl=new URL('/wiki/'+encodeURIComponent(otherPage),location.href);
    const clipSide=basePage==='Kuranoka'?'right':'left';
    const hideClip=clipSide==='right'?'inset(0 0 0 100%)':'inset(0 100% 0 0)';
    const sleep=ms=>new Promise(r=>setTimeout(r,ms));
    // C2-smooth cinematic ease; starts and settles with zero acceleration.
    // Its midpoint stays at t=.5, preserving 00:33 / 02:39 beat alignment.
    const smooth=t=>{t=Math.max(0,Math.min(1,t));
        return t*t*t*(t*(t*6-15)+10);};
    const imagePool=new Map();
    // V24: preload both original background photographs. The target
    // image is decoded while its real-document iframe is preparing,
    // reducing flashes of the bare background-color at navigation.
    const worldBackdrops={
        Kuranoka:'https://blockland.wiki/images/0/05/%E7%A7%AF%E9%9B%A8%E4%BA%911.png',
        Kuronata:'https://blockland.wiki/images/a/ab/%E9%BB%84%E6%98%8F%EF%BC%8C%E9%BB%91%E4%BA%91.png'
    };
    function primeWorldBackdrops(){
        const current=worldBackdrops[basePage];
        if(current&&document.head){
            const link=document.createElement('link');
            link.rel='preload';
            link.as='image';
            link.href=current;
            link.setAttribute('fetchpriority','high');
            link.dataset.kkptBackgroundPreload='1';
            document.head.appendChild(link);
            warmImage(current).catch(()=>{});
        }
        // Give the current photo first priority; then prepare the next
        // world so the iframe and the eventual real page can reuse it.
        setTimeout(()=>{
            const next=worldBackdrops[otherPage];
            if(next)warmImage(next).catch(()=>{});
        },300);
    }
    primeWorldBackdrops();
 
    const ENABLE_TRANSITION_AUDIO = true;
    const FIRE_VOLUME = .30;
    const DAWN_VOLUME = .20;
     let soundContext=null,fireBuffer=null,activeSound=null;
 
    // Public-domain PADsynth recording, ~8.4s / 120KB. Change this
    // to a same-origin Wiki-upload URL if external media are blocked.
    const REBIRTH_PAD_URL=
        'https://upload.wikimedia.org/wikipedia/commons/e/ed/Padsynth_example_synth_piano.ogg';
    let padBytesPromise=null,padDecodePromise=null,padBuffer=null;
    function preloadRebirthPad(){
        if(padBytesPromise)return padBytesPromise;
        padBytesPromise=fetch(REBIRTH_PAD_URL,{mode:'cors',cache:'force-cache'})
            .then(resp=>{
                if(!resp.ok)throw new Error('PAD HTTP '+resp.status);
                return resp.arrayBuffer();
            })
            .catch(err=>{
                console.debug('[KKPT] PAD file unavailable:',err);
                return null;
            });
        return padBytesPromise;
    }
    function decodeRebirthPad(ctx){
        if(padBuffer)return Promise.resolve(padBuffer);
        if(!padDecodePromise){
            padDecodePromise=preloadRebirthPad()
                .then(bytes=>bytes?ctx.decodeAudioData(bytes.slice(0)):null)
                .then(result=>(padBuffer=result))
                .catch(err=>{
                    console.debug('[KKPT] Cannot decode PAD:',err);
                    return null;
                });
        }
        return padDecodePromise;
    }
    // A plain media element can still play the recording when a site's
    // CORS policy disallows reading the file into Web Audio.
    function playRebirthPadFallback(durationMs){
        const sound=new Audio(REBIRTH_PAD_URL);
        sound.volume=0;
        sound.play().then(()=>{
            const begin=performance.now();
            const timer=setInterval(()=>{
                const t=Math.min(1,(performance.now()-begin)/durationMs);
                sound.volume=Math.max(0,Math.min(DAWN_VOLUME,
                    DAWN_VOLUME*Math.min(t/.27,(1-t)/.26)));
                if(t>=1){clearInterval(timer);sound.pause();sound.src='';}
            },80);
        }).catch(err=>console.debug('[KKPT] PAD playback unavailable:',err));
    }
 
    function primeSound(){
        if(!ENABLE_TRANSITION_AUDIO)return;
        try{
            const AudioEngine=window.AudioContext||window.webkitAudioContext;
            if(!AudioEngine)return;
            if(!soundContext)soundContext=new AudioEngine();
            if(soundContext.state==='suspended')soundContext.resume().catch(()=>{});
            decodeRebirthPad(soundContext);
        }catch(err){console.debug('[KKPT] Audio unavailable:',err);}
    }
    function createFireAudio(ctx){
        const length=Math.round(ctx.sampleRate*4.5);
        const buffer=ctx.createBuffer(1,length,ctx.sampleRate);
        const data=buffer.getChannelData(0);
        let low=0,middle=0;
        for(let i=0;i<length;i++){
            const random=Math.random()*2-1;
            low=low*.992+random*.008;
            middle=middle*.92+random*.08;
            data[i]=Math.max(-1,Math.min(1,
                low*3.9+middle*.33+random*.055));
        }
        // Micro-crackles: impulsive bursts with different decay times.
        for(let k=0;k<350;k++){
            const at=Math.floor(Math.random()*(length-1500));
            const decay=36+Math.random()*330;
            const duration=Math.min(1400,Math.ceil(decay*4));
            const power=.20+Math.pow(Math.random(),3)*.68;
            for(let j=0;j<duration;j++){
                const env=Math.exp(-j/decay);
                data[at+j]=Math.max(-1,Math.min(1,data[at+j]+
                    (Math.random()*2-1)*power*env));
            }
        }
        return buffer;
    }
    function transitionSound(dark,durationMs){
        const ctx=soundContext;
        if(!ctx||ctx.state!=='running')return;
        const start=ctx.currentTime+.018;
        const span=durationMs/1000;
        if(activeSound){
            const old=activeSound.gain;
            old.cancelScheduledValues(start);
            old.setTargetAtTime(.0001,start,.05);
        }
        const master=ctx.createGain();
        master.gain.setValueAtTime(.0001,start);
        master.gain.linearRampToValueAtTime(dark?FIRE_VOLUME:DAWN_VOLUME,
            start+(dark?.75:1.10));
        master.gain.setValueAtTime(dark?FIRE_VOLUME:DAWN_VOLUME,
            start+span-(dark?.88:1.0));
        master.gain.exponentialRampToValueAtTime(.0001,start+span);
        master.connect(ctx.destination);
        activeSound={gain:master};
        if(dark){
            if(!fireBuffer)fireBuffer=createFireAudio(ctx);
            const src=ctx.createBufferSource();
            src.buffer=fireBuffer;src.loop=true;
            const lowpass=ctx.createBiquadFilter();
            lowpass.type='lowpass';lowpass.frequency.value=2050;
            const bass=ctx.createBiquadFilter();
            bass.type='highpass';bass.frequency.value=55;
            src.connect(lowpass);lowpass.connect(bass);bass.connect(master);
            src.start(start);src.stop(start+span+.12);
        }else{
            // A REAL recorded PADsynth sample; no generated wind-chimes.
            decodeRebirthPad(ctx).then(buffer=>{
                if(!buffer){playRebirthPadFallback(durationMs);return;}
                const at=Math.max(start,ctx.currentTime+.020);
                if(at>start+span-.55)return;
                const player=ctx.createBufferSource();
                player.buffer=buffer;
                player.connect(master);
                player.start(at,Math.max(0,at-start)+.95);
                player.stop(start+span);
            }).catch(()=>{});
        }
        setTimeout(()=>{
            if(activeSound&&activeSound.gain===master)activeSound=null;
            try{master.disconnect();}catch(_){}
        },durationMs+350);
    }
 
    // Audio starts AT ITS TRANSITION SECTION, not at 00:00. Three seconds of
    // crescendo accompany the fate-wheel awakening. V25's actual fire and
    // particle painting remains unchanged. Music 00:33 / 02:39 now lands
    // in the MIDDLE of the corresponding original V25 reveal.
    const SCORE_KEY='kkpt:score-handoff:40';
    const SCORE_MUTE_KEY='kkpt:score-muted';
    const SCORES={
        Kuronata:{
            id:'marenoia',target:'Kuronata',
            url:'https://blkl.fun/wp-content/uploads/2026/10/Marenoia.mp3?kkpt_audio=v35',
            startAt:28.275,fireStart:31.275,fireEnd:34.725,
            stopAt:52.725,fadeInSeconds:3,fadeSeconds:18
        },
        Kuranoka:{
            id:'anotherme',target:'Kuranoka',
            url:'https://blkl.fun/wp-content/uploads/2026/10/AnotherMe.mp3?kkpt_audio=20261024_043627',
            startAt:154.45,fireStart:157.45,fireEnd:160.55,
            stopAt:178.55,fadeInSeconds:3,fadeSeconds:18
        }
    };
    let returnScore=null;
    let scoreOmen=null;
    let fatePrelude=null;
    function userWantsMute(){
        try{return sessionStorage.getItem(SCORE_MUTE_KEY)==='1';}
        catch(_){return false;}
    }
    const AUDIO_ICONS={
        speaker:'<path d="M11 5 6 9H3v6h3l5 4V5Z"/><path d="M15 9a5 5 0 0 1 0 6"/><path d="M18 6a9 9 0 0 1 0 12"/>',
        mute:'<path d="M11 5 6 9H3v6h3l5 4V5Z"/><path d="m16 9 5 6m0-6-5 6"/>',
        play:'<path d="m8 5 11 7-11 7V5Z"/>'
    };
    function updateAudioToggle(score){
        if(!score?.hud)return;
        const paused=score.blocked||score.audio.paused;
        const icon=paused?'play':score.audio.muted?'mute':'speaker';
        score.hud.innerHTML='<svg viewBox="0 0 24 24" fill="none" '+
            'stroke="currentColor" stroke-width="1.8" stroke-linecap="round" '+
            'stroke-linejoin="round" aria-hidden="true">'+AUDIO_ICONS[icon]+'</svg>';
        score.hud.setAttribute('aria-label',paused?'恢复播放':
            score.audio.muted?'取消静音':'静音');
        score.hud.setAttribute('aria-pressed',String(score.audio.muted));
        score.hud.classList.toggle('kkpt-audio-needs-resume',paused);
    }
    function mountAudioToggle(score){
        const old=document.getElementById('kkpt-audio-toggle');
        old?.remove();
        const hud=document.createElement('button');
        hud.type='button';hud.id='kkpt-audio-toggle';
        hud.setAttribute('aria-label','静音');
        score.hud=hud;
        document.body.append(hud);
        const audio=score.audio;
        hud.addEventListener('click',()=>{
            if(audio.paused||score.blocked){
                score.blocked=false;
                const resume=typeof score.resume==='function'?
                    score.resume():audio.play();
                Promise.resolve(resume).then(()=>{
                    updateAudioToggle(score);
                }).catch(err=>{
                    console.info('[KKPT] Audio resume blocked:',err);
                    score.blocked=true;updateAudioToggle(score);
                });
                updateAudioToggle(score);
                return;
            }
            audio.muted=!audio.muted;
            try{sessionStorage.setItem(SCORE_MUTE_KEY,audio.muted?'1':'0');}
            catch(_){}
            updateAudioToggle(score);
        });
        audio.addEventListener('play',()=>updateAudioToggle(score));
        audio.addEventListener('pause',()=>updateAudioToggle(score));
        updateAudioToggle(score);
    }
    function removeScoreOmen(){
        if(scoreOmen){
            const old=scoreOmen;
            const opacity=getComputedStyle(old).opacity;
            scoreOmen=null;
            old.style.opacity=opacity;
            old.classList.add('kkpt-omen-closing');
            // Let the V25 fire steadily replace the red veil. Abruptly
            // removing it at t=0 was the visible "turns bright" flash.
            requestAnimationFrame(()=>requestAnimationFrame(()=>{
                old.style.opacity='0';
            }));
            setTimeout(()=>old.remove(),1540);
        }
        document.body.classList.remove('kkpt-omen-running');
    }
    function startScoreOmen(score){
        if(score?.config?.id!=='marenoia'||scoreOmen)return;
        const omen=document.createElement('div');
        omen.id='kkpt-omen';omen.setAttribute('aria-hidden','true');
        omen.innerHTML='<i class="kkpt-omen-glow"></i>'+
            '<i class="kkpt-omen-line"></i>';
        document.body.append(omen);
        scoreOmen=omen;
        document.body.classList.add('kkpt-omen-running');
    }
    function clearFatePrelude(){
        fatePrelude?.remove();fatePrelude=null;
    }
    function releaseFatePrelude(){
        if(!fatePrelude)return;
        const node=fatePrelude;
        node.classList.add('kkpt-fate-merging');
        requestAnimationFrame(()=>{if(node.isConnected)node.style.opacity='0';});
    }
    function fateSigilMarkup(isDark){
        const at=(r,d)=>{
            const a=(d-90)*Math.PI/180;
            return [(150+Math.cos(a)*r).toFixed(2),
                (150+Math.sin(a)*r).toFixed(2)];
        };
        const ring=(r,cls)=>'<circle class="'+cls+
            '" cx="150" cy="150" r="'+r+'"/>';
        const stroke=(a,b,cls)=>'<path class="'+cls+
            '" d="M'+a.join(' ')+' L'+b.join(' ')+'"/>';
        const poly=(points,cls)=>'<polygon class="'+cls+'" points="'+
            points.map(p=>p.join(',')).join(' ')+'"/>';
        // An engraved astrolabe: four separately articulated scales,
        // star needles and micro-glyphs. The central emblem stays upright.
        const outer=ring(133,'kkpt-sigil-outer')+
            ring(128,'kkpt-sigil-orbit')+
            ring(121,'kkpt-sigil-ghost')+
            ring(105,'kkpt-sigil-seal')+
            ring(100,'kkpt-sigil-trace')+
            ring(83,'kkpt-sigil-ghost');
        const glyphs=Array.from({length:72},(_,i)=>{
            const angle=i*5;
            const major=i%6===0;
            return stroke(at(121,angle),at(major?132:i%3?125:128,angle),
                major?'kkpt-sigil-mark kkpt-sigil-major':'kkpt-sigil-mark');
        }).join('');
        const cardinal=Array.from({length:8},(_,i)=>{
            const a=i*45;
            return poly([at(99,a),at(111,a+4.2),at(120,a),at(111,a-4.2)],
                'kkpt-sigil-diamond')+
                stroke(at(85,a),at(96,a),'kkpt-sigil-needle');
        }).join('');
        const petals=Array.from({length:isDark?12:16},(_,i)=>{
            const a=i*360/(isDark?12:16);
            const mid=at(90,a),left=at(83,a-8),right=at(83,a+8);
            return '<path class="kkpt-sigil-filament" d="M'+left.join(' ')+
                ' Q'+mid.join(' ')+' '+right.join(' ')+'"/>';
        }).join('');
        const darkDrawing=
            '<path class="kkpt-sigil-dark-halo" d="M150 69L223 106 231 183 150 232 69 183 77 106Z"/>'+
            '<path class="kkpt-sigil-dark-halo" d="M150 75L201 99 225 150 201 201 150 225 99 201 75 150 99 99Z"/>'+
            '<path class="kkpt-sigil-thorn" d="M112 87L126 105 150 52 174 105 188 87 178 118 201 108 188 132M112 213L126 195 150 248 174 195 188 213 178 182 201 192 188 168"/>'+
            '<path class="kkpt-sigil-eye" d="M86 150Q116 111 150 118Q184 111 214 150Q184 189 150 182Q116 189 86 150Z"/>'+
            '<path class="kkpt-sigil-iris" d="M150 120Q176 140 176 150Q176 171 150 182Q124 171 124 150Q124 140 150 120Z"/>'+
            '<path class="kkpt-sigil-pupil" d="M150 127L158 150 150 174 142 150Z"/>'+
            '<path class="kkpt-sigil-fault" d="M78 105L105 119 95 135 115 148M224 191L197 180 206 165 185 152M149 65L141 85 157 97 147 111"/>'+
            '<path class="kkpt-sigil-filament" d="M98 147Q75 133 69 115M202 153Q226 167 231 185M133 201Q150 218 167 201"/>'+
            ring(56,'kkpt-sigil-iris-ring');
        // Symmetrical, OPEN feather vanes wrap around the compass rather
        // than crisscrossing its center as V39 did.
        const wings=Array.from({length:4},(_,i)=>{
            const y=128+i*13;
            const tip=79-i*4;
            return '<path class="kkpt-sigil-feathers" d="M129 '+(y+11)+
                'C110 '+(y-12)+' '+(90-i*3)+' '+(y-12)+
                ' '+tip+' '+y+
                'Q102 '+(y+13)+' 124 '+(y+19)+
                'M171 '+(y+11)+'C190 '+(y-12)+
                ' '+(210+i*3)+' '+(y-12)+' '+(300-tip)+' '+y+
                'Q198 '+(y+13)+' 176 '+(y+19)+'"/>';
        }).join('');
        const rays=Array.from({length:12},(_,i)=>{
            const a=i*30;
            return poly([at(27,a-3),at(i%2?51:63,a),at(27,a+3)],
                'kkpt-sigil-sun-ray');
        }).join('');
        const hopeDrawing=
            rays+wings+
            '<path class="kkpt-sigil-horizon" d="M75 204Q111 192 150 201Q189 192 225 204M90 218Q150 199 210 218"/>'+
            '<path class="kkpt-sigil-horizon" d="M86 94Q118 76 150 96Q182 76 214 94"/>'+
            '<path class="kkpt-sigil-leaf" d="M92 195Q69 178 84 160Q93 179 111 186M208 195Q231 178 216 160Q207 179 189 186"/>'+
            '<path class="kkpt-sigil-star" d="M150 105L161 137 195 150 161 163 150 195 139 163 105 150 139 137Z"/>'+
            '<path class="kkpt-sigil-star-inner" d="M150 122L157 143 178 150 157 157 150 178 143 157 122 150 143 143Z"/>'+
            ring(12,'kkpt-sigil-sun')+
            '<circle class="kkpt-sigil-center" cx="150" cy="150" r="4"/>';
        return '<svg class="kkpt-fate-sigil '+(isDark?'kkpt-sigil-ominous':
            'kkpt-sigil-hope')+'" viewBox="0 0 300 300" '+
            'xmlns="http://www.w3.org/2000/svg" aria-hidden="true">'+
            '<g class="kkpt-sigil-engraving" fill="none" stroke="'+
                (isDark?'#ff8c9b':'#f7edcf')+'" stroke-width="1.3">'+
                outer+glyphs+cardinal+petals+
                (isDark?darkDrawing:hopeDrawing)+'</g></svg>';
    }
    function startFatePrelude(anchor,targetPage){
        clearFatePrelude();
        const box=anchor?.getBoundingClientRect?.();
        const x=box?box.left+box.width/2:innerWidth/2;
        const y=box?box.top+box.height/2:innerHeight/2;
        const prelude=document.createElement('div');
        prelude.id='kkpt-fate-prelude';
        prelude.setAttribute('aria-hidden','true');
        const isDark=targetPage==='Kuronata';
        prelude.className=isDark?'kkpt-fate-dark':'kkpt-fate-light';
        prelude.style.setProperty('--kkpt-fate-x',x+'px');
        prelude.style.setProperty('--kkpt-fate-y',y+'px');
        prelude.style.setProperty('--kkpt-fate-dx',(innerWidth/2-x)+'px');
        prelude.style.setProperty('--kkpt-fate-dy',(innerHeight/2-y)+'px');
        prelude.style.setProperty('--kkpt-fate-dx15',((innerWidth/2-x)*.15)+'px');
        prelude.style.setProperty('--kkpt-fate-dy15',((innerHeight/2-y)*.15)+'px');
        prelude.style.setProperty('--kkpt-fate-dx91',((innerWidth/2-x)*.91)+'px');
        prelude.style.setProperty('--kkpt-fate-dy91',((innerHeight/2-y)*.91)+'px');
        prelude.innerHTML='<div class="kkpt-fate-orbit">'+
            '<i class="kkpt-fate-aura"></i>'+
            '<i class="kkpt-fate-ring kkpt-fate-ring-a"></i>'+
            '<i class="kkpt-fate-ring kkpt-fate-ring-b"></i>'+
            '<i class="kkpt-fate-arc"></i>'+
            '<i class="kkpt-fate-spark"></i>'+
            '<i class="kkpt-fate-wave"></i>'+
            fateSigilMarkup(isDark)+'</div>';
        // The sigil is a viewport overlay. Keeping it outside the zoomed
        // Wiki body makes the clicked gear travel directly to true center.
        root.append(prelude);
        fatePrelude=prelude;
        // The 6.6s sigil overlaps the full V25 curtain:
        // NEVER delay 00:33/02:39 to prolong the visual spectacle.
        setTimeout(()=>{
            if(fatePrelude===prelude)clearFatePrelude();
            else prelude.remove();
        },6650);
    }
 
    // Actual transient analysis of the hosted Marenoia recording, 22.05 kHz
    // mono / spectral-flux + low-band kick envelope. A main beat repeats
    // roughly every 0.439 seconds (~137 BPM), with salient attacks near
    // 31.775, 33.561, 33.751 and 34.250s. React to audio.currentTime:
    // wall-clock timers would desynchronize during MP3 buffering/seeking.
    const MARENOIA_TRANSIENTS=[
        [28.453,.56],[28.682,.58],[28.892,.76],[29.121,.64],
        [29.341,.72],[29.570,.48],[29.780,.87],[30.009,.93],
        [30.438,.44],[30.658,.77],[30.887,.83],[31.356,.68],
        [31.556,.79],[31.775,.93],[32.364,.29],[32.883,.36],
        [33.192,.38],[33.561,1],[33.751,.97],[34.250,.86],
        [34.469,.54],[35.317,.86],[35.786,.69]
    ];
    // The fire segment only gets lightning. The pressure / dark vignette
    // belongs to the AFTERMATH and survives the real page navigation.
    function createMarenoiaBeatScene(score){
        if(score.config.id!=='marenoia')return null;
        const lightningLayer=document.createElement('div');
        lightningLayer.id='kkpt-lightning-layer';
        lightningLayer.setAttribute('aria-hidden','true');
        document.body.append(lightningLayer);
        let live=true,raf=0,lastTick=0,nextBeat=0,progress=0;
        let lastLightning=-100;
        function lightning(t,strength){
            if(!live||t<.11||t>.96)return;
            const w=Math.max(1,innerWidth),h=Math.max(1,innerHeight);
            const rng=(a,b)=>a+Math.random()*(b-a);
            const edge=w*(1-t);
            let x=Math.min(w*.93,Math.max(edge+35,edge+(w-edge)*.53));
            const top=rng(-70,-16),bottom=rng(h*.46,h*.80);
            const points=[[x,top]];
            const count=9;
            for(let i=1;i<=count;i++){
                const yy=top+(bottom-top)*i/count;
                const xx=x+rng(-39,39)*(i/count)+Math.sin(i*2.4)*14;
                points.push([Math.max(10,Math.min(w-10,xx)),yy]);
            }
            const path=points.map((p,i)=>(i?'L':'M')+
                p[0].toFixed(1)+','+p[1].toFixed(1)).join(' ');
            const branchAt=Math.floor(rng(3,7));
            const p=points[branchAt];
            const branch='M'+p[0].toFixed(1)+','+p[1].toFixed(1)+
                ' l'+rng(-46,46).toFixed(1)+','+rng(45,86).toFixed(1)+
                ' l'+rng(-28,28).toFixed(1)+','+rng(38,71).toFixed(1);
            const ns='http://www.w3.org/2000/svg';
            const svg=document.createElementNS(ns,'svg');
            svg.setAttribute('class','kkpt-storm-bolt');
            svg.setAttribute('viewBox','0 0 '+w+' '+h);
            svg.setAttribute('preserveAspectRatio','none');
            svg.style.opacity=String(Math.min(1,.46+strength*.42));
            svg.style.clipPath='inset(0 0 0 '+
                Math.max(0,(1-t)*100).toFixed(2)+'%)';
            const addPath=(d,klass)=>{
                const el=document.createElementNS(ns,'path');
                el.setAttribute('d',d);el.setAttribute('class',klass);
                svg.append(el);
            };
            addPath(path,'kkpt-bolt-haze');
            addPath(path,'kkpt-bolt-core');
            addPath(branch,'kkpt-bolt-branch');
            lightningLayer.append(svg);
            setTimeout(()=>svg.remove(),390);
        }
        function tick(now){
            if(!live)return;
            raf=requestAnimationFrame(tick);
            if(now-lastTick<30)return;lastTick=now;
            const audio=score.audio;
            const audioTime=audio.currentTime;
            while(nextBeat<MARENOIA_TRANSIENTS.length&&
                MARENOIA_TRANSIENTS[nextBeat][0]<=audioTime){
                const [moment,strength]=MARENOIA_TRANSIENTS[nextBeat++];
                if(audioTime-moment<.22){
                    if(progress>.11&&strength>.81&&moment-lastLightning>.18){
                        lightning(progress,strength);
                        lastLightning=moment;
                    }
                }
            }
        }
        raf=requestAnimationFrame(tick);
        return {
            update(t){progress=t;},
            finish(){
                live=false;cancelAnimationFrame(raf);
                setTimeout(()=>lightningLayer.remove(),450);
            },
            dispose(){
                live=false;cancelAnimationFrame(raf);
                lightningLayer.remove();
            }
        };
    }
 
    // Measured with the submitted MP3: heavy low-frequency accents repeat
    // every 8 beats (~3.532 s at 135.9 BPM). Each was 1.6–2.1x the
    // median low-band RMS of the seven intervening beats. Never trigger
    // a full-screen pressure pump on all of the fast intermediate notes.
    const AFTER_DARK_KEY='kkpt:dark-afterglow:40';
    const DAWN_HALO_KEY='kkpt:dawn-cloudbreak:40';
    const MARENOIA_EIGHT_BEAT_KICKS=[
        35.311,38.843,42.375,45.907,49.429
    ];
    // Offline 0.25s RMS contour, normalized by the passage's 95th
    // percentile. Tracks long-form dynamics without cross-origin
    // WebAudio sample access (which may be forbidden by CORS).
    const MARENOIA_LOUDNESS=[
        .61,.71,.98,1,.85,.96,.92,.72,.57,.54,.45,.46,
        .53,.54,.56,.63,.92,1,.88,.95,.94,.77,.61,.61,
        .52,.41,.46,.48,.44,.50,.81,1,.92,.98,.90,.80,
        .63,.58,.54,.61,.65,.67,.65,.69,.83,1,.90,.93,
        .94,.81,.65,.65,.66,.65,.62,.64,.60,.58,.70,1,
        .91,.90,.95,.83,.62,.58,.46,.54,.47,.57,.55,.63
    ];
    function marenoiaLoudness(time){
        const pos=Math.max(0,Math.min(MARENOIA_LOUDNESS.length-1,
            (time-34.75)*4));
        const i=Math.floor(pos),j=Math.min(MARENOIA_LOUDNESS.length-1,i+1);
        return MARENOIA_LOUDNESS[i]*(1-(pos-i))+
            MARENOIA_LOUDNESS[j]*(pos-i);
    }
    function marenoiaDeepPulse(age){
        // A 420ms inhale, 300ms hold and ~2.2s heavy exhale.
        // One pressure wave per eight beats, not a rapid heartbeat.
        if(age<0||age>=2.98)return 0;
        if(age<.42)return smooth(age/.42);
        if(age<.72)return 1;
        return 1-smooth((age-.72)/2.26);
    }
    let kuronataAftermath=null;
    function mountKuronataAftermath(score){
        if(kuronataAftermath){
            if(score)kuronataAftermath.attach(score);
            return kuronataAftermath;
        }
        const layer=document.createElement('div');
        layer.id='kkpt-beat-scene';
        layer.setAttribute('aria-hidden','true');
        layer.className='kkpt-beat-after kkpt-beat-idle';
        layer.innerHTML='<div class="kkpt-beat-focus"></div>'+
            '<div class="kkpt-beat-lens"></div>'+
            '<div class="kkpt-beat-fringe"></div>'+
            '<div class="kkpt-beat-rupture"></div>'+
            '<svg class="kkpt-beat-scars" viewBox="0 0 1440 900" '+
            'preserveAspectRatio="none" aria-hidden="true">'+
            '<path d="M-20 340L126 317 203 355 294 339 383 382 477 352 605 395 728 365 842 399 982 371 1125 397 1264 351 1460 390" />'+
            '<path d="M-20 635L158 605 294 646 404 612 547 668 679 622 846 653 991 621 1149 668 1277 636 1460 660" />'+
            '<path d="M203 355l-19 33 27 39M842 399l30 34-20 47M404 612l-44 42 23 29M1149 668l39 41-18 32"/>'+
            '</svg>';
        // Put the vignette outside the page-scale camera so its
        // darkness covers the WHOLE viewport even while the body zooms.
        root.append(layer);
        let live=true,raf=0,lastTick=0,source=null,lastKick=-100;
        let cameraReleaseTimer=null;
        let smoothPressure=0,index=0;
        const releaseCamera=()=>{
            root.style.setProperty('--kkpt-camera-zoom','1');
            clearTimeout(cameraReleaseTimer);
            cameraReleaseTimer=setTimeout(()=>{
                if(!live)root.classList.remove('kkpt-camera-running');
            },420);
        };
        const quiet=()=>{
            layer.style.setProperty('--kkpt-beat-dark','.60');
            layer.style.setProperty('--kkpt-beat-scale','1.025');
            layer.style.setProperty('--kkpt-beat-blur','0.28px');
            layer.style.setProperty('--kkpt-beat-glitch','.12');
            layer.style.setProperty('--kkpt-beat-shear','0px');
            layer.style.setProperty('--kkpt-beat-shear-reverse','0px');
            layer.style.setProperty('--kkpt-beat-scars','.035');
            root.style.setProperty('--kkpt-camera-zoom','1');
            root.style.setProperty('--kkpt-camera-focus-y',
                (scrollY+innerHeight*.5).toFixed(1)+'px');
            root.style.setProperty('--kkpt-chroma-red','0px');
            root.style.setProperty('--kkpt-chroma-shadow','0px');
        };
        function tick(now){
            if(!live)return;
            raf=requestAnimationFrame(tick);
            if(now-lastTick<38)return;
            const dt=Math.min(.12,Math.max(.038,(now-lastTick)/1000));
            lastTick=now;
            if(!source||source.failed||source.audio.ended||
                source.audio.currentTime>=source.config.stopAt-.02){
                source=null;layer.classList.add('kkpt-beat-idle');
                quiet();live=false;cancelAnimationFrame(raf);
                releaseCamera();
                return;
            }
            const audioTime=source.audio.currentTime;
            while(index<MARENOIA_EIGHT_BEAT_KICKS.length&&
                MARENOIA_EIGHT_BEAT_KICKS[index]<=audioTime){
                lastKick=MARENOIA_EIGHT_BEAT_KICKS[index++];
            }
            // The recording's actual loudness and 18s player fade BOTH
            // attenuate the pump as the music settles down.
            const actualGain=Number(source.audio.volume);
            const playerGain=Number.isFinite(actualGain)
                ? Math.max(0,Math.min(1,actualGain/.78)):1;
            const soundStrength=(.48+.52*marenoiaLoudness(audioTime))*
                playerGain;
            const targetPressure=marenoiaDeepPulse(audioTime-lastKick)*
                soundStrength;
            const follow=1-Math.exp(-dt/.21);
            smoothPressure+=(targetPressure-smoothPressure)*follow;
            const pressure=smoothPressure;
            root.classList.add('kkpt-camera-running');
            layer.style.setProperty('--kkpt-beat-dark',
                (.60+.38*pressure).toFixed(3));
            layer.style.setProperty('--kkpt-beat-scale',
                (1.025-.175*pressure).toFixed(4));
            layer.style.setProperty('--kkpt-beat-blur',
                (.28+2.6*pressure).toFixed(2)+'px');
            layer.style.setProperty('--kkpt-beat-glitch',
                (.12+.63*pressure).toFixed(3));
            const shear=Math.sin(index*1.47)*pressure*9.0;
            layer.style.setProperty('--kkpt-beat-shear',
                shear.toFixed(2)+'px');
            layer.style.setProperty('--kkpt-beat-shear-reverse',
                (-shear*.86).toFixed(2)+'px');
            layer.style.setProperty('--kkpt-beat-scars',
                (.035+.76*pressure).toFixed(3));
            // V40 camera breathes IN then exhales to its natural size.
            // Zoom is never below 1.0: no blue/uncovered viewport edges.
            // The transform belongs to the whole body (Wiki chrome,
            // sidebar, imagery and text), not only #mw-content-text.
            root.style.setProperty('--kkpt-camera-zoom',
                (1.008+.054*pressure).toFixed(4));
            root.style.setProperty('--kkpt-camera-focus-y',
                (scrollY+innerHeight*.5).toFixed(1)+'px');
            root.style.setProperty('--kkpt-chroma-red',
                (-4.4*pressure).toFixed(2)+'px');
            root.style.setProperty('--kkpt-chroma-shadow',
                (5.6*pressure).toFixed(2)+'px');
        }
        quiet();
        kuronataAftermath={
            attach(nextScore){
                source=nextScore;
                nextScore.aftermath=kuronataAftermath;
                if(live){cancelAnimationFrame(raf);}
                clearTimeout(cameraReleaseTimer);
                live=true;lastTick=0;lastKick=-100;smoothPressure=0;
                index=0;
                layer.classList.remove('kkpt-beat-idle');
                raf=requestAnimationFrame(tick);
            },
            settle(){
                source=null;live=false;cancelAnimationFrame(raf);
                layer.classList.add('kkpt-beat-idle');quiet();
                releaseCamera();
            },
            fadeToDawn(){
                source=null;live=false;cancelAnimationFrame(raf);
                releaseCamera();
                layer.classList.add('kkpt-beat-outro');
                const old=layer;
                setTimeout(()=>{
                    old.remove();
                    if(kuronataAftermath?.layer===old)kuronataAftermath=null;
                },2400);
            },
            dispose(){
                source=null;live=false;cancelAnimationFrame(raf);
                clearTimeout(cameraReleaseTimer);
                root.classList.remove('kkpt-camera-running');
                root.style.removeProperty('--kkpt-camera-zoom');
                root.style.removeProperty('--kkpt-camera-focus-y');
                root.style.removeProperty('--kkpt-chroma-red');
                root.style.removeProperty('--kkpt-chroma-shadow');
                layer.remove();kuronataAftermath=null;
            },
            layer
        };
        if(score)kuronataAftermath.attach(score);
        return kuronataAftermath;
    }
    function createCloudbreakAfterglow(continueFromNavigation=false){
        const previous=document.getElementById('kkpt-cloudbreak');
        previous?.remove();
        let timestamp=Date.now();
        if(continueFromNavigation){
            try{timestamp=Number(sessionStorage.getItem(DAWN_HALO_KEY));}
            catch(_){return;}
            if(!Number.isFinite(timestamp)||timestamp<=0)return;
        }else{
            try{sessionStorage.setItem(DAWN_HALO_KEY,String(timestamp));}
            catch(_){}
        }
        const elapsed=Math.max(0,Date.now()-timestamp);
        if(elapsed>6900){
            try{sessionStorage.removeItem(DAWN_HALO_KEY);}catch(_){}
            return;
        }
        const bloom=document.createElement('div');
        bloom.id='kkpt-cloudbreak';
        bloom.setAttribute('aria-hidden','true');
        bloom.style.setProperty('--kkpt-dawn-delay',(-elapsed)+'ms');
        bloom.innerHTML='<i class="kkpt-dawn-dark-rim"></i>'+
            '<i class="kkpt-dawn-bright-rim"></i>'+
            '<i class="kkpt-dawn-cloud-sweep"></i>';
        root.append(bloom);
        setTimeout(()=>{
            bloom.remove();
            try{
                if(Number(sessionStorage.getItem(DAWN_HALO_KEY))===timestamp)
                    sessionStorage.removeItem(DAWN_HALO_KEY);
            }catch(_){}
        },Math.max(0,7000-elapsed));
    }
    function createRebirthVisual(){
        // Hope replaces ash: a barely perceptible rainbow after the rain.
        // No numbered / nested six-band rainbow; just one diffuse halo.
        // All are compositor layers; nothing is rasterized on every frame.
        const layer=document.createElement('div');
        layer.id='kkpt-rebirth-visual';
        layer.setAttribute('aria-hidden','true');
        const drizzle=document.createElement('div');
        drizzle.className='kkpt-rebirth-rain';
        const rainbow=document.createElementNS('http://www.w3.org/2000/svg','svg');
        rainbow.setAttribute('class','kkpt-rebirth-rainbow');
        rainbow.setAttribute('viewBox','0 0 1000 650');
        rainbow.setAttribute('preserveAspectRatio','none');
        const svgNS='http://www.w3.org/2000/svg';
        const defs=document.createElementNS(svgNS,'defs');
        const gradient=document.createElementNS(svgNS,'linearGradient');
        gradient.setAttribute('id','kkpt-rebirth-muted-arc');
        gradient.setAttribute('x1','0%');
        gradient.setAttribute('x2','100%');
        const haloColors=['#c7e5ff','#e4f7e6','#f7ebd9','#e7e0f5'];
        haloColors.forEach((color,i)=>{
            const stop=document.createElementNS(svgNS,'stop');
            stop.setAttribute('offset',(i*100/3).toFixed(1)+'%');
            stop.setAttribute('stop-color',color);
            gradient.append(stop);
        });
        defs.append(gradient);
        const arc=document.createElementNS(svgNS,'path');
        arc.setAttribute('d','M -100 625 Q 500 -175 1100 625');
        arc.setAttribute('fill','none');
        arc.setAttribute('stroke','url(#kkpt-rebirth-muted-arc)');
        arc.setAttribute('stroke-width','36');
        rainbow.append(defs,arc);
        const light=document.createElement('div');
        light.className='kkpt-rebirth-sunlight';
        const essence=document.createElement('div');
        essence.className='kkpt-rebirth-essence';
        const count=innerWidth<700?14:24;
        for(let i=0;i<count;i++){
            const mote=document.createElement('i');
            mote.className='kkpt-rebirth-mote';
            mote.style.left=(5+Math.random()*88).toFixed(1)+'%';
            mote.style.top=(22+Math.random()*73).toFixed(1)+'%';
            mote.style.animationDelay=(-Math.random()*2.8).toFixed(2)+'s';
            mote.style.animationDuration=(2.3+Math.random()*1.8).toFixed(2)+'s';
            essence.append(mote);
        }
        layer.append(drizzle,light,rainbow,essence);
        document.body.append(layer);
        let last=-1,alive=true;
        return {
            update(t){
                if(!alive||Math.abs(t-last)<.018&&t<1)return;
                last=t;
                layer.style.clipPath='inset(0 '+
                    (Math.max(0,1-t)*100).toFixed(2)+'% 0 0)';
                drizzle.style.opacity=(.30*Math.pow(1-t,1.4)).toFixed(3);
                light.style.opacity=(Math.max(0,Math.min(1,(t-.12)/.67))*.47).toFixed(3);
                rainbow.style.opacity=(Math.max(0,Math.min(1,(t-.48)/.40))*.105).toFixed(3);
                essence.style.opacity=(Math.max(0,Math.min(1,(t-.22)/.55))*.72).toFixed(3);
            },
            finish(){
                alive=false;layer.classList.add('kkpt-rebirth-finish');
                setTimeout(()=>layer.remove(),1250);
            },
            dispose(){alive=false;layer.remove();}
        };
    }
    function clearReturnScore(score){
        if(!score)return;
        clearInterval(score.displayTimer);
        score.hud?.remove();
        score.beatScene?.dispose();
        score.aftermath?.settle();
        try{
            score.audio.pause();
            score.audio.removeAttribute('src');score.audio.load();
        }catch(_){}
        if(returnScore===score)returnScore=null;
        if(score.config?.id==='marenoia')removeScoreOmen();
    }
    function watchScore(score){
        const audio=score.audio,config=score.config;
        score.displayTimer=setInterval(()=>{
            if(audio.ended||audio.error||audio.currentTime>=config.stopAt-.018){
                clearReturnScore(score);return;
            }
            const elapsed=Math.max(0,audio.currentTime-config.startAt);
            const remaining=Math.max(0,config.stopAt-audio.currentTime);
            const fadeIn=config.fadeInSeconds?
                Math.min(1,elapsed/config.fadeInSeconds):1;
            const fadeOut=config.fadeSeconds?
                Math.min(1,remaining/config.fadeSeconds):1;
            audio.volume=.78*Math.min(fadeIn,fadeOut);
        },60);
        audio.addEventListener('ended',()=>clearReturnScore(score),{once:true});
        audio.addEventListener('error',()=>{
            score.failed=true;clearReturnScore(score);
        },{once:true});
    }
    function createScore(config){
        const audio=new Audio(config.url);
        audio.preload='auto';audio.playsInline=true;
        audio.volume=0;audio.muted=userWantsMute();
        const score={audio,config,failed:false,blocked:false,
            displayTimer:null,hud:null,playPromise:null};
        returnScore=score;
        mountAudioToggle(score);
        watchScore(score);
        return score;
    }
    function armReturnScore(targetPage){
        const config=SCORES[targetPage];
        if(!config||targetPage===basePage)return null;
        if(returnScore&&!returnScore.failed&&
            returnScore.config.id===config.id)return returnScore;
        if(returnScore)clearReturnScore(returnScore);
        const score=createScore(config);
        // Seek straight into the selected three-second transition prelude.
        try{score.audio.currentTime=config.startAt;}catch(_){}
        score.audio.addEventListener('loadedmetadata',()=>{
            if(score.audio.currentTime<config.startAt-.2){
                try{score.audio.currentTime=config.startAt;}catch(_){}
            }
        },{once:true});
        startScoreOmen(score);
        try{
            score.playPromise=Promise.resolve(score.audio.play()).then(()=>{
                return true;
            },err=>{
                console.warn('[KKPT] Soundtrack playback blocked:',err);
                score.failed=true;clearReturnScore(score);return false;
            });
        }catch(err){
            console.warn('[KKPT] Soundtrack playback failed:',err);
            score.failed=true;clearReturnScore(score);
            score.playPromise=Promise.resolve(false);
        }
        return score;
    }
    function awaitScoreTime(score,seconds){
        if(!score||score.failed)return Promise.resolve(false);
        return new Promise(resolve=>{
            const audio=score.audio;
            let timer=null,lastTime=audio.currentTime;
            let lastMovement=performance.now();
            let settled=false;
            const done=ok=>{
                if(settled)return;
                settled=true;clearInterval(timer);
                audio.removeEventListener('timeupdate',check);
                audio.removeEventListener('ended',check);
                audio.removeEventListener('error',check);
                resolve(ok);
            };
            const check=()=>{
                if(audio.currentTime>=seconds-.018){done(true);return;}
                if(score.failed||audio.error||audio.ended){done(false);return;}
                if(audio.currentTime>lastTime+.015){
                    lastTime=audio.currentTime;lastMovement=performance.now();
                }
                // A stalled soundtrack cannot trap navigation indefinitely.
                if(performance.now()-lastMovement>20000)done(false);
            };
            audio.addEventListener('timeupdate',check);
            audio.addEventListener('ended',check);
            audio.addEventListener('error',check);
            timer=setInterval(check,75);
            check();
        });
    }
    function saveReturnScoreHandoff(score){
        if(!score||score.failed||score.audio.ended||
            score.audio.currentTime>=score.config.stopAt-.15)return;
        try{
            sessionStorage.setItem(SCORE_KEY,JSON.stringify({
                stamp:Date.now(),time:score.audio.currentTime,
                target:score.config.target,
                expires:Date.now()+115000,revision:40
            }));
            if(score.config.id==='marenoia'){
                sessionStorage.setItem(AFTER_DARK_KEY,'1');
            }
        }catch(err){
            console.warn('[KKPT] Cannot preserve soundtrack position:',err);
        }
    }
    function restoreReturnScoreHandoff(){
        if(window!==window.top)return false;
        let saved=null;
        try{
            saved=JSON.parse(sessionStorage.getItem(SCORE_KEY));
            sessionStorage.removeItem(SCORE_KEY);
        }catch(_){}
        if(!saved||saved.revision!==40||saved.target!==basePage||
            Date.now()>saved.expires)return false;
        const config=SCORES[saved.target];
        if(!config)return false;
        const currentTarget=()=>saved.time+
            (Date.now()-saved.stamp)/1000;
        if(currentTarget()>=config.stopAt-.15)return false;
        const score=createScore(config);
        const audio=score.audio;
        let attempted=false,blockedAt=null;
        function playFromPosition(){
            const requested=blockedAt===null?currentTarget():blockedAt;
            const position=Math.min(config.stopAt-.12,requested);
            if(position>=config.stopAt-.15){clearReturnScore(score);return;}
            try{audio.currentTime=Math.max(config.startAt,position);}catch(_){}
            Promise.resolve(audio.play()).then(()=>{
                blockedAt=null;
                score.blocked=false;updateAudioToggle(score);
            }).catch(err=>{
                // The only fallback is the SAME small icon, no audio popup.
                console.info('[KKPT] Browser requires an audio click:',err);
                blockedAt=position;score.blocked=true;
                updateAudioToggle(score);
            });
        }
        score.resume=()=>{
            if(blockedAt!==null){
                try{audio.currentTime=blockedAt;}catch(_){}
            }
            return Promise.resolve(audio.play()).then(value=>{
                blockedAt=null;return value;
            });
        };
        const autoplay=()=>{
            if(attempted)return;attempted=true;
            playFromPosition();
        };
        audio.addEventListener('loadedmetadata',autoplay,{once:true});
        audio.load();
        setTimeout(()=>{if(audio.readyState>=1)autoplay();},1100);
        return true;
    }
 
    let active = false; // true only during the visual handoff; destination navigates natively
     let animating = false;
     let animating = false;
     let gearPending = false;
     let gearPending = false;
第114行: 第1,342行:
         const root = doc.querySelector('#mw-content-text,.mw-parser-output');
         const root = doc.querySelector('#mw-content-text,.mw-parser-output');
         if (!root) return;
         if (!root) return;
         const observer = new MutationObserver(() => decoratePortalLinks(doc, targetPage));
        let pending=false;
         const observer = new MutationObserver(() => {
            if(pending)return;
            pending=true;
            setTimeout(()=>{
                pending=false;
                decoratePortalLinks(doc,targetPage);
            },120);
        });
         observer.observe(root, {childList:true,subtree:true});
         observer.observe(root, {childList:true,subtree:true});
         doc.__kkptPortalObserver = observer;
         doc.__kkptPortalObserver = observer;
第128行: 第1,364行:
         return target && target.nodeType === 1 &&
         return target && target.nodeType === 1 &&
             typeof target.closest === 'function'
             typeof target.closest === 'function'
             ? target.closest('a[href]') : null;
             ? target.closest('a[href],button.kkpt-fate-gear') : null;
     }
     }


第134行: 第1,370行:
         if (!isPlainClick(event)) return false;
         if (!isPlainClick(event)) return false;
         const anchor = findAnchor(event, doc);
         const anchor = findAnchor(event, doc);
        const gear=anchor?.classList.contains('kkpt-fate-gear')&&
            anchor.dataset.kkptTargetPage===targetPage;
         if (!anchor || (anchor.target && anchor.target !== '_self') ||
         if (!anchor || (anchor.target && anchor.target !== '_self') ||
             anchor.hasAttribute('download') ||
             anchor.hasAttribute('download') ||
             wikiLinkPage(anchor, doc) !== targetPage) return false;
             (!gear&&wikiLinkPage(anchor, doc)!==targetPage)) return false;
         event.preventDefault();
         event.preventDefault();
         if(anchor.classList.contains('kkpt-fate-gear')) {
         if(animating||gearPending)return true;
        // Both directions start playback during the trusted user gesture.
        const score=armReturnScore(targetPage);
        if(targetPage==='Kuronata'&&score&&!score.beatScene){
            score.beatScene=createMarenoiaBeatScene(score);
        }
        startFatePrelude(anchor,targetPage);
        primeSound(); // Synchronous click activation unlocks Web Audio.
        if(gear) {
             beginFateSwap(anchor,nextActive);
             beginFateSwap(anchor,nextActive);
         } else {
         } else {
第150行: 第1,396行:
         if(animating||gearPending||nextActive===active)return;
         if(animating||gearPending||nextActive===active)return;
         gearPending=true;
         gearPending=true;
         anchor.classList.add('kkpt-fate-turning');
         anchor.classList.add('kkpt-fate-gear-turning');
         setTimeout(()=>{
         // The gear and the world run on the SAME audio timeline. A 2s
        // unobserved setTimeout used to create an awkward silent gap.
        requestAnimationFrame(()=>{
             gearPending=false;
             gearPending=false;
             requestSwap(nextActive);
             requestSwap(nextActive);
         },570);
         });
         setTimeout(()=>anchor.classList.remove('kkpt-fate-turning'),4800);
         setTimeout(()=>anchor.classList.remove('kkpt-fate-gear-turning'),3300);
     }
     }


第173行: 第1,421行:
         const content=doc.querySelector('#mw-content-text,.mw-parser-output');
         const content=doc.querySelector('#mw-content-text,.mw-parser-output');
         if(!content)return;
         if(!content)return;
         const selectors='table.infobox,.infobox-character,.portable-infobox,'+
         // The fate wheel stays inside the native Infobox caption, but is
            '.infobox,[class*="infobox"]';
        // positioned independently: it must NEVER push the title off-center.
         const box=[...content.querySelectorAll(selectors)].find(el=>{
         const box=content.querySelector('table.infobox.vcard,table.infobox');
            const r=el.getBoundingClientRect();
         const host=box?.caption ||
            return r.width>175&&r.width<720&&r.height>210;
            box?.querySelector('th.infobox-above,th.infobox-title,th[colspan]')||
        });
             doc.querySelector('#firstHeading .mw-page-title-main,'+
         if(!box)return;
                '.mw-page-title-main,#firstHeading');
        const header=box.querySelector('.infobox-title,.infobox-header,'+
         if(!host)return;
             '.infobox-above,.infobox-heading,.infobox-head,'+
         host.classList.add('kkpt-fate-host');
            '.pi-title,caption,th[colspan]');
         const anchor=doc.createElement('button');
         const host=header&&header.tagName!=='TR'?header:box;
         anchor.type='button';
         host.classList.add('kkpt-fate-gear-host');
         if(host===box)host.classList.add('kkpt-fate-gear-host--box');
         const anchor=doc.createElement('a');
         anchor.className='kkpt-fate-gear';
         anchor.className='kkpt-fate-gear';
         anchor.href=new URL('/wiki/'+targetPage,doc.baseURI).href;
         // A native button cannot be mistaken for an article link by
         anchor.title=targetPage==='Kuronata'
        // MediaWiki Popups, including in previews loaded into iframes.
             ?'转动命运齿轮 · 唤醒 Kuronata':'转动命运齿轮 · 回到 Kuranoka';
        anchor.dataset.kkptTargetPage=targetPage;
         anchor.setAttribute('aria-label',anchor.title);
         const gearLabel=targetPage==='Kuronata'
             ?'命运的齿轮 · 唤醒 Kuronata':'命运的齿轮 · 回到 Kuranoka';
         anchor.setAttribute('aria-label',gearLabel);
         anchor.innerHTML='<svg class="kkpt-fate-gear-svg" viewBox="0 0 48 48" '+
         anchor.innerHTML='<svg class="kkpt-fate-gear-svg" viewBox="0 0 48 48" '+
             'aria-hidden="true" focusable="false"><path d="'+fateGearShape()+
             'aria-hidden="true" focusable="false"><path d="'+fateGearShape()+
第197行: 第1,444行:
             '<circle cx="24" cy="24" r="3"/></svg>';
             '<circle cx="24" cy="24" r="3"/></svg>';
         host.appendChild(anchor);
         host.appendChild(anchor);
        // Fixed corner placement: no title measurements, ResizeObserver
        // or reflow during the animation.
     }
     }


第205行: 第1,455行:
         try {
         try {
             doc.querySelectorAll('.background-theme,[class*="background"],[style*="background"],#mw-content-text,.citizen-page-container')
             doc.querySelectorAll('.background-theme,[class*="background"],[style*="background"],#mw-content-text,.citizen-page-container')
                 .forEach((el, i) => { if (i < 65) selector.push(el); });
                 .forEach((el, i) => { if (i < 18) selector.push(el); });
         } catch (e) { /* use html/body */ }
         } catch (e) { /* use html/body */ }
         function add(value) {
         function add(value) {
第267行: 第1,517行:
             if (!doc) return;
             if (!doc) return;
             otherTitle = doc.title || otherTitle;
             otherTitle = doc.title || otherTitle;
            // The preview exists only for the animated reveal. Pausing
            // its hidden ambience avoids doubling ongoing render work.
            doc.documentElement.classList.add('kkpt-frame-inactive');
             watchPortalLinks(doc, basePage);
             watchPortalLinks(doc, basePage);
             mountFateGear(doc, basePage);
             mountFateGear(doc, basePage);
第282行: 第1,535行:
                 if (!href || href.startsWith('javascript:')) return;
                 if (!href || href.startsWith('javascript:')) return;
                 const next = new URL(href, doc.baseURI);
                 const next = new URL(href, doc.baseURI);
                 // Same-document fragments stay inside the iframe.
                 // Same-document fragments stay inside the temporary preview.
                 const currentFrame = new URL(frame.contentWindow.location.href);
                 const currentFrame = new URL(frame.contentWindow.location.href);
                 if (next.origin === currentFrame.origin &&
                 if (next.origin === currentFrame.origin &&
第291行: 第1,544行:
                 }
                 }
                 event.preventDefault();
                 event.preventDefault();
                 window.location.assign(next.href);
                 navigateRealPage(next.href);
             }, true);
             }, true);


第314行: 第1,567行:
         frame.setAttribute('loading', 'eager');
         frame.setAttribute('loading', 'eager');
         frame.style.clipPath = hideClip;
         frame.style.clipPath = hideClip;
        // Load all resources in advance, but don't composite the hidden
        // full-screen Wiki until its first transition frame.
        frame.style.visibility = 'hidden';
        // Never expose a plain cyan rectangle while the destination Wiki
        // page is still painting. The image is the same native world photo.
        const targetBackdrop=worldBackdrops[otherPage];
        if(targetBackdrop){
            frame.style.backgroundImage='url("'+targetBackdrop+'")';
            frame.style.backgroundPosition='center center';
            frame.style.backgroundSize='cover';
            frame.style.backgroundRepeat='no-repeat';
        }


         loading = new Promise(resolve => {
         loading = new Promise(resolve => {
第357行: 第1,622行:
     }
     }


    // This edge is used by BOTH the DOM clip and the shader.
    function edgeAt(y, seconds, progress, width) {
        const eased = smooth(progress);
        const toDark = window.__kkptVisualDark;
        const center = toDark
            ? width + 110 - (width + 220) * eased
            : -110 + (width + 220) * eased;
        const wave = Math.sin(Math.PI * progress);
        const h=innerHeight;
        const pocket = toDark ? (
            -157*Math.exp(-Math.pow((y-h*.21)/(h*.125),2)) +
            104*Math.exp(-Math.pow((y-h*.49)/(h*.092),2)) -
            171*Math.exp(-Math.pow((y-h*.79)/(h*.14),2))
        ) : 0;
        return center + wave * (
            pocket +
            42 * Math.sin(y * .0105 + seconds * 1.7) +
            20 * Math.sin(y * .033 - seconds * 4.1) +
            9 * Math.sin(y * .083 + seconds * 9.3) +
            12 * Math.sin(y * .071 + seconds * 4.9 + 2 * Math.sin(y * .017 - seconds * 2.1))
        );
    }
    // Satellite fire pockets breach the still-unburnt paper ahead of the
    // main front; their outlines are also drawn by the GPU fragment shader.
    function burnFoci(seconds,progress,width,height){
        const intensity=Math.pow(Math.max(0,Math.sin(Math.PI*progress)),.84);
        if(!window.__kkptVisualDark||intensity<.02)return [];
        const points=[];
        for(let i=0;i<4;i++){
            const y=height*(.155+.228*i);
            const x=edgeAt(y,seconds,progress,width)-
                (123+23*Math.sin(i*4.9+seconds*.7));
            const r=(i%2===0?77:59)*intensity*
                (.86+.14*Math.sin(seconds*.9+i*2.1));
            points.push({x,y,r,index:i});
        }
        return points;
    }
    function clipFrame(seconds, progress) {
        const width = innerWidth, height = innerHeight;
        const pts = [];
        const count = Math.max(35, Math.ceil(height / 11));
        for (let i = 0; i <= count; i++) {
            const y = height * i / count;
            pts.push([edgeAt(y, seconds, progress, width), y]);
        }
        const supportsPath = CSS.supports('clip-path', 'path("M 0 0 L 8 0 L 8 8 Z")');
        if (supportsPath) {
            const startX = clipSide === 'right' ? width + 4 : -4;
            let d = `M ${startX} -4 L ${startX} ${height + 4} L ${pts[count][0].toFixed(1)} ${height}`;
            // Quadratic smoothing eliminates the geometric triangular teeth.
            for (let i = count - 1; i >= 0; i--) {
                const point = pts[i];
                const previous = pts[Math.max(0, i - 1)];
                const mx = (point[0] + previous[0]) * .5;
                const my = (point[1] + previous[1]) * .5;
                d += ` Q ${point[0].toFixed(1)} ${point[1].toFixed(1)} ${mx.toFixed(1)} ${my.toFixed(1)}`;
            }
            d += ` L ${pts[0][0].toFixed(1)} 0 Z`;
            // Four independently shaped satellite burns, not one sweeping
            // ruler-straight curtain. Subpaths give detached, spreading holes.
            for(const focus of burnFoci(seconds,progress,width,height)){
                if(focus.r<2)continue;
                for(let j=0;j<=44;j++){
                    const a=j/44*Math.PI*2;
                    const jag=1+.12*Math.sin(a*5+seconds*1.3+focus.index)+
                        .07*Math.sin(a*9-seconds*.8+focus.index*.9);
                    const x=(focus.x+Math.cos(a)*focus.r*jag).toFixed(1);
                    const y=(focus.y+Math.sin(a)*focus.r*jag).toFixed(1);
                    d+=(j?' L ':' M ')+x+' '+y;
                }
                d+=' Z';
            }
            frame.style.clipPath = `path("${d}")`;
        } else {
            const points = pts.slice().reverse().map(p => `${p[0].toFixed(1)}px ${p[1].toFixed(1)}px`).join(',');
            frame.style.clipPath = clipSide === 'right'
                ? `polygon(100% 0,100% 100%,${points})`
                : `polygon(0 0,0 100%,${points})`;
        }
    }
    // Tiny fullscreen quad + procedural fBm fire. No sprites or dependencies.
    const VERTEX = `
        attribute vec2 aPosition;
        void main() { gl_Position = vec4(aPosition, 0.0, 1.0); }
    `;
    const FRAGMENT = `
        precision highp float;
        uniform vec2 uSize;
        uniform vec2 uBuffer;
        uniform float uTime;
        uniform float uProgress;
        uniform float uDark;
        float random2(vec2 p) {
            return fract(sin(dot(p, vec2(127.1,311.7))) * 43758.5453123);
        }
        float noise(vec2 p) {
            vec2 i = floor(p), f = fract(p);
            vec2 u = f*f*(3.0-2.0*f);
            return mix(mix(random2(i),random2(i+vec2(1.0,0.0)),u.x),
                      mix(random2(i+vec2(0.0,1.0)),random2(i+1.0),u.x),u.y);
        }
        float fbm(vec2 p) {
            float result = 0.0, amp = 0.5;
            for (int i = 0; i < 5; i++) {
                result += amp * noise(p);
                p = mat2(1.6,-1.2,1.2,1.6) * p;
                amp *= 0.5;
            }
            return result;
        }
        float smoothProgress(float t) { return t*t*(3.0-2.0*t); }
        float edge(float y) {
            float w = uSize.x;
            float t = smoothProgress(uProgress);
            float c = uDark > .5 ? w+110.0-(w+220.0)*t : -110.0+(w+220.0)*t;
            float wave = sin(3.14159265*uProgress);
            float h=uSize.y;
            float pocket=uDark>.5 ?
                -157.0*exp(-pow((y-h*.21)/(h*.125),2.0))+
                104.0*exp(-pow((y-h*.49)/(h*.092),2.0))-
                171.0*exp(-pow((y-h*.79)/(h*.14),2.0)) : 0.0;
            return c+wave*(pocket+
                42.0*sin(y*.0105+uTime*1.7)+
                20.0*sin(y*.033-uTime*4.1)+
                9.0*sin(y*.083+uTime*9.3)+
                12.0*sin(y*.071+uTime*4.9+2.0*sin(y*.017-uTime*2.1)));
        }
        void main() {
            vec2 p = vec2(gl_FragCoord.x*uSize.x/uBuffer.x,
                          uSize.y-gl_FragCoord.y*uSize.y/uBuffer.y);
            float d = p.x-edge(p.y);
            float oldSide = uDark > .5 ? -d : d;
            float t = uTime;
            float impact = sin(3.14159265*uProgress);
            vec3 col = vec3(0.0);
            float alpha = 0.0;
            if (uDark > .5) {
                // V7: intact sky remains clean on the OLD side.
                // Incandescent wake + char exist ONLY on the newly
                // revealed Kuronata side, trailing the traveling tear.
                float wakeSide = -oldSide;
                vec2 sq = vec2(p.y*.007-t*.29,wakeSide*.006+t*.12);
                vec2 warp = vec2(fbm(sq*1.5+vec2(t*.13,0.0)),
                                fbm(sq*1.9+vec2(0.0,-t*.21)));
                float smokeCloud = fbm(sq*2.0+warp*2.2);
                float smokeDetail = fbm(sq*5.1-warp*.8);
                float billow = smoothstep(.29,.69,smokeCloud*.88+smokeDetail*.34);
                float soot = smoothstep(-40.0,21.0,wakeSide)*
                    (1.0-smoothstep(250.0,580.0,wakeSide))*
                    (.36+.58*billow);
                vec3 sootColor = mix(vec3(.015,.009,.011),vec3(.23,.038,.022),smokeCloud);
                // The flame field LINGERS for hundreds of screen pixels
                // in the new world, as in the impressive V2 reference.
                vec2 q = vec2(p.y*.015-t*.66,wakeSide*.012-t*.49);
                float turbulence = fbm(q+vec2(fbm(q*1.6)*2.7,-t*.25));
                float shredded = fbm(q*3.9+vec2(t*.25,-t*.32));
                float lengthOfTongue = 95.0+160.0*turbulence+76.0*shredded;
                float raggedEdge = 1.0-smoothstep(lengthOfTongue-75.0,lengthOfTongue+25.0,wakeSide);
                float flame = raggedEdge*smoothstep(-65.0,22.0,wakeSide)*
                    smoothstep(.24,.73,turbulence+.35*shredded);
                float core = exp(-abs(d)/10.0);
                float outer = exp(-abs(d)/57.0);
                float heat = clamp(flame*.82+core*.51,0.0,1.0);
                float hotPockets = smoothstep(.49,.78,turbulence*.75+shredded*.55)*
                    exp(-max(0.0,wakeSide)/300.0);
                vec3 fireColor = mix(vec3(.43,.013,.004),vec3(1.0,.16,.009),smoothstep(.07,.56,heat));
                fireColor = mix(fireColor,vec3(1.0,.43,.025),smoothstep(.35,.78,heat));
                fireColor = mix(fireColor,vec3(1.0,.81,.32),
                    clamp(hotPockets*.31+core*.29,0.0,.57));
                col = mix(sootColor,fireColor,clamp(flame*.88+core*.85,0.0,1.0));
                alpha = clamp(soot*.70+flame*.74+outer*.22+core*.48,0.0,.87);
                // Detached ignition islands: an honest local burn growing
                // into the old world, surrounded by a heat-distorted rim.
                float islandRim=0.0;
                float islandInterior=0.0;
                for(int i=0;i<4;i++){
                    float index=float(i);
                    float fy=uSize.y*(.155+.228*index);
                    float fx=edge(fy)-(123.0+23.0*sin(index*4.9+t*.7));
                    float radius=(mod(index,2.0)<.5?77.0:59.0)*
                        pow(max(0.0,impact),.84)*
                        (.86+.14*sin(t*.9+index*2.1));
                    float angle=atan(p.y-fy,p.x-fx);
                    float jag=1.0+.12*sin(angle*5.0+t*1.3+index)+
                        .07*sin(angle*9.0-t*.8+index*.9);
                    float sd=length(p-vec2(fx,fy))-radius*jag;
                    islandRim=max(islandRim,exp(-pow(sd/15.0,2.0)));
                    islandInterior=max(islandInterior,
                        (1.0-smoothstep(-9.0,7.0,sd))*.44);
                }
                col=mix(col,vec3(.98,.31,.025),islandRim*.73);
                alpha=max(alpha,islandRim*.77+islandInterior*.20);
                // Sharp micron-scale cinders; the real ember trails live
                // on the separate high-resolution atmosphere canvas.
                vec2 cell = floor((p+vec2(t*23.0,-t*122.0))/11.0);
                vec2 uv = fract((p+vec2(t*23.0,-t*122.0))/11.0)-.5;
                float sparks = (1.0-smoothstep(.015,.12,length(uv)))*
                    step(.991,random2(cell))*exp(-max(0.0,wakeSide)/380.0);
                col = mix(col,vec3(1.0,.78,.23),sparks);
                alpha = max(alpha,sparks*.97);
            } else {
                // Dawn is a living, spreading atmosphere: diffuse cloud,
                // breathing alabaster light and soft shafts. NO electric
                // arcs, ignition lines, flame-shaped sparks or embers.
                float newlyBlue = -oldSide;
                vec2 q = vec2(p.y*.007-t*.16,newlyBlue*.008+t*.10);
                float cloud = fbm(q+vec2(fbm(q*1.6)*1.7,-t*.13));
                float billow = fbm(q*2.9+vec2(t*.08,-t*.11));
                float erosion = smoothstep(.22,.72,cloud*.76+billow*.37);
                float settling = smoothstep(-68.0,35.0,newlyBlue)*
                    exp(-max(0.0,newlyBlue)/440.0);
                float pearlyMist = settling*(.33+.64*erosion);
                float halo = exp(-pow(d/78.0,2.0));
                float innerLight = exp(-pow(d/21.0,2.0));
                float shaftDrift=20.0*sin(p.y*.013-t*1.0)+
                    9.0*sin(p.y*.039+t*.61);
                float softRay=exp(-pow((d+shaftDrift+88.0)/81.0,2.0))*
                    (.32+.68*smoothstep(.28,.81,cloud));
                col=mix(vec3(.075,.30,.57),vec3(.72,.94,1.0),clamp(cloud*.76+.38,0.0,1.0));
                col=mix(col,vec3(.94,.995,1.0),
                    clamp(innerLight*.49+softRay*.20,0.0,.6));
                alpha=clamp(pearlyMist*.42+halo*.30+innerLight*.22+
                    softRay*.14,0.0,.59);
            }
            // No long-lasting screen tint after the burn has finished.
            alpha *= (.35+.65*impact) * smoothstep(0.0,.07,uProgress) *
                (1.0-smoothstep(.94,1.0,uProgress));
            gl_FragColor = vec4(col,alpha);
        }
    `;
    function createRenderer(canvas) {
        const gl = canvas.getContext('webgl', {
            alpha: true, antialias: false, depth: false, stencil: false,
            preserveDrawingBuffer: false, premultipliedAlpha: false
        });
        if (!gl) return null;
        function compile(type, source) {
            const shader = gl.createShader(type);
            gl.shaderSource(shader, source);
            gl.compileShader(shader);
            if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
                console.error('[KKPT WebGL] Shader:', gl.getShaderInfoLog(shader));
                return null;
            }
            return shader;
        }
        const vs = compile(gl.VERTEX_SHADER, VERTEX);
        const fs = compile(gl.FRAGMENT_SHADER, FRAGMENT);
        if (!vs || !fs) return null;
        const program = gl.createProgram();
        gl.attachShader(program, vs);
        gl.attachShader(program, fs);
        gl.linkProgram(program);
        if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
            console.error('[KKPT WebGL] Program:', gl.getProgramInfoLog(program));
            return null;
        }
        gl.useProgram(program);
        const buffer = gl.createBuffer();
        gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),gl.STATIC_DRAW);
        const pos = gl.getAttribLocation(program,'aPosition');
        gl.enableVertexAttribArray(pos);
        gl.vertexAttribPointer(pos,2,gl.FLOAT,false,0,0);
        const sizeUniform = gl.getUniformLocation(program,'uSize');
        const bufferUniform = gl.getUniformLocation(program,'uBuffer');
        const timeUniform = gl.getUniformLocation(program,'uTime');
        const progressUniform = gl.getUniformLocation(program,'uProgress');
        const modeUniform = gl.getUniformLocation(program,'uDark');
        // This is a single fullscreen pass to a transparent canvas.
        // Blending here would multiply alpha twice and wash out the fire.
        gl.disable(gl.BLEND);
        return function draw(seconds,progress,dark) {
            const w=innerWidth,h=innerHeight;
            // Keep a stable GPU budget on high-DPI/mobile displays.
            const scale = w < 700 ? .68 : .84;
            const bw=Math.round(w*scale),bh=Math.round(h*scale);
            if (canvas.width!==bw || canvas.height!==bh) {
                canvas.width=bw;canvas.height=bh;gl.viewport(0,0,bw,bh);
            }
            gl.clearColor(0,0,0,0);
            gl.clear(gl.COLOR_BUFFER_BIT);
            gl.uniform2f(sizeUniform,w,h);
            gl.uniform2f(bufferUniform,bw,bh);
            gl.uniform1f(timeUniform,seconds);
            gl.uniform1f(progressUniform,progress);
            gl.uniform1f(modeUniform,dark?1:0);
            gl.drawArrays(gl.TRIANGLES,0,6);
        };
    }
    function createFallback(canvas) {
        const ctx = canvas.getContext('2d');
        return function draw(seconds,progress,dark) {
            const w=innerWidth,h=innerHeight;
            if (canvas.width!==w || canvas.height!==h) {canvas.width=w;canvas.height=h;}
            ctx.clearRect(0,0,w,h);
            const x = edgeAt(h/2,seconds,progress,w);
            const gradient = ctx.createLinearGradient(x-115,0,x+115,0);
            if (dark) {
                gradient.addColorStop(0,'#180d0d00');
                gradient.addColorStop(.40,'#67180677');
                gradient.addColorStop(.50,'#ffe186cc');
                gradient.addColorStop(.62,'#ef3f0955');
                gradient.addColorStop(1,'#180d0d00');
            } else {
                gradient.addColorStop(0,'#5abcf600');
                gradient.addColorStop(.46,'#7cdbff77');
                gradient.addColorStop(.5,'#ffffffbb');
                gradient.addColorStop(.56,'#63c9ff77');
                gradient.addColorStop(1,'#5abcf600');
            }
            ctx.fillStyle=gradient;ctx.fillRect(x-115,0,230,h);
        };
    }


     // A second canvas adds real, textured soot / rolling vapor and violent
     // Shared, low-resolution atmospherics: return of V14's dark smoke,
     // short-lived pressure waves. It is deliberately independent of WebGL,
     // long-lived torn paper, shockwaves, blue-white petals and pollen.
     // so even browsers with GPU disabled still get the smoke and impact.
     // Only the combustion CURTAIN is replaced by the bright V2 engine.
     function createAtmosphere(canvas) {
    let atmosphereAssetCache=null;
    const atmosphereNoiseCache=new Map();
     function createAtmosphere(canvas,buildOneOnly=false) {
         const ctx = canvas.getContext('2d', {alpha:true});
         const ctx = canvas.getContext('2d', {alpha:true});
         const rand = n => {
         const rand = n => {
            const cached=atmosphereNoiseCache.get(n);
            if(cached!==undefined)return cached;
             const x = Math.sin(n*127.1+311.7)*43758.5453123;
             const x = Math.sin(n*127.1+311.7)*43758.5453123;
             return x-Math.floor(x);
             const value=x-Math.floor(x);
            atmosphereNoiseCache.set(n,value);
            return value;
         };
         };
         const clamp01 = n => Math.max(0,Math.min(1,n));
         const clamp01 = n => Math.max(0,Math.min(1,n));
第724行: 第1,668行:
                 const variation=low*28+high*15;
                 const variation=low*28+high*15;
                 if(dark){
                 if(dark){
                     data.data[i]=18+variation;
                     data.data[i]=5+variation*.37;
                     data.data[i+1]=15+variation*.58;
                     data.data[i+1]=5+variation*.33;
                     data.data[i+2]=19+variation*.48;
                     data.data[i+2]=8+variation*.38;
                 }else{
                 }else{
                     data.data[i]=44+variation;
                     data.data[i]=44+variation;
第737行: 第1,681行:
             return tex;
             return tex;
         }
         }
        const sootSprites=[0,1,2,3].map(n=>smokeTexture(n+17,true));
        const mistSprites=[0,1,2,3].map(n=>smokeTexture(n+51,false));
         // V2-inspired white-hot additive sprites, but with noise-eroded
         // V2-inspired white-hot additive sprites, but with noise-eroded
         // silhouettes instead of repetitive smooth, elliptical balls.
         // silhouettes instead of repetitive smooth, elliptical balls.
第747行: 第1,689行:
             const gradient=g.createRadialGradient(48,68,0,48,68,64);
             const gradient=g.createRadialGradient(48,68,0,48,68,64);
             const colors=mode==='fire'
             const colors=mode==='fire'
                 ? [[0,'#ffde82'],[.16,'#ffc03d'],[.36,'#ff8019'],
                 ? [[0,'#fffef1'],[.14,'#fff4bb'],[.34,'#ffd04d'],
                   [.58,'#f3400bbb'],[.81,'#9312063a'],[1,'#6e030000']]
                   [.55,'#ff841bcc'],[.80,'#bc290749'],[1,'#6e030000']]
                 : mode==='blue'
                 : mode==='blue'
                 ? [[0,'#ffffff'],[.19,'#f1ffff'],[.40,'#a2efff'],
                 ? [[0,'#ffffff'],[.19,'#f1ffff'],[.40,'#a2efff'],
第772行: 第1,714行:
             return tex;
             return tex;
         }
         }
         const FIRE_GLOW=[1,2,3,4].map(seed=>glowTexture(seed,'fire'));
        // V25: the profiler found one 270ms long task here. Build the
        const BLUE_GLOW=[1,2,3,4].map(seed=>glowTexture(seed+7,'blue'));
        // EXACT SAME 17 textures in separate tasks, never all at once.
        const EMBER_GLOW=glowTexture(21,'ember');
        // The stable noise cache avoids repeating the costly sin hash.
         const cache=atmosphereAssetCache ||= {
            sootSprites:[],mistSprites:[],FIRE_GLOW:[],BLUE_GLOW:[],
            EMBER_GLOW:null
        };
        function buildNextAsset(){
            let n=cache.sootSprites.length;
            if(n<4){cache.sootSprites.push(smokeTexture(n+17,true));return true;}
            n=cache.mistSprites.length;
            if(n<4){cache.mistSprites.push(smokeTexture(n+51,false));return true;}
            n=cache.FIRE_GLOW.length;
            if(n<4){cache.FIRE_GLOW.push(glowTexture(n+1,'fire'));return true;}
            n=cache.BLUE_GLOW.length;
            if(n<4){cache.BLUE_GLOW.push(glowTexture(n+8,'blue'));return true;}
            if(!cache.EMBER_GLOW){
                cache.EMBER_GLOW=glowTexture(21,'ember');return true;
            }
            return false;
        }
        if(buildOneOnly)return buildNextAsset();
        // Normally prewarming is already complete before a user clicks.
        // The fallback also works if an animation is started immediately.
        while(buildNextAsset()){}
        const {sootSprites,mistSprites,FIRE_GLOW,BLUE_GLOW,EMBER_GLOW}=cache;
         const combustion=[];
         const combustion=[];
         const residualSoot=[];
         const residualSoot=[];
第784行: 第1,749行:
             const live=progress>.01&&progress<.985;
             const live=progress>.01&&progress<.985;
             if(live){
             if(live){
                 const flow=(dark?425:115)*Math.min(1.5,h/720)*
                // More long-lived sparks than V25, far below V31's 370/s.
                // Blue petals are softer/less dense: fewer layers noticeably
                // reduce reverse-direction Canvas work without touching fire.
                 const flow=(dark?132:64)*Math.min(1.5,h/720)*
                     (.75+.25*Math.sin(Math.PI*progress));
                     (.75+.25*Math.sin(Math.PI*progress));
                 spawnRemainder+=dt*flow;
                 spawnRemainder+=dt*flow;
第794行: 第1,762行:
                     const r=Math.random();
                     const r=Math.random();
                     const kind=dark
                     const kind=dark
                         ? r<.61?'flame':r<.91?'ember':'ash'
                         ? r<.38?'flame':r<.91?'ember':'ash'
                         : r<.37?'glow':r<.81?'leaf':'pollen';
                         : r<.37?'glow':r<.81?'leaf':'pollen';
                     const small=kind==='ember'||kind==='pollen';
                     const small=kind==='ember'||kind==='pollen';
第800行: 第1,768行:
                     const life=dark
                     const life=dark
                         ? (soot?.7+Math.random()*1.1:
                         ? (soot?.7+Math.random()*1.1:
                             small?.65+Math.random()*1.1:.42+Math.random()*.76)
                             small?.9+Math.random()*1.55:.42+Math.random()*.76)
                         : 1.15+Math.random()*1.55;
                         : 1.15+Math.random()*1.55;
                     combustion.push({
                     combustion.push({
                         kind,x:edge+(dark?1:-1)*(Math.random()*47-8),
                         kind,x:edge+(dark?1:-1)*(Math.random()*47-8),
                         y:y+(Math.random()-.5)*25,
                         y:y+(Math.random()-.5)*25,
                         vx:(dark?1:-1)*(dark?14+Math.random()*154:
                         vx:(dark?1:-1)*(dark?(small?65+Math.random()*245:
                            14+Math.random()*154):
                             16+Math.random()*69),
                             16+Math.random()*69),
                         vy:-(dark?32+Math.random()*171:12+Math.random()*57),
                         vy:-(dark?(small?12+Math.random()*190:
                            32+Math.random()*171):12+Math.random()*57),
                         life,remaining:life,
                         life,remaining:life,
                         radius:dark
                         radius:dark
                             ? (soot?1.2+Math.random()*2.7:
                             ? (soot?1.2+Math.random()*2.7:
                                 small?2+Math.random()*5:14+Math.random()*30)
                                 small?2+Math.random()*5:9+Math.random()*19)
                             : kind==='glow'?26+Math.random()*49:
                             : kind==='glow'?26+Math.random()*49:
                                 kind==='leaf'?4+Math.random()*6:
                                 kind==='leaf'?4+Math.random()*6:
第823行: 第1,793行:
                     // Unlike the traveling front, these black smoke plumes
                     // Unlike the traveling front, these black smoke plumes
                     // are born in world-space and remain over burnt paper.
                     // are born in world-space and remain over burnt paper.
                     sootRemainder+=dt*(h<680?22:42);
                     sootRemainder+=dt*(h<680?32:46);
                     const sootBirths=Math.min(6,Math.floor(sootRemainder));
                     const sootBirths=Math.min(11,Math.floor(sootRemainder));
                     sootRemainder-=sootBirths;
                     sootRemainder-=sootBirths;
                     for(let i=0;i<sootBirths&&residualSoot.length<250;i++){
                     for(let i=0;i<sootBirths&&residualSoot.length<(w<700?92:155);i++){
                         const y=Math.random()*h;
                         const y=Math.random()*h;
                         const life=1.45+Math.random()*2.2;
                         const life=2.15+Math.random()*1.60;
                         residualSoot.push({
                         residualSoot.push({
                             x:edgeAt(y,seconds,progress,w)+9+Math.random()*115,
                             x:edgeAt(y,seconds,progress,w)+5+Math.random()*83,
                             y:y+(Math.random()-.5)*48,
                             y:y+(Math.random()-.5)*48,
                             vx:16+Math.random()*53,vy:-18-Math.random()*68,
                             vx:8+Math.random()*39,vy:-18-Math.random()*83,
                             size:135+Math.random()*145,life,remaining:life,
                             size:155+Math.random()*195,life,remaining:life,
                             sprite:(Math.random()*4)|0,
                             sprite:(Math.random()*4)|0,
                             spin:(Math.random()-.5)*.8,
                             spin:(Math.random()-.5)*.8,
第841行: 第1,811行:
                     // Charcoal sheets tear off in irregular polygons, not
                     // Charcoal sheets tear off in irregular polygons, not
                     // squares or narrow glitch streaks.
                     // squares or narrow glitch streaks.
                     shardRemainder+=dt*(h<680?17:27);
                     shardRemainder+=dt*(h<680?18:30);
                     const shardBirths=Math.min(5,Math.floor(shardRemainder));
                     const shardBirths=Math.min(7,Math.floor(shardRemainder));
                     shardRemainder-=shardBirths;
                     shardRemainder-=shardBirths;
                     for(let i=0;i<shardBirths&&tornPaper.length<135;i++){
                     for(let i=0;i<shardBirths&&tornPaper.length<175;i++){
                         const y=Math.random()*h;
                         const y=Math.random()*h;
                         const life=.82+Math.random()*1.55;
                         const life=.90+Math.random()*1.85;
                         const points=6+Math.floor(Math.random()*4);
                         const points=8+Math.floor(Math.random()*7);
                         const outline=Array.from({length:points},(_,j)=>({
                         const outline=Array.from({length:points},(_,j)=>({
                             a:Math.PI*2*j/points+(Math.random()-.5)*.22,
                             a:Math.PI*2*j/points+(Math.random()-.5)*.50,
                             r:.50+Math.random()*.61
                             r:.25+Math.random()*1.06
                         }));
                         }));
                         tornPaper.push({
                         tornPaper.push({
                             x:edgeAt(y,seconds,progress,w)+(Math.random()-.5)*47,
                             x:edgeAt(y,seconds,progress,w)+(Math.random()-.20)*58,
                             y, vx:34+Math.random()*210,
                             y, vx:55+Math.random()*295,
                             vy:-170+Math.random()*260,
                             vy:-190+Math.random()*270,
                             gravity:90+Math.random()*150,
                             gravity:90+Math.random()*150,
                             radius:4+Math.pow(Math.random(),1.6)*23,
                             radius:2+Math.pow(Math.random(),2.5)*22,
                             angle:Math.random()*6.28,
                             angle:Math.random()*6.28,
                             spin:(Math.random()-.5)*7,
                             spin:(Math.random()-.5)*7,
第893行: 第1,863行:
             }
             }
         }
         }
         const particles=Array.from({length:innerWidth<700?72:124},(_,i)=>({
         const particles=Array.from({length:innerWidth<700?40:62},(_,i)=>({
             seed:rand(i*4+71),height:rand(i*5+13),
             seed:rand(i*4+71),height:rand(i*5+13),
             lifetime:.5+rand(i*8+37)*.7,
             lifetime:.5+rand(i*8+37)*.7,
第900行: 第1,870行:
             bend:rand(i*15+23)*6.28
             bend:rand(i*15+23)*6.28
         }));
         }));
         const motes=Array.from({length:innerWidth<700?47:100},(_,i)=>({
         const motes=Array.from({length:innerWidth<700?56:115},(_,i)=>({
             y:rand(i*3+17),phase:rand(i*9+43),
             y:rand(i*3+17),phase:rand(i*9+43),
             speed:85+rand(i*12+5)*260,
             speed:100+rand(i*12+5)*340,
             drift:75+rand(i*15+2)*170,
             drift:82+rand(i*15+2)*330,
             length:3+rand(i*17+7)*11
             length:3+rand(i*17+7)*16
         }));
         }));
         const shockDebris=Array.from({length:innerWidth<700?40:85},(_,i)=>({
         const shockDebris=Array.from({length:innerWidth<700?32:66},(_,i)=>({
             angle:rand(i*17+131)*Math.PI*2,
             angle:rand(i*17+131)*Math.PI*2,
             velocity:190+rand(i*11+51)*900,
             velocity:190+rand(i*11+51)*900,
第930行: 第1,900行:
             ctx.globalCompositeOperation='source-over';
             ctx.globalCompositeOperation='source-over';
         }
         }
         return function drawAtmosphere(seconds,progress,dark,elapsed) {
         return function drawAtmosphere(seconds,progress,dark,elapsed,cells) {
             const w=innerWidth,h=innerHeight;
             const w=innerWidth,h=innerHeight;
             const scale=w<700?.67:.79;
            // Dawn uses soft-focus sprites, so 0.45 is visually sufficient.
            // This cuts ~33% of full-screen pixels compared with 0.55.
             const scale=dark?(w<700?.43:.55):(w<700?.35:.45);
             const bw=Math.max(1,Math.round(w*scale));
             const bw=Math.max(1,Math.round(w*scale));
             const bh=Math.max(1,Math.round(h*scale));
             const bh=Math.max(1,Math.round(h*scale));
第945行: 第1,917行:
             // blue dawn trails to the left when returning.
             // blue dawn trails to the left when returning.
             const direction=dark?1:-1;
             const direction=dark?1:-1;
             // Continuous textured smoke wall: not isolated oval puffs.
             // Broken smoke banks with different depths and sizes. The old
             // The base layer makes the plume visible on a pale blue sky.
             // aligned rows created an artificial horizontal fog ribbon.
             ctx.globalCompositeOperation='source-over';
             ctx.globalCompositeOperation='source-over';
             const bands=Math.max(10,Math.ceil(h/(dark?49:91)));
             const bands=dark?Math.max(8,Math.ceil(h/116)):
                Math.max(6,Math.ceil(h/136));
             for(let i=0;i<bands;i++){
             for(let i=0;i<bands;i++){
                 const baseY=(i+.5)*h/bands;
                 const baseY=(i+.15+rand(i*11+39)*.70)*h/bands;
                 const y=baseY+24*Math.sin(seconds*2.5+i*.7);
                 const y=baseY+31*Math.sin(seconds*1.6+i*1.47);
                 const x=edgeAt(y,seconds,progress,w)+direction*
                 const x=edgeAt(y,seconds,progress,w)+direction*
                     (dark?168:120)+Math.sin(seconds*1.2+i*1.3)*36;
                     (dark?76+rand(i*19+6)*260:120)+
                 const width=(dark?270:250)*(1+.19*Math.sin(i*2.9));
                    Math.sin(seconds*.93+i*1.3)*37;
                 const height=(dark?265:245);
                 const width=dark?170+rand(i*29+12)*220:250;
                 const height=dark?165+rand(i*7+5)*170:245;
                 ctx.save();
                 ctx.save();
                 ctx.globalAlpha=(dark?.32:.21)*fade*(.65+.35*envelope);
                 ctx.globalAlpha=(dark?.34:.21)*fade*(.55+.45*envelope);
                 ctx.translate(x,y);
                 ctx.translate(x,y);
                 ctx.rotate(.16*Math.sin(i*2.1+seconds*1.5));
                 ctx.rotate(.27*Math.sin(i*2.1+seconds*.9));
                 ctx.drawImage(sprites[i%4],-width/2,-height/2,width,height);
                 ctx.drawImage(sprites[i%4],-width/2,-height/2,width,height);
                 ctx.restore();
                 ctx.restore();
             }
             }
             // Independent turbulent billows peel away and rise.
             // Independent turbulent billows peel away and rise.
             for(const item of particles){
             for(let particleIndex=0;particleIndex<particles.length;
                particleIndex+=dark?1:2){
                const item=particles[particleIndex];
                 const age=((elapsed/item.lifetime+item.phase)%1);
                 const age=((elapsed/item.lifetime+item.phase)%1);
                 const baseY=item.height*h;
                 const baseY=item.height*h;
第972行: 第1,948行:
                 const x=frontier+direction*(age*(dark?225:135)+
                 const x=frontier+direction*(age*(dark?225:135)+
                     30*Math.sin(age*6.3+item.bend));
                     30*Math.sin(age*6.3+item.bend));
                 const size=(dark?145:145)*item.scale*(.68+age*1.9);
                 const size=(dark?174:145)*item.scale*(.68+age*1.9);
                 const opacity=(dark?.42:.26)*Math.sin(Math.PI*age)*fade*
                 const opacity=(dark?.43:.26)*Math.sin(Math.PI*age)*fade*
                     (.55+.45*envelope);
                     (.55+.45*envelope);
                 if(opacity<=.005)continue;
                 if(opacity<=.005)continue;
第992行: 第1,968行:
                 for(const p of residualSoot){
                 for(const p of residualSoot){
                     const age=1-p.remaining/p.life;
                     const age=1-p.remaining/p.life;
                     const opacity=clamp01(age/.13)*
                     const opacity=clamp01(age/.14)*
                         Math.pow(1-age,.64)*(.36+.24*Math.sin(p.seed*3)**2)*fade;
                         Math.pow(1-age,.49)*(.66+.24*Math.sin(p.seed*3)**2)*fade;
                     if(opacity<.009)continue;
                     if(opacity<.009)continue;
                     ctx.save();
                     ctx.save();
第999行: 第1,975行:
                     ctx.translate(p.x,p.y);
                     ctx.translate(p.x,p.y);
                     ctx.rotate(p.spin+age*.33*Math.sin(p.seed));
                     ctx.rotate(p.spin+age*.33*Math.sin(p.seed));
                     ctx.scale(1.29,.87);
                     ctx.scale(1.20,.92);
                     const s=p.size*(1+age*.68);
                     const s=p.size*(1+age*.68);
                     ctx.drawImage(sootSprites[p.sprite],-s/2,-s/2,s,s);
                     ctx.drawImage(sootSprites[p.sprite],-s/2,-s/2,s,s);
第1,010行: 第1,986行:
                 ctx.save();
                 ctx.save();
                 ctx.globalCompositeOperation='screen';
                 ctx.globalCompositeOperation='screen';
                 for(let n=0;n<3;n++){
                 for(let n=0;n<2;n++){
                     const yy=(n+.43)*h/3+Math.sin(seconds*.8+n*2)*30;
                     const yy=(n+.64)*h/2.25+Math.sin(seconds*.8+n*2)*30;
                     const xx=edgeAt(yy,seconds,progress,w)-
                     const xx=edgeAt(yy,seconds,progress,w)-
                         (88+55*Math.sin(n*2.1+seconds*.7));
                         (88+55*Math.sin(n*2.1+seconds*.7));
第1,080行: 第2,056行:
                 ctx.globalAlpha=1;
                 ctx.globalAlpha=1;
             }
             }
             // Paper-burn outline: charred edge, hot rim, then white-hot core.
             // Real flame tongues break OUT of the burn front into the sky.
             // Color/light contrast stays localized; the old sky remains clear.
            // They are thin, tapered Bezier ribbons with an unstable pulse,
            // rather than round glowing particles or a uniform bright line.
            if(dark){
                ctx.save();
                ctx.globalCompositeOperation='screen';
                const count=Math.ceil(h/17);
                for(let j=0;j<count;j++){
                    const seed=rand(j*13+167);
                    const y=(j+seed*.78)*11.5-5;
                    const x=edgeAt(y,seconds,progress,w);
                    if(x < -90 || x > w+90)continue;
                    const ripple=Math.sin(seconds*(3.4+rand(j*11+4)*2.4)+
                        j*2.09+seed*3.1);
                    const heat=clamp01(.58+ripple*.34+
                        .16*Math.sin(j*1.17-seconds*7.1));
                    if(heat<.34)continue;
                    const length=(22+rand(j*23+19)*75)*(.5+heat*.94);
                    const bend=.18+rand(j*17+42)*.66;
                    const tipX=x-length*(.76+.19*seed);
                    const tipY=y-length*bend;
                    const thick=(3.2+rand(j*31+11)*10.3)*(.5+heat);
                    const gradient=ctx.createLinearGradient(x,y,tipX,tipY);
                    gradient.addColorStop(0,'rgba(255,255,242,.99)');
                    gradient.addColorStop(.28,'rgba(255,224,84,.96)');
                    gradient.addColorStop(.59,'rgba(255,76,10,.64)');
                    gradient.addColorStop(1,'rgba(182,17,6,0)');
                    ctx.beginPath();
                    ctx.moveTo(x+2,y+thick*.5);
                    ctx.bezierCurveTo(
                        x-length*.22,y-thick*.25,
                        tipX+length*.36,tipY+thick*.68,tipX,tipY);
                    ctx.bezierCurveTo(
                        tipX+length*.32,tipY-thick*.22,
                        x-length*.17,y-thick*.74,
                        x+2,y-thick*.65);
                    ctx.closePath();
                    ctx.globalAlpha=Math.min(1,heat*1.08)*fade;
                    ctx.fillStyle=gradient;
                    ctx.shadowBlur=0;
                    ctx.fill();
                    if(heat>.66){
                        ctx.globalAlpha=(heat-.54)*1.40*fade;
                        ctx.strokeStyle='#fffce0';ctx.lineWidth=.9+heat*1.1;
                        ctx.beginPath();ctx.moveTo(x,y);
                        ctx.quadraticCurveTo(x-length*.3,y-length*.11,
                            tipX+length*.19,tipY+thick*.18);
                        ctx.stroke();
                    }
                }
                ctx.restore();
             }
 
            // Carbonized paper has a fine, ragged edge. The charcoal layer
            // persists continuously, but the white-hot core does NOT.
             ctx.save();
             ctx.save();
             ctx.beginPath();
             ctx.beginPath();
             for(let y=-12,i=0;y<=h+12;y+=9,i++){
             for(let y=-12,i=0;y<=h+12;y+=3.6,i++){
                 const x=edgeAt(y,seconds,progress,w);
                 const x=edgeAt(y,seconds,progress,w);
                 if(i===0)ctx.moveTo(x,y);else ctx.lineTo(x,y);
                 if(i===0)ctx.moveTo(x,y);else ctx.lineTo(x,y);
第1,090行: 第2,119行:
             ctx.lineCap='round';ctx.lineJoin='round';
             ctx.lineCap='round';ctx.lineJoin='round';
             if(dark){
             if(dark){
                 ctx.strokeStyle='rgba(17,2,6,.67)';
                 ctx.strokeStyle='rgba(9,5,7,.81)';
                 ctx.lineWidth=42;ctx.shadowColor='#240206';ctx.shadowBlur=34;
                 ctx.lineWidth=18;ctx.shadowBlur=0;
                 ctx.stroke();
                 ctx.stroke();
                 ctx.strokeStyle='rgba(255,44,2,.85)';
                 ctx.strokeStyle='rgba(210,45,9,.53)';
                ctx.lineWidth=24;ctx.shadowColor='#ff4c08';ctx.shadowBlur=57;
                 ctx.lineWidth=6;
                ctx.stroke();
                ctx.strokeStyle='rgba(255,187,53,.93)';
                 ctx.lineWidth=8;ctx.shadowColor='#ff9b16';ctx.shadowBlur=23;
                ctx.stroke();
                ctx.strokeStyle='rgba(255,255,229,.94)';
                ctx.lineWidth=2.4;ctx.shadowBlur=10;
                 ctx.stroke();
                 ctx.stroke();
             }else{
             }else{
                 ctx.strokeStyle='rgba(27,95,190,.22)';
                 ctx.strokeStyle='rgba(27,95,190,.22)';
                 ctx.lineWidth=27;ctx.shadowColor='#56bdff';ctx.shadowBlur=40;
                 ctx.lineWidth=27;ctx.shadowColor='#56bdff';ctx.shadowBlur=17;
                 ctx.stroke();
                 ctx.stroke();
                 ctx.strokeStyle='rgba(132,225,255,.51)';
                 ctx.strokeStyle='rgba(132,225,255,.51)';
                 ctx.lineWidth=11;ctx.shadowColor='#8aeaff';ctx.shadowBlur=30;
                 ctx.lineWidth=11;ctx.shadowColor='#8aeaff';ctx.shadowBlur=11;
                 ctx.stroke();
                 ctx.stroke();
                 ctx.strokeStyle='rgba(249,255,255,.65)';
                 ctx.strokeStyle='rgba(249,255,255,.65)';
                 ctx.lineWidth=2.7;ctx.shadowBlur=11;
                 ctx.lineWidth=2.7;ctx.shadowBlur=4;
                 ctx.stroke();
                 ctx.stroke();
             }
             }
             ctx.restore();
             ctx.restore();
            // Localized jagged ignition rims form well ahead of the main
            // tearing front. Their incandescent borders expand and merge.
             if(dark){
             if(dark){
                // Intermittent ignition cells: varying width/color/intensity
                // make the bright edge resemble burning fibres, not neon.
                 ctx.save();
                 ctx.save();
                 ctx.lineJoin='round';
                 ctx.globalCompositeOperation='screen';
                 for(const focus of burnFoci(seconds,progress,w,h)){
                ctx.lineCap='round';
                     if(focus.r<4)continue;
                 for(let y=-8;y<h+8;y+=5.8){
                    const intensity=clamp01(.58+
                        .29*Math.sin(y*.054+seconds*3.7)+
                        .21*Math.sin(y*.147-seconds*8.9)+
                        .13*Math.sin(y*.337+seconds*16.4));
                    if(intensity<.47)continue;
                    const x=edgeAt(y,seconds,progress,w);
                    const nextX=edgeAt(y+5.8,seconds,progress,w);
                    ctx.globalAlpha=intensity*fade;
                    ctx.lineWidth=1.4+intensity*4.6;
                    ctx.shadowBlur=0;
                    ctx.strokeStyle=intensity>.75?'#fff8d7':
                        intensity>.58?'#ffd369':'#ff831b';
                    ctx.beginPath();ctx.moveTo(x,y);
                    ctx.lineTo(nextX,y+5.8);ctx.stroke();
                }
                ctx.restore();
                // Fragmented ignition on real microscopic perforations.
                // Missing arc sections stop them resembling punched circles.
                ctx.save();
                ctx.globalCompositeOperation='screen';
                ctx.shadowBlur=0;
                for (let i=0; i<cells.length; i++) {
                     const c=cells[i];
                    ctx.globalAlpha=(.42+.34*c.heat)*fade;
                    ctx.strokeStyle=c.heat>.73?'#fff6bf':
                        c.heat>.38?'#ffd166':'#ff621c';
                    ctx.lineWidth=.8+Math.min(2.6,c.radius*.24);
                    const n=c.points.length;
                     ctx.beginPath();
                     ctx.beginPath();
                     for(let j=0;j<=44;j++){
                     for (let j=0;j<n;j++) {
                         const a=j/44*Math.PI*2;
                         if ((j+i*3)%5>2)continue;
                        const jag=1+.12*Math.sin(a*5+seconds*1.3+focus.index)+
                         const a=c.points[j],b=c.points[(j+1)%n];
                            .07*Math.sin(a*9-seconds*.8+focus.index*.9);
                         ctx.moveTo(a[0],a[1]);ctx.lineTo(b[0],b[1]);
                         const px=focus.x+Math.cos(a)*focus.r*jag;
                        const py=focus.y+Math.sin(a)*focus.r*jag;
                         if(j===0)ctx.moveTo(px,py);else ctx.lineTo(px,py);
                     }
                     }
                     ctx.closePath();
                     ctx.stroke();
                    ctx.lineWidth=15;ctx.shadowColor='#e34b14';ctx.shadowBlur=17;
                }
                     ctx.strokeStyle='rgba(100,18,14,.57)';ctx.stroke();
                ctx.restore();
                     ctx.lineWidth=4;ctx.shadowBlur=8;
                // Small carbon flecks stick to the still-blue paper just
                     ctx.strokeStyle='rgba(251,103,17,.73)';ctx.stroke();
                // ahead of the bite; no large rectangular glitch debris.
                     ctx.lineWidth=1;ctx.shadowBlur=3;
                ctx.save();
                    ctx.strokeStyle='rgba(255,199,84,.63)';ctx.stroke();
                for(let j=0;j<Math.ceil(h/10);j++){
                    const y=(j+rand(j*5+61)*.8)*10;
                     const x=edgeAt(y,seconds,progress,w)-
                        (5+rand(j*17+38)*24);
                    const size=.5+rand(j*29+11)*2.5;
                     const visible=.25+.59*rand(j*13+7);
                    ctx.globalAlpha=visible*fade;
                     ctx.fillStyle='#150b0a';
                    ctx.beginPath();
                     ctx.ellipse(x,y,size*.71,size,rand(j*7+31)*3.14,
                        0,Math.PI*2);
                    ctx.fill();
                 }
                 }
                 ctx.restore();
                 ctx.restore();
第1,151行: 第2,210行:
                 const opacity=clamp01(p.remaining/.22)*
                 const opacity=clamp01(p.remaining/.22)*
                     clamp01(age/.08)*(1-age*.30)*
                     clamp01(age/.08)*(1-age*.30)*
                     (p.kind==='ember'?.69:p.kind==='glow'?.13:.53)*fade;
                     (p.kind==='ember'?.74:p.kind==='glow'?.13:.66)*fade*
                    (dark?Math.exp(-Math.max(0,p.x-
                        edgeAt(p.y,seconds,progress,w))/70):1);
                 if(opacity<.012)continue;
                 if(opacity<.012)continue;
                 ctx.save();
                 ctx.save();
第1,184行: 第2,245行:
                     if(p.kind==='leaf'){
                     if(p.kind==='leaf'){
                         const r=p.radius;
                         const r=p.radius;
                         ctx.shadowBlur=13;
                         ctx.shadowBlur=5;
                         ctx.shadowColor='#bbf4ff';
                         ctx.shadowColor='#bbf4ff';
                         ctx.fillStyle=p.sprite%2?'#e6ffff':'#ffffff';
                         ctx.fillStyle=p.sprite%2?'#e6ffff':'#ffffff';
第1,199行: 第2,260行:
                     }else{
                     }else{
                         const r=p.radius;
                         const r=p.radius;
                         const halo=ctx.createRadialGradient(0,0,0,0,0,r*3);
                         // Reuse the cached soft sprite; a fresh radial
                        halo.addColorStop(0,'rgba(255,255,255,.78)');
                         // gradient for every pollen mote per frame was costly.
                        halo.addColorStop(.25,'rgba(225,250,255,.40)');
                         ctx.globalAlpha=opacity*.72;
                         halo.addColorStop(1,'rgba(150,215,255,0)');
                         ctx.drawImage(BLUE_GLOW[p.sprite],-r*3,-r*3,r*6,r*6);
                         ctx.fillStyle=halo;
                         ctx.beginPath();ctx.arc(0,0,r*3,0,Math.PI*2);ctx.fill();
                     }
                     }
                     ctx.restore();
                     ctx.restore();
第1,248行: 第2,307行:
                     ctx.shadowBlur=0;
                     ctx.shadowBlur=0;
                     ctx.lineWidth=.8+Math.sin(p.seed)**2*.8;
                     ctx.lineWidth=.8+Math.sin(p.seed)**2*.8;
                     ctx.strokeStyle=age<.48?'rgba(255,104,30,.80)':
                     ctx.strokeStyle=age<.48?'rgba(255,107,35,.48)':
                         'rgba(81,32,25,.78)';
                         'rgba(49,20,19,.47)';
                     ctx.stroke();
                     ctx.stroke();
                     // Thin blue-white unburnt fibers still visible on a
                     // Thin blue-white unburnt fibers still visible on a
第1,284行: 第2,343行:
             ctx.restore();}
             ctx.restore();}
         };
         };
    }
    let atmosphereWarmPromise=null;
    function prewarmAtmosphere() {
        if(atmosphereWarmPromise)return atmosphereWarmPromise;
        atmosphereWarmPromise=new Promise(resolve=>{
            const scratchCanvas=document.createElement('canvas');
            function step(){
                if(atmosphereAssetCache?.EMBER_GLOW){resolve();return;}
                // Exactly one texture per task: no more 270ms blocking call.
                createAtmosphere(scratchCanvas,true);
                if(atmosphereAssetCache?.EMBER_GLOW){resolve();return;}
                setTimeout(step,24);
            }
            setTimeout(step,40);
        });
        return atmosphereWarmPromise;
    }
    let atmosphereEdge=null;
    function edgeAt(y,seconds,progress,width){
        return atmosphereEdge
            ? atmosphereEdge(y)
            : makeEdge(progress,seconds,Boolean(window.__kkptVisualDark),width)(y);
    }
    // Original V2's moving flame sprites and three bright contours, rebuilt
    // with bounded particle counts. No WebGL, no full-screen noise pass,
    // no 1,000-point polygon or per-frame image-texture upload.
    let sprites=null;
    function makeSprites() {
        if (sprites) return sprites;
        function radial(stops) {
            const el=document.createElement('canvas');
            el.width=el.height=96;
            const c=el.getContext('2d');
            const g=c.createRadialGradient(48,48,0,48,48,48);
            stops.forEach(pair=>g.addColorStop(pair[0],pair[1]));
            c.fillStyle=g;c.fillRect(0,0,96,96);
            return el;
        }
        sprites={
            flame:radial([[0,'#fffbed'],[.18,'#fff2a0'],
                [.43,'#ffb42b'],[.70,'#ff360088'],[1,'#8f050000']]),
            ember:radial([[0,'#ffffff'],[.15,'#fff6a8'],
                [.44,'#ff9900cc'],[1,'#ef280000']]),
            smoke:radial([[0,'#080608dd'],[.30,'#100b10bb'],
                [.62,'#160f1677'],[1,'#08050800']]),
            sky:radial([[0,'#ffffff'],[.16,'#e6ffff'],
                [.46,'#94deffe0'],[1,'#4ab5ff00']]),
            mist:radial([[0,'#f2fdffb0'],[.4,'#abdffff0'],
                [1,'#a9e7ff00']])
        };
        return sprites;
    }
    // V2's simple advancing boundary. The reader asked for the
    // vibrant fire curtain, not a mathematically fractal tearing wire.
    function makeEdge(t,seconds,dark,w) {
        const center=dark
            ? w+105-(w+210)*smooth(t)
            : -105+(w+210)*smooth(t);
        const wobble=Math.sin(Math.PI*t);
        return y=>center+wobble*(
            17*Math.sin(y*.023+seconds*5.5)+
            9*Math.sin(y*.063-seconds*8.4)+
            4*Math.sin(y*.13+seconds*12)
        );
    }
    // GPU-only ember flecks: ONE small draw call at most 30fps.
    // The white-hot V25 fire, the smoke and the dawn stay unmodified 2D.
    // No fullscreen pixel shader, FBM, flame quads or cyan rectangle.
    function createGpuEmbers(){
        const canvas=document.createElement('canvas');
        canvas.id='kkpt-webgl';
        canvas.setAttribute('aria-hidden','true');
        let gl,program,buffer;
        try{
            gl=canvas.getContext('webgl2',{
                alpha:true,antialias:false,depth:false,stencil:false,
                premultipliedAlpha:false,preserveDrawingBuffer:false,
                powerPreference:'low-power'
            });
            if(!gl)throw new Error('WebGL2 context unavailable');
            const vert=`#version 300 es
                precision mediump float;
                layout(location=0) in vec4 aSpark;
                uniform vec2 uSize;
                uniform float uScale;
                out float vOpacity;
                void main(){
                    vec2 xy=aSpark.xy/uSize*2.0-1.0;
                    gl_Position=vec4(xy.x,-xy.y,0.0,1.0);
                    gl_PointSize=aSpark.z*uScale;
                    vOpacity=aSpark.w;
                }`;
            const frag=`#version 300 es
                precision mediump float;
                in float vOpacity;
                out vec4 fragColor;
                void main(){
                    vec2 p=gl_PointCoord*2.0-1.0;
                    float r=length(p);
                    if(r>=1.0)discard;
                    float a=pow(1.0-r,1.65)*vOpacity;
                    vec3 c=mix(vec3(1.0,.30,.035),
                        vec3(1.0,.93,.57),smoothstep(.40,.92,1.0-r));
                    fragColor=vec4(c,a);
                }`;
            function shader(type,source){
                const s=gl.createShader(type);
                gl.shaderSource(s,source);gl.compileShader(s);
                if(!gl.getShaderParameter(s,gl.COMPILE_STATUS))
                    throw new Error(gl.getShaderInfoLog(s));
                return s;
            }
            const vs=shader(gl.VERTEX_SHADER,vert);
            const fs=shader(gl.FRAGMENT_SHADER,frag);
            program=gl.createProgram();
            gl.attachShader(program,vs);gl.attachShader(program,fs);
            gl.linkProgram(program);
            gl.deleteShader(vs);gl.deleteShader(fs);
            if(!gl.getProgramParameter(program,gl.LINK_STATUS))
                throw new Error(gl.getProgramInfoLog(program));
            buffer=gl.createBuffer();
            gl.bindBuffer(gl.ARRAY_BUFFER,buffer);
            gl.bufferData(gl.ARRAY_BUFFER,170*4*4,gl.DYNAMIC_DRAW);
            gl.enableVertexAttribArray(0);
            gl.vertexAttribPointer(0,4,gl.FLOAT,false,0,0);
            gl.useProgram(program);
            gl.enable(gl.BLEND);
            gl.blendFunc(gl.SRC_ALPHA,gl.ONE_MINUS_SRC_ALPHA);
            gl.disable(gl.DEPTH_TEST);
        }catch(err){
            console.warn('[KKPT] Ember-only WebGL disabled:',err);
            canvas.remove();
            return null;
        }
        document.body.append(canvas);
        const sizeUniform=gl.getUniformLocation(program,'uSize');
        const scaleUniform=gl.getUniformLocation(program,'uScale');
        const max=innerWidth<700?80:170;
        const data=new Float32Array(max*4);
        const sparks=[];
        let carry=0,disabled=false,lastW=0,lastH=0;
        canvas.addEventListener('webglcontextlost',event=>{
            event.preventDefault();disabled=true;
            window.__kkptRenderer='Canvas2D (GPU context lost)';
        },{once:true});
        const rand=(min,max)=>min+Math.random()*(max-min);
        function draw(edge,seconds,dt,fade,progress){
            if(disabled)return;
            const w=innerWidth,h=innerHeight;
            const scale=w<700?.67:.75;
            const cw=Math.round(w*scale),ch=Math.round(h*scale);
            if(cw!==lastW||ch!==lastH){
                canvas.width=cw;canvas.height=ch;
                gl.viewport(0,0,cw,ch);lastW=cw;lastH=ch;
            }
            gl.clearColor(0,0,0,0);
            gl.clear(gl.COLOR_BUFFER_BIT);
            gl.useProgram(program);
            gl.uniform2f(sizeUniform,w,h);
            gl.uniform1f(scaleUniform,scale);
            carry+=dt*(w<700?27:56)*Math.max(0,fade);
            const births=Math.min(5,Math.floor(carry));carry-=births;
            for(let i=0;i<births&&sparks.length<max;i++){
                const y=rand(0,h),life=rand(.55,1.65);
                sparks.push({x:edge(y)+rand(-7,23),y,
                    vx:rand(48,265),vy:rand(-195,-26),life,left:life,
                    size:rand(3,13),alpha:rand(.24,.60)});
            }
            let count=0;
            for(let i=sparks.length-1;i>=0;i--){
                const p=sparks[i];
                p.left-=dt;
                if(p.left<=0){sparks[i]=sparks[sparks.length-1];sparks.pop();continue;}
                p.x+=p.vx*dt;p.y+=p.vy*dt;
                if(p.x < -30||p.x>w+30||p.y < -30||p.y>h+30)continue;
                const offset=count++*4;
                data[offset]=p.x;data[offset+1]=p.y;
                data[offset+2]=p.size;
                data[offset+3]=p.alpha*fade*Math.min(1,p.left/.24);
            }
            if(!count)return;
            gl.bindBuffer(gl.ARRAY_BUFFER,buffer);
            gl.bufferSubData(gl.ARRAY_BUFFER,0,data.subarray(0,count*4));
            gl.drawArrays(gl.POINTS,0,count);
        }
        function dispose(){
            disabled=true;
            if(!gl.isContextLost()){
                gl.deleteBuffer(buffer);gl.deleteProgram(program);
            }
            canvas.remove();
        }
        return {canvas,draw,dispose};
    }
    // Clip the ACTUAL preloaded Wiki frame, precisely where the fire is.
    function clipFrame(edge) {
        const w=innerWidth,h=innerHeight;
        const rows=window.__kkptVisualDark?
            Math.max(24,Math.ceil(h/30)):
            Math.max(16,Math.ceil(h/61));
        const pts=[];
        for(let i=rows;i>=0;i--) {
            const y=h*i/rows;
            pts.push(edge(y).toFixed(1)+'px '+y.toFixed(1)+'px');
        }
        frame.style.clipPath=clipSide==='right'
            ? 'polygon(100% 0,100% 100%,'+pts.join(',')+')'
            : 'polygon(0 0,0 100%,'+pts.join(',')+')';
    }
    function canvasFire(canvas,dark,duration,drawAtmosphere,done,gpuEmbers,score,extraVisuals) {
        const ctx=dark&&canvas
            ? canvas.getContext('2d',{alpha:true,desynchronized:true})
            : null;
        if(dark&&!ctx){done();return;}
        const art=dark?makeSprites():null;
        const w=innerWidth,h=innerHeight;
        if(ctx){
            const scale=Math.min(window.devicePixelRatio||1,w<650?.69:.80);
            canvas.width=Math.max(1,Math.round(w*scale));
            canvas.height=Math.max(1,Math.round(h*scale));
            ctx.setTransform(scale,0,0,scale,0,0);
        }
        const rand=(a,b)=>a+Math.random()*(b-a);
        const mobile=w<650;
        const maxCount=mobile?160:250;
        const p=[];
        const accum={flame:0,ember:0,shard:0,sky:0,mist:0,pollen:0};
        const rates=dark
            ? {flame:mobile?80:105,ember:mobile?72:96,
              shard:mobile?26:42}
            : {sky:mobile?50:80,mist:mobile?13:20,pollen:mobile?27:50};
        const started=performance.now();
        let previous=started;
        let lastPaint=0;
        let lastClip=0;
        function spawn(kind,edge,seconds) {
            if(p.length>=maxCount)return;
            const y=rand(-25,h+25);
            const x=edge(y);
            const type=kind;
            const smoke=type==='smoke';
            const shard=type==='shard';
            const ember=type==='ember'||type==='pollen';
            const blue=type==='sky'||type==='mist'||type==='pollen';
            let radius,life,vx,vy;
            if(shard){
                radius=rand(4,18);life=rand(.6,1.65);
                vx=rand(-130,65);vy=rand(-125,30);
            }else if(smoke){
                radius=rand(32,85);life=rand(1.1,2.5);
                vx=rand(-20,65);vy=rand(-88,-22);
            }else if(type==='mist'){
                radius=rand(45,100);life=rand(.9,1.8);
                vx=rand(-35,45);vy=rand(-75,-15);
            }else if(type==='flame'){
                radius=rand(20,57);life=rand(.3,.82);
                vx=rand(-100,30);vy=rand(-180,-45);
            }else{
                radius=ember?rand(2.5,9):rand(18,47);
                life=ember?rand(.45,1.1):rand(.35,.85);
                vx=rand(-95,75);vy=rand(-150,-25);
            }
            p.push({
                type,life,left:life,
                x:x+rand(smoke?12:shard?-35:-27,smoke?140:shard?36:64),
                y:y+rand(-14,14),vx,vy,radius,
                angle:rand(-Math.PI,Math.PI),spin:rand(-5,5),
                drift:rand(-.65,.65),blue
            });
        }
        function spawnAtRate(dt,edge,seconds,strength){
            for(const type in rates){
                accum[type]+=rates[type]*dt*strength;
                const n=Math.min(11,Math.floor(accum[type]));
                accum[type]-=n;
                for(let i=0;i<n;i++)spawn(type,edge,seconds);
            }
        }
        function advance(dt){
            for(let i=p.length-1;i>=0;i--) {
                const q=p[i];
                q.left-=dt;
                if(q.left<=0){p[i]=p[p.length-1];p.pop();continue;}
                q.x+=q.vx*dt;
                q.y+=q.vy*dt;
                q.vx+=q.drift*dt*35;
                q.vy-=10*dt;
                q.angle+=q.spin*dt;
            }
        }
        function spriteDraw(image,x,y,sx,sy,alpha){
            ctx.globalAlpha=alpha;
            ctx.drawImage(image,x-sx,y-sy,sx*2,sy*2);
        }
        function drawSmoke(fade){
            ctx.globalCompositeOperation='source-over';
            for(const q of p){
                if(q.type!=='smoke'&&q.type!=='mist')continue;
                const age=1-q.left/q.life;
                const radius=q.radius*(1+age*.98);
                const alpha=(q.type==='smoke'?.76:.32)*
                    Math.min(1,age*5)*Math.min(1,q.left/.55)*fade;
                spriteDraw(q.type==='smoke'?art.smoke:art.mist,
                    q.x,q.y,radius*1.7,radius*1.3,alpha);
            }
            ctx.globalAlpha=1;
        }
        function drawShards(fade) {
            if(!dark)return;
            ctx.save();
            ctx.globalCompositeOperation='source-over';
            for(const q of p){
                if(q.type!=='shard')continue;
                const age=1-q.left/q.life;
                const a=Math.min(1,q.left/.38)*(.90-age*.28)*fade;
                ctx.save();
                ctx.translate(q.x,q.y);
                ctx.rotate(q.angle);
                ctx.globalAlpha=a;
                const r=q.radius;
                ctx.beginPath();
                ctx.moveTo(-r*.9,-r*.3);
                ctx.lineTo(r*.7,-r*.75);
                ctx.lineTo(r*.48,r*.42);
                ctx.lineTo(-r*.35,r*.8);
                ctx.closePath();
                ctx.fillStyle=age<.3?'#371d22':'#140d13';
                ctx.fill();
                ctx.strokeStyle=age<.42?'#f57d3c':'#5a2c2b';
                ctx.lineWidth=age<.42?1.6:.75;
                ctx.stroke();
                ctx.restore();
            }
            ctx.restore();
        }
        function drawCore(edge,seconds,t,fade){
            const waviness=Math.sin(Math.PI*t);
            ctx.save();
            ctx.beginPath();
            const count=Math.max(35,Math.ceil(h/19));
            for(let i=0;i<=count;i++){
                const y=h*i/count;
                if(i===0)ctx.moveTo(edge(y),y);
                else ctx.lineTo(edge(y),y);
            }
            ctx.lineCap='round';
            ctx.lineJoin='round';
            if(dark){
                ctx.globalCompositeOperation='lighter';
                ctx.globalAlpha=fade;
                ctx.shadowColor='#ff3903';
                ctx.shadowBlur=25;
                ctx.strokeStyle='rgba(255,55,5,.82)';
                ctx.lineWidth=43;
                ctx.stroke();
                ctx.shadowBlur=16;
                ctx.strokeStyle='#ff9b17';
                ctx.lineWidth=20;
                ctx.stroke();
                ctx.shadowBlur=7;
                ctx.strokeStyle='#ffe45e';
                ctx.lineWidth=9;
                ctx.stroke();
                ctx.shadowBlur=4;
                ctx.strokeStyle='#fffcde';
                ctx.lineWidth=3.8;
                ctx.stroke();
            }else{
                ctx.globalAlpha=fade*.64;
                ctx.shadowColor='#8ccfff';
                ctx.shadowBlur=29;
                ctx.strokeStyle='rgba(139,219,255,.68)';
                ctx.lineWidth=28;
                ctx.stroke();
                ctx.shadowBlur=10;
                ctx.strokeStyle='#e7f8ff';
                ctx.lineWidth=9;
                ctx.stroke();
                ctx.shadowBlur=0;
                ctx.strokeStyle='white';
                ctx.lineWidth=2;
                ctx.stroke();
            }
            ctx.restore();
            // Dense GOLD / WHITE rolling fire, including on both sides
            // of the border. These are the luminous shapes from V2.
            if(dark){
                ctx.save();
                ctx.globalCompositeOperation='lighter';
                for(let y=-70;y<h+80;y+=48){
                    const x=edge(y);
                    const pulse=.65+.35*Math.sin(seconds*8.5+y*.083);
                    spriteDraw(art.flame,x+rand(-8,30),y,77,70,
                        fade*(.26+.16*pulse));
                }
                for(let y=-20;y<h+52;y+=36){
                    const x=edge(y);
                    const flicker=Math.sin(seconds*13+y*.19);
                    const length=52+30*flicker+17*Math.sin(seconds*6-y*.11);
                    const lean=15+18*Math.sin(seconds*9+y*.069);
                    ctx.globalAlpha=.62*fade;
                    ctx.fillStyle='#ff5705';
                    ctx.beginPath();
                    ctx.moveTo(x+18,y+19);
                    ctx.bezierCurveTo(x-18,y+2,x-lean-24,y-length*.57,
                        x-lean,y-length);
                    ctx.bezierCurveTo(x+2,y-length*.57,x+13,y-12,x+18,y+19);
                    ctx.fill();
                    ctx.globalAlpha=.58*fade;
                    ctx.fillStyle='#ffdb58';
                    ctx.beginPath();
                    ctx.moveTo(x+7,y+8);
                    ctx.quadraticCurveTo(x-10,y-length*.33,
                        x-lean*.8,y-length*.72);
                    ctx.quadraticCurveTo(x+3,y-length*.30,x+8,y+8);
                    ctx.fill();
                    ctx.globalAlpha=.38*fade;
                    ctx.fillStyle='#fffced';
                    ctx.beginPath();
                    ctx.moveTo(x+3,y+5);
                    ctx.quadraticCurveTo(x-5,y-length*.2,
                        x-lean*.5,y-length*.48);
                    ctx.quadraticCurveTo(x+4,y-length*.19,x+5,y+5);
                    ctx.fill();
                }
                ctx.restore();
            }else{
                ctx.save();
                ctx.globalCompositeOperation='lighter';
                for(let y=-50;y<h+55;y+=88){
                    spriteDraw(art.sky,edge(y),y,89,109,.27*fade);
                }
                ctx.restore();
            }
        }
        function drawBrightParticles(fade) {
            ctx.save();
            ctx.globalCompositeOperation='lighter';
            for(const q of p){
                if(q.type==='smoke'||q.type==='mist'||q.type==='shard')continue;
                const age=1-q.left/q.life;
                const brightness=Math.min(1,q.left/.25)*(1-age*.25)*fade;
                let artName='flame',sx=q.radius,sy=q.radius;
                if(q.type==='ember'){artName='ember';sx*=1.2;sy*=1.2;}
                else if(q.type==='pollen'){artName='sky';sx*=1.15;sy*=1.15;}
                else if(q.type==='sky'){artName='sky';sx*=1.1;sy*=1.55;}
                else {sx*=.9;sy*=1.65;}
                spriteDraw(art[artName],q.x,q.y,sx,sy,
                    brightness*(q.type==='ember'?.93:.78));
            }
            ctx.restore();
            ctx.globalAlpha=1;
            ctx.globalCompositeOperation='source-over';
        }
        function paint(now) {
            // Both original V25 curtains follow their OWN song cue clock.
            // Framerate drops cannot move 00:33 / 02:39 off the midpoints.
            const t=score
                ? Math.max(0,Math.min(1,(score.audio.currentTime-
                    score.config.fireStart)/
                    (score.config.fireEnd-score.config.fireStart)))
                : Math.min(1,(now-started)/duration);
            extraVisuals?.update(t);
            const seconds=now/1000;
            const edge=makeEdge(t,seconds,dark,w);
            // Clip-path polygon reconstruction can cause expensive iframe
            // compositor work. It runs at a bounded rate independent of rAF.
            atmosphereEdge=edge;
            window.__kkptVisualDark=dark;
            const clipStep=dark?(mobile?33:23):(mobile?43:34);
            if(now-lastClip>=clipStep||t>=1){
                clipFrame(edge);
                lastClip=now;
            }
            const paintStep=dark?(mobile?35:32):(mobile?52:41);
            if(now-lastPaint<paintStep && t<1){
                requestAnimationFrame(paint);return;
            }
            const dt=Math.min(.070,(now-previous)/1000);
            previous=now;lastPaint=now;
            const fade=Math.min(1,t/.055,(1-t)/.045);
            // Restore V14's broad smoke banks, long-lived char, pressure
            // waves and delicate blue leaves. V2 only paints the FIRE.
            drawAtmosphere(seconds,Math.min(t,.925),dark,(now-started)/1000,[]);
            if(dark&&gpuEmbers)gpuEmbers.draw(edge,seconds,dt,fade,t);
            if(dark){
                advance(dt);
                if(t<1)spawnAtRate(dt,edge,seconds,Math.max(0,fade));
                ctx.clearRect(0,0,w,h);
                drawShards(fade);
                drawCore(edge,seconds,t,fade);
                drawBrightParticles(fade);
            }
            if(t<1)requestAnimationFrame(paint);
            else done();
        }
        requestAnimationFrame(paint);
     }
     }


     function setDisplayed(nextActive) {
     function setDisplayed(nextActive) {
         active = nextActive;
         active=nextActive;
         frame.classList.toggle('kkpt-active', active);
         frame.classList.toggle('kkpt-active',active);
         frame.style.clipPath = active ? 'inset(0)' : hideClip;
        document.body.classList.toggle('kkpt-other-active',active);
         frame.tabIndex = active ? 0 : -1;
         frame.style.clipPath=active?'inset(0)':hideClip;
         frame.setAttribute('aria-hidden', active ? 'false' : 'true');
        frame.style.visibility=active?'visible':'hidden';
         document.title = active ? otherTitle : baseTitle;
        frame.style.pointerEvents='';
         frame.tabIndex=active?0:-1;
         frame.setAttribute('aria-hidden',active?'false':'true');
         document.title=active?otherTitle:baseTitle;
        showTheme((active?otherPage:basePage)==='Kuronata');
        // Stop the invisible Kuronata ambience in either document.
        root.classList.toggle('kkpt-world-suspended',basePage==='Kuronata'&&active);
        try{
            frame.contentDocument?.documentElement.classList.toggle(
                'kkpt-frame-inactive',!active);
        }catch(_){}
         updateButton();
         updateButton();
     }
     }


     async function animateSwap(nextActive) {
     async function animateSwap(nextActive) {
         if (animating) return;
         if(animating)return;
         animating = true;
         animating=true;
         button.classList.add('kkpt-busy');
         button.classList.add('kkpt-busy');
 
         labelSub.textContent='PREPARING THE OTHER SIDE...';
        // Warm-up should be done already; prepare if the user clicked early.
        const dark=(nextActive?otherPage:basePage)==='Kuronata';
         labelSub.textContent = 'PREPARING THE OTHER SIDE...';
        let score=returnScore?.config?.target===otherPage?
         if (!loading) warmFrame();
            returnScore:null;
         const canUseFrame = await Promise.race([loading,sleep(11000).then(() => false)]);
         if(!loading)warmFrame();
        if (!canUseFrame || !ready) {
         // Never make the music wait for the network or an expensive texture.
            // No mock background: fall back to the genuine Wiki page.
        // The iframe already has a matching photographic fallback; reveal
            window.location.assign(nextActive ? otherUrl.href : baseUrl);
        // it under the original V25 curtain even if HTML loads late.
             return;
        await Promise.race([loading,sleep(score?350:1100)]);
        await Promise.race([prewarmAtmosphere(),sleep(160)]);
        if(score){
            const started=await Promise.race([
                score.playPromise,sleep(6500).then(()=>false)
            ]);
            if(!started||!await awaitScoreTime(score,
                score.config.fireStart)){
                clearReturnScore(score);
                score=null; // Preserve the exact V25 visuals on audio failure.
             }
         }
         }
        removeScoreOmen();
        releaseFatePrelude();
        frame.style.visibility='visible';
        frame.classList.add('kkpt-animating');
        // Give the now-visible destination its own first composited frame.
        await new Promise(resolve=>requestAnimationFrame(()=>requestAnimationFrame(resolve)));


        const destinationDark = isDark(nextActive ? otherPage : basePage);
         labelSub.textContent=dark?'THE SKY IS BURNING':'DAWN IS BREAKING';
        window.__kkptVisualDark = destinationDark;
        // When returning to the blue page, force the Day palette
        button.classList.remove('kkpt-quiet');
         // BEFORE unmasking it. The dark iframe still fully covers it.
         labelSub.textContent = destinationDark ? 'THE SKY IS BURNING' : 'DAWN IS BREAKING';
        if(!dark)showTheme(false);
 
         // Freeze frame interaction while its silhouette is animated.
         frame.classList.remove('kkpt-active');
         frame.classList.remove('kkpt-active');
         frame.style.pointerEvents = 'none';
         frame.style.pointerEvents='none';
         frame.style.clipPath = active ? 'inset(0)' : hideClip;
         frame.style.clipPath=active?'inset(0)':hideClip;


         const canvas = document.createElement('canvas');
         const atmosphere=document.createElement('canvas');
         canvas.id = 'kkpt-vfx';
         atmosphere.id='kkpt-atmosphere';
         document.body.append(canvas);
         atmosphere.setAttribute('aria-hidden','true');
        const atmosphere = document.createElement('canvas');
        atmosphere.id = 'kkpt-atmosphere';
         document.body.append(atmosphere);
         document.body.append(atmosphere);
         const drawAtmosphere = createAtmosphere(atmosphere);
         const drawAtmosphere=createAtmosphere(atmosphere);
         const blast = document.createElement('div');
         const canvas=dark?document.createElement('canvas'):null;
         blast.id = 'kkpt-impact';
         if(canvas){
        blast.className = destinationDark ? 'kkpt-impact-red' : 'kkpt-impact-blue';
            canvas.id='kkpt-vfx';
        blast.setAttribute('aria-hidden','true');
            canvas.setAttribute('aria-hidden','true');
        document.body.append(blast);
            document.body.append(canvas);
        let draw = createRenderer(canvas);
        if (!draw) {
            canvas.remove();
            const fallbackCanvas = document.createElement('canvas');
            fallbackCanvas.id = 'kkpt-vfx';
            document.body.append(fallbackCanvas);
            draw = createFallback(fallbackCanvas);
         }
         }
         const fxCanvas = document.getElementById('kkpt-vfx');
         const gpuEmbers=dark?createGpuEmbers():null;
         const duration = destinationDark ? 3650 : 3350;
         const extraVisuals=dark?(score?.beatScene||null):createRebirthVisual();
        const started = performance.now();
         window.__kkptRenderer=dark
 
             ? gpuEmbers?'WebGL2 embers + original V25 Canvas fire':
         await new Promise(resolve => {
                 'Original V25 Canvas fire (WebGL fallback)'
             function tick(now) {
            : 'Original V25 Canvas dawn';
                 const seconds = now / 1000;
        const duration=dark?3450:3100;
                const t = Math.min(1,(now-started)/duration);
        if(!score)transitionSound(dark,duration);
                clipFrame(seconds,t);
        await new Promise(resolve=>canvasFire(
                drawAtmosphere(seconds,t,destinationDark,(now-started)/1000);
            canvas,dark,duration,drawAtmosphere,resolve,gpuEmbers,
                draw(seconds,t,destinationDark);
             score,extraVisuals));
                const first=destinationDark?.10:.18;
                const second=destinationDark?.48:.58;
                const shockA=Math.exp(-Math.pow((t-first)/.041,2));
                const shockB=Math.exp(-Math.pow((t-second)/.056,2));
                const shock=Math.min(1,shockA*.98+shockB*.80);
                blast.style.opacity=String(shock*(destinationDark?.60:.09));
                blast.style.setProperty('--kkpt-impact-x',
                    edgeAt(innerHeight*.51,seconds,t,innerWidth).toFixed(1)+'px');
                frame.style.filter=shock>.01
                    ? 'brightness('+(1+(destinationDark?.20:.04)*shock).toFixed(3)+
                        ') saturate('+(1+(destinationDark?.10:.03)*shock).toFixed(3)+')'
                    : '';
                if (t < 1) requestAnimationFrame(tick);
                else resolve();
             }
            requestAnimationFrame(tick);
        });


         setDisplayed(nextActive);
         setDisplayed(nextActive);
         fxCanvas.style.opacity = '0';
         if(dark){
         atmosphere.style.opacity = '0';
            try{sessionStorage.setItem(AFTER_DARK_KEY,'1');}catch(_){}
         blast.style.opacity = '0';
            mountKuronataAftermath(score);
         await sleep(190);
        }else{
         fxCanvas.remove();
            // Fade the shadow away while a pearl-white edge radiates out
            // of the just-opened sky, then let that light evaporate.
            kuronataAftermath?.fadeToDawn();
            createCloudbreakAfterglow();
        }
        extraVisuals?.finish();
        if(canvas){
            canvas.style.opacity='0';
            setTimeout(()=>canvas.remove(),210);
         }
        if(gpuEmbers){
            gpuEmbers.canvas.style.transition='opacity 280ms ease-out';
            gpuEmbers.canvas.style.opacity='0';
            setTimeout(()=>gpuEmbers.dispose(),320);
         }
        // The last frame holds living smoke and drifting fragments.
        // Let it disperse with a lightweight compositor fade AFTER the
        // destination is revealed; no costly extra canvas render loop.
        const tail=dark?2000:1320;
        atmosphere.style.transition='opacity '+tail+
            'ms ease-out, transform '+tail+'ms ease-out';
        await new Promise(resolve=>requestAnimationFrame(resolve));
        atmosphere.style.opacity='0';
         atmosphere.style.transform='translate3d(0,-22px,0) scale(1.035)';
         await sleep(tail+70);
         atmosphere.remove();
         atmosphere.remove();
        blast.remove();
         animating=false;
        frame.style.filter = '';
        frame.style.pointerEvents = '';
         animating = false;
         button.classList.remove('kkpt-busy','kkpt-quiet');
         button.classList.remove('kkpt-busy','kkpt-quiet');
         // No location.assign here: the rendered target stays alive.
         // The iframe was only the moving scenery during the reveal.
         history.pushState({ kkptV9: true, active }, '', active ? otherUrl.href : baseUrl);
         // Hand off to the ACTUAL Wiki page: native sidebars, scrollbar,
        // history, refresh, accessibility and links all work normally.
        saveReturnScoreHandoff(score);
        navigateRealPage(otherUrl.href);
     }
     }


     function requestSwap(nextActive) {
     function requestSwap(nextActive) {
         if (animating || nextActive === active) return;
         if (animating || nextActive === active) return;
         if (matchMedia('(prefers-reduced-motion: reduce)').matches && ready) {
         if (matchMedia('(prefers-reduced-motion: reduce)').matches) {
             setDisplayed(nextActive);
             if(otherPage==='Kuronata'){
            history.pushState({kkptV9:true,active},'',active?otherUrl.href:baseUrl);
                try{sessionStorage.setItem(AFTER_DARK_KEY,'1');}catch(_){}
            }
            saveReturnScoreHandoff(returnScore);
            navigateRealPage(otherUrl.href);
             return;
             return;
         }
         }
         animateSwap(nextActive).catch(err => {
         animateSwap(nextActive).catch(err => {
             console.error('[KuranokaPageTransition] V9:',err);
             console.error('[KuranokaPageTransition] V40:',err);
            removeScoreOmen();
            clearFatePrelude();
             document.getElementById('kkpt-vfx')?.remove();
             document.getElementById('kkpt-vfx')?.remove();
             document.getElementById('kkpt-atmosphere')?.remove();
             document.getElementById('kkpt-atmosphere')?.remove();
             document.getElementById('kkpt-impact')?.remove();
             document.getElementById('kkpt-webgl')?.remove();
            document.getElementById('kkpt-rebirth-visual')?.remove();
            returnScore?.beatScene?.dispose();
            document.getElementById('kkpt-lightning-layer')?.remove();
             if (frame) frame.style.filter = '';
             if (frame) frame.style.filter = '';
             window.location.assign(nextActive ? otherUrl.href : baseUrl);
             if((nextActive?otherPage:basePage)==='Kuronata'){
                try{sessionStorage.setItem(AFTER_DARK_KEY,'1');}catch(_){}
            }
            saveReturnScoreHandoff(returnScore);
            navigateRealPage(nextActive ? otherUrl.href : baseUrl);
         });
         });
     }
     }
第1,422行: 第3,021行:
         watchPortalLinks(document, otherPage);
         watchPortalLinks(document, otherPage);
         mountFateGear(document,otherPage);
         mountFateGear(document,otherPage);
         warmFrame();
         const continuingScore=restoreReturnScoreHandoff();
        if(basePage==='Kuranoka')createCloudbreakAfterglow(true);
        if(basePage==='Kuronata'){
            let hadDarkHandoff=false;
            try{hadDarkHandoff=sessionStorage.getItem(AFTER_DARK_KEY)==='1';}
            catch(_){}
            if(continuingScore||hadDarkHandoff){
                mountKuronataAftermath(returnScore);
            }
        }
        if(continuingScore)setTimeout(warmFrame,3000);
        else warmFrame();
        prewarmAtmosphere();
        preloadRebirthPad();


         button.addEventListener('click', event => {
         button.addEventListener('click', event => {
             if (!isPlainClick(event)) return;
             if (!isPlainClick(event)) return;
             event.preventDefault();
             event.preventDefault();
            armReturnScore(otherPage);
            primeSound();
             requestSwap(!active);
             requestSwap(!active);
         });
         });
第1,432行: 第3,046行:


     // A plain [[Kuronata|your mysterious text]] now triggers everything.
     // A plain [[Kuronata|your mysterious text]] now triggers everything.
     // The inverse [[Kuranoka|...]] works inside the already-loaded iframe.
     // The inverse [[Kuranoka|...]] uses the same transition, then real navigation.
     document.addEventListener('click', event => {
     document.addEventListener('click', event => {
         if (active) return;
         if (active) return;
第1,441行: 第3,055行:
     });
     });


     // Back and Forward restore the two already-loaded documents instantly.
     // Browser history is now real document history. A bfcache return
     window.addEventListener('popstate', () => {
     // must restore THIS document, not leave its animated preview visible.
        if (!frame || !ready || animating) return;
        const route = pathPage();
        if (route === basePage || route === otherPage) {
            setDisplayed(route === otherPage);
        }
    });
 
     window.addEventListener('pageshow', event => {
     window.addEventListener('pageshow', event => {
         if (!event.persisted || !frame || !ready) return;
         if (!event.persisted) return;
         animating=false;
         animating=false;
         document.getElementById('kkpt-vfx')?.remove();
         document.getElementById('kkpt-vfx')?.remove();
         document.getElementById('kkpt-atmosphere')?.remove();
         document.getElementById('kkpt-atmosphere')?.remove();
         document.getElementById('kkpt-impact')?.remove();
         document.getElementById('kkpt-rebirth-visual')?.remove();
         frame.style.filter = '';
         document.getElementById('kkpt-cloudbreak')?.remove();
         setDisplayed(pathPage() === otherPage);
        document.getElementById('kkpt-beat-scene')?.remove();
        kuronataAftermath?.dispose();
        document.getElementById('kkpt-lightning-layer')?.remove();
        if(frame){
            frame.style.filter='';
            setDisplayed(false);
            frame.classList.remove('kkpt-animating');
         }
        if(basePage==='Kuronata'){
            let entered=false;
            try{entered=sessionStorage.getItem(AFTER_DARK_KEY)==='1';}
            catch(_){}
            if(entered)mountKuronataAftermath(returnScore);
        }
         button?.classList.remove('kkpt-busy','kkpt-quiet');
         button?.classList.remove('kkpt-busy','kkpt-quiet');
     });
     });

2026年10月24日 (六) 17:00的最新版本

/* ============================================================
   Kuranoka / Kuronata — Page Transition V40 / V25 faithful restore
   V25 ORIGINAL fire edge, translucent fire pockets, smoke and dawn.
   Lightweight WebGL2 is restricted to subtle ember points, NEVER the
   fire curtain nor the reverse transition. Carbon sheets are 2D.
   Both cues start three seconds before the V25 curtains, fade in over
   those three seconds, then fade OUT over 18 seconds after reveal.
   Only this page-scoped JS/CSS; never modify Citizen or loader.js.
   Real page navigation after the transition; iframe is visual-only.
   ============================================================ */
(function initKkpt(retry) {
    'use strict';
    retry=retry||0;
    if (!window.mw || !mw.config || typeof mw.config.get!=='function') {
        if(retry<40)setTimeout(()=>initKkpt(retry+1),100);
        return;
    }

    const pathMatch = location.pathname.match(/\/wiki\/(Kuranoka|Kuronata)\/?$/);
    const urlPage = pathMatch ? pathMatch[1]
        : new URLSearchParams(location.search).get('title');
    const basePage = ['Kuranoka','Kuronata'].includes(urlPage)
        ? urlPage : mw.config.get('wgPageName');
    const action = new URLSearchParams(location.search).get('action') || 'view';
    if (!['Kuranoka','Kuronata'].includes(basePage) || action !== 'view') return;

    // V24: the two article worlds have deliberate, deterministic palettes.
    // "os" is NOT a light theme: it can resolve to dark on the reader's
    // computer. Session storage may also be unavailable. Therefore, never
    // restore a stale "os" token when landing back on Kuranoka.
    const root=document.documentElement;
    const themeNames=['skin-theme-clientpref-day','skin-theme-clientpref-os',
        'skin-theme-clientpref-night','skin-theme-clientpref-black',
        'skin-citizen-light'];
    let wantsNight=basePage==='Kuronata';
    let changingTheme=false;
    function syncTheme(){
        if(changingTheme)return;
        const wanted=wantsNight?'skin-theme-clientpref-night':
            'skin-theme-clientpref-day';
        const shadow=wantsNight?'kkpt-kuronata-dark':null;
        const unexpected=themeNames.filter(c=>c!==wanted)
            .concat(wantsNight?[]:['kkpt-kuronata-dark']);
        if(root.classList.contains(wanted)&&
            (!shadow||root.classList.contains(shadow))&&
            unexpected.every(c=>!root.classList.contains(c))){
            return;
        }
        changingTheme=true;
        root.classList.remove(...themeNames,'kkpt-kuronata-dark');
        root.classList.add(wanted);
        if(shadow)root.classList.add(shadow);
        changingTheme=false;
    }
    function showTheme(dark){wantsNight=dark;syncTheme();}
    syncTheme();
    // Citizen may reapply OS-preference classes after its own scripts load.
    // Keep each world's class correct without changing the user's setting.
    new MutationObserver(syncTheme).observe(root,{
        attributes:true,attributeFilter:['class']
    });
    // V31's page-style retry solves occasional initial unstyled portals.
    function ensureWorldStyles(){
        if(!document.head || document.getElementById('kkpt-css-retry'))return;
        try{
            if(getComputedStyle(root).getPropertyValue('--kkpt-css-v40').trim()==='ready')return;
        }catch(_){}
        const link=document.createElement('link');
        link.id='kkpt-css-retry';
        link.rel='stylesheet';
        const target=new URL('/index.php',location.origin);
        target.searchParams.set('title','MediaWiki:KuranokaPageTransition.css');
        target.searchParams.set('action','raw');
        target.searchParams.set('ctype','text/css');
        target.searchParams.set('kkptv','40');
        link.href=target.href;
        document.head.appendChild(link);
    }
    setTimeout(ensureWorldStyles,1200);
    function navigateRealPage(href){
        window.location.assign(href);
    }

    // V17: the dark-world extras run in *both* the visible document and
    // its same-origin preview iframe. They never alter other Wiki pages.
    function installKuronataAfterglow() {
        if(basePage!=='Kuronata'||window.__kkptDarkExtrasReady)return;
        window.__kkptDarkExtrasReady=true;
        const prefersReduced=window.matchMedia('(prefers-reduced-motion: reduce)');
        // Multiline .heimu cannot use a single nowrap pseudo-element:
        // it piles all copied text onto line one. Project each rendered
        // line into two SHORT clipped chromatic slices only on hover.
        // Range measurements leave the original article DOM and wrapping
        // entirely untouched, including italic/link children.
        const spoilerOverlays=new WeakMap();
        const renderedSpoilerLines=(node)=>{
            const lines=[];
            const walk=document.createTreeWalker(node,NodeFilter.SHOW_TEXT);
            const range=document.createRange();
            let text,budget=0;
            while((text=walk.nextNode())&&budget<340){
                for(let i=0;i<text.length&&budget<340;i++,budget++){
                    const ch=text.nodeValue[i];
                    if(ch==='\n'||ch==='\r')continue;
                    range.setStart(text,i);
                    range.setEnd(text,i+1);
                    const r=range.getBoundingClientRect();
                    if(!r.width||!r.height)continue;
                    let line=lines.find(row=>Math.abs(row.top-r.top)<3);
                    if(!line){
                        line={top:r.top,left:r.left,right:r.right,
                            height:r.height,text:''};
                        lines.push(line);
                    }
                    line.left=Math.min(line.left,r.left);
                    line.right=Math.max(line.right,r.right);
                    line.height=Math.max(line.height,r.height);
                    line.text+=ch;
                }
            }
            range.detach?.();
            return lines.sort((a,b)=>a.top-b.top);
        };
        const spoilerFault=(node)=>{
            if(prefersReduced.matches)return;
            const rects=node.getClientRects();
            if(rects.length<2)return;
            const lines=renderedSpoilerLines(node);
            if(lines.length<2)return;
            node.setAttribute('data-kkpt-multiline','1');
            spoilerOverlays.get(node)?.remove();
            const overlay=document.createElement('div');
            overlay.className='kkpt-heimu-fault';
            overlay.setAttribute('aria-hidden','true');
            const font=getComputedStyle(node);
            for(const row of lines){
                const fragment=document.createElement('span');
                fragment.className='kkpt-heimu-fault-line';
                fragment.dataset.copy=row.text;
                fragment.style.left=row.left+'px';
                fragment.style.top=row.top+'px';
                fragment.style.width=(row.right-row.left+6)+'px';
                fragment.style.height=(row.height+4)+'px';
                fragment.style.fontFamily=font.fontFamily;
                fragment.style.fontSize=font.fontSize;
                fragment.style.fontWeight=font.fontWeight;
                fragment.style.fontStyle=font.fontStyle;
                fragment.style.lineHeight=font.lineHeight;
                fragment.style.letterSpacing=font.letterSpacing;
                overlay.append(fragment);
            }
            document.body.append(overlay);
            spoilerOverlays.set(node,overlay);
        };
        const clearSpoilerFault=(node)=>{
            const overlay=spoilerOverlays.get(node);
            if(!overlay)return;
            spoilerOverlays.delete(node);
            overlay.classList.add('kkpt-fault-away');
            setTimeout(()=>overlay.remove(),210);
        };
        const decorateSpoilers=()=>{
            document.querySelectorAll('span.heimu').forEach(node=>{
                if(node.dataset.kkptBound)return;
                node.dataset.kkptBound='1';
                const label=(node.textContent||'').replace(/\s+/g,' ').trim();
                if(label&&label.length<=240&&!node.children.length)
                    node.setAttribute('data-kkpt-glitch',label);
                node.addEventListener('mouseenter',()=>spoilerFault(node));
                node.addEventListener('mouseleave',()=>clearSpoilerFault(node));
            });
        };
        const decorateLinks=()=>{
            const article=document.querySelector('#mw-content-text,.mw-parser-output');
            if(!article)return;
            article.querySelectorAll('a[href]').forEach(link=>{
                if(link.dataset.kkptLinkReady ||
                    link.classList.contains('kkpt-fate-gear') ||
                    link.querySelector('img,svg,video'))return;
                link.dataset.kkptLinkReady='1';
                link.classList.add('kkpt-link-glitch');
                try{
                    const url=new URL(link.href,document.baseURI);
                    const path=url.pathname.match(/\/wiki\/([^/?#]+)/);
                    const name=url.searchParams.get('title')||
                        (path?decodeURIComponent(path[1]):'');
                    if(url.origin===location.origin &&
                        name.replace(/_/g,' ')==='Kuranoka'){
                        link.classList.add('kkpt-link-origin');
                        // Copy a link only if it truly occupies one
                        // rendered line. Multiline links keep real text.
                        const label=(link.textContent||'').trim();
                        if(!link.children.length &&
                           link.getClientRects().length===1 &&
                           label.length>0&&label.length<100)
                            link.dataset.kkptLinkCopy=label;
                    }
                }catch(_){}
            });
        };
        // V29's useful identity faults, transplanted without its transition
        // shaders. Only text nodes are wrapped; Wiki links stay clickable.
        const decorateIdentityMentions=()=>{
            const article=document.querySelector('#mw-content-text,.mw-parser-output');
            if(!article)return;
            const hasIdentity=/Kuranoka|Kurano\s+Kanata|天野[ \u00a0\u3000]*彼方/i;
            const exactIdentity=/Kuranoka|Kurano\s+Kanata|天野[ \u00a0\u3000]*彼方/gi;
            const walker=document.createTreeWalker(article,NodeFilter.SHOW_TEXT,{
                acceptNode(node){
                    if(!node.nodeValue||!hasIdentity.test(node.nodeValue))
                        return NodeFilter.FILTER_REJECT;
                    const parent=node.parentElement;
                    if(!parent||parent.closest('script,style,textarea,code,pre,'+
                        'input,button,select,[contenteditable="true"],'+
                        '.kkpt-identity-glitch,.kkpt-heimu-fault,'+
                        'span.heimu,a.kkpt-link-origin,'+
                        '#kkpt-afterglow,#kkpt-toggle'))
                        return NodeFilter.FILTER_REJECT;
                    return NodeFilter.FILTER_ACCEPT;
                }
            });
            const matches=[];
            let node;
            while((node=walker.nextNode())&&matches.length<1800)matches.push(node);
            let index=0;
            for(const textNode of matches){
                const raw=textNode.nodeValue;
                const fragment=document.createDocumentFragment();
                let previous=0,match;
                exactIdentity.lastIndex=0;
                while((match=exactIdentity.exec(raw))){
                    if(match.index>previous)
                        fragment.append(document.createTextNode(raw.slice(previous,match.index)));
                    const el=document.createElement('span');
                    el.className='kkpt-identity-glitch';
                    el.dataset.kkptIdentity=match[0];
                    el.textContent=match[0];
                    el.style.setProperty('--kkpt-identity-delay',
                        (-((index++*7)%23)*.21).toFixed(2)+'s');
                    fragment.append(el);
                    previous=match.index+match[0].length;
                }
                if(previous<raw.length)
                    fragment.append(document.createTextNode(raw.slice(previous)));
                textNode.replaceWith(fragment);
            }
        };
        const createAmbience=()=>{
            if(prefersReduced.matches||document.getElementById('kkpt-afterglow')||!document.body)return;
            const overlay=document.createElement('div');
            overlay.id='kkpt-afterglow';
            overlay.setAttribute('aria-hidden','true');
            const el=(type,i)=>{
                const part=document.createElement('span');
                part.className=type==='soot'?'kkpt-soot-cell':'kkpt-ash-cell';
                const smoke=type==='soot';
                // All sprites are static layers with compositor-only
                // transform/opacity animation. No persistent canvas or RAF.
                // The soot is a side-bank haze, not a random full-screen
                // spread of isolated circular clouds.
                const fromLeft=i%2===0;
                part.style.left=(smoke
                    ? (fromLeft?-26+Math.random()*22:79+Math.random()*21)
                    : Math.random()*100)+'%';
                part.style.top=(smoke?8+Math.random()*94:15+Math.random()*94)+'%';
                part.style.setProperty('--size',(smoke?220+Math.random()*240:2+Math.random()*4).toFixed(1)+'px');
                part.style.setProperty('--delay',(-Math.random()*(smoke?29:18)).toFixed(2)+'s');
                part.style.setProperty('--duration',(smoke?18+Math.random()*14:8+Math.random()*11).toFixed(2)+'s');
                part.style.setProperty('--wind',((Math.random()-.5)*(smoke?100:230)).toFixed(1)+'px');
                return part;
            };
            for(let i=0;i<(innerWidth<700?8:16);i++)overlay.append(el('soot',i));
            for(let i=0;i<30;i++)overlay.append(el('ash',i));
            document.body.append(overlay);
        };
        const init=()=>{
            decorateSpoilers();
            decorateLinks();
            decorateIdentityMentions();
            createAmbience();
            mw.hook('wikipage.content').add(()=>{
                decorateSpoilers();
                decorateLinks();
                decorateIdentityMentions();
            });
        };
        if(document.readyState==='loading')
            document.addEventListener('DOMContentLoaded',init,{once:true});
        else init();

        // One brief spatial fault roughly every 14-36 seconds, never a
        // full-screen white strobe. Pause while the iframe is hidden.
        const pulse=()=>{
            const inactive=document.hidden||prefersReduced.matches||
                root.classList.contains('kkpt-frame-inactive')||
                root.classList.contains('kkpt-world-suspended')||
                (window!==window.top&&window.frameElement?.getAttribute('aria-hidden')==='true');
            if(!inactive){
                root.style.setProperty('--kkpt-rift-y',(14+Math.random()*70).toFixed(1)+'%');
                root.classList.add('kkpt-rift');
                window.setTimeout(()=>root.classList.remove('kkpt-rift'),390);
            }
            window.setTimeout(pulse,5000+Math.random()*15000);
        };
        window.setTimeout(pulse,5000+Math.random()*15000);
    }
    installKuronataAfterglow();

    // The nested preview only applies its own theme; no recursive iframe.
    if (window!==window.top || window.__kkptV12) return;
    window.__kkptV12=true;
    window.__kkptVersion='40.0';

    // Easter eggs + Infobox gear are the default. No floating pill.
    const SHOW_FLOATING_BUTTON=false;
    const otherPage=basePage==='Kuranoka'?'Kuronata':'Kuranoka';
    const baseUrl=location.href;
    const baseTitle=document.title;
    const otherUrl=new URL('/wiki/'+encodeURIComponent(otherPage),location.href);
    const clipSide=basePage==='Kuranoka'?'right':'left';
    const hideClip=clipSide==='right'?'inset(0 0 0 100%)':'inset(0 100% 0 0)';
    const sleep=ms=>new Promise(r=>setTimeout(r,ms));
    // C2-smooth cinematic ease; starts and settles with zero acceleration.
    // Its midpoint stays at t=.5, preserving 00:33 / 02:39 beat alignment.
    const smooth=t=>{t=Math.max(0,Math.min(1,t));
        return t*t*t*(t*(t*6-15)+10);};
    const imagePool=new Map();
    // V24: preload both original background photographs. The target
    // image is decoded while its real-document iframe is preparing,
    // reducing flashes of the bare background-color at navigation.
    const worldBackdrops={
        Kuranoka:'https://blockland.wiki/images/0/05/%E7%A7%AF%E9%9B%A8%E4%BA%911.png',
        Kuronata:'https://blockland.wiki/images/a/ab/%E9%BB%84%E6%98%8F%EF%BC%8C%E9%BB%91%E4%BA%91.png'
    };
    function primeWorldBackdrops(){
        const current=worldBackdrops[basePage];
        if(current&&document.head){
            const link=document.createElement('link');
            link.rel='preload';
            link.as='image';
            link.href=current;
            link.setAttribute('fetchpriority','high');
            link.dataset.kkptBackgroundPreload='1';
            document.head.appendChild(link);
            warmImage(current).catch(()=>{});
        }
        // Give the current photo first priority; then prepare the next
        // world so the iframe and the eventual real page can reuse it.
        setTimeout(()=>{
            const next=worldBackdrops[otherPage];
            if(next)warmImage(next).catch(()=>{});
        },300);
    }
    primeWorldBackdrops();

    const ENABLE_TRANSITION_AUDIO = true;
    const FIRE_VOLUME = .30;
    const DAWN_VOLUME = .20;
    let soundContext=null,fireBuffer=null,activeSound=null;

    // Public-domain PADsynth recording, ~8.4s / 120KB. Change this
    // to a same-origin Wiki-upload URL if external media are blocked.
    const REBIRTH_PAD_URL=
        'https://upload.wikimedia.org/wikipedia/commons/e/ed/Padsynth_example_synth_piano.ogg';
    let padBytesPromise=null,padDecodePromise=null,padBuffer=null;
    function preloadRebirthPad(){
        if(padBytesPromise)return padBytesPromise;
        padBytesPromise=fetch(REBIRTH_PAD_URL,{mode:'cors',cache:'force-cache'})
            .then(resp=>{
                if(!resp.ok)throw new Error('PAD HTTP '+resp.status);
                return resp.arrayBuffer();
            })
            .catch(err=>{
                console.debug('[KKPT] PAD file unavailable:',err);
                return null;
            });
        return padBytesPromise;
    }
    function decodeRebirthPad(ctx){
        if(padBuffer)return Promise.resolve(padBuffer);
        if(!padDecodePromise){
            padDecodePromise=preloadRebirthPad()
                .then(bytes=>bytes?ctx.decodeAudioData(bytes.slice(0)):null)
                .then(result=>(padBuffer=result))
                .catch(err=>{
                    console.debug('[KKPT] Cannot decode PAD:',err);
                    return null;
                });
        }
        return padDecodePromise;
    }
    // A plain media element can still play the recording when a site's
    // CORS policy disallows reading the file into Web Audio.
    function playRebirthPadFallback(durationMs){
        const sound=new Audio(REBIRTH_PAD_URL);
        sound.volume=0;
        sound.play().then(()=>{
            const begin=performance.now();
            const timer=setInterval(()=>{
                const t=Math.min(1,(performance.now()-begin)/durationMs);
                sound.volume=Math.max(0,Math.min(DAWN_VOLUME,
                    DAWN_VOLUME*Math.min(t/.27,(1-t)/.26)));
                if(t>=1){clearInterval(timer);sound.pause();sound.src='';}
            },80);
        }).catch(err=>console.debug('[KKPT] PAD playback unavailable:',err));
    }

    function primeSound(){
        if(!ENABLE_TRANSITION_AUDIO)return;
        try{
            const AudioEngine=window.AudioContext||window.webkitAudioContext;
            if(!AudioEngine)return;
            if(!soundContext)soundContext=new AudioEngine();
            if(soundContext.state==='suspended')soundContext.resume().catch(()=>{});
            decodeRebirthPad(soundContext);
        }catch(err){console.debug('[KKPT] Audio unavailable:',err);}
    }
    function createFireAudio(ctx){
        const length=Math.round(ctx.sampleRate*4.5);
        const buffer=ctx.createBuffer(1,length,ctx.sampleRate);
        const data=buffer.getChannelData(0);
        let low=0,middle=0;
        for(let i=0;i<length;i++){
            const random=Math.random()*2-1;
            low=low*.992+random*.008;
            middle=middle*.92+random*.08;
            data[i]=Math.max(-1,Math.min(1,
                low*3.9+middle*.33+random*.055));
        }
        // Micro-crackles: impulsive bursts with different decay times.
        for(let k=0;k<350;k++){
            const at=Math.floor(Math.random()*(length-1500));
            const decay=36+Math.random()*330;
            const duration=Math.min(1400,Math.ceil(decay*4));
            const power=.20+Math.pow(Math.random(),3)*.68;
            for(let j=0;j<duration;j++){
                const env=Math.exp(-j/decay);
                data[at+j]=Math.max(-1,Math.min(1,data[at+j]+
                    (Math.random()*2-1)*power*env));
            }
        }
        return buffer;
    }
    function transitionSound(dark,durationMs){
        const ctx=soundContext;
        if(!ctx||ctx.state!=='running')return;
        const start=ctx.currentTime+.018;
        const span=durationMs/1000;
        if(activeSound){
            const old=activeSound.gain;
            old.cancelScheduledValues(start);
            old.setTargetAtTime(.0001,start,.05);
        }
        const master=ctx.createGain();
        master.gain.setValueAtTime(.0001,start);
        master.gain.linearRampToValueAtTime(dark?FIRE_VOLUME:DAWN_VOLUME,
            start+(dark?.75:1.10));
        master.gain.setValueAtTime(dark?FIRE_VOLUME:DAWN_VOLUME,
            start+span-(dark?.88:1.0));
        master.gain.exponentialRampToValueAtTime(.0001,start+span);
        master.connect(ctx.destination);
        activeSound={gain:master};
        if(dark){
            if(!fireBuffer)fireBuffer=createFireAudio(ctx);
            const src=ctx.createBufferSource();
            src.buffer=fireBuffer;src.loop=true;
            const lowpass=ctx.createBiquadFilter();
            lowpass.type='lowpass';lowpass.frequency.value=2050;
            const bass=ctx.createBiquadFilter();
            bass.type='highpass';bass.frequency.value=55;
            src.connect(lowpass);lowpass.connect(bass);bass.connect(master);
            src.start(start);src.stop(start+span+.12);
        }else{
            // A REAL recorded PADsynth sample; no generated wind-chimes.
            decodeRebirthPad(ctx).then(buffer=>{
                if(!buffer){playRebirthPadFallback(durationMs);return;}
                const at=Math.max(start,ctx.currentTime+.020);
                if(at>start+span-.55)return;
                const player=ctx.createBufferSource();
                player.buffer=buffer;
                player.connect(master);
                player.start(at,Math.max(0,at-start)+.95);
                player.stop(start+span);
            }).catch(()=>{});
        }
        setTimeout(()=>{
            if(activeSound&&activeSound.gain===master)activeSound=null;
            try{master.disconnect();}catch(_){}
        },durationMs+350);
    }

    // Audio starts AT ITS TRANSITION SECTION, not at 00:00. Three seconds of
    // crescendo accompany the fate-wheel awakening. V25's actual fire and
    // particle painting remains unchanged. Music 00:33 / 02:39 now lands
    // in the MIDDLE of the corresponding original V25 reveal.
    const SCORE_KEY='kkpt:score-handoff:40';
    const SCORE_MUTE_KEY='kkpt:score-muted';
    const SCORES={
        Kuronata:{
            id:'marenoia',target:'Kuronata',
            url:'https://blkl.fun/wp-content/uploads/2026/10/Marenoia.mp3?kkpt_audio=v35',
            startAt:28.275,fireStart:31.275,fireEnd:34.725,
            stopAt:52.725,fadeInSeconds:3,fadeSeconds:18
        },
        Kuranoka:{
            id:'anotherme',target:'Kuranoka',
            url:'https://blkl.fun/wp-content/uploads/2026/10/AnotherMe.mp3?kkpt_audio=20261024_043627',
            startAt:154.45,fireStart:157.45,fireEnd:160.55,
            stopAt:178.55,fadeInSeconds:3,fadeSeconds:18
        }
    };
    let returnScore=null;
    let scoreOmen=null;
    let fatePrelude=null;
    function userWantsMute(){
        try{return sessionStorage.getItem(SCORE_MUTE_KEY)==='1';}
        catch(_){return false;}
    }
    const AUDIO_ICONS={
        speaker:'<path d="M11 5 6 9H3v6h3l5 4V5Z"/><path d="M15 9a5 5 0 0 1 0 6"/><path d="M18 6a9 9 0 0 1 0 12"/>',
        mute:'<path d="M11 5 6 9H3v6h3l5 4V5Z"/><path d="m16 9 5 6m0-6-5 6"/>',
        play:'<path d="m8 5 11 7-11 7V5Z"/>'
    };
    function updateAudioToggle(score){
        if(!score?.hud)return;
        const paused=score.blocked||score.audio.paused;
        const icon=paused?'play':score.audio.muted?'mute':'speaker';
        score.hud.innerHTML='<svg viewBox="0 0 24 24" fill="none" '+
            'stroke="currentColor" stroke-width="1.8" stroke-linecap="round" '+
            'stroke-linejoin="round" aria-hidden="true">'+AUDIO_ICONS[icon]+'</svg>';
        score.hud.setAttribute('aria-label',paused?'恢复播放':
            score.audio.muted?'取消静音':'静音');
        score.hud.setAttribute('aria-pressed',String(score.audio.muted));
        score.hud.classList.toggle('kkpt-audio-needs-resume',paused);
    }
    function mountAudioToggle(score){
        const old=document.getElementById('kkpt-audio-toggle');
        old?.remove();
        const hud=document.createElement('button');
        hud.type='button';hud.id='kkpt-audio-toggle';
        hud.setAttribute('aria-label','静音');
        score.hud=hud;
        document.body.append(hud);
        const audio=score.audio;
        hud.addEventListener('click',()=>{
            if(audio.paused||score.blocked){
                score.blocked=false;
                const resume=typeof score.resume==='function'?
                    score.resume():audio.play();
                Promise.resolve(resume).then(()=>{
                    updateAudioToggle(score);
                }).catch(err=>{
                    console.info('[KKPT] Audio resume blocked:',err);
                    score.blocked=true;updateAudioToggle(score);
                });
                updateAudioToggle(score);
                return;
            }
            audio.muted=!audio.muted;
            try{sessionStorage.setItem(SCORE_MUTE_KEY,audio.muted?'1':'0');}
            catch(_){}
            updateAudioToggle(score);
        });
        audio.addEventListener('play',()=>updateAudioToggle(score));
        audio.addEventListener('pause',()=>updateAudioToggle(score));
        updateAudioToggle(score);
    }
    function removeScoreOmen(){
        if(scoreOmen){
            const old=scoreOmen;
            const opacity=getComputedStyle(old).opacity;
            scoreOmen=null;
            old.style.opacity=opacity;
            old.classList.add('kkpt-omen-closing');
            // Let the V25 fire steadily replace the red veil. Abruptly
            // removing it at t=0 was the visible "turns bright" flash.
            requestAnimationFrame(()=>requestAnimationFrame(()=>{
                old.style.opacity='0';
            }));
            setTimeout(()=>old.remove(),1540);
        }
        document.body.classList.remove('kkpt-omen-running');
    }
    function startScoreOmen(score){
        if(score?.config?.id!=='marenoia'||scoreOmen)return;
        const omen=document.createElement('div');
        omen.id='kkpt-omen';omen.setAttribute('aria-hidden','true');
        omen.innerHTML='<i class="kkpt-omen-glow"></i>'+
            '<i class="kkpt-omen-line"></i>';
        document.body.append(omen);
        scoreOmen=omen;
        document.body.classList.add('kkpt-omen-running');
    }
    function clearFatePrelude(){
        fatePrelude?.remove();fatePrelude=null;
    }
    function releaseFatePrelude(){
        if(!fatePrelude)return;
        const node=fatePrelude;
        node.classList.add('kkpt-fate-merging');
        requestAnimationFrame(()=>{if(node.isConnected)node.style.opacity='0';});
    }
    function fateSigilMarkup(isDark){
        const at=(r,d)=>{
            const a=(d-90)*Math.PI/180;
            return [(150+Math.cos(a)*r).toFixed(2),
                (150+Math.sin(a)*r).toFixed(2)];
        };
        const ring=(r,cls)=>'<circle class="'+cls+
            '" cx="150" cy="150" r="'+r+'"/>';
        const stroke=(a,b,cls)=>'<path class="'+cls+
            '" d="M'+a.join(' ')+' L'+b.join(' ')+'"/>';
        const poly=(points,cls)=>'<polygon class="'+cls+'" points="'+
            points.map(p=>p.join(',')).join(' ')+'"/>';
        // An engraved astrolabe: four separately articulated scales,
        // star needles and micro-glyphs. The central emblem stays upright.
        const outer=ring(133,'kkpt-sigil-outer')+
            ring(128,'kkpt-sigil-orbit')+
            ring(121,'kkpt-sigil-ghost')+
            ring(105,'kkpt-sigil-seal')+
            ring(100,'kkpt-sigil-trace')+
            ring(83,'kkpt-sigil-ghost');
        const glyphs=Array.from({length:72},(_,i)=>{
            const angle=i*5;
            const major=i%6===0;
            return stroke(at(121,angle),at(major?132:i%3?125:128,angle),
                major?'kkpt-sigil-mark kkpt-sigil-major':'kkpt-sigil-mark');
        }).join('');
        const cardinal=Array.from({length:8},(_,i)=>{
            const a=i*45;
            return poly([at(99,a),at(111,a+4.2),at(120,a),at(111,a-4.2)],
                'kkpt-sigil-diamond')+
                stroke(at(85,a),at(96,a),'kkpt-sigil-needle');
        }).join('');
        const petals=Array.from({length:isDark?12:16},(_,i)=>{
            const a=i*360/(isDark?12:16);
            const mid=at(90,a),left=at(83,a-8),right=at(83,a+8);
            return '<path class="kkpt-sigil-filament" d="M'+left.join(' ')+
                ' Q'+mid.join(' ')+' '+right.join(' ')+'"/>';
        }).join('');
        const darkDrawing=
            '<path class="kkpt-sigil-dark-halo" d="M150 69L223 106 231 183 150 232 69 183 77 106Z"/>'+
            '<path class="kkpt-sigil-dark-halo" d="M150 75L201 99 225 150 201 201 150 225 99 201 75 150 99 99Z"/>'+
            '<path class="kkpt-sigil-thorn" d="M112 87L126 105 150 52 174 105 188 87 178 118 201 108 188 132M112 213L126 195 150 248 174 195 188 213 178 182 201 192 188 168"/>'+
            '<path class="kkpt-sigil-eye" d="M86 150Q116 111 150 118Q184 111 214 150Q184 189 150 182Q116 189 86 150Z"/>'+
            '<path class="kkpt-sigil-iris" d="M150 120Q176 140 176 150Q176 171 150 182Q124 171 124 150Q124 140 150 120Z"/>'+
            '<path class="kkpt-sigil-pupil" d="M150 127L158 150 150 174 142 150Z"/>'+
            '<path class="kkpt-sigil-fault" d="M78 105L105 119 95 135 115 148M224 191L197 180 206 165 185 152M149 65L141 85 157 97 147 111"/>'+
            '<path class="kkpt-sigil-filament" d="M98 147Q75 133 69 115M202 153Q226 167 231 185M133 201Q150 218 167 201"/>'+
            ring(56,'kkpt-sigil-iris-ring');
        // Symmetrical, OPEN feather vanes wrap around the compass rather
        // than crisscrossing its center as V39 did.
        const wings=Array.from({length:4},(_,i)=>{
            const y=128+i*13;
            const tip=79-i*4;
            return '<path class="kkpt-sigil-feathers" d="M129 '+(y+11)+
                'C110 '+(y-12)+' '+(90-i*3)+' '+(y-12)+
                ' '+tip+' '+y+
                'Q102 '+(y+13)+' 124 '+(y+19)+
                'M171 '+(y+11)+'C190 '+(y-12)+
                ' '+(210+i*3)+' '+(y-12)+' '+(300-tip)+' '+y+
                'Q198 '+(y+13)+' 176 '+(y+19)+'"/>';
        }).join('');
        const rays=Array.from({length:12},(_,i)=>{
            const a=i*30;
            return poly([at(27,a-3),at(i%2?51:63,a),at(27,a+3)],
                'kkpt-sigil-sun-ray');
        }).join('');
        const hopeDrawing=
            rays+wings+
            '<path class="kkpt-sigil-horizon" d="M75 204Q111 192 150 201Q189 192 225 204M90 218Q150 199 210 218"/>'+
            '<path class="kkpt-sigil-horizon" d="M86 94Q118 76 150 96Q182 76 214 94"/>'+
            '<path class="kkpt-sigil-leaf" d="M92 195Q69 178 84 160Q93 179 111 186M208 195Q231 178 216 160Q207 179 189 186"/>'+
            '<path class="kkpt-sigil-star" d="M150 105L161 137 195 150 161 163 150 195 139 163 105 150 139 137Z"/>'+
            '<path class="kkpt-sigil-star-inner" d="M150 122L157 143 178 150 157 157 150 178 143 157 122 150 143 143Z"/>'+
            ring(12,'kkpt-sigil-sun')+
            '<circle class="kkpt-sigil-center" cx="150" cy="150" r="4"/>';
        return '<svg class="kkpt-fate-sigil '+(isDark?'kkpt-sigil-ominous':
            'kkpt-sigil-hope')+'" viewBox="0 0 300 300" '+
            'xmlns="http://www.w3.org/2000/svg" aria-hidden="true">'+
            '<g class="kkpt-sigil-engraving" fill="none" stroke="'+
                (isDark?'#ff8c9b':'#f7edcf')+'" stroke-width="1.3">'+
                outer+glyphs+cardinal+petals+
                (isDark?darkDrawing:hopeDrawing)+'</g></svg>';
    }
    function startFatePrelude(anchor,targetPage){
        clearFatePrelude();
        const box=anchor?.getBoundingClientRect?.();
        const x=box?box.left+box.width/2:innerWidth/2;
        const y=box?box.top+box.height/2:innerHeight/2;
        const prelude=document.createElement('div');
        prelude.id='kkpt-fate-prelude';
        prelude.setAttribute('aria-hidden','true');
        const isDark=targetPage==='Kuronata';
        prelude.className=isDark?'kkpt-fate-dark':'kkpt-fate-light';
        prelude.style.setProperty('--kkpt-fate-x',x+'px');
        prelude.style.setProperty('--kkpt-fate-y',y+'px');
        prelude.style.setProperty('--kkpt-fate-dx',(innerWidth/2-x)+'px');
        prelude.style.setProperty('--kkpt-fate-dy',(innerHeight/2-y)+'px');
        prelude.style.setProperty('--kkpt-fate-dx15',((innerWidth/2-x)*.15)+'px');
        prelude.style.setProperty('--kkpt-fate-dy15',((innerHeight/2-y)*.15)+'px');
        prelude.style.setProperty('--kkpt-fate-dx91',((innerWidth/2-x)*.91)+'px');
        prelude.style.setProperty('--kkpt-fate-dy91',((innerHeight/2-y)*.91)+'px');
        prelude.innerHTML='<div class="kkpt-fate-orbit">'+
            '<i class="kkpt-fate-aura"></i>'+
            '<i class="kkpt-fate-ring kkpt-fate-ring-a"></i>'+
            '<i class="kkpt-fate-ring kkpt-fate-ring-b"></i>'+
            '<i class="kkpt-fate-arc"></i>'+
            '<i class="kkpt-fate-spark"></i>'+
            '<i class="kkpt-fate-wave"></i>'+
            fateSigilMarkup(isDark)+'</div>';
        // The sigil is a viewport overlay. Keeping it outside the zoomed
        // Wiki body makes the clicked gear travel directly to true center.
        root.append(prelude);
        fatePrelude=prelude;
        // The 6.6s sigil overlaps the full V25 curtain:
        // NEVER delay 00:33/02:39 to prolong the visual spectacle.
        setTimeout(()=>{
            if(fatePrelude===prelude)clearFatePrelude();
            else prelude.remove();
        },6650);
    }

    // Actual transient analysis of the hosted Marenoia recording, 22.05 kHz
    // mono / spectral-flux + low-band kick envelope. A main beat repeats
    // roughly every 0.439 seconds (~137 BPM), with salient attacks near
    // 31.775, 33.561, 33.751 and 34.250s. React to audio.currentTime:
    // wall-clock timers would desynchronize during MP3 buffering/seeking.
    const MARENOIA_TRANSIENTS=[
        [28.453,.56],[28.682,.58],[28.892,.76],[29.121,.64],
        [29.341,.72],[29.570,.48],[29.780,.87],[30.009,.93],
        [30.438,.44],[30.658,.77],[30.887,.83],[31.356,.68],
        [31.556,.79],[31.775,.93],[32.364,.29],[32.883,.36],
        [33.192,.38],[33.561,1],[33.751,.97],[34.250,.86],
        [34.469,.54],[35.317,.86],[35.786,.69]
    ];
    // The fire segment only gets lightning. The pressure / dark vignette
    // belongs to the AFTERMATH and survives the real page navigation.
    function createMarenoiaBeatScene(score){
        if(score.config.id!=='marenoia')return null;
        const lightningLayer=document.createElement('div');
        lightningLayer.id='kkpt-lightning-layer';
        lightningLayer.setAttribute('aria-hidden','true');
        document.body.append(lightningLayer);
        let live=true,raf=0,lastTick=0,nextBeat=0,progress=0;
        let lastLightning=-100;
        function lightning(t,strength){
            if(!live||t<.11||t>.96)return;
            const w=Math.max(1,innerWidth),h=Math.max(1,innerHeight);
            const rng=(a,b)=>a+Math.random()*(b-a);
            const edge=w*(1-t);
            let x=Math.min(w*.93,Math.max(edge+35,edge+(w-edge)*.53));
            const top=rng(-70,-16),bottom=rng(h*.46,h*.80);
            const points=[[x,top]];
            const count=9;
            for(let i=1;i<=count;i++){
                const yy=top+(bottom-top)*i/count;
                const xx=x+rng(-39,39)*(i/count)+Math.sin(i*2.4)*14;
                points.push([Math.max(10,Math.min(w-10,xx)),yy]);
            }
            const path=points.map((p,i)=>(i?'L':'M')+
                p[0].toFixed(1)+','+p[1].toFixed(1)).join(' ');
            const branchAt=Math.floor(rng(3,7));
            const p=points[branchAt];
            const branch='M'+p[0].toFixed(1)+','+p[1].toFixed(1)+
                ' l'+rng(-46,46).toFixed(1)+','+rng(45,86).toFixed(1)+
                ' l'+rng(-28,28).toFixed(1)+','+rng(38,71).toFixed(1);
            const ns='http://www.w3.org/2000/svg';
            const svg=document.createElementNS(ns,'svg');
            svg.setAttribute('class','kkpt-storm-bolt');
            svg.setAttribute('viewBox','0 0 '+w+' '+h);
            svg.setAttribute('preserveAspectRatio','none');
            svg.style.opacity=String(Math.min(1,.46+strength*.42));
            svg.style.clipPath='inset(0 0 0 '+
                Math.max(0,(1-t)*100).toFixed(2)+'%)';
            const addPath=(d,klass)=>{
                const el=document.createElementNS(ns,'path');
                el.setAttribute('d',d);el.setAttribute('class',klass);
                svg.append(el);
            };
            addPath(path,'kkpt-bolt-haze');
            addPath(path,'kkpt-bolt-core');
            addPath(branch,'kkpt-bolt-branch');
            lightningLayer.append(svg);
            setTimeout(()=>svg.remove(),390);
        }
        function tick(now){
            if(!live)return;
            raf=requestAnimationFrame(tick);
            if(now-lastTick<30)return;lastTick=now;
            const audio=score.audio;
            const audioTime=audio.currentTime;
            while(nextBeat<MARENOIA_TRANSIENTS.length&&
                MARENOIA_TRANSIENTS[nextBeat][0]<=audioTime){
                const [moment,strength]=MARENOIA_TRANSIENTS[nextBeat++];
                if(audioTime-moment<.22){
                    if(progress>.11&&strength>.81&&moment-lastLightning>.18){
                        lightning(progress,strength);
                        lastLightning=moment;
                    }
                }
            }
        }
        raf=requestAnimationFrame(tick);
        return {
            update(t){progress=t;},
            finish(){
                live=false;cancelAnimationFrame(raf);
                setTimeout(()=>lightningLayer.remove(),450);
            },
            dispose(){
                live=false;cancelAnimationFrame(raf);
                lightningLayer.remove();
            }
        };
    }

    // Measured with the submitted MP3: heavy low-frequency accents repeat
    // every 8 beats (~3.532 s at 135.9 BPM). Each was 1.6–2.1x the
    // median low-band RMS of the seven intervening beats. Never trigger
    // a full-screen pressure pump on all of the fast intermediate notes.
    const AFTER_DARK_KEY='kkpt:dark-afterglow:40';
    const DAWN_HALO_KEY='kkpt:dawn-cloudbreak:40';
    const MARENOIA_EIGHT_BEAT_KICKS=[
        35.311,38.843,42.375,45.907,49.429
    ];
    // Offline 0.25s RMS contour, normalized by the passage's 95th
    // percentile. Tracks long-form dynamics without cross-origin
    // WebAudio sample access (which may be forbidden by CORS).
    const MARENOIA_LOUDNESS=[
        .61,.71,.98,1,.85,.96,.92,.72,.57,.54,.45,.46,
        .53,.54,.56,.63,.92,1,.88,.95,.94,.77,.61,.61,
        .52,.41,.46,.48,.44,.50,.81,1,.92,.98,.90,.80,
        .63,.58,.54,.61,.65,.67,.65,.69,.83,1,.90,.93,
        .94,.81,.65,.65,.66,.65,.62,.64,.60,.58,.70,1,
        .91,.90,.95,.83,.62,.58,.46,.54,.47,.57,.55,.63
    ];
    function marenoiaLoudness(time){
        const pos=Math.max(0,Math.min(MARENOIA_LOUDNESS.length-1,
            (time-34.75)*4));
        const i=Math.floor(pos),j=Math.min(MARENOIA_LOUDNESS.length-1,i+1);
        return MARENOIA_LOUDNESS[i]*(1-(pos-i))+
            MARENOIA_LOUDNESS[j]*(pos-i);
    }
    function marenoiaDeepPulse(age){
        // A 420ms inhale, 300ms hold and ~2.2s heavy exhale.
        // One pressure wave per eight beats, not a rapid heartbeat.
        if(age<0||age>=2.98)return 0;
        if(age<.42)return smooth(age/.42);
        if(age<.72)return 1;
        return 1-smooth((age-.72)/2.26);
    }
    let kuronataAftermath=null;
    function mountKuronataAftermath(score){
        if(kuronataAftermath){
            if(score)kuronataAftermath.attach(score);
            return kuronataAftermath;
        }
        const layer=document.createElement('div');
        layer.id='kkpt-beat-scene';
        layer.setAttribute('aria-hidden','true');
        layer.className='kkpt-beat-after kkpt-beat-idle';
        layer.innerHTML='<div class="kkpt-beat-focus"></div>'+
            '<div class="kkpt-beat-lens"></div>'+
            '<div class="kkpt-beat-fringe"></div>'+
            '<div class="kkpt-beat-rupture"></div>'+
            '<svg class="kkpt-beat-scars" viewBox="0 0 1440 900" '+
            'preserveAspectRatio="none" aria-hidden="true">'+
            '<path d="M-20 340L126 317 203 355 294 339 383 382 477 352 605 395 728 365 842 399 982 371 1125 397 1264 351 1460 390" />'+
            '<path d="M-20 635L158 605 294 646 404 612 547 668 679 622 846 653 991 621 1149 668 1277 636 1460 660" />'+
            '<path d="M203 355l-19 33 27 39M842 399l30 34-20 47M404 612l-44 42 23 29M1149 668l39 41-18 32"/>'+
            '</svg>';
        // Put the vignette outside the page-scale camera so its
        // darkness covers the WHOLE viewport even while the body zooms.
        root.append(layer);
        let live=true,raf=0,lastTick=0,source=null,lastKick=-100;
        let cameraReleaseTimer=null;
        let smoothPressure=0,index=0;
        const releaseCamera=()=>{
            root.style.setProperty('--kkpt-camera-zoom','1');
            clearTimeout(cameraReleaseTimer);
            cameraReleaseTimer=setTimeout(()=>{
                if(!live)root.classList.remove('kkpt-camera-running');
            },420);
        };
        const quiet=()=>{
            layer.style.setProperty('--kkpt-beat-dark','.60');
            layer.style.setProperty('--kkpt-beat-scale','1.025');
            layer.style.setProperty('--kkpt-beat-blur','0.28px');
            layer.style.setProperty('--kkpt-beat-glitch','.12');
            layer.style.setProperty('--kkpt-beat-shear','0px');
            layer.style.setProperty('--kkpt-beat-shear-reverse','0px');
            layer.style.setProperty('--kkpt-beat-scars','.035');
            root.style.setProperty('--kkpt-camera-zoom','1');
            root.style.setProperty('--kkpt-camera-focus-y',
                (scrollY+innerHeight*.5).toFixed(1)+'px');
            root.style.setProperty('--kkpt-chroma-red','0px');
            root.style.setProperty('--kkpt-chroma-shadow','0px');
        };
        function tick(now){
            if(!live)return;
            raf=requestAnimationFrame(tick);
            if(now-lastTick<38)return;
            const dt=Math.min(.12,Math.max(.038,(now-lastTick)/1000));
            lastTick=now;
            if(!source||source.failed||source.audio.ended||
                source.audio.currentTime>=source.config.stopAt-.02){
                source=null;layer.classList.add('kkpt-beat-idle');
                quiet();live=false;cancelAnimationFrame(raf);
                releaseCamera();
                return;
            }
            const audioTime=source.audio.currentTime;
            while(index<MARENOIA_EIGHT_BEAT_KICKS.length&&
                MARENOIA_EIGHT_BEAT_KICKS[index]<=audioTime){
                lastKick=MARENOIA_EIGHT_BEAT_KICKS[index++];
            }
            // The recording's actual loudness and 18s player fade BOTH
            // attenuate the pump as the music settles down.
            const actualGain=Number(source.audio.volume);
            const playerGain=Number.isFinite(actualGain)
                ? Math.max(0,Math.min(1,actualGain/.78)):1;
            const soundStrength=(.48+.52*marenoiaLoudness(audioTime))*
                playerGain;
            const targetPressure=marenoiaDeepPulse(audioTime-lastKick)*
                soundStrength;
            const follow=1-Math.exp(-dt/.21);
            smoothPressure+=(targetPressure-smoothPressure)*follow;
            const pressure=smoothPressure;
            root.classList.add('kkpt-camera-running');
            layer.style.setProperty('--kkpt-beat-dark',
                (.60+.38*pressure).toFixed(3));
            layer.style.setProperty('--kkpt-beat-scale',
                (1.025-.175*pressure).toFixed(4));
            layer.style.setProperty('--kkpt-beat-blur',
                (.28+2.6*pressure).toFixed(2)+'px');
            layer.style.setProperty('--kkpt-beat-glitch',
                (.12+.63*pressure).toFixed(3));
            const shear=Math.sin(index*1.47)*pressure*9.0;
            layer.style.setProperty('--kkpt-beat-shear',
                shear.toFixed(2)+'px');
            layer.style.setProperty('--kkpt-beat-shear-reverse',
                (-shear*.86).toFixed(2)+'px');
            layer.style.setProperty('--kkpt-beat-scars',
                (.035+.76*pressure).toFixed(3));
            // V40 camera breathes IN then exhales to its natural size.
            // Zoom is never below 1.0: no blue/uncovered viewport edges.
            // The transform belongs to the whole body (Wiki chrome,
            // sidebar, imagery and text), not only #mw-content-text.
            root.style.setProperty('--kkpt-camera-zoom',
                (1.008+.054*pressure).toFixed(4));
            root.style.setProperty('--kkpt-camera-focus-y',
                (scrollY+innerHeight*.5).toFixed(1)+'px');
            root.style.setProperty('--kkpt-chroma-red',
                (-4.4*pressure).toFixed(2)+'px');
            root.style.setProperty('--kkpt-chroma-shadow',
                (5.6*pressure).toFixed(2)+'px');
        }
        quiet();
        kuronataAftermath={
            attach(nextScore){
                source=nextScore;
                nextScore.aftermath=kuronataAftermath;
                if(live){cancelAnimationFrame(raf);}
                clearTimeout(cameraReleaseTimer);
                live=true;lastTick=0;lastKick=-100;smoothPressure=0;
                index=0;
                layer.classList.remove('kkpt-beat-idle');
                raf=requestAnimationFrame(tick);
            },
            settle(){
                source=null;live=false;cancelAnimationFrame(raf);
                layer.classList.add('kkpt-beat-idle');quiet();
                releaseCamera();
            },
            fadeToDawn(){
                source=null;live=false;cancelAnimationFrame(raf);
                releaseCamera();
                layer.classList.add('kkpt-beat-outro');
                const old=layer;
                setTimeout(()=>{
                    old.remove();
                    if(kuronataAftermath?.layer===old)kuronataAftermath=null;
                },2400);
            },
            dispose(){
                source=null;live=false;cancelAnimationFrame(raf);
                clearTimeout(cameraReleaseTimer);
                root.classList.remove('kkpt-camera-running');
                root.style.removeProperty('--kkpt-camera-zoom');
                root.style.removeProperty('--kkpt-camera-focus-y');
                root.style.removeProperty('--kkpt-chroma-red');
                root.style.removeProperty('--kkpt-chroma-shadow');
                layer.remove();kuronataAftermath=null;
            },
            layer
        };
        if(score)kuronataAftermath.attach(score);
        return kuronataAftermath;
    }
    function createCloudbreakAfterglow(continueFromNavigation=false){
        const previous=document.getElementById('kkpt-cloudbreak');
        previous?.remove();
        let timestamp=Date.now();
        if(continueFromNavigation){
            try{timestamp=Number(sessionStorage.getItem(DAWN_HALO_KEY));}
            catch(_){return;}
            if(!Number.isFinite(timestamp)||timestamp<=0)return;
        }else{
            try{sessionStorage.setItem(DAWN_HALO_KEY,String(timestamp));}
            catch(_){}
        }
        const elapsed=Math.max(0,Date.now()-timestamp);
        if(elapsed>6900){
            try{sessionStorage.removeItem(DAWN_HALO_KEY);}catch(_){}
            return;
        }
        const bloom=document.createElement('div');
        bloom.id='kkpt-cloudbreak';
        bloom.setAttribute('aria-hidden','true');
        bloom.style.setProperty('--kkpt-dawn-delay',(-elapsed)+'ms');
        bloom.innerHTML='<i class="kkpt-dawn-dark-rim"></i>'+
            '<i class="kkpt-dawn-bright-rim"></i>'+
            '<i class="kkpt-dawn-cloud-sweep"></i>';
        root.append(bloom);
        setTimeout(()=>{
            bloom.remove();
            try{
                if(Number(sessionStorage.getItem(DAWN_HALO_KEY))===timestamp)
                    sessionStorage.removeItem(DAWN_HALO_KEY);
            }catch(_){}
        },Math.max(0,7000-elapsed));
    }
    function createRebirthVisual(){
        // Hope replaces ash: a barely perceptible rainbow after the rain.
        // No numbered / nested six-band rainbow; just one diffuse halo.
        // All are compositor layers; nothing is rasterized on every frame.
        const layer=document.createElement('div');
        layer.id='kkpt-rebirth-visual';
        layer.setAttribute('aria-hidden','true');
        const drizzle=document.createElement('div');
        drizzle.className='kkpt-rebirth-rain';
        const rainbow=document.createElementNS('http://www.w3.org/2000/svg','svg');
        rainbow.setAttribute('class','kkpt-rebirth-rainbow');
        rainbow.setAttribute('viewBox','0 0 1000 650');
        rainbow.setAttribute('preserveAspectRatio','none');
        const svgNS='http://www.w3.org/2000/svg';
        const defs=document.createElementNS(svgNS,'defs');
        const gradient=document.createElementNS(svgNS,'linearGradient');
        gradient.setAttribute('id','kkpt-rebirth-muted-arc');
        gradient.setAttribute('x1','0%');
        gradient.setAttribute('x2','100%');
        const haloColors=['#c7e5ff','#e4f7e6','#f7ebd9','#e7e0f5'];
        haloColors.forEach((color,i)=>{
            const stop=document.createElementNS(svgNS,'stop');
            stop.setAttribute('offset',(i*100/3).toFixed(1)+'%');
            stop.setAttribute('stop-color',color);
            gradient.append(stop);
        });
        defs.append(gradient);
        const arc=document.createElementNS(svgNS,'path');
        arc.setAttribute('d','M -100 625 Q 500 -175 1100 625');
        arc.setAttribute('fill','none');
        arc.setAttribute('stroke','url(#kkpt-rebirth-muted-arc)');
        arc.setAttribute('stroke-width','36');
        rainbow.append(defs,arc);
        const light=document.createElement('div');
        light.className='kkpt-rebirth-sunlight';
        const essence=document.createElement('div');
        essence.className='kkpt-rebirth-essence';
        const count=innerWidth<700?14:24;
        for(let i=0;i<count;i++){
            const mote=document.createElement('i');
            mote.className='kkpt-rebirth-mote';
            mote.style.left=(5+Math.random()*88).toFixed(1)+'%';
            mote.style.top=(22+Math.random()*73).toFixed(1)+'%';
            mote.style.animationDelay=(-Math.random()*2.8).toFixed(2)+'s';
            mote.style.animationDuration=(2.3+Math.random()*1.8).toFixed(2)+'s';
            essence.append(mote);
        }
        layer.append(drizzle,light,rainbow,essence);
        document.body.append(layer);
        let last=-1,alive=true;
        return {
            update(t){
                if(!alive||Math.abs(t-last)<.018&&t<1)return;
                last=t;
                layer.style.clipPath='inset(0 '+
                    (Math.max(0,1-t)*100).toFixed(2)+'% 0 0)';
                drizzle.style.opacity=(.30*Math.pow(1-t,1.4)).toFixed(3);
                light.style.opacity=(Math.max(0,Math.min(1,(t-.12)/.67))*.47).toFixed(3);
                rainbow.style.opacity=(Math.max(0,Math.min(1,(t-.48)/.40))*.105).toFixed(3);
                essence.style.opacity=(Math.max(0,Math.min(1,(t-.22)/.55))*.72).toFixed(3);
            },
            finish(){
                alive=false;layer.classList.add('kkpt-rebirth-finish');
                setTimeout(()=>layer.remove(),1250);
            },
            dispose(){alive=false;layer.remove();}
        };
    }
    function clearReturnScore(score){
        if(!score)return;
        clearInterval(score.displayTimer);
        score.hud?.remove();
        score.beatScene?.dispose();
        score.aftermath?.settle();
        try{
            score.audio.pause();
            score.audio.removeAttribute('src');score.audio.load();
        }catch(_){}
        if(returnScore===score)returnScore=null;
        if(score.config?.id==='marenoia')removeScoreOmen();
    }
    function watchScore(score){
        const audio=score.audio,config=score.config;
        score.displayTimer=setInterval(()=>{
            if(audio.ended||audio.error||audio.currentTime>=config.stopAt-.018){
                clearReturnScore(score);return;
            }
            const elapsed=Math.max(0,audio.currentTime-config.startAt);
            const remaining=Math.max(0,config.stopAt-audio.currentTime);
            const fadeIn=config.fadeInSeconds?
                Math.min(1,elapsed/config.fadeInSeconds):1;
            const fadeOut=config.fadeSeconds?
                Math.min(1,remaining/config.fadeSeconds):1;
            audio.volume=.78*Math.min(fadeIn,fadeOut);
        },60);
        audio.addEventListener('ended',()=>clearReturnScore(score),{once:true});
        audio.addEventListener('error',()=>{
            score.failed=true;clearReturnScore(score);
        },{once:true});
    }
    function createScore(config){
        const audio=new Audio(config.url);
        audio.preload='auto';audio.playsInline=true;
        audio.volume=0;audio.muted=userWantsMute();
        const score={audio,config,failed:false,blocked:false,
            displayTimer:null,hud:null,playPromise:null};
        returnScore=score;
        mountAudioToggle(score);
        watchScore(score);
        return score;
    }
    function armReturnScore(targetPage){
        const config=SCORES[targetPage];
        if(!config||targetPage===basePage)return null;
        if(returnScore&&!returnScore.failed&&
            returnScore.config.id===config.id)return returnScore;
        if(returnScore)clearReturnScore(returnScore);
        const score=createScore(config);
        // Seek straight into the selected three-second transition prelude.
        try{score.audio.currentTime=config.startAt;}catch(_){}
        score.audio.addEventListener('loadedmetadata',()=>{
            if(score.audio.currentTime<config.startAt-.2){
                try{score.audio.currentTime=config.startAt;}catch(_){}
            }
        },{once:true});
        startScoreOmen(score);
        try{
            score.playPromise=Promise.resolve(score.audio.play()).then(()=>{
                return true;
            },err=>{
                console.warn('[KKPT] Soundtrack playback blocked:',err);
                score.failed=true;clearReturnScore(score);return false;
            });
        }catch(err){
            console.warn('[KKPT] Soundtrack playback failed:',err);
            score.failed=true;clearReturnScore(score);
            score.playPromise=Promise.resolve(false);
        }
        return score;
    }
    function awaitScoreTime(score,seconds){
        if(!score||score.failed)return Promise.resolve(false);
        return new Promise(resolve=>{
            const audio=score.audio;
            let timer=null,lastTime=audio.currentTime;
            let lastMovement=performance.now();
            let settled=false;
            const done=ok=>{
                if(settled)return;
                settled=true;clearInterval(timer);
                audio.removeEventListener('timeupdate',check);
                audio.removeEventListener('ended',check);
                audio.removeEventListener('error',check);
                resolve(ok);
            };
            const check=()=>{
                if(audio.currentTime>=seconds-.018){done(true);return;}
                if(score.failed||audio.error||audio.ended){done(false);return;}
                if(audio.currentTime>lastTime+.015){
                    lastTime=audio.currentTime;lastMovement=performance.now();
                }
                // A stalled soundtrack cannot trap navigation indefinitely.
                if(performance.now()-lastMovement>20000)done(false);
            };
            audio.addEventListener('timeupdate',check);
            audio.addEventListener('ended',check);
            audio.addEventListener('error',check);
            timer=setInterval(check,75);
            check();
        });
    }
    function saveReturnScoreHandoff(score){
        if(!score||score.failed||score.audio.ended||
            score.audio.currentTime>=score.config.stopAt-.15)return;
        try{
            sessionStorage.setItem(SCORE_KEY,JSON.stringify({
                stamp:Date.now(),time:score.audio.currentTime,
                target:score.config.target,
                expires:Date.now()+115000,revision:40
            }));
            if(score.config.id==='marenoia'){
                sessionStorage.setItem(AFTER_DARK_KEY,'1');
            }
        }catch(err){
            console.warn('[KKPT] Cannot preserve soundtrack position:',err);
        }
    }
    function restoreReturnScoreHandoff(){
        if(window!==window.top)return false;
        let saved=null;
        try{
            saved=JSON.parse(sessionStorage.getItem(SCORE_KEY));
            sessionStorage.removeItem(SCORE_KEY);
        }catch(_){}
        if(!saved||saved.revision!==40||saved.target!==basePage||
            Date.now()>saved.expires)return false;
        const config=SCORES[saved.target];
        if(!config)return false;
        const currentTarget=()=>saved.time+
            (Date.now()-saved.stamp)/1000;
        if(currentTarget()>=config.stopAt-.15)return false;
        const score=createScore(config);
        const audio=score.audio;
        let attempted=false,blockedAt=null;
        function playFromPosition(){
            const requested=blockedAt===null?currentTarget():blockedAt;
            const position=Math.min(config.stopAt-.12,requested);
            if(position>=config.stopAt-.15){clearReturnScore(score);return;}
            try{audio.currentTime=Math.max(config.startAt,position);}catch(_){}
            Promise.resolve(audio.play()).then(()=>{
                blockedAt=null;
                score.blocked=false;updateAudioToggle(score);
            }).catch(err=>{
                // The only fallback is the SAME small icon, no audio popup.
                console.info('[KKPT] Browser requires an audio click:',err);
                blockedAt=position;score.blocked=true;
                updateAudioToggle(score);
            });
        }
        score.resume=()=>{
            if(blockedAt!==null){
                try{audio.currentTime=blockedAt;}catch(_){}
            }
            return Promise.resolve(audio.play()).then(value=>{
                blockedAt=null;return value;
            });
        };
        const autoplay=()=>{
            if(attempted)return;attempted=true;
            playFromPosition();
        };
        audio.addEventListener('loadedmetadata',autoplay,{once:true});
        audio.load();
        setTimeout(()=>{if(audio.readyState>=1)autoplay();},1100);
        return true;
    }

    let active = false; // true only during the visual handoff; destination navigates natively
    let animating = false;
    let gearPending = false;
    let ready = false;
    let loading = null;
    let button, labelTitle, labelSub, labelIcon, frame;
    let otherTitle = otherPage + ' - Blockland Wiki';

    function whichPage() { return active ? otherPage : basePage; }
    function destination() { return active ? basePage : otherPage; }
    function isDark(page) { return page === 'Kuronata'; }
    function pathPage() {
        const url = new URL(location.href);
        if (url.pathname.startsWith('/wiki/')) {
            try { return decodeURIComponent(url.pathname.slice(6)).replace(/_/g, ' '); }
            catch (e) { return ''; }
        }
        return url.searchParams.get('title') || '';
    }

    function updateButton() {
        if (!button) return;
        const to = destination();
        button.href = to === basePage ? baseUrl : otherUrl.href;
        labelTitle.textContent = to.toUpperCase();
        labelSub.textContent = isDark(to) ? 'BURN THE SKY' : 'RECLAIM THE SKY';
        labelIcon.textContent = isDark(to) ? '✦' : '❄';
        button.classList.toggle('kkpt-dark', isDark(whichPage()));
        button.setAttribute('aria-label', isDark(to) ? '燃尽天空,进入 Kuronata' : '驱散黑暗,回到 Kuranoka');
    }

    // Accept the two standard MediaWiki link forms, while rejecting
    // edit/action links, external sites and similarly named articles.
    function wikiLinkPage(anchor, doc) {
        try {
            const url = new URL(anchor.href, doc.baseURI);
            if (url.origin !== location.origin) return null;
            const action = url.searchParams.get('action');
            if (action && action !== 'view') return null;
            let title = url.searchParams.get('title');
            if (!title) {
                const matched = url.pathname.match(/^\/wiki\/([^/?#]+)\/?$/);
                if (matched) title = decodeURIComponent(matched[1]);
            }
            title = (title || '').replace(/_/g, ' ');
            return title === 'Kuranoka' || title === 'Kuronata' ? title : null;
        } catch (_) {
            return null;
        }
    }

    function decoratePortalLinks(doc, targetPage) {
        // Use only the article: sidebar, edit tools and site-wide links
        // must retain their usual navigation behavior.
        const content = doc.querySelector('#mw-content-text,.mw-parser-output');
        if (!content) return;
        content.querySelectorAll('a[href]').forEach(anchor => {
            if(anchor.classList.contains('kkpt-fate-gear'))return;
            if (wikiLinkPage(anchor, doc) !== targetPage) return;
            anchor.classList.add('kkpt-portal-link');
            anchor.classList.toggle('kkpt-portal-red', targetPage === 'Kuronata');
            anchor.classList.toggle('kkpt-portal-blue', targetPage === 'Kuranoka');
            const caption = (anchor.textContent || '').trim();
            if (caption) anchor.dataset.kkptText = caption.slice(0, 120);
            anchor.setAttribute('aria-label', caption + ',切换至 ' + targetPage);
        });
    }

    function watchPortalLinks(doc, targetPage) {
        decoratePortalLinks(doc, targetPage);
        if (doc.__kkptPortalObserver) return;
        const root = doc.querySelector('#mw-content-text,.mw-parser-output');
        if (!root) return;
        let pending=false;
        const observer = new MutationObserver(() => {
            if(pending)return;
            pending=true;
            setTimeout(()=>{
                pending=false;
                decoratePortalLinks(doc,targetPage);
            },120);
        });
        observer.observe(root, {childList:true,subtree:true});
        doc.__kkptPortalObserver = observer;
    }

    function isPlainClick(event) {
        return !event.defaultPrevented && event.button === 0 &&
            !event.ctrlKey && !event.metaKey && !event.altKey && !event.shiftKey;
    }

    function findAnchor(event, doc) {
        const target = event.target;
        return target && target.nodeType === 1 &&
            typeof target.closest === 'function'
            ? target.closest('a[href],button.kkpt-fate-gear') : null;
    }

    function portalClick(event, doc, targetPage, nextActive) {
        if (!isPlainClick(event)) return false;
        const anchor = findAnchor(event, doc);
        const gear=anchor?.classList.contains('kkpt-fate-gear')&&
            anchor.dataset.kkptTargetPage===targetPage;
        if (!anchor || (anchor.target && anchor.target !== '_self') ||
            anchor.hasAttribute('download') ||
            (!gear&&wikiLinkPage(anchor, doc)!==targetPage)) return false;
        event.preventDefault();
        if(animating||gearPending)return true;
        // Both directions start playback during the trusted user gesture.
        const score=armReturnScore(targetPage);
        if(targetPage==='Kuronata'&&score&&!score.beatScene){
            score.beatScene=createMarenoiaBeatScene(score);
        }
        startFatePrelude(anchor,targetPage);
        primeSound(); // Synchronous click activation unlocks Web Audio.
        if(gear) {
            beginFateSwap(anchor,nextActive);
        } else {
            requestSwap(nextActive);
        }
        return true;
    }

    // The Infobox gear begins to turn before the actual world changes.
    function beginFateSwap(anchor,nextActive) {
        if(animating||gearPending||nextActive===active)return;
        gearPending=true;
        anchor.classList.add('kkpt-fate-gear-turning');
        // The gear and the world run on the SAME audio timeline. A 2s
        // unobserved setTimeout used to create an awkward silent gap.
        requestAnimationFrame(()=>{
            gearPending=false;
            requestSwap(nextActive);
        });
        setTimeout(()=>anchor.classList.remove('kkpt-fate-gear-turning'),3300);
    }

    function fateGearShape() {
        const parts=[];
        for(let i=0;i<48;i++) {
            const a=i/48*Math.PI*2-Math.PI/2;
            const r=(i%4===0||i%4===3)?21:16.8;
            parts.push((i?'L':'M')+(24+Math.cos(a)*r).toFixed(2)+' '+
                (24+Math.sin(a)*r).toFixed(2));
        }
        return parts.join(' ')+' Z';
    }

    function mountFateGear(doc,targetPage) {
        if(doc.querySelector('.kkpt-fate-gear'))return;
        const content=doc.querySelector('#mw-content-text,.mw-parser-output');
        if(!content)return;
        // The fate wheel stays inside the native Infobox caption, but is
        // positioned independently: it must NEVER push the title off-center.
        const box=content.querySelector('table.infobox.vcard,table.infobox');
        const host=box?.caption ||
            box?.querySelector('th.infobox-above,th.infobox-title,th[colspan]')||
            doc.querySelector('#firstHeading .mw-page-title-main,'+
                '.mw-page-title-main,#firstHeading');
        if(!host)return;
        host.classList.add('kkpt-fate-host');
        const anchor=doc.createElement('button');
        anchor.type='button';
        anchor.className='kkpt-fate-gear';
        // A native button cannot be mistaken for an article link by
        // MediaWiki Popups, including in previews loaded into iframes.
        anchor.dataset.kkptTargetPage=targetPage;
        const gearLabel=targetPage==='Kuronata'
            ?'命运的齿轮 · 唤醒 Kuronata':'命运的齿轮 · 回到 Kuranoka';
        anchor.setAttribute('aria-label',gearLabel);
        anchor.innerHTML='<svg class="kkpt-fate-gear-svg" viewBox="0 0 48 48" '+
            'aria-hidden="true" focusable="false"><path d="'+fateGearShape()+
            '"/><circle cx="24" cy="24" r="8.5"/>'+
            '<circle cx="24" cy="24" r="3"/></svg>';
        host.appendChild(anchor);

        // Fixed corner placement: no title measurements, ResizeObserver
        // or reflow during the animation.
    }

    // Read backgrounds after background-template code populates --bg-image.
    function backgroundUrls(doc) {
        const urls = new Set();
        const selector = [doc.documentElement, doc.body];
        try {
            doc.querySelectorAll('.background-theme,[class*="background"],[style*="background"],#mw-content-text,.citizen-page-container')
                .forEach((el, i) => { if (i < 18) selector.push(el); });
        } catch (e) { /* use html/body */ }
        function add(value) {
            if (!value) return;
            const pattern = /url\(\s*(['"]?)(.*?)\1\s*\)/gi;
            let match;
            while ((match = pattern.exec(value))) {
                try { urls.add(new URL(match[2], doc.baseURI).href); } catch (e) { /* ignore */ }
            }
            if (/^https?:\/\/\S+\.(?:jpg|jpeg|png|webp|avif)(?:\?\S*)?$/i.test(value)) {
                try { urls.add(new URL(value, doc.baseURI).href); } catch (e) { /* ignore */ }
            }
        }
        selector.forEach(el => {
            if (!el) return;
            try {
                [null, '::before', '::after'].forEach(pseudo => {
                    const style = doc.defaultView.getComputedStyle(el, pseudo);
                    if (!style) return;
                    add(style.backgroundImage);
                    add(style.getPropertyValue('--bg-image'));
                    add(style.getPropertyValue('--background-image'));
                });
                if (el.dataset) add(el.dataset.bgImage);
            } catch (e) { /* style not yet ready */ }
        });
        return [...urls];
    }

    function warmImage(url) {
        if (imagePool.has(url)) return imagePool.get(url).promise;
        const image = new Image();
        const promise = new Promise(resolve => {
            let finished = false;
            const timeout = setTimeout(() => done(false), 5000);
            function done(ok) {
                if (finished) return;
                finished = true;
                clearTimeout(timeout);
                resolve(ok);
            }
            image.onload = () => done(true);
            image.onerror = () => done(false);
            image.src = url;
            if (image.complete) done(image.naturalWidth > 0);
        }).then(ok => ok && image.decode
            ? Promise.race([image.decode().then(() => true).catch(() => true),sleep(900).then(() => true)])
            : ok);
        imagePool.set(url, { image, promise });
        return promise;
    }

    async function warmBackgrounds(doc) {
        const urls = backgroundUrls(doc);
        await Promise.allSettled(urls.map(warmImage));
    }

    function wireFrame() {
        try {
            const doc = frame.contentDocument;
            if (!doc) return;
            otherTitle = doc.title || otherTitle;
            // The preview exists only for the animated reveal. Pausing
            // its hidden ambience avoids doubling ongoing render work.
            doc.documentElement.classList.add('kkpt-frame-inactive');
            watchPortalLinks(doc, basePage);
            mountFateGear(doc, basePage);
            if (doc.__kkptFrameBridge) return;
            doc.__kkptFrameBridge = true;

            // Non-anchor navigation should leave the iframe and open normally
            // in the top window, so the browser's URL doesn't become stale.
            doc.addEventListener('click', event => {
                if (!active || !isPlainClick(event)) return;
                if (portalClick(event, doc, basePage, false)) return;
                const el = findAnchor(event, doc);
                if (!el || (el.target && el.target !== '_self')) return;
                const href = el.href;
                if (!href || href.startsWith('javascript:')) return;
                const next = new URL(href, doc.baseURI);
                // Same-document fragments stay inside the temporary preview.
                const currentFrame = new URL(frame.contentWindow.location.href);
                if (next.origin === currentFrame.origin &&
                    next.pathname === currentFrame.pathname &&
                    next.search === currentFrame.search && next.hash) {
                    history.replaceState(history.state, '', next.href);
                    return;
                }
                event.preventDefault();
                navigateRealPage(next.href);
            }, true);

            doc.addEventListener('submit', event => {
                if (active && event.target instanceof doc.defaultView.HTMLFormElement) {
                    event.target.target = '_top';
                }
            }, true);
        } catch (err) {
            console.warn('[KuranokaPageTransition] Frame link bridge unavailable:', err);
        }
    }

    function warmFrame() {
        if (loading) return loading;
        frame = document.createElement('iframe');
        frame.id = 'kkpt-preview';
        frame.src = otherUrl.href; // set BEFORE insertion, avoids extra initial history hop
        frame.title = otherPage + ' 预载页面';
        frame.tabIndex = -1;
        frame.setAttribute('aria-hidden', 'true');
        frame.setAttribute('loading', 'eager');
        frame.style.clipPath = hideClip;
        // Load all resources in advance, but don't composite the hidden
        // full-screen Wiki until its first transition frame.
        frame.style.visibility = 'hidden';
        // Never expose a plain cyan rectangle while the destination Wiki
        // page is still painting. The image is the same native world photo.
        const targetBackdrop=worldBackdrops[otherPage];
        if(targetBackdrop){
            frame.style.backgroundImage='url("'+targetBackdrop+'")';
            frame.style.backgroundPosition='center center';
            frame.style.backgroundSize='cover';
            frame.style.backgroundRepeat='no-repeat';
        }

        loading = new Promise(resolve => {
            let settled = false;
            let preparing = false;
            let poll = null;
            function finish(ok, reason) {
                if (settled) return;
                settled = true;
                clearInterval(poll);
                ready = ok;
                if (!ok) console.warn('[KuranokaPageTransition] Preview:', reason);
                resolve(ok);
            }
            async function inspect() {
                if (settled || preparing) return;
                try {
                    const doc = frame.contentDocument;
                    if (!doc || !doc.querySelector('#mw-content-text,.mw-parser-output')) return;
                    preparing = true;
                    clearInterval(poll);
                    await sleep(320); // Background.js / wiki style scripts
                    await Promise.race([warmBackgrounds(doc), sleep(3600)]);
                    await sleep(120);
                    await Promise.race([warmBackgrounds(doc), sleep(1300)]);
                    frame.contentWindow.scrollTo(0, 0);
                    wireFrame();
                    finish(true);
                } catch (err) { finish(false, String(err)); }
            }
            frame.addEventListener('load', () => {
                if (!settled && !preparing) inspect();
            });
            frame.addEventListener('error', () => finish(false,'iframe 网络加载错误'));
            document.body.append(frame);
            poll = setInterval(inspect, 130);
            setTimeout(() => { if (!settled && !preparing) finish(false,'18 秒仍未找到目标正文'); }, 18000);
        });

        warmBackgrounds(document).catch(() => {});
        setTimeout(() => warmBackgrounds(document).catch(() => {}), 700);
        return loading;
    }


    // Shared, low-resolution atmospherics: return of V14's dark smoke,
    // long-lived torn paper, shockwaves, blue-white petals and pollen.
    // Only the combustion CURTAIN is replaced by the bright V2 engine.
    let atmosphereAssetCache=null;
    const atmosphereNoiseCache=new Map();
    function createAtmosphere(canvas,buildOneOnly=false) {
        const ctx = canvas.getContext('2d', {alpha:true});
        const rand = n => {
            const cached=atmosphereNoiseCache.get(n);
            if(cached!==undefined)return cached;
            const x = Math.sin(n*127.1+311.7)*43758.5453123;
            const value=x-Math.floor(x);
            atmosphereNoiseCache.set(n,value);
            return value;
        };
        const clamp01 = n => Math.max(0,Math.min(1,n));
        function valueNoise(x,y,seed) {
            const ix=Math.floor(x), iy=Math.floor(y);
            let fx=x-ix,fy=y-iy;
            fx=fx*fx*(3-2*fx);fy=fy*fy*(3-2*fy);
            const h=(a,b)=>rand(a*171.3+b*513.7+seed*89.1);
            const a=h(ix,iy)*(1-fx)+h(ix+1,iy)*fx;
            const b=h(ix,iy+1)*(1-fx)+h(ix+1,iy+1)*fx;
            return a*(1-fy)+b*fy;
        }
        function smokeTexture(seed,dark) {
            const tex=document.createElement('canvas');
            tex.width=tex.height=112;
            const g=tex.getContext('2d');
            const data=g.createImageData(112,112);
            for(let y=0;y<112;y++) for(let x=0;x<112;x++){
                const u=(x-56)/56,v=(y-56)/56;
                const curl=valueNoise(u*2.9+11,v*2.9+1,seed);
                const curl2=valueNoise(u*3.4+3,v*3.4+7,seed+7);
                const wx=u+.47*(curl-.5),wy=v+.40*(curl2-.5);
                const radius=Math.sqrt(wx*wx*.91+wy*wy*1.13);
                const envelope=clamp01((1.05-radius)/.56);
                const low=valueNoise(u*4.1+4,v*4.1-9,seed+2);
                const high=valueNoise(u*11.4-3,v*11.4+6,seed+5);
                const fibers=valueNoise(u*22.0+1,v*16.0+5,seed+9);
                const density=clamp01((low*.62+high*.28+fibers*.10-.28)*2.0)*
                    envelope*envelope;
                const i=(y*112+x)*4;
                const variation=low*28+high*15;
                if(dark){
                    data.data[i]=5+variation*.37;
                    data.data[i+1]=5+variation*.33;
                    data.data[i+2]=8+variation*.38;
                }else{
                    data.data[i]=44+variation;
                    data.data[i+1]=91+variation;
                    data.data[i+2]=125+variation;
                }
                data.data[i+3]=Math.round(240*density);
            }
            g.putImageData(data,0,0);
            return tex;
        }
        // V2-inspired white-hot additive sprites, but with noise-eroded
        // silhouettes instead of repetitive smooth, elliptical balls.
        function glowTexture(seed,mode) {
            const tex=document.createElement('canvas');
            tex.width=96;tex.height=128;
            const g=tex.getContext('2d');
            const gradient=g.createRadialGradient(48,68,0,48,68,64);
            const colors=mode==='fire'
                ? [[0,'#fffef1'],[.14,'#fff4bb'],[.34,'#ffd04d'],
                   [.55,'#ff841bcc'],[.80,'#bc290749'],[1,'#6e030000']]
                : mode==='blue'
                ? [[0,'#ffffff'],[.19,'#f1ffff'],[.40,'#a2efff'],
                   [.68,'#5298ff99'],[1,'#345bf000']]
                : [[0,'#ffffff'],[.19,'#fff8cd'],[.49,'#ff9b28cc'],
                   [1,'#ff380000']];
            colors.forEach(([p,c])=>gradient.addColorStop(p,c));
            g.fillStyle=gradient;g.fillRect(0,0,96,128);
            const img=g.getImageData(0,0,96,128);
            for(let y=0;y<128;y++)for(let x=0;x<96;x++){
                const u=(x-48)/48,v=(y-64)/64;
                const cloud=valueNoise(u*4+seed*1.9,v*4+seed*.7,seed+18);
                const fiber=valueNoise(u*11+3,v*8+17,seed+41);
                const shifted=u+.18*(cloud-.5);
                const irregular=clamp01((1.15-Math.abs(shifted))/.52)*
                    clamp01((1.05-Math.abs(v+.12*(fiber-.5)))/.42);
                const n=.59+.77*cloud+.28*fiber;
                const alphaIndex=(y*96+x)*4+3;
                img.data[alphaIndex]=Math.round(img.data[alphaIndex]*
                    irregular*clamp01(n));
            }
            g.putImageData(img,0,0);
            return tex;
        }
        // V25: the profiler found one 270ms long task here. Build the
        // EXACT SAME 17 textures in separate tasks, never all at once.
        // The stable noise cache avoids repeating the costly sin hash.
        const cache=atmosphereAssetCache ||= {
            sootSprites:[],mistSprites:[],FIRE_GLOW:[],BLUE_GLOW:[],
            EMBER_GLOW:null
        };
        function buildNextAsset(){
            let n=cache.sootSprites.length;
            if(n<4){cache.sootSprites.push(smokeTexture(n+17,true));return true;}
            n=cache.mistSprites.length;
            if(n<4){cache.mistSprites.push(smokeTexture(n+51,false));return true;}
            n=cache.FIRE_GLOW.length;
            if(n<4){cache.FIRE_GLOW.push(glowTexture(n+1,'fire'));return true;}
            n=cache.BLUE_GLOW.length;
            if(n<4){cache.BLUE_GLOW.push(glowTexture(n+8,'blue'));return true;}
            if(!cache.EMBER_GLOW){
                cache.EMBER_GLOW=glowTexture(21,'ember');return true;
            }
            return false;
        }
        if(buildOneOnly)return buildNextAsset();
        // Normally prewarming is already complete before a user clicks.
        // The fallback also works if an animation is started immediately.
        while(buildNextAsset()){}
        const {sootSprites,mistSprites,FIRE_GLOW,BLUE_GLOW,EMBER_GLOW}=cache;
        const combustion=[];
        const residualSoot=[];
        const tornPaper=[];
        let lastElapsed=0,spawnRemainder=0,sootRemainder=0,shardRemainder=0;
        function advanceCombustion(seconds,progress,dark,elapsed,w,h) {
            const dt=Math.min(.065,Math.max(0,elapsed-lastElapsed));
            lastElapsed=elapsed;
            const live=progress>.01&&progress<.985;
            if(live){
                // More long-lived sparks than V25, far below V31's 370/s.
                // Blue petals are softer/less dense: fewer layers noticeably
                // reduce reverse-direction Canvas work without touching fire.
                const flow=(dark?132:64)*Math.min(1.5,h/720)*
                    (.75+.25*Math.sin(Math.PI*progress));
                spawnRemainder+=dt*flow;
                const births=Math.min(65,Math.floor(spawnRemainder));
                spawnRemainder-=births;
                for(let j=0;j<births&&combustion.length<1320;j++){
                    const y=Math.random()*h;
                    const edge=edgeAt(y,seconds,progress,w);
                    const r=Math.random();
                    const kind=dark
                        ? r<.38?'flame':r<.91?'ember':'ash'
                        : r<.37?'glow':r<.81?'leaf':'pollen';
                    const small=kind==='ember'||kind==='pollen';
                    const soot=kind==='ash';
                    const life=dark
                        ? (soot?.7+Math.random()*1.1:
                            small?.9+Math.random()*1.55:.42+Math.random()*.76)
                        : 1.15+Math.random()*1.55;
                    combustion.push({
                        kind,x:edge+(dark?1:-1)*(Math.random()*47-8),
                        y:y+(Math.random()-.5)*25,
                        vx:(dark?1:-1)*(dark?(small?65+Math.random()*245:
                            14+Math.random()*154):
                            16+Math.random()*69),
                        vy:-(dark?(small?12+Math.random()*190:
                            32+Math.random()*171):12+Math.random()*57),
                        life,remaining:life,
                        radius:dark
                            ? (soot?1.2+Math.random()*2.7:
                                small?2+Math.random()*5:9+Math.random()*19)
                            : kind==='glow'?26+Math.random()*49:
                                kind==='leaf'?4+Math.random()*6:
                                2+Math.random()*3,
                        angle:(Math.random()-.5)*1.1,
                        sprite:(Math.random()*4)|0,
                        seed:Math.random()*6.28
                    });
                }
                if(dark) {
                    // Unlike the traveling front, these black smoke plumes
                    // are born in world-space and remain over burnt paper.
                    sootRemainder+=dt*(h<680?32:46);
                    const sootBirths=Math.min(11,Math.floor(sootRemainder));
                    sootRemainder-=sootBirths;
                    for(let i=0;i<sootBirths&&residualSoot.length<(w<700?92:155);i++){
                        const y=Math.random()*h;
                        const life=2.15+Math.random()*1.60;
                        residualSoot.push({
                            x:edgeAt(y,seconds,progress,w)+5+Math.random()*83,
                            y:y+(Math.random()-.5)*48,
                            vx:8+Math.random()*39,vy:-18-Math.random()*83,
                            size:155+Math.random()*195,life,remaining:life,
                            sprite:(Math.random()*4)|0,
                            spin:(Math.random()-.5)*.8,
                            seed:Math.random()*6.28
                        });
                    }
                    // Charcoal sheets tear off in irregular polygons, not
                    // squares or narrow glitch streaks.
                    shardRemainder+=dt*(h<680?18:30);
                    const shardBirths=Math.min(7,Math.floor(shardRemainder));
                    shardRemainder-=shardBirths;
                    for(let i=0;i<shardBirths&&tornPaper.length<175;i++){
                        const y=Math.random()*h;
                        const life=.90+Math.random()*1.85;
                        const points=8+Math.floor(Math.random()*7);
                        const outline=Array.from({length:points},(_,j)=>({
                            a:Math.PI*2*j/points+(Math.random()-.5)*.50,
                            r:.25+Math.random()*1.06
                        }));
                        tornPaper.push({
                            x:edgeAt(y,seconds,progress,w)+(Math.random()-.20)*58,
                            y, vx:55+Math.random()*295,
                            vy:-190+Math.random()*270,
                            gravity:90+Math.random()*150,
                            radius:2+Math.pow(Math.random(),2.5)*22,
                            angle:Math.random()*6.28,
                            spin:(Math.random()-.5)*7,
                            outline,life,remaining:life,
                            seed:Math.random()*6.28
                        });
                    }
                }
            }
            for(let i=combustion.length-1;i>=0;i--){
                const p=combustion[i];
                p.remaining-=dt;
                if(p.remaining<=0){combustion.splice(i,1);continue;}
                p.x+=(p.vx+Math.sin(elapsed*(dark?5:1.6)+p.seed)*
                    (dark?22:24))*dt;
                p.y+=p.vy*dt;
                p.vy-=(dark?17:7)*dt;
            }
            for(let i=residualSoot.length-1;i>=0;i--){
                const p=residualSoot[i];
                p.remaining-=dt;
                if(p.remaining<=0){residualSoot.splice(i,1);continue;}
                p.x+=(p.vx+Math.sin(elapsed*2+p.seed)*27)*dt;
                p.y+=p.vy*dt;
                p.size+=32*dt;
            }
            for(let i=tornPaper.length-1;i>=0;i--){
                const p=tornPaper[i];
                p.remaining-=dt;
                if(p.remaining<=0){tornPaper.splice(i,1);continue;}
                p.x+=(p.vx+Math.sin(elapsed*4+p.seed)*42)*dt;
                p.y+=p.vy*dt;
                p.vy+=p.gravity*dt;
                p.angle+=p.spin*dt;
            }
        }
        const particles=Array.from({length:innerWidth<700?40:62},(_,i)=>({
            seed:rand(i*4+71),height:rand(i*5+13),
            lifetime:.5+rand(i*8+37)*.7,
            phase:rand(i*9+21),sprite:i%4,
            scale:.72+rand(i*7+9)*1.25,
            bend:rand(i*15+23)*6.28
        }));
        const motes=Array.from({length:innerWidth<700?56:115},(_,i)=>({
            y:rand(i*3+17),phase:rand(i*9+43),
            speed:100+rand(i*12+5)*340,
            drift:82+rand(i*15+2)*330,
            length:3+rand(i*17+7)*16
        }));
        const shockDebris=Array.from({length:innerWidth<700?32:66},(_,i)=>({
            angle:rand(i*17+131)*Math.PI*2,
            velocity:190+rand(i*11+51)*900,
            seed:rand(i*5+79),
            length:6+rand(i*7+17)*26
        }));
        function pressureWave(x,y,radius,power,dark,time) {
            if(power<=.005)return;
            const core=ctx.createRadialGradient(x,y,0,x,y,radius*.75);
            if(dark){
                core.addColorStop(0,'rgba(255,231,169,'+(.20*power)+')');
                core.addColorStop(.17,'rgba(253,88,18,'+(.21*power)+')');
                core.addColorStop(.60,'rgba(106,16,12,'+(.09*power)+')');
                core.addColorStop(1,'rgba(30,0,0,0)');
            }else{
                core.addColorStop(0,'rgba(237,255,255,'+(.24*power)+')');
                core.addColorStop(.26,'rgba(98,193,255,'+(.18*power)+')');
                core.addColorStop(1,'rgba(0,29,100,0)');
            }
            ctx.globalCompositeOperation='screen';
            ctx.fillStyle=core;
            ctx.fillRect(x-radius,y-radius,radius*2,radius*2);
            ctx.globalCompositeOperation='source-over';
        }
        return function drawAtmosphere(seconds,progress,dark,elapsed,cells) {
            const w=innerWidth,h=innerHeight;
            // Dawn uses soft-focus sprites, so 0.45 is visually sufficient.
            // This cuts ~33% of full-screen pixels compared with 0.55.
            const scale=dark?(w<700?.43:.55):(w<700?.35:.45);
            const bw=Math.max(1,Math.round(w*scale));
            const bh=Math.max(1,Math.round(h*scale));
            if(canvas.width!==bw||canvas.height!==bh){canvas.width=bw;canvas.height=bh;}
            ctx.setTransform(scale,0,0,scale,0,0);
            ctx.clearRect(0,0,w,h);
            const envelope=Math.sin(Math.PI*progress);
            const fade=clamp01(progress/.075)*clamp01((1-progress)/.065);
            advanceCombustion(seconds,progress,dark,elapsed,w,h);
            const sprites=dark?sootSprites:mistSprites;
            // New-world side: red fire trails to the right when burning,
            // blue dawn trails to the left when returning.
            const direction=dark?1:-1;
            // Broken smoke banks with different depths and sizes. The old
            // aligned rows created an artificial horizontal fog ribbon.
            ctx.globalCompositeOperation='source-over';
            const bands=dark?Math.max(8,Math.ceil(h/116)):
                Math.max(6,Math.ceil(h/136));
            for(let i=0;i<bands;i++){
                const baseY=(i+.15+rand(i*11+39)*.70)*h/bands;
                const y=baseY+31*Math.sin(seconds*1.6+i*1.47);
                const x=edgeAt(y,seconds,progress,w)+direction*
                    (dark?76+rand(i*19+6)*260:120)+
                    Math.sin(seconds*.93+i*1.3)*37;
                const width=dark?170+rand(i*29+12)*220:250;
                const height=dark?165+rand(i*7+5)*170:245;
                ctx.save();
                ctx.globalAlpha=(dark?.34:.21)*fade*(.55+.45*envelope);
                ctx.translate(x,y);
                ctx.rotate(.27*Math.sin(i*2.1+seconds*.9));
                ctx.drawImage(sprites[i%4],-width/2,-height/2,width,height);
                ctx.restore();
            }
            // Independent turbulent billows peel away and rise.
            for(let particleIndex=0;particleIndex<particles.length;
                particleIndex+=dark?1:2){
                const item=particles[particleIndex];
                const age=((elapsed/item.lifetime+item.phase)%1);
                const baseY=item.height*h;
                const y=baseY-age*(dark?230:128)+(Math.sin(elapsed*2+item.bend)*15);
                if(y< -230||y>h+230)continue;
                const frontier=edgeAt(baseY,seconds,progress,w);
                const x=frontier+direction*(age*(dark?225:135)+
                    30*Math.sin(age*6.3+item.bend));
                const size=(dark?174:145)*item.scale*(.68+age*1.9);
                const opacity=(dark?.43:.26)*Math.sin(Math.PI*age)*fade*
                    (.55+.45*envelope);
                if(opacity<=.005)continue;
                ctx.save();
                ctx.globalAlpha=opacity;
                ctx.translate(x,y);
                ctx.rotate((item.bend-3.14)*.14+age*.85*direction);
                ctx.scale(1.18,.84);
                ctx.drawImage(sprites[item.sprite],-size/2,-size/2,size,size);
                ctx.restore();
            }
            // Residual devastation: coal-black plumes stay pinned to their
            // original burn positions, expanding long after the tear passes.
            // Composited *before* fire, so the hot core cuts through smoke.
            if(dark){
                ctx.save();
                ctx.globalCompositeOperation='source-over';
                for(const p of residualSoot){
                    const age=1-p.remaining/p.life;
                    const opacity=clamp01(age/.14)*
                        Math.pow(1-age,.49)*(.66+.24*Math.sin(p.seed*3)**2)*fade;
                    if(opacity<.009)continue;
                    ctx.save();
                    ctx.globalAlpha=opacity;
                    ctx.translate(p.x,p.y);
                    ctx.rotate(p.spin+age*.33*Math.sin(p.seed));
                    ctx.scale(1.20,.92);
                    const s=p.size*(1+age*.68);
                    ctx.drawImage(sootSprites[p.sprite],-s/2,-s/2,s,s);
                    ctx.restore();
                }
                ctx.restore();
            }else{
                // The inverse is a slow, organic unfurling: broad milky
                // radiance behind the rebuilt sky, not a cold explosion.
                ctx.save();
                ctx.globalCompositeOperation='screen';
                for(let n=0;n<2;n++){
                    const yy=(n+.64)*h/2.25+Math.sin(seconds*.8+n*2)*30;
                    const xx=edgeAt(yy,seconds,progress,w)-
                        (88+55*Math.sin(n*2.1+seconds*.7));
                    const radius=145+65*Math.sin(seconds*.7+n*1.7)**2;
                    const bloom=ctx.createRadialGradient(xx,yy,8,xx,yy,radius);
                    bloom.addColorStop(0,'rgba(250,255,255,.10)');
                    bloom.addColorStop(.33,'rgba(164,237,255,.07)');
                    bloom.addColorStop(.74,'rgba(117,198,255,.04)');
                    bloom.addColorStop(1,'rgba(117,198,255,0)');
                    ctx.globalAlpha=fade;
                    ctx.fillStyle=bloom;
                    ctx.fillRect(xx-radius,yy-radius,radius*2,radius*2);
                }
                ctx.restore();
            }
            // The impact happens at ignition and again as the rupture reaches
            // the middle of the screen; pulses are intentionally fleeting.
            for(const moment of (dark?[.10,.48]:[])){
                const age=(progress-moment)/.125;
                if(age<0||age>1)continue;
                const intensity=(1-age)*(1-age)*fade;
                // A single-frame-ish exposure bloom punches through
                // the entire page; the tone is red or icy blue by direction.
                ctx.globalCompositeOperation='screen';
                ctx.fillStyle=dark
                    ? 'rgba(255,81,26,'+(.095*intensity)+')'
                    : 'rgba(150,219,255,'+(.080*intensity)+')';
                ctx.fillRect(0,0,w,h);
                ctx.globalCompositeOperation='source-over';
                const x=edgeAt(h*.51,seconds,progress,w);
                const y=h*.51;
                const radius=95+age*Math.max(w,h)*.9;
                pressureWave(x,y,radius,intensity,dark,seconds);
                ctx.globalAlpha=(dark?.20:.28)*intensity;
                ctx.lineWidth=(dark?2.5:2)*Math.max(.4,1-age);
                ctx.strokeStyle=dark?'#ffb36c':'#b5eaff';
                ctx.beginPath();
                for(let i=0;i<=110;i++){
                    const a=i/110*Math.PI*2;
                    const jag=1+.03*Math.sin(a*29+seconds*12)+
                        .05*Math.sin(a*13-seconds*5);
                    const rx=Math.cos(a)*radius*jag,ry=Math.sin(a)*radius*jag;
                    if(i===0)ctx.moveTo(x+rx,y+ry);else ctx.lineTo(x+rx,y+ry);
                }
                ctx.stroke();
                ctx.globalAlpha=1;
                // Only combustion throws straight, fiery projectile trails.
                // Return-to-blue has no streaks or sparks whatsoever.
                if(dark){
                  ctx.globalCompositeOperation='screen';
                  for(const bit of shockDebris){
                    const f=age*(.5+bit.seed*.5);
                    const travel=bit.velocity*f;
                    const px=x+Math.cos(bit.angle)*travel;
                    const py=y+Math.sin(bit.angle)*travel;
                    const vx=Math.cos(bit.angle)*bit.length*(1-age);
                    const vy=Math.sin(bit.angle)*bit.length*(1-age);
                    ctx.globalAlpha=(dark?.82:.68)*intensity*(.3+bit.seed*.7);
                    ctx.strokeStyle=dark?'#ffdd9b':'#e0faff';
                    ctx.lineWidth=.6+bit.seed*1.3;
                    ctx.beginPath();
                    ctx.moveTo(px,py);
                    ctx.lineTo(px-vx,py-vy);
                    ctx.stroke();
                  }
                }
                ctx.globalCompositeOperation='source-over';
                ctx.globalAlpha=1;
            }
            // Real flame tongues break OUT of the burn front into the sky.
            // They are thin, tapered Bezier ribbons with an unstable pulse,
            // rather than round glowing particles or a uniform bright line.
            if(dark){
                ctx.save();
                ctx.globalCompositeOperation='screen';
                const count=Math.ceil(h/17);
                for(let j=0;j<count;j++){
                    const seed=rand(j*13+167);
                    const y=(j+seed*.78)*11.5-5;
                    const x=edgeAt(y,seconds,progress,w);
                    if(x < -90 || x > w+90)continue;
                    const ripple=Math.sin(seconds*(3.4+rand(j*11+4)*2.4)+
                        j*2.09+seed*3.1);
                    const heat=clamp01(.58+ripple*.34+
                        .16*Math.sin(j*1.17-seconds*7.1));
                    if(heat<.34)continue;
                    const length=(22+rand(j*23+19)*75)*(.5+heat*.94);
                    const bend=.18+rand(j*17+42)*.66;
                    const tipX=x-length*(.76+.19*seed);
                    const tipY=y-length*bend;
                    const thick=(3.2+rand(j*31+11)*10.3)*(.5+heat);
                    const gradient=ctx.createLinearGradient(x,y,tipX,tipY);
                    gradient.addColorStop(0,'rgba(255,255,242,.99)');
                    gradient.addColorStop(.28,'rgba(255,224,84,.96)');
                    gradient.addColorStop(.59,'rgba(255,76,10,.64)');
                    gradient.addColorStop(1,'rgba(182,17,6,0)');
                    ctx.beginPath();
                    ctx.moveTo(x+2,y+thick*.5);
                    ctx.bezierCurveTo(
                        x-length*.22,y-thick*.25,
                        tipX+length*.36,tipY+thick*.68,tipX,tipY);
                    ctx.bezierCurveTo(
                        tipX+length*.32,tipY-thick*.22,
                        x-length*.17,y-thick*.74,
                        x+2,y-thick*.65);
                    ctx.closePath();
                    ctx.globalAlpha=Math.min(1,heat*1.08)*fade;
                    ctx.fillStyle=gradient;
                    ctx.shadowBlur=0;
                    ctx.fill();
                    if(heat>.66){
                        ctx.globalAlpha=(heat-.54)*1.40*fade;
                        ctx.strokeStyle='#fffce0';ctx.lineWidth=.9+heat*1.1;
                        ctx.beginPath();ctx.moveTo(x,y);
                        ctx.quadraticCurveTo(x-length*.3,y-length*.11,
                            tipX+length*.19,tipY+thick*.18);
                        ctx.stroke();
                    }
                }
                ctx.restore();
            }

            // Carbonized paper has a fine, ragged edge. The charcoal layer
            // persists continuously, but the white-hot core does NOT.
            ctx.save();
            ctx.beginPath();
            for(let y=-12,i=0;y<=h+12;y+=3.6,i++){
                const x=edgeAt(y,seconds,progress,w);
                if(i===0)ctx.moveTo(x,y);else ctx.lineTo(x,y);
            }
            ctx.lineCap='round';ctx.lineJoin='round';
            if(dark){
                ctx.strokeStyle='rgba(9,5,7,.81)';
                ctx.lineWidth=18;ctx.shadowBlur=0;
                ctx.stroke();
                ctx.strokeStyle='rgba(210,45,9,.53)';
                ctx.lineWidth=6;
                ctx.stroke();
            }else{
                ctx.strokeStyle='rgba(27,95,190,.22)';
                ctx.lineWidth=27;ctx.shadowColor='#56bdff';ctx.shadowBlur=17;
                ctx.stroke();
                ctx.strokeStyle='rgba(132,225,255,.51)';
                ctx.lineWidth=11;ctx.shadowColor='#8aeaff';ctx.shadowBlur=11;
                ctx.stroke();
                ctx.strokeStyle='rgba(249,255,255,.65)';
                ctx.lineWidth=2.7;ctx.shadowBlur=4;
                ctx.stroke();
            }
            ctx.restore();
            if(dark){
                // Intermittent ignition cells: varying width/color/intensity
                // make the bright edge resemble burning fibres, not neon.
                ctx.save();
                ctx.globalCompositeOperation='screen';
                ctx.lineCap='round';
                for(let y=-8;y<h+8;y+=5.8){
                    const intensity=clamp01(.58+
                        .29*Math.sin(y*.054+seconds*3.7)+
                        .21*Math.sin(y*.147-seconds*8.9)+
                        .13*Math.sin(y*.337+seconds*16.4));
                    if(intensity<.47)continue;
                    const x=edgeAt(y,seconds,progress,w);
                    const nextX=edgeAt(y+5.8,seconds,progress,w);
                    ctx.globalAlpha=intensity*fade;
                    ctx.lineWidth=1.4+intensity*4.6;
                    ctx.shadowBlur=0;
                    ctx.strokeStyle=intensity>.75?'#fff8d7':
                        intensity>.58?'#ffd369':'#ff831b';
                    ctx.beginPath();ctx.moveTo(x,y);
                    ctx.lineTo(nextX,y+5.8);ctx.stroke();
                }
                ctx.restore();
                // Fragmented ignition on real microscopic perforations.
                // Missing arc sections stop them resembling punched circles.
                ctx.save();
                ctx.globalCompositeOperation='screen';
                ctx.shadowBlur=0;
                for (let i=0; i<cells.length; i++) {
                    const c=cells[i];
                    ctx.globalAlpha=(.42+.34*c.heat)*fade;
                    ctx.strokeStyle=c.heat>.73?'#fff6bf':
                        c.heat>.38?'#ffd166':'#ff621c';
                    ctx.lineWidth=.8+Math.min(2.6,c.radius*.24);
                    const n=c.points.length;
                    ctx.beginPath();
                    for (let j=0;j<n;j++) {
                        if ((j+i*3)%5>2)continue;
                        const a=c.points[j],b=c.points[(j+1)%n];
                        ctx.moveTo(a[0],a[1]);ctx.lineTo(b[0],b[1]);
                    }
                    ctx.stroke();
                }
                ctx.restore();
                // Small carbon flecks stick to the still-blue paper just
                // ahead of the bite; no large rectangular glitch debris.
                ctx.save();
                for(let j=0;j<Math.ceil(h/10);j++){
                    const y=(j+rand(j*5+61)*.8)*10;
                    const x=edgeAt(y,seconds,progress,w)-
                        (5+rand(j*17+38)*24);
                    const size=.5+rand(j*29+11)*2.5;
                    const visible=.25+.59*rand(j*13+7);
                    ctx.globalAlpha=visible*fade;
                    ctx.fillStyle='#150b0a';
                    ctx.beginPath();
                    ctx.ellipse(x,y,size*.71,size,rand(j*7+31)*3.14,
                        0,Math.PI*2);
                    ctx.fill();
                }
                ctx.restore();
            }
            // The key property V3-V6 lost: particles remain at their
            // birth position while the front advances. A wide, incandescent
            // WAKE builds behind the tearing page instead of following
            // it as one thin, plastic-looking stripe.
            ctx.save();
            ctx.globalCompositeOperation='lighter';
            for(const p of combustion){
                if(p.kind==='ash'||p.kind==='leaf'||p.kind==='pollen')continue;
                const age=1-p.remaining/p.life;
                const opacity=clamp01(p.remaining/.22)*
                    clamp01(age/.08)*(1-age*.30)*
                    (p.kind==='ember'?.74:p.kind==='glow'?.13:.66)*fade*
                    (dark?Math.exp(-Math.max(0,p.x-
                        edgeAt(p.y,seconds,progress,w))/70):1);
                if(opacity<.012)continue;
                ctx.save();
                ctx.globalAlpha=opacity;
                ctx.translate(p.x,p.y);
                ctx.rotate(p.angle+Math.sin(elapsed*4+p.seed)*.13);
                const large=p.kind==='flame';
                const sx=p.radius*(p.kind==='glow'?1.7:large?.96:1.32)*(1+age*.32);
                const sy=p.radius*(p.kind==='glow'?1.4:large?1.78:1.35)*(1+age*.57);
                const sprite=p.kind==='flame'?FIRE_GLOW[p.sprite]:
                    p.kind==='glow'?BLUE_GLOW[p.sprite]:EMBER_GLOW;
                ctx.drawImage(sprite,-sx,-sy,sx*2,sy*2);
                ctx.restore();
            }
            ctx.restore();
            // Rebirth uses soft, rotating, organic leaf/petal silhouettes,
            // minute circular pollen and spacious white-blue bokeh. No
            // rectangular ions, no warm textures and NO glowing streaks.
            if(!dark){
                ctx.save();
                ctx.globalCompositeOperation='screen';
                for(const p of combustion){
                    if(p.kind!=='leaf'&&p.kind!=='pollen')continue;
                    const age=1-p.remaining/p.life;
                    const opacity=clamp01(age/.17)*clamp01(p.remaining/.55)*
                        (p.kind==='leaf'?.47:.28)*fade;
                    if(opacity<.012)continue;
                    ctx.save();
                    ctx.globalAlpha=opacity;
                    ctx.translate(p.x+11*Math.sin(elapsed*1.6+p.seed),p.y);
                    ctx.rotate(p.angle+age*1.65*Math.sin(p.seed*2.5));
                    if(p.kind==='leaf'){
                        const r=p.radius;
                        ctx.shadowBlur=5;
                        ctx.shadowColor='#bbf4ff';
                        ctx.fillStyle=p.sprite%2?'#e6ffff':'#ffffff';
                        ctx.beginPath();
                        ctx.moveTo(0,-r*1.65);
                        ctx.bezierCurveTo(r*.97,-r*.48,r*.85,r*.60,0,r*1.35);
                        ctx.bezierCurveTo(-r*.92,r*.28,-r*.94,-r*.57,0,-r*1.65);
                        ctx.fill();
                        ctx.globalAlpha=opacity*.38;
                        ctx.strokeStyle='#70c9ea';
                        ctx.lineWidth=.65;
                        ctx.beginPath();ctx.moveTo(0,-r*1.15);
                        ctx.quadraticCurveTo(-r*.17,0,0,r*.95);ctx.stroke();
                    }else{
                        const r=p.radius;
                        // Reuse the cached soft sprite; a fresh radial
                        // gradient for every pollen mote per frame was costly.
                        ctx.globalAlpha=opacity*.72;
                        ctx.drawImage(BLUE_GLOW[p.sprite],-r*3,-r*3,r*6,r*6);
                    }
                    ctx.restore();
                }
                ctx.restore();
            }
            // Minute black flecks, never rectangular shards on the blue side.
            ctx.save();
            ctx.globalCompositeOperation='source-over';
            for(const p of combustion){
                if(p.kind!=='ash')continue;
                ctx.globalAlpha=clamp01(p.remaining/.25)*.7*fade;
                ctx.fillStyle='#190d10';
                ctx.save();ctx.translate(p.x,p.y);ctx.rotate(elapsed*2+p.angle);
                ctx.fillRect(-p.radius*.5,-p.radius*.5,p.radius,p.radius*1.8);
                ctx.restore();
            }
            ctx.restore();
            // Irregular burnt page sections tumble away and reveal their
            // blackened underside, with an occasional incandescent rim.
            if(dark){
                ctx.save();
                ctx.globalCompositeOperation='source-over';
                for(const p of tornPaper){
                    const age=1-p.remaining/p.life;
                    const opacity=clamp01(age/.08)*clamp01(p.remaining/.4)*fade;
                    if(opacity<.01)continue;
                    ctx.save();
                    ctx.globalAlpha=opacity;
                    ctx.translate(p.x,p.y);
                    ctx.rotate(p.angle);
                    ctx.beginPath();
                    p.outline.forEach((v,i)=>{
                        const px=Math.cos(v.a)*v.r*p.radius;
                        const py=Math.sin(v.a)*v.r*p.radius*.74;
                        if(i===0)ctx.moveTo(px,py);else ctx.lineTo(px,py);
                    });
                    ctx.closePath();
                    ctx.shadowBlur=7;
                    ctx.shadowColor='#090506';
                    ctx.fillStyle=p.seed>3?'#190d11':'#302025';
                    ctx.fill();
                    ctx.shadowBlur=0;
                    ctx.lineWidth=.8+Math.sin(p.seed)**2*.8;
                    ctx.strokeStyle=age<.48?'rgba(255,107,35,.48)':
                        'rgba(49,20,19,.47)';
                    ctx.stroke();
                    // Thin blue-white unburnt fibers still visible on a
                    // few ripped faces, before the back chars completely.
                    if(p.seed>4.5&&age<.52){
                        ctx.globalAlpha*=.45*(1-age);
                        ctx.strokeStyle='#c5e7f7';
                        ctx.beginPath();
                        ctx.moveTo(-p.radius*.42,-p.radius*.16);
                        ctx.quadraticCurveTo(0,p.radius*.25,p.radius*.28,0);
                        ctx.stroke();
                    }
                    ctx.restore();
                }
                ctx.restore();
            }
            // Sharp, directional embers / crystalline fragments, not blobs.
            if(dark){ctx.save();
            ctx.globalCompositeOperation='screen';
            for(const mote of motes){
                const age=(elapsed*.74+mote.phase)%1;
                const yy=mote.y*h-age*mote.speed+Math.sin(age*12+mote.phase*8)*9;
                const x=edgeAt(yy,seconds,progress,w)+direction*age*mote.drift;
                if(x<-25||x>w+25||yy<-25||yy>h+25)continue;
                const opacity=(1-age)*fade*.89;
                ctx.globalAlpha=opacity;
                ctx.strokeStyle='#ffb45d';
                ctx.lineWidth=.8;
                ctx.beginPath();
                ctx.moveTo(x,yy);
                ctx.lineTo(x-direction*mote.length*.4,yy+mote.length);
                ctx.stroke();
            }
            ctx.restore();}
        };
    }

    let atmosphereWarmPromise=null;
    function prewarmAtmosphere() {
        if(atmosphereWarmPromise)return atmosphereWarmPromise;
        atmosphereWarmPromise=new Promise(resolve=>{
            const scratchCanvas=document.createElement('canvas');
            function step(){
                if(atmosphereAssetCache?.EMBER_GLOW){resolve();return;}
                // Exactly one texture per task: no more 270ms blocking call.
                createAtmosphere(scratchCanvas,true);
                if(atmosphereAssetCache?.EMBER_GLOW){resolve();return;}
                setTimeout(step,24);
            }
            setTimeout(step,40);
        });
        return atmosphereWarmPromise;
    }

    let atmosphereEdge=null;
    function edgeAt(y,seconds,progress,width){
        return atmosphereEdge
            ? atmosphereEdge(y)
            : makeEdge(progress,seconds,Boolean(window.__kkptVisualDark),width)(y);
    }

    // Original V2's moving flame sprites and three bright contours, rebuilt
    // with bounded particle counts. No WebGL, no full-screen noise pass,
    // no 1,000-point polygon or per-frame image-texture upload.
    let sprites=null;
    function makeSprites() {
        if (sprites) return sprites;
        function radial(stops) {
            const el=document.createElement('canvas');
            el.width=el.height=96;
            const c=el.getContext('2d');
            const g=c.createRadialGradient(48,48,0,48,48,48);
            stops.forEach(pair=>g.addColorStop(pair[0],pair[1]));
            c.fillStyle=g;c.fillRect(0,0,96,96);
            return el;
        }
        sprites={
            flame:radial([[0,'#fffbed'],[.18,'#fff2a0'],
                [.43,'#ffb42b'],[.70,'#ff360088'],[1,'#8f050000']]),
            ember:radial([[0,'#ffffff'],[.15,'#fff6a8'],
                [.44,'#ff9900cc'],[1,'#ef280000']]),
            smoke:radial([[0,'#080608dd'],[.30,'#100b10bb'],
                [.62,'#160f1677'],[1,'#08050800']]),
            sky:radial([[0,'#ffffff'],[.16,'#e6ffff'],
                [.46,'#94deffe0'],[1,'#4ab5ff00']]),
            mist:radial([[0,'#f2fdffb0'],[.4,'#abdffff0'],
                [1,'#a9e7ff00']])
        };
        return sprites;
    }

    // V2's simple advancing boundary. The reader asked for the
    // vibrant fire curtain, not a mathematically fractal tearing wire.
    function makeEdge(t,seconds,dark,w) {
        const center=dark
            ? w+105-(w+210)*smooth(t)
            : -105+(w+210)*smooth(t);
        const wobble=Math.sin(Math.PI*t);
        return y=>center+wobble*(
            17*Math.sin(y*.023+seconds*5.5)+
             9*Math.sin(y*.063-seconds*8.4)+
             4*Math.sin(y*.13+seconds*12)
        );
    }

    // GPU-only ember flecks: ONE small draw call at most 30fps.
    // The white-hot V25 fire, the smoke and the dawn stay unmodified 2D.
    // No fullscreen pixel shader, FBM, flame quads or cyan rectangle.
    function createGpuEmbers(){
        const canvas=document.createElement('canvas');
        canvas.id='kkpt-webgl';
        canvas.setAttribute('aria-hidden','true');
        let gl,program,buffer;
        try{
            gl=canvas.getContext('webgl2',{
                alpha:true,antialias:false,depth:false,stencil:false,
                premultipliedAlpha:false,preserveDrawingBuffer:false,
                powerPreference:'low-power'
            });
            if(!gl)throw new Error('WebGL2 context unavailable');
            const vert=`#version 300 es
                precision mediump float;
                layout(location=0) in vec4 aSpark;
                uniform vec2 uSize;
                uniform float uScale;
                out float vOpacity;
                void main(){
                    vec2 xy=aSpark.xy/uSize*2.0-1.0;
                    gl_Position=vec4(xy.x,-xy.y,0.0,1.0);
                    gl_PointSize=aSpark.z*uScale;
                    vOpacity=aSpark.w;
                }`;
            const frag=`#version 300 es
                precision mediump float;
                in float vOpacity;
                out vec4 fragColor;
                void main(){
                    vec2 p=gl_PointCoord*2.0-1.0;
                    float r=length(p);
                    if(r>=1.0)discard;
                    float a=pow(1.0-r,1.65)*vOpacity;
                    vec3 c=mix(vec3(1.0,.30,.035),
                        vec3(1.0,.93,.57),smoothstep(.40,.92,1.0-r));
                    fragColor=vec4(c,a);
                }`;
            function shader(type,source){
                const s=gl.createShader(type);
                gl.shaderSource(s,source);gl.compileShader(s);
                if(!gl.getShaderParameter(s,gl.COMPILE_STATUS))
                    throw new Error(gl.getShaderInfoLog(s));
                return s;
            }
            const vs=shader(gl.VERTEX_SHADER,vert);
            const fs=shader(gl.FRAGMENT_SHADER,frag);
            program=gl.createProgram();
            gl.attachShader(program,vs);gl.attachShader(program,fs);
            gl.linkProgram(program);
            gl.deleteShader(vs);gl.deleteShader(fs);
            if(!gl.getProgramParameter(program,gl.LINK_STATUS))
                throw new Error(gl.getProgramInfoLog(program));
            buffer=gl.createBuffer();
            gl.bindBuffer(gl.ARRAY_BUFFER,buffer);
            gl.bufferData(gl.ARRAY_BUFFER,170*4*4,gl.DYNAMIC_DRAW);
            gl.enableVertexAttribArray(0);
            gl.vertexAttribPointer(0,4,gl.FLOAT,false,0,0);
            gl.useProgram(program);
            gl.enable(gl.BLEND);
            gl.blendFunc(gl.SRC_ALPHA,gl.ONE_MINUS_SRC_ALPHA);
            gl.disable(gl.DEPTH_TEST);
        }catch(err){
            console.warn('[KKPT] Ember-only WebGL disabled:',err);
            canvas.remove();
            return null;
        }
        document.body.append(canvas);
        const sizeUniform=gl.getUniformLocation(program,'uSize');
        const scaleUniform=gl.getUniformLocation(program,'uScale');
        const max=innerWidth<700?80:170;
        const data=new Float32Array(max*4);
        const sparks=[];
        let carry=0,disabled=false,lastW=0,lastH=0;
        canvas.addEventListener('webglcontextlost',event=>{
            event.preventDefault();disabled=true;
            window.__kkptRenderer='Canvas2D (GPU context lost)';
        },{once:true});
        const rand=(min,max)=>min+Math.random()*(max-min);
        function draw(edge,seconds,dt,fade,progress){
            if(disabled)return;
            const w=innerWidth,h=innerHeight;
            const scale=w<700?.67:.75;
            const cw=Math.round(w*scale),ch=Math.round(h*scale);
            if(cw!==lastW||ch!==lastH){
                canvas.width=cw;canvas.height=ch;
                gl.viewport(0,0,cw,ch);lastW=cw;lastH=ch;
            }
            gl.clearColor(0,0,0,0);
            gl.clear(gl.COLOR_BUFFER_BIT);
            gl.useProgram(program);
            gl.uniform2f(sizeUniform,w,h);
            gl.uniform1f(scaleUniform,scale);
            carry+=dt*(w<700?27:56)*Math.max(0,fade);
            const births=Math.min(5,Math.floor(carry));carry-=births;
            for(let i=0;i<births&&sparks.length<max;i++){
                const y=rand(0,h),life=rand(.55,1.65);
                sparks.push({x:edge(y)+rand(-7,23),y,
                    vx:rand(48,265),vy:rand(-195,-26),life,left:life,
                    size:rand(3,13),alpha:rand(.24,.60)});
            }
            let count=0;
            for(let i=sparks.length-1;i>=0;i--){
                const p=sparks[i];
                p.left-=dt;
                if(p.left<=0){sparks[i]=sparks[sparks.length-1];sparks.pop();continue;}
                p.x+=p.vx*dt;p.y+=p.vy*dt;
                if(p.x < -30||p.x>w+30||p.y < -30||p.y>h+30)continue;
                const offset=count++*4;
                data[offset]=p.x;data[offset+1]=p.y;
                data[offset+2]=p.size;
                data[offset+3]=p.alpha*fade*Math.min(1,p.left/.24);
            }
            if(!count)return;
            gl.bindBuffer(gl.ARRAY_BUFFER,buffer);
            gl.bufferSubData(gl.ARRAY_BUFFER,0,data.subarray(0,count*4));
            gl.drawArrays(gl.POINTS,0,count);
        }
        function dispose(){
            disabled=true;
            if(!gl.isContextLost()){
                gl.deleteBuffer(buffer);gl.deleteProgram(program);
            }
            canvas.remove();
        }
        return {canvas,draw,dispose};
    }

    // Clip the ACTUAL preloaded Wiki frame, precisely where the fire is.
    function clipFrame(edge) {
        const w=innerWidth,h=innerHeight;
        const rows=window.__kkptVisualDark?
            Math.max(24,Math.ceil(h/30)):
            Math.max(16,Math.ceil(h/61));
        const pts=[];
        for(let i=rows;i>=0;i--) {
            const y=h*i/rows;
            pts.push(edge(y).toFixed(1)+'px '+y.toFixed(1)+'px');
        }
        frame.style.clipPath=clipSide==='right'
            ? 'polygon(100% 0,100% 100%,'+pts.join(',')+')'
            : 'polygon(0 0,0 100%,'+pts.join(',')+')';
    }

    function canvasFire(canvas,dark,duration,drawAtmosphere,done,gpuEmbers,score,extraVisuals) {
        const ctx=dark&&canvas
            ? canvas.getContext('2d',{alpha:true,desynchronized:true})
            : null;
        if(dark&&!ctx){done();return;}
        const art=dark?makeSprites():null;
        const w=innerWidth,h=innerHeight;
        if(ctx){
            const scale=Math.min(window.devicePixelRatio||1,w<650?.69:.80);
            canvas.width=Math.max(1,Math.round(w*scale));
            canvas.height=Math.max(1,Math.round(h*scale));
            ctx.setTransform(scale,0,0,scale,0,0);
        }

        const rand=(a,b)=>a+Math.random()*(b-a);
        const mobile=w<650;
        const maxCount=mobile?160:250;
        const p=[];
        const accum={flame:0,ember:0,shard:0,sky:0,mist:0,pollen:0};
        const rates=dark
            ? {flame:mobile?80:105,ember:mobile?72:96,
               shard:mobile?26:42}
            : {sky:mobile?50:80,mist:mobile?13:20,pollen:mobile?27:50};
        const started=performance.now();
        let previous=started;
        let lastPaint=0;
        let lastClip=0;
        function spawn(kind,edge,seconds) {
            if(p.length>=maxCount)return;
            const y=rand(-25,h+25);
            const x=edge(y);
            const type=kind;
            const smoke=type==='smoke';
            const shard=type==='shard';
            const ember=type==='ember'||type==='pollen';
            const blue=type==='sky'||type==='mist'||type==='pollen';
            let radius,life,vx,vy;
            if(shard){
                radius=rand(4,18);life=rand(.6,1.65);
                vx=rand(-130,65);vy=rand(-125,30);
            }else if(smoke){
                radius=rand(32,85);life=rand(1.1,2.5);
                vx=rand(-20,65);vy=rand(-88,-22);
            }else if(type==='mist'){
                radius=rand(45,100);life=rand(.9,1.8);
                vx=rand(-35,45);vy=rand(-75,-15);
            }else if(type==='flame'){
                radius=rand(20,57);life=rand(.3,.82);
                vx=rand(-100,30);vy=rand(-180,-45);
            }else{
                radius=ember?rand(2.5,9):rand(18,47);
                life=ember?rand(.45,1.1):rand(.35,.85);
                vx=rand(-95,75);vy=rand(-150,-25);
            }
            p.push({
                type,life,left:life,
                x:x+rand(smoke?12:shard?-35:-27,smoke?140:shard?36:64),
                y:y+rand(-14,14),vx,vy,radius,
                angle:rand(-Math.PI,Math.PI),spin:rand(-5,5),
                drift:rand(-.65,.65),blue
            });
        }
        function spawnAtRate(dt,edge,seconds,strength){
            for(const type in rates){
                accum[type]+=rates[type]*dt*strength;
                const n=Math.min(11,Math.floor(accum[type]));
                accum[type]-=n;
                for(let i=0;i<n;i++)spawn(type,edge,seconds);
            }
        }
        function advance(dt){
            for(let i=p.length-1;i>=0;i--) {
                const q=p[i];
                q.left-=dt;
                if(q.left<=0){p[i]=p[p.length-1];p.pop();continue;}
                q.x+=q.vx*dt;
                q.y+=q.vy*dt;
                q.vx+=q.drift*dt*35;
                q.vy-=10*dt;
                q.angle+=q.spin*dt;
            }
        }
        function spriteDraw(image,x,y,sx,sy,alpha){
            ctx.globalAlpha=alpha;
            ctx.drawImage(image,x-sx,y-sy,sx*2,sy*2);
        }
        function drawSmoke(fade){
            ctx.globalCompositeOperation='source-over';
            for(const q of p){
                if(q.type!=='smoke'&&q.type!=='mist')continue;
                const age=1-q.left/q.life;
                const radius=q.radius*(1+age*.98);
                const alpha=(q.type==='smoke'?.76:.32)*
                    Math.min(1,age*5)*Math.min(1,q.left/.55)*fade;
                spriteDraw(q.type==='smoke'?art.smoke:art.mist,
                    q.x,q.y,radius*1.7,radius*1.3,alpha);
            }
            ctx.globalAlpha=1;
        }
        function drawShards(fade) {
            if(!dark)return;
            ctx.save();
            ctx.globalCompositeOperation='source-over';
            for(const q of p){
                if(q.type!=='shard')continue;
                const age=1-q.left/q.life;
                const a=Math.min(1,q.left/.38)*(.90-age*.28)*fade;
                ctx.save();
                ctx.translate(q.x,q.y);
                ctx.rotate(q.angle);
                ctx.globalAlpha=a;
                const r=q.radius;
                ctx.beginPath();
                ctx.moveTo(-r*.9,-r*.3);
                ctx.lineTo(r*.7,-r*.75);
                ctx.lineTo(r*.48,r*.42);
                ctx.lineTo(-r*.35,r*.8);
                ctx.closePath();
                ctx.fillStyle=age<.3?'#371d22':'#140d13';
                ctx.fill();
                ctx.strokeStyle=age<.42?'#f57d3c':'#5a2c2b';
                ctx.lineWidth=age<.42?1.6:.75;
                ctx.stroke();
                ctx.restore();
            }
            ctx.restore();
        }
        function drawCore(edge,seconds,t,fade){
            const waviness=Math.sin(Math.PI*t);
            ctx.save();
            ctx.beginPath();
            const count=Math.max(35,Math.ceil(h/19));
            for(let i=0;i<=count;i++){
                const y=h*i/count;
                if(i===0)ctx.moveTo(edge(y),y);
                else ctx.lineTo(edge(y),y);
            }
            ctx.lineCap='round';
            ctx.lineJoin='round';
            if(dark){
                ctx.globalCompositeOperation='lighter';
                ctx.globalAlpha=fade;
                ctx.shadowColor='#ff3903';
                ctx.shadowBlur=25;
                ctx.strokeStyle='rgba(255,55,5,.82)';
                ctx.lineWidth=43;
                ctx.stroke();
                ctx.shadowBlur=16;
                ctx.strokeStyle='#ff9b17';
                ctx.lineWidth=20;
                ctx.stroke();
                ctx.shadowBlur=7;
                ctx.strokeStyle='#ffe45e';
                ctx.lineWidth=9;
                ctx.stroke();
                ctx.shadowBlur=4;
                ctx.strokeStyle='#fffcde';
                ctx.lineWidth=3.8;
                ctx.stroke();
            }else{
                ctx.globalAlpha=fade*.64;
                ctx.shadowColor='#8ccfff';
                ctx.shadowBlur=29;
                ctx.strokeStyle='rgba(139,219,255,.68)';
                ctx.lineWidth=28;
                ctx.stroke();
                ctx.shadowBlur=10;
                ctx.strokeStyle='#e7f8ff';
                ctx.lineWidth=9;
                ctx.stroke();
                ctx.shadowBlur=0;
                ctx.strokeStyle='white';
                ctx.lineWidth=2;
                ctx.stroke();
            }
            ctx.restore();

            // Dense GOLD / WHITE rolling fire, including on both sides
            // of the border. These are the luminous shapes from V2.
            if(dark){
                ctx.save();
                ctx.globalCompositeOperation='lighter';
                for(let y=-70;y<h+80;y+=48){
                    const x=edge(y);
                    const pulse=.65+.35*Math.sin(seconds*8.5+y*.083);
                    spriteDraw(art.flame,x+rand(-8,30),y,77,70,
                        fade*(.26+.16*pulse));
                }
                for(let y=-20;y<h+52;y+=36){
                    const x=edge(y);
                    const flicker=Math.sin(seconds*13+y*.19);
                    const length=52+30*flicker+17*Math.sin(seconds*6-y*.11);
                    const lean=15+18*Math.sin(seconds*9+y*.069);
                    ctx.globalAlpha=.62*fade;
                    ctx.fillStyle='#ff5705';
                    ctx.beginPath();
                    ctx.moveTo(x+18,y+19);
                    ctx.bezierCurveTo(x-18,y+2,x-lean-24,y-length*.57,
                        x-lean,y-length);
                    ctx.bezierCurveTo(x+2,y-length*.57,x+13,y-12,x+18,y+19);
                    ctx.fill();
                    ctx.globalAlpha=.58*fade;
                    ctx.fillStyle='#ffdb58';
                    ctx.beginPath();
                    ctx.moveTo(x+7,y+8);
                    ctx.quadraticCurveTo(x-10,y-length*.33,
                        x-lean*.8,y-length*.72);
                    ctx.quadraticCurveTo(x+3,y-length*.30,x+8,y+8);
                    ctx.fill();
                    ctx.globalAlpha=.38*fade;
                    ctx.fillStyle='#fffced';
                    ctx.beginPath();
                    ctx.moveTo(x+3,y+5);
                    ctx.quadraticCurveTo(x-5,y-length*.2,
                        x-lean*.5,y-length*.48);
                    ctx.quadraticCurveTo(x+4,y-length*.19,x+5,y+5);
                    ctx.fill();
                }
                ctx.restore();
            }else{
                ctx.save();
                ctx.globalCompositeOperation='lighter';
                for(let y=-50;y<h+55;y+=88){
                    spriteDraw(art.sky,edge(y),y,89,109,.27*fade);
                }
                ctx.restore();
            }
        }
        function drawBrightParticles(fade) {
            ctx.save();
            ctx.globalCompositeOperation='lighter';
            for(const q of p){
                if(q.type==='smoke'||q.type==='mist'||q.type==='shard')continue;
                const age=1-q.left/q.life;
                const brightness=Math.min(1,q.left/.25)*(1-age*.25)*fade;
                let artName='flame',sx=q.radius,sy=q.radius;
                if(q.type==='ember'){artName='ember';sx*=1.2;sy*=1.2;}
                else if(q.type==='pollen'){artName='sky';sx*=1.15;sy*=1.15;}
                else if(q.type==='sky'){artName='sky';sx*=1.1;sy*=1.55;}
                else {sx*=.9;sy*=1.65;}
                spriteDraw(art[artName],q.x,q.y,sx,sy,
                    brightness*(q.type==='ember'?.93:.78));
            }
            ctx.restore();
            ctx.globalAlpha=1;
            ctx.globalCompositeOperation='source-over';
        }
        function paint(now) {
            // Both original V25 curtains follow their OWN song cue clock.
            // Framerate drops cannot move 00:33 / 02:39 off the midpoints.
            const t=score
                ? Math.max(0,Math.min(1,(score.audio.currentTime-
                    score.config.fireStart)/
                    (score.config.fireEnd-score.config.fireStart)))
                : Math.min(1,(now-started)/duration);
            extraVisuals?.update(t);
            const seconds=now/1000;
            const edge=makeEdge(t,seconds,dark,w);
            // Clip-path polygon reconstruction can cause expensive iframe
            // compositor work. It runs at a bounded rate independent of rAF.
            atmosphereEdge=edge;
            window.__kkptVisualDark=dark;
            const clipStep=dark?(mobile?33:23):(mobile?43:34);
            if(now-lastClip>=clipStep||t>=1){
                clipFrame(edge);
                lastClip=now;
            }
            const paintStep=dark?(mobile?35:32):(mobile?52:41);
            if(now-lastPaint<paintStep && t<1){
                requestAnimationFrame(paint);return;
            }
            const dt=Math.min(.070,(now-previous)/1000);
            previous=now;lastPaint=now;
            const fade=Math.min(1,t/.055,(1-t)/.045);
            // Restore V14's broad smoke banks, long-lived char, pressure
            // waves and delicate blue leaves. V2 only paints the FIRE.
            drawAtmosphere(seconds,Math.min(t,.925),dark,(now-started)/1000,[]);
            if(dark&&gpuEmbers)gpuEmbers.draw(edge,seconds,dt,fade,t);
            if(dark){
                advance(dt);
                if(t<1)spawnAtRate(dt,edge,seconds,Math.max(0,fade));
                ctx.clearRect(0,0,w,h);
                drawShards(fade);
                drawCore(edge,seconds,t,fade);
                drawBrightParticles(fade);
            }
            if(t<1)requestAnimationFrame(paint);
            else done();
        }
        requestAnimationFrame(paint);
    }

    function setDisplayed(nextActive) {
        active=nextActive;
        frame.classList.toggle('kkpt-active',active);
        document.body.classList.toggle('kkpt-other-active',active);
        frame.style.clipPath=active?'inset(0)':hideClip;
        frame.style.visibility=active?'visible':'hidden';
        frame.style.pointerEvents='';
        frame.tabIndex=active?0:-1;
        frame.setAttribute('aria-hidden',active?'false':'true');
        document.title=active?otherTitle:baseTitle;
        showTheme((active?otherPage:basePage)==='Kuronata');
        // Stop the invisible Kuronata ambience in either document.
        root.classList.toggle('kkpt-world-suspended',basePage==='Kuronata'&&active);
        try{
            frame.contentDocument?.documentElement.classList.toggle(
                'kkpt-frame-inactive',!active);
        }catch(_){}
        updateButton();
    }

    async function animateSwap(nextActive) {
        if(animating)return;
        animating=true;
        button.classList.add('kkpt-busy');
        labelSub.textContent='PREPARING THE OTHER SIDE...';
        const dark=(nextActive?otherPage:basePage)==='Kuronata';
        let score=returnScore?.config?.target===otherPage?
            returnScore:null;
        if(!loading)warmFrame();
        // Never make the music wait for the network or an expensive texture.
        // The iframe already has a matching photographic fallback; reveal
        // it under the original V25 curtain even if HTML loads late.
        await Promise.race([loading,sleep(score?350:1100)]);
        await Promise.race([prewarmAtmosphere(),sleep(160)]);
        if(score){
            const started=await Promise.race([
                score.playPromise,sleep(6500).then(()=>false)
            ]);
            if(!started||!await awaitScoreTime(score,
                score.config.fireStart)){
                clearReturnScore(score);
                score=null; // Preserve the exact V25 visuals on audio failure.
            }
        }
        removeScoreOmen();
        releaseFatePrelude();
        frame.style.visibility='visible';
        frame.classList.add('kkpt-animating');
        // Give the now-visible destination its own first composited frame.
        await new Promise(resolve=>requestAnimationFrame(()=>requestAnimationFrame(resolve)));

        labelSub.textContent=dark?'THE SKY IS BURNING':'DAWN IS BREAKING';
        // When returning to the blue page, force the Day palette
        // BEFORE unmasking it. The dark iframe still fully covers it.
        if(!dark)showTheme(false);
        frame.classList.remove('kkpt-active');
        frame.style.pointerEvents='none';
        frame.style.clipPath=active?'inset(0)':hideClip;

        const atmosphere=document.createElement('canvas');
        atmosphere.id='kkpt-atmosphere';
        atmosphere.setAttribute('aria-hidden','true');
        document.body.append(atmosphere);
        const drawAtmosphere=createAtmosphere(atmosphere);
        const canvas=dark?document.createElement('canvas'):null;
        if(canvas){
            canvas.id='kkpt-vfx';
            canvas.setAttribute('aria-hidden','true');
            document.body.append(canvas);
        }
        const gpuEmbers=dark?createGpuEmbers():null;
        const extraVisuals=dark?(score?.beatScene||null):createRebirthVisual();
        window.__kkptRenderer=dark
            ? gpuEmbers?'WebGL2 embers + original V25 Canvas fire':
                'Original V25 Canvas fire (WebGL fallback)'
            : 'Original V25 Canvas dawn';
        const duration=dark?3450:3100;
        if(!score)transitionSound(dark,duration);
        await new Promise(resolve=>canvasFire(
            canvas,dark,duration,drawAtmosphere,resolve,gpuEmbers,
            score,extraVisuals));

        setDisplayed(nextActive);
        if(dark){
            try{sessionStorage.setItem(AFTER_DARK_KEY,'1');}catch(_){}
            mountKuronataAftermath(score);
        }else{
            // Fade the shadow away while a pearl-white edge radiates out
            // of the just-opened sky, then let that light evaporate.
            kuronataAftermath?.fadeToDawn();
            createCloudbreakAfterglow();
        }
        extraVisuals?.finish();
        if(canvas){
            canvas.style.opacity='0';
            setTimeout(()=>canvas.remove(),210);
        }
        if(gpuEmbers){
            gpuEmbers.canvas.style.transition='opacity 280ms ease-out';
            gpuEmbers.canvas.style.opacity='0';
            setTimeout(()=>gpuEmbers.dispose(),320);
        }
        // The last frame holds living smoke and drifting fragments.
        // Let it disperse with a lightweight compositor fade AFTER the
        // destination is revealed; no costly extra canvas render loop.
        const tail=dark?2000:1320;
        atmosphere.style.transition='opacity '+tail+
            'ms ease-out, transform '+tail+'ms ease-out';
        await new Promise(resolve=>requestAnimationFrame(resolve));
        atmosphere.style.opacity='0';
        atmosphere.style.transform='translate3d(0,-22px,0) scale(1.035)';
        await sleep(tail+70);
        atmosphere.remove();
        animating=false;
        button.classList.remove('kkpt-busy','kkpt-quiet');
        // The iframe was only the moving scenery during the reveal.
        // Hand off to the ACTUAL Wiki page: native sidebars, scrollbar,
        // history, refresh, accessibility and links all work normally.
        saveReturnScoreHandoff(score);
        navigateRealPage(otherUrl.href);
    }

    function requestSwap(nextActive) {
        if (animating || nextActive === active) return;
        if (matchMedia('(prefers-reduced-motion: reduce)').matches) {
            if(otherPage==='Kuronata'){
                try{sessionStorage.setItem(AFTER_DARK_KEY,'1');}catch(_){}
            }
            saveReturnScoreHandoff(returnScore);
            navigateRealPage(otherUrl.href);
            return;
        }
        animateSwap(nextActive).catch(err => {
            console.error('[KuranokaPageTransition] V40:',err);
            removeScoreOmen();
            clearFatePrelude();
            document.getElementById('kkpt-vfx')?.remove();
            document.getElementById('kkpt-atmosphere')?.remove();
            document.getElementById('kkpt-webgl')?.remove();
            document.getElementById('kkpt-rebirth-visual')?.remove();
            returnScore?.beatScene?.dispose();
            document.getElementById('kkpt-lightning-layer')?.remove();
            if (frame) frame.style.filter = '';
            if((nextActive?otherPage:basePage)==='Kuronata'){
                try{sessionStorage.setItem(AFTER_DARK_KEY,'1');}catch(_){}
            }
            saveReturnScoreHandoff(returnScore);
            navigateRealPage(nextActive ? otherUrl.href : baseUrl);
        });
    }

    function createButton() {
        if (!document.body || document.getElementById('kkpt-toggle')) return;
        button=document.createElement('a');
        button.id='kkpt-toggle';
        labelIcon=document.createElement('span');
        labelIcon.className='kkpt-icon';
        labelIcon.setAttribute('aria-hidden','true');
        const text=document.createElement('span');
        text.className='kkpt-text';
        labelTitle=document.createElement('span');
        labelSub=document.createElement('span');
        labelSub.className='kkpt-sub';
        text.append(labelTitle,labelSub);
        button.append(labelIcon,text);
        document.body.append(button);
        button.hidden=!SHOW_FLOATING_BUTTON;
        updateButton();
        watchPortalLinks(document, otherPage);
        mountFateGear(document,otherPage);
        const continuingScore=restoreReturnScoreHandoff();
        if(basePage==='Kuranoka')createCloudbreakAfterglow(true);
        if(basePage==='Kuronata'){
            let hadDarkHandoff=false;
            try{hadDarkHandoff=sessionStorage.getItem(AFTER_DARK_KEY)==='1';}
            catch(_){}
            if(continuingScore||hadDarkHandoff){
                mountKuronataAftermath(returnScore);
            }
        }
        if(continuingScore)setTimeout(warmFrame,3000);
        else warmFrame();
        prewarmAtmosphere();
        preloadRebirthPad();

        button.addEventListener('click', event => {
            if (!isPlainClick(event)) return;
            event.preventDefault();
            armReturnScore(otherPage);
            primeSound();
            requestSwap(!active);
        });
    }

    // A plain [[Kuronata|your mysterious text]] now triggers everything.
    // The inverse [[Kuranoka|...]] uses the same transition, then real navigation.
    document.addEventListener('click', event => {
        if (active) return;
        portalClick(event, document, otherPage, true);
    }, true);
    mw.hook('wikipage.content').add(() => {
        if (document.readyState !== 'loading') watchPortalLinks(document, otherPage);
    });

    // Browser history is now real document history. A bfcache return
    // must restore THIS document, not leave its animated preview visible.
    window.addEventListener('pageshow', event => {
        if (!event.persisted) return;
        animating=false;
        document.getElementById('kkpt-vfx')?.remove();
        document.getElementById('kkpt-atmosphere')?.remove();
        document.getElementById('kkpt-rebirth-visual')?.remove();
        document.getElementById('kkpt-cloudbreak')?.remove();
        document.getElementById('kkpt-beat-scene')?.remove();
        kuronataAftermath?.dispose();
        document.getElementById('kkpt-lightning-layer')?.remove();
        if(frame){
            frame.style.filter='';
            setDisplayed(false);
            frame.classList.remove('kkpt-animating');
        }
        if(basePage==='Kuronata'){
            let entered=false;
            try{entered=sessionStorage.getItem(AFTER_DARK_KEY)==='1';}
            catch(_){}
            if(entered)mountKuronataAftermath(returnScore);
        }
        button?.classList.remove('kkpt-busy','kkpt-quiet');
    });

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded',createButton,{once:true});
    } else {
        createButton();
    }
}());