/* Franella v3.3: reading panels share the collection artwork and domain palette. */
#reveal{--reading-colour:#233e47;--reading-gold:#d2b17b;width:min(1050px,94vw);max-height:90vh;max-height:90dvh;background:#f7efdf;overflow:auto;scroll-padding-top:66px}
#reveal[data-domain="Nurture Yourself"]{--reading-colour:#4d6558}
#reveal[data-domain="Connect with Others"]{--reading-colour:#865342}
#reveal[data-domain="Live with Purpose"]{--reading-colour:#7d633d}
#reveal [hidden]{display:none!important}
#reveal .reveal-layout{grid-template-columns:34% 66%;min-height:580px}
#reveal .reveal-art{height:auto;min-height:100%;background:var(--reading-colour);background-image:none;position:relative}
#reveal .reading-art-inner{position:sticky;top:0;height:640px;height:min(720px,90vh - 2px);height:min(720px,90dvh - 2px);min-height:480px;display:flex;align-items:center;justify-content:center;isolation:isolate;overflow:hidden}
#reveal .reading-frame{position:absolute;inset:18px;pointer-events:none}
#reveal .reading-frame svg{width:100%;height:100%;fill:none;stroke:var(--reading-gold);stroke-width:.35;vector-effect:non-scaling-stroke}
#reveal .reading-star{position:absolute;top:48px;left:calc(50% - 10px);width:20px;height:20px;fill:var(--reading-gold)}
/* The supplied card image has the same flat domain background. Crop only its illustration. */
#reveal .reading-symbol{position:relative;overflow:hidden;width:92%;max-width:330px;aspect-ratio:500 / 490;flex:none}
#reveal .reading-symbol img{position:absolute;display:block;width:120%;height:auto;max-width:none;left:-10%;top:-20.408163%}
#reveal.reading-art-missing .reading-symbol{visibility:hidden}
#reveal .art-label{position:absolute;left:20px;right:20px;bottom:45px;margin:0;text-align:center;color:#f4dfb9;font:italic 24px/1.4 Georgia,serif}
#reveal .reading-label-star{display:block;font:14px/1.5 Georgia,serif;margin-top:12px;color:var(--reading-gold)}
#reveal .reading-closebar{position:sticky;top:0;height:0;z-index:20;overflow:visible}
#reveal .reading-closebar .close{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #c9ac7d;background:#f7efdf;color:#233e47;border-radius:50%;font:28px/1 Arial,sans-serif;box-shadow:0 2px 9px #162d3512;cursor:pointer}
#reveal .content{padding:52px 44px 30px;background:#f7efdf;min-width:0}
#reveal .content .eyebrow{color:#806139;font:10px/1.6 Arial,sans-serif;letter-spacing:2.1px;padding-right:22px}
#reveal .content h2{font:clamp(36px,4vw,52px)/1.12 Georgia,serif;color:var(--reading-colour);margin:15px 0 20px;letter-spacing:-1px}
#reveal .meaning{color:#233e47;font:18px/1.7 Arial,sans-serif;padding:0 0 24px 16px;margin:0;border-left:2px solid #b99a67;border-bottom:1px solid #c8aa7666}
#reveal .collection-mini{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;margin-top:17px;color:#85652f;font:12px/1.6 Arial,sans-serif}
#reveal #discoveryMarker{flex-basis:100%}
#reveal .collection-mini #collectCard.is-saved{flex-basis:100%;text-align:left;min-width:0;min-height:32px;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;color:#85652f;text-decoration:none;font:12px/1.6 Arial,sans-serif;cursor:pointer}
#reveal .collection-mini #viewCollection,#reveal .collection-mini #virtueReflections{min-width:0;min-height:36px;margin:0;padding:5px 0;border:0;background:transparent;color:#536861;font:12px/1.5 Arial,sans-serif;text-decoration:underline;text-underline-offset:4px}
#reveal .reveal-actions{margin-top:22px}
#reveal .deeper-button{background:var(--reading-colour);color:#fff2dc;border:1px solid #b99a67;min-height:56px;min-width:245px;padding:8px 9px 8px 22px;font:14px/1.4 Arial,sans-serif}
#reveal .deeper-button .arrow{background:transparent;border:1px solid #d2b17b99;color:#f4dfb9;width:37px;height:37px}
#reveal .collect-row{margin-top:15px}
#reveal .collect-row #collectCard{min-height:44px;padding:10px 18px;border:1px solid #af956e;background:transparent;color:var(--reading-colour);font:12px/1.5 Arial,sans-serif;border-radius:25px}
#reveal .collection-device{display:block;margin-top:7px;color:#756d5d;font:11px/1.6 Arial,sans-serif}
#reveal #collectionFeedback{font:12px/1.6 Arial,sans-serif;color:#8e452f;margin:10px 0}
#reveal #collectionFeedback:empty{display:none}
#reveal .deeper{background:var(--reading-colour);background-image:none;border:1px solid #d2b17b55;border-radius:12px;margin-top:25px;padding:3px 26px 26px;color:#f4dfb9}
#reveal .depth-section{padding:25px 0;border-bottom:1px solid #d2b17b66}
#reveal .depth-section h3{color:#eed09e;font:10px/1.7 Arial,sans-serif;letter-spacing:1.6px;scroll-margin-top:66px}
#reveal .depth-section p{font:21px/1.65 Georgia,serif;color:#fff0d7}
#reveal .depth-tagline{color:#f0d6ad;font:italic 16px/1.6 Georgia,serif}
#reveal:not(.reading-keyboard) #wisdomTitle:focus{outline:none}
#reveal button:focus-visible,#reveal a:focus-visible{outline:2px solid #916732;outline-offset:4px}
#reveal .deeper :focus-visible{outline-color:#f5d19d}
#reveal .card-tools{margin-top:26px}
@media(max-width:700px){
 #reveal{width:calc(100vw - 20px);max-height:94vh;max-height:94dvh;border-radius:14px}
 #reveal .reveal-layout{grid-template-columns:1fr;min-height:0}
 #reveal .reveal-art{height:240px;min-height:0}
 #reveal .reading-art-inner{position:relative;height:240px;min-height:0}
 #reveal .reading-frame{inset:12px 15px}
 #reveal .reading-star{top:20px;width:12px;height:12px;left:calc(50% - 6px)}
 #reveal .reading-symbol{width:180px;margin-top:-8px}
 #reveal .art-label{bottom:15px;font-size:17px}
 #reveal .reading-label-star{display:none}
 #reveal .content{padding:26px 22px 23px}
 #reveal .content h2{font-size:38px;margin:12px 0 16px}
 #reveal .meaning{font-size:17px;padding-left:13px;padding-bottom:20px}
 #reveal .reveal-actions .deeper-button{width:100%;min-width:0}
 #reveal .deeper{padding:2px 20px 23px}
 #reveal .depth-section p{font-size:20px;line-height:1.6}
 #reveal .reading-closebar .close{top:9px;right:9px}
}
@media(prefers-reduced-motion:reduce){#reveal{scroll-behavior:auto}}

/* Draw the same external-share arrow on every device, without emoji substitution. */
#reveal #shareCard{gap:7px}
#reveal #shareCard svg{display:block;width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}