/* FREETOPLAY 2026 — fresh visual system */
:root{--neo-bg:#080b13;--neo-panel:#111827;--neo-panel2:#151f30;--neo-line:rgba(148,163,184,.17);--neo-text:#f3f7ff;--neo-muted:#9aa8bf;--neo-lime:#c7ff55;--neo-cyan:#55e6ff;--neo-violet:#9a8cff;--neo-shadow:0 24px 80px rgba(0,0,0,.32);--neo-radius:24px}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{background:var(--neo-bg)!important;color:var(--neo-text)!important;background-image:radial-gradient(ellipse at 8% 0%,rgba(85,230,255,.10),transparent 31%),radial-gradient(ellipse at 92% 7%,rgba(154,140,255,.12),transparent 29%),linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px)!important;background-size:auto,auto,44px 44px,44px 44px!important;background-attachment:fixed!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif!important}
::selection{background:rgba(199,255,85,.35);color:white}
:where(.navbar,.topbar,.top,.ft3-admin-links,.tabs-shell){background:rgba(10,15,27,.82)!important;border:1px solid var(--neo-line)!important;box-shadow:0 14px 50px rgba(0,0,0,.22)!important;backdrop-filter:blur(24px)!important;-webkit-backdrop-filter:blur(24px)!important}
.navbar{border-radius:22px!important;padding:12px 16px!important}
.logo-icon,.brand-icon{background:linear-gradient(135deg,var(--neo-lime),var(--neo-cyan))!important;color:#0a1020!important;box-shadow:0 0 32px rgba(85,230,255,.2)!important;border-radius:15px!important}
.logo-text strong,.brand-text strong,.brand span{color:var(--neo-lime)!important}
.nav-links a,.mobile-menu a{border-radius:12px!important}
.nav-links a:hover{color:var(--neo-lime)!important;background:rgba(199,255,85,.09)!important}
.nav-discord,.admin-panel-btn,.nav-club{background:linear-gradient(135deg,var(--neo-lime),#8fe7a0)!important;color:#101629!important;border:0!important}
.online-pill,.badge,.role-badge,.ft3-version,.user-pill{border:1px solid rgba(199,255,85,.26)!important;background:rgba(199,255,85,.07)!important;color:var(--neo-lime)!important;border-radius:999px!important}
.hero{isolation:isolate}
.hero::before{background:radial-gradient(ellipse at 50% 30%,rgba(85,230,255,.16),transparent 38%),linear-gradient(180deg,rgba(8,11,19,.35),rgba(8,11,19,.95))!important;backdrop-filter:none!important}
.hero-content h1,.hero h1{letter-spacing:-.07em!important;font-size:clamp(3.3rem,10vw,8.5rem)!important;line-height:.94!important;text-shadow:0 12px 55px rgba(85,230,255,.12)!important}
.hero-content h1 span,.hero h1 span{color:var(--neo-lime)!important}
.hero-content p,.section-desc{color:#bdc8da!important;max-width:760px;margin-inline:auto}
.buttons .btn,.btn,.tab-btn,button.btn,input[type=submit]{border:1px solid var(--neo-line)!important;border-radius:14px!important;background:rgba(255,255,255,.055)!important;color:var(--neo-text)!important;box-shadow:inset 0 1px rgba(255,255,255,.05)!important;transition:transform .2s,border-color .2s,background .2s,box-shadow .2s!important}
.buttons .btn:first-child,.btn.primary,.primary,.nav-discord,input[type=submit],button.primary{background:linear-gradient(135deg,var(--neo-lime),#8ee8d1)!important;color:#0a1020!important;border:0!important;box-shadow:0 8px 28px rgba(199,255,85,.13)!important}
.btn:hover,button:hover,.tab-btn:hover{transform:translateY(-2px)!important;border-color:rgba(85,230,255,.42)!important;box-shadow:0 12px 30px rgba(0,0,0,.2)!important}
.section,.club-update{position:relative}
.section-title{font-size:clamp(2rem,4.5vw,3.8rem)!important;letter-spacing:-.06em!important}
:where(.section,.club-update,.panel,.stat,.stat-card,.stat-box,.person,.reward,.hero-panel,.log-panel,.admin-card,.vip-card){border:1px solid var(--neo-line)!important;border-radius:var(--neo-radius)!important;background:linear-gradient(145deg,rgba(20,29,46,.94),rgba(11,16,29,.96))!important;box-shadow:var(--neo-shadow)!important}
:where(.panel,.stat,.stat-card,.stat-box,.person,.reward,.hero-panel,.admin-card,.vip-card){position:relative;overflow:hidden}
:where(.panel,.stat,.stat-card,.stat-box,.person,.reward,.hero-panel,.admin-card,.vip-card)::before{content:"";position:absolute;left:22px;right:22px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(85,230,255,.55),rgba(199,255,85,.55),transparent);opacity:.8;pointer-events:none}
:where(.panel,.stat,.stat-card,.stat-box,.person,.reward,.admin-card,.vip-card){transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease!important}
:where(.panel,.stat-card,.person,.reward,.admin-card,.vip-card):hover{border-color:rgba(85,230,255,.28)!important;transform:translateY(-3px)}
:where(.stat-number,.stat strong,.stat-card .stat-number){color:var(--neo-lime)!important;font-size:clamp(1.8rem,3vw,2.7rem)!important;letter-spacing:-.06em!important}
:where(.panel-title span,.eyebrow,.kicker,.section-title span){color:var(--neo-cyan)!important}
:where(.muted,.panel-desc,.stat-label,.section-desc,.foot){color:var(--neo-muted)!important}
:where(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){background:rgba(5,9,18,.72)!important;border:1px solid var(--neo-line)!important;border-radius:13px!important;color:var(--neo-text)!important}
:where(input,select,textarea):focus{border-color:var(--neo-cyan)!important;box-shadow:0 0 0 4px rgba(85,230,255,.09)!important;outline:0!important}
:where(table){border:1px solid var(--neo-line)!important;border-radius:16px!important;overflow:hidden;border-spacing:0!important}
th{background:rgba(85,230,255,.07)!important;color:#bdc8da!important}
td,th{border-bottom:1px solid var(--neo-line)!important}
tbody tr:hover{background:rgba(85,230,255,.04)!important}
:where(.success,.notice){background:rgba(199,255,85,.08)!important;border-color:rgba(199,255,85,.22)!important;color:#e7ffd0!important}
:where(.error,.error-message){background:rgba(255,100,120,.08)!important;border-color:rgba(255,100,120,.22)!important}
.ft3-admin-links{position:sticky!important;top:12px;z-index:80;border-radius:18px!important;padding:12px!important;gap:8px!important}
.ft3-admin-links a{border:1px solid var(--neo-line)!important;background:rgba(255,255,255,.035)!important;border-radius:12px!important;color:#dce6f6!important}
.ft3-admin-links a:hover,.ft3-admin-links a[aria-current=page]{background:rgba(199,255,85,.1)!important;color:var(--neo-lime)!important;border-color:rgba(199,255,85,.3)!important}
.tabs-shell{border-radius:18px!important;padding:10px!important}
.tabs-shell :where(a,button){border-radius:12px!important;color:#bfcbe0!important}
.tabs-shell :where(.active,[aria-selected=true]){background:rgba(85,230,255,.09)!important;border-color:rgba(85,230,255,.25)!important;color:var(--neo-cyan)!important}
.topbar{padding:14px clamp(16px,3vw,36px)!important;border-radius:0 0 20px 20px!important}
.hero-panel{background:radial-gradient(ellipse at 90% 0,rgba(85,230,255,.12),transparent 35%),linear-gradient(135deg,rgba(21,32,51,.98),rgba(10,15,27,.98))!important}
.hero-panel::after{border-color:rgba(85,230,255,.18)!important;box-shadow:0 0 0 28px rgba(85,230,255,.025),0 0 0 58px rgba(154,140,255,.025)!important}
.wrap{max-width:1480px!important}
:where(.stats-grid,.stats-grid,.grid,.layout,.content-grid,.cards,.rewardgrid){gap:16px!important}
.stat-card,.stat,.stat-box{border-radius:20px!important;padding:22px!important}
.panel{padding:clamp(18px,2vw,28px)!important;margin-bottom:16px}
.panel-header{border-bottom:1px solid var(--neo-line)!important}
:where(.person,.reward){border-radius:18px!important;padding:18px!important;background:linear-gradient(145deg,rgba(22,33,51,.98),rgba(13,19,32,.98))!important}
:where(.rank){background:rgba(85,230,255,.1)!important;color:var(--neo-cyan)!important;border:1px solid rgba(85,230,255,.2)!important}
:where(.levelbar){background:rgba(255,255,255,.08)!important;height:12px!important}
.levelbar span{background:linear-gradient(90deg,var(--neo-cyan),var(--neo-lime))!important}
/* micro-interactions and accessibility controls */
#ft26-progress{position:fixed;left:0;top:0;height:3px;width:0;background:linear-gradient(90deg,var(--neo-cyan),var(--neo-lime));z-index:99999;box-shadow:0 0 16px rgba(85,230,255,.45);pointer-events:none}
#ft26-launcher{position:fixed;right:22px;bottom:22px;z-index:9998;display:flex;align-items:center;gap:9px;border:1px solid rgba(85,230,255,.3);border-radius:16px;padding:12px 15px;background:rgba(14,22,38,.92);color:#f4f7ff;box-shadow:0 16px 50px #0006;backdrop-filter:blur(20px);font:700 13px Inter,system-ui;cursor:pointer}
#ft26-launcher kbd{padding:3px 6px;border:1px solid #44516a;border-radius:6px;color:var(--neo-cyan);font:700 11px ui-monospace,monospace}
#ft26-overlay{position:fixed;inset:0;z-index:100000;display:none;align-items:flex-start;justify-content:center;padding:13vh 18px 24px;background:rgba(3,6,14,.72);backdrop-filter:blur(12px)}
#ft26-overlay.open{display:flex}
.ft26-dialog{width:min(660px,100%);max-height:74vh;overflow:hidden;border:1px solid rgba(85,230,255,.28);border-radius:24px;background:#0d1423;box-shadow:0 30px 100px #0009}
.ft26-search-head{padding:18px;border-bottom:1px solid var(--neo-line)}
#ft26-search{width:100%;font-size:17px!important;padding:16px 18px!important}
.ft26-hint{display:flex;justify-content:space-between;gap:10px;color:var(--neo-muted);font-size:11px;margin:10px 3px 0}
#ft26-results{padding:8px;overflow:auto;max-height:52vh}
.ft26-result{display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:13px;text-decoration:none;color:#e8eefb!important;border:1px solid transparent!important}
.ft26-result:hover,.ft26-result:focus{background:rgba(85,230,255,.08)!important;border-color:rgba(85,230,255,.17)!important;outline:none}
.ft26-result-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:rgba(199,255,85,.09);color:var(--neo-lime);flex:none}
.ft26-result small{display:block;color:var(--neo-muted);font-size:11px;margin-top:3px}
.ft26-empty{padding:24px;text-align:center;color:var(--neo-muted)}
#ft26-top{position:fixed;right:25px;bottom:82px;z-index:9997;width:42px;height:42px;border:1px solid var(--neo-line);border-radius:14px;background:rgba(14,22,38,.92);color:var(--neo-cyan);font-size:18px;cursor:pointer;opacity:0;pointer-events:none;transform:translateY(8px);transition:.2s}
#ft26-top.visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.ft26-page-label{display:inline-flex;align-items:center;gap:7px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--neo-cyan);font-weight:900;margin-bottom:10px}
.ft26-page-label:before{content:"";width:18px;height:2px;background:var(--neo-lime);box-shadow:0 0 12px rgba(199,255,85,.5)}
@media(max-width:760px){#ft26-launcher{right:12px;bottom:12px;padding:11px 12px}#ft26-launcher span{display:none}#ft26-top{right:14px;bottom:68px}.ft3-admin-links{top:5px!important}.hero-content h1,.hero h1{font-size:clamp(3rem,16vw,5.5rem)!important}:where(.panel,.stat,.stat-card,.stat-box){border-radius:18px!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* FREETOPLAY 2026.1 — responsive navigation, new home hub and mobile fixes */
:root{--ft26-max:1440px}
body{min-width:320px;overflow-x:clip}
img,video,iframe{max-width:100%}
.navbar{width:min(calc(100% - 36px),var(--ft26-max))!important;min-height:72px;gap:14px!important;padding:10px 16px!important;top:14px!important;border-radius:22px!important}
.logo-box{flex:0 0 auto;min-width:0}
.logo-text strong{font-size:clamp(16px,1.35vw,21px)!important;letter-spacing:.04em!important}
.logo-text span{display:block;max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-links{display:flex;flex:1 1 auto;align-items:center;justify-content:flex-end;gap:3px!important;flex-wrap:nowrap!important;min-width:0}
.nav-links a{font-size:clamp(10px,.78vw,12px)!important;padding:9px 10px!important;white-space:nowrap}
.nav-links .online-pill{font-size:11px;padding:8px 10px;white-space:nowrap}
.mobile-menu-btn{display:none;flex:0 0 44px;width:44px;height:44px;align-items:center;justify-content:center;border:1px solid rgba(85,230,255,.26)!important;border-radius:14px!important;background:rgba(85,230,255,.08)!important;color:var(--neo-cyan)!important;font-size:23px!important;cursor:pointer;touch-action:manipulation}
.mobile-menu-overlay{z-index:1998!important}
.mobile-menu{z-index:1999!important;overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(24px,env(safe-area-inset-bottom))!important}
.mobile-menu a{min-height:48px;touch-action:manipulation}
.mobile-menu-close{touch-action:manipulation}
.announcement-bar{margin-top:0}
.ft26-quickstart{max-width:var(--ft26-max);margin-inline:auto;padding-top:clamp(48px,7vw,96px)!important;padding-bottom:clamp(42px,6vw,84px)!important}
.ft26-section-head{text-align:center;margin:0 auto 30px;max-width:850px}
.ft26-eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--neo-cyan);font-size:11px;letter-spacing:.18em;font-weight:900;margin-bottom:13px}
.ft26-eyebrow:before{content:"";width:22px;height:2px;background:var(--neo-lime);box-shadow:0 0 12px #c7ff5566}
.ft26-section-head .section-title span{color:var(--neo-lime)}
.ft26-hub-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-top:28px}
.ft26-hub-card{min-width:0;position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-height:260px;padding:24px;border-radius:24px;text-decoration:none!important;color:var(--neo-text)!important;border:1px solid rgba(148,163,184,.17)!important;background:linear-gradient(145deg,rgba(20,29,46,.96),rgba(11,16,29,.98))!important;box-shadow:0 20px 65px rgba(0,0,0,.18);overflow:hidden;transition:transform .22s,border-color .22s,box-shadow .22s}
.ft26-hub-card:after{content:"";position:absolute;right:-46px;top:-48px;width:135px;height:135px;border-radius:50%;background:rgba(85,230,255,.07);filter:blur(3px);pointer-events:none}
.ft26-hub-card:hover,.ft26-hub-card:focus-visible{transform:translateY(-5px);border-color:rgba(85,230,255,.4)!important;box-shadow:0 24px 70px rgba(0,0,0,.32),0 0 35px rgba(85,230,255,.05);outline:none}
.ft26-hub-feature{background:radial-gradient(ellipse at 100% 0,rgba(199,255,85,.12),transparent 45%),linear-gradient(145deg,rgba(25,38,49,.98),rgba(11,16,29,.98))!important}
.ft26-hub-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:16px;background:rgba(85,230,255,.09);border:1px solid rgba(85,230,255,.17);font-size:24px}
.ft26-hub-tag{font-size:9px;letter-spacing:.16em;font-weight:900;color:var(--neo-cyan)}
.ft26-hub-card strong{font-size:19px;letter-spacing:-.04em;line-height:1.2}
.ft26-hub-card p{margin:0;color:var(--neo-muted);font-size:13px;line-height:1.7}
.ft26-hub-cta{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;margin-top:auto;padding-top:15px;border-top:1px solid var(--neo-line);font-size:12px;font-weight:800;color:var(--neo-lime)}
.ft26-hub-cta b{font-size:18px}
/* Consistent touch and content behaviour on every PHP panel */
:where(button,a,input[type=submit],input[type=button]){-webkit-tap-highlight-color:transparent}
:where(input,select,textarea){max-width:100%;min-width:0}
:where(table){max-width:100%;border-collapse:separate;border-spacing:0}
:where(.table-wrap,.table-responsive,.permissions-wrap){max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
:where(.wrap,.container,.content,.main,.panel,.section,.layout,.grid,.cards){min-width:0}
:where(.row,.userrow,.eventrow,.ledgerrow,.rewardrow,.permissions){overflow-wrap:anywhere}
:where(.userrow,.eventrow,.ledgerrow,.rewardrow,.permissions){max-width:100%}
:where(.panel, .stat, .stat-card, .stat-box){overflow-wrap:anywhere}
#ft26-launcher{bottom:max(16px,env(safe-area-inset-bottom))!important}
#ft26-top{bottom:78px!important}
@media(max-width:1180px){
 .navbar{width:calc(100% - 28px)!important}
 .nav-links .online-pill{display:none!important}
 .nav-links a{padding:8px 8px!important}
 .ft26-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
 .navbar{top:max(10px,env(safe-area-inset-top))!important;width:calc(100% - 20px)!important;min-height:64px;padding:9px 11px!important;border-radius:18px!important;gap:10px!important}
 .nav-links{display:none!important}
 .mobile-menu-btn{display:flex!important;margin-left:auto}
 .logo-icon{width:40px!important;height:40px!important;flex:0 0 40px}
 .logo-text strong{font-size:17px!important}
 .logo-text span{font-size:10px!important;max-width:165px}
 .announcement-bar{margin-top:0}
 .hero-content{width:calc(100% - 28px)!important;padding-top:135px!important;padding-bottom:75px!important}
 .hero-content h1,.hero h1{font-size:clamp(2.7rem,13vw,5.4rem)!important;overflow-wrap:anywhere}
 .hero-logos{gap:10px!important;flex-wrap:wrap;justify-content:center}
 .hero-logo{max-width:min(27vw,120px);height:auto}
 .hero-middle{max-width:100%}
 .ft26-quickstart{padding-inline:18px!important}
 .section{padding-inline:18px!important}
}
@media(max-width:600px){
 body{font-size:14px!important}
 .navbar{width:calc(100% - 16px)!important;min-height:60px;padding:8px 10px!important;gap:8px!important}
 .logo-box{gap:8px!important}
 .logo-icon{width:36px!important;height:36px!important;flex-basis:36px;font-size:18px!important;border-radius:12px!important}
 .logo-text strong{font-size:15px!important;letter-spacing:.02em!important}
 .logo-text span{max-width:145px;font-size:9px!important}
 .mobile-menu-btn{width:40px;height:40px;flex-basis:40px;font-size:21px!important}
 .mobile-menu{width:min(360px,92vw)!important;padding:78px 16px 22px!important}
 .mobile-menu-title{font-size:19px!important}
 .announcement-bar{font-size:10px!important}
 .hero{min-height:88svh!important;min-height:88vh!important;background-position:center!important}
 .hero-content{padding-top:130px!important;padding-bottom:56px!important}
 .hero-content h1,.hero h1{font-size:clamp(2.5rem,15vw,4.6rem)!important;line-height:.98!important;letter-spacing:-.065em!important}
 .hero-content p,.hero p{font-size:14px!important;line-height:1.7!important;padding-inline:3px}
 .buttons{display:grid!important;grid-template-columns:1fr!important;width:100%;gap:10px!important}
 .buttons .btn,.buttons a{width:100%;min-height:48px;display:flex;justify-content:center;align-items:center}
 .visitor-counter{font-size:12px!important}
 .ft26-quickstart{padding:44px 14px!important}
 .ft26-section-head{margin-bottom:20px}
 .ft26-section-head .section-title{font-size:clamp(1.75rem,8vw,2.4rem)!important;line-height:1.08!important}
 .ft26-hub-grid{grid-template-columns:1fr!important;gap:12px!important;margin-top:22px}
 .ft26-hub-card{min-height:0;padding:20px!important;border-radius:20px!important}
 .ft26-hub-card p{font-size:13px}
 .section{padding:42px 14px!important}
 .section-title{font-size:clamp(1.7rem,8vw,2.4rem)!important;line-height:1.1!important}
 :where(.panel,.stat,.stat-card,.stat-box,.person,.reward,.admin-card,.vip-card){padding:16px!important;border-radius:17px!important}
 :where(.stats-grid,.grid,.layout,.content-grid,.cards,.rewardgrid){grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
 .wrap,.container{padding:12px!important}
 .top{align-items:stretch!important;flex-wrap:wrap}
 .top > *{max-width:100%}
 .formgrid,.rewardrow{grid-template-columns:minmax(0,1fr)!important}
 .permissions{grid-template-columns:minmax(0,1fr)!important;gap:6px!important}
 .userrow,.eventrow,.ledgerrow{grid-template-columns:minmax(0,1fr)!important;gap:5px!important}
 input,select,textarea{font-size:16px!important;min-height:44px}
 button,.btn,a.btn,input[type=submit]{min-height:42px}
 .tabs-shell{overflow-x:auto;display:flex;gap:8px;max-width:100%;white-space:nowrap;-webkit-overflow-scrolling:touch}
 .tabs-shell :where(a,button){flex:0 0 auto}
 #ft26-launcher{right:10px!important;bottom:max(10px,env(safe-area-inset-bottom))!important;width:46px;height:46px;justify-content:center;padding:0!important;border-radius:15px!important}
 #ft26-launcher kbd{display:none}
 #ft26-top{right:12px!important;bottom:66px!important;width:40px;height:40px}
 #ft26-overlay{padding:8vh 10px 15px!important}
 .ft26-dialog{border-radius:18px!important;max-height:82vh}
 .ft26-search-head{padding:12px!important}
 #ft26-search{font-size:16px!important;padding:13px!important}
 .ft26-hint{font-size:10px;flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){.ft26-hub-card{transition:none!important}}