/* Hyper Nexus · Humans × Super Intelligence: co-evolution — v9 (p300, 2026-10-25). A precise, information-dense film for peers. */
.cf9{position:relative;margin-top:clamp(calc(18 * var(--cf9k, 1) * 1px),3vh,calc(34 * var(--cf9k, 1) * 1px));--ink:#0B0D17;--vi:#5B5BFF;--or:#FF6A3D}
.cf9-stage{position:relative;aspect-ratio:16/9;width:100%;border-radius:clamp(calc(12 * var(--cf9k, 1) * 1px),calc(1.2 * var(--cf9vw, 1vw)),calc(20 * var(--cf9k, 1) * 1px));overflow:hidden;color:var(--ink);isolation:isolate;box-shadow:0 30px 80px -50px rgba(20,24,60,.45),0 0 0 1px rgba(11,13,23,.08);
  background:radial-gradient(120% 90% at 70% 40%,rgba(91,91,255,.07),transparent 60%),repeating-linear-gradient(0deg,rgba(11,13,23,.045) 0 1px,transparent 1px 100%),repeating-linear-gradient(90deg,rgba(11,13,23,.045) 0 1px,transparent 1px 100%),#F6F7FB;background-size:auto,2.5% 4.444%,2.5% 4.444%,auto}
.cf9-stage canvas{position:absolute;inset:0;width:100%!important;height:100%!important}
.cf9-gl{opacity:0;transition:opacity .8s}
.cf9-k{position:absolute;inset:0;z-index:3;pointer-events:none}
.cf9-k .p{position:absolute;left:6%;margin:0;opacity:0;clip-path:inset(0 100% 0 0);transform:translateY(.25em);filter:blur(4px);letter-spacing:.06em;transition:opacity .45s,clip-path .8s cubic-bezier(.65,0,.35,1),transform .8s cubic-bezier(.16,1,.3,1),filter .6s,letter-spacing .9s cubic-bezier(.16,1,.3,1)}
.cf9-k .p.on{opacity:1;clip-path:inset(0 0 0 0);transform:none;filter:none;letter-spacing:-.01em}
.cf9-k em{font-style:normal;color:var(--vi)}
.cf9-k .p-tag{top:14.5%;font:700 clamp(calc(9 * var(--cf9k, 1) * 1px),calc(.9 * var(--cf9vw, 1vw)),calc(16 * var(--cf9k, 1) * 1px))/1 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.14em;color:var(--vi);text-transform:uppercase}
.cf9-k .p-h{top:12.5%;font-weight:850;font-size:clamp(calc(17 * var(--cf9k, 1) * 1px),calc(2.3 * var(--cf9vw, 1vw)),calc(44 * var(--cf9k, 1) * 1px));letter-spacing:.02em}
.cf9-k .p-big{top:34%;font-weight:900;font-size:clamp(calc(28 * var(--cf9k, 1) * 1px),calc(5.4 * var(--cf9vw, 1vw)),calc(104 * var(--cf9k, 1) * 1px));line-height:1;letter-spacing:-.03em}
.cf9-k .p-sub{top:52%;font-weight:700;font-size:clamp(calc(14 * var(--cf9k, 1) * 1px),calc(1.9 * var(--cf9vw, 1vw)),calc(36 * var(--cf9k, 1) * 1px));color:#4A5068}
.cf9-k .p-w{top:15%;font-weight:900;font-size:clamp(calc(30 * var(--cf9k, 1) * 1px),calc(5.6 * var(--cf9vw, 1vw)),calc(108 * var(--cf9k, 1) * 1px));letter-spacing:-.02em;translate:-50% 0}
.cf9[data-viz="thesis"] .p-w:nth-child(1){left:24%;color:var(--or)}.cf9[data-viz="thesis"] .p-w:nth-child(2){left:50%}.cf9[data-viz="thesis"] .p-w:nth-child(3){left:76%;color:var(--vi)}
.cf9[data-viz="thesis"] .p-sub{top:84%;left:50%;translate:-50% 0;font-size:clamp(calc(16 * var(--cf9k, 1) * 1px),calc(2.4 * var(--cf9vw, 1vw)),calc(46 * var(--cf9k, 1) * 1px));color:var(--ink)}
.cf9[data-viz="compute"] .p-big{top:28%;left:65%;color:var(--vi);font-size:clamp(calc(26 * var(--cf9k, 1) * 1px),calc(4.4 * var(--cf9vw, 1vw)),calc(84 * var(--cf9k, 1) * 1px))}.cf9[data-viz="compute"] .p-sub{top:41%;left:65%;font-size:clamp(calc(12 * var(--cf9k, 1) * 1px),calc(1.5 * var(--cf9vw, 1vw)),calc(28 * var(--cf9k, 1) * 1px))}
.cf9[data-viz="cost"] .p-big{top:28%;left:64%;color:#12B886;font-size:clamp(calc(30 * var(--cf9k, 1) * 1px),calc(6 * var(--cf9vw, 1vw)),calc(116 * var(--cf9k, 1) * 1px))}.cf9[data-viz="cost"] .p-sub{top:43%;left:64%;font-size:clamp(calc(12 * var(--cf9k, 1) * 1px),calc(1.5 * var(--cf9vw, 1vw)),calc(28 * var(--cf9k, 1) * 1px))}
.cf9[data-viz="jagged"] .p-sub{top:74%;font-size:clamp(calc(13 * var(--cf9k, 1) * 1px),calc(1.7 * var(--cf9vw, 1vw)),calc(32 * var(--cf9k, 1) * 1px))}.cf9[data-viz="jagged"] .p-big{top:81%;font-size:clamp(calc(18 * var(--cf9k, 1) * 1px),calc(3 * var(--cf9vw, 1vw)),calc(58 * var(--cf9k, 1) * 1px))}
.cf9[data-viz="embodied"] .p-sub,.cf9[data-viz="stack"] .p-sub{top:20%;font-size:clamp(calc(11 * var(--cf9k, 1) * 1px),calc(1.2 * var(--cf9vw, 1vw)),calc(22 * var(--cf9k, 1) * 1px));color:var(--vi)}
.cf9[data-viz="laws"] .p-big{top:84%;font-size:clamp(calc(18 * var(--cf9k, 1) * 1px),calc(3 * var(--cf9vw, 1vw)),calc(56 * var(--cf9k, 1) * 1px));left:50%;translate:-50% 0}
.cf9[data-viz="finale"] .p-big{top:13%;left:50%;translate:-50% 0;white-space:nowrap;font-size:clamp(calc(26 * var(--cf9k, 1) * 1px),calc(4.6 * var(--cf9vw, 1vw)),calc(88 * var(--cf9k, 1) * 1px))}.cf9[data-viz="finale"] .p-sub{top:27%;left:50%;translate:-50% 0;white-space:nowrap;font-size:clamp(calc(12 * var(--cf9k, 1) * 1px),calc(1.6 * var(--cf9vw, 1vw)),calc(30 * var(--cf9k, 1) * 1px))}
.cf9[data-viz="open"] .p-big{top:27%}.cf9[data-viz="open"] .p-sub{top:43%;font-size:clamp(calc(20 * var(--cf9k, 1) * 1px),calc(3 * var(--cf9vw, 1vw)),calc(58 * var(--cf9k, 1) * 1px));color:var(--ink);font-weight:900}.cf9[data-viz="open"] .p-sub2{top:54%;font-size:clamp(calc(18 * var(--cf9k, 1) * 1px),calc(2.6 * var(--cf9vw, 1vw)),calc(50 * var(--cf9k, 1) * 1px));color:var(--vi);font-weight:850}.cf9[data-viz="open"] .p-sub3{top:64%;font-size:clamp(calc(14 * var(--cf9k, 1) * 1px),calc(1.9 * var(--cf9vw, 1vw)),calc(36 * var(--cf9k, 1) * 1px));color:#4A5068;font-weight:800}
.cf9-k .p-sub2,.cf9-k .p-sub3{font-weight:800}.cf9[data-viz="revere"] .p-sub{top:20%;font-size:clamp(calc(11 * var(--cf9k, 1) * 1px),calc(1.3 * var(--cf9vw, 1vw)),calc(24 * var(--cf9k, 1) * 1px));color:var(--vi)}
.cf9:not(.sound) .cf9-pp{display:none}
.cf9-end{position:absolute;left:0;right:0;bottom:16%;z-index:4;display:flex;flex-direction:column;align-items:center;gap:clamp(calc(6 * var(--cf9k, 1) * 1px),calc(.8 * var(--cf9vw, 1vw)),calc(12 * var(--cf9k, 1) * 1px));opacity:0;transform:translateY(12px);transition:opacity 1s,transform 1.2s cubic-bezier(.16,1,.3,1);pointer-events:none}
.cf9-end.on{opacity:1;transform:none}
.cf9-end img{width:clamp(calc(44 * var(--cf9k, 1) * 1px),calc(5 * var(--cf9vw, 1vw)),calc(96 * var(--cf9k, 1) * 1px));height:auto}
.cf9-end b{font-weight:900;font-size:clamp(calc(20 * var(--cf9k, 1) * 1px),calc(3.2 * var(--cf9vw, 1vw)),calc(62 * var(--cf9k, 1) * 1px));letter-spacing:.02em}
.cf9-end span{font:700 clamp(calc(10 * var(--cf9k, 1) * 1px),calc(1 * var(--cf9vw, 1vw)),calc(18 * var(--cf9k, 1) * 1px))/1 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.34em;color:#4A5068}
.cf9-big{position:absolute;right:3%;bottom:12%;z-index:6;display:inline-flex;align-items:center;gap:10px;padding:clamp(calc(10 * var(--cf9k, 1) * 1px),calc(1 * var(--cf9vw, 1vw)),calc(14 * var(--cf9k, 1) * 1px)) clamp(calc(16 * var(--cf9k, 1) * 1px),calc(1.5 * var(--cf9vw, 1vw)),calc(24 * var(--cf9k, 1) * 1px));border-radius:999px;border:0;background:#0B0D17;color:#fff;font:700 clamp(calc(13 * var(--cf9k, 1) * 1px),calc(1.05 * var(--cf9vw, 1vw)),calc(18 * var(--cf9k, 1) * 1px))/1 inherit;cursor:pointer;box-shadow:0 14px 30px -16px rgba(11,13,23,.7);transition:opacity .4s}
.cf9-big svg{width:16px;height:16px}.cf9-big.gone{opacity:0;pointer-events:none}.cf9-big.prep{cursor:progress}.cf9-big.prep svg{animation:cf9Spin 1s linear infinite}
.cf9-ctl{display:flex;align-items:center;gap:clamp(calc(8 * var(--cf9k, 1) * 1px),calc(1 * var(--cf9vw, 1vw)),calc(14 * var(--cf9k, 1) * 1px));margin-top:14px;flex-wrap:wrap}
.cf9-pp,.cf9-fs{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:0;background:#0B0D17;color:#fff;font:700 15px/1 inherit;cursor:pointer}
html[data-theme="dark"] .cf9-pp,html[data-theme="dark"] .cf9-fs{background:#fff;color:#0B0D17}
.cf9-fs{padding:10px 12px}.cf9-pp svg,.cf9-fs svg{width:16px;height:16px}
.cf9-ch{display:flex;gap:6px;flex-wrap:wrap}
.cf9-ch button{padding:7px 11px;border-radius:999px;border:1px solid rgba(11,13,23,.14);background:transparent;color:inherit;font:650 12.5px/1 inherit;cursor:pointer;opacity:.75}
html[data-theme="dark"] .cf9-ch button{border-color:rgba(255,255,255,.18)}
.cf9-ch button[aria-current="true"]{opacity:1;border-color:#5B5BFF;background:#5B5BFF;color:#fff}
.cf9-prog{flex:1;min-width:120px;height:4px;border-radius:4px;background:rgba(11,13,23,.1);overflow:hidden;cursor:pointer}
html[data-theme="dark"] .cf9-prog{background:rgba(255,255,255,.14)}
.cf9-prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,#FF6A3D,#5B5BFF)}
.cf9:fullscreen{background:#F6F7FB;display:flex;flex-direction:column;justify-content:center}
.cf9:fullscreen .cf9-stage{width:calc(100 * var(--cf9vw, 1vw));max-height:100vh;height:auto;border-radius:0}
.cf9:fullscreen .cf9-ctl{position:absolute;left:24px;right:24px;bottom:18px;opacity:0;transition:opacity .4s}.cf9:fullscreen:hover .cf9-ctl{opacity:1}
@keyframes cf9Spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.cf9-k .p,.cf9-end{transition:none}}
@media (max-width:640px){.cf9-ch{display:none}}

/* p306 */
.cf9:fullscreen .cf9-prog{display:none}
.cf9[data-viz="stack"] .p-big{top:21.5%;font-size:clamp(calc(18 * var(--cf9k, 1) * 1px),calc(2.6 * var(--cf9vw, 1vw)),calc(50 * var(--cf9k, 1) * 1px));color:var(--vi)}.cf9[data-viz="stack"] .p-sub{top:31%}
.cf9[data-viz="finale"] .p-big{top:15%;font-size:clamp(calc(28 * var(--cf9k, 1) * 1px),calc(5 * var(--cf9vw, 1vw)),calc(96 * var(--cf9k, 1) * 1px))}

/* p307: colour, type and motion */
.cf9{--acc:#5B5BFF}
.cf9-stage::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(60% 55% at 80% 28%,var(--acc),transparent 72%);opacity:.09;transition:opacity .6s}
.cf9-k em{color:var(--acc)}
.cf9-k .p-h{padding-left:.55em}.cf9-k .p-h::before{content:"";position:absolute;left:0;top:.12em;bottom:.12em;width:.18em;border-radius:.1em;background:var(--acc);transform:scaleY(0);transform-origin:top;transition:transform .7s cubic-bezier(.16,1,.3,1) .15s}.cf9-k .p-h.on::before{transform:scaleY(1)}
.cf9-k .p-big{background:linear-gradient(100deg,var(--ink) 0%,var(--ink) 38%,var(--acc) 50%,var(--ink) 62%,var(--ink) 100%);background-size:260% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent}
.cf9-k .p-big.on{animation:cf9Pop .9s cubic-bezier(.16,1,.3,1) both,cf9Shine 2.6s ease-in-out .9s 1 both}
.cf9-k .p-big em{-webkit-text-fill-color:var(--acc)}
.cf9-k .p-sub,.cf9-k .p-sub2{background:linear-gradient(var(--acc),var(--acc)) 0 100%/0 .09em no-repeat;transition:opacity .45s,clip-path .8s cubic-bezier(.65,0,.35,1),transform .8s cubic-bezier(.16,1,.3,1),filter .6s,letter-spacing .9s cubic-bezier(.16,1,.3,1),background-size 1s cubic-bezier(.16,1,.3,1) .35s}
.cf9-k .p-sub.on,.cf9-k .p-sub2.on{background-size:100% .09em}
.cf9-k .p-w.on{animation:cf9Pop .8s cubic-bezier(.16,1,.3,1) both}
.cf9[data-viz="revere"] .cf9-k .p-h,.cf9[data-viz="revere"] .cf9-k .p-sub,.cf9[data-viz="finale"] .cf9-k .p-big,.cf9-end b,.cf9-chap{font-family:"Songti SC","STSong","Noto Serif SC","Source Han Serif SC","Noto Serif CJK SC",Georgia,serif}
.cf9[data-viz="finale"] .cf9-k .p-big{font-weight:700;letter-spacing:.12em}
.cf9[data-viz="strength"] .p-big{top:76%;left:58%;font-size:clamp(calc(15 * var(--cf9k, 1) * 1px),calc(2.1 * var(--cf9vw, 1vw)),calc(40 * var(--cf9k, 1) * 1px))}
.cf9-chap{position:absolute;left:0;right:0;top:50%;z-index:5;text-align:center;font-weight:800;font-size:clamp(calc(40 * var(--cf9k, 1) * 1px),calc(9 * var(--cf9vw, 1vw)),calc(170 * var(--cf9k, 1) * 1px));letter-spacing:.12em;color:transparent;-webkit-text-stroke:2px var(--acc);opacity:0;transform:translate(-8%,-50%) scale(1.05);pointer-events:none;white-space:nowrap}
.cf9-chap.on{animation:cf9Chap 1.25s cubic-bezier(.16,1,.3,1) both}
@keyframes cf9Pop{0%{opacity:0;transform:scale(1.14);filter:blur(10px)}55%{opacity:1;transform:scale(.985);filter:blur(0)}100%{opacity:1;transform:none;filter:none}}
@keyframes cf9Shine{0%{background-position:100% 0}100%{background-position:0 0}}
@keyframes cf9Chap{0%{opacity:0;transform:translate(-10%,-50%) scale(1.06)}30%{opacity:.9;transform:translate(0,-50%) scale(1)}70%{opacity:.75;transform:translate(2%,-50%) scale(1)}100%{opacity:0;transform:translate(10%,-50%) scale(.98)}}
@media (prefers-reduced-motion:reduce){.cf9-k .p-big.on,.cf9-k .p-w.on,.cf9-chap.on{animation:none}.cf9-chap{display:none}}

/* p309 */
.cf9-chap{font-size:clamp(calc(30 * var(--cf9k, 1) * 1px),calc(6.2 * var(--cf9vw, 1vw)),calc(118 * var(--cf9k, 1) * 1px));letter-spacing:.06em}
.cf9[data-viz="open"] .p-sub{font-size:clamp(calc(20 * var(--cf9k, 1) * 1px),calc(3.1 * var(--cf9vw, 1vw)),calc(60 * var(--cf9k, 1) * 1px))}

/* 2026-10-26 (p327): the film's right-click menu, share bar, toast and recording pill */
.cf9-menu{position:fixed;z-index:2147483000;min-width:230px;padding:6px;border-radius:12px;background:rgba(255,255,255,.96);border:1px solid rgba(17,24,39,.1);box-shadow:0 18px 48px rgba(15,23,42,.22);backdrop-filter:blur(12px)}
.cf9-menu button{display:block;width:100%;text-align:start;font:500 14px/1.3 system-ui,-apple-system,"PingFang SC",sans-serif;padding:9px 12px;border:0;border-radius:8px;background:none;color:#111827;cursor:pointer}
.cf9-menu button:hover,.cf9-menu button:focus-visible{background:rgba(109,91,255,.1);outline:none}
.cf9-share{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:18px 0 6px}
.cf9-share button{font:600 14px/1 system-ui,-apple-system,"PingFang SC",sans-serif;padding:11px 18px;border-radius:999px;border:1px solid rgba(17,24,39,.14);background:#fff;color:#111827;cursor:pointer}
.cf9-share button[data-act="save"]{background:#111827;color:#fff;border-color:#111827}
.cf9-toast{position:fixed;left:50%;bottom:28px;z-index:2147483001;transform:translate(-50%,12px);opacity:0;transition:.25s;padding:10px 16px;border-radius:999px;background:#111827;color:#fff;font:500 14px/1.3 system-ui,sans-serif;max-width:min(calc(92 * var(--cf9vw, 1vw)),640px);text-align:center}
.cf9-toast.on{opacity:1;transform:translate(-50%,0)}
.cf9-rec{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:2147483001;padding:9px 16px;border-radius:999px;border:0;background:#E5484D;color:#fff;font:600 13px/1 system-ui,sans-serif;cursor:pointer;box-shadow:0 8px 24px rgba(229,72,77,.35)}
@media (prefers-color-scheme:dark){.cf9-menu{background:rgba(28,28,30,.96);border-color:rgba(255,255,255,.12)}.cf9-menu button{color:#F5F5F7}.cf9-share button{background:#1C1C1E;color:#F5F5F7;border-color:rgba(255,255,255,.16)}.cf9-share button[data-act="save"]{background:#F5F5F7;color:#111}}

/* 2026-10-26 (p333): handwriting for the emphasis lines and the finale, written stroke by stroke; younger colours */
@font-face{font-family:"HN Hand";src:url(/assets/v2/fonts/hn-hand-zh.65ad459433.woff2) format("woff2");unicode-range:U+3000-303F,U+3400-9FFF,U+FF00-FFEF,U+00B7;font-display:swap}
@font-face{font-family:"HN Hand";src:url(/assets/v2/fonts/hn-hand-lat.a59247948a.woff2) format("woff2");unicode-range:U+0020-024F,U+0300-036F,U+0400-04FF,U+1E00-1EFF,U+2010-2044;font-display:swap}
.cf9-k .p-sub2,.cf9-k .p-sub3,.cf9[data-viz="finale"] .cf9-k .p-big{font-family:"HN Hand","Kaiti SC","STKaiti",system-ui,sans-serif;font-weight:600;letter-spacing:.01em;clip-path:none;-webkit-mask-image:linear-gradient(100deg,#000 0 44%,transparent 56% 100%);mask-image:linear-gradient(100deg,#000 0 44%,transparent 56% 100%);-webkit-mask-size:250% 100%;mask-size:250% 100%;-webkit-mask-position:100% 0;mask-position:100% 0;transition:opacity .3s,-webkit-mask-position 1.9s cubic-bezier(.45,.05,.35,1),mask-position 1.9s cubic-bezier(.45,.05,.35,1),transform .9s cubic-bezier(.16,1,.3,1),filter .5s,background-size 1.2s .5s cubic-bezier(.16,1,.3,1)}
.cf9-k .p-sub2.on, .cf9-k .p-sub3.on, .cf9[data-viz="finale"] .cf9-k .p-big.on{-webkit-mask-position:0 0;mask-position:0 0}
.cf9-k .p-sub2,.cf9-k .p-sub3{transform:rotate(-1.2deg) translateY(.2em);background:linear-gradient(100deg,rgba(255,206,84,.62),rgba(255,138,101,.5) 55%,rgba(72,219,198,.5)) 0 86%/0 .38em no-repeat;padding:0 .12em;border-radius:.2em}
.cf9-k .p-sub2.on,.cf9-k .p-sub3.on{transform:rotate(-1.2deg);background-size:100% .38em}
.cf9-k em{background:linear-gradient(92deg,#6D5BFF,#E254FF 48%,#FF7A59);-webkit-background-clip:text;background-clip:text;color:transparent}

/* 2026-10-26 (p335): aurora colours, a clean loading cover, livelier handwriting, an inviting sound button */
.cf9-stage::before{content:"";position:absolute;inset:-25%;z-index:2;mix-blend-mode:multiply;opacity:.9;pointer-events:none;background:radial-gradient(38% 46% at 14% 18%,rgba(109,91,255,.30),transparent 62%),radial-gradient(34% 42% at 86% 22%,rgba(255,95,160,.24),transparent 62%),radial-gradient(40% 48% at 72% 86%,rgba(40,214,190,.24),transparent 62%),radial-gradient(30% 38% at 24% 88%,rgba(255,190,60,.22),transparent 62%);filter:blur(6px) saturate(1.15);animation:cf9aur 22s ease-in-out infinite alternate}
@keyframes cf9aur{0%{transform:translate3d(-3%,-2%,0) rotate(0deg) scale(1)}50%{transform:translate3d(3%,2%,0) rotate(8deg) scale(1.06)}100%{transform:translate3d(-2%,3%,0) rotate(-6deg) scale(1.02)}}
.cf9-cover{position:absolute;inset:0;z-index:40;background:#F4F1FF center/cover no-repeat;display:grid;place-items:center;transition:opacity .8s ease,filter .8s ease;pointer-events:none}
.cf9-cover i{width:46px;height:46px;border-radius:50%;background:conic-gradient(from 0deg,#6D5BFF,#FF5FA0,#FFB84D,#28D6BE,#6D5BFF);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));animation:cf9spin 1s linear infinite;opacity:.9;margin-top:22%}
.cf9-cover.gone{opacity:0;filter:blur(8px)}
@keyframes cf9spin{to{transform:rotate(360deg)}}
.cf9-k .p-sub2.hw-go,.cf9-k .p-sub3.hw-go{-webkit-mask-image:none;mask-image:none}
.cf9-k .hw-c{display:inline-block;opacity:0;will-change:transform,opacity}
.cf9-k .hw-go .hw-c{animation:cf9hw .75s cubic-bezier(.2,.75,.2,1) forwards;animation-delay:calc(var(--i) * .11s)}
@keyframes cf9hw{0%{opacity:0;color:transparent;-webkit-text-stroke:1.5px #6D5BFF;transform:translateY(.1em) rotate(-7deg) scale(1.28);filter:blur(1.2px)}45%{opacity:1;color:transparent;-webkit-text-stroke:1.5px #E254FF;filter:blur(0)}75%{color:inherit;-webkit-text-stroke:.6px rgba(226,84,255,.5);transform:rotate(1deg) scale(1.04)}100%{opacity:1;color:inherit;-webkit-text-stroke:0 transparent;transform:none}}
.cf9-pen{position:absolute;z-index:8;width:14px;height:14px;margin:-7px 0 0 -2px;border-radius:50%;background:radial-gradient(circle,#fff 0 22%,#FF7A59 48%,rgba(255,122,89,0) 72%);box-shadow:0 0 18px 6px rgba(255,122,89,.5);pointer-events:none;transition:left .1s linear,top .1s linear,opacity .4s}
.cf9-pen.gone{opacity:0}
.cf9 .cf9-pp{animation:cf9inv 2.8s ease-in-out infinite}
@keyframes cf9inv{0%,100%{box-shadow:0 8px 24px rgba(17,24,39,.18),0 0 0 0 rgba(109,91,255,.0)}50%{box-shadow:0 8px 24px rgba(17,24,39,.18),0 0 0 8px rgba(109,91,255,.18)}}
@media (prefers-reduced-motion:reduce){.cf9-stage::before,.cf9 .cf9-pp,.cf9-cover i{animation:none}}

/* 2026-10-26 (p336): the cover as a title card - deep space colours, aurora, receding grid, flowing title, progress ring, play with sound */
.cf9-cover{position:absolute;inset:0;z-index:40;display:grid;place-items:center;overflow:hidden;pointer-events:auto;background:radial-gradient(120% 95% at 18% 8%,#2E2175 0%,#12103A 48%,#06061A 100%);color:#fff;transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.2,1),filter .9s ease}
.cf9-cover.gone{opacity:0;transform:scale(1.06);filter:blur(10px);pointer-events:none}
.cv-bg i{position:absolute;width:55%;height:70%;border-radius:50%;filter:blur(60px);opacity:.55;mix-blend-mode:screen;animation:cvFloat 14s ease-in-out infinite alternate}
.cv-bg i:nth-child(1){left:-10%;top:-15%;background:#6D5BFF}.cv-bg i:nth-child(2){right:-12%;top:5%;background:#FF4FA3;animation-duration:17s}.cv-bg i:nth-child(3){left:25%;bottom:-30%;background:#21D4B4;animation-duration:20s}
@keyframes cvFloat{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(8%,6%,0) scale(1.18)}}
.cv-grid{position:absolute;left:-50%;right:-50%;bottom:-8%;height:55%;background:linear-gradient(rgba(140,130,255,.28) 1px,transparent 1px) 0 0/100% 42px,linear-gradient(90deg,rgba(140,130,255,.22) 1px,transparent 1px) 0 0/42px 100%;transform:perspective(420px) rotateX(62deg);transform-origin:50% 0;-webkit-mask-image:linear-gradient(transparent,#000 45%);mask-image:linear-gradient(transparent,#000 45%);animation:cvGrid 2.4s linear infinite;opacity:.75}
@keyframes cvGrid{to{background-position:0 42px,0 0}}
.cv-in{position:relative;width:min(86%,1100px);text-align:left}
.cv-k{font:700 clamp(calc(9 * var(--cf9k, 1) * 1px),calc(.95 * var(--cf9vw, 1vw)),calc(15 * var(--cf9k, 1) * 1px))/1 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.24em;color:#A99CFF;white-space:nowrap;overflow:hidden;width:0;animation:cvType 1.6s steps(38) .2s forwards}
.cv-k::after{content:"";display:inline-block;width:.55em;height:1em;margin-left:.2em;vertical-align:-.15em;background:#FF6FB5;animation:cvCaret .8s steps(2) infinite}
@keyframes cvType{to{width:100%}}@keyframes cvCaret{50%{opacity:0}}
.cv-t{margin:clamp(calc(12 * var(--cf9k, 1) * 1px),calc(2.2 * var(--cf9vw, 1vw)),calc(30 * var(--cf9k, 1) * 1px)) 0 clamp(calc(8 * var(--cf9k, 1) * 1px),calc(1.2 * var(--cf9vw, 1vw)),calc(16 * var(--cf9k, 1) * 1px));font:900 clamp(calc(26 * var(--cf9k, 1) * 1px),calc(5 * var(--cf9vw, 1vw)),calc(84 * var(--cf9k, 1) * 1px))/1.08 system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:-.02em;background:linear-gradient(100deg,#FFFFFF 0%,#D4CCFF 25%,#FF8FCF 45%,#7EF0DC 62%,#FFFFFF 80%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:cvShine 5s linear infinite;filter:drop-shadow(0 6px 30px rgba(120,100,255,.35))}
.cv-t span{display:inline-block;opacity:0;transform:translateY(.4em) scale(.9);filter:blur(8px);animation:cvChar .7s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.5s + var(--i) * .06s)}
@keyframes cvChar{to{opacity:1;transform:none;filter:blur(0)}}@keyframes cvShine{to{background-position:-250% 0}}
.cv-s{font:600 clamp(calc(13 * var(--cf9k, 1) * 1px),calc(1.7 * var(--cf9vw, 1vw)),calc(28 * var(--cf9k, 1) * 1px))/1.3 system-ui,-apple-system,"PingFang SC",sans-serif;color:rgba(255,255,255,.78);letter-spacing:.06em;opacity:0;animation:cvChar .9s ease 1.4s forwards}
.cv-row{display:flex;align-items:center;gap:clamp(calc(14 * var(--cf9k, 1) * 1px),calc(2 * var(--cf9vw, 1vw)),calc(28 * var(--cf9k, 1) * 1px));margin-top:clamp(calc(18 * var(--cf9k, 1) * 1px),calc(3 * var(--cf9vw, 1vw)),calc(44 * var(--cf9k, 1) * 1px))}
.cv-ring{position:relative;width:clamp(calc(54 * var(--cf9k, 1) * 1px),calc(6 * var(--cf9vw, 1vw)),calc(92 * var(--cf9k, 1) * 1px));aspect-ratio:1;filter:drop-shadow(0 0 14px rgba(255,111,181,.45))}
.cv-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.cv-ring circle{fill:none;stroke-width:6}.cv-ring .trk{stroke:rgba(255,255,255,.12)}.cv-ring .bar{stroke:url(#cvg);stroke-linecap:round}
.cv-ring b{position:absolute;inset:0;display:grid;place-items:center;font:700 clamp(calc(11 * var(--cf9k, 1) * 1px),calc(1.1 * var(--cf9vw, 1vw)),calc(17 * var(--cf9k, 1) * 1px))/1 ui-monospace,"SF Mono",Menlo,monospace;font-variant-numeric:tabular-nums;color:#fff}
.cv-play{font:700 clamp(calc(13 * var(--cf9k, 1) * 1px),calc(1.2 * var(--cf9vw, 1vw)),calc(18 * var(--cf9k, 1) * 1px))/1 system-ui,-apple-system,"PingFang SC",sans-serif;padding:.9em 1.5em;border-radius:999px;border:1px solid rgba(255,255,255,.28);background:linear-gradient(100deg,rgba(139,123,255,.35),rgba(255,111,181,.35));color:#fff;cursor:pointer;backdrop-filter:blur(8px);box-shadow:0 10px 40px rgba(109,91,255,.35);transition:transform .2s,box-shadow .2s}
.cv-play:hover{transform:translateY(-2px);box-shadow:0 14px 50px rgba(255,111,181,.45)}
@media (prefers-reduced-motion:reduce){.cv-bg i,.cv-grid,.cv-t,.cv-t span,.cv-k,.cv-k::after{animation:none!important;opacity:1;width:auto;transform:none;filter:none}}

.cf9-cover .cv-bg i{-webkit-mask:none;mask:none;margin:0;opacity:.55;background-image:none}
.cf9-cover .cv-bg i:nth-child(1){background-color:#6D5BFF}.cf9-cover .cv-bg i:nth-child(2){background-color:#FF4FA3}.cf9-cover .cv-bg i:nth-child(3){background-color:#21D4B4}
.cf9-cover .cv-t{background:none;color:#fff;animation:none;position:relative}
.cf9-cover .cv-t span{background:linear-gradient(100deg,#FFFFFF 0%,#D9D2FF 30%,#FF8FCF 58%,#7EF0DC 82%,#FFFFFF 100%);background-size:calc(var(--n) * 100%) 100%;background-position:calc(var(--i) / (var(--n) - 1) * 100%) 0;-webkit-background-clip:text;background-clip:text;color:transparent}
.cf9-cover .cv-t::after{content:"";position:absolute;inset:-10% -5%;background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);background-size:250% 100%;mix-blend-mode:soft-light;animation:cvShine 3.6s linear 1.6s infinite;pointer-events:none}
.cf9-cover .cv-t::after{display:none}
.cf9-cover .cv-bg i{opacity:.4;filter:blur(90px)}

/* 2026-10-26 (p337): performance - no blend modes, blurs or repainting animations over the live canvas and the 3D helix */
.cf9-stage::before{animation:none!important;filter:none!important;mix-blend-mode:normal!important;opacity:.16!important}
.cf9-cover .cv-bg i{filter:none!important;mix-blend-mode:normal!important;opacity:.62!important;background-color:transparent!important;will-change:transform}
.cf9-cover .cv-bg i:nth-child(1){background-image:radial-gradient(closest-side,rgba(109,91,255,.95),rgba(109,91,255,0))!important}
.cf9-cover .cv-bg i:nth-child(2){background-image:radial-gradient(closest-side,rgba(255,79,163,.85),rgba(255,79,163,0))!important}
.cf9-cover .cv-bg i:nth-child(3){background-image:radial-gradient(closest-side,rgba(33,212,180,.8),rgba(33,212,180,0))!important}
.cf9-cover .cv-grid{animation:cvGrid2 2.4s linear infinite!important;will-change:transform}
@keyframes cvGrid2{from{transform:perspective(420px) rotateX(62deg) translateY(0)}to{transform:perspective(420px) rotateX(62deg) translateY(42px)}}
.cf9-cover .cv-t{filter:none}

/* 2026-10-26 (p338): hand lines scaled without relayout; kinetic cover; lite mode */
.cf9-k .p-sub2,.cf9-k .p-sub3{transform-origin:0 60%;transform:rotate(-1.2deg) translateY(.2em) scale(1.3)}
.cf9-k .p-sub2.on,.cf9-k .p-sub3.on{transform:rotate(-1.2deg) scale(1.3)}
.cf9-cover.cx{position:absolute;inset:0;z-index:40;overflow:hidden;pointer-events:auto;color:#fff;background:linear-gradient(135deg,#0A0A23 0%,#1B1150 45%,#3A0F4F 78%,#071A2E 100%);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.cf9-cover.cx.gone{opacity:0;transform:scale(1.08);pointer-events:none}
.cx-glow{position:absolute;inset:0;background:radial-gradient(42% 55% at 22% 30%,rgba(109,91,255,.55),transparent 70%),radial-gradient(38% 50% at 80% 70%,rgba(255,79,163,.42),transparent 70%),radial-gradient(30% 40% at 62% 18%,rgba(33,212,180,.35),transparent 70%)}
.cx-ring{position:absolute;border-radius:50%;border:1px solid rgba(160,150,255,.35);will-change:transform;animation:cxSpin 26s linear infinite}
.cx-ring.r1{width:62%;aspect-ratio:1;right:-12%;top:-28%;border-color:rgba(255,111,181,.35);border-style:dashed}
.cx-ring.r2{width:40%;aspect-ratio:1;left:-8%;bottom:-22%;animation-duration:34s;animation-direction:reverse;border-color:rgba(69,227,200,.4)}
@keyframes cxSpin{to{transform:rotate(360deg)}}
.cx-w{position:absolute;opacity:0;transform:translateY(24px) scale(.92);animation:cxPop .8s cubic-bezier(.2,.9,.25,1.15) forwards;animation-delay:var(--d);white-space:nowrap;will-change:transform,opacity}
@keyframes cxPop{to{opacity:1;transform:none}}
.cx-kick{left:6%;top:9%;font:700 clamp(calc(9 * var(--cf9k, 1) * 1px),calc(.9 * var(--cf9vw, 1vw)),calc(14 * var(--cf9k, 1) * 1px))/1 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.3em;color:#9D8CFF}
.cx-out{right:5%;top:11%;text-align:right;font:900 clamp(calc(22 * var(--cf9k, 1) * 1px),calc(4.4 * var(--cf9vw, 1vw)),calc(78 * var(--cf9k, 1) * 1px))/.92 system-ui,-apple-system,sans-serif;letter-spacing:.02em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.55)}
.cx-big{left:6%;top:34%;max-width:76%;white-space:normal;font:900 clamp(calc(28 * var(--cf9k, 1) * 1px),calc(5.6 * var(--cf9vw, 1vw)),calc(96 * var(--cf9k, 1) * 1px))/1.05 system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:-.02em;background:linear-gradient(95deg,#FFFFFF 0%,#E3DCFF 30%,#FF8FCF 60%,#7EF0DC 92%);-webkit-background-clip:text;background-clip:text;color:transparent}
.cx-hand{left:8%;top:63%;font:600 clamp(calc(20 * var(--cf9k, 1) * 1px),calc(3.3 * var(--cf9vw, 1vw)),calc(56 * var(--cf9k, 1) * 1px))/1 "HN Hand","Kaiti SC",cursive;color:#FFD66B;transform:rotate(-4deg)}
.cx-chip{top:76%;font:800 clamp(calc(12 * var(--cf9k, 1) * 1px),calc(1.35 * var(--cf9vw, 1vw)),calc(22 * var(--cf9k, 1) * 1px))/1 system-ui,-apple-system,"PingFang SC",sans-serif;padding:.55em 1em;border-radius:999px;color:#0A0A23}
.cx-chip.c0{left:6%;background:linear-gradient(95deg,#A99CFF,#7EE7FF)}.cx-chip.c1{left:calc(6% + 9em);background:linear-gradient(95deg,#FF9BD2,#FFC07A)}.cx-chip.c2{left:calc(6% + 18em);background:linear-gradient(95deg,#7EF0DC,#C6FF8A)}
.cx-tag{font:700 clamp(calc(10 * var(--cf9k, 1) * 1px),calc(1.05 * var(--cf9vw, 1vw)),calc(17 * var(--cf9k, 1) * 1px))/1 ui-monospace,"SF Mono",Menlo,monospace;padding:.5em .8em;border:1px solid currentColor;border-radius:6px;background:rgba(255,255,255,.04)}
.cx-tag.t0{right:24%;top:40%;color:#7EF0DC}.cx-tag.t1{right:9%;top:52%;color:#FF8FCF;font-size:clamp(calc(14 * var(--cf9k, 1) * 1px),calc(1.8 * var(--cf9vw, 1vw)),calc(30 * var(--cf9k, 1) * 1px))}.cx-tag.t2{right:28%;top:62%;color:#FFD66B}.cx-tag.t3{right:12%;top:31%;color:#A99CFF}
.cx-play{position:absolute;right:7%;bottom:9%;width:clamp(calc(74 * var(--cf9k, 1) * 1px),calc(8.5 * var(--cf9vw, 1vw)),calc(132 * var(--cf9k, 1) * 1px));aspect-ratio:1;border-radius:50%;border:0;padding:0;cursor:pointer;background:radial-gradient(circle at 35% 30%,#8B7BFF,#5B3BE8 60%,#3A1FB0);box-shadow:0 0 0 6px rgba(139,123,255,.18),0 14px 50px rgba(91,59,232,.55);transition:transform .2s}
.cx-play:hover{transform:scale(1.06)}.cx-play:active{transform:scale(.96)}
.cx-play svg{position:absolute;inset:-14%;width:128%;height:128%;transform:rotate(-90deg)}.cx-play circle{fill:none;stroke-width:3}.cx-play .trk{stroke:rgba(255,255,255,.14)}.cx-play .bar{stroke:#FF8FCF;stroke-linecap:round}
.cx-play i{position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:.62em 0 .62em 1.05em;border-color:transparent transparent transparent #fff;font-size:clamp(calc(14 * var(--cf9k, 1) * 1px),calc(1.5 * var(--cf9vw, 1vw)),calc(24 * var(--cf9k, 1) * 1px))}
.cx-play em{position:absolute;top:calc(100% + 1.3em);left:50%;transform:translateX(-50%);font:700 clamp(calc(11 * var(--cf9k, 1) * 1px),calc(1 * var(--cf9vw, 1vw)),calc(15 * var(--cf9k, 1) * 1px))/1 system-ui,-apple-system,"PingFang SC",sans-serif;font-style:normal;white-space:nowrap;color:rgba(255,255,255,.85)}
.cf9-cover.cx.go .cx-play svg{animation:cxSpin 1s linear infinite}.cf9-cover.cx.go .cx-play i{opacity:.35}
.cf9-lite .cf9-k *,.cf9-lite .cf9-stage::before,.cf9-lite .cx-ring,.cf9-lite .cf9-pp{animation:none!important;transition:none!important;filter:none!important}
@media (prefers-reduced-motion:reduce){.cx-w{animation:none;opacity:1;transform:none}.cx-ring{animation:none}}
@media (max-width:640px){.cx-out,.cx-tag.t2,.cx-tag.t3{display:none}.cx-chip.c1{left:calc(6% + 7.5em)}.cx-chip.c2{display:none}}
.cf9-cover.cx .cx-play i{width:0;height:0;border-radius:0;background:none;-webkit-mask:none;mask:none;animation:none;margin:0;opacity:1}
.cf9-cover.cx.go .cx-play i{opacity:.35}
.cx-tag.t0{right:6%;top:41%}.cx-tag.t1{right:24%;top:53%}.cx-tag.t2{right:9%;top:63%}.cx-tag.t3{right:13%;top:30%}

/* 2026-10-26 (p341): the cover's sub line decodes like generated text - thin, wide-spaced gradient, a scan line beneath */
.cf9-cover .cx-hand{font:300 clamp(calc(18 * var(--cf9k, 1) * 1px),calc(2.7 * var(--cf9vw, 1vw)),calc(46 * var(--cf9k, 1) * 1px))/1.15 system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:.34em;transform:none;color:transparent;background:linear-gradient(90deg,#7EF0DC,#A99CFF 50%,#FF8FCF);-webkit-background-clip:text;background-clip:text;padding-bottom:.35em;animation-name:cxPop}
.cf9-cover .cx-hand::after{content:"";position:absolute;left:0;bottom:0;width:38%;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,#7EF0DC,#FF8FCF,transparent);animation:cxScan 2.8s ease-in-out 1.2s infinite alternate;will-change:transform}
@keyframes cxScan{from{transform:translateX(0)}to{transform:translateX(165%)}}
.cf9-lite .cf9-cover .cx-hand::after{animation:none}

/* 2026-10-26 (p342): Apple and Google faces, crisp sizes instead of scaling, a free diagonal opening composition, a fly-through start */
.cf9-k .p-sub2,.cf9-k .p-sub3,.cf9[data-viz="finale"] .cf9-k .p-big,.cf9-cover .cx-w{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Google Sans",Roboto,"Helvetica Neue","PingFang SC","Noto Sans SC","Hiragino Sans GB","Microsoft YaHei",sans-serif!important}
.cf9-k .p-sub2,.cf9-k .p-sub3{transform:none!important;background:none!important;padding:0!important;border-radius:0!important;font-weight:300!important;letter-spacing:.22em!important;font-size:clamp(calc(18 * var(--cf9k, 1) * 1px),calc(2.5 * var(--cf9vw, 1vw)),calc(46 * var(--cf9k, 1) * 1px));color:#4B3BFF;-webkit-mask-image:none!important;mask-image:none!important}
.cf9-k .p-sub2::after,.cf9-k .p-sub3::after{content:"";display:block;height:2px;margin-top:.35em;width:0;background:linear-gradient(90deg,#21D4B4,#8B7BFF,#FF4FA3);transition:width 1.3s cubic-bezier(.2,.7,.2,1) .5s}
.cf9-k .p-sub2.on::after,.cf9-k .p-sub3.on::after{width:100%}
.cf9[data-viz="open"] .cf9-k .p-tag{top:9%!important}
.cf9[data-viz="open"] .cf9-k .p-big{top:19%!important}
.cf9[data-viz="open"] .cf9-k .p-sub{top:47%!important;left:13%!important;font-weight:600!important}
.cf9[data-viz="open"] .cf9-k .p-sub2{top:70%!important;left:27%!important}
.cf9-cover.cx.ready .cx-play{animation:cxReady 1.6s ease-in-out infinite}
@keyframes cxReady{50%{box-shadow:0 0 0 14px rgba(139,123,255,.22),0 14px 60px rgba(255,79,163,.5)}}
.cf9-cover.cx.go .cx-w{transition:transform 1.6s cubic-bezier(.55,0,.2,1),opacity 1.4s ease .2s;opacity:0!important;animation:none!important}
.cf9-cover.cx.go .cx-big{transform:scale(1.9) translate(4%,-6%)}.cf9-cover.cx.go .cx-out{transform:scale(1.6) translate(18%,-30%)}.cf9-cover.cx.go .cx-hand{transform:scale(1.7) translate(-10%,25%)}.cf9-cover.cx.go .cx-kick{transform:translate(-40%,-120%)}
.cf9-cover.cx.go .cx-chip{transform:scale(1.5) translateY(120%)}.cf9-cover.cx.go .cx-tag{transform:scale(2.2) translate(30%,0)}
.cf9-cover.cx.go .cx-ring{animation-duration:3s!important}.cf9-cover.cx.go .cx-glow{transition:transform 2.4s cubic-bezier(.3,0,.2,1);transform:scale(1.35)}

/* 2026-10-26 (p344): the RSI animation - three forces orbit a foundation model, ever faster, wrapped in a reverse-spinning loop */
.cf9-rsi{--sp:8s;position:absolute;left:46%;top:16%;width:min(46%,620px);aspect-ratio:1;z-index:4;pointer-events:none;opacity:0;transform:scale(.85);transition:opacity .8s ease,transform 1s cubic-bezier(.2,.8,.2,1)}
.cf9-rsi.on{opacity:1;transform:none}
.rs-sp{position:absolute;inset:6%;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(139,123,255,.10) 0 6deg,transparent 6deg 30deg);animation:rsSpin calc(var(--sp) * 3) linear infinite}
.rs-loop{position:absolute;inset:14%;width:72%;height:72%;animation:rsSpin calc(var(--sp) * .9) linear infinite reverse}
.rs-core{position:absolute;left:50%;top:50%;width:30%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at 35% 30%,#A99CFF,#6D5BFF 55%,#3A1FB0);box-shadow:0 0 0 8px rgba(139,123,255,.16),0 18px 60px rgba(91,59,232,.45);animation:rsPulse 1.07s ease-in-out infinite}
.rs-core b{font:700 clamp(calc(10 * var(--cf9k, 1) * 1px),calc(1.15 * var(--cf9vw, 1vw)),calc(18 * var(--cf9k, 1) * 1px))/1.2 -apple-system,"SF Pro Display",Roboto,"PingFang SC","Noto Sans SC",sans-serif;color:#fff;padding:0 .6em}
@keyframes rsPulse{50%{box-shadow:0 0 0 16px rgba(139,123,255,.10),0 18px 70px rgba(255,79,163,.45)}}
.rs-tag{position:absolute;left:50%;top:4%;transform:translateX(-50%);font:800 clamp(calc(12 * var(--cf9k, 1) * 1px),calc(1.4 * var(--cf9vw, 1vw)),calc(22 * var(--cf9k, 1) * 1px))/1 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.12em;color:#FF4FA3}
.rs-orb{position:absolute;inset:0;animation:rsSpin var(--sp) linear infinite}
.rs-orb.o1{animation-delay:calc(var(--sp) * -.333)}.rs-orb.o2{animation-delay:calc(var(--sp) * -.666)}
.rs-orb span{position:absolute;left:50%;top:2%;transform:translateX(-50%);padding:.55em 1em;border-radius:999px;font:700 clamp(calc(11 * var(--cf9k, 1) * 1px),calc(1.15 * var(--cf9vw, 1vw)),calc(18 * var(--cf9k, 1) * 1px))/1 -apple-system,"SF Pro Display",Roboto,"PingFang SC","Noto Sans SC",sans-serif;color:#0B0D17;white-space:nowrap;animation:rsSpin var(--sp) linear infinite reverse;animation-delay:inherit}
.rs-orb.o0 span{background:linear-gradient(95deg,#FFB27A,#FF6A3D);color:#fff}.rs-orb.o1 span{background:linear-gradient(95deg,#B9AEFF,#6D5BFF);color:#fff}.rs-orb.o2 span{background:linear-gradient(95deg,#8CF5E2,#21D4B4)}
@keyframes rsSpin{to{transform:rotate(360deg)}}
.rs-orb span{transform-origin:50% 50%}
.cf9-lite .cf9-rsi *{animation-duration:20s!important}
@media (prefers-reduced-motion:reduce){.cf9-rsi *{animation:none!important}}

/* p345: no per-character writing; the emphasis line simply rises in */
.cf9-k .p-sub2,.cf9-k .p-sub3{transition:opacity .7s ease,transform .9s cubic-bezier(.16,1,.3,1)!important}

/* 2026-10-26 (p346): RSI as a particle flywheel - fixed, readable labels */
.cf9-rsi.v2 .rs-cv{position:absolute;inset:0;width:100%;height:100%}
.cf9-rsi.v2 .rs-core{width:26%}
.cf9-rsi.v2 .rs-tag{top:-2%}
.rs-lb{position:absolute;padding:.5em 1em;border-radius:999px;font:700 clamp(calc(11 * var(--cf9k, 1) * 1px),calc(1.15 * var(--cf9vw, 1vw)),calc(18 * var(--cf9k, 1) * 1px))/1 -apple-system,"SF Pro Display",Roboto,"PingFang SC","Noto Sans SC",sans-serif;color:#fff;white-space:nowrap;box-shadow:0 8px 24px rgba(20,20,60,.15)}
.rs-lb.l0{left:2%;top:18%;background:linear-gradient(95deg,#FFB27A,#FF6A3D)}.rs-lb.l1{right:-2%;top:44%;background:linear-gradient(95deg,#B9AEFF,#6D5BFF)}.rs-lb.l2{left:6%;bottom:10%;background:linear-gradient(95deg,#5CE6CE,#14B89C)}

/* 2026-10-26 (p347): gigawatt data-centre list on the compute page */
.cf9-gw{position:absolute;right:4%;bottom:10%;width:min(40%,560px);z-index:4;pointer-events:none;padding:1.1em 1.3em;border-radius:16px;background:linear-gradient(140deg,rgba(255,255,255,.9),rgba(241,239,255,.86));box-shadow:0 18px 50px rgba(52,48,140,.14);border:1px solid rgba(109,91,255,.14);opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .8s cubic-bezier(.2,.8,.2,1);font-family:-apple-system,"SF Pro Display",Roboto,"PingFang SC","Noto Sans SC",sans-serif}
.cf9-gw.on{opacity:1;transform:none}
.cf9-gw b{display:block;font-size:clamp(calc(11 * var(--cf9k, 1) * 1px),calc(1 * var(--cf9vw, 1vw)),calc(15 * var(--cf9k, 1) * 1px));letter-spacing:.08em;color:#5B4BFF;margin-bottom:.6em}
.cf9-gw p{display:grid;grid-template-columns:1.6em 1.25fr 1.2fr .8fr;align-items:baseline;gap:.5em;margin:0;padding:.42em 0;border-top:1px solid rgba(109,91,255,.08);font-size:clamp(calc(11 * var(--cf9k, 1) * 1px),calc(1.02 * var(--cf9vw, 1vw)),calc(16 * var(--cf9k, 1) * 1px));opacity:0;transform:translateX(12px);transition:opacity .5s ease calc(.4s + var(--i) * .22s),transform .6s ease calc(.4s + var(--i) * .22s)}
.cf9-gw.on p{opacity:1;transform:none}
.cf9-gw p i{font-style:normal;font-weight:800;color:#FF6A3D}.cf9-gw p span{font-weight:700;color:#0B0D17}.cf9-gw p em{font-style:normal;color:#4A5068}.cf9-gw p small{color:#8A90A6;text-align:right}
.cf9-gw u{display:block;text-decoration:none;margin-top:.6em;font:500 clamp(calc(9 * var(--cf9k, 1) * 1px),calc(.8 * var(--cf9vw, 1vw)),calc(12 * var(--cf9k, 1) * 1px))/1 ui-monospace,"SF Mono",Menlo,monospace;color:#8A90A6}
/* p352: the human edge carries three lines: the four human things, why (a finite life bearing irreversible choices), then the verdict */
.cf9[data-viz="jagged"] .p-sub{top:68.5%}.cf9[data-viz="jagged"] .p-sub2{top:74%;font-size:clamp(calc(12 * var(--cf9k, 1) * 1px),calc(1.45 * var(--cf9vw, 1vw)),calc(27 * var(--cf9k, 1) * 1px));color:var(--vi);font-weight:800}.cf9[data-viz="jagged"] .p-big{top:80.5%}
/* p356: no underlines anywhere in the film - captions arrive as live type: a typewriter wipe, then the ink settles from the accent colour */
.cf9-k .p-sub,.cf9-k .p-sub2,.cf9-k .p-sub3{background-image:none!important;text-decoration:none}
.cf9-k .p-sub.on,.cf9-k .p-sub2.on,.cf9-k .p-sub3.on{animation:hn356type 1.1s steps(28,end) both,hn356ink 2.2s cubic-bezier(.16,1,.3,1) both}
[dir="rtl"] .cf9-k .p-sub.on,[dir="rtl"] .cf9-k .p-sub2.on,[dir="rtl"] .cf9-k .p-sub3.on{animation-name:hn356typeR,hn356ink}
@keyframes hn356type{from{clip-path:inset(-25% 100% -25% 0)}to{clip-path:inset(-25% 0 -25% 0)}}
@keyframes hn356typeR{from{clip-path:inset(-25% 0 -25% 100%)}to{clip-path:inset(-25% 0 -25% 0)}}
@keyframes hn356ink{0%{color:var(--acc);letter-spacing:.06em}55%{letter-spacing:0}}
@media (prefers-reduced-motion:reduce){.cf9-k .p-sub.on,.cf9-k .p-sub2.on,.cf9-k .p-sub3.on{animation:none}}
/* p359: the finale is the HyperNexus mark assembling itself on the 2-D canvas - the particle galaxy steps back, and the end card keeps its words */
.cf9[data-viz="finale"] canvas.cf9-gl{opacity:0!important;transition:opacity 1.4s ease}
.cf9-end img{display:none}
/* p360: the reverence sub-line sits in the gap between the heading and the cards */
.cf9[data-viz="revere"] .p-sub{top:23.6%;font-size:clamp(calc(11 * var(--cf9k, 1) * 1px),calc(1.25 * var(--cf9vw, 1vw)),calc(24 * var(--cf9k, 1) * 1px))}
/* p363: the abundance page - the subtitle sits under the heading, clear of the road and the four voices */
.cf9[data-viz="cost"] .p-sub{top:24.5%;left:5.5%;font-size:clamp(calc(13 * var(--cf9k, 1) * 1px),calc(1.7 * var(--cf9vw, 1vw)),calc(32 * var(--cf9k, 1) * 1px));color:#5B5BFF}
/* p366: while the narration loads, the cover stays on top and says so - real progress on the ring, a pulsing status under the button */
.cf9-cover.cx.loading .cx-play{cursor:progress}
.cf9-cover.cx.loading .cx-play em{display:flex;align-items:center;gap:.55em;color:#fff;font-size:clamp(calc(12 * var(--cf9k, 1) * 1px),calc(1.05 * var(--cf9vw, 1vw)),calc(16 * var(--cf9k, 1) * 1px))}
.cf9-cover.cx.loading .cx-lt{animation:cxLoad 1.4s ease-in-out infinite}
.cf9-cover.cx.loading .cx-pc{font:700 .92em/1 ui-monospace,"SF Mono",Menlo,monospace;color:#7EF0DC;min-width:3ch;text-align:right}
@keyframes cxLoad{50%{opacity:.5}}
@media (prefers-reduced-motion:reduce){.cf9-cover.cx.loading .cx-lt{animation:none}}

/* p369: viewers' voices - player button, end-of-film invitation, the private feedback form, the "viewers say" wall, the footer entry */
.cf9-lis{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:0;background:#0B0D17;color:#fff;font:700 15px/1 inherit;cursor:pointer;transition:transform .2s,background .2s}
.cf9-lis:hover{transform:translateY(-1px);background:#24265E}.cf9-lis:focus-visible{outline:3px solid #8B7BFF;outline-offset:2px}
.cf9-lis svg{width:18px;height:18px;flex:none}
html[data-theme="dark"] .cf9-lis{background:#fff;color:#0B0D17}
@media (max-width:720px){.cf9-lis span{display:none}.cf9-lis{padding:10px 12px}}
.cf9-inv{position:absolute;left:4%;bottom:9%;z-index:30;max-width:min(440px,46%);padding:18px 20px 16px;border-radius:18px;background:rgba(255,255,255,.96);box-shadow:0 18px 50px rgba(36,38,94,.22);color:#0B0D17;opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .5s,transform .5s}
.cf9-inv.on{opacity:1;transform:none;pointer-events:auto}
.cf9-inv b{display:block;font:800 clamp(calc(15 * var(--cf9k, 1) * 1px),calc(1.5 * var(--cf9vw, 1vw)),calc(22 * var(--cf9k, 1) * 1px))/1.3 inherit;margin:0 26px 4px 0}.cf9-inv span{display:block;font-size:clamp(calc(12 * var(--cf9k, 1) * 1px),calc(1 * var(--cf9vw, 1vw)),calc(15 * var(--cf9k, 1) * 1px));color:#4A5068;margin-bottom:12px}
.cf9-inv div{display:flex;flex-wrap:wrap;gap:8px}
.cf9-inv div button{border:1.5px solid #D9D6EE;background:#fff;color:#24265E;border-radius:999px;padding:7px 13px;font:700 clamp(calc(12 * var(--cf9k, 1) * 1px),calc(.95 * var(--cf9vw, 1vw)),calc(14 * var(--cf9k, 1) * 1px))/1 inherit;cursor:pointer;transition:all .2s}
.cf9-inv div button:hover{background:#5B5BFF;border-color:#5B5BFF;color:#fff}
.cf9-inv-x{position:absolute;top:8px;right:10px;border:0;background:none;font-size:20px;line-height:1;color:#8A90A6;cursor:pointer;padding:4px 6px}
html.hnl-lock{overflow:hidden}
.hnl-ov{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;padding:16px;background:rgba(11,13,23,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.hnl-ov[hidden]{display:none}
.hnl-card{position:relative;width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#fff;color:#0B0D17;border-radius:22px;padding:26px 26px 22px;box-shadow:0 30px 80px rgba(11,13,23,.35);font:15px/1.55 system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;animation:hnlIn .35s ease}
@keyframes hnlIn{from{opacity:0;transform:translateY(12px) scale(.98)}}
.hnl-card h3{margin:0 0 4px;font-size:22px;letter-spacing:.01em}.hnl-sub{margin:0 0 16px;color:#4A5068}
.hnl-x{position:absolute;top:12px;right:14px;border:0;background:#F1F0FA;width:34px;height:34px;border-radius:50%;font-size:20px;line-height:1;color:#4A5068;cursor:pointer}
.hnl-kinds{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.hnl-kinds button{border:1.5px solid #D9D6EE;background:#fff;color:#24265E;border-radius:999px;padding:7px 14px;font:700 14px/1 inherit;cursor:pointer;transition:all .2s}
.hnl-kinds button.on{background:#5B5BFF;border-color:#5B5BFF;color:#fff;box-shadow:0 6px 16px rgba(91,91,255,.3)}
.hnl-f textarea,.hnl-f input[name=nm],.hnl-f input[name=ct]{width:100%;box-sizing:border-box;border:1.5px solid #E1DFF0;border-radius:14px;padding:11px 13px;font:15px/1.5 inherit;color:#0B0D17;background:#FBFAFF;transition:border-color .2s,box-shadow .2s}
.hnl-f textarea{resize:vertical;min-height:120px}
.hnl-f textarea:focus,.hnl-f input:focus{outline:0;border-color:#5B5BFF;box-shadow:0 0 0 4px rgba(91,91,255,.14);background:#fff}
.hnl-cnt{text-align:right;font-size:12px;color:#8A90A6;margin:4px 2px 10px}
.hnl-row{display:grid;grid-template-columns:1fr 1.4fr;gap:10px}
.hnl-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.hnl-pub{display:flex;gap:9px;align-items:flex-start;margin:14px 2px 6px;font-size:13.5px;color:#24265E;cursor:pointer}.hnl-pub input{margin-top:3px;accent-color:#5B5BFF;flex:none}
.hnl-pri{font-size:12px;color:#8A90A6;margin:6px 2px 16px}.hnl-pri a{color:#5B5BFF}
.hnl-act{display:flex;align-items:center;gap:14px}
.hnl-send{border:0;border-radius:999px;padding:12px 28px;font:800 15px/1 inherit;color:#fff;background:linear-gradient(100deg,#5B5BFF,#8B5BFF);cursor:pointer;box-shadow:0 10px 24px rgba(91,91,255,.32)}
.hnl-send:disabled{opacity:.55;cursor:progress}.hnl-st{font-size:13px;color:#C2410C}
.hnl-ok{text-align:center;padding:18px 6px 6px}.hnl-ok[hidden]{display:none}
.hnl-okic{width:58px;height:58px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;font-size:30px;color:#fff;background:linear-gradient(135deg,#12B886,#5B5BFF);animation:hnlIn .45s ease}
.hnl-ok p{color:#4A5068;margin:4px 0 18px}.hnl-done{border:0;border-radius:999px;padding:10px 24px;font:700 14px/1 inherit;background:#F1F0FA;color:#24265E;cursor:pointer}
.hnl-wall{max-width:1200px;margin:28px auto 8px;padding:0 4px}
.hnl-wall h3{font-size:clamp(calc(18 * var(--cf9k, 1) * 1px),calc(1.8 * var(--cf9vw, 1vw)),calc(26 * var(--cf9k, 1) * 1px));margin:0 0 14px}
.hnl-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.hnl-cards figure{margin:0;padding:18px 20px;border-radius:18px;background:#fff;box-shadow:0 6px 22px rgba(36,38,94,.08);border-left:4px solid #5B5BFF}
.hnl-cards figure:nth-child(3n+2){border-left-color:#12B886}.hnl-cards figure:nth-child(3n+3){border-left-color:#FF6A3D}
.hnl-cards blockquote{margin:0 0 10px;font-size:15.5px;line-height:1.6;white-space:pre-wrap}
.hnl-cards figcaption{font-size:13px;color:#4A5068}.hnl-cards figcaption span{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:99px;background:#F1F0FA;color:#5B5BFF;font-size:11.5px}
.hnl-wall-b{margin-top:14px;border:0;border-radius:999px;padding:10px 20px;font:700 14px/1 inherit;background:#0B0D17;color:#fff;cursor:pointer}
.hnl-foot{display:inline-flex;align-items:center;gap:6px;margin:10px 0;padding:8px 14px;border-radius:999px;background:rgba(91,91,255,.1);color:#5B5BFF!important;font-weight:700;text-decoration:none!important}
.hnl-foot::before{content:"";width:8px;height:8px;border-radius:50%;background:#12B886;box-shadow:0 0 0 4px rgba(18,184,134,.18)}
html[data-theme="dark"] .hnl-card,html[data-theme="dark"] .cf9-inv{background:#17182B;color:#EDEDF7}
html[data-theme="dark"] .hnl-sub,html[data-theme="dark"] .hnl-ok p,html[data-theme="dark"] .cf9-inv span{color:#B9BCD3}
html[data-theme="dark"] .hnl-f textarea,html[data-theme="dark"] .hnl-f input[name=nm],html[data-theme="dark"] .hnl-f input[name=ct]{background:#0F1020;border-color:#2E3052;color:#EDEDF7}
html[data-theme="dark"] .hnl-kinds button,html[data-theme="dark"] .cf9-inv div button{background:#0F1020;border-color:#2E3052;color:#D9D6FF}
html[data-theme="dark"] .hnl-pub{color:#D9D6FF}html[data-theme="dark"] .hnl-x,html[data-theme="dark"] .hnl-done{background:#24264A;color:#D9D6FF}
html[data-theme="dark"] .hnl-cards figure{background:#17182B;box-shadow:none}html[data-theme="dark"] .hnl-cards blockquote{color:#EDEDF7}html[data-theme="dark"] .hnl-cards figcaption{color:#B9BCD3}
html[data-theme="dark"] .hnl-wall-b{background:#fff;color:#0B0D17}
@media (max-width:560px){.hnl-row{grid-template-columns:1fr}.hnl-card{padding:22px 18px 18px;border-radius:18px}.cf9-inv{max-width:none;right:4%;bottom:12%}}
@media (prefers-reduced-motion:reduce){.hnl-card,.hnl-okic{animation:none}.cf9-inv{transition:none}}
/* p370: while the narration loads, the cover keeps its words (they fly out only when the film is ready); only the button turns into the progress ring */
.cf9-cover.cx.loading .cx-play svg{animation:cxSpin 1s linear infinite}
.cf9-cover.cx.loading .cx-play i{opacity:.35}
.cf9-cover.cx.loading .cx-ring{animation-duration:6s!important}
@media (prefers-reduced-motion:reduce){.cf9-cover.cx.loading .cx-play svg{animation:none}}
/* p372: a film that behaves like a video on small screens (sizes follow the stage), and a full screen that works on every phone */
html.cf9-pfs-lock,html.cf9-pfs-lock body{overflow:hidden!important;overscroll-behavior:none}
.cf9.cf9-pfs .cf9-stage{border-radius:0;box-shadow:none;margin:0}
.cf9.cf9-pfs .cf9-ctl{opacity:1;margin:0;flex:none;z-index:6;box-sizing:border-box;padding:6px 8px;border-radius:999px;background:rgba(11,13,23,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:opacity .35s}
.cf9.cf9-pfs.cf9-idle .cf9-ctl{opacity:0;pointer-events:none}
.cf9.cf9-pfs.cf9-idle{cursor:none}
.cf9.cf9-pfs .cf9-fs{background:#fff;color:#0B0D17}