:root{--cream:#fff5df;--navy:#092c42;--coral:#ef6744;--teal:#0a929a;--muted:#526671;color-scheme:light}*{box-sizing:border-box}body{margin:0;padding:24px clamp(16px,4vw,56px);font:16px/1.45 system-ui,sans-serif;color:var(--navy);background:var(--cream)}header{display:flex;justify-content:space-between;align-items:center;max-width:1400px;margin:0 auto 24px}.eyebrow,.section-label{font-size:.75rem;letter-spacing:.15em;font-weight:800;color:var(--teal)}h1{font-family:Georgia,serif;font-size:clamp(1.8rem,4vw,3rem);margin:2px 0 0}h2{font-family:Georgia,serif;font-size:clamp(1.15rem,2.2vw,1.65rem);margin:3px 0}button,select{font:inherit;color:var(--navy)}button{cursor:pointer;border:1px solid #c5c0ad;border-radius:10px;padding:10px 16px;background:#fffaf0;min-height:44px;font-weight:650}button:hover{background:#f4e8ce}button:focus-visible,select:focus-visible{outline:3px solid var(--coral);outline-offset:3px}button:disabled{cursor:default}main{max-width:1400px;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:28px}.scene-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}#stage{position:relative;background:var(--navy);border-radius:16px;padding:5px;overflow:hidden}#board{display:grid;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);gap:3px;aspect-ratio:3/2;width:100%}.tile{border:0;border-radius:2px;padding:0;min-height:0;min-width:0;background-color:var(--navy);background-repeat:no-repeat;touch-action:none;user-select:none;-webkit-user-select:none;transition:box-shadow .12s,transform .12s}.tile.selected{box-shadow:inset 0 0 0 4px var(--coral);z-index:1}.tile.almost{box-shadow:inset 0 0 0 3px #ffe28c}.tile.drag-source{opacity:.7}.tile.drag-target{box-shadow:inset 0 0 0 5px var(--teal)}#board.solved{gap:0}.tile:disabled{opacity:1}#hint{position:absolute;inset:5px;z-index:4}#hint img{width:100%;height:100%;object-fit:fill;border-radius:12px}#hideHint{position:absolute;right:10px;bottom:10px;background:var(--cream)}#loading{position:absolute;inset:0;display:grid;place-items:center;background:var(--navy);color:white}#loading[hidden]{display:none}#feedback{min-height:1.5em;margin:12px 0}.play-actions{display:flex;gap:8px;flex-wrap:wrap}.primary{background:var(--coral);border-color:var(--coral)}.primary:hover{background:#ff8d6a}aside{border-left:1px solid #d9d1bf;padding-left:24px}label{display:block;margin:18px 0 8px;font-weight:700}select{width:100%;padding:10px;background:#fffaf0;border:1px solid #c5c0ad;border-radius:10px;min-height:44px}#levels{display:flex;gap:6px}#levels button{flex:1;font-size:1.25rem;padding:10px 6px}#levels span{display:block;font-size:.75rem;font-weight:400}#levels button[aria-pressed=true]{color:white;background:var(--navy);border-color:var(--navy)}.quiet,.preview-note,#saveStatus{font-size:.85rem;color:var(--muted)}.note{border-top:3px solid var(--teal);background:#edeedc;padding:16px;margin-top:24px;border-radius:8px}.note p{margin:8px 0 0}.preview-note{border-top:1px solid #d9d1bf;padding-top:12px}#celebration{margin-top:16px;padding:16px;background:#dcece0;border-radius:12px}#celebration h3{margin:0}footer{display:flex;gap:12px;align-items:center;justify-content:center;margin:28px auto 0;font-weight:650;flex-wrap:wrap}footer img{width:100px;height:auto}dialog{border:1px solid #c5c0ad;border-radius:18px;max-width:540px;width:calc(100% - 32px);max-height:85vh;padding:24px;background:var(--cream);color:var(--navy)}dialog::backdrop{background:#092c4299}.dialog-head{display:flex;justify-content:space-between;align-items:center}nav{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0}.arcade-card{padding:12px;border-top:1px solid #d9d1bf}.arcade-card strong{display:block}#menuContent{overflow-wrap:anywhere}.completed-label{font-size:.85rem;color:var(--teal)}@media(max-width:760px){body{padding:16px}header{margin-bottom:18px}main{grid-template-columns:1fr;gap:20px}aside{border-left:0;border-top:1px solid #d9d1bf;padding:16px 0 0}#levels{max-width:340px}.note{margin-top:16px}#hintButton,#reshuffleButton{flex:1;font-size:.9rem;padding:10px}footer{margin-top:20px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}@media(max-height:560px) and (min-width:761px){body{padding:10px 24px}header{margin-bottom:10px}h1{font-size:1.6rem}main{grid-template-columns:minmax(0,1fr) 245px;gap:18px}#stage{max-width:610px;margin:auto}aside{padding-left:16px}.note{margin-top:12px;padding:10px}footer{margin-top:12px}}

@media(min-width:761px){#stage{max-width:min(100%,calc((100dvh - 310px)*1.5));margin:auto}aside{max-height:calc(100dvh - 210px);overflow:auto}.arcade-card img{float:left;margin-right:12px;border-radius:10px}.arcade-card p{margin:6px 0}.arcade-card{min-height:90px}}
/* ISS-0005: shared Towers 205 series treatment; approved logo derivatives. */
html{background:#082a3e}body{--navy:#082a3e;--cream:#fff5df;--coral:#ed795c;--teal:#1fc4c7;background:radial-gradient(ellipse at 12% 0%,#23586b 0%,#102f43 40%,#071c2b 100%);min-height:100dvh;padding-top:16px}header{color:var(--cream);gap:18px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid #6bcac34d}header>div{flex:1}header .eyebrow{color:#8eddd4}.header-brand{width:120px;height:82px;object-fit:contain;filter:drop-shadow(0 3px 3px #0007)}header h1{font-size:clamp(25px,3vw,40px);letter-spacing:-.7px}.board-section{background:linear-gradient(145deg,#184557,#0b2436);padding:20px;border:2px solid #1fc4c7;border-radius:22px;box-shadow:0 5px 0 #04131d,0 15px 30px #0005}.scene-heading{color:var(--cream)}.scene-heading .eyebrow{color:#8eddd4}#stage{border:1px solid #bfa675;border-radius:13px;box-shadow:0 6px 18px #0005}#feedback{color:var(--cream)}button{background:linear-gradient(#fff5df,#eddcc0);border-color:#477c84;box-shadow:0 3px 0 #082a3e55;font-weight:750}button:hover:enabled{filter:brightness(1.06)}.tile{box-shadow:none;border:0;background-color:#082a3e}.tile:hover:enabled{filter:none}.tile.selected{box-shadow:inset 0 0 0 4px #ed795c}.tile.almost{box-shadow:inset 0 0 0 3px #ffe28c}.tile.drag-target{box-shadow:inset 0 0 0 5px #1fc4c7}button:focus-visible,select:focus-visible{outline-color:#ffb25d}aside{padding:20px;border:1px solid #c8b99b;border-top:4px solid #ed795c;border-radius:18px;background:linear-gradient(140deg,#fff7e7,#f0e2c8);box-shadow:0 8px 20px #0004}.section-label,aside .eyebrow{color:#246970}.note{background:#e7e8d6;border-top-color:#39868b}#levels button[aria-pressed=true]{background:linear-gradient(#236070,#082a3e);color:#fff5df;border-color:#1b5763;box-shadow:0 3px 0 #04131d}.primary{background:linear-gradient(#f48b70,#ed795c);border-color:#b95d44}.primary:hover{background:linear-gradient(#ffa88e,#ed795c)}#celebration{background:#fff1d8;color:#082a3e;border-left:4px solid #ed795c}.completed-label{color:#9de3cd}footer{color:#fff5df;margin-top:22px;font:20px Georgia,serif}footer img{width:76px;height:54px;object-fit:contain}#menuButton{display:flex;gap:9px;align-items:center}.menu-icon{position:relative;display:inline-block;width:20px;height:16px;border-top:2px solid currentColor;border-bottom:2px solid currentColor}.menu-icon::before{content:"";position:absolute;left:0;top:5px;width:100%;height:2px;background:currentColor}dialog{border:2px solid #56aca9;background:linear-gradient(145deg,#fff7e7,#f0e2c8);box-shadow:0 20px 50px #0007}.menu-brand{display:flex;gap:12px;align-items:center}.menu-brand img{width:84px;height:62px;object-fit:contain}.menu-brand .eyebrow{color:#246970}.menu-brand h2{font-size:24px}#menuNav{grid-template-columns:1fr}#menuNav button{text-align:left;min-height:48px}.dialog-head{gap:12px;align-items:start}.dialog-head #closeMenu{flex-shrink:0}#menuContent h3{font:24px Georgia,serif}#menuContent p{line-height:1.6}.arcade-card img{float:left;margin-right:12px;border-radius:10px}.arcade-card p{margin:6px 0}.arcade-card{min-height:90px}
@media(min-width:761px){#stage{max-width:min(100%,max(345px,calc((100dvh - 355px)*1.5)))}aside{max-height:calc(100dvh - 155px)}}
@media(max-width:760px){body{padding:12px}header{gap:10px;padding-bottom:12px;margin-bottom:16px}.header-brand{width:82px;height:60px}header h1{font-size:26px}header .eyebrow{font-size:9px;letter-spacing:1.5px}#menuButton{padding:9px 11px;font-size:13px;gap:6px}.board-section{padding:12px;border-radius:18px}aside{padding:18px;border-top:4px solid #ed795c}.scene-heading h2{font-size:1.25rem}footer{margin-top:20px}.menu-brand img{width:64px;height:48px}.menu-brand h2{font-size:21px}}
@media(max-width:360px){.header-brand{width:62px;height:48px}header h1{font-size:22px}.menu-brand{gap:7px}.menu-brand img{width:48px}}

#livingScene{position:absolute;inset:5px;width:calc(100% - 10px);height:calc(100% - 10px);border-radius:8px;pointer-events:none;z-index:2}#livingScene[hidden]{display:none}#board.solved{transition:gap .5s}@media(prefers-reduced-motion:reduce){#livingScene{display:none!important}#board.solved{transition:none}}

/* Selected travel-desk layout: city then image, compact controls and original art. */
body{background:#f9f0dc;color:#082a3e;border:9px solid #0c354c;box-shadow:inset 0 0 0 2px #e2cb9d;padding:14px 22px;background-image:repeating-linear-gradient(45deg,#d4bd9010 0 1px,transparent 1px 5px)}header{color:#082a3e;max-width:1380px;border-bottom:0;gap:18px;margin-bottom:10px;padding-bottom:5px}header>div{text-align:center}header .eyebrow{color:#082a3e;letter-spacing:.35em}header h1{font-family:Georgia,serif;font-weight:900;text-transform:uppercase;font-size:clamp(26px,4.1vw,58px);text-shadow:2px 2px 0 #ed795c;letter-spacing:-1px}header .header-brand{width:132px;height:94px}header .eyebrow::before,header .eyebrow::after{content:"";display:inline-block;width:55px;height:9px;border-top:3px solid #ed795c;border-bottom:3px solid #19bbc0;margin:0 12px}main{display:block;max-width:1380px}.collection-nav{margin-bottom:12px}.city-row{display:flex;gap:6px;align-items:center;border:1px solid #0c354c;border-radius:10px;padding:4px}#cities{display:flex;flex:1;gap:0;overflow-x:auto;scrollbar-width:thin}#cities button{flex:1 0 auto;border:0;border-right:1px solid #b6a88b;border-radius:0;box-shadow:none;background:transparent;padding:8px 20px;text-transform:uppercase;white-space:nowrap;font-weight:800}#cities button[aria-pressed=true]{color:#c34d32;border-bottom:4px solid #ed795c}#citiesLeft,#citiesRight{font-size:28px;line-height:1;border:0;box-shadow:none;background:transparent;padding:0 14px}.collection-caption{display:flex;justify-content:center;align-items:center;gap:16px;font-size:.85rem;margin:8px}.collection-caption strong{font:800 18px Georgia,serif;letter-spacing:1px}#imageChoices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}#imageChoices button{font-size:.85rem;min-height:40px;box-shadow:none;border:1.5px solid #153b50;border-radius:4px;padding:6px 10px;background:#fff7e5;overflow-wrap:anywhere}#imageChoices button[aria-pressed=true]{color:#fff8e7;background:#d45d40;border-color:#9b3e29}#imageChoices button:disabled{opacity:.55;cursor:default}.board-section{padding:12px 16px;border:5px solid #0c354c;outline:1px solid #cfb67f;border-radius:15px;background:#fff5df;box-shadow:0 5px 0 #16384825;margin:0}.scene-heading{color:#082a3e;justify-content:center;gap:22px;margin-bottom:9px}.scene-heading h2{font-size:23px;margin:0}.scene-heading .eyebrow{color:#246970}.completed-label{color:#246970}#stage{border-radius:5px;background:#082a3e;max-width:min(100%,max(460px,calc((100dvh - 380px)*1.5)));box-shadow:none;border:1px solid #b9a174}#board{border-radius:0}#feedback{color:#082a3e;font-size:.9rem;margin:8px 0;text-align:center}#levels{display:flex;gap:7px}.level-controls{display:flex;align-items:center;gap:10px;margin-right:12px}#levels button{font-size:1.1rem;min-width:62px;padding:8px 12px}#levels button[aria-pressed=true]{background:#16bac0;color:#082a3e;box-shadow:inset 0 0 0 2px #0c6f7d}.play-actions{justify-content:center;align-items:center}#hintButton{background:#ed795c;color:#082a3e;border-color:#a64b34}#celebration{padding:10px;margin-top:10px;border:1px solid #92b2a0;border-left:4px solid #ed795c;background:#e9edda;text-align:center}#celebration p{margin:5px 0 10px}#celebration h3{font-size:17px}.save-line{text-align:center;color:#526671;font-size:12px;margin:10px 0 0}footer{color:#082a3e;font-size:18px;margin-top:10px}.menu-brand .eyebrow{color:#246970}#livingScene{border-radius:0}
@media(max-width:760px){body{border-width:5px;padding:9px}header{gap:8px}.header-brand,header .header-brand{width:76px;height:60px}header h1{font-size:24px}header .eyebrow{font-size:9px}header .eyebrow::before,header .eyebrow::after{display:none}#menuButton{font-size:12px;padding:8px;gap:5px}#cities button{padding:8px 15px;font-size:12px}#citiesLeft,#citiesRight{padding:0 8px}.collection-caption{font-size:11px;gap:10px}.collection-caption strong{font-size:14px}#imageChoices{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}#imageChoices button{font-size:11px;padding:5px;min-height:36px}.board-section{padding:8px;border-width:3px}.scene-heading{gap:8px;justify-content:space-between}.scene-heading h2{font-size:18px}#stage{max-width:100%}.play-actions{gap:7px}.level-controls{width:100%;justify-content:center;margin:0 0 3px}#hintButton,#reshuffleButton{flex:1}#levels button{min-width:60px}.save-line{font-size:11px}}

#livingScene:not([hidden]){animation:picture-awakens 2.2s ease-out both}@keyframes picture-awakens{0%,22%{opacity:0}50%{opacity:1}100%{opacity:1}}@media(prefers-reduced-motion:reduce){#livingScene{animation:none!important;transform:none!important}}

/* ISS-0017: the page owns landscape gutters, including the iPhone safe area. */
@media(orientation:landscape) and (max-height:560px){body{padding-left:max(36px,env(safe-area-inset-left));padding-right:max(36px,env(safe-area-inset-right))}}

/* Puzzle-first layouts: a compact picture chooser on phones and portrait tablets,
   with the full collection beside the board on wide tablets. */
#collectionPanel[hidden]{display:none!important}
#collectionToggle{display:none}
@media(min-width:950px){
 body{padding:10px 14px;border-width:5px}
 header{max-width:1600px;margin-bottom:8px}
 header .header-brand{width:102px;height:72px}
 header h1{font-size:clamp(28px,3.4vw,48px)}
 main{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);grid-template-areas:"puzzle collection";gap:14px;max-width:1600px;align-items:start}
 .board-section{grid-area:puzzle;padding:12px}
 .collection-nav{grid-area:collection;position:sticky;top:10px;min-width:0;padding:10px;border:2px solid #0c354c;border-radius:12px;background:#fff5df}
 .collection-caption{justify-content:space-between;gap:5px;margin:10px 2px}
 .collection-caption strong{font-size:15px}
 #imageChoices{grid-template-columns:1fr;gap:5px}
 #imageChoices button{min-height:43px;text-align:left;font-size:13px}
 #cities button{padding:8px 12px;font-size:12px}
 #citiesLeft,#citiesRight{padding:0 6px}
 #stage{width:100%;max-width:min(100%,calc((100dvh - 220px)*1.5));margin-inline:auto}
 .scene-heading{justify-content:space-between}
}
@media(max-width:949px){
 body{border-width:4px;padding:8px max(8px,env(safe-area-inset-right)) 10px max(8px,env(safe-area-inset-left))}
 header{gap:8px;margin-bottom:7px;padding-bottom:0}
 header .header-brand{width:64px;height:48px}
 header h1{font-size:clamp(20px,4vw,31px);line-height:1.05}
 header .eyebrow{font-size:10px}
 #menuButton{min-height:40px;padding:6px 8px}
 main{display:flex;flex-direction:column;gap:7px;max-width:900px}
 .collection-nav{margin:0}
 #collectionToggle{display:block;width:100%;min-height:43px;padding:7px 12px;text-align:left;color:#082a3e;background:#fff5df;border:2px solid #0c354c;border-radius:8px;font-size:14px}
 #collectionToggle::after{content:"⌄";float:right;font-size:18px;line-height:1}
 #collectionToggle[aria-expanded=true]::after{content:"⌃"}
 .collection-panel{padding:8px 2px 4px}
 .board-section{width:100%;padding:7px;border-width:3px}
 .scene-heading{justify-content:space-between;margin-bottom:5px}
 .scene-heading h2{font-size:clamp(17px,3vw,23px)}
 .scene-heading .eyebrow{font-size:11px}
 #stage{width:100%;max-width:100%;margin-inline:auto}
 #feedback{margin:5px 0;font-size:13px}
 .level-controls{margin:0;gap:7px}
 #levels button{min-width:50px;padding:6px 9px}
 .play-actions{gap:6px}
 #hintButton,#reshuffleButton{min-height:42px;padding:8px 10px}
 .save-line{font-size:11px;margin:6px 0}
 footer{margin-top:6px;font-size:14px}
 footer img{width:48px;height:34px}
}
@media(max-width:560px){
 #imageChoices{grid-template-columns:repeat(2,minmax(0,1fr))}
 #imageChoices button{min-height:38px;font-size:11px}
 .scene-heading h2{font-size:17px}
 .level-controls{width:100%;justify-content:center}
 #levels button{min-width:52px}
}
@media(orientation:landscape) and (max-height:560px){
 body{padding-left:max(36px,env(safe-area-inset-left));padding-right:max(36px,env(safe-area-inset-right))}
 #stage{max-width:min(100%,680px)}
}
.arcade-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.arcade-link,.arcade-pending{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;border:1px solid #477c84;border-radius:10px;font-weight:700}.arcade-link{color:#082a3e;background:#fff5df;text-decoration:underline;text-underline-offset:3px}.arcade-link:hover{background:#e7f5e9}.arcade-link:focus-visible{outline:3px solid #ffb25d;outline-offset:3px}.arcade-pending{color:#526671;background:#f2e5cd}.arcade-home{margin-bottom:10px}
#menuNav[hidden],#menuNav button[hidden]{display:none!important}.menu-back{margin-top:16px;min-height:44px}
.arcade-current{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;border-radius:10px;background:#d9f2e8;color:#082a3e;font-weight:800}

.access-status{margin:8px 0 0;padding:8px 10px;border-left:4px solid #ed795c;background:#fff7e5;color:#082a3e;font-size:.9rem}.access-status:empty{display:none}