:root{--ink:#122e40;--navy:#102a3a;--sea:#236786;--foam:#d7f2e9;--cream:#f8f2df;--paper:#f1ead7;--sand:#e9cda2;--line:#153346;--orange:#d38a58}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'IBM Plex Sans Arabic',sans-serif}button,a{font:inherit}button{cursor:pointer}a{color:inherit}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 max(4vw,22px);background:#f7f0db;border-bottom:3px solid var(--line);position:relative;z-index:5}.brand{border:0;background:none;display:flex;gap:12px;align-items:center;color:var(--ink);font-weight:700;font-size:24px;line-height:1}.brand-mark{border:2px solid var(--line);box-shadow:3px 3px 0 var(--line);font:22px monospace;padding:6px;background:#d4e6d1}.brand small{display:block;font:8px 'Press Start 2P',monospace;margin-top:8px;letter-spacing:1px}.top-right{display:flex;gap:24px;align-items:center;font-size:13px}.status{font:10px 'Press Start 2P',monospace;background:#e5efdf;border:2px solid var(--line);padding:10px;white-space:nowrap}.status i{display:inline-block;width:7px;height:7px;background:#50ab65;margin-right:6px;box-shadow:0 0 0 2px #a5d5a4}.welcome{position:relative;min-height:calc(100svh - 76px);overflow:hidden;background:#16628a}.hero-art{position:absolute;inset:0;background:url('/delma-pixel.png') center 63%/cover no-repeat;image-rendering:pixelated;animation:arrive 1.2s steps(8) both}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,38,57,.28),rgba(7,42,64,.48) 48%,rgba(11,45,60,.18)),linear-gradient(0deg,rgba(4,35,55,.7),transparent 26%,transparent 75%,rgba(12,51,77,.15))}.hero-copy{position:relative;z-index:1;text-align:center;color:#fff7dd;padding:clamp(95px,15vh,170px) 20px 155px;text-shadow:3px 4px 0 rgba(17,43,58,.7);max-width:900px;margin:auto}.eyebrow,.kicker,.level-no{font-weight:700;letter-spacing:1.5px;font-size:13px}.hero-copy h1{font-size:clamp(48px,7.3vw,100px);line-height:1.2;margin:28px 0 16px;font-weight:700}.hero-copy h1 em{font-style:normal;color:#fff0b8}.hero-copy p{font-size:clamp(16px,1.7vw,21px);font-weight:600}.pixel-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;text-decoration:none;background:#f4efdb;color:#183d4c;border:3px solid #142d3f;box-shadow:6px 6px 0 #142d3f;padding:13px 25px;font-weight:700;transition:transform .16s,box-shadow .16s}.pixel-button:hover,.pixel-button:focus-visible{transform:translate(3px,3px);box-shadow:3px 3px 0 #142d3f}.pixel-button.primary{font-size:23px;background:#e7ba72;margin-top:22px;min-width:210px;min-height:64px;box-shadow:7px 7px 0 #0d2936;text-shadow:none}.pixel-button.mini{font-size:13px;padding:9px 14px;gap:8px;box-shadow:4px 4px 0 #142d3f}.hint{font-size:12px;margin-top:30px;letter-spacing:1px}.hint span{margin:0 8px}.hero-foot{position:absolute;bottom:18px;left:4%;right:4%;display:flex;justify-content:space-between;color:#fff4d9;z-index:1;font:10px 'Press Start 2P',monospace;direction:ltr;text-shadow:1px 2px #193e55}.shell{max-width:1280px;margin:auto;padding:62px 28px 80px;min-height:calc(100vh - 76px)}.shell-heading{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:35px}.kicker{font:10px 'Press Start 2P',monospace;color:#427d85;direction:ltr;text-align:right}.shell h1{font-size:clamp(36px,4.5vw,62px);line-height:1.28;margin:12px 0}.shell-heading h1 span{color:#287990}.shell-heading p{font-size:17px;margin:0;max-width:610px;color:#53666c}.progress{border:3px solid var(--line);box-shadow:5px 5px 0 var(--line);background:#f9f3df;padding:15px 18px;min-width:220px}.progress span{font-size:12px;font-weight:700}.progress strong{display:block;font:27px 'Press Start 2P',monospace;margin:12px 0;direction:ltr;text-align:right}.progress strong small{font-size:14px;color:#748483}.meter{height:13px;border:2px solid var(--line);background:#ded8c3}.meter i{display:block;background:#76ac88;height:100%;transition:width .3s}.stage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:21px}.stage-card{text-align:right;display:flex;flex-direction:column;min-height:270px;border:3px solid var(--line);box-shadow:6px 6px 0 var(--line);padding:18px 22px;background:#dbe9e5;color:var(--ink);transition:transform .18s,box-shadow .18s}.stage-card:hover,.stage-card:focus-visible{transform:translateY(-5px);box-shadow:6px 11px 0 var(--line)}.stage-card.sand,.level-head.sand{background:#f0d7aa}.stage-card.teal,.level-head.teal{background:#b8ded5}.stage-card.clay,.level-head.clay{background:#e5baa1}.stage-card.olive,.level-head.olive{background:#d7dfb6}.stage-card.plum,.level-head.plum{background:#dad0dc}.stage-card.blue,.level-head.blue{background:#c4dce9}.card-top,.card-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px}.card-top{font:10px 'Press Start 2P',monospace;direction:ltr}.card-icon{font-size:48px;margin:20px 0 8px;line-height:1;filter:drop-shadow(3px 3px #fff7d8)}.card-title{font-size:24px;font-weight:700}.card-short{font-size:14px;color:#44606b}.card-bottom{margin-top:auto;border-top:2px dashed rgba(17,47,62,.35);padding-top:12px;font-size:12px}.card-bottom b{font-size:14px}.finish{display:flex;align-items:center;gap:22px;margin-top:45px;background:#183d4a;color:#f9f0d6;padding:24px 32px;border:3px solid #0e2d3a;box-shadow:6px 6px 0 #0e2d3a}.finish>span{font-size:40px;color:#e9b16e}.finish h2{margin:0;font-size:24px}.finish p{margin:3px 0}.finish button{margin-right:auto}.footer{border-top:3px solid var(--line);background:#d9ded0;padding:20px 4%;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:#3b5862}.level-page{max-width:1050px}.crumb{display:flex;gap:12px;align-items:center;margin-bottom:25px;font:11px 'Press Start 2P',monospace;direction:ltr;justify-content:flex-end}.crumb button{border:0;background:none;font-family:'IBM Plex Sans Arabic';font-size:14px;font-weight:700;color:#285f73}.level-head{border:3px solid var(--line);box-shadow:7px 7px 0 var(--line);padding:28px 35px 35px}.level-no{font:12px 'Press Start 2P',monospace;direction:ltr;text-align:right}.level-no span{font:12px 'IBM Plex Sans Arabic'}.level-title{display:flex;justify-content:space-between;align-items:center}.level-title h1{font-size:clamp(34px,5vw,58px);margin:22px 0 5px}.level-title p{margin:0;font-size:17px}.level-icon{font-size:72px;filter:drop-shadow(5px 5px #fff8db)}.level-body{margin:45px 0}.lead{font-size:21px;font-weight:600;margin:0 0 26px}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.info-card{border:2px solid var(--line);background:#fffaf0;box-shadow:4px 4px 0 var(--line);padding:20px;display:flex;flex-direction:column;min-height:235px}.tiny-star{font-size:20px;color:#b77750}.info-card h3,.story-list h3,.stop h3{margin:8px 0;font-size:21px}.info-card p,.story-list p,.stop p{font-size:14px;line-height:1.9;margin:0 0 20px;color:#47606a}.info-card .pixel-button{align-self:flex-start;margin-top:auto}.note{margin-top:25px;background:#e6e6ce;border-right:5px solid #518994;padding:15px 18px;font-size:14px}.subhead{margin-top:40px}.checklist{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.check-item{display:flex;align-items:center;gap:12px;background:#fff9e9;border:2px solid var(--line);padding:13px;cursor:pointer;font-weight:600}.check-item input{appearance:none;width:23px;height:23px;flex:none;background:#fff;border:2px solid var(--line);cursor:pointer}.check-item input:checked{background:#69a780;box-shadow:inset 0 0 0 4px #fff}.check-item:has(input:checked) span{text-decoration:line-through;color:#667e76}.story-list{display:grid;gap:17px}.story-list article{border-right:5px solid #2c7485;background:#fff9eb;padding:20px 26px}.story-list b{font:10px 'Press Start 2P',monospace;color:#7a8069}.story-list p{margin-bottom:0}.action-row{display:flex;gap:15px;flex-wrap:wrap;margin-top:25px}.segmented{display:flex;gap:10px;margin:15px 0 28px}.segmented button{border:2px solid var(--line);padding:9px 25px;background:#fff7df;font-weight:700}.segmented button.active{background:#3a8594;color:#fff}.itinerary{border-right:3px dashed #468697;padding-right:21px}.stop{display:flex;gap:17px;margin:0 0 18px;align-items:start}.stop>span{font:12px 'Press Start 2P',monospace;padding:12px;background:#c0dcd8;border:2px solid var(--line)}.stop h3{margin:0}.stop p{margin:0}.level-nav{display:flex;justify-content:space-between;border-top:2px dashed #aab9ad;padding-top:25px;gap:15px}.level-nav button{border:2px solid var(--line);background:#fff8e7;padding:10px 20px;font-weight:700}.level-nav button:last-child{background:#d9b37a}@keyframes arrive{from{opacity:.5;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}@media(max-width:850px){.stage-grid{grid-template-columns:repeat(2,1fr)}.info-grid{grid-template-columns:1fr}.info-card{min-height:auto}.shell-heading{align-items:start;flex-direction:column}.progress{width:100%}.desktop-note{display:none}}@media(max-width:570px){.topbar{height:65px;padding:0 16px}.brand{font-size:21px}.brand small{font-size:7px}.status{font-size:8px;padding:7px}.welcome{min-height:calc(100svh - 65px)}.hero-art{background-position:48% center}.hero-copy{padding:23vh 16px 130px}.hero-copy h1{font-size:47px}.hero-copy p{line-height:1.7}.eyebrow{font-size:11px}.hero-foot{font-size:7px}.shell{padding:37px 17px 65px}.stage-grid{grid-template-columns:1fr;gap:16px}.stage-card{min-height:210px;padding:16px 19px}.card-icon{font-size:38px;margin:12px 0 4px}.card-title{font-size:21px}.finish{flex-wrap:wrap;padding:18px;gap:10px}.finish button{width:100%;margin-top:10px}.footer{flex-direction:column}.level-head{padding:20px}.level-icon{font-size:48px}.level-body{margin-top:32px}.lead{font-size:18px}.checklist{grid-template-columns:1fr}.level-nav button{font-size:13px;padding:9px}.shell-heading h1{font-size:40px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}

/* Island journey */
:focus-visible{outline:4px solid #db8e33;outline-offset:5px}h1:focus{outline:0}.world-shell{max-width:1320px;padding-top:32px}.world-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:24px}.world-heading h1{font-size:clamp(32px,4vw,52px);margin:8px 0}.world-heading h1 span{color:#287990}.world-heading p{font-size:16px;margin:0;color:#47616a}.world-progress{min-width:150px}.world-progress strong{font:26px 'Press Start 2P',monospace;direction:ltr;display:block}.world-progress strong span{font-size:16px;color:#678184;margin-left:8px}.world-progress>span{display:block;font-size:13px;margin:8px 0}.world-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.view-switch{display:flex;gap:0;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}.view-switch button{border:0;padding:10px 19px;background:#fbf5df;color:var(--ink);font-size:14px;font-weight:600}.view-switch button[aria-pressed=true]{background:var(--ink);color:#fff6d8}.map-key{font-size:13px;display:flex;align-items:center;gap:8px}.map-key i{width:13px;height:13px;background:#77a781;border:2px solid var(--ink)}.world-map{position:relative;aspect-ratio:3/2;background:#1b8e9e;border:4px solid var(--ink);box-shadow:7px 7px 0 var(--ink);isolation:isolate}.island-map{position:absolute;width:100%;height:100%;inset:0;object-fit:fill;image-rendering:pixelated}.map-name{position:absolute;left:4%;top:6%;direction:ltr;font:clamp(12px,2vw,24px)/1.6 'Press Start 2P',monospace;color:#fff1c7;text-shadow:2px 3px #0a5360}.map-name small{font-size:.62em;letter-spacing:6px}.map-caption{position:absolute;bottom:12px;right:16px;padding:5px 9px;background:#103d4bd9;color:#fff7df;font-size:12px}.map-pin{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);z-index:2;display:flex;flex-direction:column;align-items:center;border:0;background:none;padding:0;min-width:44px;min-height:44px;color:var(--ink)}.pin-number{position:relative;display:flex;align-items:center;justify-content:center;width:50px;height:47px;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:#fff4ca;font:15px 'Press Start 2P',monospace;transition:transform .15s,background .15s}.pin-number:after{content:'';position:absolute;bottom:-9px;left:19px;width:9px;height:9px;background:var(--ink)}.pin-label{display:block;padding:4px 10px;background:#133544;color:#fff7dc;border:2px solid #fff4cc;margin-top:12px;box-shadow:3px 3px 0 #133544;font-weight:600;font-size:14px;white-space:nowrap;transition:transform .15s}.map-pin:hover .pin-number,.map-pin:focus-visible .pin-number{transform:translateY(-5px);background:#ffc36a}.map-pin:hover .pin-label{transform:translateY(-3px)}.map-pin.explored .pin-number{background:#a7d5a8}.pin-check{position:absolute;right:-12px;top:-12px;font:bold 14px sans-serif;border:2px solid var(--ink);background:#285643;color:#fff;min-width:22px;min-height:22px;display:grid;place-items:center}.map-index{display:flex;flex-wrap:wrap;gap:9px;margin-top:23px}.map-index button{display:flex;align-items:center;gap:10px;background:#fff8e4;border:2px solid var(--ink);color:var(--ink);padding:10px 13px;min-height:44px;font-size:14px}.map-index b{font:12px 'Press Start 2P',monospace;color:#2c7484}.map-index .explored{background:#d5e4c5}.scene-art{width:100%;aspect-ratio:16/9;background-image:url('/scene-atlas.png');background-size:200% 400%;background-repeat:no-repeat;image-rendering:pixelated;background-color:#1c6a78}.scene-0{background-position:0 0}.scene-1{background-position:100% 0}.scene-2{background-position:0 33.333333%}.scene-3{background-position:100% 33.333333%}.scene-4{background-position:0 66.666667%}.scene-5{background-position:100% 66.666667%}.scene-6{background-position:0 100%}.scene-cards .stage-card{padding:0;overflow:hidden;min-height:0}.stage-card-copy{display:flex;flex-direction:column;gap:8px;padding:20px;width:100%}.scene-cards .card-top{font-size:12px}.scene-cards .card-title{font-size:22px}.level-scene{display:grid;grid-template-columns:1.1fr 1fr;direction:ltr;border:3px solid var(--ink);box-shadow:7px 7px 0 var(--ink);background:#d2e1dc}.scene-window{position:relative;overflow:hidden;align-self:stretch;background:#1d697b;display:flex;align-items:center;border-right:3px solid var(--ink)}.scene-caption{position:absolute;bottom:13px;left:13px;background:#153b46ed;color:#fff6df;padding:6px 12px;font-size:14px;direction:rtl;border:1px solid #e6dca5}.scene-heading{direction:rtl;padding:28px;display:flex;justify-content:center;flex-direction:column}.scene-heading h1{font-size:clamp(28px,3.7vw,44px);margin:20px 0 12px}.scene-heading p{font-size:16px;margin:0}.scene-heading .level-no{font-size:12px}.chapter-label{font-size:13px;padding-top:24px;margin-top:20px;border-top:2px dashed #7da3a5}.level-scene.sand{background:#e9d3aa}.level-scene.clay{background:#e6c1a2}.level-scene.olive{background:#d5debb}.level-scene.plum{background:#d9d0d8}.voyage{min-height:calc(100svh - 76px);position:relative;overflow:hidden;background:#147b91;color:#fff7d7}.voyage-backdrop{position:absolute;inset:0;background:linear-gradient(#113c5940,#07546910 60%,#072e46c9),url('/delma-pixel.png') 70% center/cover;image-rendering:pixelated}.voyage-copy{position:relative;text-align:center;padding:8vh 20px 0;text-shadow:3px 3px #184358}.voyage-kicker{font:12px 'Press Start 2P',monospace}.voyage h1{font-size:clamp(40px,7vw,84px);margin:20px 0 8px}.voyage p{font-size:19px}.sailing-boat{position:absolute;top:58%;left:85%;width:clamp(130px,24vw,320px);animation:sail-to-island 5s ease-in-out forwards;filter:drop-shadow(5px 7px 0 #124d6370)}.sailing-boat img{width:100%;height:auto;image-rendering:pixelated;animation:boat-bob .8s steps(3) infinite}.voyage-bottom{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);text-align:center;width:min(340px,85%)}.voyage-bottom>span{font-size:14px}.voyage-meter{height:14px;border:2px solid #f6edd4;box-shadow:3px 3px #123c4c;margin:12px auto 20px;background:#124b60}.voyage-meter i{display:block;height:100%;background:#eabc6e;animation:crossing-progress 5s linear both}.voyage .pixel-button{min-height:44px}.info-card p,.story-list p,.stop p{font-size:16px}.card-short{font-size:16px}.kicker{font-size:12px}.level-nav button{min-height:44px}.level-body .pixel-button.mini{font-size:14px;min-height:44px}.scene-window .scene-art{height:100%;aspect-ratio:auto}.status{font-size:12px}.brand small{font-size:10px}.hero-foot{font-size:12px}.voyage-kicker{line-height:1.8}@keyframes sail-to-island{0%{left:95%;transform:translateX(0) scale(1)}100%{left:22%;transform:translateX(-50%) scale(.7)}}@keyframes boat-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes crossing-progress{from{width:0}to{width:100%}}@media(max-width:850px){.level-scene{grid-template-columns:1fr}.scene-window{border-right:0;border-bottom:3px solid var(--ink)}.scene-window .scene-art{height:auto;aspect-ratio:16/9}.scene-heading{padding:22px}.scene-heading h1{margin:12px 0}.chapter-label{padding-top:12px;margin-top:15px}.level-scene .scene-heading h1{font-size:36px}.pin-label{font-size:12px;padding:3px 7px}.pin-number{width:45px;height:44px;font-size:13px}}@media(max-width:570px){.world-shell{padding:25px 12px 50px}.world-heading{gap:12px;align-items:flex-start}.world-heading h1{font-size:31px}.world-heading p{font-size:14px;max-width:235px}.world-progress{min-width:70px;margin-top:6px}.world-progress strong{font-size:18px}.world-progress strong span{font-size:12px;margin-left:3px}.world-progress>span{font-size:12px;max-width:72px}.world-toolbar{margin:22px 0 14px}.view-switch button{padding:9px 12px}.map-key{font-size:12px;gap:4px}.map-key i{width:10px;height:10px}.world-map{border-width:3px;box-shadow:4px 4px 0 var(--ink);aspect-ratio:1/1}.island-map{object-fit:fill}.pin-label{display:none}.pin-number{height:44px;width:44px;font-size:13px;box-shadow:3px 3px 0 var(--ink)}.pin-number:after{left:15px}.map-name{font-size:12px;top:4%;left:4%}.map-caption{font-size:12px;bottom:8px;right:8px;padding:3px 5px}.map-index{gap:7px;margin-top:19px}.map-index button{flex:1 1 28%;gap:8px;padding:8px;font-size:14px;justify-content:center}.map-index b{font-size:12px}.scene-cards .stage-card-copy{padding:16px}.scene-cards .card-top{font:12px monospace}.level-page .level-scene .scene-heading h1{font-size:32px}.voyage{min-height:calc(100svh - 65px)}.voyage-copy{padding-top:15vh}.voyage p{font-size:16px}.sailing-boat{top:60%;width:180px}.voyage-bottom{bottom:25px}.hero-foot{font:10px monospace;gap:12px}.status{font:10px monospace}.brand small{font:10px monospace}.world-heading .kicker{font:12px monospace}.map-pin{min-width:44px}.scene-caption{font-size:13px}}@media(prefers-reduced-motion:reduce){.sailing-boat{left:22%}.voyage-meter i{width:100%}}
/* Retro sound control */
/* Short pixel-style exit and entrance timed to the two sound cues. */
#app.page-exit{opacity:0;transform:translateY(8px);transition:opacity .18s steps(4,end),transform .18s steps(4,end);pointer-events:none}
#app.page-enter{animation:page-enter .2s steps(4,end) both}
@keyframes page-enter{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#app.page-exit{transform:none}#app.page-enter{animation:none}}
/* Blocky display type; keep longer descriptions in the readable body face. */
.brand,.hero-copy h1,.world-heading h1,.shell h1,.companion-heading h1,.scene-heading h1,.level-title h1,.card-title,.info-card h3,.story-list h3,.pixel-panel h2,.stage-card strong,.stage-card .card-title{font-family:'Changa','IBM Plex Sans Arabic',sans-serif;font-weight:700;letter-spacing:0;line-height:1.35}
.hero-copy h1,.world-heading h1,.shell h1{text-shadow:3px 3px 0 rgba(14,42,57,.28)}
.pixel-button,.view-switch button,.level-nav button,.companion-tabs button,.brand,.sound-toggle,.language-switch button{font-family:'Changa','IBM Plex Sans Arabic',sans-serif;font-weight:700}
html[lang="en"] .brand,html[lang="en"] .shell h1,html[lang="en"] .world-heading h1,html[lang="en"] .scene-heading h1,html[lang="en"] .level-title h1,html[lang="en"] .card-title,html[lang="en"] .info-card h3,html[lang="en"] .story-list h3,html[lang="en"] .pixel-panel h2,html[lang="en"] .pixel-button,html[lang="en"] .view-switch button,html[lang="en"] .level-nav button,html[lang="en"] .companion-tabs button,.welcome-english h2,.welcome-choices [lang="en"],.language-switch button[data-language="en"]{font-family:'Pixelify Sans','Changa',sans-serif;letter-spacing:.025em}
.welcome-english h2{font-size:clamp(23px,3vw,38px);line-height:1.2}.hero-copy h1{line-height:1.2}.brand{line-height:1}.brand small{font-family:'Press Start 2P',monospace}
@media(max-width:570px){.hero-copy h1{font-size:clamp(38px,10vw,48px)}.welcome-english h2{font-size:clamp(21px,6vw,29px)}}
.welcome-english{margin:24px auto 0;max-width:680px}.welcome-english h2{font:700 clamp(22px,3.2vw,38px) 'IBM Plex Sans Arabic',sans-serif;margin:0;text-shadow:2px 3px #17374c}.welcome-english p{margin:8px 0 0;font-size:clamp(15px,1.4vw,18px)}.welcome-choices{display:flex;justify-content:center;gap:22px;flex-wrap:wrap}.welcome-choices .pixel-button.primary{margin-top:26px;min-width:180px}.language-switch{display:flex;border:2px solid var(--line);background:#fff9e9}.language-switch button{border:0;background:transparent;color:var(--ink);padding:6px 9px;font-size:12px;font-weight:700}.language-switch button[aria-pressed="true"]{background:var(--sea);color:white}.language-switch button:focus-visible{outline:3px solid #e7ba72;outline-offset:2px}
@media(max-width:570px){.top-right{gap:6px}.language-switch button{padding:5px 6px;font-size:11px}.status{display:none}.welcome-choices{gap:12px}.welcome-choices .pixel-button.primary{min-width:140px;min-height:55px;font-size:18px;padding:9px 14px}.hero-copy{padding-top:clamp(55px,8vh,95px)}.welcome-english{margin-top:16px}}
.world-heading h1,.world-heading h1 span{color:var(--sea)}
.sound-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:2px solid var(--line);background:#d9e8de;color:var(--ink);box-shadow:3px 3px 0 var(--line);padding:7px 9px;min-height:36px;font-size:12px;font-weight:700;white-space:nowrap;line-height:1.2}
.sound-toggle:hover,.sound-toggle:focus-visible{background:#e7ba72;transform:translate(2px,2px);box-shadow:1px 1px 0 var(--line)}
.sound-toggle[aria-pressed="false"]{background:#e6e1d5}
.sound-toggle span:first-child{font-size:18px;line-height:1}
@media(max-width:570px){.top-right{gap:10px}.sound-toggle{min-width:36px;padding:5px}.sound-toggle span:last-child{display:none}}
/* Larger illustrated stage cards below the island map. */
.map-stage-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px;margin:34px 0 42px}
.map-stage-cards .stage-card{min-width:0}
.map-stage-cards .scene-art{aspect-ratio:16/8;min-height:185px}
.map-stage-cards .stage-card-copy{padding:24px 26px 27px;gap:10px;min-height:150px}
.map-stage-cards .card-title{font-size:clamp(23px,2.4vw,30px)}
.map-stage-cards .card-short{font-size:17px;line-height:1.6}
.general-links{border-top:2px dashed #7da3a5;padding:22px 0 32px}
.general-links h2{font-size:23px;margin:0 0 16px}
.general-links>div{display:flex;gap:13px;flex-wrap:wrap}
@media(max-width:700px){.map-stage-cards{grid-template-columns:1fr;gap:19px}.map-stage-cards .scene-art{min-height:0;aspect-ratio:16/9}.map-stage-cards .stage-card-copy{padding:18px 20px;min-height:0}.map-stage-cards .card-title{font-size:24px}.map-stage-cards .card-short{font-size:16px}}
@media(max-width:570px){.topbar{padding-inline:10px}.brand{gap:6px;font-size:16px;white-space:nowrap}.brand-mark{font-size:16px;padding:4px}.top-right{gap:5px}.status{display:none}.sound-toggle{padding:6px}.sound-toggle span:last-child{display:none}}
.scene-custom{background-image:url('/delma-pixel.png');background-size:cover;background-position:center}
/* Compact horizontal cards: RTL puts the image left; LTR puts it right. */
.map-stage-cards{gap:17px;margin:26px 0 36px}
.map-stage-cards .stage-card{flex-direction:row-reverse;min-height:164px;align-items:stretch}
.map-stage-cards .scene-art{width:37%;flex:0 0 37%;height:auto;min-height:164px;aspect-ratio:auto}
.map-stage-cards .scene-custom{background-size:cover;background-position:center}
.map-stage-cards .stage-card-copy{flex:1;min-width:0;width:auto;min-height:0;justify-content:center;padding:17px 19px;gap:5px}
.map-stage-cards .card-title{font-size:clamp(19px,1.9vw,24px)}
.map-stage-cards .card-short{font-size:15px;line-height:1.5}
html[lang="en"] .map-stage-cards .stage-card{text-align:left}
@media(max-width:700px){.map-stage-cards{gap:13px}.map-stage-cards .stage-card{min-height:142px}.map-stage-cards .scene-art{min-height:142px;width:35%;flex-basis:35%;aspect-ratio:auto}.map-stage-cards .stage-card-copy{padding:12px 14px}.map-stage-cards .card-title{font-size:20px}.map-stage-cards .card-short{font-size:14px}}
/* The bilingual welcome choices keep a fixed reading order in either locale. */
.welcome-choices{direction:rtl;flex-wrap:nowrap}
@media(max-width:570px){.welcome-choices .pixel-button.primary{flex:1 1 0;min-width:0;padding:9px 7px}}
.additional-stages{margin-top:30px}
.additional-stages h2{font-size:24px;margin:0 0 18px}
.additional-stages .map-stage-cards{margin-top:0}
/* Ideas for local visitor services, using the island journey palette. */
.ideas-nav{min-height:42px;padding:6px 13px;border:2px solid var(--line);background:#f6e2b7;color:var(--ink);box-shadow:3px 3px 0 var(--line);font-size:15px;font-weight:700;white-space:nowrap}
.ideas-nav:hover,.ideas-nav[aria-current="page"]{background:#e9bc74}
.ideas-page{max-width:1160px;padding-top:40px}
.ideas-heading{background:#c4dce9;border:3px solid var(--line);box-shadow:7px 7px 0 var(--line);padding:32px 38px}
.ideas-heading h1{font-size:clamp(31px,4.1vw,52px);max-width:850px;margin:12px 0}
.ideas-heading p{font-size:18px;line-height:1.8;max-width:820px;margin:0}
.ideas-sections{margin:45px 0 25px}
.ideas-group{margin:0 0 38px}
.ideas-group-title{display:flex;align-items:center;gap:14px;margin:0 0 17px}
.ideas-group-title span{font:13px 'Press Start 2P',monospace;background:#d6e5d3;border:2px solid var(--line);padding:10px}
.ideas-group-title h2{font-size:27px;margin:0}
.ideas-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.idea-card{min-width:0;background:#fff9e9;border:2px solid var(--line);box-shadow:4px 4px 0 var(--line);padding:21px 23px}
.idea-card h3{font-size:21px;line-height:1.4;margin:0 0 7px}
.idea-card p{font-size:16px;line-height:1.8;color:#3f5861;margin:0}
.ideas-note{background:#e4e8ce;border-inline-start:5px solid #2d7784;padding:16px 20px;font-size:16px;line-height:1.7}
.ideas-contact{display:grid;grid-template-columns:1fr auto;align-items:center;gap:25px;margin:39px 0 29px;background:#153e4b;color:#fff7db;border:3px solid var(--line);box-shadow:7px 7px 0 #0f2c3c;padding:30px}
.ideas-contact h2{font-size:clamp(25px,3vw,35px);margin:13px 0 5px}
.ideas-contact p{font-size:16px;line-height:1.8;margin:0}
.ideas-contact-actions{display:flex;flex-direction:column;gap:14px;align-items:stretch}
.ideas-contact-actions a{min-height:48px;direction:ltr;unicode-bidi:isolate;text-align:center;white-space:nowrap;background:#f7e5bc}
.ideas-back,.footer-ideas{background:none;border:0;color:inherit;text-decoration:underline;text-underline-offset:4px;font-weight:700;cursor:pointer}
.ideas-back{font-size:16px;margin-top:8px}
.footer-ideas{font-size:14px}
html[lang="en"] .ideas-nav,html[lang="en"] .ideas-page h1,html[lang="en"] .ideas-page h2,html[lang="en"] .ideas-page h3{font-family:'Pixelify Sans','IBM Plex Sans Arabic',sans-serif}
@media(max-width:850px){.ideas-contact{grid-template-columns:1fr}.ideas-contact-actions{flex-direction:row;flex-wrap:wrap}.top-right{gap:9px}}
@media(max-width:570px){.ideas-nav{font-size:12px;padding:5px 7px;min-height:36px;white-space:normal;line-height:1.1;max-width:95px}.ideas-page{padding:27px 17px 55px}.ideas-heading{padding:23px 19px;box-shadow:4px 4px 0 var(--line)}.ideas-heading p{font-size:16px}.ideas-sections{margin-top:36px}.ideas-group-title h2{font-size:23px}.ideas-grid{grid-template-columns:1fr;gap:12px}.idea-card{padding:17px}.idea-card h3{font-size:20px}.ideas-contact{padding:21px;box-shadow:4px 4px 0 #0f2c3c}.ideas-contact-actions{flex-direction:column;align-items:stretch}.ideas-contact-actions a{white-space:normal;overflow-wrap:anywhere}.top-right{gap:5px}.footer-ideas{text-align:start}}
