.collecto-nav-controls{position:fixed;top:78px;right:12px;left:auto;z-index:9995;display:flex;gap:9px;align-items:center}.collecto-nav-circle{width:43px;height:43px;display:grid;place-items:center;border-radius:50%;border:1.5px solid #d6b66b;background:#071b36;color:#e8c178;font-size:23px;cursor:pointer;box-shadow:0 4px 15px #0007}.collecto-nav-circle:hover,.collecto-nav-circle:focus-visible{background:#12375b;outline:2px solid #e8c178;outline-offset:2px}.collecto-nav-panel{position:absolute;top:53px;right:0;left:auto;width:min(300px,calc(100vw - 80px));max-height:70vh;overflow:auto;border:1px solid #d6b66b;border-radius:15px;background:#091d36;padding:12px;box-shadow:0 12px 35px #000b}.collecto-nav-panel[hidden]{display:none!important}.collecto-nav-panel a{display:block;color:#e8c178;text-decoration:none;padding:11px;border-radius:9px;font-size:15px}.collecto-nav-panel a:hover,.collecto-nav-panel a:focus-visible{background:#1a3655}.hero .actions .btn{background:#081d39!important;color:#e9c678!important;border:1.5px solid #d6b66b!important;border-radius:999px!important;display:inline-flex;align-items:center;gap:10px;justify-content:flex-start;padding:12px 20px 12px 11px!important;box-shadow:none!important;text-decoration:none}.hero .actions .btn::before{content:"";display:inline-block;width:24px;height:24px;flex:none;border-radius:50%;background:#a52946;border:2px solid #e3c17d;box-shadow:inset 0 0 0 4px #0a1b35}.hero .actions .btn.btn-navy::before{background:#3675b8}.hero .actions .btn.gold::before{background:#c6a448}.hero .actions .btn.btn-turquoise::before{background:#25a9a5}.hero .actions #collectoAdminEntry::before{background:#768596}.hero .actions .btn:hover{background:#12375b!important;transform:translateY(-1px)}.hero .actions .btn[hidden]{display:none!important}@media(max-width:700px){.collecto-nav-controls{top:70px;right:12px;left:auto}.collecto-nav-circle{width:40px;height:40px}.collecto-nav-panel{right:0;left:auto;top:49px}.hero .actions .btn{width:100%;max-width:360px}}
.hero .actions .btn.btn-kids::before{background:#b68ad9}

/* Keep the mobile account indicator centred, with navigation away from the logo. */
@media(max-width:700px){header .top-actions{width:100%;}header .top-actions>.icon-btn{display:flex;justify-content:center;align-items:center;width:max-content;max-width:calc(100% - 24px);margin-left:auto;margin-right:auto;text-align:center;} .collecto-nav-controls{max-width:calc(100vw - 24px)} }

/* Mobile header: separate logo/navigation, account, and language rows. */
@media(max-width:700px){
 header{position:relative!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important;padding-bottom:16px!important;}
 header>a:first-child{align-self:flex-start!important;}
 header .top-actions{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:12px!important;width:100%!important;min-width:0!important;}
 header .top-actions>.icon-btn{margin:0 auto!important;max-width:100%!important;align-self:center!important;}
 header .top-actions .language-picker{width:min(100%,400px)!important;max-width:100%!important;box-sizing:border-box!important;margin:0 auto!important;}
 .collecto-nav-controls{top:190px!important;right:14px!important;left:auto!important;gap:8px!important;}
 .collecto-nav-circle{width:42px;height:42px;}
}

/* Navigation belongs to the page header, not to the scrolling viewport. */
.collecto-nav-controls{position:absolute!important;top:22px!important;right:16px!important;left:auto!important;z-index:9995!important;}
.collecto-nav-panel{position:absolute!important;top:54px!important;right:0!important;left:auto!important;}
@media(max-width:700px){.collecto-nav-controls{top:24px!important;right:16px!important;left:auto!important;gap:8px!important;}.collecto-nav-circle{width:42px;height:42px;}.collecto-nav-panel{top:50px!important;right:0!important;left:auto!important;}}

/* Strong, optically centred back arrow. */
#collectoBack{display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;line-height:1!important;}
#collectoBack .collecto-back-glyph{display:block;font-family:Arial,system-ui,sans-serif;font-size:32px;font-weight:800;line-height:1;transform:translate(0,-2px);text-align:center;}
/* The management shortcut must remain absent for non-admin visitors. */
#collectoAdminEntry[hidden]{display:none!important;}

/* Collecto mobile polish: native controls share the navy/gold visual language. */
:root{--collecto-control-bg:#10243f;--collecto-control-gold:#e8c178}
select, input[type="file"]::file-selector-button{font:inherit}
select{max-width:100%;min-height:44px;box-sizing:border-box;background:#10243f!important;color:#f3d18a!important;border:1.5px solid #d6b66b!important;border-radius:13px!important;padding:10px 36px 10px 13px!important;color-scheme:dark}
select option{background:#10243f;color:#f3d18a}
input[type="file"]{display:block;max-width:100%;width:100%;box-sizing:border-box;min-width:0;color:#e9c678;background:#0c1d36;border:1px solid #d6b66b;border-radius:13px;padding:10px}
input[type="file"]::file-selector-button{background:#10243f;color:#e9c678;border:1.5px solid #d6b66b;border-radius:999px;padding:10px 14px;margin:0 12px 4px 0;cursor:pointer}
#collectoBedtime{max-width:100%;overflow-wrap:anywhere}
#collectoBedtime label{display:block;margin:16px 0 7px;color:#e9c678;font-weight:700}
#collectoBedtime select{display:block;width:min(100%,440px);margin:0 auto 12px}
#collectoBedtime>h2,#collectoBedtime>h3,#collectoBedtime>p{text-align:center}
#collectoBedtime>div{justify-content:center}
#collectoBedtime audio{max-width:100%;margin:16px auto!important}
.profile-photo-panel{min-width:0;max-width:100%;box-sizing:border-box}
.profile-photo-panel label.btn:has(input[type="file"]){display:flex!important;flex-direction:column;align-items:stretch;justify-content:center;gap:12px;width:100%;max-width:460px;margin:20px auto 0;box-sizing:border-box;white-space:normal;text-align:center;padding:16px!important;background:#0d2442!important;color:#e9c678!important;border:1.5px solid #d6b66b!important;border-radius:18px!important;overflow:hidden}
.profile-photo-panel label.btn input[type="file"]{position:static!important;opacity:1!important;visibility:visible!important;width:100%!important;max-width:100%!important;box-sizing:border-box}
#profilePhotoRefresh{display:block;margin:24px auto 18px!important;background:#10243f!important;color:#e9c678!important;border:1.5px solid #d6b66b!important;border-radius:999px!important}
#profilePhoto{max-width:100%;box-sizing:border-box}
#pollForm label{display:flex;align-items:center;gap:12px;min-width:0}
#pollForm input[type="radio"]{accent-color:#e8c178;flex:none}
@media(max-width:700px){
 header .top-actions{gap:10px!important;align-items:stretch!important}
 header .top-actions>a,header .top-actions>button,header .top-actions>.icon-btn{box-sizing:border-box;max-width:100%!important}
 header .top-actions>.icon-btn{width:fit-content!important;min-width:140px;text-align:center}
 header .top-actions .language-picker{margin-top:4px!important}
 .profile-photo-panel .form-grid{min-width:0}
 .profile-photo-panel .form-grid>*{min-width:0;max-width:100%;box-sizing:border-box}
 .profile-photo-panel input{max-width:100%;box-sizing:border-box}
}

/* Market currency selector and account/market actions: responsive navy and gold. */
#bankCurrency,#marketCurrency,[id*="Currency"],[name="currency"]{display:inline-block;vertical-align:middle;max-width:100%;margin:8px auto}
.section:has(#bankCurrency),.section:has(#marketCurrency){min-width:0}
.section:has(#bankCurrency)>label,.section:has(#marketCurrency)>label{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;max-width:100%;margin:16px auto}
.final-card .btn:not(.gold),.final-card button:not(.gold),.collecto-final .btn:not(.gold),.collecto-final button:not(.gold){background:#10243f;color:#e9c678;border:1.5px solid #d6b66b;border-radius:14px}
@media(max-width:700px){
 #bankCurrency,#marketCurrency,[id*="Currency"]{width:min(100%,230px);margin:10px auto}
 .section:has(#bankCurrency)>label,.section:has(#marketCurrency)>label{flex-direction:column;text-align:center}
 .profile-photo-panel .btn,.profile-photo-panel label.btn{max-width:100%;white-space:normal}
}


/* November mobile polish: profile uploader and bedtime controls. */
.collecto-photo-upload{display:flex;flex-direction:column;align-items:center;gap:12px;width:min(100%,460px);max-width:100%;margin:18px auto 24px;padding:18px 14px;box-sizing:border-box;border:1.5px solid #d6b66b;border-radius:18px;background:#0d2442;text-align:center}
.collecto-photo-title{display:block;color:#f3d18a;font-weight:700;line-height:1.5;overflow-wrap:anywhere}
.collecto-photo-upload input[type=file]{width:100%;min-width:0;max-width:100%;margin:0!important;white-space:normal}
.collecto-photo-upload #profilePhotoRefresh{margin:14px auto 0!important;max-width:100%;white-space:normal}
#collectoBedtime input[type=file]{width:min(100%,460px);margin:12px auto}
#collectoBedtime audio{display:block!important;width:min(100%,460px)!important;max-width:100%;color-scheme:dark}
#collectoBedtime button:not(.gold){background:#10243f!important;color:#f3d18a!important;border:1.5px solid #d6b66b!important;border-radius:14px!important}
#collectoBedtime button:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:700px){.collecto-photo-upload{padding:16px 12px}.collecto-photo-upload input[type=file]::file-selector-button{display:block;margin:0 auto 10px}.collecto-photo-upload #profilePhotoRefresh{width:min(100%,230px)}#collectoBedtime{padding-left:12px!important;padding-right:12px!important}}


/* Kids activity tiles: consistent gold-framed, colourful, touch-friendly controls. */
.collecto-kids-stories-tile,.collecto-kids-songs-tile{display:flex!important;align-items:center!important;justify-content:center!important;gap:12px!important;min-height:74px!important;max-width:100%;box-sizing:border-box;padding:14px 20px!important;border:2px solid #e5c476!important;border-radius:19px!important;color:#fff6dd!important;text-decoration:none!important;font-weight:800!important;font-size:clamp(16px,3.6vw,20px)!important;line-height:1.3!important;text-align:center!important;white-space:normal!important;box-shadow:0 6px 0 #071528,0 10px 24px #0006,inset 0 1px 0 #fff4!important;transition:transform .18s ease,box-shadow .18s ease}
.collecto-kids-stories-tile{background:linear-gradient(145deg,#5a3f92,#34265f)!important}
.collecto-kids-songs-tile{background:linear-gradient(145deg,#176b83,#164361)!important}
.collecto-kids-stories-tile::before{content:"📖";font-size:30px;line-height:1}
.collecto-kids-songs-tile::before{content:"🎵";font-size:30px;line-height:1}
.collecto-kids-stories-tile:hover,.collecto-kids-songs-tile:hover{transform:translateY(-2px);box-shadow:0 8px 0 #071528,0 14px 28px #0007,inset 0 1px 0 #fff5!important}
.collecto-kids-stories-tile:focus-visible,.collecto-kids-songs-tile:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media(max-width:700px){.collecto-kids-stories-tile,.collecto-kids-songs-tile{width:100%;min-height:72px!important;padding:14px!important}}
@media(prefers-reduced-motion:reduce){.collecto-kids-stories-tile,.collecto-kids-songs-tile{transition:none!important}}

/* Exact centering of the menu glyph within its circular button. */
#collectoMenuToggle{display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;line-height:1!important;text-indent:0!important;font-family:Arial,sans-serif!important;font-size:23px!important}

/* Approved compact two-column navy/gold hamburger menu (classic Collecto). */
.collecto-nav-panel{width:min(590px,calc(100vw - 28px))!important;max-height:min(76dvh,740px)!important;right:0!important;top:54px!important;box-sizing:border-box;padding:16px!important;border:2px solid #c8a965!important;border-radius:22px!important;background:#091c34!important;overflow-y:auto;overscroll-behavior:contain;box-shadow:0 15px 38px #000a!important}
.collecto-nav-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.collecto-nav-panel .collecto-nav-grid>a,.collecto-nav-panel .collecto-nav-soon{box-sizing:border-box;display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 7px!important;border:1.5px solid #c6a86b;border-radius:999px;background:linear-gradient(155deg,#19354b,#0b2138 75%);color:#f0d6a4!important;text-align:center;text-decoration:none;font-size:clamp(12px,2.9vw,15px)!important;line-height:1.3;font-weight:600;box-shadow:inset 0 2px 2px #ffffff19,0 2px 5px #0006}
.collecto-nav-panel .collecto-nav-grid>a:hover,.collecto-nav-panel .collecto-nav-grid>a:focus-visible{background:#24465f!important;outline:2px solid #b8d8eb;outline-offset:1px}
.collecto-nav-panel .collecto-nav-grid>a[hidden]{display:none!important}
.collecto-nav-panel .collecto-nav-soon{flex-direction:column;gap:2px;opacity:.56;cursor:not-allowed}
.collecto-nav-soon small{font-size:10px;color:#b9d2e5}
@media(max-width:700px){.collecto-nav-panel{position:fixed!important;top:145px!important;left:14px!important;right:14px!important;width:auto!important;max-height:calc(100dvh - 165px)!important;padding:13px!important}.collecto-nav-grid{gap:9px}.collecto-nav-panel .collecto-nav-grid>a,.collecto-nav-panel .collecto-nav-soon{min-height:44px}}

/* Album shortcuts: use the EXACT same ring and centre dimensions as every other hero button. */
.hero .actions .btn.collecto-hero-album .collecto-hero-album-dot{display:none!important}
.hero .actions .btn.collecto-hero-album::before{content:""!important;display:inline-block!important;box-sizing:content-box!important;width:24px!important;height:24px!important;min-width:24px!important;min-height:24px!important;flex:0 0 24px!important;border:2px solid #e3c17d!important;border-radius:50%!important;box-shadow:inset 0 0 0 4px #0a1b35!important;margin:0!important;transform:none!important}
.hero .actions .btn.collecto-hero-album[href="/album"]::before{background:#925d40!important}
.hero .actions .btn.collecto-hero-album[href="/kids-album.html"]::before{background:#80d9f5!important}