/* 20.06. Scoped to the new introduction and its opt-in recovery card. */
.intro20-entry { width:100%; max-width:1120px; margin:auto; color:var(--ink,#274f46); }
.intro20-entry header { margin:0 0 20px; }
.intro20-entry h1 { font-size:clamp(1.85rem,3.7vw,2.65rem); line-height:1.15; margin:8px 0 14px; overflow-wrap:anywhere; }
.intro20-entry-layout { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:30px; align-items:center; }
.intro20-entry-map { margin:0; border:1px solid #c9dbcb; border-radius:22px; overflow:hidden; background:#e1efe7; min-width:0; }
.intro20-entry-drawing { width:100%; aspect-ratio:1000/760; }
.intro20-entry-drawing > svg { display:block; width:100%; height:100%; max-width:none; pointer-events:none; }
.intro20-entry-map figcaption { display:flex; flex-direction:column; gap:6px; background:#f3f6e9; padding:16px 20px; border-top:1px solid #c9dbcb; font-size:.93em; }
.intro20-entry-copy { min-width:0; }
.intro20-entry-copy p { line-height:1.5; margin:0 0 16px; }
.intro20-entry-luma { display:grid; grid-template-columns:72px minmax(0,1fr); gap:14px; align-items:center; margin-bottom:20px; }
.intro20-entry-luma > span { width:72px; background:#e8eedc; border-radius:18px; }
.intro20-entry-luma svg { display:block; width:72px; height:82px; }
.intro20-entry-luma strong { font-size:.8em; letter-spacing:.09em; text-transform:uppercase; }
.intro20-entry-luma p { font-size:1.09em; margin:6px 0 0; }
.intro20-entry-mission { display:grid; grid-template-columns:68px minmax(0,1fr); gap:14px; padding:16px; background:#fffdf5; border:1px solid #c9dbcb; border-radius:18px; margin:18px 0; align-items:center; }
.intro20-entry-mission svg { width:68px; height:68px; }
.intro20-entry-mission p { margin:4px 0 0; font-size:.87em; }
.intro20-entry-context { font-size:.9em; }
.intro20-entry-actions { display:flex; flex-wrap:wrap; align-items:stretch; gap:10px; margin-top:22px; }
.intro20-entry-button { font:inherit; font-weight:600; line-height:1.3; min-height:48px; min-width:48px; padding:12px 18px; background:#fffdf5; color:#2c5c4e; border:1px solid #91b3a1; border-radius:15px; cursor:pointer; white-space:normal; overflow-wrap:anywhere; }
.intro20-entry-primary { flex-basis:100%; background:#2c6554; color:#fff; border:2px solid #2c6554; padding:15px 20px; }
.intro20-entry-button:focus-visible { outline:3px solid #8a5227; outline-offset:4px; }
.intro20-entry-button:hover { border-color:#254f40; }
.intro20-resume-card { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px 24px; border:1px solid #91b3a1; background:#f3f6e9; border-radius:18px; padding:16px 20px; margin-bottom:22px; }
.intro20-resume-card > div { flex:1 1 230px; min-width:0; }
.intro20-resume-card h2 { font-size:1.05em; margin:0 0 7px; }
.intro20-resume-card p { font-size:.9em; line-height:1.45; margin:0; }
.intro20-entry-message { padding:22px; border:1px solid #c9dbcb; border-radius:22px; background:#fffdf5; }
body.intro20-entry-page:not(.adult-mode) .workspace, body.intro20-reminder-page:not(.adult-mode) .workspace { height:auto; min-height:var(--view-height); }
body.intro20-entry-page:not(.adult-mode) .main, body.intro20-reminder-page:not(.adult-mode) .main { flex:1 0 auto; min-height:min-content; }
body.intro20-entry-page .app-footer, body.intro20-reminder-page .app-footer { height:auto; position:static; margin-top:16px; }
.high-contrast .intro20-entry-map, .high-contrast .intro20-entry-mission, .high-contrast .intro20-resume-card { border-color:#234c3e; }
.high-contrast .intro20-entry-button { border-width:2px; border-color:#234c3e; }
@media(max-width:850px) { .intro20-entry-layout { grid-template-columns:1fr; gap:22px; } .intro20-entry-map { width:100%; max-width:620px; margin:auto; } }
@media(max-width:430px) { .intro20-entry-actions { flex-direction:column; } .intro20-entry-luma { grid-template-columns:56px minmax(0,1fr); gap:12px; } .intro20-entry-luma > span,.intro20-entry-luma svg { width:56px; } .intro20-entry-map figcaption { padding:14px 16px; } }