.extras-site{margin:0;background:#061323;color:#f4f8ff;font:17px/1.6 system-ui,sans-serif}.extras-site *{box-sizing:border-box}.extras-site a{color:#78edf5}.extras-topbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:12px 20px;background:#071b2c;border-bottom:1px solid #467d99}.extras-topbar>a{text-decoration:none;font-weight:800}.extras-skip{position:absolute;left:12px;top:-100px;z-index:1000;background:#c8fa4c;color:#07192b!important;padding:14px}.extras-skip:focus{top:12px}.extras-hero{position:relative;isolation:isolate;overflow:hidden;padding:40px max(20px,calc((100vw - 1100px)/2));min-height:290px;background:#09243a}.extras-hero>img{object-position:70% center;position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}.extras-hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#061323ed,#0613239c 70%,#06132333)}.extras-hero>div{max-width:720px}.extras-hero h1{font-size:clamp(2.2rem,6vw,4.6rem);line-height:1.1;margin:12px 0;color:#fff}.extras-hero p:first-child{font-size:.8rem;font-weight:850;letter-spacing:.12em;color:#c8fa4c}.extras-hero a{display:inline-flex;align-items:center;min-height:48px;padding:10px 16px;border:1px solid #70c8df;border-radius:12px;background:#0b293f;text-decoration:none}.extras-content{max-width:1140px;margin:auto;padding:30px 20px 60px}.extras-content h2{font-size:clamp(1.5rem,3vw,2rem);line-height:1.3}.extras-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.extras-card{display:block;overflow:hidden;border:1px solid #467d99;border-radius:20px;background:#102e44;text-decoration:none;color:#f4f8ff!important}.extras-card img{width:100%;height:160px;object-fit:cover;display:block}.extras-card>div{padding:20px}.extras-card h3{margin:0;color:#fff;font-size:1.4rem}.extras-card strong{color:#c8fa4c}.extras-status{display:flex;gap:16px;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:16px 20px;background:#102e44;border:1px solid #467d99;border-radius:16px;margin-bottom:24px}.extras-status p{margin:0;max-width:700px}.extras-site button,.extras-site textarea{font:inherit}.extras-site button{min-height:48px;border:2px solid #77a5ba;border-radius:12px;padding:10px 16px;background:#102e44;color:#f4f8ff;cursor:pointer;font-weight:750}.extras-site button:hover,.extras-card:hover{border-color:#c8fa4c}.extras-site :is(a,button,summary,input,textarea):focus-visible{outline:3px solid #c8fa4c;outline-offset:4px}.extra-activity{margin:20px 0;border:1px solid #467d99;border-radius:20px;background:#0b2237;overflow:hidden}.extra-activity>summary{padding:20px;min-height:64px;cursor:pointer;color:#78edf5;font-weight:850;font-size:1.15rem}.extra-activity>summary small{display:block;margin-left:20px;color:#d3e4ed;font-size:.82rem;font-weight:650}.extra-activity-body{padding:0 24px 26px}.extra-source{max-width:850px;line-height:1.75;white-space:pre-line}.extra-question{border:1px solid #6699b0;border-radius:14px;padding:18px;margin:24px 0;background:#102e44;min-width:0}.extra-question legend{padding:0 8px;font-weight:800}.extra-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:12px;margin-top:12px}.extra-choices button{text-align:left;background:#0b2237}.extra-choices button[aria-pressed=true]{border-color:#78edf5}.extra-choices button.is-correct{border-color:#c8fa4c;background:#213e32}.extra-choices button.is-retry{border-color:#ffb896}.extra-question [data-extra-feedback]{min-height:28px;color:#e2f2ff}.extra-draft label{display:block;font-weight:750;margin:16px 0}.extra-draft textarea{display:block;width:100%;padding:12px;border:2px solid #74a2b6;border-radius:12px;background:#051525;color:#f4f8ff;resize:vertical;min-height:90px;margin-top:8px;font-weight:400}.extra-checklist{padding-left:26px}.extra-checklist li{padding:7px 0}.extra-checklist label{min-height:48px;display:flex;gap:12px;align-items:flex-start}.extra-checklist input{width:24px;height:24px;flex:0 0 24px;accent-color:#c8fa4c;margin-top:2px}.extra-links{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 0}.extra-links a{display:flex;align-items:center;min-height:48px;padding:10px 16px;border:1px solid #77a5ba;border-radius:12px;background:#102e44;text-decoration:none}.extra-activity video{width:100%;max-height:500px;background:#020a12;border-radius:14px;display:block;margin:20px 0}.extra-activity audio{display:block;width:100%;margin:20px 0}.extras-footer{padding:30px 20px 110px;border-top:1px solid #467d99;text-align:center;background:#071b2c}.extras-footer a{display:inline-block;min-height:48px;padding:12px}.extras-site .hc-a11y-launcher{background:#102e44;color:#f4f8ff;border-color:#78edf5}@media(max-width:850px){.extras-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.extras-cards{grid-template-columns:1fr}.extras-content{padding:24px 14px 50px}.extra-activity-body{padding:0 16px 24px}.extras-topbar{padding:10px 14px;font-size:.85rem}.extras-hero{padding:28px 18px}.extra-choices{grid-template-columns:1fr}}

.extra-recipe-categories{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.extra-recipe-categories a{display:inline-flex;align-items:center;min-height:48px;padding:10px 18px;border:1px solid #70dacf;border-radius:12px;background:#0b303d;color:#f5f0cf;text-decoration:none;font-weight:700}.extra-recipe-categories a:focus-visible{outline:3px solid #c9f36c;outline-offset:3px}.extra-category-heading{scroll-margin-top:100px;margin-top:32px;color:#f5f0cf}

/* Mīharo resource cards: show an actual book cover over the illustrated story scene.
   Avoid cropping a tall cover inside a wide resource-card image slot. */
.extras-card-bookart{position:relative;height:160px;overflow:hidden;background:#0e3045}
.extras-card-bookart>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 32%}
.extras-card-bookart>.extras-book-cover{position:absolute;right:14px;top:6px;height:148px;width:auto;max-width:40%;object-fit:contain;background:#d8b31e;border:2px solid #fff0d6;border-radius:4px;box-shadow:0 8px 20px #00131bd9}

/* Keep copy on a fully opaque panel, independent of the artwork underneath. */
.extras-hero>div{background:#061323;padding:22px;border-radius:16px;box-sizing:border-box}