:root{--ink:#f6f1e8;--muted:#aaa7a5;--night:#07070a;--red:#a40d17;--red-bright:#db2630;--blue:#75c9ff;--line:rgba(255,255,255,.13);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--night);font-synthesis:none}
*{box-sizing:border-box}*[hidden]{display:none!important}html{background:#07070a;scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100dvh;overflow-x:hidden;background:radial-gradient(ellipse at 50% 33%,#201114 0,#0b090c 38%,#050507 76%);letter-spacing:.01em}.ambient{position:fixed;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 15%,rgba(255,255,255,.018) 48%,transparent 70%),radial-gradient(circle at 50% -10%,rgba(212,38,45,.12),transparent 42%);filter:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3C/svg%3E#n");opacity:.08}.app-shell{position:relative;display:grid;place-items:center;width:min(100%,860px);margin:auto;padding:max(34px,env(safe-area-inset-top)) 20px 30px}.brand{text-align:center;margin-bottom:4px}.eyebrow{margin:0 0 8px;font-size:.68rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#b9a9a8}.brand h1{margin:0;font-family:Impact,"Arial Narrow",sans-serif;font-size:clamp(2rem,6vw,3.8rem);font-weight:900;line-height:.92;letter-spacing:.035em}.brand h1 span{color:#f05359}.experience{width:100%;display:flex;flex-direction:column;align-items:center}.orb-stage{position:relative;width:min(91vw,540px);aspect-ratio:1;margin:4px auto -4px;display:grid;place-items:center}.orb-shadow{position:absolute;width:72%;height:13%;bottom:5%;border-radius:50%;background:#000;filter:blur(18px);opacity:.85}.orb{position:relative;width:88%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 34% 22%,#ff6d6c 0 2%,#e33b42 7%,#bc1822 22%,#8e0812 53%,#5a050b 76%,#270205 100%);box-shadow:inset -32px -38px 65px rgba(0,0,0,.62),inset 12px 14px 26px rgba(255,151,143,.18),0 30px 60px rgba(0,0,0,.65),0 3px 0 #470306;transform:translateZ(0);transition:transform .5s cubic-bezier(.2,.8,.2,1),filter .5s}.orb::before{content:"";position:absolute;inset:2.2%;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.orb-gloss{position:absolute;inset:5% 11% 47% 13%;border-radius:50%;transform:rotate(-20deg);background:radial-gradient(ellipse at 44% 30%,rgba(255,255,255,.38),rgba(255,255,255,.08) 20%,transparent 59%);filter:blur(2px)}.window-rim{position:relative;width:64%;aspect-ratio:1;border-radius:50%;padding:4.2%;background:radial-gradient(circle at 45% 40%,#711017 0 54%,#3d0509 66%,#bc3034 73%,#43070b 80%);box-shadow:0 0 0 2px rgba(32,0,2,.65),0 10px 23px rgba(0,0,0,.55),inset 0 3px 7px rgba(255,150,150,.2)}.answer-window{position:relative;width:100%;height:100%;overflow:hidden;border-radius:50%;isolation:isolate;background:radial-gradient(circle at 50% 36%,#11355b,#061426 49%,#020712 76%,#000 100%);box-shadow:inset 0 0 35px #000,inset 0 8px 18px rgba(55,134,190,.25),0 0 0 2px #250205}.liquid{position:absolute;inset:-12%;border-radius:43%;background:radial-gradient(circle at 70% 23%,rgba(49,146,211,.23),transparent 23%),linear-gradient(145deg,rgba(8,51,93,.7),rgba(0,5,15,.84));filter:blur(7px)}.liquid-back{animation:drift 11s ease-in-out infinite}.liquid-front{z-index:5;inset:56% -15% -20%;background:linear-gradient(180deg,rgba(20,87,135,.12),rgba(0,8,20,.63));filter:blur(9px);animation:tide 8s ease-in-out infinite}.particles{position:absolute;inset:0;z-index:2}.particles i{position:absolute;width:3px;height:3px;border-radius:50%;background:#9be0ff;box-shadow:0 0 8px #6ac7ff;opacity:.34;animation:rise 9s linear infinite}.particles i:nth-child(1){left:22%;top:73%;animation-delay:-3s}.particles i:nth-child(2){left:71%;top:64%;animation-delay:-7s}.particles i:nth-child(3){left:58%;top:82%;animation-delay:-1s}.particles i:nth-child(4){left:39%;top:66%;animation-delay:-5s}.particles i:nth-child(5){left:79%;top:78%;animation-delay:-8s}.answer-plate{position:absolute;z-index:3;left:10%;top:10%;width:80%;height:80%;display:grid;place-items:center;clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%);background:linear-gradient(145deg,#77c7ef,#153e67 12%,#081b38 50%,#1f5584 87%,#a1daf5);filter:drop-shadow(0 0 14px rgba(75,186,255,.32));opacity:0;transform:translateY(78%) rotate(-18deg) scale(.72);transition:none}.plate-inner{width:92%;height:92%;min-width:0;display:grid;place-items:center;padding:8%;clip-path:inherit;background:radial-gradient(circle at 38% 28%,rgba(78,157,213,.5),rgba(7,28,57,.94) 58%,#020c1b);box-shadow:inset 0 0 22px rgba(105,199,255,.2)}#answerText{width:100%;max-width:100%;overflow-wrap:normal;word-break:normal;text-align:center;text-wrap:balance;font-weight:900;font-size:clamp(.82rem,3vw,1.25rem);line-height:1.02;letter-spacing:.04em;text-transform:uppercase;text-shadow:0 1px 7px #000}.window-shine{position:absolute;z-index:7;inset:3%;border-radius:50%;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.19),transparent 24%,transparent 72%,rgba(48,134,190,.06));box-shadow:inset 0 0 22px rgba(102,194,244,.13)}.orb.thinking{animation:ponder .9s ease-in-out 2}.orb.revealing .answer-plate{animation:surface 2.35s cubic-bezier(.16,.77,.26,1) forwards}.orb.revealing .liquid{animation-duration:1.5s}.orb.answered .answer-plate{opacity:1;transform:translateY(0) rotate(0) scale(1)}.answer-plate.short #answerText{font-size:clamp(1.35rem,5.2vw,2.5rem)}.answer-plate.medium #answerText{font-size:clamp(.92rem,3vw,1.3rem)}.answer-plate.long #answerText{font-size:clamp(.66rem,2.2vw,.92rem);line-height:1.08}.answer-plate.micro #answerText{font-size:clamp(.52rem,1.7vw,.68rem);line-height:1.06;letter-spacing:.02em}.question-form{width:min(100%,520px);display:grid;gap:10px;position:relative}.input-wrap{position:relative}.question-form input{width:100%;height:58px;padding:0 70px 0 18px;border:1px solid var(--line);border-radius:16px;background:rgba(21,19,22,.84);box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 8px 30px rgba(0,0,0,.2);backdrop-filter:blur(12px);color:#fff;font:inherit;font-size:1rem;outline:none;transition:border-color .2s,box-shadow .2s}.question-form input::placeholder{color:#817d7e}.question-form input:focus{border-color:#e65259;box-shadow:0 0 0 4px rgba(217,42,51,.16)}#charCount{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:.68rem;color:#716f71}.form-message,.share-status{min-height:18px;margin:-3px 3px 0;text-align:center;color:#dba0a2;font-size:.77rem}.primary,.secondary{appearance:none;border:0;min-height:54px;border-radius:16px;color:#fff;font:inherit;font-size:.78rem;font-weight:850;letter-spacing:.12em;cursor:pointer;transition:transform .18s,filter .18s,background .18s}.primary{background:linear-gradient(#d92f37,#a30d16);box-shadow:0 10px 24px rgba(138,7,15,.34),inset 0 1px 0 rgba(255,255,255,.27);position:relative;overflow:hidden}.primary::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.17),transparent 67%);transform:translateX(-120%);transition:transform .5s}.primary:hover::after{transform:translateX(120%)}button:hover{filter:brightness(1.12)}button:active{transform:translateY(1px) scale(.992)}button:focus-visible,.text-button:focus-visible{outline:3px solid #8ed5ff;outline-offset:3px}.primary:disabled{cursor:wait;filter:saturate(.55);opacity:.8}.result-actions{width:min(100%,520px);display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:0}.secondary{border:1px solid var(--line);background:rgba(255,255,255,.055)}.secondary.share{border-color:rgba(118,200,248,.28);color:#bce6ff}.share-status{margin-top:9px;color:#91c8e6}footer{width:min(92%,720px);margin:15px auto 0;padding:20px 0 max(24px,env(safe-area-inset-bottom));border-top:1px solid rgba(255,255,255,.08);text-align:center;color:#6f6b6d;font-size:.68rem;line-height:1.55}footer p{margin:3px}.text-button{border:0;background:none;color:#aaa2a3;text-decoration:underline;text-underline-offset:3px;padding:8px;cursor:pointer;font:inherit}dialog{width:min(calc(100% - 32px),560px);border:1px solid rgba(255,255,255,.16);border-radius:22px;padding:32px;background:#111015;color:#eee;box-shadow:0 30px 100px #000}dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(8px)}dialog h2{font-size:1.75rem;letter-spacing:-.03em}dialog p{color:#b8b4b4;line-height:1.62}.dialog-close{position:absolute;right:14px;top:12px;border:0;background:none;color:#aaa;font-size:1.8rem;cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* The answer remains visibly submerged instead of becoming a flat screen. */
.answer-window::before{content:"";position:absolute;z-index:6;inset:-16%;pointer-events:none;border-radius:45%;background:radial-gradient(ellipse at 24% 29%,rgba(130,213,255,.13),transparent 26%),radial-gradient(ellipse at 77% 64%,rgba(39,142,208,.12),transparent 28%),linear-gradient(118deg,transparent 32%,rgba(133,210,255,.07) 47%,transparent 61%);mix-blend-mode:screen;filter:blur(5px);animation:caustic 9s ease-in-out infinite}.answer-plate{left:13%;top:13%;width:74%;height:74%;filter:drop-shadow(0 8px 13px rgba(0,0,0,.48)) drop-shadow(0 0 13px rgba(75,186,255,.3))}.plate-inner{padding:7%;background:radial-gradient(circle at 36% 25%,rgba(71,158,220,.58),rgba(7,35,67,.84) 52%,rgba(1,10,25,.91));box-shadow:inset 0 0 24px rgba(105,199,255,.22),inset 0 -18px 28px rgba(0,3,12,.28)}.particles{z-index:6;pointer-events:none;mix-blend-mode:screen}.particles i{width:4px;height:4px;opacity:.55;background:rgba(174,229,255,.75);box-shadow:inset 1px 1px 1px rgba(255,255,255,.8),0 0 9px rgba(106,199,255,.75)}.particles i:nth-child(2){width:2px;height:2px}.particles i:nth-child(3){width:5px;height:5px}.particles i:nth-child(5){width:3px;height:3px}.liquid-front{inset:51% -15% -20%;opacity:.86;background:radial-gradient(ellipse at 33% 8%,rgba(67,166,224,.18),transparent 26%),linear-gradient(180deg,rgba(19,89,141,.16),rgba(0,7,19,.72));box-shadow:0 -4px 16px rgba(79,174,225,.1)}.orb.answered .answer-plate{animation:settledFloat 7s ease-in-out infinite}
.answer-window{perspective:680px;perspective-origin:50% 43%}.answer-window::before{content:"";position:absolute;z-index:6;inset:-16%;pointer-events:none;border-radius:45%;background:radial-gradient(ellipse at 24% 29%,rgba(130,213,255,.13),transparent 26%),radial-gradient(ellipse at 77% 64%,rgba(39,142,208,.12),transparent 28%),linear-gradient(118deg,transparent 32%,rgba(133,210,255,.07) 47%,transparent 61%);mix-blend-mode:screen;filter:blur(5px);animation:caustic 9s ease-in-out infinite}.answer-window::after{content:"";position:absolute;z-index:6;inset:-4%;border-radius:50%;pointer-events:none;background:radial-gradient(circle,transparent 46%,rgba(1,18,38,.16) 60%,rgba(0,7,18,.62) 82%),linear-gradient(105deg,transparent 34%,rgba(111,195,239,.055) 48%,transparent 61%);filter:blur(3px);mix-blend-mode:screen}.answer-plate{left:13%;top:13%;width:74%;height:74%;transform-style:preserve-3d;backface-visibility:hidden;will-change:transform,filter,opacity;filter:drop-shadow(0 8px 13px rgba(0,0,0,.48)) drop-shadow(0 0 13px rgba(75,186,255,.3))}.answer-plate::before{content:"";position:absolute;inset:1%;z-index:-1;clip-path:inherit;background:linear-gradient(145deg,rgba(112,200,245,.5) 0 8%,rgba(8,30,59,.82) 18% 64%,rgba(1,8,20,.95) 79%);transform:translate3d(2.5%,4%, -12px);filter:brightness(.68)}.plate-inner{position:relative;z-index:1;padding:7%;background:radial-gradient(circle at 36% 25%,rgba(71,158,220,.56),rgba(7,35,67,.82) 52%,rgba(1,10,25,.89));box-shadow:inset 0 0 24px rgba(105,199,255,.22),inset 0 -18px 28px rgba(0,3,12,.28)}.particles{z-index:6;pointer-events:none;mix-blend-mode:screen}.particles i{width:4px;height:4px;opacity:.55;background:rgba(174,229,255,.75);box-shadow:inset 1px 1px 1px rgba(255,255,255,.8),0 0 9px rgba(106,199,255,.75)}.particles i:nth-child(2){width:2px;height:2px}.particles i:nth-child(3){width:5px;height:5px}.particles i:nth-child(5){width:3px;height:3px}.liquid-front{inset:48% -18% -22%;opacity:.82;background:radial-gradient(ellipse at 33% 8%,rgba(67,166,224,.16),transparent 27%),linear-gradient(180deg,rgba(19,89,141,.13),rgba(0,7,19,.58));box-shadow:0 -4px 18px rgba(79,174,225,.13);backdrop-filter:blur(.3px) saturate(1.04)}.orb.revealing .liquid-front{opacity:.93;backdrop-filter:blur(1.45px) saturate(1.09)}.orb.answered .liquid-front{opacity:.54;backdrop-filter:blur(.14px) saturate(1.02)}.orb.thinking,.orb.revealing .answer-plate,.orb.revealing .liquid,.orb.answered .answer-plate{animation:none}.orb.answered #answerText{animation:refractText 7.4s ease-in-out infinite}

/* Fluid chamber: there is no flat waterline. A warped meniscus clings to the
   viewing dome while the die's face, body and reflected light remain separate. */
.fluid-filters{position:absolute;width:0;height:0;overflow:hidden}
.answer-window{background:radial-gradient(ellipse at 43% 29%,#123d68 0,#082341 31%,#031226 61%,#00050d 100%);box-shadow:inset 0 0 42px 10px #00040c,inset 0 10px 23px rgba(61,151,211,.24),inset 0 -18px 30px rgba(0,0,0,.7),0 0 0 2px #250205}
.liquid-back{inset:-18%;border-radius:47%;background:radial-gradient(ellipse at 27% 18%,rgba(113,203,250,.2),transparent 22%),radial-gradient(ellipse at 76% 58%,rgba(13,98,157,.3),transparent 34%),conic-gradient(from 205deg at 50% 46%,#020916,#0b3155,#031225,#0b2745,#010712);filter:blur(11px) saturate(1.18);opacity:.94}
.answer-window::before{z-index:7;inset:-12%;border-radius:50%;background:radial-gradient(ellipse at 23% 24%,rgba(154,224,255,.13),transparent 19%),radial-gradient(ellipse at 70% 72%,rgba(44,145,207,.1),transparent 26%),linear-gradient(112deg,transparent 27%,rgba(137,214,250,.075) 44%,transparent 57%);filter:blur(6px);opacity:.85}
.answer-window::after{z-index:9;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 48%,transparent 48%,rgba(1,19,38,.2) 62%,rgba(0,4,11,.76) 91%),radial-gradient(ellipse at 32% 11%,rgba(184,232,255,.13),transparent 32%);filter:none;mix-blend-mode:normal;box-shadow:inset 0 0 15px rgba(122,200,241,.09)}
.answer-plate{z-index:4;clip-path:none;background:none;filter:drop-shadow(0 13px 14px rgba(0,0,0,.56)) drop-shadow(0 0 11px rgba(67,166,221,.24))}
.answer-plate::before{display:none}
.die-thickness,.plate-inner,.die-reflection{position:absolute;inset:0;clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%)}
.die-thickness{z-index:0;transform:translate3d(4.7%,6.7%,-22px) scale(.982);background:conic-gradient(from 23deg,#061224,#22577e 11%,#051326 23%,#2c6a96 37%,#06152a 50%,#1b486e 63%,#020918 78%,#245f8b 91%,#061224);box-shadow:inset 0 0 0 1px rgba(120,195,233,.19),inset 13px 16px 20px rgba(0,0,0,.6),0 12px 17px rgba(0,0,0,.74);filter:url(#submerged-refraction) blur(.45px) saturate(.76)}
.die-thickness::before{content:"";position:absolute;inset:0;clip-path:inherit;transform:translate3d(-2.2%,-2.8%,-8px) scale(.992);background:conic-gradient(from 24deg,rgba(86,167,209,.28),rgba(3,14,30,.72) 13%,rgba(35,104,145,.52) 32%,rgba(1,8,20,.86) 55%,rgba(51,129,174,.45) 78%,rgba(4,17,35,.8));box-shadow:inset 0 0 0 1px rgba(133,205,238,.11)}
.plate-inner{z-index:2;width:100%;height:100%;padding:12%;background:radial-gradient(ellipse at 37% 25%,rgba(79,170,224,.55),rgba(8,43,78,.9) 42%,rgba(2,17,38,.98) 78%),linear-gradient(145deg,#245f89,#031328);box-shadow:inset 0 0 0 1px rgba(145,216,248,.43),inset 0 0 0 5px rgba(4,25,49,.5),inset 12px 14px 25px rgba(107,201,246,.12),inset -15px -18px 27px rgba(0,2,10,.52);filter:url(#submerged-refraction)}
.die-reflection{z-index:3;pointer-events:none;background:linear-gradient(137deg,rgba(190,232,251,.24) 0 2%,rgba(81,169,216,.08) 7%,transparent 22% 72%,rgba(4,10,21,.38) 88%),radial-gradient(ellipse at 29% 17%,rgba(206,239,255,.12),transparent 27%);mix-blend-mode:screen;opacity:.72}
#answerText{position:relative;z-index:2;text-shadow:-1px 0 1px rgba(72,154,200,.42),1px 1px 2px #000,0 0 8px rgba(220,244,255,.12)}
.liquid-front{z-index:6;inset:-11%;border-radius:48%;background:radial-gradient(ellipse at 50% 104%,rgba(0,2,9,.84) 0 27%,rgba(0,9,24,.56) 46%,transparent 69%),radial-gradient(ellipse at 4% 62%,rgba(9,58,96,.48),transparent 32%),radial-gradient(ellipse at 97% 58%,rgba(1,27,54,.58),transparent 35%),radial-gradient(ellipse at 43% 81%,rgba(29,111,164,.11),transparent 36%);box-shadow:inset 0 -22px 35px rgba(0,2,10,.72);filter:url(#meniscus-distortion) blur(2px) saturate(1.12);backdrop-filter:none;opacity:.8;transform-origin:50% 88%}
.liquid-front::before{content:"";position:absolute;left:5%;right:5%;bottom:1%;height:42%;border-radius:47% 53% 49% 51%/64% 66% 34% 36%;background:radial-gradient(ellipse at 50% 28%,rgba(61,158,210,.13),rgba(4,34,65,.18) 39%,rgba(0,5,16,.55) 79%);box-shadow:inset 0 8px 18px rgba(99,184,226,.07);filter:blur(5px)}
.liquid-front::after{content:"";position:absolute;inset:9%;border-radius:50%;background:radial-gradient(ellipse at 26% 74%,rgba(87,176,219,.08),transparent 19%),radial-gradient(ellipse at 74% 83%,rgba(44,132,181,.08),transparent 23%);filter:blur(8px)}
.liquid-film{position:absolute;z-index:8;inset:1.8%;border-radius:50%;pointer-events:none;background:radial-gradient(circle at 50% 46%,transparent 49%,rgba(30,104,151,.08) 58%,rgba(2,26,51,.32) 78%,rgba(0,5,14,.72) 100%),radial-gradient(ellipse at 51% 94%,rgba(30,117,174,.2),transparent 39%);box-shadow:inset 0 -13px 24px rgba(0,4,14,.64),inset 0 0 12px rgba(98,183,226,.08)}
.window-shine{z-index:10;background:linear-gradient(134deg,rgba(255,255,255,.2),rgba(196,233,250,.045) 22%,transparent 37% 75%,rgba(64,148,194,.055));box-shadow:inset 0 0 24px rgba(114,201,244,.13)}
.orb.revealing .plate-inner{filter:url(#submerged-refraction) blur(.45px) saturate(.88)}
.orb.revealing .liquid-front{opacity:.91;filter:url(#meniscus-distortion) blur(2.8px) saturate(1.18);backdrop-filter:none}
.orb.answered .liquid-front{opacity:.7;filter:url(#meniscus-distortion) blur(1.7px) saturate(1.08);backdrop-filter:none}
.orb.answered .plate-inner{filter:url(#submerged-refraction)}

/* Separate transforms keep rise, perpetual buoyancy and pointer parallax from
   fighting each other. The entire solid die—including its printed face—moves. */
.answer-float{position:absolute;z-index:4;left:13%;top:13%;width:74%;height:74%;transform-style:preserve-3d;will-change:transform;pointer-events:none}
.answer-parallax{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform;transition:transform .72s cubic-bezier(.2,.72,.2,1)}
.answer-float .answer-plate{left:0;top:0;width:100%;height:100%}
.chamber-canvas{position:absolute;z-index:1;inset:0;width:100%;height:100%;display:block;border-radius:50%;touch-action:none}
.answer-window::before,.answer-window::after{display:none}
.orb.answered .die-reflection{animation:dieGlint 8.5s ease-in-out infinite}

/* Older molded mechanism: slightly inky liquid, cloudy viewing plastic and a
   thick utilitarian die. The full-window film keeps the object underwater. */
.answer-window{background:radial-gradient(ellipse at 43% 29%,#0b2c4d 0,#04172c 38%,#010a18 69%,#00030a 100%);box-shadow:inset 0 0 45px 11px rgba(0,1,7,.92),inset 0 9px 20px rgba(50,120,160,.17),inset 0 -19px 32px rgba(0,0,0,.78),0 0 0 2px #250205}
.liquid-back{background:radial-gradient(ellipse at 27% 18%,rgba(90,163,197,.12),transparent 23%),radial-gradient(ellipse at 76% 58%,rgba(8,69,112,.25),transparent 35%),conic-gradient(from 205deg at 50% 46%,#010611,#072442,#020c1c,#08233c,#00040c);filter:blur(12px) saturate(.88)}
.plate-inner{background:radial-gradient(ellipse at 37% 25%,rgba(53,124,158,.48),rgba(5,35,65,.92) 45%,rgba(1,12,29,.98) 80%),linear-gradient(145deg,#184a69,#031225);box-shadow:inset 0 0 0 2px rgba(102,160,181,.28),inset 0 0 0 6px rgba(2,20,39,.58),inset 11px 13px 22px rgba(84,147,171,.09),inset -15px -18px 27px rgba(0,2,9,.62)}
.plate-inner::before{content:"";position:absolute;inset:5%;z-index:1;pointer-events:none;clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%);box-shadow:inset 2px 2px 0 rgba(143,181,192,.1),inset -2px -2px 0 rgba(0,2,8,.5);background:linear-gradient(137deg,rgba(174,198,199,.035),transparent 19% 76%,rgba(0,2,8,.11))}
.die-thickness{background:conic-gradient(from 23deg,#04101e,#123b58 11%,#051224 23%,#1d5274 37%,#051326 50%,#113750 63%,#010817 78%,#174663 91%,#04101e);box-shadow:inset 0 0 0 2px rgba(86,139,158,.16),inset 13px 16px 20px rgba(0,0,0,.68),0 12px 17px rgba(0,0,0,.76);filter:url(#submerged-refraction) blur(.55px) saturate(.7)}
.die-reflection{opacity:.48;filter:blur(.35px)}
#answerText{color:#f1eee3;letter-spacing:.028em;text-shadow:-1px -1px 0 rgba(255,255,255,.075),1px 2px 2px #000,0 0 5px rgba(158,195,204,.09)}
.liquid-front{opacity:.88;filter:url(#meniscus-distortion) blur(2.45px) saturate(.86)}
.liquid-film{inset:0;border-radius:50%;background:radial-gradient(circle at 50% 46%,transparent 43%,rgba(4,34,55,.13) 57%,rgba(0,11,27,.42) 78%,rgba(0,2,8,.82) 100%),radial-gradient(ellipse at 49% 96%,rgba(12,68,97,.15),transparent 41%);box-shadow:inset 0 -15px 26px rgba(0,2,9,.72),inset 0 0 14px rgba(64,122,145,.06);backdrop-filter:blur(.62px) saturate(.83) contrast(.96)}
.window-shine{background:linear-gradient(134deg,rgba(229,224,207,.13),rgba(166,186,187,.028) 22%,transparent 38% 74%,rgba(35,90,114,.04));box-shadow:inset 0 0 24px rgba(76,137,164,.08),inset 1px 1px 0 rgba(255,255,255,.045)}
.orb.revealing .liquid-front{opacity:.94;filter:url(#meniscus-distortion) blur(3px) saturate(.88)}
.orb.revealing .plate-inner{transform-origin:50% 62%;animation:submergedWarp 1.75s linear both}
.orb.revealing .die-reflection{animation:submergedGlint 1.75s ease-in-out both}
.orb.answered .liquid-front{opacity:.72;filter:url(#meniscus-distortion) blur(1.8px) saturate(.9)}
.orb.answered .liquid-film{backdrop-filter:blur(.3px) saturate(.88) contrast(.98)}
.orb.answered .plate-inner{filter:url(#submerged-refraction) brightness(1.08)}

/* Continuous fluid exposure prevents a brightness jump when the die settles. */
.liquid-front,.orb.revealing .liquid-front,.orb.answered .liquid-front{opacity:.88;filter:url(#meniscus-distortion) blur(2.45px) saturate(.86);backdrop-filter:none}
.liquid-film,.orb.answered .liquid-film{backdrop-filter:blur(.62px) saturate(.83) contrast(.96)}
.orb.answered .plate-inner{filter:url(#submerged-refraction)}

/* Small trapped bubbles cling to the curved perimeter instead of reading as stars. */
.particles{z-index:9;mix-blend-mode:screen}
.particles i{width:var(--bubble,5px);height:var(--bubble,5px);border:1px solid rgba(91,184,220,.82);background:radial-gradient(circle at 34% 29%,rgba(255,255,248,.98) 0 12%,rgba(213,242,246,.88) 13% 21%,rgba(30,119,163,.44) 23% 43%,rgba(0,4,13,.93) 56% 69%,rgba(76,172,210,.7) 72% 80%,transparent 83%);box-shadow:inset -1px -1px 2px rgba(0,2,9,.88),0 0 6px rgba(56,148,186,.4);opacity:var(--bubble-opacity,.67);animation:bubbleCling var(--bubble-time,8s) ease-in-out infinite;transform-origin:center}
.particles i:nth-child(1){left:7%;top:61%;--bubble:6px;--bubble-time:7.7s;animation-delay:-3s}.particles i:nth-child(2){left:12%;top:77%;--bubble:3px;--bubble-time:9.2s;animation-delay:-7s}.particles i:nth-child(3){left:21%;top:89%;--bubble:5px;--bubble-time:8.4s;animation-delay:-1s}.particles i:nth-child(4){left:77%;top:86%;--bubble:4px;--bubble-time:7.2s;animation-delay:-5s}.particles i:nth-child(5){left:89%;top:68%;--bubble:6px;--bubble-time:9.8s;animation-delay:-8s}.particles i:nth-child(6){left:84%;top:52%;--bubble:2px;--bubble-time:6.9s;animation-delay:-2s}.particles i:nth-child(7){left:32%;top:94%;--bubble:3px;--bubble-time:8.8s;animation-delay:-6s}.particles i:nth-child(8){left:66%;top:92%;--bubble:5px;--bubble-time:10.2s;animation-delay:-4s}.particles i:nth-child(9){left:6%;top:45%;--bubble:2px;--bubble-time:7.4s;animation-delay:-3.5s}.particles i:nth-child(10){left:92%;top:42%;--bubble:3px;--bubble-time:9.5s;animation-delay:-7.5s}.particles i:nth-child(11){left:16%;top:28%;--bubble:2px;--bubble-time:8.1s;animation-delay:-1.5s}.particles i:nth-child(12){left:77%;top:15%;--bubble:2px;--bubble-time:10.6s;animation-delay:-5.5s}
.particles i:nth-child(13){left:5%;top:53%;--bubble:4px;--bubble-time:6.6s;animation-delay:-4.2s}.particles i:nth-child(14){left:9%;top:70%;--bubble:8px;--bubble-time:8.9s;animation-delay:-2.6s}.particles i:nth-child(15){left:16%;top:86%;--bubble:3px;--bubble-time:7.3s;animation-delay:-6.4s}.particles i:nth-child(16){left:26%;top:94%;--bubble:7px;--bubble-time:9.7s;animation-delay:-3.8s}.particles i:nth-child(17){left:42%;top:96%;--bubble:4px;--bubble-time:6.8s;animation-delay:-1.3s}.particles i:nth-child(18){left:55%;top:94%;--bubble:6px;--bubble-time:8.3s;animation-delay:-5.1s}.particles i:nth-child(19){left:73%;top:91%;--bubble:3px;--bubble-time:7.9s;animation-delay:-2.1s}.particles i:nth-child(20){left:85%;top:80%;--bubble:8px;--bubble-time:10.1s;animation-delay:-7.2s}.particles i:nth-child(21){left:92%;top:59%;--bubble:5px;--bubble-time:6.7s;animation-delay:-3.3s}.particles i:nth-child(22){left:91%;top:32%;--bubble:3px;--bubble-time:9.3s;animation-delay:-5.8s}.particles i:nth-child(23){left:84%;top:20%;--bubble:6px;--bubble-time:8.6s;animation-delay:-1.8s}.particles i:nth-child(24){left:67%;top:8%;--bubble:3px;--bubble-time:7.5s;animation-delay:-4.7s}.particles i:nth-child(25){left:45%;top:5%;--bubble:5px;--bubble-time:10.4s;animation-delay:-6.9s}.particles i:nth-child(26){left:29%;top:9%;--bubble:3px;--bubble-time:8.2s;animation-delay:-2.9s}.particles i:nth-child(27){left:11%;top:35%;--bubble:7px;--bubble-time:9.1s;animation-delay:-5.4s}.particles i:nth-child(28){left:6%;top:74%;--bubble:4px;--bubble-time:7.1s;animation-delay:-.8s}
.particles::before,.particles::after{content:"";position:absolute;bottom:4%;width:34%;height:15%;border-radius:50%;background:radial-gradient(circle at 13% 61%,rgba(244,250,244,.72) 0 1.2%,rgba(9,52,76,.7) 1.8% 3.2%,transparent 4%),radial-gradient(circle at 31% 34%,rgba(245,250,244,.78) 0 1.5%,rgba(5,45,69,.76) 2% 3.8%,transparent 4.4%),radial-gradient(circle at 51% 69%,rgba(239,248,243,.65) 0 1%,rgba(4,34,55,.74) 1.7% 3%,transparent 3.7%),radial-gradient(circle at 73% 39%,rgba(248,251,242,.72) 0 1.4%,rgba(5,46,69,.76) 2% 3.6%,transparent 4.3%),radial-gradient(ellipse at 50% 100%,rgba(15,75,108,.24),transparent 70%);filter:blur(.25px);opacity:.78;animation:bubblePool 6.8s ease-in-out infinite}
.particles::before{left:8%;transform:rotate(12deg)}.particles::after{right:7%;transform:scaleX(-1) rotate(9deg);animation-delay:-3.1s}
.orb.thinking .particles i{animation-duration:1.25s}
.primary:active{filter:brightness(.7)}
.primary:disabled{cursor:wait;filter:none;opacity:1}
.result-actions,.secondary,.share-status{transition:none}
.liquid-film,.orb.revealing .liquid-film,.orb.answered .liquid-film{background:radial-gradient(ellipse at 48% 42%,rgba(11,64,101,.14),rgba(1,23,47,.11) 47%,rgba(0,8,22,.48) 79%,rgba(0,2,8,.84) 100%),radial-gradient(ellipse at 28% 78%,rgba(47,129,165,.1),transparent 29%),radial-gradient(ellipse at 75% 23%,rgba(61,139,171,.075),transparent 25%);box-shadow:inset 0 -18px 30px rgba(0,2,10,.75),inset 0 0 18px rgba(74,145,175,.08);backdrop-filter:blur(.9px) saturate(.78) contrast(.94)}
@keyframes ponder{0%,100%{transform:translateY(0) rotate(0)}35%{transform:translateY(-8px) rotate(-1.2deg)}67%{transform:translateY(3px) rotate(1deg)}}@keyframes surface{0%{opacity:0;transform:translateY(82%) rotate(-19deg) scale(.7);filter:blur(7px) drop-shadow(0 0 4px #62c4ff)}45%{opacity:.38;transform:translateY(29%) rotate(6deg) scale(.84);filter:blur(3px) drop-shadow(0 0 11px #62c4ff)}76%{opacity:.9;transform:translateY(-3%) rotate(-2deg) scale(1.02);filter:blur(.4px) drop-shadow(0 0 18px #62c4ff)}100%{opacity:1;transform:translateY(0) rotate(0) scale(1);filter:drop-shadow(0 8px 13px rgba(0,0,0,.48)) drop-shadow(0 0 13px rgba(75,186,255,.36))}}@keyframes settledFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-2.5%) rotate(.7deg)}}@keyframes refractText{0%,100%{filter:none;transform:translateX(0) scaleX(1)}38%{filter:blur(.1px);transform:translateX(.14px) scaleX(1.001)}67%{filter:none;transform:translateX(-.12px) scaleX(.9995)}}@keyframes submergedWarp{0%{transform:scaleX(.93) scaleY(.965) skewX(-1.8deg);filter:url(#submerged-refraction) blur(2.1px) saturate(.72)}34%{transform:scaleX(1.025) scaleY(.985) skewX(1.15deg);filter:url(#submerged-refraction) blur(1.3px) saturate(.78)}68%{transform:scaleX(.988) scaleY(1.012) skewX(-.45deg);filter:url(#submerged-refraction) blur(.58px) saturate(.84)}100%{transform:scale(1);filter:url(#submerged-refraction)}}@keyframes submergedGlint{0%{opacity:.18;transform:translate3d(-2.8%,3%,2px)}47%{opacity:.43;transform:translate3d(1.2%,-1.3%,3px)}100%{opacity:.55;transform:translate3d(0,0,2px)}}@keyframes bubbleCling{0%,100%{transform:translate3d(0,2px,0) scale(.92);opacity:.22}43%{transform:translate3d(1.5px,-3px,0) scale(1.04);opacity:var(--bubble-opacity,.34)}72%{transform:translate3d(-1px,-1px,0) scale(.98);opacity:.28}}@keyframes dieGlint{0%,100%{opacity:.58;transform:translate3d(-.3%,0,2px)}44%{opacity:.8;transform:translate3d(.4%,-.25%,3px)}71%{opacity:.65;transform:translate3d(0,.2%,2px)}}@keyframes caustic{0%,100%{transform:translate(-2%,-1%) rotate(-3deg);opacity:.72}50%{transform:translate(3%,2%) rotate(5deg);opacity:1}}@keyframes drift{50%{transform:translate(-3%,4%) rotate(8deg)}}@keyframes tide{50%{transform:translateY(-7%) rotate(-3deg)}}@keyframes rise{from{transform:translateY(40px);opacity:0}35%{opacity:.58}to{transform:translateY(-130px);opacity:0}}
@keyframes bubblePool{0%,100%{translate:0 1px;filter:blur(.15px);opacity:.82}45%{translate:2px -2px;filter:blur(.32px);opacity:1}73%{translate:-1px 0;filter:blur(.1px);opacity:.9}}
@media(min-width:760px){.app-shell{padding-top:34px}.orb-stage{margin-top:-6px}.question-form{margin-top:-2px}}@media(max-height:760px) and (min-width:700px){.app-shell{padding-top:22px}.orb-stage{width:min(91vw,62vh,500px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.liquid,.particles i,.answer-window::before,.orb.answered .answer-plate,.orb.answered #answerText{animation:none!important}.orb.thinking{animation:none;transform:scale(.985)}.orb.revealing .answer-plate{animation:gentleReveal .35s ease-out forwards}@keyframes gentleReveal{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}}
@media(prefers-reduced-motion:reduce){.answer-float,.answer-parallax{transform:none!important;transition:none!important}}

/* Leave a small gap between asking and the result actions. */
.result-actions{margin-top:10px}
.result-actions .secondary{font-size:.7rem;letter-spacing:.08em}

/* Give every circular layer definite matching dimensions. Percentage heights
   inside aspect-ratio grid items can resolve differently in mobile Safari. */
.orb-stage{--orb-size:min(calc(100vw - 40px),540px);width:var(--orb-size);height:var(--orb-size);aspect-ratio:auto;flex:none;min-width:0;min-height:0}
.orb{width:88%;height:88%;aspect-ratio:auto;min-width:0;min-height:0}
.window-rim{width:78%;height:78%;aspect-ratio:auto;min-width:0;min-height:0}
.answer-window{min-width:0;min-height:0}
.chamber-canvas{aspect-ratio:auto}
@media(max-height:760px) and (min-width:700px){.orb-stage{--orb-size:min(calc(100vw - 40px),62vh,500px)}}
