/* Base page styles */
@font-face{font-family:Pretendard;src:url('../PretendardVariable.woff2') format('woff2');font-display:swap}
:root{--ink:var(--text-primary);--muted:var(--text-secondary);--line:var(--border-default);--bg:var(--bg-page);--card:var(--bg-surface);--blue:var(--brand);--safe:var(--success);--gold:var(--caution)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Pretendard,system-ui,sans-serif;font-weight:430;letter-spacing:-.013em;line-height:1.72}
.wrap{max-width:1160px;margin:auto;padding:22px 18px 62px}
.back{font-size:13px;color:var(--blue);text-decoration:none}
.hero{position:relative;overflow:hidden;margin:12px 0 14px;padding:30px;border-radius:24px;background:linear-gradient(130deg,#10233f,#253f66);color:#fff}
.hero:after{content:"";position:absolute;right:-115px;top:-190px;width:350px;height:350px;border:1px solid #ffffff2b;border-radius:50%;box-shadow:0 0 0 38px #ffffff0d,0 0 0 82px #ffffff08}
.eyebrow,.chip{font-size:11px;font-weight:630;letter-spacing:.075em}
.eyebrow{color:#c9ddff}
.hero h1{position:relative;z-index:1;margin:7px 0;font-size:clamp(29px,5vw,43px);font-weight:680;letter-spacing:-.055em;line-height:1.16}
.hero p{position:relative;z-index:1;max-width:720px;margin:0;color:#e4dcfa;font-size:15px}
.safe-rule{position:relative;z-index:1;display:inline-flex;margin-top:15px;padding:7px 10px;border:1px solid #ffffff2d;border-radius:999px;background:#ffffff15;font-size:12px}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0}
.stat,.card{background:var(--bg-surface)!important;color:var(--text-primary)!important;border:1px solid #e1e7f0!important;border-radius:18px}
.stat{padding:14px 16px}.stat b{display:block;font-size:21px;font-weight:670}.stat span{font-size:12px;color:#5d6f88}
.card{padding:18px}.card h2,.card h3{margin:0;font-weight:650;letter-spacing:-.035em;color:var(--text-primary)!important}.card h2{font-size:20px}.card h3{font-size:16px}
.muted{color:var(--muted);font-size:13px}
.today{margin:0 0 14px;padding:18px;border:1px solid #8b5bd5;border-radius:20px;background:#6c4ac6;color:#fff;box-shadow:0 10px 24px #2c1a5333}
.today-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.today .kicker{margin:0 0 6px;color:#f2ecfc;font-size:11px;font-weight:650;letter-spacing:.06em}
.today h2{margin:0;font-size:clamp(18px,4vw,24px);letter-spacing:-.04em}
.today .question{margin:10px 0 0;padding:12px 14px;border-left:4px solid #ffffff88;border-radius:0 12px 12px 0;background:#ffffff1f;color:#fff;font-size:14px;line-height:1.55}
.today-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.btn{min-height:44px;padding:10px 14px;border:0;border-radius:12px;background:#10233f;color:#fff;font:650 13px Pretendard,system-ui,sans-serif;cursor:pointer;touch-action:manipulation}
.btn.ghost{background:var(--brand-weak);color:var(--blue)}
.btn:disabled{opacity:.55;cursor:default}
.journey{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:12px 0 0}
.day-card{min-height:88px;padding:10px;border:1px solid #e1e7f0;border-radius:14px;background:#fff;color:#14233b;text-align:left;font:inherit;cursor:pointer;touch-action:manipulation}
.day-card.on{border-color:#6c4ac6;background:#6c4ac6;color:#fff;box-shadow:0 0 0 2px #6c4ac633}
.day-card.done{border-top:4px solid var(--safe)}
.day-card b{display:block;font-size:12px;font-weight:650}
.day-card span{display:block;margin-top:4px;color:#5d6f88;font-size:11px;line-height:1.4}.day-card.on span{color:#f2ecfc}
.phase{margin:0 0 14px;padding:16px 18px;border-radius:18px;border:1px dashed #e1e7f0;background:#fff;color:#14233b}
.phase h2{margin:0 0 6px;font-size:18px}.phase p{margin:0;color:#5d6f88;font-size:13px;line-height:1.6}
.phase.zero{border-color:#e1e7f0}.phase.mid{border-color:var(--safe)}.phase.complete{border-color:#e1e7f0;background:#fff}
.phase-steps{display:grid;gap:8px;margin:12px 0 0;padding:0;list-style:none}
.phase-steps li{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid #e1e7f0;border-radius:12px;background:#fff;font-size:12px;color:#5d6f88}
.phase-steps b{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:7px;background:#6c4ac6;color:#fff;font-size:11px}
.track-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 12px}
.tab{border:1px solid #e1e7f0;border-radius:999px;background:var(--bg-surface)!important;color:var(--text-primary)!important;padding:10px 13px;min-height:44px;font:inherit;font-size:13px;cursor:pointer;touch-action:manipulation}
.tab.on{color:#fff!important;background:var(--brand-action)!important;border-color:var(--accent-violet)!important}
.cluster-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.cluster{padding:14px;border:1px solid #e1e7f0;border-top:4px solid #6c4ac6;border-radius:15px;background:#fff;color:#14233b}
.cluster p{margin:7px 0 0;color:#5d6f88;font-size:12px;line-height:1.5}
.cluster-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:10px}
.cluster-meta button,.lesson-card button,.complete,.choice{min-height:44px;border:0;border-radius:10px;padding:8px 10px;font:inherit;font-size:12px;cursor:pointer;touch-action:manipulation}
.cluster-meta button,.lesson-card button{background:#6c4ac6;color:#fff}
.studio{display:grid;grid-template-columns:.9fr 1.3fr;gap:14px;margin-top:14px}
.lesson-list{display:grid;gap:8px;margin-top:10px}
.lesson-card{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:11px 12px;border:1px solid #e1e7f0;border-radius:13px;background:#fff;color:#14233b}
.lesson-card.on{background:var(--brand-action)!important;border-color:var(--accent-violet)!important;color:#fff!important}
.mini-done{display:inline-flex;margin-left:6px;padding:2px 7px;border-radius:999px;background:var(--success-weak);color:var(--safe);font-size:11px}
.lesson-view h2{margin:8px 0;font-size:clamp(20px,3.5vw,26px);letter-spacing:-.04em}
.lesson-kicker{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:12px}
.lead{margin:0;color:#40536d;font-size:14px}
.visual{margin:12px 0;padding:12px 14px;border-radius:12px;background:var(--bg-surface)!important;color:var(--text-primary)!important;border:1px solid #e1e7f0;font-size:13px;line-height:1.55}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.box{padding:12px 13px;border:1px solid #e1e7f0;border-radius:13px;background:var(--bg-surface)!important;color:var(--text-primary)!important}
.box h3{margin:0 0 6px;font-size:13px;color:#14233b}.box p,.box li{margin:0;font-size:13px;color:#5d6f88;line-height:1.55}
.box ol,.box ul{margin:0;padding-left:18px}
.warning{margin-top:10px;padding:12px;border-radius:12px;background:var(--caution-weak);border:1px solid var(--caution);color:var(--caution);font-size:13px}
.quiz{margin-top:12px;padding:14px;border:1px solid #e1e7f0;border-radius:14px;background:#fff;color:#14233b}
.choices{display:grid;gap:8px;margin-top:10px}
.choice{text-align:left;background:var(--bg-surface)!important;border:1px solid #e1e7f0;color:var(--text-primary)!important;padding:12px 12px;min-height:44px}
.choice.good{border-color:var(--safe)!important;background:var(--success-weak)!important}
.choice.bad{border-color:var(--danger)!important;background:var(--danger-weak)!important}
.feedback{display:none;margin-top:10px;padding:12px;border-radius:12px;background:#fff;border:1px solid #e1e7f0;color:#14233b;font-size:13px;line-height:1.55}
.feedback.on{display:block}
.complete-row{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}
.complete{background:#10233f;color:#fff;min-height:44px;padding:10px 14px}
.complete:disabled{opacity:.55}
.reason-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.reason-tag{display:inline-flex;align-items:center;padding:5px 8px;border:1px solid #8b5bd5;border-radius:999px;background:#fff;color:#6c4ac6;font-size:11px;line-height:1.35}
.review-path{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.review-path a{display:inline-flex;align-items:center;min-height:44px;padding:8px 11px;border-radius:10px;background:var(--brand-weak);color:var(--blue);text-decoration:none;font-size:12px;font-weight:620}
.footer{margin-top:18px;color:var(--muted);font-size:12px;line-height:1.6}
@media(max-width:900px){.studio{grid-template-columns:1fr}.cluster-grid{grid-template-columns:1fr 1fr}.journey{grid-template-columns:repeat(4,minmax(0,1fr))}.stats{grid-template-columns:1fr 1fr}.two{grid-template-columns:1fr}}
@media(max-width:520px){.journey{grid-template-columns:repeat(2,minmax(0,1fr))}.cluster-grid{grid-template-columns:1fr}.hero{padding:22px}.wrap{padding:16px 14px 52px}}
@media(max-width:360px){.wrap{padding:14px 10px 48px}.hero{padding:18px 14px}.stats{grid-template-columns:1fr 1fr;gap:8px}.journey{grid-template-columns:1fr 1fr;gap:6px}.btn,.choice,.complete{font-size:12.5px}}
/* GB-12: Concept Expedition focus-first (mobile one lesson; maps/recommendations collapsed) */
.collapse-toggle{display:none;width:100%;min-height:44px;margin:0 0 10px;padding:10px 12px;border:1px solid #8b5bd5;border-radius:12px;background:#fff;color:#6c4ac6;font:650 13px Pretendard,system-ui,sans-serif;text-align:left;cursor:pointer;touch-action:manipulation}
.collapse-toggle .hint{display:block;margin-top:3px;color:var(--muted);font-size:11.5px;font-weight:500}
.collapse-body[hidden]{display:none!important}
.next-handoff{margin-top:12px;padding:12px 14px;border:1px solid #8b5bd5;border-radius:14px;background:#6c4ac6;color:#fff}
.next-handoff b{display:block;margin:0 0 6px;font-size:13px;color:#fff}
.next-handoff p{margin:0 0 10px;color:#f2ecfc;font-size:12.5px;line-height:1.55}
.next-actions{display:flex;flex-wrap:wrap;gap:8px}
.next-actions a,.next-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;border-radius:11px;border:0;font:650 12.5px Pretendard,system-ui,sans-serif;text-decoration:none;cursor:pointer;touch-action:manipulation}
.next-actions .primary{background:#10233f;color:#fff}
.next-actions .ghost{background:#ffffff1f;color:#fff;border:1px solid #ffffff55}
.focus-chip{display:inline-flex;align-items:center;gap:6px;margin:0 0 8px;padding:4px 9px;border-radius:999px;background:#6c4ac6;color:#fff;font-size:11px;font-weight:700}
.studio.mobile-focus{display:flex;flex-direction:column}
.studio.mobile-focus .lesson-view{order:-1}
.studio.mobile-focus .lesson-rail{order:1}
@media(max-width:760px){
  .collapse-toggle{display:flex;flex-direction:column;align-items:flex-start}
  .map-panel.is-collapsed .collapse-body,
  .lesson-rail.is-collapsed .collapse-body{display:none!important}
  .map-panel:not(.is-collapsed) .collapse-body,
  .lesson-rail:not(.is-collapsed) .collapse-body{display:block}
  .studio{grid-template-columns:1fr}
  .studio.mobile-focus .lesson-view{scroll-margin-top:10px}
  .stats{grid-template-columns:1fr 1fr}
  .phase-steps li{font-size:12px}
}
@media(min-width:761px){
  .collapse-toggle{display:none!important}
  .map-panel .collapse-body,
  .lesson-rail .collapse-body{display:block!important}
  .map-panel.is-collapsed .collapse-body,
  .lesson-rail.is-collapsed .collapse-body{display:block!important}
}

/* Final light/dark card-tier overrides */
/* Loaded after product-theme.css on purpose: its blanket rules for
       .card/.box/.visual/.tab/.choice (background/color/border, all
       !important) reach into every nested box here (everything lives
       inside .lesson-view.card / #mapPanel.card), overriding the
       white/violet two-tier system above. Re-declaring them last (same
       importance, later source order) wins the tie without a specificity
       fight against product-theme.css. */
    .card,.box,.visual,.stat,.day-card,.phase,.phase-steps li,.cluster,.lesson-card,.quiz,.feedback,.reason-tag,.collapse-toggle{background:var(--bg-surface)!important;color:var(--text-primary)!important;border-color:var(--border-default)!important}
    .choice{background:var(--bg-surface)!important;color:var(--text-primary)!important;border-color:var(--border-default)!important}
    .tab{background:var(--bg-surface)!important;color:var(--text-primary)!important;border-color:var(--border-default)!important}
    .tab.on{background:var(--brand-action)!important;color:#fff!important;border-color:var(--accent-violet)!important}
    .day-card.on,.lesson-card.on{background:var(--brand-action)!important;color:#fff!important;border-color:var(--brand-action)!important}
    .day-card.on *,.lesson-card.on *{color:#fff!important}
    .card h2,.card h3,.cluster h3,.quiz h3{color:var(--text-primary)!important}
    .card p,.card li,.box p,.box li,.box .muted,.quiz .muted,.cluster p{color:var(--text-secondary)!important}
    .cluster .overline{color:var(--text-secondary)!important}
    .card .lesson-kicker{color:var(--text-secondary)!important}
    .stat span,.phase p,.phase-steps li,.day-card span,.lesson-card span,.feedback,.reason-tag{color:var(--text-secondary)!important}
    .today .muted,.today .kicker{color:#fff!important}
    .next-handoff,.next-handoff *{color:#fff!important}
    body .day-card.on *,body .lesson-card.on *,body .next-handoff *{color:#fff!important}
    .card .next-handoff b,.card .next-handoff p{color:#fff!important}
    .next-handoff .next-actions .ghost{background:#ffffff1f!important;color:#fff!important;border-color:#ffffff55!important}