
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#09070d;color:#f7f4fb;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
button,input{font:inherit}a{color:inherit}.ambient{position:fixed;width:560px;height:560px;border-radius:50%;filter:blur(130px);opacity:.18;z-index:-2}.ambient.one{background:#7e3cff;left:-280px;top:80px}.ambient.two{background:#d84dff;right:-300px;top:520px}.noise{position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.035;background-image:radial-gradient(rgba(255,255,255,.7) .5px,transparent .5px);background-size:4px 4px}
.page-loader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#08060b;transition:.35s ease}.page-loader.hide{opacity:0;visibility:hidden}.loader-mark{font-weight:900;font-size:38px;background:linear-gradient(90deg,#8d4cff,#e86cff);-webkit-background-clip:text;color:transparent}.loader-line{width:120px;height:3px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin:16px auto 0}.loader-line span{display:block;height:100%;width:44%;background:#a357ff;animation:load 1s ease-in-out infinite}@keyframes load{0%{transform:translateX(-120%)}100%{transform:translateX(280%)}}
.site-header{position:sticky;top:0;z-index:60;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px;padding:18px clamp(18px,4vw,64px);background:rgba(8,6,11,.78);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.08)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,#743cff,#d85dff);font-weight:900}.brand-copy{display:flex;flex-direction:column}.brand-copy strong{font-size:14px;letter-spacing:.08em}.brand-copy small{font-size:9px;color:#94899e;letter-spacing:.15em;margin-top:4px}
.nav{display:flex;justify-content:center;gap:22px}.nav a{font-size:13px;font-weight:800;text-decoration:none;color:#aaa0b3}.nav a:hover,.nav a.active{color:#fff}
.join-btn,.primary-btn,.ghost-btn{border:0;border-radius:13px;padding:13px 17px;font-weight:900;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s ease}.join-btn,.primary-btn{background:linear-gradient(135deg,#8243ff,#c552ff);color:#fff}.ghost-btn{background:rgba(255,255,255,.05);color:#fff;border:1px solid rgba(255,255,255,.1)}.join-btn:hover,.primary-btn:hover,.ghost-btn:hover{transform:translateY(-2px)}
.menu-btn{display:none;background:none;border:0;padding:6px}.menu-btn span{display:block;width:24px;height:2px;background:white;margin:5px;border-radius:2px}
.section{max-width:1180px;margin:0 auto;padding:95px 24px}.page-hero{padding-top:80px;padding-bottom:35px;min-height:350px;display:flex;align-items:flex-end}.eyebrow{font-size:10px;font-weight:900;letter-spacing:.18em;color:#bb91ff;margin:0 0 14px}.page-hero h1,.section-head h2,.hero h1,.community-copy h2{margin:0;letter-spacing:-.05em;line-height:.95}.page-hero h1{font-size:clamp(56px,8vw,105px)}.page-hero h1 span,.hero h1 span{background:linear-gradient(90deg,#9b62ff,#ec7cff);-webkit-background-clip:text;background-clip:text;color:transparent}.page-hero p:not(.eyebrow){max-width:760px;color:#a49aaa;font-size:17px;line-height:1.7;margin:22px 0 0}
.hero{min-height:84vh;display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}.hero h1{font-size:clamp(54px,7vw,92px)}.hero p{color:#aaa0b3;line-height:1.7;font-size:18px;max-width:650px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.hero-card{border:1px solid rgba(255,255,255,.1);border-radius:26px;background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.025));padding:20px}.preview{height:330px;border-radius:18px;background:radial-gradient(circle at 62% 30%,rgba(225,104,255,.6),transparent 20%),radial-gradient(circle at 40% 60%,rgba(115,62,255,.8),transparent 28%),linear-gradient(135deg,#1b0b2d,#0c0b10);display:grid;place-items:center}.preview span{width:70px;height:70px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);font-size:24px}.home-links{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:42px}.home-link{padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:16px;text-decoration:none;background:rgba(255,255,255,.035);font-weight:900;font-size:13px}.home-link:hover{background:rgba(255,255,255,.07)}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:25px;margin-bottom:28px}.section-head h2{font-size:clamp(38px,5vw,62px)}.search-shell{display:flex;align-items:center;gap:8px;width:min(350px,100%);padding:12px 14px;border:1px solid rgba(255,255,255,.09);border-radius:13px;background:rgba(255,255,255,.04)}.search-shell input{width:100%;background:none;border:0;outline:none;color:white}.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}.filter{border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.035);color:#a69cad;border-radius:999px;padding:9px 12px;font-weight:800;font-size:11px;cursor:pointer}.filter.active,.filter:hover{background:#fff;color:#111}
.resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.resource-card{min-height:270px;padding:22px;border:1px solid rgba(255,255,255,.085);border-radius:20px;background:rgba(255,255,255,.035);display:flex;flex-direction:column;transition:.2s ease}.resource-card:hover{transform:translateY(-3px);border-color:rgba(184,120,255,.38);background:rgba(255,255,255,.055)}.resource-card.featured{background:linear-gradient(145deg,rgba(126,58,255,.11),rgba(255,255,255,.035));border-color:rgba(177,105,255,.3)}.card-icon{font-size:30px;min-height:42px}.badge{align-self:flex-start;background:rgba(159,92,255,.13);color:#c08fff;border-radius:6px;padding:6px 8px;font-size:9px;font-weight:900;letter-spacing:.11em;margin-top:10px}.resource-card h3{font-size:22px;margin:18px 0 9px}.resource-card p{color:#9e94a8;line-height:1.65;font-size:14px;margin:0 0 18px}.card-link{margin-top:auto;display:flex;justify-content:space-between;align-items:center;border:0;border-top:1px solid rgba(255,255,255,.08);background:none;color:#fff;text-decoration:none;padding:15px 0 0;font-weight:900;cursor:pointer}.card-link:hover{color:#d1adff}.empty-state{display:none;text-align:center;color:#8b8195;padding:30px}
.fandom-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.fandom-card{position:relative;min-height:165px;padding:20px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.03)}.fandom-rank{color:#736a7d;font-size:11px}.fandom-name{font-size:24px;font-weight:900;margin:28px 0 6px}.fandom-votes{color:#958a9e;font-size:12px}.vote-btn{position:absolute;right:18px;bottom:18px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:white;border-radius:10px;padding:9px 12px;font-weight:900;cursor:pointer}.vote-btn.voted{background:#8d47ff}.add-fandom{display:flex;align-items:center;justify-content:center;min-height:165px;border:1px dashed rgba(184,121,255,.4);border-radius:18px;background:rgba(149,74,255,.05);cursor:pointer;color:#cba6ff;font-weight:900}
.challenge-card{display:grid;grid-template-columns:1.25fr .75fr;border:1px solid rgba(255,255,255,.08);border-radius:24px;overflow:hidden;background:rgba(255,255,255,.035)}.challenge-copy,.challenge-side{padding:32px}.challenge-copy h3{font-size:clamp(34px,5vw,58px);margin:10px 0}.challenge-copy p{color:#a69bac;line-height:1.7}.challenge-rules{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}.challenge-rules span{font-size:11px;background:rgba(255,255,255,.055);padding:8px 10px;border-radius:8px}.challenge-side{background:linear-gradient(145deg,rgba(125,55,255,.25),rgba(255,255,255,.02));border-left:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;justify-content:center}.countdown{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.countdown strong{font-size:38px}.countdown span{display:block;color:#8d8198;font-size:9px;margin-top:4px}
.generator-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.generator-card{padding:24px;border:1px solid rgba(255,255,255,.08);border-radius:20px;background:rgba(255,255,255,.035)}.generator-card h3{font-size:22px;margin:36px 0 18px}.generator-card p{min-height:75px;color:#d5ccd9;line-height:1.5}.wide{width:100%}
.community-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.community-copy,.featured-editor{padding:30px;border:1px solid rgba(255,255,255,.08);border-radius:22px;background:rgba(255,255,255,.03)}.community-copy p{color:#a399ab;line-height:1.7}.community-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.featured-editor{text-align:center;background:radial-gradient(circle at 50% 10%,rgba(147,68,255,.2),transparent 35%),rgba(255,255,255,.03)}.editor-avatar{width:86px;height:86px;border-radius:23px;margin:20px auto 14px;display:grid;place-items:center;background:linear-gradient(145deg,#7840ff,#df5cff);font-weight:900;font-size:26px}.editor-stats{display:flex;justify-content:center;gap:18px;margin:22px 0}.editor-stats span{font-size:10px;color:#81768a}.editor-stats strong{display:block;color:#fff;font-size:17px}
.modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;background:rgba(0,0,0,.67);backdrop-filter:blur(7px);opacity:0;visibility:hidden;transition:.2s;padding:18px}.modal.open{opacity:1;visibility:visible}.modal-panel{position:relative;width:min(470px,100%);padding:28px;border:1px solid rgba(255,255,255,.1);border-radius:20px;background:#110d16}.modal-close{position:absolute;right:13px;top:9px;background:none;border:0;color:#978d9f;font-size:29px;cursor:pointer}.modal-panel h3{font-size:30px;margin:8px 0}.modal-panel p{color:#9c92a5;line-height:1.6}.form-row{display:flex;gap:8px}.form-row input{flex:1;padding:12px 13px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.045);color:white;outline:none}
footer{max-width:1180px;margin:0 auto;padding:28px 24px 42px;border-top:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:auto 1fr auto;gap:20px;color:#716779;font-size:11px}footer p{text-align:center;margin:0}.footer-brand{font-weight:900;text-decoration:none}.reveal{opacity:0;transform:translateY(18px);transition:.55s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.site-header{grid-template-columns:auto auto;justify-content:space-between}.join-btn{display:none}.menu-btn{display:block}.nav{position:absolute;top:76px;left:14px;right:14px;display:flex;flex-direction:column;gap:3px;padding:10px;border-radius:15px;background:rgba(13,9,18,.98);border:1px solid rgba(255,255,255,.08);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.2s}.nav.open{opacity:1;visibility:visible;transform:none}.nav a{padding:12px;border-radius:9px}.hero{grid-template-columns:1fr}.resource-grid,.generator-grid{grid-template-columns:repeat(2,1fr)}.challenge-card,.community-grid{grid-template-columns:1fr}.challenge-side{border-left:0;border-top:1px solid rgba(255,255,255,.08)}footer{grid-template-columns:1fr;text-align:center}}
@media(max-width:620px){.section{padding:72px 18px}.page-hero{min-height:290px;padding-top:55px;padding-bottom:20px}.page-hero h1{font-size:52px}.hero h1{font-size:49px}.hero p{font-size:16px}.home-links,.resource-grid,.generator-grid,.fandom-grid{grid-template-columns:1fr}.section-head{flex-direction:column;align-items:flex-start}.search-shell{width:100%}.brand-copy small{display:none}.challenge-copy,.challenge-side,.community-copy,.featured-editor{padding:22px}.community-actions .primary-btn,.community-actions .ghost-btn{width:100%}}



.auth-combined-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 15px !important;
  border-radius:999px;
  background:linear-gradient(135deg,#8243ff,#c552ff);
  color:#fff !important;
  font-weight:900 !important;
  white-space:nowrap;
  box-shadow:0 8px 24px rgba(132,67,255,.18);
  transition:.2s ease;
}
.auth-combined-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(132,67,255,.28);
  color:#fff !important;
}
@media(max-width:900px){
  .auth-combined-btn{
    width:100%;
    margin-top:4px;
    text-align:center;
  }
}
