/* FanHentai — September 2026. Loaded after the original stylesheet. */
:root{color-scheme:dark;--bg:#111113;--bg2:#151518;--bg3:#19191e;--surf:#1c1c22;--surf2:#25252d;--bdr:rgba(255,255,255,.09);--bdr2:rgba(255,255,255,.19);--acc:#ff4c9b;--acc2:#ff9ac9;--txt:#f5f4f7;--txt2:#b9b7c4;--txt3:#9895a6;--nav-h:72px;--r:10px;--r-lg:16px;--r-xl:24px}
body{font-family:'Space Grotesk',system-ui,sans-serif}
.nav{padding:0 clamp(16px,3vw,48px);background:#111113;backdrop-filter:none;border-bottom:1px solid var(--bdr)}
.nav-logo{border:0;padding:0;background:transparent;line-height:0;border-radius:8px}
.fh-brand{display:block;width:150px;height:44px;object-fit:contain}
.modal-logo .fh-brand{margin:auto}
.nav-links{padding:5px;border:1px solid var(--bdr);background:#1c1c22;border-radius:14px;gap:4px}
.nav-links a{display:block;padding:9px 21px;font-size:13px;border-radius:9px}
.nav-links a.active{background:#35323b;color:#fff}
.nav-right{gap:12px}.nav-user,.nav-mana,.lang-drop-btn{border-radius:10px}
:where(button,a,select,textarea,input,[role="button"]):focus-visible{outline:2px solid var(--acc2);outline-offset:4px}
.main{padding-top:var(--nav-h)}
#page-community{max-width:1480px;margin:auto;padding:32px clamp(16px,3vw,40px) 48px}
.x-hero{padding:clamp(24px,3vw,44px);border-radius:28px;margin-bottom:28px;background:radial-gradient(ellipse at 94% 0%,rgba(255,76,155,.10),transparent 55%),#1b1a20;border-color:rgba(255,255,255,.10)}
.x-hero-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center}
.x-hero-copy{min-width:0;gap:20px}.x-hero-badge{font-size:11px;padding:7px 12px;background:rgba(255,76,155,.08);border-color:rgba(255,76,155,.22);color:#ffafd4}
.x-hero-title{font-size:clamp(30px,3.3vw,48px);font-weight:700;line-height:1.09;letter-spacing:-1.8px;max-width:640px}
.x-hero-title span:last-child{color:var(--acc2)}
.x-hero-sub{font-size:14px;line-height:1.75;max-width:460px;color:var(--txt2)}
.x-hero-cta{gap:10px;margin-top:2px}.x-btn-primary,.x-btn-ghost{font-size:13px;font-weight:700;min-height:48px;padding:13px 18px;border-radius:12px;box-shadow:none}
.x-btn-primary{background:var(--acc);color:#200a16}.x-btn-primary:hover{background:#ff70af;filter:none}
.x-btn-ghost{background:#29262e;border-color:var(--bdr2);color:#f5e9ef}.x-btn-ghost:hover{background:#353039}
.x-hero-stats{gap:28px;margin-top:4px;padding-top:18px;border-top:1px solid var(--bdr);width:100%}
.x-hero-stat{gap:6px}.x-hero-stat strong{font-size:23px;letter-spacing:-.7px}.x-hero-stat span{font-size:9px;letter-spacing:.1em;color:var(--txt2)}
.x-hero-feat{min-width:0;width:100%}.x-hero-feat-head{color:var(--txt2);font-size:10px;letter-spacing:.14em;margin-bottom:16px}
.x-hero-feat-head::after{content:'↗';font-size:18px;color:var(--acc2)}
.x-hero-feat-grid{gap:10px}.x-feat-card{border-radius:16px;aspect-ratio:9/16;box-shadow:0 12px 24px #0003}
.x-feat-rank{border:1px solid #ffffff26;background:#18151ee6;color:white;border-radius:6px;font-size:10px}
.x-feat-meta{padding:28px 10px 12px;gap:5px;font-size:10px;background:linear-gradient(transparent,#111113eb)}
.x-feat-meta em{color:var(--acc2)}
.explore-filters.x-bar{gap:8px;margin:0 0 20px;align-items:center}
.fchip{border-color:var(--bdr);color:var(--txt2);background:#1c1c22;border-radius:10px;min-height:40px;padding:8px 16px}
.fchip.active{background:#f4f1f6;color:#222028;border-color:#f4f1f6}
#commSortSelect{min-height:40px;border-radius:10px!important;padding:0 14px!important;background:#1c1c22!important;color:var(--txt2)!important;border-color:var(--bdr)!important}
.comm-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}.comm-card{border-radius:16px;border-color:var(--bdr);background:#1c1c22}
.comm-card:hover{border-color:#ff4c9b66}.comm-card-media{border-radius:15px;isolation:isolate}
.comm-card-meta{padding:45px 10px 10px;background:linear-gradient(transparent,#111113e8);gap:10px}
.comm-remix-btn{background:#ffffff14;border-color:#ffffff24;color:#fff;backdrop-filter:none;min-height:34px;border-radius:8px}
.comm-remix-btn:hover{background:var(--acc);color:#230d19;border-color:var(--acc)}
#page-create::before{background-image:none!important;background:radial-gradient(ellipse at 50% 0%,#ff4c9b09,transparent 65%);opacity:1}
#page-create .studio-wrap{max-width:1120px;padding:30px 24px 50px;gap:20px}
.studio-mode-tabs{padding:7px;gap:6px;border-radius:16px;background:#1c1c22;border-color:var(--bdr);margin:0}
.smt-tab{min-height:48px;border-radius:10px;padding:10px 12px;color:var(--txt2)}
.smt-tab.active{background:#34303b;color:#fff;box-shadow:inset 0 0 0 1px #ff4c9b45}
.smt-tab:disabled{opacity:.45;cursor:not-allowed}
.studio-wrap.character-mode .studio-grid,.creer-layout{border-radius:24px;padding:24px;gap:24px;background:#1c1c22;border-color:var(--bdr)}
.studio-wrap.character-mode .studio-grid{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.studio-wrap.character-mode .studio-col,.creer-layout>*{min-width:0}
.studio-prompt-ta{background:#151519;border-color:var(--bdr);border-radius:16px;font-size:15px;line-height:1.7;padding:20px;color:var(--txt)}
.studio-prompt-ta::placeholder{color:#a3a0af}.studio-prompt-ta:focus{border-color:var(--acc);box-shadow:0 0 0 3px #ff4c9b10}
.preview-area{background:#151519;border:1px solid var(--bdr);border-radius:16px}
.preview-empty{color:#aaa6b7;padding:20px}.preview-empty .icon{color:var(--acc2)}
.btn-studio-gen{min-height:48px;border-radius:12px;background:var(--acc);color:#230d19}
.studio-chips-row{gap:8px}.creer-char-pick{border-color:#ffffff26;background:#151519;border-radius:16px}
.creer-char-placeholder{color:var(--txt2)}.creer-step-header{margin-bottom:12px}.creer-videos-grid{gap:10px}
.creer-video-card{border-radius:12px;background:#151519}.creer-video-card .creer-vid-name{padding:26px 10px 10px;font-size:11px}
.bottom-nav{background:#17171b;border-color:var(--bdr);backdrop-filter:none}.modal-box{border-color:var(--bdr2)}
@media(min-width:1500px){.x-hero-title{font-size:48px}}
@media(max-width:1100px){.comm-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.x-hero-in{gap:24px}.x-hero-title{font-size:34px}.x-hero-cta{flex-direction:column;width:100%}.x-hero-cta button{width:100%}}
@media(max-width:800px){.x-hero-in{grid-template-columns:1fr}.x-hero-title{font-size:38px;max-width:600px}.x-hero-feat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.x-feat-card{aspect-ratio:3/4}.x-hero-cta{flex-direction:row}.x-hero-cta button{width:auto}.x-hero-stats{margin-top:0}.x-hero-feat{margin-top:4px}}
@media(max-width:600px){:root{--nav-h:62px}.nav{padding:0 12px}.fh-brand{width:128px;height:auto}.nav-right{gap:6px}#page-community{padding:18px 14px 30px}.x-hero{padding:22px 18px;border-radius:20px;margin-bottom:20px}.x-hero-copy{gap:16px}.x-hero-title{font-size:32px;letter-spacing:-1px}.x-hero-sub{font-size:13px}.x-hero-cta{flex-direction:column;width:100%;gap:8px}.x-hero-cta button{width:100%}.x-hero-in{gap:22px}.x-hero-feat-grid{gap:6px}.x-feat-card{min-width:0;border-radius:10px}.x-feat-meta{font-size:8px;padding:20px 5px 7px}.x-feat-rank{font-size:8px;padding:3px 5px;top:5px;left:5px}.x-hero-feat-head{margin-bottom:10px}.comm-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.comm-card{border-radius:12px}.fchip{padding:8px 12px;font-size:11px}.x-sortgroup{flex-basis:100%;margin-top:4px}#commSortSelect{width:100%}.explore-filters.x-bar{gap:6px}#page-create .studio-wrap{padding:18px 12px 30px;gap:14px}.studio-mode-tabs{gap:3px;padding:5px;border-radius:12px}.smt-tab{font-size:11px;min-height:44px;padding:8px 5px;gap:5px}.smt-icon{font-size:13px}.studio-wrap.character-mode .studio-grid{grid-template-columns:1fr;padding:16px;gap:20px}.creer-layout{padding:16px;gap:20px;border-radius:18px}.creer-videos-grid{gap:6px}.studio-prompt-ta{padding:14px;font-size:14px}.preview-area{min-height:260px}.nav-mana-upgrade{max-width:100px;overflow:hidden;text-overflow:ellipsis}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.comm-card:hover img,.comm-card:hover video,.creer-video-card:hover,.x-feat-card:hover{transform:none}}
@media(min-width:601px) and (max-width:1100px){.comm-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.x-hero-in{grid-template-columns:1fr}.x-hero-feat-grid{max-width:640px}.x-feat-card{aspect-ratio:3/4}.x-hero-title{max-width:680px}}
@media(max-width:600px){.x-hero-feat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:visible}.x-feat-card{aspect-ratio:3/5}}
