:root{color-scheme:dark;--bg:#031827;--panel:#071F33;--panel2:#0a2940;--line:#16445a;--text:#f2fbff;--muted:#9bb5c4;--accent:#65EAFF;--accent2:#5CECFF;--good:#9af4d1;--danger:#ffaaa9}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;min-height:100vh}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.13;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,#000,transparent 75%);z-index:-1}
a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}::selection{background:#65EAFF;color:#031827}
.topbar{min-height:78px;padding:0 clamp(20px,5vw,76px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff17;gap:20px}
.brand{display:flex;gap:12px;align-items:center;font-family:'Space Grotesk',sans-serif;font-weight:700;letter-spacing:.02em}.brand-mark{width:34px;height:34px;display:grid;place-items:center;border:1px solid #65EAFF;border-radius:50%;color:#031827;background:#65EAFF;font-family:'Space Grotesk',sans-serif;font-size:17px}.brand-name{font-size:12px;letter-spacing:.13em;line-height:1.45}.brand-name span{display:block;color:#9bb5c4;font-size:9px;letter-spacing:.24em}
.site-nav{display:flex;align-items:center;gap:25px}.text-link{font-size:12px;color:#c4d8e3;transition:color .2s}.text-link:hover{color:#65EAFF}.nav-current{font-size:9px;letter-spacing:.18em;color:#99999e;border-left:1px solid #3a3a3d;padding-left:22px}
.muted{color:var(--muted)}.auth-layout{max-width:1120px;margin:0 auto;padding:68px 24px 60px;display:grid;grid-template-columns:1fr minmax(320px,430px);gap:clamp(36px,8vw,110px);align-items:center;min-height:calc(100vh - 155px)}
.eyebrow{font-size:10px;letter-spacing:.19em;color:#65EAFF;font-weight:700;line-height:1.5}.eyebrow-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#65EAFF;margin:0 8px 1px 0;box-shadow:0 0 12px #65EAFF55}
.intro h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(52px,7vw,88px);font-weight:500;line-height:.99;letter-spacing:-.075em;margin:24px 0}.accent{color:#65EAFF}.lead{font-size:16px;line-height:1.85;max-width:445px}
.support-note{display:flex;align-items:flex-start;gap:14px;border-top:1px solid #ffffff1c;border-bottom:1px solid #ffffff1c;padding:18px 0;margin-top:32px;max-width:445px}.support-note-mark{width:30px;height:30px;border:1px solid #1a5068;border-radius:50%;display:grid;place-items:center;color:#65EAFF;flex:none}.support-note strong{font-size:12px;font-weight:600}.support-note p{font-size:12px;line-height:1.65;color:#9bb5c4;margin:5px 0 0}.trust-row{display:flex;gap:18px;flex-wrap:wrap;color:#a8a8ac;font-size:10px;margin-top:25px}.trust-row span{display:inline-flex;align-items:center;gap:7px}.trust-row span:before{content:"";width:4px;height:4px;border-radius:50%;background:#65EAFF}
.panel{border:1px solid #16445a;background:linear-gradient(145deg,#0b2a40,#061a2a);border-radius:5px;padding:28px;box-shadow:0 24px 80px #0008}.auth-panel{position:relative;overflow:hidden}.auth-panel:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,#65EAFF,#0a7899,transparent)}
.panel-kicker{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.17em;color:#aaaab0;margin-bottom:19px}.panel-kicker span{color:#707075}
.tabs{display:grid;grid-template-columns:1fr 1fr;padding:3px;background:#03121e;border:1px solid #16445a;margin-bottom:24px}.tab{border:0;background:transparent;color:#9bb5c4;padding:11px;border-radius:2px;cursor:pointer;font-size:12px}.tab.active{background:#65EAFF;color:#031827;font-weight:700}
.form-stack{display:grid;gap:16px}.form-stack label,.field-label{display:grid;gap:8px;color:#d9d9d6;font-size:12px}.form-stack input,.field,.form-stack textarea,.form-stack select{width:100%;border:1px solid #16445a;border-radius:2px;background:#041a29;color:var(--text);padding:13px 14px;outline:none;font-size:13px;transition:border-color .2s}.form-stack input:focus,.field:focus,textarea:focus,select:focus{border-color:#65EAFF}.form-stack input::placeholder,.field::placeholder,.stack textarea::placeholder{color:#66666c}
.button{min-height:44px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid transparent;border-radius:2px;padding:13px 16px;font-weight:700;font-size:12px;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,opacity .18s ease}.button:hover{filter:brightness(1.08);box-shadow:0 8px 24px #0003}.button:active{transform:scale(.99)}.button:disabled{opacity:.55;cursor:wait;transform:none;box-shadow:none}.primary{background:#5CECFF;color:#031827}.primary span{margin-left:auto}.discord{background:#0a2b42;color:#eafaff;border-color:#1a5068;width:100%}.discord-icon{font-size:20px}.button-arrow{margin-left:auto;color:#a4a4a8}.link-button{background:transparent;color:#c6c6c1;padding:4px;border:0;min-height:28px;font-weight:500}
.or-divider{display:flex;align-items:center;gap:12px;color:#7f9eaf;font-size:9px;letter-spacing:.15em;margin:22px 0}.or-divider:before,.or-divider:after{content:"";height:1px;flex:1;background:#333337}.fine-print,.hint{font-size:10px;line-height:1.7;color:#77777d}.notice{padding:12px 14px;border-radius:2px;background:#0a3b3a;color:var(--good);font-size:12px;margin-bottom:16px;line-height:1.5;overflow-wrap:anywhere}.notice.error{background:#3b2027;color:var(--danger)}
.footer{display:flex;justify-content:center;align-items:center;gap:22px;flex-wrap:wrap;border-top:1px solid #ffffff17;padding:22px;color:#77777d;font-size:9px;letter-spacing:.12em}.footer a{color:#c6c6c1}
.page-wrap{max-width:1120px;margin:0 auto;padding:40px 22px 70px}.page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:28px}.page-heading h1{font:500 clamp(28px,4vw,42px) 'Space Grotesk',sans-serif;letter-spacing:-.04em;margin:6px 0}.page-heading p{color:var(--muted);margin:0}.layout-grid{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:20px}.card{border:1px solid #16445a;background:#071F33;border-radius:3px;padding:22px;min-width:0;box-shadow:0 18px 60px #0002}.card h2{font:600 16px 'Space Grotesk',sans-serif;letter-spacing:-.02em;margin:0 0 18px}.stack{display:grid;gap:14px}.stack label{display:grid;gap:7px;font-size:12px;color:#c9c9c5}.stack textarea{min-height:100px;resize:vertical}.ticket-list{display:grid;gap:9px}.ticket-item{width:100%;text-align:left;border:1px solid #303034;background:#0a2940;border-radius:2px;padding:14px;color:var(--text);cursor:pointer;transition:border-color .18s,background .18s,transform .18s}.ticket-item:hover{border-color:#65EAFF;transform:translateY(-1px)}.ticket-item.selected{border-color:#65EAFF;background:#0e354e}.ticket-item strong{display:block;margin-bottom:7px;overflow-wrap:anywhere}.ticket-meta{display:flex;gap:8px;flex-wrap:wrap;font-size:10px;color:var(--muted)}.status{display:inline-block;border-radius:2px;padding:4px 8px;background:#10374d;color:#d9f8ff;font-size:9px;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}.status.open{background:#10433f;color:#9af4d1}.status.in_progress{background:#173d57;color:#a8e8ff}.status.closed{background:#172d3d;color:#9bb5c4}.thread{display:grid;gap:12px;max-height:390px;overflow:auto;margin:14px 0;scrollbar-width:thin;scrollbar-color:#555 transparent}.message{padding:13px;border-radius:2px;background:#0a2940;border:1px solid #ffffff0c;overflow-wrap:anywhere}.message.staff{background:#0e354e;border-color:#1a5068}.message-head{display:flex;justify-content:space-between;gap:10px;color:#a5a5ab;font-size:10px;margin-bottom:8px}.message-body{white-space:pre-wrap;line-height:1.6;font-size:12px;overflow-wrap:anywhere}.empty{color:#89898f;text-align:center;padding:28px 10px;font-size:12px;line-height:1.7}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row .button{flex:0 0 auto}.small{font-size:11px;color:var(--muted);line-height:1.6}.danger-link{border:0;background:none;color:#ffaaaa;cursor:pointer}.file-input{display:block;width:100%;max-width:100%;font-size:11px;color:var(--muted);padding:12px;border:1px dashed #1a5068;border-radius:2px;background:#041a29}.file-input::file-selector-button{border:0;border-radius:2px;background:#10374d;color:#eafaff;padding:8px 10px;margin-right:10px;cursor:pointer}.hidden{display:none!important}code{font-size:12px;overflow-wrap:anywhere}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #65EAFF;outline-offset:3px}
@media(max-width:780px){.auth-layout{grid-template-columns:1fr;gap:30px;padding-top:44px;min-height:auto;padding-bottom:36px}.intro h1{font-size:clamp(48px,12vw,66px)}.lead{font-size:14px}.trust-row{margin-top:20px}.panel{padding:22px}.layout-grid{grid-template-columns:1fr}.page-wrap{padding:28px 14px 40px}.page-heading{align-items:flex-start;flex-direction:column}.topbar{min-height:68px;padding-inline:16px}.brand{gap:8px}.site-nav{gap:12px}.nav-current{display:none}.card{padding:17px}.thread{max-height:none}.footer{gap:12px}.support-note{margin-top:25px}}
@media(max-width:420px){.site-nav .text-link:first-child{display:none}.brand-name{font-size:10px}.auth-layout{padding-inline:16px}.panel{padding:18px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Mirage Productions homepage-inspired layout */
body.landing-page{background:radial-gradient(ellipse at 50% 100%,#123d5b 0%,#0b2b45 42%,#031827 100%);background-attachment:fixed}
body.landing-page:before{opacity:.035;background-size:64px 64px}
.topbar{min-height:56px;padding:0 clamp(18px,4.8vw,100px);background:#031827;border-bottom:1px solid #ffffff12}
.brand{gap:10px;letter-spacing:0}
.brand-mark{width:28px;height:32px;border:0;border-radius:0;background:linear-gradient(135deg,#65EAFF,#1671d1);color:#031827;font-size:18px;font-weight:700;clip-path:polygon(0 0,36% 0,50% 28%,64% 0,100% 0,100% 100%,65% 100%,65% 42%,50% 63%,35% 42%,35% 100%,0 100%)}
.brand-name{font-family:'DM Sans',sans-serif;font-size:13px;letter-spacing:-.02em;line-height:1.1;color:#eafaff}
.brand-name span{font-size:8px;letter-spacing:.19em;color:#65EAFF;margin-top:3px}
.site-nav{gap:24px}.text-link{font-size:11px;color:#9bb5c4}.text-link:hover{color:#65EAFF}
.auth-layout{max-width:1000px;min-height:calc(100vh - 112px);padding:64px 24px 72px;gap:clamp(44px,7vw,100px);grid-template-columns:minmax(0,1fr) minmax(340px,420px)}
.intro h1{font-size:clamp(54px,6.5vw,80px);font-weight:700;letter-spacing:-.075em;line-height:.92;margin:22px 0}
.hero-white{color:#f2fbff}.lead{max-width:470px;font-size:14px;line-height:1.75}
.support-note{border-color:#16445a}.trust-row{color:#9bb5c4}
.panel{background:linear-gradient(150deg,#0b2a40ee,#061a2af5);border-color:#16445a;border-radius:5px;box-shadow:0 24px 70px #0002}
.panel-kicker{color:#8fa9b8}.tabs{margin-bottom:24px}
.form-stack[hidden],[hidden]{display:none!important}
.form-stack{gap:15px}.form-stack input{min-height:45px}
.or-divider:before,.or-divider:after{background:#16445a}
.footer{border-color:#ffffff12;color:#7895a6}.footer a{color:#a8c1cf}
@media(max-width:780px){.auth-layout{grid-template-columns:1fr;gap:28px;padding-top:38px;max-width:520px}.intro h1{font-size:clamp(48px,11vw,64px)}.intro .support-note,.intro .trust-row{display:none}.panel{padding:22px}.topbar{padding-inline:18px}.site-nav{gap:14px}}
@media(max-width:420px){.site-nav{gap:12px}.site-nav .text-link:first-child{display:inline}.brand-name{font-size:12px}.auth-layout{padding-inline:16px}.panel{padding:18px}}


/* Rounded, pill-shaped Mirage Productions controls and matching Discord button */
:root{--discord:#5865F2}
body.landing-page{background:linear-gradient(180deg,#061c2d 0%,#0a2c47 52%,#123d5b 100%);background-attachment:fixed}
body.landing-page:before{opacity:.025}
.topbar{min-height:56px}
.brand-mark{border-radius:7px;clip-path:none;box-shadow:0 0 18px #168edb20}
.site-nav .text-link{border-radius:999px;padding:9px 13px;transition:background .18s,color .18s}
.site-nav .text-link:hover{background:#0b354e;color:#65EAFF}
.auth-layout{max-width:1060px;grid-template-columns:minmax(0,1fr) minmax(350px,420px);gap:clamp(44px,7vw,90px);padding-top:58px}
.intro h1{font-size:clamp(58px,6.8vw,84px);letter-spacing:-.07em}
.auth-panel{border-radius:16px;padding:28px;background:linear-gradient(150deg,#0b2c43f5,#061b2bf5);box-shadow:0 24px 70px #00101d35}
.panel-kicker{font-size:10px;letter-spacing:.14em;margin-bottom:18px}
.tabs{border-radius:12px;padding:4px;background:#031827;border-color:#16445a}
.tab{border-radius:9px;padding:12px}
.form-stack input,.field,.form-stack textarea,.form-stack select{border-radius:9px;background:#041b2a;border-color:#1a4b62;padding:13px 14px}
.form-stack input:focus,.field:focus,textarea:focus,select:focus{box-shadow:0 0 0 3px #65EAFF20}
.button{border-radius:999px;min-height:46px;padding:13px 19px;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}
.button:hover{transform:translateY(-1px);box-shadow:0 7px 22px #0003}
.button:active{transform:translateY(0) scale(.985)}
.primary{background:linear-gradient(135deg,#65EAFF,#5CECFF);box-shadow:0 5px 18px #5cecff18}
.link-button{border-radius:999px}
.discord{background:#5865F2;color:#fff;border-color:#7280ff;justify-content:flex-start;gap:12px}
.discord:hover{background:#4752c4;filter:none}
.discord-logo{width:23px;height:23px;object-fit:contain;border-radius:6px;flex:none}
.discord .button-arrow{color:#fff;opacity:.85}
.or-divider:before,.or-divider:after{background:#16445a}
.support-note{border-radius:12px;padding:18px;margin-top:30px;background:#071f33a8}
.support-note-mark{border-radius:10px;background:#0a2940}
.card{border-radius:15px}
.ticket-item{border-radius:12px}
.message{border-radius:12px}
.status{border-radius:999px}
.file-input{border-radius:12px}
.footer{border-color:#ffffff12}
.page-heading h1{letter-spacing:-.055em}
@media(max-width:780px){.auth-layout{grid-template-columns:1fr;gap:26px;padding-top:34px}.intro h1{font-size:clamp(48px,11vw,65px)}.auth-panel{padding:22px}.intro .support-note,.intro .trust-row{display:none}}
@media(max-width:420px){.auth-layout{padding-inline:16px}.auth-panel{padding:18px}.site-nav .text-link{padding:8px 9px;font-size:10px}}

/* Knowledge base, FAQ and policy pages */
.topic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:24px 0}
.topic-card{display:block;border:1px solid #16445a;background:linear-gradient(145deg,#0b2a40,#061a2a);padding:22px;border-radius:10px;transition:transform .18s,border-color .18s}
.topic-card:hover{transform:translateY(-3px);border-color:#65EAFF}
.topic-icon{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid #1a5068;border-radius:10px;color:#65EAFF;font-size:11px;margin-bottom:18px}
.topic-card h2,.guide-section h2,.guide-cta h2{font:600 19px 'Space Grotesk',sans-serif;margin:0 0 9px}
.topic-card p,.guide-section p,.guide-section li,.guide-cta p{font-size:13px;color:var(--muted);line-height:1.8}
.topic-link{font-size:11px;color:#65EAFF}
.guide-section{margin-top:16px;scroll-margin-top:20px}.guide-section ol,.guide-section ul{padding-left:22px}
.guide-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:16px}
.faq-list{display:grid;gap:12px;max-width:900px}
.faq-item{border:1px solid #16445a;background:#071F33;border-radius:8px;padding:18px 20px}
.faq-item summary{cursor:pointer;font:600 15px 'Space Grotesk',sans-serif;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"+";float:right;color:#65EAFF;font-size:20px}
.faq-item[open] summary:after{content:"−"}.faq-item p,.legal-copy p{font-size:13px;line-height:1.85;color:var(--muted)}
.faq-item p{margin-bottom:0}.legal-page{max-width:900px}.legal-copy h2{font:600 17px 'Space Grotesk',sans-serif;margin:26px 0 8px}.legal-copy h2:first-of-type{margin-top:20px}
@media(max-width:850px){.topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-cta{align-items:flex-start;flex-direction:column}}
@media(max-width:480px){.topic-grid{grid-template-columns:1fr}.topic-card{padding:18px}.guide-cta .button{width:100%}}


/* Professional portal polish */
.brand-logo{display:block;width:36px;height:36px;object-fit:contain;flex:none}
.brand{min-width:max-content}
.site-nav .text-link{font-weight:600}
.page-wrap{padding-top:48px}
.card{border-radius:12px;border-color:#16445a;background:linear-gradient(155deg,#09263a,#061b2b);box-shadow:0 16px 42px #0002}
.card h2{font-size:17px}
.field,.stack textarea,.file-input{border-radius:8px;border-color:#1a4a61;background:#041a29}
.field:focus,.stack textarea:focus{box-shadow:0 0 0 3px #65eaff18}
.button{border-radius:8px}
.ticket-item{border-radius:9px;padding:16px;background:#082338;border-color:#16445a}
.ticket-item strong{font-size:13px;line-height:1.5}
.ticket-item.selected{box-shadow:inset 3px 0 #65eaff}
.status{border-radius:999px;padding:5px 10px;font-weight:700}
.message{border-radius:10px;padding:16px}
.message.staff{border-left:3px solid #65eaff}
.thread{padding:3px}
.ticket-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ticket-subtitle{font-size:12px;color:var(--muted);line-height:1.7;margin:-8px 0 18px}
.ticket-count{font-size:11px;color:#b6d2df;border:1px solid #16445a;background:#082338;padding:6px 10px;border-radius:999px}
.ticket-layout{align-items:start}
.faq-hero{padding:38px;border:1px solid #16445a;border-radius:16px;background:radial-gradient(ellipse at top right,#10405b88,transparent 58%),linear-gradient(145deg,#09283d,#061a2a);margin-bottom:28px}
.faq-hero h1{max-width:720px}
.faq-search{width:100%;padding:15px 17px;border:1px solid #1a5068;background:#041a29;color:var(--text);border-radius:10px;outline:none}
.faq-search:focus{border-color:var(--accent);box-shadow:0 0 0 3px #65eaff18}
.faq-groups{display:grid;gap:28px}
.faq-group h2{font:600 18px 'Space Grotesk',sans-serif;margin:0 0 12px}
.faq-list{display:grid;gap:10px}
.faq-item{border:1px solid #16445a;background:linear-gradient(135deg,#09263a,#061b2b);border-radius:10px;padding:0 18px}
.faq-item summary{list-style:none;cursor:pointer;padding:17px 28px 17px 0;font-size:13px;font-weight:700;line-height:1.6;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:'+';position:absolute;right:0;top:14px;color:var(--accent);font-size:20px;font-weight:400}
.faq-item[open] summary:after{content:'−'}
.faq-item p{font-size:12px;color:#b0c6d2;line-height:1.85;margin:0;padding:0 0 18px;max-width:850px}
.faq-empty{display:none;padding:20px;color:var(--muted);border:1px dashed #16445a;border-radius:10px}
@media(max-width:780px){.brand-logo{width:32px;height:32px}.faq-hero{padding:24px 19px}.page-wrap{padding-top:28px}}
