body:has(.fw-experience-dialog[open]){overflow:hidden}
.fw-experience-dialog{box-sizing:border-box;width:min(650px,96vw);max-width:96vw;max-height:96dvh;padding:20px;border:1px solid #cad8eb;border-radius:16px;color:#16365c;background:#fff;box-shadow:0 24px 80px #102c5133}
.fw-experience-dialog::backdrop{background:#102c5199}
.fw-experience-dialog[open]{display:flex;flex-direction:column;gap:12px}
.fw-experience-dialog.has-content{width:min(1280px,98vw);height:94dvh}
.fw-experience-dialog>header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.fw-experience-dialog h2{font-size:22px;margin:0}
.fw-experience-dialog button{padding:10px 16px;border:1px solid #bccfe9;border-radius:8px;color:#204c87;background:#fff;cursor:pointer;font:inherit}
.fw-experience-dialog button:focus-visible{outline:3px solid #427fe0;outline-offset:2px}
.fw-experience-dialog>header button,.fw-experience-dialog button[aria-pressed=true]{background:#204c87;color:#fff}
.fw-experience-dialog>nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.fw-experience-note{font-size:14px;margin:0;color:#4a6383;text-align:center}
.fw-experience-dialog>iframe{flex:1;min-height:0;width:100%;border:1px solid #dce4ef;border-radius:8px;background:#f6f8fc}
.fw-experience-dialog>iframe[hidden]{display:none}
@media(max-width:600px){.fw-experience-dialog{padding:12px}.fw-experience-dialog.has-content{height:98dvh}.fw-experience-dialog h2{font-size:18px}.fw-experience-dialog button{padding:8px 10px;font-size:14px}.fw-experience-note{font-size:12px}}

/* Only the experience dialogs fill the available screen. */
.fw-experience-dialog,.fw-experience-dialog.has-content{position:fixed;inset:0;margin:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border:0;border-radius:0;padding:0;overflow:hidden;box-sizing:border-box}
.fw-experience-dialog[open]{gap:0}
.fw-experience-dialog>header{flex:none;padding:12px 16px;background:white}
.fw-experience-dialog>header button{min-width:64px;min-height:44px}
.fw-experience-dialog>nav{flex:none;flex-wrap:nowrap;justify-content:center;overflow-x:auto;padding:4px 12px;gap:8px}
.fw-experience-dialog>nav button{flex:none;white-space:nowrap;min-height:44px}
.fw-experience-dialog>.fw-experience-note{flex:none;padding:6px 12px 10px}
.fw-experience-dialog>iframe{display:block;box-sizing:border-box;width:100%;min-height:0;border:0;border-top:1px solid #dce4ef;border-radius:0;flex:1 1 0}
.fw-experience-dialog>iframe[hidden]{display:none}
@media(max-width:600px){.fw-experience-dialog>header{padding:8px 12px}.fw-experience-dialog>nav{justify-content:flex-start}.fw-experience-dialog h2{font-size:17px}.fw-experience-dialog>.fw-experience-note{font-size:12px;padding:4px 12px 8px}}

.fw-experience-dialog>nav[hidden],.fw-experience-dialog>.fw-experience-note[hidden]{display:none!important}
.fw-experience-dialog>header h2{flex:1;min-width:0}
.fw-experience-dialog>header button{flex:none}
@media(max-width:600px){.fw-experience-dialog>header{gap:6px;padding:6px 8px}.fw-experience-dialog>header h2{font-size:15px}.fw-experience-dialog>header button{padding:6px 8px;min-width:44px;font-size:13px}}

.fw-experience-dialog>header .fw-experience-home{white-space:nowrap}
@media(max-width:600px){.fw-experience-dialog:is([data-mode="learning"],[data-mode="game"],[data-mode="paper"])>header{flex-wrap:wrap}.fw-experience-dialog:is([data-mode="learning"],[data-mode="game"],[data-mode="paper"])>header h2{flex-basis:calc(100% - 72px)}.fw-experience-dialog:is([data-mode="learning"],[data-mode="game"],[data-mode="paper"])>header .fw-experience-home{min-width:54px}}

/* Keep the return control at the visible start of the trial header. */
.fw-experience-dialog>header{box-sizing:border-box;width:100%;min-width:0;flex-wrap:wrap}
.fw-experience-dialog>header .fw-experience-back{order:-1;white-space:nowrap;flex:0 0 auto}
@media(max-width:600px){.fw-experience-dialog>header h2{flex:1 1 140px}.fw-experience-dialog>header .fw-experience-back{font-size:13px}}

.fw-experience-dialog>nav.fw-experience-article-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:min(1440px,100%);box-sizing:border-box;margin:32px auto 12px;padding:0 24px;gap:20px;overflow-y:auto;flex:0 1 auto;align-items:stretch}
.fw-experience-dialog .fw-experience-article-cards button{display:flex;flex-direction:column;min-width:0;white-space:normal;text-align:left;padding:0;overflow:hidden;background:#fff;color:#16365c;border:1px solid #bccfe9;border-radius:12px}
.fw-experience-edition{display:block;padding:18px;font-size:18px}
.fw-experience-article-cards img{display:block;width:100%;height:230px;object-fit:cover;background:#f4f7fa}
.fw-experience-headline{display:block;padding:18px;font-family:Georgia,serif;font-size:24px;font-weight:700;line-height:1.3}
.fw-experience-open{display:block;margin-top:auto;padding:0 18px 20px;font-size:15px;font-weight:700;color:#204c87}
.fw-experience-dialog .fw-experience-article-cards button:hover{border-color:#204c87;background:#f6f9ff}
@media(max-width:1000px){.fw-experience-dialog>nav.fw-experience-article-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}.fw-experience-article-cards img{height:190px}}
@media(max-width:600px){.fw-experience-dialog>nav.fw-experience-article-cards{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 12px;gap:12px;margin-top:12px}.fw-experience-article-cards img{height:150px}.fw-experience-edition{font-size:15px;padding:12px}.fw-experience-headline{font-size:19px;padding:12px}.fw-experience-open{font-size:13px;padding:0 12px 14px}}

.fw-experience-dialog[data-mode="paper"]>nav.fw-experience-article-cards{grid-template-columns:repeat(4,minmax(0,1fr))}.fw-experience-dialog[data-mode="paper"] .fw-experience-article-cards img{object-fit:contain;background:#f4f7fa}
@media(max-width:600px){.fw-experience-dialog[data-mode="paper"]>nav.fw-experience-article-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media(min-width:1001px) and (min-height:700px){.fw-experience-dialog:not(.has-content)>header{order:0}.fw-experience-dialog:not(.has-content)::before{content:"";order:1;flex:1 0 20px}.fw-experience-dialog:not(.has-content)>nav.fw-experience-article-cards{order:2;flex:none;margin:16px auto 12px}.fw-experience-dialog:not(.has-content)>.fw-experience-note{order:3}.fw-experience-dialog:not(.has-content)::after{content:"";order:4;flex:1 0 20px}}
