/* Verse Quest - Sloka Yatra v13
   UI-heavy major-third scale. Display 40, page title 32, section 25,
   card title 20, body 16, body-small 14, UI 13. */
:root{
  --type-display:clamp(2rem,3.2vw,2.5rem);
  --type-heading-lg:clamp(1.75rem,2.7vw,2rem);
  --type-heading-md:clamp(1.4rem,2.2vw,1.5625rem);
  --type-heading-sm:1.25rem;
  --type-body-lg:1.125rem;
  --type-body:1rem;
  --type-body-sm:.875rem;
  --type-ui:.8125rem;
  --measure-body:68ch;
}

.vq-icon{display:block;width:1.35em;height:1.35em;overflow:visible}
.brand-button{max-width:260px}
.brand-button>span:last-child{min-width:0}
.brand-button strong{font-size:1.125rem!important;line-height:1.1!important;white-space:nowrap}
.brand-button small{font-family:"Noto Sans Devanagari","Nunito Sans",system-ui,sans-serif;font-size:.8125rem!important;line-height:1.2!important;letter-spacing:.02em!important;text-transform:none!important}

.app-shell :where(h1,h2,h3),dialog :where(h1,h2,h3){text-wrap:balance}
.app-shell :where(p,li),dialog :where(p,li){text-wrap:pretty}
.app-shell h1{font-size:var(--type-heading-lg)!important;line-height:1.16!important}
.app-shell h2,dialog h2{font-size:var(--type-heading-lg)!important;line-height:1.18!important}
.app-shell h3,dialog h3{font-size:var(--type-heading-sm)!important;line-height:1.25!important}
.app-shell :where(p,li),dialog :where(p,li){font-size:var(--type-body)!important;line-height:1.55!important}
.app-shell :where(small,.kicker,label),dialog :where(small,.kicker,label){font-size:var(--type-ui)!important;line-height:1.35!important}
.kicker{letter-spacing:.11em!important}

.map-heading h2{font-size:var(--type-heading-lg)!important}
.map-heading>p:last-child{max-width:var(--measure-body);font-size:var(--type-body-sm)!important}
.current-verse-row h1{font-size:var(--type-heading-lg)!important}
.continue-panel>p:not(.kicker){max-width:46ch;font-size:var(--type-body)!important}
.quick-settings{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.quick-settings label{font-size:var(--type-ui)!important}
.continue-button{font-size:var(--type-body)!important}
.home-mode-actions{grid-template-columns:1fr!important}
.home-mode-actions button{font-size:var(--type-body-sm)!important}
.home-mode-actions small{font-size:var(--type-ui)!important}

.journey-stop strong{font-size:var(--type-heading-sm)!important;line-height:1.2!important}
.journey-stop small{font-size:var(--type-body-sm)!important}
.stop-icon .vq-icon{width:34px;height:34px}
.mission-card h2{font-size:var(--type-heading-md)!important}
.mission-card>p:not(.kicker){font-size:var(--type-body-sm)!important}
.play-title h1{font-size:var(--type-heading-sm)!important}
.read-first-card h2{font-size:var(--type-heading-lg)!important}
.read-intro{font-size:var(--type-body)!important}
.read-verse p{font-size:clamp(1.25rem,2vw,1.625rem)!important;line-height:1.65!important}
.read-meaning>p{max-width:var(--measure-body);font-size:var(--type-body-lg)!important}
.line-sense-list li,.line-sense-list li p{font-size:var(--type-body-sm)!important}
.final-recall :where(h2,h3,strong){line-height:1.25!important}

/* Collection selection is the entry screen for every signed-out visit. */
.deck-dialog form{width:min(1080px,calc(100vw - 24px))!important;padding:clamp(22px,4vw,38px)!important;color:#173f46!important;background:linear-gradient(155deg,#fffdf7,#f8f1df)!important;border:1px solid #fff!important;border-radius:28px!important;box-shadow:0 28px 80px rgba(10,33,42,.32)!important}
.deck-dialog{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.deck-dialog form>h2{max-width:720px;margin:6px 0 9px!important;font-size:var(--type-display)!important}
.deck-dialog form>p:not(.kicker){max-width:65ch;color:#557075;font-size:var(--type-body)!important}
.collection-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:15px!important}
.collection-card{position:relative;min-height:198px!important;padding:18px!important;grid-template-columns:58px 1fr!important;gap:13px!important;border-top:4px solid var(--collection-accent,#e9b244)!important}
.collection-card.accent-coral{--collection-accent:#ee716c}
.collection-card.accent-gold{--collection-accent:#e7a72f}
.collection-card.accent-teal{--collection-accent:#2f9687}
.collection-card.accent-blue{--collection-accent:#5d82bb}
.collection-card.accent-violet{--collection-accent:#806caf}
.collection-icon{width:58px!important;height:58px!important;color:#174b52;background:color-mix(in srgb,var(--collection-accent) 28%,white)!important}
.collection-icon .vq-icon{width:31px;height:31px}
.collection-card strong{font-size:var(--type-heading-sm)!important;line-height:1.2!important}
.collection-card small{margin-top:7px!important;color:#536d71!important;font-size:var(--type-body-sm)!important;line-height:1.45!important}
.collection-status{display:flex;align-items:center;gap:7px;font-size:var(--type-ui)!important}
.collection-status>span{display:grid;width:25px;height:25px;place-items:center;color:var(--collection-accent);background:#f3f7f4;border-radius:8px}
.collection-status .vq-icon{width:16px;height:16px}
.collection-progress i{background:var(--collection-accent)!important}

/* A vertical, winding level map inspired by saga-style progression. */
.journey-dialog{width:min(790px,calc(100vw - 18px));max-width:none!important;max-height:96dvh!important;border-radius:30px!important}
.journey-dialog .dialog-close,.deck-dialog .dialog-close{color:#fff!important;background:#174b52!important;border:1px solid #fff!important;opacity:1!important;box-shadow:0 4px 12px rgba(14,50,55,.2)!important}
.journey-shell{width:100%!important;max-height:96dvh!important;padding:clamp(20px,4vw,36px)!important;background:linear-gradient(rgba(247,252,248,.9),rgba(255,249,236,.95)),var(--current-art) center/cover!important}
.journey-world-header{position:relative;z-index:2;display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:16px;align-items:center;padding:18px;background:rgba(255,255,255,.9);border:1px solid #fff;border-radius:24px;box-shadow:0 13px 36px rgba(18,62,67,.12)}
.journey-world-header h2{margin:2px 0 5px!important;font-size:var(--type-heading-lg)!important}
.journey-world-header p:not(.kicker){max-width:55ch;margin:0;color:#536d71;font-size:var(--type-body-sm)!important}
.journey-collection-icon{display:grid;width:72px;height:72px;place-items:center;color:#174b52;background:#ffe3a2;border-radius:21px;box-shadow:0 5px 0 #d7a746}
.journey-collection-icon .vq-icon{width:38px;height:38px}
.journey-score{min-width:80px;padding:11px 12px;display:grid;justify-items:center;background:#eef7f2;border-radius:16px}
.journey-score strong{font-family:"Fraunces",Georgia,serif;font-size:1.65rem;line-height:1}
.journey-score small{margin-top:4px;color:#60777a;text-align:center}
.journey-guidance{position:relative;z-index:2;max-width:62ch;margin:16px auto 0!important;padding:12px 16px;color:#355c61;background:rgba(255,255,255,.88);border-radius:15px;text-align:center;font-size:var(--type-body-sm)!important}
.verse-levels{position:relative;z-index:1;max-width:620px;margin:0 auto!important;padding:28px 0 42px!important;display:flex!important;flex-direction:column;align-items:center;gap:20px!important}
.verse-levels::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:12px;transform:translateX(-50%);background:repeating-linear-gradient(180deg,#e7b849 0 22px,#f8df95 22px 42px);border:3px solid rgba(255,255,255,.9);border-radius:999px;box-shadow:0 7px 18px rgba(95,72,27,.16)}
.verse-level{width:min(300px,72%)!important;min-height:88px!important;padding:12px 15px!important;display:grid!important;grid-template-columns:62px 1fr!important;justify-items:stretch!important;align-items:center!important;align-content:center!important;gap:12px!important;border-radius:25px!important;text-align:left!important;transform:translateX(-20%)!important;transition:transform .22s ease,box-shadow .22s ease,filter .22s ease!important}
.verse-level:nth-child(even){transform:translateX(20%)!important}
.verse-level:hover,.verse-level:focus-visible{transform:translateX(-20%) translateY(-3px)!important}
.verse-level:nth-child(even):hover,.verse-level:nth-child(even):focus-visible{transform:translateX(20%) translateY(-3px)!important}
.verse-level .level-number{width:58px!important;height:58px!important;font-size:1.35rem!important}
.verse-level .level-number .vq-icon{width:24px;height:24px}
.level-copy{display:grid;gap:3px}
.verse-level strong{font-size:var(--type-body)!important}
.verse-level small{font-size:var(--type-ui)!important}
.verse-level.current{border-color:#efb83e!important;box-shadow:0 7px 0 #d59a24,0 0 0 8px rgba(255,205,89,.24)!important;animation:current-level-pulse 1.9s ease-in-out infinite}
.verse-level.completed{border-color:#7fbd8e!important}
.verse-level.completed .level-number{background:#3d986b!important}
.verse-level.locked{opacity:.56!important;filter:grayscale(.75)!important}
@keyframes current-level-pulse{50%{box-shadow:0 7px 0 #d59a24,0 0 0 14px rgba(255,205,89,.08)}}

/* Account invitation is visible without becoming a blocking interruption. */
.account-button.guest-pulse{position:relative;color:#8b5108!important;border-color:#f2b83f!important;background:#fff9e7!important}
.account-button.guest-pulse::before{content:attr(data-label);position:absolute;right:calc(100% + 8px);top:50%;padding:7px 10px;transform:translateY(-50%);color:#75450d;background:#fff5d7;border:1px solid #efc769;border-radius:10px;box-shadow:0 5px 16px rgba(85,58,20,.14);font-size:var(--type-ui);font-weight:900;line-height:1.2;white-space:nowrap;pointer-events:none}
.account-button.guest-pulse::after{content:"";position:absolute;inset:-5px;border:2px solid #efb53d;border-radius:18px;animation:guest-signin-pulse 1.9s ease-out infinite;pointer-events:none}
@keyframes guest-signin-pulse{0%{opacity:.75;transform:scale(.92)}75%,100%{opacity:0;transform:scale(1.18)}}

.art-rotator span{transition:opacity 1.8s ease,transform 16s ease-out!important}
.art-rotator span.active{transform:scale(1)!important}

@media(max-width:1050px){
  .collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:760px){
  :root{--type-display:2rem;--type-heading-lg:1.75rem;--type-heading-md:1.375rem}
  .brand-button strong{font-size:1.0625rem!important}
  .brand-button small{font-size:.75rem!important}
  .map-heading h2,.current-verse-row h1,.welcome-shell h2{font-size:var(--type-heading-lg)!important}
  .journey-stop strong{font-size:1.125rem!important}
  .read-first-card h2{font-size:1.6rem!important}
  .read-verse p{font-size:1.22rem!important}
  .read-meaning>p{font-size:1rem!important}
  .deck-dialog form{width:calc(100vw - 12px)!important;max-height:calc(100dvh - 12px)!important;padding:21px 15px!important;border-radius:22px!important}
  .deck-dialog{width:calc(100vw - 12px)!important;max-width:calc(100vw - 12px)!important;margin:auto!important}
  .deck-dialog form{width:100%!important}
  .deck-dialog form>h2{font-size:var(--type-heading-lg)!important}
  .collection-grid{grid-template-columns:1fr!important}
  .collection-card{min-height:164px!important}
  .journey-dialog{width:calc(100vw - 10px);max-height:calc(100dvh - 10px)!important}
  .journey-shell{max-height:calc(100dvh - 10px)!important;padding:17px 13px!important;border-radius:23px!important}
  .journey-world-header{grid-template-columns:58px 1fr;padding:14px;gap:12px}
  .journey-collection-icon{width:56px;height:56px;border-radius:17px}
  .journey-collection-icon .vq-icon{width:30px;height:30px}
  .journey-world-header h2{font-size:1.5rem!important}
  .journey-world-header p:not(.kicker){font-size:.8125rem!important}
  .journey-score{grid-column:1/-1;grid-template-columns:auto auto;justify-content:center;gap:7px;padding:8px 10px}
  .journey-score strong{font-size:1.25rem}
  .journey-score small{margin:0}
  .journey-guidance{font-size:.8125rem!important}
  .verse-levels{gap:17px!important;padding-top:22px!important}
  .verse-level{width:78%!important;min-height:80px!important;grid-template-columns:54px 1fr!important;transform:translateX(-12%)!important}
  .verse-level:nth-child(even){transform:translateX(12%)!important}
  .verse-level:hover,.verse-level:focus-visible{transform:translateX(-12%) translateY(-2px)!important}
  .verse-level:nth-child(even):hover,.verse-level:nth-child(even):focus-visible{transform:translateX(12%) translateY(-2px)!important}
  .verse-level .level-number{width:50px!important;height:50px!important;font-size:1.15rem!important}
  .verse-level strong{font-size:.9375rem!important}
  .quick-settings{grid-template-columns:1fr 1fr!important}
  .app-bottom-nav .vq-icon{width:21px;height:21px}
  .account-button.guest-pulse::before{display:none}
}

@media(max-width:390px){
  .brand-button>span:last-child{display:grid!important}
  .brand-button small{display:block!important}
}

@media(prefers-reduced-motion:reduce){
  .verse-level.current,.account-button.guest-pulse::after{animation:none!important}
  .art-rotator span{transition:none!important}
}
