/* 5.0.3: content-sized panels, illustrated learning worlds and Voice Map. */
.dashboard-grid { align-items: start; }
.dashboard-grid > .main-column { display: grid; gap: 22px; min-width: 0; align-content: start; }
.dashboard-grid > .side-column { display: flex; flex-direction: column; gap: 22px; align-self: start; }
.dashboard-grid .quest-panel { align-self: start; min-height: 0; background: linear-gradient(135deg,#fffaf0f7,#f0ecfaf5); border: 1px solid #ded2eb; box-shadow: 0 8px 30px #16254924; }
.quest-panel .section-heading { margin-bottom: 20px; }
.quest-panel .quest-map { grid-template-columns: repeat(auto-fit,minmax(min(100%,240px),1fr)); gap: 16px; }
.quest-panel .quest-node { min-width: 0; min-height: 156px; padding: 20px; border-radius: 20px; background: linear-gradient(135deg,#fffefc,#f3edfd); border: 1px solid #d8cbe9; border-bottom: 4px solid #c5b6dc; box-shadow: 0 6px 14px #70608c0b; }
.quest-panel .quest-node::after { content: ''; position: absolute; right: 14px; top: 15px; width: 65px; height: 65px; background: url('/rpg/portal-0.svg') center/contain no-repeat; opacity: .55; pointer-events: none; }
.quest-panel .quest-node h4 { position: relative; font-size: 20px; line-height: 1.3; margin: 13px 0 7px; z-index: 1; }
.quest-panel .quest-node p { font-size: 14px; line-height: 1.5; padding-right: 0; margin-bottom: 24px; }
.quest-panel .quest-node .quest-number { width: 40px; height: 40px; background: #e8dff7; color: #654c92; border: 1px solid #d3c3e9; box-shadow: 0 3px 0 #d1c1e6; }
.quest-panel .quest-node .quest-stars { right: 18px; bottom: 14px; font-size: 17px; }
.quest-panel .quest-node.completed { border-color: #a8cabb; border-bottom-color: #82b29c; background: linear-gradient(135deg,#f9fff5,#e8f7f0); }
.quest-panel .quest-node:hover { transform: translateY(-3px); box-shadow: 0 10px 22px #59427820; }
.main-column .badge-card { background: linear-gradient(135deg,#fffaf0f7,#f3edf9f7); }
.main-column .badge-card #badges { grid-template-columns: repeat(auto-fit,minmax(104px,1fr)); gap: 14px; }
.main-column .badge-card #badges > .badge { min-height: 140px; padding: 12px 7px; gap: 7px; }
.main-column .badge-card #badges > .badge > .achievement-emblem { width: 64px; height: 70px; }
.main-column .badge-card #badges > .badge > small { font-size: 13px; }

/* Each world gets a genuine illustration area and a readable content area. */
.world-portals .world-portal { display: flex; flex-direction: column; padding: 0; gap: 0; align-items: stretch; min-height: 0; border-radius: 23px; border: 1px solid #ddd1eb; border-bottom: 4px solid #bca9d5; background: #fffdf9; box-shadow: 0 8px 24px #14203a24; }
.world-portals .world-portal::before { display: none; }
.world-portals .world-portal .portal-icon { width: 100%; height: auto; min-height: 120px; max-height: 172px; aspect-ratio: 2 / 1; margin: 0; overflow: hidden; border-radius: 0; border-bottom: 1px solid #e1d4eb; }
.world-portals .world-portal .portal-icon img { display: block; width: 100%; height: 100%; object-fit: cover; filter: none; transition: transform .25s ease; }
.world-portals .world-portal:hover .portal-icon img { transform: scale(1.035); }
.world-portals .world-portal > div:nth-child(2) { padding: 17px 18px 18px; flex: 1; min-width: 0; }
.world-portals .world-portal .eyebrow { font-size: 10px; letter-spacing: .12em; color: #77608e; margin: 0 0 8px; }
.world-portals .world-portal h3 { color: #283650; font-size: 21px; line-height: 1.3; margin: 0 0 9px; }
.world-portals .world-portal p:not(.eyebrow) { font-size: 14px; font-weight: 500; color: #66708a; line-height: 1.55; }
.world-portals .world-portal small { display: block; font-size: 12px; line-height: 1.6; color: #625476; }
.world-portals .portal-progress { width: 100%; margin: 15px 0 8px; height: 7px; background: #eae5f1; }
.world-portals .portal-arrow { display: grid; position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 1px solid #ffffffb8; background: #ffffffe8; color: #7156a3; box-shadow: 0 3px 9px #5b4b7120; font-size: 18px; }
.world-portals .portal-tag { display: inline-block; align-self: flex-start; margin: 0 18px 17px; background: #eee6fa; color: #655082; font-size: 12px; }
.world-portals .reading-portal { border-bottom-color: #a894bf; }
.world-portals .synonym-portal { border-bottom-color: #82bbae; }
.world-portals .speaking-portal { border-bottom-color: #9da8d1; }
.world-portals .grammar-portal { border-bottom-color: #b4a2d2; }

/* Voice missions stay recognisable while becoming small illustrated adventures. */
.speaking-map-panel { background: radial-gradient(ellipse at 100% 0,#e5dbf780,transparent 55%),linear-gradient(#f9f6ff,#edf4f9); padding: 20px 16px; }
.speaking-map-head { padding: 20px; margin-bottom: 16px; border: 1px solid #d7cae7; border-radius: 22px; background: linear-gradient(90deg,#fff9f0f5,#f4eeffcc),url('/rpg/scenes/voice.svg') right center/cover; box-shadow: 0 4px 0 #ded5eb; }
.speaking-map-head .eyebrow { font-size: 12px; letter-spacing: .14em; color: #775ba0; }
.speaking-map-head h3 { font-size: 29px; line-height: 1.25; color: #33415e; margin: 7px 0; }
.speaking-map-head > span { font-size: 14px; color: #73768e; line-height: 1.5; }
.speaking-term-tabs { gap: 10px; margin-bottom: 18px; padding: 5px; border: 1px solid #ddd1ec; background: #eae3f3; border-radius: 18px; }
.speaking-term-tabs button { min-height: 48px; font-size: 15px; padding: 10px; border-radius: 13px; border: 1px solid transparent; box-shadow: none; color: #69637e; background: transparent; }
.speaking-term-tabs button.active { background: linear-gradient(120deg,#7663b0,#9978c3); color: #fff; box-shadow: 0 3px 0 #5f4c93,0 6px 12px #6d4d9220; }
.speaking-mission-list { position: relative; gap: 14px; }
.speaking-mission-card { position: relative; isolation: isolate; display: grid; grid-template-columns: 76px minmax(0,1fr); grid-template-rows: auto auto; column-gap: 14px; row-gap: 7px; padding: 14px; min-height: 110px; border-radius: 22px; border: 1px solid #d9cee8; border-bottom: 3px solid #d0c1e2; background: linear-gradient(135deg,#fffefa,#f5f0fb); box-shadow: 0 5px 14px #6f577a0a; color: #49526d; }
.speaking-mission-card:hover { transform: translateY(-2px); border-color: #ae95c8; }
.speaking-mission-card.active { background: linear-gradient(115deg,#665494,#9472b6); border: 1px solid #c7abdc; border-bottom: 3px solid #4e3d7a; color: #fff9ed; box-shadow: 0 7px 20px #684e902c; }
.speaking-mission-art { grid-row: 1 / 3; display: block; position: relative; width: 76px; height: 80px; border-radius: 17px; background: #eee4fb; border: 2px solid #fff9ef; box-shadow: 0 3px 0 #cdb9e0; overflow: hidden; }
.speaking-mission-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.speaking-mission-art .speaking-mission-no { position: absolute; left: 3px; bottom: 3px; width: 25px; height: 25px; border-radius: 8px; font-size: 13px; background: #fff9eef2; color: #66508a; box-shadow: 0 1px 4px #34305624; }
.speaking-mission-card.active .speaking-mission-no { background: #fff3d5; color: #71548d; }
.speaking-mission-copy { min-width: 0; }
.speaking-mission-card b { font-size: 17px; line-height: 1.4; overflow-wrap: anywhere; }
.speaking-mission-card small { display: block; font-size: 13px; line-height: 1.5; opacity: 1; color: #7b758c; margin-top: 5px; }
.speaking-mission-card.active small { color: #f0e1ff; }
.speaking-mission-stars { grid-column: 2; font-size: 16px; line-height: 1.1; letter-spacing: .1em; color: #a18040; }
.speaking-mission-card.active .speaking-mission-stars { color: #ffe2a1; }
.speaking-browser-note { border-color: #cbdfe5; background: linear-gradient(130deg,#effaff,#edf5f5); padding: 16px; box-shadow: 0 3px 0 #d9e8eb; }
.speaking-browser-note b { font-size: 14px; margin-bottom: 7px; }
.speaking-browser-note span { font-size: 13px; line-height: 1.6; font-weight: 500; }
@media(min-width:981px) { .speaking-body { grid-template-columns: clamp(300px,25vw,370px) minmax(0,1fr); } }
@media(min-width:1280px) { .world-portals { grid-template-columns: repeat(5,minmax(0,1fr)); } }
@media(min-width:760px) and (max-width:1279px) { .world-portals { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media(max-width:1000px) {
  .dashboard-grid > .side-column { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(min-width:641px) and (max-width:980px) {
  .speaking-mission-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width:759px) {
  .world-portals { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .world-portals .world-portal { display: grid; grid-template-columns: 112px minmax(0,1fr); }
  .world-portals .world-portal .portal-icon { grid-row: 1 / 3; min-height: 100%; max-height: none; height: 100%; aspect-ratio: auto; border-bottom: 0; border-right: 1px solid #e4d9ef; }
  .world-portals .world-portal > div:nth-child(2) { padding: 15px; }
  .world-portals .world-portal h3 { font-size: 19px; }
  .world-portals .portal-arrow { display: none; }
  .world-portals .portal-tag { grid-column: 2; margin: 0 15px 14px; justify-self: start; }
  .dashboard-grid > .side-column { grid-template-columns: minmax(0,1fr); }
  .quest-panel .quest-map { grid-template-columns: repeat(auto-fit,minmax(min(100%,200px),1fr)); }
}
@media(max-width:640px) {
  .speaking-map-panel { padding: 14px; }
  .speaking-map-head { padding: 16px; }
  .speaking-mission-list { display: grid; grid-template-columns: minmax(0,1fr); }
}
@media(prefers-reduced-motion:reduce) {
  .world-portals .world-portal .portal-icon img { transition: none; }
  .world-portals .world-portal:hover .portal-icon img { transform: none; }
}