/* R27: shared comic panels for every child-facing activity. */
.comic-portal{--comic-ink:#174b49;--comic-shadow:#9dcbd1;background:#e9f8fc;font-family:ui-rounded,'Trebuchet MS',Arial,sans-serif}
.comic-art{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#fffcf1}
.comic-portal :is(h1,h2,h3){font-family:ui-rounded,'Trebuchet MS',Arial,sans-serif;letter-spacing:-.025em;line-height:1.25}
.comic-portal :is(button,a,input,select,summary):focus-visible{outline:4px solid #b45214;outline-offset:4px}
.comic-portal :is(.discovery-card,.diary-world,.kids-book,.charter-card,.level,.listen-options article,.adventure-card){border:2px solid var(--comic-ink);box-shadow:4px 5px 0 var(--comic-shadow);border-radius:22px;overflow:hidden}
.comic-portal :is(.kids-primary,.quest-main,.primary,.play-action,.lux-controls button){border:2px solid var(--comic-ink);box-shadow:2px 3px 0 var(--comic-shadow);border-radius:16px}
.comic-portal :is(.welcome-title,.kids-section-heading h2,.journey-heading-copy h2){font-family:ui-rounded,'Trebuchet MS',Arial,sans-serif}
.comic-portal .welcome-choices{gap:18px}
.comic-portal .welcome-choices>a{padding:10px 10px 20px;border:2px solid var(--comic-ink);background:#fffdf4;box-shadow:3px 4px 0 var(--comic-shadow);border-radius:20px;overflow:hidden}
.comic-portal .welcome-choices .comic-art{border-radius:12px;aspect-ratio:4/3;margin-bottom:12px}
.comic-portal .welcome-choices strong,.comic-portal .welcome-choices small{padding-inline:8px}
.comic-portal .welcome-choices small{font-size:1rem}
.comic-portal .listen-options .comic-art{border-radius:12px;margin-bottom:16px;max-height:240px}
.comic-portal .kids-theme-icon{width:100%;height:auto!important;padding:0;background:none;transform:none;border-radius:12px;overflow:hidden}
.comic-portal .kids-theme-icon .comic-art{height:auto}
.comic-portal .kids-theme{padding:10px 10px 18px;border:2px solid var(--comic-ink);box-shadow:3px 4px 0 var(--comic-shadow);background:#fffdf4}
.comic-portal .kids-theme strong{margin-top:12px}
.comic-portal .charter-home>span{width:180px;height:auto;background:none;flex:none}
.comic-portal .charter-home>span .comic-art{border-radius:18px}
.comic-portal .home-journey,.comic-portal .journey-heading-copy,.comic-portal .diary-heading{border:2px solid var(--comic-ink);border-radius:24px;background:#fffdf4;padding:24px;box-shadow:4px 5px 0 var(--comic-shadow)}
.comic-portal .journey-heading-copy h2{font-size:clamp(2rem,4vw,3rem)!important}
.comic-portal .journey-diary-preview{border:2px solid var(--comic-ink);box-shadow:3px 4px 0 var(--comic-shadow)}
.comic-portal .journey-diary-preview .diary-preview-picture{width:140px;height:105px;background:#fffcf1}
.comic-portal .diary-heading{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,32%);column-gap:24px;margin-bottom:30px}
.comic-portal .diary-heading>*{grid-column:1}
.comic-portal .diary-heading>.comic-art{grid-column:2;grid-row:1/9;align-self:center;border-radius:18px}
.comic-portal .diary-world-head .world-symbol{display:none}
.comic-portal #categories button{border:2px solid var(--comic-ink)!important;box-shadow:3px 4px 0 var(--comic-shadow)}
.comic-portal #categories button[aria-pressed=true]{outline:3px solid #087caa;outline-offset:3px}
.comic-portal :is(.theme-picture,.discovery-landscape,.diary-landscape,.charter-card-picture){aspect-ratio:4/3;object-fit:contain;background:#fffcf1;padding:0}
.comic-portal .discovery-art{margin:0 12px;border:2px solid var(--comic-ink);border-radius:14px}
.comic-portal .discovery-art:after{display:none}
.comic-portal #topic-dialog{border:3px solid var(--comic-ink);background:#eaf8fc}
.comic-portal .quest-toolbar{background:#fffcf1}
.comic-portal .quest-landscape{display:none}
.comic-portal .quest-heading{gap:18px;align-items:center}
.comic-portal .quest-emblem{width:140px;height:auto;border:2px solid var(--comic-ink);border-radius:16px;transform:none;overflow:hidden}
.comic-portal .quest-emblem .comic-art{height:auto}
.comic-portal .quest-heading h2{font-size:clamp(1.5rem,3vw,2rem)}
.comic-portal .quest-steps{border:2px solid var(--comic-ink);background:#fffcf1}
.comic-portal .quest-steps button{font-size:1rem;min-width:0;padding:8px;gap:6px}
.comic-story-panels{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:20px;align-items:start}
.comic-story-panels>.comic-art{border:2px solid var(--comic-ink);border-radius:18px;position:sticky;top:100px}
.comic-portal .quest-story-text{padding:0;border:0;background:none}
.comic-portal .quest-story-text p{border:2px solid var(--comic-ink);border-radius:18px;background:#fffdf4;padding:20px;margin:0 0 18px;font-size:1.125rem;line-height:1.75;box-shadow:3px 4px 0 var(--comic-shadow)}
.comic-portal .quest-game>h3,.comic-portal .world-question>h3{background:#fffcf1;border:2px solid var(--comic-ink);border-radius:22px;padding:18px 22px;box-shadow:3px 4px 0 var(--comic-shadow);max-width:none}
.comic-portal .quest-choice{padding:12px;gap:0;border:2px solid var(--comic-ink);background:#fffdf4;justify-content:flex-start;box-shadow:3px 4px 0 var(--comic-shadow);min-width:0;overflow:visible}
.comic-portal .quest-choice .comic-art{border-radius:14px;width:100%;max-height:210px;object-fit:contain}
.comic-portal .quest-choice .comic-choice-scene{max-height:270px}
.comic-portal .quest-choice strong,.comic-portal .comic-answer-label{display:block;position:relative;max-width:none;width:100%;background:white;border:2px solid var(--comic-ink);border-radius:18px;padding:16px 12px;margin-top:18px;font-size:1.125rem;font-weight:700;line-height:1.45;overflow-wrap:anywhere}
.comic-portal .quest-choice strong:before,.comic-portal .comic-answer-label:before{content:'';position:absolute;top:-9px;left:25%;width:14px;height:14px;transform:rotate(45deg);background:white;border-left:2px solid var(--comic-ink);border-top:2px solid var(--comic-ink)}
.comic-portal .quest-choice:hover{background:#eef8f4;transform:translateY(-2px)}
.comic-portal .quest-choice.selected{outline:3px solid #167b64;outline-offset:2px;background:#e6f2dd}
.comic-portal .quest-feedback,.comic-portal .quest-clue{border:2px solid var(--comic-ink);box-shadow:3px 4px 0 var(--comic-shadow);background:#fffdf4}
.comic-portal .quest-feedback.success{background:#e2f1dc}
.comic-portal .quest-collected>.comic-art{width:min(100%,380px);margin:6px auto 24px;border:2px solid var(--comic-ink);border-radius:22px;box-shadow:4px 5px 0 var(--comic-shadow)}
.comic-portal .quest-collected h3{background:#fffdf4;border:2px solid var(--comic-ink);border-radius:18px;padding:18px}
.comic-portal .charter-symbol,.comic-portal .charter-motto-icon{display:none}
.comic-portal .charter-card-top{justify-content:flex-end}
.comic-portal .charter-example,.comic-portal .charter-motto{border:2px solid var(--comic-ink);background:#fffdf4}
.comic-portal .charter-example p{padding:18px}
.comic-portal .charter-word-panel{border:2px solid var(--comic-ink);border-radius:22px;background:#fffdf4}
.comic-portal #book-dialog .page-stage{border:2px solid var(--comic-ink);border-radius:14px;overflow:hidden}
.comic-portal #book-dialog .page-stage pre{white-space:pre-wrap;overflow-wrap:anywhere}
.comic-portal .game-content{border:2px solid var(--comic-ink);border-radius:20px;background:#f3fbfc}
.comic-portal .game-intro,.comic-portal #world-message:not(:empty){background:#fffdf4;border:2px solid var(--comic-ink);border-radius:20px;padding:18px}
.comic-portal .play-action.comic-answer{display:flex;flex-direction:column;padding:12px;min-width:0;background:#fffdf4;color:var(--comic-ink);flex:1}
.comic-portal .play-action.comic-answer .comic-art{max-height:160px;border-radius:12px}
.comic-portal #world-success>.comic-art{max-width:300px;margin:0 auto 18px;border-radius:20px}
.comic-portal .charter-words dt>span .comic-art{width:75px;border-radius:10px}
.comic-portal .charter-words dt>span{width:auto;height:auto;background:none}
.comic-portal article[data-scene]{border:2px solid var(--comic-ink);border-radius:22px;background:#fffdf4;box-shadow:4px 5px 0 var(--comic-shadow)}
.comic-portal article[data-scene] .story{border:2px solid var(--comic-ink);border-radius:18px;padding:20px;background:white}
/* Language games and the LUX reader use the same panel and speech-bubble system. */
.comic-portal .level .label{padding:18px}
.comic-portal .lesson-layout>.play,.comic-portal .phrase{border:2px solid var(--comic-ink);border-radius:22px;background:#fffdf4;padding:20px}
.comic-portal .choices>.choice{border:2px solid var(--comic-ink);box-shadow:3px 4px 0 var(--comic-shadow);border-radius:20px;background:#fffdf4;padding:12px}
.comic-portal .choices>.choice>.comic-art{max-height:150px;border-radius:12px}
.comic-portal .choices>.choice .symbol{font-size:2.5rem}
.comic-portal .choices>.choice.correct{background:#dcefd4}
.comic-portal .lux-question{border:2px solid var(--comic-ink);border-radius:22px;background:#f0fbff}
.comic-portal .lux-answers>button{border:2px solid var(--comic-ink);border-radius:18px;padding:12px;background:#fffdf4;color:var(--comic-ink);display:flex;flex-direction:column;flex:1;min-width:0}
.comic-portal .lux-answers .comic-art{max-height:160px;border-radius:12px}
.comic-portal.lux-playing main>article{border:2px solid var(--comic-ink);box-shadow:4px 5px 0 var(--comic-shadow)}
.comic-portal.lux-playing .box{border:2px solid var(--comic-ink);background:#fff8d9}
@media(max-width:600px){
 .comic-portal .welcome-choices{gap:12px}
 .comic-portal .welcome-choices>a{padding:8px 8px 16px}
 .comic-portal .welcome-choices strong{font-size:1.25rem}
 .comic-portal .quest-heading{gap:12px;align-items:flex-start}
 .comic-portal .quest-emblem{width:82px;border-radius:12px}
 .comic-portal .quest-heading h2{font-size:1.4rem}
 .comic-story-panels{grid-template-columns:1fr}
 .comic-story-panels>.comic-art{position:static;max-height:210px}
 .comic-portal .quest-choices{gap:12px}
 .comic-portal .quest-choice{padding:8px}
 .comic-portal .quest-choice strong{font-size:1rem;padding:12px 8px}
 .comic-portal .quest-choice .comic-art{max-height:160px}
 .comic-portal .diary-heading{display:block;padding:20px}
 .comic-portal .diary-heading>.comic-art{max-width:240px;margin:20px auto 0}
 .comic-portal .charter-home>span{width:140px}
 .comic-portal .kids-theme:last-child{display:flex;grid-column:auto;min-height:0}
 .comic-portal .kids-theme:last-child .kids-theme-icon{width:100%}
 .comic-portal .quest-steps button{font-size:1rem;gap:4px}
 .comic-portal .world-question .play-row{display:grid;grid-template-columns:1fr 1fr}
}
@media(max-width:380px){.comic-portal .quest-choices,.comic-portal .world-question .play-row{grid-template-columns:1fr}.comic-portal .quest-heading{display:block}.comic-portal .quest-emblem{display:none}}
@media(prefers-reduced-motion:reduce){.comic-portal .quest-choice:hover{transform:none}}
@media print{.comic-art,.comic-story-panels>.comic-art{display:none!important}.comic-story-panels{display:block}.comic-portal .quest-story-text p{box-shadow:none}}
