.perception-chapter{color:#f4f4f4;--cp-reveal:56%;background:#080c12;min-height:560svh}.perception-chapter .cp-stage{isolation:isolate;height:100svh;position:sticky;top:0;overflow:visible}.perception-chapter .cp-backdrop{z-index:0;pointer-events:none;position:absolute;inset:0}.perception-chapter .cp-backdrop>.fluid-gradient{opacity:.48}.perception-chapter .color-perception-filters{width:0;height:0;position:absolute;overflow:hidden}.perception-chapter .cp-topline{letter-spacing:.09em;color:#b8cbca;z-index:2;justify-content:space-between;gap:24px;font-size:10px;display:flex;position:absolute;top:100px;left:5vw;right:5vw}.perception-chapter .cp-panel{z-index:1;min-height:0;position:absolute;inset:150px 5vw 65px}.perception-chapter .cp-panel--intro{grid-template-columns:1.05fr 1fr;align-content:center;align-items:start;gap:7vw;display:grid}.perception-chapter .cp-intro-copy{min-width:0;position:relative}.perception-chapter .cp-intro-copy>.cp-label{margin:0 0 24px;position:absolute;bottom:100%;left:0}.perception-chapter .cp-label{letter-spacing:.09em;color:#b8cbca;margin:0 0 24px;font-size:10px}.perception-chapter h2{letter-spacing:-.055em;margin:0;font-weight:500;line-height:1.05}.perception-chapter .cp-intro-copy,.perception-chapter .cp-signals-heading,.perception-chapter .cp-closing{text-shadow:0 1px 10px #080c12b8}.perception-chapter .cp-intro-title{font-size:clamp(36px,4.1vw,76px)}.perception-chapter .cp-intro-title>span{display:block}.perception-chapter i{font-family:var(--font-editorial);font-weight:200}.perception-chapter .cp-intro-body{max-width:47ch;margin-top:28px}.perception-chapter .cp-intro-body strong{margin-bottom:14px;font-size:18px;font-weight:500;display:block}.perception-chapter .cp-intro-body p{color:#ddebeb;margin:0 0 14px;font-size:14px;line-height:1.6}.perception-chapter .cp-comparison{align-self:start;width:100%;min-width:0}.perception-chapter .cp-comparison .color-perception-visual{isolation:isolate;background:#080c12;border:1px solid #b8cbca40;border-radius:18px;flex:none;width:100%;height:min(38vw,47svh);transform:none}.perception-chapter .color-perception-object{background:#080c1280}.perception-chapter .color-perception-normal-layer .color-perception-object{background:#151c20}.perception-chapter .color-perception-object img{object-fit:contain;width:82%;height:82%}.perception-chapter .color-perception-chip{aspect-ratio:auto;z-index:4;clip-path:ellipse(50% 50%);opacity:1;mix-blend-mode:normal;filter:drop-shadow(0 10px 14px #080c124d);border-radius:50%;width:31%;height:18%}.perception-chapter .color-perception-chip--blue{background:#4f7cff;top:13%;left:11%;transform:rotate(-18deg)}.perception-chapter .color-perception-chip--yellow{background:#f2c94c;top:27%;right:9%;transform:rotate(22deg)}.perception-chapter .color-perception-chip--orange{background:#ff6b4a;bottom:13%;left:20%;transform:rotate(11deg)}.perception-chapter .color-perception-object--mine>img,.perception-chapter .color-perception-object--mine .color-perception-chip{filter:drop-shadow(0 10px 14px #080c124d)}.perception-chapter .color-perception-object--mine>img.color-perception-cvd-image,.perception-chapter .color-perception-object--mine>canvas.color-perception-cvd-image{z-index:3;object-fit:contain;width:82%;height:82%;display:block;position:relative}.perception-chapter .color-perception-range-control{color:#ddebeb;margin:14px 0 0;font-size:9px;position:relative}.perception-chapter .cp-comparison-note{color:#b8cbca;margin-top:14px;font-size:11px;line-height:1.5}.perception-chapter .cp-panel--signals{flex-direction:column;justify-content:center;gap:30px;display:flex}.perception-chapter .cp-signals-heading{grid-template-columns:1.6fr 1fr;align-items:start;gap:6vw;display:grid}.perception-chapter .cp-signals-heading h2{font-size:clamp(30px,3.5vw,62px)}.perception-chapter .cp-signals-heading .cp-label{margin-bottom:16px}.perception-chapter .cp-signals-explanation{color:#f4f4f4;text-wrap:balance;max-width:40ch;padding-top:28px;font-size:12px;line-height:1.5}.perception-chapter .cp-signals-explanation p+p{margin-top:10px}.perception-chapter .cp-signals-grid{perspective:1200px;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;display:grid}.perception-chapter .cp-signal{color:#080c12;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#f4f4f4e8;border:1px solid #ffffffb8;border-radius:20px;min-width:0;padding:14px;transition:border-color .3s,background .3s,transform .45s cubic-bezier(.2,.8,.2,1);box-shadow:0 22px 50px #080c1240}.perception-chapter[data-layout=staged] .cp-signal{opacity:0;visibility:hidden;transform:translateY(90px)rotateX(-10deg)}.perception-chapter .cp-signal.is-active,.perception-chapter .cp-signal:hover{background:#fff;border-color:#fff;transform:translateY(-10px)rotate(-1deg)}.perception-chapter .cp-signal button{width:100%;color:inherit;cursor:pointer;text-align:left;background:0 0;border:0;justify-content:space-between;align-items:center;gap:12px;padding:0;display:flex}.perception-chapter .cp-signal button:focus-visible{outline-offset:6px;outline:1px solid #ddebeb}.perception-chapter .cp-signal button span{color:#323637;font-size:10px}.perception-chapter .cp-signal button strong{letter-spacing:-.035em;font-size:clamp(14px,1.5vw,23px);font-weight:500}.perception-chapter .cp-signal :is(img,canvas){object-fit:contain;width:100%;height:clamp(100px,17svh,180px);margin:15px 0;display:block;transform:none}.perception-chapter .cp-signal>p{color:#323637;margin:0;font-size:12px;line-height:1.5}.perception-chapter .cp-panel--final{text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex}.perception-chapter[data-layout=staged] .cp-panel--final{inset:0 5vw}.perception-chapter .cp-closing{letter-spacing:-.05em;max-width:24ch;margin:0;font-size:clamp(32px,4.4vw,78px);line-height:1.14}.perception-chapter .cp-closing>span{display:block}.perception-chapter .cp-closing>span+span{margin-top:0}.perception-chapter .cp-closing{max-width:none;font-size:clamp(18px,3.35vw,64px);line-height:1.35}.perception-chapter .cp-closing>span{white-space:nowrap}@media (max-width:800px){.perception-chapter .cp-closing{font-size:3.35vw}}.perception-chapter .cp-signals-explanation{background:#080c12c9;border-radius:8px;padding:18px}.perception-chapter .cp-panel--signals{gap:48px}.perception-chapter .cp-intro-body{background:#080c12bf;border-radius:8px;padding:18px}.perception-chapter .color-perception-object{filter:none;width:100%;height:100%}.perception-chapter .color-perception-chip{max-width:none;right:auto}.perception-chapter .color-perception-chip--yellow{left:60%;right:auto}.perception-chapter .color-perception-object--mine>canvas{filter:drop-shadow(0 10px 14px #080c124d)}.perception-chapter .cp-comparison .color-perception-visual,.perception-chapter .cp-comparison .color-perception-object{overflow:visible}.perception-chapter .cp-comparison .color-perception-visual{border-radius:18px;overflow:hidden}.perception-chapter[data-layout=flow]{min-height:0}.perception-chapter[data-layout=flow] .cp-stage{height:auto;padding:120px 6vw 100px;position:relative}.perception-chapter[data-layout=flow] .cp-backdrop{height:100svh;margin-bottom:-100svh;position:sticky;top:0}.perception-chapter[data-layout=flow] .cp-topline{margin-bottom:50px;font-size:9px;position:relative;inset:auto}.perception-chapter[data-layout=flow] .cp-panel{position:relative;inset:auto;opacity:1!important;visibility:visible!important;transform:none!important}.perception-chapter[data-layout=flow] .cp-panel--intro{grid-template-columns:1fr;gap:35px}.perception-chapter[data-layout=flow] .cp-intro-copy>.cp-label{margin:0 0 24px;position:static}.perception-chapter[data-layout=flow] .cp-intro-title{font-size:clamp(38px,8vw,66px)}.perception-chapter[data-layout=flow] .cp-comparison .color-perception-visual{aspect-ratio:1.15;height:auto}.perception-chapter[data-layout=flow] .cp-panel--signals{margin-top:100px}.perception-chapter[data-layout=flow] .cp-signals-heading{grid-template-columns:1fr;gap:24px}.perception-chapter[data-layout=flow] .cp-signals-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.perception-chapter[data-layout=flow] .cp-panel--final{margin-top:100px}@media (max-height:700px) and (min-width:801px){.perception-chapter .cp-topline{top:85px}.perception-chapter .cp-panel{inset:120px 5vw 40px}.perception-chapter .cp-intro-body{margin-top:20px}.perception-chapter .cp-intro-body p{font-size:13px;line-height:1.45}.perception-chapter .cp-label{margin-bottom:16px}.perception-chapter .cp-panel--signals{gap:20px}}@media (max-width:800px){.perception-chapter[data-layout=flow]{--gradient-wave-overlap:72px;background:0 0;min-height:0;overflow:visible}.perception-chapter[data-layout=flow] .cp-stage{isolation:isolate;min-height:0;padding:0 6vw 132px;position:relative}.perception-chapter[data-layout=flow] .cp-backdrop{z-index:0;width:calc(100% + 12vw);height:100svh;margin:0 0 -100svh -6vw;position:sticky;top:0;left:0;overflow:visible}.perception-chapter[data-layout=flow] .cp-backdrop>.fluid-gradient{opacity:.62;position:absolute;top:calc(-1 * var(--gradient-wave-overlap))!important;right:0!important;bottom:calc(-1 * var(--gradient-wave-overlap))!important;width:auto!important;height:auto!important;left:0!important}.perception-chapter[data-layout=flow] .cp-topline,.perception-chapter[data-layout=flow] .cp-panel{z-index:1}.perception-chapter[data-layout=flow] .cp-topline{margin-bottom:52px;padding-top:104px;position:relative;inset:auto}.perception-chapter[data-layout=flow] .cp-panel--intro{gap:34px}.perception-chapter[data-layout=flow] .cp-comparison .color-perception-visual{aspect-ratio:1/1.08;border-radius:16px;width:100%}.perception-chapter[data-layout=flow] .cp-panel--signals{gap:36px;margin-top:108px}.perception-chapter[data-layout=flow] .cp-panel--final{margin-top:108px}}