/* Two atmospheres in the same glass. The original reading realm is untouched. */
.experience{--whisper-rgb:242,156,205}
.experience[data-whisper-theme=path]{--whisper-rgb:241,202,135}
.experience[data-whisper-theme=self]{--whisper-rgb:191,226,244}
.whisper-depth{position:absolute;inset:0;border-radius:50%;overflow:hidden;pointer-events:none;z-index:2;opacity:0;transition:opacity 1s ease;background:radial-gradient(ellipse at 48% 72%,rgba(var(--whisper-rgb),.25),#173c7d77 42%,#09112d88 78%);mix-blend-mode:screen}
.experience[data-realm=silent] .whisper-depth{opacity:1}
.mist-emblem,.orb-cloud,.orb-core{transition:opacity 1s,filter 1s}
.experience[data-realm=silent] .mist-emblem{opacity:.28;filter:blur(1.2px)}
.experience[data-realm=silent] .orb-cloud{opacity:.3}
.experience[data-realm=silent] .orb-core{opacity:.45}
.experience[data-realm=silent] .orb{background:radial-gradient(circle at 29% 23%,#f7e9ff94,transparent 33%),radial-gradient(circle at 52% 68%,#d5b9ffa8,#7661b67e 34%,#161735 73%,#090a20);box-shadow:inset -17px -19px 36px #080514c7,inset 6px 7px 20px #f4e7ff65,0 0 82px rgba(var(--whisper-rgb),.34)}
.experience[data-realm=silent] .whisper-depth{background:radial-gradient(ellipse at 50% 58%,rgba(var(--whisper-rgb),.42),#2a277b70 45%,#090d328a 78%)}
.whisper-wisp{position:absolute;left:12%;top:39%;width:77%;height:35%;border-radius:46% 54% 63% 37%;border-top:2px solid rgba(var(--whisper-rgb),.8);border-bottom:7px solid rgba(var(--whisper-rgb),.15);box-shadow:0 -5px 13px rgba(var(--whisper-rgb),.2),inset 0 8px 13px #a8cfff22;filter:blur(2px);transform:rotate(-28deg);animation:whisper-drift 8s ease-in-out infinite alternate}
.whisper-wisp:nth-child(2){left:23%;top:20%;width:55%;height:64%;transform:rotate(38deg);animation-delay:-3s;animation-duration:10s;opacity:.65}
.whisper-wisp:nth-child(3){left:9%;top:48%;height:20%;transform:rotate(14deg);animation-delay:-6s;animation-duration:7s;filter:blur(4px)}
.whisper-ripple{position:absolute;inset:23%;border:1px solid rgba(var(--whisper-rgb),.35);border-radius:50%;box-shadow:0 0 10px rgba(var(--whisper-rgb),.12);animation:whisper-ripple 6s ease-out infinite;transform:scale(.4);opacity:0}
.whisper-ripple:nth-child(5){animation-delay:-3s}
.whisper-seed{position:absolute;left:42%;top:44%;width:18%;height:18%;border-radius:50%;background:radial-gradient(circle,#eaf6ff99,rgba(var(--whisper-rgb),.5) 22%,transparent 70%);filter:blur(5px);animation:whisper-pulse 4s ease-in-out infinite}
.whisper-depth *{animation-play-state:paused}
.experience[data-realm=silent][data-state=focused] .whisper-depth *{animation-play-state:running}
.experience[data-realm=silent] .whisper-gather .whisper-depth{animation:whisper-converge 2.8s ease-in-out both;transform-origin:var(--touch-x,50%) var(--touch-y,50%)}
.experience[data-realm=silent] .whisper-gather .whisper-seed{animation:whisper-flare 2.8s ease-in-out both}
@keyframes whisper-drift{from{transform:translate(-4%,4%) rotate(-23deg) scale(.87)}to{transform:translate(7%,-7%) rotate(28deg) scale(1.08)}}
@keyframes whisper-ripple{0%{transform:scale(.35);opacity:0}25%{opacity:.5}100%{transform:scale(1.85);opacity:0}}
@keyframes whisper-pulse{0%,100%{opacity:.45;transform:scale(.8)}50%{opacity:.9;transform:scale(1.3)}}
@keyframes whisper-converge{0%{transform:scale(1);filter:blur(0)}40%{transform:scale(.18);filter:blur(3px)}65%{transform:scale(.24);filter:blur(1px)}100%{transform:scale(1);filter:blur(0)}}
@keyframes whisper-flare{0%,45%{opacity:.5}72%{opacity:1;transform:scale(4)}100%{opacity:.6;transform:scale(1)}}
/* A descending edge reveals intact Arabic glyphs, never a letter-by-letter reflow. */
.result{animation:none}
.paper-forming{isolation:isolate}
.ember-edge{position:absolute;top:0;left:0;right:0;height:1px;z-index:8;pointer-events:none;contain:layout style}
.ember-ridge{position:absolute;left:0;top:-40px;width:100%;height:80px;overflow:visible}
.ember-ridge polyline{fill:none;stroke-linejoin:round;stroke-linecap:round}
.ember-char{stroke:#130909;stroke-width:13;filter:blur(1px)}
.ember-glow{stroke:#f36122;stroke-width:15;filter:blur(7px);opacity:.9}
.ember-hot{stroke:#ff9b37;stroke-width:5;filter:drop-shadow(0 -3px 4px #ff7526)}
.ember-core{stroke:#fff0bd;stroke-width:1.7;opacity:.95}
.ember-traveller{transform-box:view-box;transform-origin:0 0}
.ember-pocket{fill:#ff973b;opacity:.8;filter:blur(5px)}
.ember-flame{fill:#ffd48c;filter:drop-shadow(0 -3px 3px #ff853b);transform-box:fill-box;transform-origin:center bottom;animation:ember-lick 1.6s ease-in-out infinite alternate}
.ember-smoke{position:absolute;left:-2%;width:104%;height:110px;bottom:4px;opacity:.8;background:radial-gradient(ellipse at 20% 90%,#cd987c88,transparent 42%),radial-gradient(ellipse at 65% 95%,#bc9cb58a,transparent 45%),radial-gradient(ellipse at 85% 60%,#967aab88,transparent 30%);filter:blur(9px);animation:ember-billow 2.1s ease-in-out infinite alternate}
.ember-sparks{position:absolute;inset:-42px 0 0;height:42px;opacity:.8;background:radial-gradient(1px 2px at 12% 80%,#ffdb98 95%,transparent),radial-gradient(2px 2px at 32% 45%,#fff0b7 95%,transparent),radial-gradient(1px 1px at 57% 65%,#ffd08f 95%,transparent),radial-gradient(1px 2px at 73% 30%,#f9b875 95%,transparent),radial-gradient(1px 1px at 89% 72%,#ffe5a8 95%,transparent);animation:ember-lift 1.1s ease-out infinite}
.paper-forming .section-title,.paper-forming .result-body{animation:none!important}
.ink-forming{animation:none!important;will-change:clip-path;text-rendering:optimizeLegibility}
@keyframes ember-billow{from{transform:translate(-2%,3px) scaleY(.75);opacity:.4}to{transform:translate(2%,-8px) scaleY(1.1);opacity:.75}}
@keyframes ember-lift{from{transform:translateY(10px);opacity:.8}to{transform:translateY(-15px);opacity:0}}
@keyframes ember-lick{from{transform:scaleY(.65) skewX(-8deg);opacity:.55}to{transform:scaleY(1.15) skewX(10deg);opacity:1}}
.still .ember-edge{display:none}.still .paper-forming,.still .ink-forming{clip-path:none!important;text-shadow:none!important}
.still .whisper-depth *{animation:none!important}.still .whisper-depth{transform:none!important}
@media(prefers-reduced-motion:reduce){.ember-edge{display:none}.paper-forming,.ink-forming{clip-path:none!important;text-shadow:none!important}.whisper-depth,.whisper-depth *{animation:none!important;transition:none!important}.whisper-depth{transform:none!important}}