/* FinnBets Social - October 22 2026 mobile-first redesign.
   Presentation only. Existing auth, database, privacy, payment and post logic unchanged. */
:root{
  --bg:#070f1e;--panel:#0f1f35;--panel2:#132940;--line:#1b3458;
  --text:#f6fbff;--muted:#9bb1ca;--green:#00ffa0;--blue:#19cda9;
  --fb110-accent:#00ffa0;
}
html{color-scheme:dark;scroll-padding-top:95px}
body{background:radial-gradient(100% 55% at 100% 0,rgba(26,69,104,.22),transparent 72%),#070f1e!important;color:#f6fbff}
body,button,input,textarea,select{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.top,.top.fb-73-header{background:rgba(7,15,30,.96)!important;border-bottom:1px solid #203756!important;backdrop-filter:blur(18px)}
.bar,.fb-73-bar{min-height:70px}
.brand{letter-spacing:-.065em}
.mark,.fb-73-mark,.brand .mark{background:linear-gradient(135deg,#00ffa0,#00b38a)!important;color:#07121b!important;border-radius:13px!important;box-shadow:none!important}
.brand-social,.fb-social-wordmark{color:#a9c3da!important}
.brand em,.brand span span,.fb-wordmark-tm,.brand-tm{color:#00ffa0!important}
.wrap{max-width:1140px}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #00ffa0;outline-offset:3px}
.card,.card-ios,.pick-card,.social-feed-card,.fb-preview-card,.fb98-public-posts>*,.fb-messenger{
 background:#0f1f35!important;border:1px solid #1b3458!important;border-radius:17px!important;box-shadow:none!important}
.btn,.btn-primary,.btn.secondary,.social-feed-filter,.fbce-action,.top .actions .btn{
 border-radius:999px!important}
.btn:not(.secondary),.btn-primary,.btn-gradient,.social-type.selected,#postBtn{
 background:linear-gradient(180deg,#00ffa0,#00e894)!important;color:#07131d!important;border-color:transparent!important;font-weight:800}
.btn.secondary,.btn-ghost,.iconbtn{background:#10253b!important;color:#e0edfa!important;border:1px solid #254261!important}
.input,input:not([type=checkbox]):not([type=radio]),textarea,select{
 border-radius:13px;background:#0a192e;color:#f5faff;border-color:#29415f}
.muted,.small,.text-muted{color:#9bb1ca}
.pill,.tag,.badge{border-radius:99px!important}
.hero{padding-top:34px}
.hero h1,#overview h1,.fb26-page-intro h1{letter-spacing:-.05em;line-height:1.06}
.hero h1 span,.hero h1 em{color:#00ffa0}
.hero-intro{color:#abc2d8}
.hero-showcase,.fb-platform-story,.fb-guest-preview,.fb-community-feed-slot,.social-compose.card{
 background:linear-gradient(145deg,#10253c,#0a172b)!important;
 border:1px solid #223e60!important;border-radius:23px!important;
}
.hero-showcase .showcase-item,.fb-preview-card,.pick-card{background:#12273e!important}
.statbar .stat,.fb-statbar>div{border-radius:15px!important;background:#11283e!important;border:1px solid #26445d!important}
.stat strong,.fb-statbar strong{color:#00ffa0!important}
.fb-platform-kicker,.fb26-eyebrow,.fb22-kicker{color:#00ffa0!important}
.fb-platform-chips span,.fb26-intro-chips span{background:#0c3340!important;color:#91ffe0!important;border:1px solid #225e63!important;border-radius:99px!important}
.fb-platform-story{padding:clamp(22px,4vw,39px)!important}
.fb-platform-story h2{font-size:clamp(26px,4.4vw,43px)!important;line-height:1.08!important;letter-spacing:-.047em}
#community .fb22-title h2{font-size:clamp(27px,4vw,37px);letter-spacing:-.055em}
#community .fb22-intro{padding:15px 3px 21px}
#community .social-feed-card,#community #feed>.fb-social-post{
 background:#0f1f35!important;border:1px solid #203c5a!important;border-radius:17px!important;box-shadow:none!important}
#community #feed>.fb-social-post{padding:clamp(13px,2.5vw,20px)!important}
#community .social-feed-filters .selected,#community #fbceFeedTabs button[aria-pressed=true]{
 color:#00ffa0!important;border-color:#00ffa0!important}
#community .fb22-activity{background:#0d2b32;border:1px solid #215b55;color:#bafce5}
#community .fb22-pulse,#community .fb26-live-dot{background:#00ffa0}
#postPage #postText{background:#0a192e!important;border-color:#2b4c65!important;border-radius:15px!important}
#postPage .fb-new-compose-heading{background:transparent!important}
#messages .fb-messenger{background:#0f1f35!important;border:1px solid #274462!important;border-radius:19px!important;overflow:hidden}
#messages .fb-dm-sidebar{background:#0d1d31!important}
#messages .fb-dm-main{background:#0b1a2c!important}
#profile .card,#profile .fb-own-cover,#profile .fb-profile-header-971{border-radius:17px}
#profile .fb-own-cover{background-color:#15354c}
#fbLiveChat{background:#0f1f35!important;border:1px solid #274563!important;border-radius:20px!important;box-shadow:none!important}
#fbLiveChat .fblc-channels{background:#0b1b2d!important}
#fbLiveChat .fblc-channel[aria-pressed=true]{background:#123c35!important;color:#00ffa0!important}
#fbLiveChat .fblc-avatar{border-radius:50%}
#fbLiveChat .fblc-messages{background:#0a192b}
#fbLiveChat .fblc-send,.fb-73-nav button.active{color:#00ffa0}
.fb-73-nav{gap:7px!important}
.fb-73-nav button{background:transparent!important;color:#9ab4cd!important;border-radius:12px!important}
.fb-73-nav button.active{background:rgba(0,255,160,.1)!important;color:#00ffa0!important;border-color:rgba(0,255,160,.2)!important}
.fb-73-nav button svg{width:23px;height:23px}
.fb-iphone-bottom{display:none}
.footer,.foot{color:#8ea3bd;border-color:#213b56}
@media (min-width:761px){
 .top.fb-73-header .fb-73-nav{max-width:750px;margin:auto!important;padding-bottom:10px!important}
 .top.fb-73-header .fb-73-nav button{min-height:61px!important;gap:4px!important}
 #community .fb-community-feed-slot{max-width:940px;margin:auto}
}
@media (max-width:760px){
 body{overflow-x:hidden}
 .wrap{padding-left:15px!important;padding-right:15px!important}
 .top,.top.fb-73-header{position:sticky!important;top:0!important;z-index:60!important}
 .bar,.fb-73-bar{min-height:60px!important}
 .brand{font-size:20px!important}
 .brand .mark,.fb-73-mark{width:37px!important;height:37px!important}
 .fb-social-wordmark,.brand-social{font-size:13px!important}
 .fb-73-actions{gap:4px!important}
 .top.fb-73-header nav.fb-73-nav{display:none!important}
 .fb-iphone-bottom{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:start;
  position:fixed;bottom:0;left:0;right:0;z-index:9990;
  background:rgba(15,31,53,.98);border-top:1px solid #294562;
  box-shadow:0 -8px 30px rgba(0,0,0,.24);
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  padding:8px max(8px,env(safe-area-inset-right)) calc(9px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));
  min-height:calc(67px + env(safe-area-inset-bottom))
 }
 .fb-iphone-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:transparent;border:0;border-radius:11px;color:#92abc4;min-width:0;padding:5px 1px;font-size:10px;font-weight:650;line-height:1.2;cursor:pointer}
 .fb-iphone-tab svg{height:23px;width:23px;stroke:currentColor}
 .fb-iphone-tab.active{color:#00ffa0;background:rgba(0,255,160,.09)}
 .fb-iphone-tab[data-fb-iphone-go="postPage"] svg{stroke-width:2.3}
 .fb-iphone-tab span{white-space:nowrap}
 body:has(.fb-iphone-bottom) main.wrap{padding-bottom:calc(110px + env(safe-area-inset-bottom))!important}
 .foot{padding-bottom:calc(95px + env(safe-area-inset-bottom))!important}
 #overview.section,#community.section,#profile.section,#messages.section,#postPage.section{padding-top:14px!important}
 .fb26-page-intro{padding:14px 2px 16px!important}
 .fb26-page-intro h1{font-size:30px!important;margin:5px 0 9px!important}
 .fb26-page-intro p{font-size:13px}
 #community .fb22-title h2{font-size:29px}
 #community .social-feed-card{padding:12px!important;border-radius:16px!important}
 #community #feed>.fb-social-post{padding:14px!important}
 #community #fbceFeedTabs{gap:8px!important}
 #community #fbceFeedTabs button{min-width:0!important;flex:1;padding:10px 4px!important}
 #messages .fb-messenger{min-height:65dvh}
 #fbLiveChat .fblc-header{padding:14px}
 #fbLiveChat .fblc-shell{grid-template-columns:1fr}
 #fbLiveChat .fblc-channels{flex-direction:row;overflow:auto;border-right:0;border-bottom:1px solid #23445d;padding:8px}
 #fbLiveChat .fblc-channels-title{display:none}
 #fbLiveChat .fblc-channel{flex:none;white-space:nowrap}
 .hero{padding:24px 0 10px!important}
 .hero h1{font-size:clamp(34px,9vw,46px)!important}
 .hero-intro{font-size:14px!important}
 .hero-showcase{padding:14px!important}
 .hero-grid{grid-template-columns:1fr!important}
 .feed-grid{grid-template-columns:1fr!important}
 .pick-card{padding:15px!important}
 .top-nav{display:none!important}
 .top .actions{gap:5px}
 .top .actions .btn{padding:9px 11px!important;font-size:12px}
 .sticky-cta{background:rgba(15,31,53,.97)!important;border-color:#25415f!important}
 .sticky-cta .btn{border-radius:99px!important}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
