/* BibleQuest V4 Gate 9 — Explore / Journey family.
   Presentation only. Bible World, Progress, Personal Mission and Calendar retain
   their existing service/state/routing/reward/persistence owners. */

/* ------------------------------
   Bible World — explorable route
   ------------------------------ */
.bq-bible-world{
  --journey-green:var(--forest-700);
  --journey-green-deep:var(--forest-900);
  --journey-gold:var(--amber-600);
  --journey-gold-soft:var(--amber-100);
  gap:var(--space-6);
}

.bq-bible-world .bq-world-head{
  align-items:center;
  padding:clamp(4px,1vw,10px) 0;
}

.bq-bible-world .bq-world-head h1{
  max-width:760px;
  margin:.16rem 0 .55rem;
  font-family:var(--font-display);
  font-size:clamp(30px,5vw,48px);
  line-height:1.02;
  letter-spacing:-.038em;
  color:var(--journey-green-deep);
}

.bq-bible-world .bq-world-head p:not(.bq-eyebrow){
  max-width:720px;
  color:var(--ink-500);
}

.bq-bible-world .bq-world-art{
  padding:10px;
  border:1px solid color-mix(in srgb,var(--forest-700) 16%,var(--line-200));
  border-radius:var(--radius-lg);
  background:linear-gradient(150deg,var(--surface-raised),color-mix(in srgb,var(--amber-100) 26%,var(--surface-raised)));
  box-shadow:var(--shadow-2);
}

.bq-bible-world .bq-world-art-frame{
  aspect-ratio:16/9;
  border-radius:calc(var(--radius-lg) - 8px);
  background:color-mix(in srgb,var(--forest-500) 8%,var(--surface-subtle));
}

.bq-bible-world .bq-world-art-copy{
  align-items:center;
  padding:8px 8px 6px;
}

.bq-bible-world .bq-world-art-copy b{
  color:var(--forest-900);
  font-size:14px;
}

.bq-bible-world .bq-world-art-copy small{
  color:var(--ink-500);
}

.bq-bible-world .bq-world-map{
  position:relative;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-3);
  counter-reset:bq-world-step;
}

.bq-bible-world .bq-world-region{
  counter-increment:bq-world-step;
  position:relative;
  min-height:108px;
  grid-template-columns:54px minmax(0,1fr) auto;
  gap:var(--space-3);
  padding:16px;
  border:1px solid var(--line-200);
  border-radius:var(--radius-md);
  background:color-mix(in srgb,var(--surface-raised) 96%,var(--surface-subtle));
  color:var(--ink-900);
  box-shadow:none;
  transition:transform var(--duration-fast) var(--ease-standard),border-color var(--duration-base) var(--ease-standard),box-shadow var(--duration-base) var(--ease-standard),background var(--duration-base) var(--ease-standard);
}

.bq-bible-world .bq-world-region:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--forest-700) 34%,var(--line-200));
  background:var(--surface-raised);
  box-shadow:var(--shadow-1);
}

.bq-bible-world .bq-world-region.is-next{
  grid-column:1/-1;
  border-color:color-mix(in srgb,var(--amber-600) 46%,var(--line-200));
  background:linear-gradient(135deg,color-mix(in srgb,var(--amber-100) 62%,var(--surface-raised)),var(--surface-raised));
  outline:none;
  box-shadow:0 12px 30px color-mix(in srgb,var(--amber-600) 10%,transparent);
}

.bq-bible-world .bq-world-region.is-explored{
  border-color:color-mix(in srgb,var(--success) 24%,var(--line-200));
}

.bq-bible-world .bq-world-icon{
  width:48px;
  height:48px;
  border-radius:15px;
  display:grid;
  place-items:center;
  overflow:hidden;
  font-size:0;
  background:color-mix(in srgb,var(--forest-500) 8%,var(--surface-raised));
  border:1px solid color-mix(in srgb,var(--forest-700) 14%,var(--line-200));
  color:var(--forest-900);
  box-shadow:none;
}

.bq-bible-world .bq-world-icon::before{
  content:counter(bq-world-step,decimal-leading-zero);
  font-family:var(--font-ui);
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
}

.bq-bible-world .bq-world-region.is-next .bq-world-icon{
  background:var(--forest-900);
  color:var(--surface-raised);
  border-color:var(--forest-900);
}

.bq-bible-world .bq-world-region.is-explored .bq-world-icon{
  background:color-mix(in srgb,var(--success) 12%,var(--surface-raised));
  color:var(--success);
}

.bq-bible-world .bq-world-title{
  color:var(--ink-900);
  font-size:15px;
  font-weight:900;
  letter-spacing:-.015em;
}

.bq-bible-world .bq-world-books{
  color:var(--ink-500);
  font-size:11px;
}

.bq-bible-world .bq-world-progress{
  height:6px;
  margin-top:3px;
  background:var(--surface-subtle);
  box-shadow:none;
}

.bq-bible-world .bq-world-progress i{
  background:linear-gradient(90deg,var(--forest-700),color-mix(in srgb,var(--forest-500) 68%,var(--amber-400)));
  box-shadow:none;
}

.bq-bible-world .bq-world-status{
  min-width:70px;
  color:var(--ink-500);
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.bq-bible-world .bq-world-status b{
  color:var(--forest-900);
  font-size:14px;
  letter-spacing:0;
}

.bq-bible-world .bq-world-note,
.bq-bible-world .bq-world-detail{
  border-color:var(--line-200);
  border-radius:var(--radius-md);
  background:var(--surface-raised);
  box-shadow:var(--shadow-1);
}

.bq-bible-world .bq-world-detail{
  padding:clamp(22px,4vw,34px);
}

.bq-bible-world .bq-world-actions button{
  min-height:72px;
  border-radius:var(--radius-md);
}

.bq-bible-world .bq-world-art-fallback{
  border-style:dashed;
  background:color-mix(in srgb,var(--amber-100) 34%,var(--surface-raised));
}

/* ------------------------------
   Progress — growth dashboard
   ------------------------------ */
.bq-progress-head{
  position:relative;
  overflow:hidden;
  padding:clamp(22px,4vw,34px);
  border-color:color-mix(in srgb,var(--forest-700) 18%,var(--line-200));
  border-radius:var(--radius-lg);
  background:linear-gradient(145deg,var(--forest-900),color-mix(in srgb,var(--forest-700) 88%,#111));
  color:var(--surface-raised);
  box-shadow:var(--shadow-2);
}

.bq-progress-head::after{
  content:"";
  position:absolute;
  width:240px;
  height:240px;
  right:-95px;
  top:-115px;
  border-radius:50%;
  background:color-mix(in srgb,var(--amber-400) 20%,transparent);
  pointer-events:none;
}

.bq-progress-head>*{position:relative;z-index:1}
.bq-progress-head .bq-eyebrow{color:var(--amber-400)!important}
.bq-progress-head .bq-progress-hero-copy h1{color:var(--surface-raised);font-family:var(--font-display);font-size:clamp(28px,4.5vw,42px)}
.bq-progress-head .bq-progress-hero-copy p{color:color-mix(in srgb,var(--surface-raised) 72%,transparent)}

.bq-progress-head .bq-progress-art-wrap{
  color:var(--forest-900);
  background:var(--amber-100);
  border-color:color-mix(in srgb,var(--amber-400) 45%,transparent);
  box-shadow:none;
}

.bq-progress-head .bq-progress-stats{
  gap:var(--space-2);
  margin-top:var(--space-6);
}

.bq-progress-head .bq-progress-stats>div{
  min-height:74px;
  padding:12px;
  border-color:color-mix(in srgb,var(--surface-raised) 16%,transparent);
  border-radius:var(--radius-sm);
  background:color-mix(in srgb,var(--surface-raised) 9%,transparent);
  box-shadow:none;
}

.bq-progress-head .bq-progress-stat-art{
  color:var(--amber-400);
  background:color-mix(in srgb,var(--surface-raised) 10%,transparent);
}

.bq-progress-head .bq-progress-stats b{color:var(--surface-raised)}
.bq-progress-head .bq-progress-stats span:not(.bq-progress-stat-art){color:color-mix(in srgb,var(--surface-raised) 68%,transparent)}

.bq-progress-head + .bq-panel,
.bq-progress-head + .bq-panel + .bq-panel,
.bq-progress-head + .bq-panel + .bq-panel + .bq-panel{
  border-radius:var(--radius-md);
  border-color:var(--line-200);
  background:var(--surface-raised);
  box-shadow:var(--shadow-1);
}

.bq-progress-head + .bq-panel{
  padding:clamp(22px,3vw,30px);
}

.bq-progress-head + .bq-panel .bq-progress-art-wrap.is-small,
.bq-progress-head + .bq-panel + .bq-panel .bq-progress-art-wrap.is-small{
  color:var(--forest-700);
  background:color-mix(in srgb,var(--forest-500) 8%,var(--surface-raised));
  border-color:color-mix(in srgb,var(--forest-700) 15%,var(--line-200));
  box-shadow:none;
}

.bq-progress-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-2);
  margin-top:var(--space-4);
}

.bq-progress-actions button{
  width:100%;
  min-height:var(--tap-target);
  justify-content:flex-start;
  padding:12px 14px;
  border-radius:var(--radius-sm);
}

.bq-badge-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-3);
}

.bq-badge-card{
  min-height:86px;
  padding:14px;
  border-color:var(--line-200);
  border-radius:var(--radius-sm);
  background:var(--surface-raised);
  box-shadow:none;
}

.bq-badge-card.is-unlocked{
  border-color:color-mix(in srgb,var(--success) 28%,var(--line-200));
  background:color-mix(in srgb,var(--success) 5%,var(--surface-raised));
}

.bq-badge-card.is-locked{
  opacity:.72;
  background:color-mix(in srgb,var(--surface-subtle) 45%,var(--surface-raised));
}

.bq-progress-note{
  border-style:dashed!important;
  box-shadow:none!important;
  background:color-mix(in srgb,var(--surface-subtle) 38%,var(--surface-raised))!important;
}

/* ------------------------------
   Personal Mission — one next step
   ------------------------------ */
[data-mission-page]{
  --bq-mission-accent:var(--forest-700);
  --bq-mission-soft:color-mix(in srgb,var(--forest-500) 8%,var(--surface-raised));
  padding:clamp(22px,4vw,36px);
  border-color:color-mix(in srgb,var(--forest-700) 18%,var(--line-200));
  border-radius:var(--radius-lg);
  background:linear-gradient(145deg,var(--surface-raised),color-mix(in srgb,var(--amber-100) 30%,var(--surface-raised)));
  box-shadow:var(--shadow-2);
}

[data-mission-page]::after{
  content:"";
  position:absolute;
  width:210px;
  height:210px;
  right:-95px;
  bottom:-120px;
  border-radius:50%;
  background:color-mix(in srgb,var(--forest-500) 7%,transparent);
  pointer-events:none;
}

[data-mission-page]>*{position:relative;z-index:1}

[data-mission-page] .bq-mission-intro{
  gap:var(--space-6);
  margin-bottom:var(--space-6);
}

[data-mission-page] .bq-mission-intro h1{
  max-width:650px;
  margin:.12rem 0 .5rem;
  font-family:var(--font-display);
  font-size:clamp(30px,5vw,46px);
  line-height:1.04;
  letter-spacing:-.035em;
  color:var(--forest-900);
}

[data-mission-page] .bq-mission-copy{
  max-width:640px;
  color:var(--ink-500);
  font-size:15px;
}

[data-mission-page] .bq-mission-art-wrap{
  width:96px;
  height:96px;
  border-radius:28px;
  color:var(--forest-700);
  background:var(--surface-raised);
  border-color:color-mix(in srgb,var(--forest-700) 18%,var(--line-200));
  box-shadow:var(--shadow-1);
}

[data-mission-page] .bq-mission-progress{
  margin:0 0 var(--space-6);
  padding:18px 20px;
  border:1px solid color-mix(in srgb,var(--amber-600) 22%,var(--line-200));
  border-radius:var(--radius-md);
  background:color-mix(in srgb,var(--amber-100) 38%,var(--surface-raised));
  box-shadow:none;
}

[data-mission-page] .bq-mission-progress b{color:var(--forest-900)}

[data-mission-page] .bq-mission-actions{
  grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr);
  gap:var(--space-2);
}

[data-mission-page] .bq-mission-actions button{
  min-height:52px;
  border-radius:var(--radius-sm);
}

/* ------------------------------
   Calendar — calm agenda planner
   ------------------------------ */
[data-calendar-page]{
  --bq-calendar-accent:var(--forest-700);
  padding:clamp(22px,4vw,34px);
  border-color:var(--line-200);
  border-radius:var(--radius-lg);
  background:var(--surface-raised);
  box-shadow:var(--shadow-2);
}

[data-calendar-page]::before{
  width:260px;
  height:260px;
  right:-120px;
  top:-135px;
  background:color-mix(in srgb,var(--amber-100) 58%,transparent);
}

[data-calendar-page] .bq-calendar-intro{
  margin-bottom:var(--space-6);
}

[data-calendar-page] .bq-calendar-intro h1{
  margin:.12rem 0 .4rem;
  font-family:var(--font-display);
  font-size:clamp(28px,4.3vw,40px);
  color:var(--forest-900);
}

[data-calendar-page] .bq-calendar-intro p:not(.bq-eyebrow){
  max-width:720px;
  color:var(--ink-500);
}

[data-calendar-page] .bq-calendar-icon-wrap--hero{
  color:var(--forest-700);
  background:color-mix(in srgb,var(--forest-500) 8%,var(--surface-raised));
  border-color:color-mix(in srgb,var(--forest-700) 18%,var(--line-200));
  box-shadow:none;
}

[data-calendar-page] form[data-calendar-add]{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(150px,1fr) auto;
  gap:var(--space-2);
  align-items:end;
  margin:0 0 var(--space-6);
  padding:16px;
  border:1px solid var(--line-200);
  border-radius:var(--radius-md);
  background:color-mix(in srgb,var(--surface-subtle) 30%,var(--surface-raised));
  box-shadow:none;
}

[data-calendar-page] form[data-calendar-add] .bq-eyebrow,
[data-calendar-page] form[data-calendar-add] label{
  grid-column:1/-1;
}

[data-calendar-page] form[data-calendar-add] input[type="text"],
[data-calendar-page] form[data-calendar-add] input[type="date"],
[data-calendar-page] form[data-calendar-add] input[type="number"]{
  min-height:var(--tap-target);
  width:100%;
  border-radius:var(--radius-sm);
}

[data-calendar-page] .bq-calendar-day{
  margin:0 0 var(--space-3);
  padding:16px 18px;
  border:1px solid var(--line-200);
  border-radius:var(--radius-md);
  background:var(--surface-raised);
  box-shadow:none;
}

[data-calendar-page] .bq-calendar-day>.bq-eyebrow{
  margin-bottom:10px!important;
}

[data-calendar-page] .bq-calendar-event{
  grid-template-columns:40px minmax(0,1fr);
  gap:12px;
  padding:12px 0;
}

[data-calendar-page] .bq-calendar-icon-wrap--event{
  width:40px;
  height:40px;
  border-radius:12px;
  box-shadow:none;
}

[data-calendar-page] .bq-calendar-event-title{
  color:var(--ink-900);
  font-weight:850;
}

[data-calendar-page] .bq-calendar-event-actions button{
  min-height:var(--tap-target);
}

[data-calendar-page] .bq-calendar-empty{
  margin-bottom:var(--space-4);
  padding:32px 16px;
  border:1px dashed var(--line-200);
  border-radius:var(--radius-md);
  background:color-mix(in srgb,var(--surface-subtle) 28%,var(--surface-raised));
}

/* ------------------------------
   Responsive / accessibility
   ------------------------------ */
@media(max-width:760px){
  .bq-bible-world .bq-world-map{grid-template-columns:1fr}
  .bq-bible-world .bq-world-region.is-next{grid-column:auto}
  .bq-progress-actions{grid-template-columns:1fr}
  [data-calendar-page] form[data-calendar-add]{grid-template-columns:1fr}
  [data-calendar-page] form[data-calendar-add]>*{grid-column:1!important}
}

@media(max-width:520px){
  .bq-bible-world .bq-world-head{display:grid}
  .bq-bible-world .bq-world-head>button{justify-self:start}
  .bq-bible-world .bq-world-art{padding:7px;border-radius:20px}
  .bq-bible-world .bq-world-art-frame{aspect-ratio:16/9;border-radius:15px}
  .bq-bible-world .bq-world-region{grid-template-columns:44px minmax(0,1fr);min-height:100px;padding:13px}
  .bq-bible-world .bq-world-icon{width:42px;height:42px;border-radius:13px}
  .bq-bible-world .bq-world-status{grid-column:2;grid-row:2;display:flex;align-items:center;justify-content:space-between;min-width:0}
  .bq-progress-head{padding:20px}
  .bq-progress-head .bq-progress-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bq-badge-grid{grid-template-columns:1fr}
  [data-mission-page] .bq-mission-intro{grid-template-columns:minmax(0,1fr) 70px;gap:12px;align-items:start}
  [data-mission-page] .bq-mission-art-wrap{width:70px;height:70px;border-radius:20px}
  [data-mission-page] .bq-mission-art{width:42px;height:42px}
  [data-mission-page] .bq-mission-actions{grid-template-columns:1fr}
  [data-calendar-page]{padding:18px}
}

@media(max-width:390px){
  .bq-bible-world .bq-world-head h1{font-size:29px}
  .bq-bible-world .bq-world-region{gap:9px;padding:11px}
  .bq-progress-head .bq-progress-hero{gap:10px}
  .bq-progress-head .bq-progress-stats>div{padding:10px 8px}
  [data-mission-page]{padding:18px}
  [data-mission-page] .bq-mission-intro h1{font-size:29px}
  [data-calendar-page] .bq-calendar-intro{grid-template-columns:minmax(0,1fr) 52px;gap:10px}
  [data-calendar-page] .bq-calendar-icon-wrap--hero{width:52px;height:52px}
}

@media(prefers-reduced-motion:reduce){
  .bq-bible-world .bq-world-region,
  .bq-bible-world .bq-world-art-revealed,
  .bq-progress-actions button,
  [data-mission-page] button,
  [data-calendar-page] button{
    transition:none!important;
    animation:none!important;
  }
  .bq-bible-world .bq-world-region:hover{transform:none}
}

@media(prefers-contrast:more){
  .bq-bible-world .bq-world-art,
  .bq-bible-world .bq-world-region,
  .bq-bible-world .bq-world-note,
  .bq-bible-world .bq-world-detail,
  .bq-progress-head,
  .bq-progress-head + .bq-panel,
  .bq-progress-head + .bq-panel + .bq-panel,
  .bq-progress-head + .bq-panel + .bq-panel + .bq-panel,
  [data-mission-page],
  [data-calendar-page],
  [data-calendar-page] form[data-calendar-add],
  [data-calendar-page] .bq-calendar-day{
    border-color:var(--ink-700)!important;
    box-shadow:none!important;
  }
  .bq-bible-world .bq-world-region.is-next{outline:2px solid var(--amber-600);outline-offset:2px}
  .bq-progress-head{background:var(--forest-900)}
}
