:root{--shadow:0 18px 55px rgba(0,71,135,.28),inset 0 1px 1px rgba(255,255,255,.9)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:"Trebuchet MS","Arial Rounded MT Bold",Arial,sans-serif;color:#fff;background:#0b7adf}button,a,input{font:inherit}button{cursor:pointer}
#bubble-layer{position:fixed;inset:0;z-index:9999;pointer-events:none;overflow:hidden}.cursor-bubble{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.9);background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.95),rgba(117,233,255,.28) 28%,rgba(30,140,255,.08) 58%,rgba(255,255,255,.28));box-shadow:inset -3px -4px 8px rgba(16,110,200,.2),0 0 10px rgba(145,240,255,.55);transform:translate3d(-50%,-50%,0);animation:bubbleFloat 1.25s ease-out forwards;will-change:transform,opacity}@keyframes bubbleFloat{to{opacity:0;transform:translate3d(var(--drift),-110px,0) scale(.45)}}
.glass{background:linear-gradient(180deg,rgba(245,253,255,.75),rgba(65,152,233,.28));border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow);backdrop-filter:blur(15px) saturate(1.35);-webkit-backdrop-filter:blur(15px) saturate(1.35)}
.language-switch{position:fixed;z-index:3000;top:18px;left:18px;padding:5px;border-radius:999px;display:flex;gap:4px}.lang-btn{border:0;border-radius:999px;padding:10px 14px;background:transparent;color:#064b8d;font-weight:1000}.lang-btn.active{color:#fff;background:linear-gradient(#59c8ff,#1478df);box-shadow:inset 0 1px 1px #fff,0 4px 14px rgba(0,77,160,.25)}
.splash{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:linear-gradient(rgba(0,90,210,.04),rgba(0,195,255,.04)),url('assets/city-intro.jpg') center/cover no-repeat;transition:opacity .8s ease,visibility .8s ease;overflow:hidden}.splash.hidden{opacity:0;visibility:hidden}.intro-wrap{position:relative;z-index:4;text-align:center;width:min(1180px,95vw);transform:translateY(-2vh)}
.bubble-logo{display:flex;flex-direction:column;align-items:center;line-height:.76;letter-spacing:-.08em;filter:drop-shadow(0 16px 14px rgba(0,61,159,.35))}.bubble-logo span,.mini-logo span{position:relative;display:block;font-family:"Arial Rounded MT Bold","Trebuchet MS",Arial,sans-serif;font-weight:1000;font-stretch:expanded;-webkit-text-stroke:5px rgba(250,252,255,.98);background:linear-gradient(180deg,#ffffff 0 7%,#b5fbff 14%,#41cfff 32%,#1183df 48%,#64cfff 58%,#d6f8ff 68%,#c5a1ff 78%,#ffb2ea 90%,#fff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 2px 0 #e8fdff,0 5px 0 #55cfff,0 9px 0 #246edb,0 13px 18px rgba(14,64,175,.48),4px -2px 0 #ffb2ef,-3px 1px 0 #9aeaff;filter:saturate(1.15);transform:scaleY(1.06) rotate(-.5deg)}
.bubble-logo span::before,.mini-logo span::before{content:attr(data-text);position:absolute;inset:0;color:transparent;-webkit-text-stroke:0;background:linear-gradient(165deg,rgba(255,255,255,.95) 4%,rgba(255,255,255,.4) 12%,transparent 24%,transparent 66%,rgba(255,191,244,.35) 82%,rgba(255,255,255,.85));-webkit-background-clip:text;background-clip:text;filter:blur(.2px);transform:translateY(-2px);pointer-events:none}.bubble-logo span::after{content:"✦";position:absolute;right:5%;top:8%;font-size:.18em;color:#fff;text-shadow:0 0 10px #fff,0 0 18px #8ff7ff;animation:twinkle 1.8s ease-in-out infinite}.bubble-logo span:nth-child(2)::after{left:8%;right:auto;top:25%}@keyframes twinkle{50%{opacity:.25;transform:scale(.65) rotate(20deg)}}
.bubble-logo span{font-size:clamp(78px,12vw,178px)}.bubble-logo span:last-child{font-size:clamp(66px,10.2vw,150px);margin-top:32px}.enter-link{margin-top:52px;border:2px solid rgba(255,255,255,.92);border-radius:999px;padding:14px 28px;background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(64,178,255,.3));box-shadow:inset 0 2px 2px #fff,0 10px 26px rgba(0,82,170,.25);color:white;font-weight:1000;font-size:clamp(20px,2vw,32px);letter-spacing:.14em;text-shadow:0 2px 4px #0d67bc,0 0 16px #bff7ff;transition:.2s}.enter-link:hover{transform:scale(1.05);filter:brightness(1.12)}
.sun-glow{position:absolute;right:6vw;top:3vw;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,#fff 0 12%,#e9ffff 13% 24%,rgba(135,238,255,.7) 25% 38%,transparent 70%);animation:pulse 4s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.1);filter:brightness(1.18)}}.floating-orb{position:absolute;border-radius:50%;border:2px solid rgba(255,255,255,.75);background:radial-gradient(circle at 28% 22%,white,rgba(255,255,255,.08) 25%,rgba(24,144,255,.14) 55%,rgba(255,255,255,.3));box-shadow:inset -12px -16px 26px rgba(0,80,200,.14),0 0 28px rgba(255,255,255,.45);animation:orb 8s ease-in-out infinite}.orb-a{width:120px;height:120px;left:8%;top:15%}.orb-b{width:65px;height:65px;right:20%;top:27%;animation-delay:-2s}.orb-c{width:42px;height:42px;left:24%;bottom:18%;animation-delay:-5s}@keyframes orb{50%{transform:translateY(-28px) translateX(10px)}}
.app{position:fixed;inset:0;opacity:0;pointer-events:none;transition:opacity .8s ease}.app.active{opacity:1;pointer-events:auto}.city-home{position:relative;width:100%;height:100%;overflow:hidden;background:#4dbce8}.home-bg-layer{position:absolute;inset:-2%;z-index:0;background-position:center;background-size:cover;background-repeat:no-repeat;opacity:0;transform:scale(1.025);transition:opacity 2.2s ease-in-out,transform 10s ease-out;will-change:opacity,transform;pointer-events:none}.home-bg-layer.active{opacity:1;transform:scale(1)}.city-sheen{position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,rgba(0,120,255,.02),rgba(38,205,255,.02) 52%,rgba(0,100,0,.03));pointer-events:none}.home-brand{position:absolute;z-index:6;left:4%;top:5%;pointer-events:none}.mini-logo{display:flex;flex-direction:column;line-height:.74;filter:drop-shadow(0 8px 10px rgba(0,55,140,.25))}.mini-logo span{font-size:clamp(42px,5.5vw,86px);-webkit-text-stroke:2px #fff}.mini-logo span:first-child:before{content:"FRUTIGER"}.mini-logo span:last-child:before{content:"PLACE"}.mini-logo span:last-child{font-size:clamp(34px,4.6vw,70px);margin-top:15px}
.home-controls{position:absolute;z-index:20;left:50%;bottom:24px;transform:translateX(-50%);display:flex;gap:14px;padding:10px;border-radius:999px;white-space:nowrap}.aero-button,.aero-link,.send-btn,.tiny-aero{border:1px solid rgba(255,255,255,.95);border-radius:999px;color:#034f99;font-weight:900;text-decoration:none;background:linear-gradient(#f9ffff 0%,#a8f1ff 38%,#68cbff 52%,#dcfbff 100%);box-shadow:inset 0 2px 2px white,inset 0 -6px 12px rgba(35,112,236,.18),0 8px 20px rgba(0,83,171,.28);padding:13px 22px;transition:transform .2s ease,filter .2s ease}.aero-button:hover,.aero-link:hover,.send-btn:hover,.tiny-aero:hover{transform:translateY(-2px) scale(1.02);filter:saturate(1.2)}.aero-button.secondary{background:linear-gradient(#fbfff5,#cfff98 42%,#83e95f 55%,#e6ffcf);color:#166e24}
.real-fish{position:absolute;z-index:8;height:auto;filter:drop-shadow(0 10px 10px rgba(0,45,95,.22));will-change:transform;pointer-events:none;animation:realSwim 18s linear infinite}.fish-a{top:28%;left:-26%;width:clamp(120px,18vw,300px);animation-duration:24s}.fish-b{top:56%;left:-20%;width:clamp(100px,13vw,205px);animation-duration:19s;animation-delay:-7s}.fish-c{top:19%;left:-18%;width:clamp(70px,8vw,125px);animation-duration:26s;animation-delay:-13s}.fish-d{top:72%;left:-20%;width:clamp(70px,9vw,140px);animation-duration:31s;animation-delay:-4s}.fish-e{top:43%;left:-17%;width:clamp(55px,7vw,100px);animation-duration:23s;animation-delay:-16s}@keyframes realSwim{0%{transform:translate3d(-18vw,0,0) rotate(-2deg)}25%{transform:translate3d(30vw,-16px,0) rotate(1deg)}50%{transform:translate3d(66vw,10px,0) rotate(-1deg)}75%{transform:translate3d(100vw,-10px,0) rotate(1deg)}100%{transform:translate3d(140vw,3px,0) rotate(-2deg)}}
.bubble-game{position:absolute;z-index:30;right:24px;top:24px;width:min(350px,31vw);min-width:290px;border-radius:23px;overflow:hidden;color:#fff;background:linear-gradient(180deg,rgba(14,84,171,.86),rgba(0,153,238,.52));box-shadow:0 20px 60px rgba(0,48,110,.35),inset 0 1px 1px #fff;transition:height .25s ease,transform .25s ease,opacity .25s ease}.bubble-game.minimized .game-content{display:none}.bubble-game.minimized{height:auto}.game-titlebar{display:flex;justify-content:space-between;align-items:center;padding:13px 14px 13px 17px;background:linear-gradient(#2e70b8,#164f94);font-size:18px;border-bottom:1px solid rgba(255,255,255,.7)}.window-actions{display:flex;gap:6px}.window-btn{border:0;width:30px;height:30px;border-radius:50%;color:#fff;font-size:19px;font-weight:1000;background:linear-gradient(#75d8ff,#2567cf);box-shadow:inset 0 1px 1px white}.game-stats{display:flex;justify-content:space-between;padding:12px 18px;font-size:16px}.game-area{height:260px;position:relative;overflow:hidden;border-top:1px solid rgba(255,255,255,.35);border-bottom:1px solid rgba(255,255,255,.35);background:linear-gradient(rgba(0,116,230,.34),rgba(0,190,255,.2));display:grid;place-items:center}.game-area #gameHint{font-weight:800;text-align:center;padding:18px;text-shadow:0 2px 4px #045797;opacity:.9}.game-bubble{position:absolute;border-radius:50%;border:1px solid #fff;background:radial-gradient(circle at 30% 24%,#fff 0 8%,rgba(210,255,255,.92) 9% 14%,rgba(71,217,255,.48) 28%,rgba(113,78,255,.22) 58%,rgba(255,118,228,.27) 78%,rgba(255,255,255,.6));box-shadow:inset -7px -8px 14px rgba(0,92,190,.2),0 0 12px rgba(185,249,255,.75);animation:gameBob 2.2s ease-in-out infinite alternate;cursor:pointer}.game-bubble:after{content:"";position:absolute;width:25%;height:12%;border-radius:50%;background:rgba(255,255,255,.8);left:19%;top:14%;transform:rotate(-24deg)}@keyframes gameBob{to{transform:translateY(-8px) scale(1.03)}}.pop-score{position:absolute;pointer-events:none;font-size:20px;font-weight:1000;color:#b8ff68;text-shadow:0 2px 3px #067b39;animation:scoreUp .65s ease-out forwards}@keyframes scoreUp{to{transform:translateY(-34px) scale(1.3);opacity:0}}.game-footer{display:flex;justify-content:space-between;align-items:center;padding:12px 16px}.tiny-aero{padding:7px 14px;font-size:12px}.restore-game{position:absolute;z-index:31;right:24px;top:24px;border-radius:999px;padding:12px 18px;color:#064b8d;font-weight:1000}
.chat-dialog,.wallpaper-dialog{border:0;padding:0;background:transparent;overflow:visible}.chat-dialog{width:min(980px,96vw)}.wallpaper-dialog{width:min(1000px,94vw)}.chat-dialog::backdrop,.wallpaper-dialog::backdrop{background:rgba(0,53,105,.42);backdrop-filter:blur(8px)}.icon-btn{border:0;color:#064b8d;font-weight:900;font-size:28px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.38)}.wallpaper-shell{border-radius:24px;padding:12px}.modal-titlebar{display:flex;align-items:center;justify-content:space-between;color:#073e76;padding:6px 8px 12px}.wallpaper-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.wallpaper-card{background:rgba(235,249,255,.6);border:1px solid rgba(255,255,255,.75);border-radius:18px;overflow:hidden;padding:8px}.wallpaper-card img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:13px;display:block}.wallpaper-card div{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#064b8d;padding:10px 4px 2px}.aero-link{padding:8px 12px;font-size:12px}
.chat-shell{border:2px solid rgba(255,255,255,.9);border-radius:22px;overflow:hidden;box-shadow:0 30px 100px rgba(0,38,93,.45);background:linear-gradient(#9ed4ff,#7eb6f4 70%,#7bd247)}.chat-titlebar{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;color:#073e76;background:linear-gradient(rgba(255,255,255,.7),rgba(90,164,255,.32));border-bottom:1px solid rgba(255,255,255,.8)}.chat-titlebar small{display:block;opacity:.7}.chat-body{display:grid;grid-template-columns:1fr 220px;min-height:560px;background:linear-gradient(rgba(90,169,255,.23),rgba(255,255,255,.05)),url('assets/city-intro.jpg') center/cover no-repeat}.messages-panel{display:flex;flex-direction:column;padding:12px;border-right:1px solid rgba(255,255,255,.7);min-width:0}.messages{flex:1;overflow-y:auto;background:rgba(220,239,255,.58);border:1px solid rgba(255,255,255,.8);border-radius:14px;padding:12px}.message{display:flex;gap:10px;margin:8px 0;color:#082a50}.message p{margin:0;padding:7px 11px;border-radius:12px;background:rgba(255,255,255,.52)}.avatar{width:34px;height:34px;flex:0 0 34px;border-radius:9px;display:grid;place-items:center;color:white;font-weight:1000}.avatar.aqua{background:linear-gradient(#6affff,#0b7cff)}.avatar.lime{background:linear-gradient(#d9ff65,#48a624)}.avatar.user{background:linear-gradient(#ffbcfb,#7b6dff)}.emoji-row{display:flex;gap:5px;padding:10px 0;overflow-x:auto}.emoji-row button{border:0;border-radius:12px;background:rgba(255,255,255,.6);font-size:23px;min-width:40px;height:40px}.chat-form{display:grid;grid-template-columns:120px 1fr auto;gap:8px}.chat-form input{border:1px solid rgba(255,255,255,.85);outline:0;border-radius:13px;padding:11px;background:rgba(235,249,255,.78);color:#073b68}.send-btn{padding:10px 16px}.people-panel{padding:14px;background:linear-gradient(rgba(217,236,255,.62),rgba(120,186,255,.36));color:#082f5a}.person{padding:7px 4px;border-bottom:1px solid rgba(255,255,255,.3);font-weight:800}.dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:7px}.green{background:#50ef4e}.pink{background:#ff5cad}.yellow{background:#ffd733}.blue{background:#4287ff}.vip{margin-top:16px;text-align:center;padding:10px;border-radius:999px;background:linear-gradient(#9e8cff,#5648eb);font-weight:1000}.chat-note{font-size:12px;line-height:1.4;font-weight:700;opacity:.78}
@media(max-width:900px){.bubble-game{right:12px;top:72px;width:300px}.restore-game{right:12px;top:72px}.home-brand{left:3%;top:8%}.home-controls{bottom:14px}.aero-button{padding:11px 14px;font-size:12px}}@media(max-width:700px){.language-switch{top:8px;left:8px}.lang-btn{padding:8px 10px}.bubble-game{top:58px;right:8px;width:248px;min-width:248px}.restore-game{top:58px;right:8px}.game-area{height:185px}.home-brand{transform:scale(.72);transform-origin:top left}.home-controls{max-width:calc(100% - 18px);white-space:normal}.wallpaper-grid{grid-template-columns:1fr}.chat-body{grid-template-columns:1fr}.people-panel{display:none}.chat-form{grid-template-columns:1fr auto}.chat-form #nameInput{grid-column:1/-1}.bubble-logo span{-webkit-text-stroke:3px white}.bubble-logo span:last-child{margin-top:22px}.enter-link{margin-top:38px}.real-fish{opacity:.86}}
@media(prefers-reduced-motion:reduce){.real-fish,.floating-orb,.sun-glow,.game-bubble,.bubble-logo span::after{animation:none!important}.cursor-bubble{display:none}}

/* Firebase live-chat additions */
.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:#ffd84a;box-shadow:0 0 8px currentColor;vertical-align:1px}.status-dot.connected{background:#59ff6e}.status-dot.offline,.status-dot.error{background:#ff5f73}.status-dot.setup{background:#ffd84a}.status-dot.connecting{animation:statusPulse 1s infinite alternate}@keyframes statusPulse{to{opacity:.35}}
.chat-system{margin:auto;padding:14px 18px;border-radius:16px;background:rgba(255,255,255,.48);border:1px solid rgba(255,255,255,.75);text-align:center;font-weight:700;color:#155a92;box-shadow:inset 0 1px 0 #fff}.chat-system.warning{color:#7d5b00}.chat-system.error{color:#a42d45}.message p{position:relative;min-width:0}.message-time{font-size:10px;font-weight:500;opacity:.55;margin-left:8px}.people-list{display:flex;flex-direction:column;gap:4px;max-height:240px;overflow:auto}.person.muted{opacity:.58;font-style:italic}.chat-form input:disabled,.chat-form button:disabled{opacity:.48;cursor:not-allowed}

/* Frutiger Aero footer / socials */
.home-controls{bottom:108px}
.aero-footer{position:absolute;z-index:45;left:22px;right:22px;bottom:18px;min-height:76px;border-radius:28px;padding:10px 16px;display:grid;grid-template-columns:minmax(250px,1.25fr) 1px minmax(210px,.8fr) 1px minmax(390px,1.55fr);gap:14px;align-items:center;color:#064684;background:linear-gradient(180deg,rgba(229,252,255,.82),rgba(48,148,235,.46) 54%,rgba(5,93,186,.55));box-shadow:0 16px 42px rgba(0,64,142,.34),inset 0 2px 2px rgba(255,255,255,.95),inset 0 -10px 25px rgba(0,76,179,.12);overflow:hidden}
.aero-footer::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 0 12%,rgba(255,255,255,.35) 20%,transparent 31% 72%,rgba(255,255,255,.22) 80%,transparent 91%);opacity:.65}.aero-footer::after{content:"";position:absolute;right:12px;top:6px;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle at 32% 25%,rgba(255,255,255,.95),rgba(110,231,255,.24) 35%,rgba(51,122,255,.1) 62%,rgba(255,255,255,.26));border:1px solid rgba(255,255,255,.55);opacity:.68;pointer-events:none}
.footer-copy,.social-zone,.footer-donate,.footer-divider{position:relative;z-index:2}.footer-copy{display:flex;align-items:center;gap:12px;font-weight:900;font-size:clamp(12px,1.08vw,16px);text-shadow:0 1px 0 rgba(255,255,255,.7)}.copyright-orb,.heart-orb{display:grid;place-items:center;flex:0 0 auto;width:42px;height:42px;border-radius:50%;color:white;font-weight:1000;font-size:20px;border:1px solid white;background:radial-gradient(circle at 30% 22%,#fff 0 9%,#79ddff 22%,#228be8 58%,#0a58bb 100%);box-shadow:inset 0 2px 2px #fff,0 5px 12px rgba(0,75,156,.3)}.footer-divider{width:1px;height:48px;background:linear-gradient(transparent,rgba(255,255,255,.9),rgba(7,92,169,.4),transparent)}
.footer-donate{border:1px solid rgba(255,255,255,.95);border-radius:999px;padding:9px 17px;display:flex;align-items:center;justify-content:center;gap:10px;color:white;font-weight:1000;letter-spacing:.035em;background:linear-gradient(180deg,#d9ffdf 0%,#75f06d 34%,#31cf59 52%,#a64cff 100%);box-shadow:inset 0 2px 2px rgba(255,255,255,.95),inset 0 -8px 14px rgba(59,29,198,.2),0 9px 20px rgba(38,75,169,.3);text-shadow:0 2px 4px rgba(0,72,80,.35);transition:.2s}.footer-donate:hover{transform:translateY(-2px) scale(1.025);filter:saturate(1.18) brightness(1.04)}.heart-orb{width:30px;height:30px;background:radial-gradient(circle at 30% 20%,#fff 0 10%,#ffb3db 24%,#ff5b9a 60%,#a933dc);font-size:16px}
.social-zone{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}.follow-label{font-weight:1000;font-size:13px;line-height:1.05;text-align:center;letter-spacing:.05em;color:#fff;text-shadow:0 2px 4px #0753a3;max-width:70px}.social-pill{min-width:130px;height:48px;padding:6px 14px 6px 7px;border:1px solid rgba(255,255,255,.9);border-radius:17px;display:flex;align-items:center;gap:8px;text-decoration:none;color:#fff;font-weight:1000;background:linear-gradient(180deg,rgba(66,184,255,.94),rgba(23,99,210,.94));box-shadow:inset 0 2px 2px #fff,inset 0 -6px 12px rgba(0,38,117,.18),0 7px 16px rgba(0,66,146,.26);text-shadow:0 2px 3px rgba(0,39,96,.35);transition:.2s}.social-pill:hover{transform:translateY(-2px);filter:brightness(1.1) saturate(1.2)}.social-pill.instagram{background:linear-gradient(135deg,#6249ff 0%,#b53cff 30%,#ff4d83 60%,#ffad34 100%)}.social-pill.tiktok{background:linear-gradient(135deg,#083d74,#0c87c7 48%,#592bc7)}.social-icon{width:35px;height:35px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,#fff,rgba(255,255,255,.35));color:#073c78;font-size:25px;box-shadow:inset 0 1px 2px #fff,0 3px 8px rgba(0,41,93,.24);text-shadow:none}.instagram .social-icon{color:#d72c8d}.tiktok .social-icon{color:#092846}
.donate-dialog{border:0;background:transparent;padding:18px;width:min(560px,92vw)}.donate-dialog::backdrop{background:rgba(0,70,135,.25);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.donate-shell{overflow:hidden;border-radius:28px;color:#074c8c;background:linear-gradient(180deg,rgba(247,255,255,.94),rgba(104,210,255,.74) 58%,rgba(133,255,140,.58));box-shadow:0 24px 70px rgba(0,50,120,.38),inset 0 1px 2px #fff}.donate-content{text-align:center;padding:30px 30px 28px}.donate-content h2{margin:10px 0 8px;font-size:clamp(20px,3vw,30px);text-shadow:0 1px 0 #fff}.donate-content p{margin:0 auto 22px;max-width:390px;font-weight:800;color:#17629e}.donate-bubble{margin:auto;width:82px;height:82px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:34px;background:radial-gradient(circle at 29% 22%,#fff 0 7%,#ffcae5 18%,#ff68a8 48%,#8a54ff 78%,#41dfff);border:2px solid #fff;box-shadow:inset -10px -13px 18px rgba(43,61,184,.22),0 0 22px rgba(125,235,255,.75)}
@media(max-width:980px){.aero-footer{grid-template-columns:1fr auto 1.2fr;gap:8px;left:10px;right:10px;bottom:10px;padding:8px 10px;min-height:70px}.footer-divider{display:none}.footer-copy{font-size:11px}.copyright-orb{width:32px;height:32px;font-size:16px}.footer-donate{padding:8px 11px;font-size:12px}.social-zone{gap:5px}.follow-label{display:none}.social-pill{min-width:0;width:46px;padding:5px;justify-content:center}.social-pill>span:last-child{display:none}.home-controls{bottom:92px}}
@media(max-width:620px){.aero-footer{grid-template-columns:1fr auto auto;border-radius:22px}.footer-copy span:last-child{font-size:9px;line-height:1.1}.footer-donate span:last-child{display:none}.footer-donate{width:45px;height:45px;padding:5px}.heart-orb{width:31px;height:31px}.social-pill{width:42px;height:42px}.social-icon{width:30px;height:30px;font-size:21px}.home-controls{bottom:84px;gap:6px;padding:7px}.aero-button{padding:10px 12px;font-size:11px}}

/* Frutiger Aero Cam */
.camera-button{background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(112,226,255,.75) 34%,rgba(40,151,255,.86) 58%,rgba(121,78,255,.84));}
.camera-dialog{border:0;background:transparent;padding:18px;width:min(980px,96vw)}
.camera-dialog::backdrop{background:rgba(0,61,125,.3);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.camera-shell{overflow:hidden;border-radius:30px;color:#073f78;background:linear-gradient(180deg,rgba(245,255,255,.95),rgba(102,203,255,.8) 44%,rgba(120,240,167,.6));box-shadow:0 30px 85px rgba(0,48,116,.45),inset 0 2px 2px #fff}
.camera-titlebar{min-height:72px}.camera-titlebar>div{display:flex;flex-direction:column;gap:2px}.camera-titlebar small{font-weight:800;opacity:.65}
.camera-stage{position:relative;aspect-ratio:16/9;margin:14px;border-radius:25px;overflow:hidden;border:2px solid rgba(255,255,255,.95);background:linear-gradient(#61c7ff,#8fffd4);box-shadow:inset 0 2px 2px #fff,0 14px 34px rgba(0,71,154,.28)}
.camera-bg,.camera-stage video,.camera-stage canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.camera-stage video{opacity:0;pointer-events:none}.camera-stage canvas{z-index:3}
.camera-stage::after{content:"";position:absolute;z-index:5;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 0 18%,rgba(255,255,255,.22) 27%,transparent 37% 68%,rgba(255,255,255,.14) 78%,transparent 90%);mix-blend-mode:screen}
.camera-placeholder{position:absolute;z-index:6;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:26px;color:white;text-shadow:0 3px 8px rgba(0,65,130,.55);background:linear-gradient(rgba(15,114,213,.08),rgba(0,104,164,.16))}.camera-placeholder[hidden]{display:none}.camera-placeholder strong{font-size:clamp(24px,4vw,42px)}.camera-placeholder span{margin-top:8px;max-width:570px;font-weight:800;font-size:clamp(13px,2vw,18px)}
.camera-orb{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;font-size:42px;margin-bottom:16px;background:radial-gradient(circle at 30% 22%,#fff 0 8%,#9df9ff 20%,#38b8ff 52%,#7c59ff 80%);border:2px solid white;box-shadow:inset -10px -12px 18px rgba(42,42,180,.2),0 0 26px rgba(136,245,255,.85)}
.camera-status{position:absolute;z-index:8;top:16px;left:16px;border-radius:999px;padding:8px 13px;color:#fff;font-weight:1000;background:rgba(0,94,178,.68);border:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 2px #fff,0 5px 14px rgba(0,55,130,.23);backdrop-filter:blur(7px)}.camera-status.live{background:rgba(39,176,81,.8)}.camera-status.error{background:rgba(217,55,85,.82)}
.camera-toolbar{display:grid;grid-template-columns:auto auto minmax(220px,1fr);gap:10px;align-items:center;padding:0 14px 14px}.camera-toolbar .aero-button{min-height:52px}.camera-stop{background:linear-gradient(#fff,#ffd1d9 34%,#ff728a 62%,#c33b8d)}.camera-select-wrap{display:flex;align-items:center;justify-content:flex-end;gap:10px;font-weight:1000;color:#07518f}.camera-select{appearance:none;-webkit-appearance:none;min-width:190px;border:1px solid rgba(255,255,255,.95);border-radius:18px;padding:13px 40px 13px 14px;font:inherit;font-weight:900;color:#07518f;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(193,246,255,.82));box-shadow:inset 0 2px 2px #fff,0 6px 16px rgba(0,75,153,.18)}
.camera-footnote{margin:0;padding:0 22px 18px;text-align:center;font-size:12px;font-weight:800;opacity:.7}
@media(max-width:720px){.camera-dialog{padding:8px}.camera-stage{margin:8px;border-radius:19px}.camera-toolbar{grid-template-columns:1fr 1fr}.camera-select-wrap{grid-column:1/-1;justify-content:center;flex-wrap:wrap}.camera-toolbar .aero-button{font-size:11px;padding:10px}.camera-footnote{font-size:10px}.home-controls{flex-wrap:wrap;justify-content:center}}


/* Frutiger Aero Radio */
.radio-button{background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(125,244,255,.78) 30%,rgba(39,195,221,.9) 52%,rgba(79,94,255,.9) 78%,rgba(198,75,255,.88));box-shadow:inset 0 2px 3px #fff,inset 0 -7px 15px rgba(63,33,190,.2),0 10px 22px rgba(0,72,160,.25)}
.radio-dialog{border:0;background:transparent;padding:18px;width:min(720px,95vw)}
.radio-dialog::backdrop{background:rgba(0,61,125,.3);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.radio-shell{overflow:hidden;border-radius:30px;color:#073f78;background:linear-gradient(180deg,rgba(246,255,255,.96),rgba(96,212,255,.84) 45%,rgba(112,245,167,.68));box-shadow:0 30px 85px rgba(0,48,116,.46),inset 0 2px 2px #fff}
.radio-titlebar{min-height:72px}.radio-titlebar>div{display:flex;flex-direction:column;gap:2px}.radio-titlebar small{font-weight:800;opacity:.66}
.radio-scene{position:relative;padding:22px;background:linear-gradient(rgba(26,146,239,.18),rgba(78,230,190,.26)),url('assets/city-home.webp') center/cover no-repeat;overflow:hidden}
.radio-scene::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0 16%,rgba(255,255,255,.23) 25%,transparent 36% 70%,rgba(255,255,255,.14) 80%,transparent 92%);pointer-events:none}
.radio-sun{position:absolute;right:36px;top:24px;width:74px;height:74px;border-radius:50%;display:grid;place-items:center;color:#fff8b5;font-size:44px;text-shadow:0 0 15px #fff,0 0 28px #59e7ff;filter:drop-shadow(0 0 12px #fff);animation:radioSun 8s linear infinite}
@keyframes radioSun{to{transform:rotate(360deg)}}
.radio-bubbles i{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.8);background:radial-gradient(circle at 32% 24%,rgba(255,255,255,.95),rgba(148,239,255,.3) 25%,rgba(113,119,255,.1) 65%,rgba(255,255,255,.25));box-shadow:inset -5px -7px 12px rgba(79,85,204,.12),0 0 12px rgba(166,244,255,.55);animation:radioFloat 6s ease-in-out infinite}
.radio-bubbles i:nth-child(1){width:55px;height:55px;left:6%;top:9%}.radio-bubbles i:nth-child(2){width:28px;height:28px;left:17%;top:35%;animation-delay:-2s}.radio-bubbles i:nth-child(3){width:44px;height:44px;right:9%;top:46%;animation-delay:-4s}.radio-bubbles i:nth-child(4){width:22px;height:22px;right:24%;top:13%;animation-delay:-1s}.radio-bubbles i:nth-child(5){width:34px;height:34px;left:10%;bottom:12%;animation-delay:-3s}
@keyframes radioFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-16px) scale(1.04)}}
.radio-card{position:relative;z-index:2;margin:54px auto 8px;padding:16px;width:min(560px,100%);border-radius:25px;background:linear-gradient(180deg,rgba(247,255,255,.91),rgba(188,245,255,.8) 46%,rgba(121,221,255,.7));box-shadow:0 18px 38px rgba(0,69,148,.32),inset 0 2px 2px #fff}
.radio-now{display:flex;align-items:center;gap:11px;padding:2px 3px 12px;color:#07518f}.radio-now>div:nth-child(2){display:flex;flex-direction:column;min-width:0}.radio-now b{font-size:14px;letter-spacing:.08em}.radio-now span{font-size:12px;font-weight:900;opacity:.72}.radio-live-dot{width:12px;height:12px;border-radius:50%;background:#51f36b;box-shadow:0 0 12px #51f36b,0 0 24px rgba(81,243,107,.7);flex:0 0 auto}
.radio-eq{margin-left:auto;height:28px;display:flex;align-items:flex-end;gap:3px}.radio-eq span{display:block;width:4px;border-radius:4px;background:linear-gradient(#76fbff,#4c64ff,#ca51ff);animation:radioEq .9s ease-in-out infinite alternate}.radio-eq span:nth-child(1){height:10px}.radio-eq span:nth-child(2){height:22px;animation-delay:-.2s}.radio-eq span:nth-child(3){height:15px;animation-delay:-.45s}.radio-eq span:nth-child(4){height:26px;animation-delay:-.65s}.radio-eq span:nth-child(5){height:13px;animation-delay:-.35s}@keyframes radioEq{to{height:5px}}
.spotify-player{display:block;background:rgba(7,66,130,.12);box-shadow:0 8px 20px rgba(0,48,116,.16)}
.open-spotify{margin:13px auto 0;width:max-content;max-width:100%;display:flex;align-items:center;gap:9px;text-decoration:none;color:white;font-weight:1000;letter-spacing:.04em;border:1px solid #fff;border-radius:999px;padding:10px 18px;background:linear-gradient(180deg,#a9ffb3,#31db75 44%,#17b45b 62%,#5b57ff 100%);box-shadow:inset 0 2px 2px #fff,0 8px 18px rgba(0,73,142,.27);text-shadow:0 2px 3px rgba(0,80,70,.35);transition:.2s}.open-spotify:hover{transform:translateY(-2px);filter:brightness(1.06) saturate(1.15)}.open-spotify>span:first-child{font-size:22px;line-height:1}
.radio-note{margin:10px 5px 0;text-align:center;font-size:11px;font-weight:800;color:#17639c;opacity:.8}
@media(max-width:620px){.radio-dialog{padding:8px}.radio-scene{padding:12px}.radio-card{margin-top:45px;padding:10px}.spotify-player{height:300px}.radio-titlebar small{font-size:9px}.radio-note{font-size:9px}}
.camera-photo{background:linear-gradient(180deg,#fff 0%,#dffcff 22%,#6fe7ff 46%,#319cff 68%,#7d5cff 100%);}
.camera-download{background:linear-gradient(180deg,#fff 0%,#e8ffd9 22%,#77ef83 48%,#28c760 72%,#1d9c66 100%);}
.camera-photo:disabled,.camera-download:disabled{filter:grayscale(.45);opacity:.48;cursor:not-allowed;transform:none}
.photo-preview-wrap{padding:0 14px 14px;display:flex;justify-content:center}.photo-preview-wrap[hidden]{display:none}
.photo-preview-card{position:relative;width:min(440px,92%);padding:10px;border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(135,237,255,.55),rgba(126,105,255,.36));border:2px solid rgba(255,255,255,.95);box-shadow:inset 0 2px 2px #fff,0 12px 28px rgba(0,75,153,.25)}
.photo-preview-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:15px;border:1px solid rgba(255,255,255,.95);box-shadow:0 7px 18px rgba(0,55,130,.2)}
.photo-preview-label{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);padding:7px 13px;border-radius:999px;color:#fff;font-weight:1000;font-size:12px;white-space:nowrap;background:linear-gradient(180deg,rgba(77,199,255,.92),rgba(79,73,234,.92));border:1px solid rgba(255,255,255,.9);box-shadow:inset 0 1px 2px #fff,0 4px 12px rgba(0,55,130,.25);text-shadow:0 1px 3px rgba(0,42,112,.55)}
@media(min-width:721px){.camera-toolbar{grid-template-columns:repeat(4,auto) minmax(220px,1fr)}}
@media(max-width:720px){.camera-toolbar{grid-template-columns:1fr 1fr}.camera-select-wrap{grid-column:1/-1}}

/* ===== Mobile-first polish: Frutiger Place ===== */
html{-webkit-text-size-adjust:100%;touch-action:manipulation}
button,a,input,select{touch-action:manipulation}
@supports(padding:max(0px)){
 .language-switch{top:max(8px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left))}
 .aero-footer{padding-bottom:max(8px,env(safe-area-inset-bottom))}
}
@media (hover:none),(pointer:coarse){
 .aero-button,.aero-link,.send-btn,.tiny-aero,.window-btn,.icon-btn,.lang-btn,.footer-donate,.social-pill{min-height:44px}
 .aero-button:hover,.aero-link:hover,.send-btn:hover,.tiny-aero:hover,.social-pill:hover,.footer-donate:hover{transform:none;filter:none}
 #bubble-layer{display:none}
}
@media(max-width:700px){
 html,body{height:100%;height:100dvh}
 body{overflow:hidden}
 .splash,.app,.city-home{height:100dvh;min-height:100dvh}
 .splash{background-position:52% center}
 .intro-wrap{width:96vw;transform:translateY(-4vh)}
 .bubble-logo{line-height:.82;letter-spacing:-.07em}
 .bubble-logo span{font-size:clamp(54px,18vw,92px);-webkit-text-stroke:3px rgba(250,252,255,.98)}
 .bubble-logo span:last-child{font-size:clamp(46px,15vw,78px);margin-top:18px}
 .enter-link{margin-top:34px;padding:13px 20px;font-size:clamp(16px,5vw,23px);max-width:88vw}
 .sun-glow{width:80px;height:80px;right:1vw;top:12vh}.orb-a{width:70px;height:70px}.orb-b{width:45px;height:45px}
 .city-home{background-position:50% center}
 .home-brand{left:10px;top:max(58px,calc(env(safe-area-inset-top) + 48px));transform:scale(.58);transform-origin:top left}
 .real-fish{opacity:.82}.fish-a{width:150px}.fish-b{width:110px}.fish-c,.fish-d,.fish-e{width:80px}
 .bubble-game{position:absolute;top:max(60px,calc(env(safe-area-inset-top) + 52px));right:8px;width:min(245px,72vw);min-width:0;max-height:52dvh}.game-area{height:150px}.game-stats{padding:8px 12px}.game-footer{padding:8px 10px}.game-titlebar{padding:9px 10px;font-size:15px}
 .restore-game{top:max(60px,calc(env(safe-area-inset-top) + 52px));right:8px;padding:9px 12px;font-size:12px}
 .home-controls{position:absolute;left:8px;right:8px;bottom:calc(82px + env(safe-area-inset-bottom));transform:none;max-width:none;width:auto;display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:7px;border-radius:20px;white-space:normal}
 .home-controls .aero-button{width:100%;min-width:0;padding:10px 7px;font-size:10px;line-height:1.15;white-space:normal}
 .aero-footer{left:7px;right:7px;bottom:max(6px,env(safe-area-inset-bottom));min-height:68px;grid-template-columns:minmax(0,1fr) 46px 46px 46px;gap:5px;border-radius:20px;padding:7px}
 .footer-copy{gap:6px;min-width:0}.copyright-orb{display:none}.footer-copy span:last-child{font-size:8.5px;line-height:1.15;overflow-wrap:anywhere}.footer-donate{width:44px;height:44px;padding:5px}.footer-donate>span:last-child{display:none}.social-zone{display:contents}.social-pill{width:44px;height:44px;padding:5px;justify-content:center;border-radius:14px}.social-pill>span:last-child,.follow-label{display:none}.social-icon{width:31px;height:31px;font-size:21px}
 dialog{max-width:100vw;max-height:100dvh}.chat-dialog,.wallpaper-dialog,.camera-dialog,.radio-dialog,.donate-dialog{width:100vw;max-width:100vw;margin:auto;padding:6px}
 .chat-shell,.camera-shell,.radio-shell,.wallpaper-shell,.donate-shell{border-radius:20px;max-height:94dvh}
 .chat-body{display:flex;min-height:0;height:min(72dvh,650px)}.messages-panel{width:100%;padding:8px;border-right:0}.messages{min-height:0}.people-panel{display:none}.chat-form{grid-template-columns:1fr auto;gap:6px}.chat-form #nameInput{grid-column:1/-1}.chat-form input{min-width:0;padding:10px}.send-btn{padding:9px 13px}.emoji-row{padding:7px 0}.emoji-row button{min-width:44px;height:44px}
 .wallpaper-shell{overflow:auto;max-height:94dvh}.wallpaper-grid{grid-template-columns:1fr;gap:10px}.wallpaper-card img{aspect-ratio:16/9}
 .camera-dialog{overflow:auto}.camera-shell{max-height:96dvh;overflow:auto}.camera-titlebar,.radio-titlebar{min-height:54px}.camera-stage{aspect-ratio:4/3;margin:7px;border-radius:17px}.camera-status{top:9px;left:9px;font-size:11px;padding:6px 9px}.camera-placeholder{padding:15px}.camera-orb{width:64px;height:64px;font-size:30px;margin-bottom:9px}.camera-placeholder strong{font-size:22px}.camera-placeholder span{font-size:12px}.camera-toolbar{grid-template-columns:1fr 1fr;gap:7px;padding:0 7px 8px}.camera-toolbar .aero-button{min-height:46px;padding:8px 5px;font-size:10px}.camera-select-wrap{grid-column:1/-1;justify-content:center;gap:6px;font-size:11px}.camera-select{min-width:0;width:100%;padding:10px 32px 10px 10px}.photo-preview-wrap{padding:0 7px 8px}.photo-preview-card{width:100%;padding:7px}.camera-footnote{padding:0 12px 12px;font-size:9px}
 .radio-shell{max-height:94dvh;overflow:auto}.radio-scene{padding:9px}.radio-card{margin:36px auto 5px;padding:8px;border-radius:18px}.spotify-player{height:260px}.open-spotify{font-size:12px;padding:9px 14px}.radio-sun{width:54px;height:54px;font-size:32px;right:15px;top:10px}
 .donate-dialog{overflow:auto}.donate-content{padding:20px 16px}.donate-bubble{width:66px;height:66px;font-size:28px}
}
@media(max-width:390px){
 .bubble-logo span{font-size:50px}.bubble-logo span:last-child{font-size:43px}
 .home-controls{bottom:calc(76px + env(safe-area-inset-bottom));gap:5px}.home-controls .aero-button{font-size:9px;padding:8px 4px}
 .aero-footer{min-height:62px;grid-template-columns:minmax(0,1fr) 40px 40px 40px}.footer-donate,.social-pill{width:39px;height:39px}.heart-orb,.social-icon{width:28px;height:28px}
 .bubble-game{width:min(220px,70vw)}.game-area{height:130px}
}
@media(max-width:700px) and (orientation:landscape){
 .home-brand{transform:scale(.42);top:48px}.home-controls{left:50%;right:auto;bottom:8px;transform:translateX(-50%);width:min(650px,76vw);grid-template-columns:repeat(4,1fr)}
 .aero-footer{left:auto;width:210px;grid-template-columns:1fr 38px 38px 38px}.footer-copy span:last-child{font-size:7px}
 .bubble-game{max-height:78dvh;top:48px}.game-area{height:105px}
 .camera-stage{aspect-ratio:16/7}.chat-body{height:68dvh}
}

/* Donation + contact footer update */
.footer-donate{text-decoration:none}.contact-pill{background:linear-gradient(180deg,rgba(245,255,255,.96),rgba(123,229,255,.9) 38%,rgba(44,149,235,.95) 66%,rgba(93,89,236,.92));}
@media(max-width:980px){.social-zone{flex-wrap:nowrap}.contact-pill{width:46px;min-width:46px;padding:5px;justify-content:center}.contact-pill>span:last-child{display:none}}
@media(max-width:620px){.contact-pill{width:42px;min-width:42px;height:42px}}


/* ===== Mobile final pass ===== */
@media(max-width:700px){
  :root{--mobile-edge:max(7px,env(safe-area-inset-left));}
  html,body{width:100%;height:100%;height:100dvh;overflow:hidden;overscroll-behavior:none}
  body{min-width:0}
  .city-home{background-position:center center}

  /* Keep the main action dock reachable by thumbs and clear of the footer. */
  .home-controls{
    left:max(7px,env(safe-area-inset-left));
    right:max(7px,env(safe-area-inset-right));
    bottom:calc(78px + env(safe-area-inset-bottom));
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    padding:6px;
    max-height:122px;
    overflow:visible;
  }
  .home-controls .aero-button{
    min-height:46px;
    padding:8px 5px;
    font-size:10px;
    line-height:1.1;
    text-align:center;
  }

  /* Five-column footer: copyright + donate + contact + TikTok + Instagram. */
  .aero-footer{
    left:max(6px,env(safe-area-inset-left));
    right:max(6px,env(safe-area-inset-right));
    bottom:max(5px,env(safe-area-inset-bottom));
    min-height:66px;
    grid-template-columns:minmax(0,1fr) repeat(4,44px);
    gap:4px;
    padding:6px;
    border-radius:18px;
  }
  .footer-copy{min-width:0;overflow:hidden}
  .footer-copy span:last-child{font-size:8px;line-height:1.08;display:block;overflow-wrap:anywhere}
  .footer-donate,.social-pill,.contact-pill{width:44px;min-width:44px;height:44px;min-height:44px;padding:5px;border-radius:14px}
  .heart-orb,.social-icon{width:30px;height:30px;font-size:20px}
  .social-zone{display:contents}
  .follow-label,.footer-donate>span:last-child,.social-pill>span:last-child{display:none}

  /* Make overlays behave like mobile sheets instead of desktop windows. */
  .chat-dialog,.wallpaper-dialog,.camera-dialog,.radio-dialog,.donate-dialog{
    width:100vw;max-width:100vw;height:auto;max-height:100dvh;padding:4px;margin:auto;
  }
  .chat-shell,.wallpaper-shell,.camera-shell,.radio-shell,.donate-shell{
    width:100%;max-width:100%;max-height:calc(100dvh - 8px);border-radius:18px;overflow:auto;
  }
  .modal-titlebar,.chat-titlebar,.camera-titlebar,.radio-titlebar{position:sticky;top:0;z-index:20}
  .icon-btn{min-width:44px;min-height:44px}

  /* Chat: use nearly the full phone height and keep the composer visible. */
  .chat-body{height:calc(100dvh - 76px);min-height:0;display:flex;flex-direction:column}
  .messages-panel{height:100%;min-height:0;padding:7px}
  .messages{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .emoji-row{flex:0 0 auto;scrollbar-width:none}
  .emoji-row::-webkit-scrollbar{display:none}
  .chat-form{flex:0 0 auto;grid-template-columns:minmax(0,1fr) auto;gap:6px;padding-bottom:max(2px,env(safe-area-inset-bottom))}
  .chat-form #nameInput{grid-column:1/-1}
  .chat-form input{font-size:16px} /* prevents iOS auto zoom */
  .send-btn{min-width:72px}

  /* Camera controls stay large enough to tap and preview remains visible. */
  .camera-stage{aspect-ratio:4/3;max-height:46dvh}
  .camera-toolbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:0 7px 8px}
  .camera-toolbar .aero-button{width:100%;min-height:48px;font-size:10px;padding:7px 4px}
  .camera-select-wrap{grid-column:1/-1;width:100%}
  .camera-select{font-size:16px}
  .photo-preview-card{width:100%}

  /* Radio and wallpapers get independent scrolling instead of clipping. */
  .radio-scene,.wallpaper-shell{overflow:auto;-webkit-overflow-scrolling:touch}
  .spotify-player{height:235px;min-height:235px}
  .wallpaper-grid{grid-template-columns:1fr}

  /* Bubble Pop stays compact and does not cover the whole scene. */
  .bubble-game{width:min(224px,68vw);max-height:48dvh;top:max(56px,calc(env(safe-area-inset-top) + 48px));right:max(6px,env(safe-area-inset-right))}
  .game-area{height:132px}
  .game-titlebar{font-size:14px}
  .window-btn{width:34px;height:34px;min-height:34px}
}

@media(max-width:390px){
  .home-brand{transform:scale(.5)}
  .home-controls{bottom:calc(70px + env(safe-area-inset-bottom));gap:4px;padding:5px}
  .home-controls .aero-button{min-height:43px;font-size:9px;padding:6px 3px}
  .aero-footer{min-height:60px;grid-template-columns:minmax(0,1fr) repeat(4,38px);gap:3px;padding:5px}
  .footer-donate,.social-pill,.contact-pill{width:38px;min-width:38px;height:38px;min-height:38px;padding:4px}
  .heart-orb,.social-icon{width:27px;height:27px;font-size:18px}
  .footer-copy span:last-child{font-size:7.2px}
  .bubble-game{width:min(210px,66vw)}
}

@media(max-width:340px){
  .footer-copy span:last-child{font-size:0}
  .footer-copy span:last-child::after{content:"© 2026 Frutiger Place";font-size:7.5px;line-height:1.05}
  .aero-footer{grid-template-columns:minmax(0,1fr) repeat(4,36px)}
  .footer-donate,.social-pill,.contact-pill{width:36px;min-width:36px;height:36px;min-height:36px}
}

@media(max-width:700px) and (orientation:landscape){
  .home-brand{top:max(42px,env(safe-area-inset-top));transform:scale(.38)}
  .home-controls{left:8px;right:auto;bottom:max(6px,env(safe-area-inset-bottom));width:calc(100vw - 230px);grid-template-columns:repeat(4,minmax(0,1fr));max-height:none}
  .aero-footer{left:auto;right:max(6px,env(safe-area-inset-right));width:214px;grid-template-columns:minmax(0,1fr) repeat(4,34px);min-height:52px}
  .footer-donate,.social-pill,.contact-pill{width:34px;min-width:34px;height:34px;min-height:34px}
  .heart-orb,.social-icon{width:25px;height:25px;font-size:16px}
  .footer-copy span:last-child{font-size:6.5px}
  .chat-body{height:calc(100dvh - 64px)}
  .camera-stage{aspect-ratio:16/7;max-height:55dvh}
  .spotify-player{height:190px;min-height:190px}
}

/* Compact fixed-size chat: the window never grows with message count. */
.chat-dialog{width:min(760px,92vw);max-height:82dvh}
.chat-shell{height:min(520px,78dvh);max-height:78dvh;display:flex;flex-direction:column;overflow:hidden}
.chat-titlebar{flex:0 0 auto}
.chat-body{flex:1;min-height:0;height:auto;display:grid;grid-template-columns:minmax(0,1fr) 180px;overflow:hidden}
.messages-panel{height:100%;min-height:0;overflow:hidden}
.messages{flex:1;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.emoji-row,.chat-form{flex:0 0 auto}
.people-panel{min-height:0;overflow-y:auto}

@media(max-width:700px){
  .chat-dialog{width:94vw;max-width:94vw;height:auto;max-height:76dvh;padding:0}
  .chat-shell{width:100%;height:72dvh;max-height:72dvh;border-radius:18px;overflow:hidden}
  .chat-body{height:auto;min-height:0;display:flex;flex-direction:column;overflow:hidden}
  .messages-panel{height:100%;min-height:0;padding:7px;overflow:hidden}
  .messages{flex:1;min-height:0;overflow-y:auto}
  .people-panel{display:none}
  .chat-titlebar{padding:8px 10px}
  .chat-titlebar strong{font-size:13px}
  .chat-titlebar small{font-size:9px}
  .emoji-row{padding:5px 0}
  .emoji-row button{min-width:36px;width:36px;height:36px;font-size:19px}
  .chat-form{grid-template-columns:minmax(0,1fr) auto;gap:5px;padding-bottom:max(2px,env(safe-area-inset-bottom))}
  .chat-form #nameInput{grid-column:1/-1;padding:8px}
  .chat-form #messageInput{padding:9px}
  .send-btn{min-width:66px;padding:8px 10px}
}

@media(max-width:390px){
  .chat-dialog{width:96vw;max-width:96vw;max-height:72dvh}
  .chat-shell{height:68dvh;max-height:68dvh}
}

/* Radio: Stream Music + Shop */
.radio-extra-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px auto 0;max-width:440px}
.radio-action{min-height:46px;border:1px solid rgba(255,255,255,.96);border-radius:999px;padding:10px 14px;display:flex;align-items:center;justify-content:center;gap:8px;text-align:center;text-decoration:none;color:#fff;font-weight:1000;letter-spacing:.035em;text-shadow:0 2px 3px rgba(0,60,100,.35);box-shadow:inset 0 2px 2px #fff,inset 0 -7px 14px rgba(34,66,180,.18),0 8px 18px rgba(0,73,142,.23);transition:transform .2s ease,filter .2s ease}
.radio-action:hover{transform:translateY(-2px) scale(1.02);filter:brightness(1.08) saturate(1.15)}
.stream-music{background:linear-gradient(180deg,#efffff 0%,#7ef3ff 27%,#25bce8 51%,#4d72ff 76%,#9e5cff 100%)}
.shop-link{background:linear-gradient(180deg,#fbfff0 0%,#c9ff7d 28%,#59df70 52%,#20bca8 76%,#368bff 100%)}
@media(max-width:620px){.radio-extra-actions{grid-template-columns:1fr;gap:7px;max-width:100%}.radio-action{min-height:44px;padding:9px 12px;font-size:12px}}

/* Stream + Shop fixed build */
.shop-button{background:linear-gradient(180deg,#fbfff0 0%,#d9ff9f 28%,#6ce982 52%,#28c7b0 74%,#428cff 100%);color:#075b62;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.radio-extra-actions{position:relative;z-index:4}
@media(max-width:700px){.shop-button{min-height:44px}}

/* Radio has Stream Music only; Shop remains on home screen */
.radio-extra-actions{grid-template-columns:1fr;max-width:300px}


/* Homepage rotating Frutiger Aero backgrounds */
@media(prefers-reduced-motion:reduce){.home-bg-layer{transition:none!important;transform:none!important}}

/* ===== Mobile pass for rotating-home-background build ===== */
@media(max-width:700px){
  /* Cross-fade layers stay pinned to the dynamic viewport. No zoom on phones: it is smoother and avoids exposed edges while Safari resizes its bars. */
  .city-home{height:100dvh;min-height:100dvh;background:#39b9e9}
  .home-bg-layer{
    inset:0;
    width:100%;height:100%;
    background-size:cover;
    background-position:center center;
    transform:none;
    transition:opacity 1.45s ease-in-out;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
    will-change:opacity;
  }
  .home-bg-layer.active{transform:none}

  /* Five home actions fit without covering the footer. */
  .home-controls{
    left:max(7px,env(safe-area-inset-left));
    right:max(7px,env(safe-area-inset-right));
    bottom:calc(76px + env(safe-area-inset-bottom));
    width:auto;
    max-height:none;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:5px;
    padding:6px;
    border-radius:18px;
  }
  .home-controls .aero-button{
    min-width:0;
    min-height:42px;
    padding:7px 4px;
    font-size:9px;
    line-height:1.08;
    white-space:normal;
  }
  .home-controls .shop-button{grid-column:2/3}

  /* Keep foreground content legible across bright/dark rotating wallpapers. */
  .city-sheen{background:linear-gradient(180deg,rgba(0,110,230,.04),rgba(255,255,255,.025) 48%,rgba(0,95,125,.055))}
}

@media(max-width:390px){
  .home-bg-layer{background-position:center center}
  .home-controls{bottom:calc(70px + env(safe-area-inset-bottom));gap:4px;padding:5px}
  .home-controls .aero-button{min-height:39px;font-size:8px;padding:5px 3px}
}

@media(max-width:700px) and (orientation:landscape){
  .home-bg-layer{background-position:center center}
  .home-controls{
    left:max(7px,env(safe-area-inset-left));
    right:auto;
    bottom:max(6px,env(safe-area-inset-bottom));
    width:calc(100vw - 228px);
    transform:none;
    grid-template-columns:repeat(5,minmax(0,1fr));
  }
  .home-controls .shop-button{grid-column:auto}
  .home-controls .aero-button{min-height:38px;font-size:8px;padding:5px 2px}
}

/* ===== Mobile tap fix ===== */
@media(max-width:700px){
  .home-controls{
    z-index:80 !important;
    pointer-events:auto !important;
    isolation:isolate;
    touch-action:manipulation;
  }
  .home-controls .aero-button,
  .home-controls button,
  .home-controls a{
    position:relative;
    z-index:2;
    pointer-events:auto !important;
    touch-action:manipulation;
    -webkit-tap-highlight-color:rgba(255,255,255,.22);
  }
  .aero-footer{z-index:45}
  .city-sheen,.home-bg-layer,.real-fish,.home-brand{pointer-events:none !important}
}
