:root { color-scheme: light; font-family: "Avenir Next", Avenir, -apple-system, BlinkMacSystemFont, sans-serif; color: #2b2e33; background: #f4d9dc; }
* { box-sizing: border-box; }
body { margin: 0; }
main { min-height: 100svh; display: flex; flex-direction: column; align-items: center; padding: 38px 20px 30px; }
header { text-align: center; z-index: 1; }
.eyebrow { margin: 0 0 12px; font-size: .75rem; letter-spacing: .2em; font-weight: 600; color: #775d65; }
h1 { margin: 0; font-family: Georgia, serif; font-size: clamp(1.8rem, 4vw, 2.3rem); font-weight: 400; letter-spacing: -.035em; }
#scene { width: min(100%, 620px); height: clamp(340px, 62svh, 660px); flex: 1 0 340px; max-height: 660px; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
#scene canvas { display: block; width: 100%; height: 100%; }
#scene[aria-disabled="true"] { cursor: default; }
footer { text-align: center; padding-top: 6px; }
.result-area { min-height: 80px; }
#result { margin: 0 0 10px; font-size: 1.05rem; font-weight: 600; }
#hint { margin: 0; color: #775d65; font-size: .9rem; }
button { margin-top: 18px; border: 0; border-radius: 100px; background: #244c45; color: #fff8ee; padding: 15px 38px; min-width: 174px; font-family: inherit; font-size: 1rem; font-weight: 600; box-shadow: 0 5px 16px #244c4515; cursor: pointer; transition: background .2s, transform .2s; }
button:hover:enabled { background: #193d37; transform: translateY(-1px); }
button:disabled { opacity: .65; cursor: default; }
:focus-visible { outline: 3px solid #775d65; outline-offset: 5px; border-radius: 20px; }
@media (max-width: 480px) { main { padding: 28px 16px 24px; } #scene { min-height: 320px; flex-basis: 320px; } #result { font-size: 1rem; } }
@media (prefers-reduced-motion: reduce) { button { transition: none; } }
.reading-panel { width: min(100%, 560px); margin-top: 42px; padding: 26px; background: #fff8ee88; border-radius: 24px; line-height: 1.6; }
.reading-panel h2 { font-family: Georgia, serif; font-weight: 400; margin-top: 0; }
.reading-panel label { display: block; font-weight: 600; margin-bottom: 8px; }
.reading-panel textarea { width: 100%; resize: vertical; border: 1px solid #ae959b; border-radius: 12px; padding: 12px; font: inherit; color: inherit; background: #fffaf4; }
.reading-panel .small, .reading-panel details { font-size: .82rem; color: #675159; }
.reading-panel summary { cursor: pointer; }
#reading-text { white-space: pre-wrap; }
#reading-dice { font-weight: 600; }

[hidden] { display: none !important; }
#local-reset { background: transparent; color: #244c45; border: 1px solid #244c45; padding: 10px 20px; font-size: .9rem; }
.reading-panel { margin-top: 24px; }
footer .small { color: #775d65; font-size: .85rem; }
.reading-panel input[type="email"] { width:100%; padding:12px; font:inherit; border:1px solid #ae959b; border-radius:12px; }
#notify-label { margin-top:16px; font-size:.85rem; font-weight:400; }
#upgrade-panel { border-top:1px solid #ccb2b8; margin-top:24px; padding-top:12px; }
.site-links { margin-top:20px; text-align:center; }
.site-links button { padding:6px; min-width:0; margin:0; background:transparent; color:#244c45; box-shadow:none; font-size:inherit; text-decoration:underline; }
a { color:#244c45; }
table { width:100%; border-collapse:collapse; font-size:.85rem; } th,td { padding:8px; text-align:left; border-bottom:1px solid #ccb2b8; }
.metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; width:min(100%,560px);margin-top:24px; }
.metric { border-radius:16px; background:#fff8ee88; padding:20px; } .metric h2 { margin:0; font-size:2rem; }.metric p { margin:8px 0 0; }

#pending-emails { padding-left: 20px; overflow-wrap: anywhere; }
#pending-emails li { margin-bottom: 12px; }

/* Daily ritual experience; utility and legal pages retain their existing layout. */
.experience { background:#f8f5ef; color:#283f38; }
.experience main { max-width:1180px; margin:auto; padding:26px 44px 30px; }
.brand-bar { width:100%; display:flex; align-items:center; justify-content:space-between; text-align:left; border-bottom:1px solid #29493d20; padding-bottom:22px; }
.brand-bar a { text-decoration:none; font-size:.8rem; }
.brand-bar .brand { font:1.45rem Georgia,serif; letter-spacing:-.04em; }
.intro { text-align:center; padding:48px 0 28px; }
.experience .eyebrow { color:#847248; font-size:.64rem; letter-spacing:.19em; }
.experience h1 { font-size:clamp(2.7rem,5vw,4.3rem); line-height:1.06; letter-spacing:-.045em; }
.intro>p:last-child { color:#70766c; font-size:.95rem; margin-top:20px; }
.ritual-layout { width:100%; display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; }
.dice-stage { position:relative; min-width:0; text-align:center; padding-top:26px; }
.orbit { position:absolute; width:85%; aspect-ratio:1; top:42px; left:7.5%; border:1px solid #b4a27240; border-radius:50%; background:radial-gradient(ellipse,#e9e7d780,transparent 70%); pointer-events:none; }
.orbit:before { content:'✧'; position:absolute; top:5%; right:15%; color:#a78a4e; background:#f8f5ef; padding:5px; }
.stage-caption { position:relative; font-size:.6rem; letter-spacing:.24em; color:#887e65; }
.experience #scene { position:relative; width:100%; height:340px; min-height:0; max-height:none; }
.practice { position:relative; }
.experience #result { font:1.1rem Georgia,serif; }
.experience #hint { font-size:.75rem; color:#737970; }
.experience .small { font-size:.73rem; color:#777c72; line-height:1.55; }
.experience .reading-panel { width:100%; background:#fffdfa; border:1px solid #e4dfd2; box-shadow:0 14px 45px #37453606; border-radius:20px; padding:28px; margin-top:16px; }
.experience .reading-panel h2 { font-size:1.85rem; line-height:1.15; letter-spacing:-.025em; margin-bottom:10px; }
.panel-intro { font-size:.85rem; color:#747b72; margin:0 0 16px; }
.daily-badge { display:inline-block; font-size:.67rem; background:#edf1e9; color:#4e654e; border-radius:6px; padding:6px 9px; margin:0 0 22px; }
.experience .reading-panel label { font-size:.76rem; }
.experience .reading-panel textarea { background:#f8f7f2; border:1px solid #dadfd3; font-size:.88rem; border-radius:10px; min-height:90px; }
.question-examples { display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; }
.question-examples span { width:100%; font-size:.65rem; color:#7a8075; }
.experience .question-examples button { min-width:0; margin:0; padding:6px 10px; border-radius:6px; font-size:.65rem; background:#f4f2eb; color:#53624e; box-shadow:none; font-weight:500; }
.experience button { font-size:.85rem; border-radius:10px; padding:13px 22px; background:#294d40; }
.experience #read { width:100%; margin-top:10px; }
.experience #roll,.experience #share-reading { background:transparent; border:1px solid #b7c2ae; color:#36563f; padding:9px 20px; min-width:0; }
.experience #reading-status { color:#6c7668; font-size:.74rem; }
.experience details { margin-top:16px; font-size:.73rem; }
.experience #reading-dice { font-family:Georgia,serif; font-weight:400; font-size:1.2rem; }
#reflection h3 { font:1.75rem Georgia,serif; margin:12px 0; }
#reflection { animation:reveal .5s ease-out; }
#symbol-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
#symbol-cards details { background:#f3f1e9; padding:10px; border-radius:8px; margin:0; }
#symbol-cards summary { font-size:.7rem; }
#symbol-cards p { font-size:.72rem; line-height:1.5; }
.experience #reading-text { font:1rem/1.8 Georgia,serif; color:#465044; }
.takeaway { border-left:2px solid #b29a65; padding:6px 16px; margin:24px 0 10px; background:#f8f6f0; }
.takeaway p { margin:6px 0; font-size:.8rem; }
.how-it-works { display:grid; grid-template-columns:repeat(3,1fr); width:100%; gap:30px; margin:48px 0 20px; padding:30px 0; border-top:1px solid #dedfce; border-bottom:1px solid #dedfce; }
.how-it-works span { font-size:.6rem; color:#8a7952; letter-spacing:.12em; }
.how-it-works h3 { font:1.25rem Georgia,serif; margin:10px 0; }
.how-it-works p { font-size:.8rem; color:#757c70; }
.experience .account-panel,.experience #consent-panel { max-width:680px; }
.experience .site-links { font-size:.75rem; }
.preview-banner { width:100%; text-align:center; font-size:.75rem; padding:10px; background:#eee7d7; color:#665634; border-radius:8px; margin-top:16px; }
.preview-banner button { min-width:0; padding:4px 10px; margin:0 0 0 10px; font-size:.7rem; }
@keyframes reveal { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@media(max-width:720px) { .experience main { padding:20px; } .intro { padding:34px 0 12px; } .ritual-layout { grid-template-columns:1fr; gap:0; } .dice-stage { padding-top:0; } .experience #scene { height:280px; } .orbit { width:270px; height:270px; left:calc(50% - 135px); top:15px; } .practice .small { margin-bottom:20px; } .experience .reading-panel { padding:22px; } .how-it-works { gap:12px; margin-top:30px; } .how-it-works h3 { font-size:1.05rem; } .how-it-works p { font-size:.73rem; } }
@media(prefers-reduced-motion:reduce) { #reflection { animation:none; } }
.share-card { background:#294d40; color:#fff8ee; border-radius:12px; padding:28px 18px; text-align:center; margin-top:24px; outline:1px solid #bda776; outline-offset:-9px; }
.share-card>span { font-size:.6rem; letter-spacing:.2em; color:#d7c494; }
#card-symbols { font:2.4rem Georgia,serif; margin:20px 0; }
#card-label { font:.9rem Georgia,serif; }
.share-card small { font-size:.65rem; color:#d7c494; }
.experience #save-card { min-width:0; margin-right:8px; padding:9px 14px; }
.experience .intro { padding-top:30px; }
.experience h1 { font-size:clamp(2.7rem,4.5vw,3.7rem); }
@media(max-width:720px) {
 .experience .intro { padding:24px 0 8px; }
 .experience h1 { font-size:2.55rem; }
 .intro>p:last-child { font-size:.85rem; margin-top:12px; }
 .experience #scene { height:220px; }
 .orbit { width:230px; height:230px; left:calc(50% - 115px); }
 .stage-caption { margin:10px 0 0; }
 .experience #roll { margin-top:10px; }
 .practice .small { margin-bottom:8px; }
}
.experience .site-links button { background:transparent; color:#244c45; padding:6px; min-width:0; margin:0; box-shadow:none; font-size:inherit; }
.language-picker { display:flex; align-items:center; gap:4px; font-size:.75rem; }
.language-picker select { max-width:140px; padding:8px 5px; background:transparent; color:#294d40; border:1px solid #bcc7b9; border-radius:8px; font:inherit; }
.brand-bar { gap:16px; flex-wrap:wrap; }
.brand-bar>a:nth-child(2) { margin-left:auto; }
@media(max-width:480px){.brand-bar .brand{font-size:1.25rem}.brand-bar>a:nth-child(2){font-size:.7rem}.brand-bar{gap:8px}.language-picker select{max-width:118px}}

.table-scroll { overflow-x:auto; }
.learn-entry{width:100%;display:grid;grid-template-columns:1.3fr 1fr;gap:36px;background:#edf1e5;border:1px solid #dbe1d0;border-radius:20px;padding:32px;margin:12px 0 28px}.learn-entry h2{font:2rem Georgia,serif;margin:10px 0}.learn-entry p:not(.eyebrow){font-size:.9rem;line-height:1.7;max-width:430px}.learn-entry a{color:#294d40;text-underline-offset:4px}.learn-button{display:inline-block;font-size:.85rem;margin-top:12px}.learn-entry nav{display:flex;flex-direction:column;justify-content:center;gap:8px}.learn-entry nav a{padding:14px;border-bottom:1px solid #cdd7c5;text-decoration:none;font-size:.85rem}.learn-entry nav a:hover{background:#e1e9d7}.learn-entry nav span{display:inline-block;width:40px;font:1.5rem Georgia,serif;color:#806936}#symbol-cards a{font-size:.75rem;text-underline-offset:3px}.brand-bar>a[data-guide]{font-size:.8rem}
@media(max-width:720px){.learn-entry{grid-template-columns:1fr;padding:24px;gap:15px}.learn-entry h2{font-size:1.65rem}.brand-bar>a[data-guide]{font-size:.7rem}}

.experience .share-card{padding:0;outline:0;background:transparent}.share-card canvas{display:block;width:100%;height:auto;border-radius:12px}