/* Functional scaffold for the Quan Âm journey. Visual pass follows later. */
.qa-screen{min-height:100dvh;background:#101a2d;color:#eee4d1;overflow-x:hidden}.qa-topbar{position:sticky;top:0;z-index:4;background:linear-gradient(#101a2d 72%,transparent)}.qa-progress,.qa-kicker{font:500 10px/1.2 "Instrument Sans",sans-serif;letter-spacing:.18em;color:rgba(238,228,209,.56)}.qa-journey{min-height:calc(100dvh - 76px);display:grid}.qa-scene{min-height:calc(100dvh - 76px);padding:clamp(38px,9vh,88px) 28px max(38px,env(safe-area-inset-bottom));display:flex;flex-direction:column;justify-content:center}.qa-scene h1,.qa-scene h2{margin:16px 0 28px;font:400 clamp(52px,15vw,92px)/.92 var(--font-display,Georgia,serif);letter-spacing:-.05em;color:#eee4d1}.qa-scene h2{font-size:clamp(46px,13vw,76px)}.qa-question-field textarea{box-sizing:border-box;width:100%;min-height:132px;padding:18px 0;border:0;border-block:1px solid rgba(238,228,209,.22);border-radius:0;background:transparent;color:#eee4d1;font:400 18px/1.5 "Instrument Sans",sans-serif;resize:none;outline:none}.qa-question-field textarea::placeholder{color:rgba(238,228,209,.38)}.qa-primary,.qa-hold{width:100%;margin-top:26px;padding:17px 18px;border:1px solid rgba(238,228,209,.38);border-radius:999px;background:transparent;color:#eee4d1;font:500 13px/1 "Instrument Sans",sans-serif;letter-spacing:.04em}.qa-primary{display:flex;justify-content:space-between}.qa-error{color:#ff9d8b;font:500 12px/1.4 "Instrument Sans",sans-serif}.qa-breath{width:min(66vw,300px);aspect-ratio:1;margin:0 auto 18px;border-radius:50%;background:radial-gradient(circle,rgba(202,187,255,.38),rgba(94,108,190,.14) 48%,transparent 70%);animation:qa-breathe 4s ease-in-out infinite}.qa-breath span{display:block;width:100%;height:100%;border:1px solid rgba(238,228,209,.18);border-radius:inherit}.qa-hold{position:relative;overflow:hidden}.qa-hold i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,rgba(111,94,255,.5),rgba(238,228,209,.34));transition:width .15s linear}.qa-hold span{position:relative;z-index:1}.qa-hold.is-holding i{width:100%;transition-duration:1.4s}.qa-vessel{position:relative;width:154px;height:250px;margin:4px auto 24px;border:1px solid rgba(238,228,209,.3);border-radius:20px 20px 58px 58px;background:linear-gradient(145deg,rgba(255,255,255,.06),transparent)}.qa-vessel i{position:absolute;bottom:24px;left:34px;width:4px;height:176px;background:#eee4d1;transform-origin:bottom;border-radius:4px}.qa-vessel i:nth-child(2){transform:rotate(8deg)}.qa-vessel i:nth-child(3){transform:rotate(-9deg)}.qa-vessel i:nth-child(4){transform:rotate(15deg)}.qa-vessel i:nth-child(5){transform:rotate(-17deg)}.qa-vessel.is-shaking{animation:qa-shake .4s ease}.qa-note,.qa-question-echo{color:rgba(238,228,209,.62);font:400 14px/1.6 "Instrument Sans",sans-serif;text-align:center}.qa-blocks{display:flex;justify-content:center;gap:18px;margin:20px 0 14px}.qa-blocks span{width:88px;height:42px;border:1px solid rgba(238,228,209,.32);border-radius:50% 50% 18% 18%;background:linear-gradient(145deg,#8c4051,#391b28);transition:.5s transform,.5s background}.qa-blocks[data-result="accepted"] span:last-child{transform:rotateX(180deg);background:linear-gradient(145deg,#eee4d1,#806f67)}.qa-blocks[data-result="retry"] span{transform:rotate(12deg)}.qa-lot{text-align:center;margin:8px 0 24px}.qa-lot span{display:block;font:500 10px/1 "Instrument Sans",sans-serif;letter-spacing:.2em;color:rgba(238,228,209,.5)}.qa-lot strong{font:400 clamp(136px,44vw,230px)/.86 var(--font-display,Georgia,serif);letter-spacing:-.08em}.qa-reading{justify-content:flex-start;padding-top:60px}.qa-reading-grid{display:grid;border-top:1px solid rgba(238,228,209,.22)}.qa-reading-grid article{padding:22px 0;border-bottom:1px solid rgba(238,228,209,.22)}.qa-reading-grid span{font:500 10px/1 "Instrument Sans",sans-serif;letter-spacing:.16em;color:rgba(238,228,209,.5)}.qa-reading-grid p{margin:10px 0 0;font:400 16px/1.65 "Instrument Sans",sans-serif}.qa-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@keyframes qa-breathe{50%{transform:scale(1.12);filter:brightness(1.25)}}@keyframes qa-shake{25%{transform:rotate(-7deg)}75%{transform:rotate(7deg)}}
@media(min-width:760px){.qa-scene{width:min(680px,100%);margin:auto;padding-inline:40px}.qa-primary{max-width:360px}}
