/* Shared shell geometry stays stable when navigating between social sections. */
#couldbetSocialHub[data-layout][data-section] .cb-sticker-topbar{height:76px;min-height:76px;grid-template-columns:265px minmax(0,1fr) 180px 116px 48px;grid-template-areas:none;gap:10px;padding:5px 85px 5px 14px}
#couldbetSocialHub[data-layout][data-section] .cb-sticker-brand{grid-area:1/1;height:66px;min-width:0}
#couldbetSocialHub[data-layout][data-section] .cb-sticker-brand-logo{width:245px;max-width:100%!important}
#couldbetSocialHub[data-layout][data-section] :is(.cb-sticker-topnav,.cb-casino-search){grid-area:1/2;height:62px;min-height:0;margin:0}
#couldbetSocialHub[data-layout][data-section] .cb-casino-search input{font-size:18px}
#couldbetSocialHub[data-layout][data-section] .cb-sticker-wallet{grid-area:1/3;display:block;width:180px;height:58px;min-height:58px}
#couldbetSocialHub[data-layout][data-section] .cb-sticker-deposit{grid-area:1/4;width:116px;height:54px;min-width:0}
#couldbetSocialHub[data-layout][data-section] .cb-sticker-profile{grid-area:1/5;display:block}
#couldbetSocialHub[data-layout][data-section] .cb-sticker-shell{display:grid;max-width:1600px;grid-template-columns:215px minmax(0,1fr);gap:14px;padding:10px 18px}
/* Game screens use the same full viewport width as the header, without scaling
   the sidebar, controls, or artwork inside the game client. */
#couldbetSocialHub[data-layout][data-section][data-game-page=true] .cb-sticker-shell{width:100%;max-width:none;box-sizing:border-box;margin-inline:0}
#couldbetSocialHub[data-layout][data-section][data-game-page=true] .cb-sticker-center{width:100%;min-width:0}
#couldbetSocialHub[data-layout][data-section] .cb-sticker-shell:has(>.cb-sticker-right-rail){grid-template-columns:215px minmax(0,1fr) 330px}
#couldbetSocialHub[data-layout][data-section] .cb-sticker-sidebar{width:auto;min-width:0;padding-top:0}
@media(max-width:1180px){
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-topbar{grid-template-columns:235px minmax(0,1fr) 175px 105px 46px;gap:8px;padding-left:10px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-brand-logo{width:242px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-wallet{width:175px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-deposit{width:105px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-shell{grid-template-columns:190px minmax(0,1fr);gap:9px;padding-inline:10px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-shell:has(>.cb-sticker-right-rail){grid-template-columns:190px minmax(0,1fr) 290px}
}
@media(max-width:1080px){
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-topbar{grid-template-columns:215px minmax(0,1fr) 110px 46px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-wallet{display:none}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-deposit{grid-area:1/3;width:110px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-profile{grid-area:1/4}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-shell:has(>.cb-sticker-right-rail){grid-template-columns:190px minmax(0,1fr)}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-right-rail{display:none}
}
@media(max-width:900px){
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-topbar{height:auto;min-height:0;grid-template-columns:minmax(0,1fr) 110px 48px;gap:8px;padding:5px 14px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-brand-logo{width:180px}
 #couldbetSocialHub[data-layout][data-section] :is(.cb-sticker-topnav,.cb-casino-search){grid-area:2/1/3/-1;height:56px}
 #couldbetSocialHub[data-layout][data-section] .cb-casino-search{padding-right:18px!important}
 #couldbetSocialHub[data-layout][data-section] .cb-casino-search input{font-size:14px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-deposit{grid-area:1/2}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-profile{grid-area:1/3;visibility:hidden}
 #couldbetSocialHub[data-layout][data-section] .cb-topbar-account-controls{top:10px;bottom:auto;right:6px;transform:none}
 #couldbetSocialHub[data-layout][data-section] .cb-account-trigger>svg{display:none}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-shell{display:block;padding:8px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-sidebar{display:none}
}
@media(max-width:560px){
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-topbar{grid-template-columns:minmax(0,1fr) 90px 40px;gap:5px;padding:5px 7px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-brand{height:51px}
 #couldbetSocialHub[data-layout][data-section] :is(.cb-sticker-topnav,.cb-casino-search){height:51px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-deposit{width:90px;height:40px}
}

/* Friends uses the same readable control scale as the other social pages. */
#couldbetSocialHub[data-layout=friends] .cb-friends-page .cb-people-heading h1{font-size:36px}
#couldbetSocialHub[data-layout=friends] .cb-friends-rays{width:35px;height:44px}
#couldbetSocialHub[data-layout=friends] .cb-people-heading form{height:44px;padding:8px 12px}
#couldbetSocialHub[data-layout=friends] .cb-people-heading input{font-size:16px}
#couldbetSocialHub[data-layout=friends] .cb-people-heading>button{height:44px;font-size:17px}
#couldbetSocialHub[data-layout=friends] .cb-friends-tabs>button{min-height:52px;height:auto;font-size:16px}
#couldbetSocialHub[data-layout=friends] .cb-friends-tabs svg{width:26px;height:26px}
#couldbetSocialHub[data-layout=friends] .cb-friend-person .cb-social-avatar{width:52px;height:52px;flex-basis:52px}
#couldbetSocialHub[data-layout=friends] .cb-friend-person strong{font-size:17px}
#couldbetSocialHub[data-layout=friends] .cb-friend-person small{font-size:14px}
#couldbetSocialHub[data-layout=friends] .cb-friend-mini .cb-social-avatar{width:52px;height:52px;flex-basis:52px}
#couldbetSocialHub[data-layout=friends] .cb-friend-mini strong{font-size:17px}
#couldbetSocialHub[data-layout=friends] .cb-friend-mini small{font-size:14px}
@media(min-width:1151px){#couldbetSocialHub[data-layout=friends] .cb-people-heading{grid-template-columns:minmax(180px,1fr) 140px minmax(200px,1.35fr)}}

/* Readable text entry also prevents iOS focus zoom, including teleported dialogs. */
@media(max-width:900px){
#couldbetSocialHub[data-layout][data-section] :is(input:not([type="checkbox"]):not([type="radio"]),textarea,select),
body[data-couldbet-frontend="social"] :is(.cb-social-post-dialog,.cb-social-dialog-card) :is(input:not([type="checkbox"]):not([type="radio"]),textarea,select){font-size:16px!important}
body[data-couldbet-frontend="social"] .cb-social-field{font-size:14px}
}

/* Deposit, notifications and account remain separate touch targets on mobile. */
@media(max-width:900px){
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-topbar{grid-template-columns:minmax(0,1fr) 110px 44px 44px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-alert-button{grid-area:1/3;display:flex;visibility:visible;position:relative;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;padding:7px;border:0;background:transparent;color:var(--cb-ink);align-self:center}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-alert-button>svg{width:28px;height:28px}
 #couldbetSocialHub[data-layout][data-section] .cb-topbar-account-controls{grid-area:1/4;position:relative;inset:auto;transform:none;align-self:center;justify-self:end}
 #couldbetSocialHub[data-layout][data-section] .cb-casino-search{width:100%}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-alert-dot{display:block;position:absolute;top:4px;right:5px;width:8px;height:8px;border:2px solid var(--cb-paper);border-radius:50%;background:#ff315b}
}
@media(max-width:560px){
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-topbar{grid-template-columns:minmax(0,1fr) 82px 44px 44px;gap:3px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-deposit{width:82px}
}

/* Keep the entire desktop shell at the same scale across social and game pages.
   Shorter displays use denser chrome; the document remains the scroll surface. */
@media(min-width:901px) and (max-height:900px){
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-topbar{height:68px;min-height:68px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-brand{height:58px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-brand-logo{width:210px}
 #couldbetSocialHub[data-layout][data-section] :is(.cb-sticker-topnav,.cb-casino-search){height:54px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-wallet{height:50px;min-height:50px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-deposit{height:48px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-shell{grid-template-columns:190px minmax(0,1fr)}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-shell:has(>.cb-sticker-right-rail){grid-template-columns:190px minmax(0,1fr) 290px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-side-link{height:36px;font-size:17px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-create{height:56px}
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-sidebar-note{max-width:100%}
}
@media(min-width:901px) and (max-width:1080px) and (max-height:900px){
 #couldbetSocialHub[data-layout][data-section] .cb-sticker-shell:has(>.cb-sticker-right-rail){grid-template-columns:190px minmax(0,1fr)}
}
@media(min-width:901px){
 #couldbetSocialHub[data-game-page=true] .cb-game-layout-top:not(:fullscreen) .cb-game-playfield{height:clamp(340px,calc(100svh - 340px),480px)}
 #couldbetSocialHub[data-game-page=true] .cb-game-layout-top:not(:fullscreen) .cb-game-primary-spin{min-height:48px;font-size:21px;margin-block:10px}
 #couldbetSocialHub[data-game-page=true] .cb-game-layout-top:not(:fullscreen) .cb-game-info-picture{height:140px}
 #couldbetSocialHub[data-game-page=true] .cb-game-layout-top:not(:fullscreen) .cb-game-side-panel{padding-top:22px}
 #couldbetSocialHub[data-game-page=true] .cb-game-layout-top:not(:fullscreen) .cb-game-collection{margin-block:6px 10px}
 #couldbetSocialHub[data-game-page=true] .cb-game-layout-bottom{margin-top:24px}
}