:root{--ink:#0c2f61;--navy:#082a60;--blue:#176de7;--blue2:#00bce9;--line:#cadeef;--glass:rgba(255,255,255,.82);--shadow:0 18px 55px rgba(15,79,149,.12);--body-bg:#f4faff; color-scheme:light}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:var(--body-bg)!important;color:var(--ink)!important;font-family:Cairo,Tahoma,Arial,sans-serif!important;line-height:1.7;overflow-x:hidden}body:before{display:none!important}a{color:inherit}button,input,textarea{font:inherit}
#sky-scene{position:fixed;inset:0;z-index:-5;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 17% 2%,#beeaffb2,transparent 37%),radial-gradient(ellipse at 83% 51%,#d3e6ffdd,transparent 44%),linear-gradient(160deg,#f7fcff,#edf6ff 55%,#f9fdff)}
#sky-scene .sky-grid{position:absolute;inset:-35px;opacity:.27;background-image:linear-gradient(#478fd723 1px,transparent 1px),linear-gradient(90deg,#478fd723 1px,transparent 1px);background-size:62px 62px;mask-image:linear-gradient(0deg,transparent,black 30%,black 80%,transparent);transform:translate3d(0,0,0)}
#sky-scene .sky-glow{position:absolute;border-radius:50%;filter:blur(6px);opacity:.68;will-change:transform}#sky-scene .sky-glow.g1{width:580px;height:580px;right:-160px;top:8%;background:radial-gradient(circle,#8ee7ff96 0%,#83d3ff4d 35%,transparent 72%)}#sky-scene .sky-glow.g2{width:630px;height:630px;left:-240px;bottom:-260px;background:radial-gradient(circle,#80a8fd7a,transparent 69%)}#sky-scene .float-pixel{position:absolute;width:18px;height:18px;transform:rotate(20deg);border:2px solid #27acec4a;background:#69c9fa30;border-radius:3px}#sky-scene .p1{left:12%;top:27%}#sky-scene .p2{right:15%;top:30%;width:12px;height:12px}#sky-scene .p3{left:68%;top:72%;width:24px;height:24px}#sky-scene .p4{left:19%;bottom:12%;width:10px;height:10px}
.site-shell{position:relative;z-index:1;min-height:100vh}.navbar{max-width:1220px;margin:24px auto 0;padding:11px 18px 11px 14px;border:1px solid rgba(255,255,255,.95);background:rgba(255,255,255,.78);backdrop-filter:blur(20px);border-radius:22px;display:flex;justify-content:space-between;align-items:center;gap:14px;box-shadow:0 15px 38px #4086ce13}
.brand-lockup{display:flex;align-items:center;gap:11px;text-decoration:none;font-family:Arial,sans-serif;direction:ltr;font-weight:900;color:#093a77}.brand-lockup img{width:48px;height:48px;border-radius:15px;box-shadow:0 5px 15px #1faad83d}.brand-lockup span{font-size:20px;letter-spacing:1px;white-space:nowrap}.brand-lockup span b{color:#0bace8}.navlinks{display:flex;flex-wrap:wrap;gap:4px;align-items:center;justify-content:center}.navbar .navlinks a,.navbar .nav-disc{color:#17447b;text-decoration:none;padding:10px 15px;border-radius:13px;font-weight:800;font-size:14px}.navbar .navlinks a:hover,.navbar .navlinks a.active{background:#e4f1ff;color:#066bd4}.navbar .nav-disc{background:#105fcb;color:#fff;box-shadow:0 6px 15px #1473ed35;white-space:nowrap}.navbar .nav-disc:hover{background:#084aa3}
.container{max-width:1200px;margin:auto;padding:0 24px}.hero-section{min-height:620px;display:grid;grid-template-columns:1.04fr .96fr;align-items:center;gap:26px;padding:52px 0 36px}.hero-content{padding:15px 0}.kicker{display:inline-flex;gap:9px;align-items:center;border:1px solid #a2d9f7;background:#f0f9ffdf;color:#0871ad;font-weight:900;padding:8px 16px;border-radius:40px;font-size:13px}.status-dot{display:inline-block;width:9px;height:9px;background:#0fc6db;border-radius:50%;box-shadow:0 0 0 4px #00d2e51a}.hero-content h1{font:900 clamp(56px,7vw,102px)/1.08 Arial,sans-serif;color:#092b5a;letter-spacing:-2.5px;direction:ltr;text-align:right;margin:27px 0 7px;text-shadow:0 5px 25px #4b99e814}.hero-content h1 .blue{color:#0b82df}.hero-content h2{font-size:clamp(24px,2.9vw,36px);margin:9px 0;color:#163b70}.hero-content p{font-size:17px;color:#527092;max-width:600px;margin:12px 0 28px}.hero-ctas{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.btn{border:1px solid #bcd5ee;display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:15px;font-weight:900;padding:14px 22px;text-decoration:none;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s;color:#0e5eb5;background:#fff}.btn:hover{transform:translateY(-3px);box-shadow:0 15px 30px #267ae323}.btn-primary{background:linear-gradient(115deg,#075bcc,#0dbfe8);color:#fff;border-color:#0a98e4;box-shadow:0 9px 22px #1384e632}.btn-secondary{background:#fff;color:#18569a}.hero-proof{display:flex;gap:24px;margin-top:32px;color:#356a9f;font-size:13px;font-weight:800;flex-wrap:wrap}.hero-proof span{display:flex;gap:6px;align-items:center}
.warden-stage{isolation:isolate;min-height:500px;position:relative;display:flex;align-items:center;justify-content:center;perspective:900px}.warden-stage::before{content:'';position:absolute;width:85%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 50%,#acf8ff9f,#b1d6ff59 52%,transparent 73%);filter:blur(9px);inset:auto;z-index:-1}.warden-orbit{position:absolute;border:1.7px solid #40baff60;border-radius:50%;width:78%;height:76%;transform:rotate(-16deg);box-shadow:0 0 75px #17c3fa22}.warden-orbit.o2{width:95%;height:90%;opacity:.46;transform:rotate(23deg)}.warden-hero-art{position:relative;width:min(115%,610px);filter:drop-shadow(0 25px 30px #0063b13b);animation:wardenFloat 7s ease-in-out infinite;will-change:transform}.warden-hero-art img{width:100%;height:auto;display:block}.warden-bubble{position:absolute;z-index:2;background:rgba(255,255,255,.88);border:1px solid #a6ddfb;border-radius:18px;box-shadow:0 12px 34px #3996d42e;padding:10px 16px;font-weight:900;color:#0b5caa;font-size:13px}.warden-bubble.b1{right:2%;top:23%}.warden-bubble.b2{left:1%;bottom:20%}.warden-bubble strong{color:#17a7d9}@keyframes wardenFloat{0%,100%{transform:translateY(0px)}50%{transform:translateY(-13px)}}
.section-heading{text-align:center;margin:54px auto 20px}.section-heading .eyebrow{color:#118fc9;font-weight:900;font-size:13px;letter-spacing:2px}.section-heading h2{font-size:clamp(24px,3vw,34px);color:#0c3264;margin:5px 0 8px}.section-heading p{color:#6883a3;margin:0}.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px;margin:28px 0 62px}.glass-card{background:var(--glass);border:1px solid #fff;border-radius:25px;padding:24px 20px;box-shadow:var(--shadow);backdrop-filter:blur(12px);transition:transform .2s,box-shadow .2s}.glass-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px #1b7ece24}.card-icon{width:51px;height:51px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#ddf8ff,#dceaff);color:#066ad4;font-size:25px}.glass-card h3{margin:15px 0 6px;font-size:17px;color:#0c3671}.glass-card p{margin:0;color:#587b9f;font-size:14px;line-height:1.8}.action-section{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;margin:36px 0}.info-panel{padding:34px;border-radius:28px;border:1px solid #cde5fa;background:linear-gradient(130deg,#fff,#edf7ff);box-shadow:var(--shadow)}.info-panel h2{margin:0 0 10px;font-size:26px}.info-panel p{color:#567597;margin:0 0 19px}.server-ip{direction:ltr;text-align:center;font:900 clamp(17px,2.1vw,25px) Arial,sans-serif;letter-spacing:.4px;word-break:break-all;padding:19px 10px;color:#064baf;background:#e6f4ff;border:1px dashed #80b6eb;border-radius:17px;margin:14px 0}.ip-tools{display:flex;gap:10px;flex-wrap:wrap}.ip-tools .btn{flex:1}.staff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-bottom:38px}.staff-card{text-align:center}.staff-card .staff-avatar{display:grid;place-items:center;width:70px;height:70px;margin:auto;border-radius:21px;background:#e0f5ff;font-size:36px;box-shadow:inset 0 1px #fff}.staff-card .role{color:#087ac4;font-size:13px;font-weight:900}
.site-footer{margin-top:42px;padding:25px 20px;text-align:center;color:#6884a2;border-top:1px solid #d0e5f6;font-size:13px;background:#ffffff6b}
/* apply page: preserve original form fields and mechanics, restyle only */
body.application-page .topnav, body.success-page .topnav,body.rules-page .topnav{max-width:1200px;margin:24px auto 0;padding:10px 18px;background:rgba(255,255,255,.86);color:var(--ink);border:1px solid #fff;box-shadow:var(--shadow);backdrop-filter:blur(20px);border-radius:21px;display:flex;align-items:center;justify-content:space-between;gap:10px}
body.application-page .topnav .navbrand,body.application-page .topnav a,body.success-page .topnav a,body.rules-page .topnav a{color:#12559b!important}body.application-page .topnav .navlinks a.active{color:#fff!important;background:#167ee5}body.application-page .topnav .navlinks a:hover{background:#e2f3ff;color:#0b62bc!important}
body.application-page main{max-width:900px;margin:auto;padding:24px 18px 80px}body.application-page .hero{padding:26px 15px 33px;text-align:center}body.application-page .hero h1{color:#0f62bd;font-family:Arial,sans-serif!important;text-shadow:none;font-size:clamp(42px,8vw,66px)}body.application-page .hero h2{color:#173f71}body.application-page .hero p{color:#577898}body.application-page .brand{background:#dff5ff;color:#0d69bb;border:1px solid #b4e1ff}body.application-page .backhome{color:#085eaf;font-weight:900}body.application-page .notice{color:#235d8e;background:#e8f7ffed;border:1px solid #afd7f9;border-radius:18px}body.application-page .question{color:#103362;background:#fffefefe;border:1px solid #d4e7f7;border-radius:20px;box-shadow:0 12px 26px #1969ad12;padding:22px 25px}body.application-page .qhead h3{color:#113a6e;font-size:17px}body.application-page .num{color:#0889dc}body.application-page .qhead em{color:#ef5067}body.application-page .answer,body.application-page textarea{color:#133b6e!important;background:#f4faff!important;border-color:#b9d5ec!important;box-shadow:none}body.application-page .answer::placeholder,body.application-page textarea::placeholder{color:#7895ae}body.application-page .answer:focus,body.application-page textarea:focus{border-color:#1688e5!important;box-shadow:0 0 0 4px #159bea18!important}body.application-page .option{border-color:#d2e4f3;background:#f9fcff;color:#244f81}body.application-page .option:hover{background:#e9f7ff;border-color:#50b0ed}body.application-page .option:has(input:checked){background:#dff2ff!important;border-color:#2992df!important}body.application-page .option input{accent-color:#147fd8}body.application-page .submit{background:linear-gradient(105deg,#0960cf,#00ace0);box-shadow:0 12px 24px #177bd52b}body.application-page .fine{color:#6d86a0}body.application-page .footer{color:#6486a7}body.application-page .application-status{color:#2b577e;background:#edf7ff;border-color:#91caee}body.application-page .application-status[data-state="success"]{background:#e4faee;border-color:#76d5a4;color:#165e44}body.application-page .application-status[data-state="error"]{background:#fff0f1;border-color:#ec9ba4;color:#8b2332}
.rules-page .rules-wrap{max-width:1000px;margin:60px auto 40px;padding:0 18px}.rules-page .rules-lead{padding:34px;background:#ffffffd9;border:1px solid #fff;box-shadow:var(--shadow);border-radius:25px}.rules-page h1{color:#0a4e9d;font-size:36px;margin:0 0 10px}.rules-page .rules-lead p{margin:0;color:#5c7796}.rules-page .rules-note{margin:22px 0;padding:17px 21px;border-radius:16px;background:#e2f4ff;color:#1f5e99;border:1px solid #a7d9ff;font-weight:700}.rules-page .rule-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;list-style:none;margin:24px 0;padding:0;counter-reset:rules}.rules-page .rule-list li{position:relative;padding:18px 60px 18px 18px;border:1px solid #d8e9f6;border-radius:17px;background:#fff;box-shadow:0 6px 20px #2582c012;color:#26527c;font-weight:700;font-size:14px;counter-increment:rules}.rules-page .rule-list li:before{content:counter(rules);position:absolute;right:16px;top:16px;border-radius:9px;display:grid;place-items:center;width:32px;height:32px;color:#fff;font-size:14px;background:#1487de;font-family:Arial,sans-serif;font-weight:900}.rules-page .back,.success-page .back{display:inline-block;margin:17px 0;color:#1367b9;font-weight:800;text-decoration:none}
.success-page main{min-height:75vh;display:grid;place-items:center;padding:30px}.success-panel{background:#ffffffdc;border:1px solid #fff;border-radius:28px;padding:50px 38px;box-shadow:var(--shadow);text-align:center;max-width:650px}.success-panel h1{color:#0b6abf}
@media(max-width:1000px){.navbar{margin:10px 14px 0}.hero-section{grid-template-columns:1fr 1fr;min-height:500px}.warden-stage{min-height:410px}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.navbar .navlinks a{padding:7px 9px}}
@media(max-width:760px){.navbar{border-radius:18px;flex-wrap:wrap;justify-content:center;padding:10px}.brand-lockup{order:-2}.nav-disc{order:-1}.navbar .navlinks{width:100%;justify-content:center}.navbar .navlinks a{font-size:12px!important;padding:7px 9px!important}.brand-lockup span{font-size:16px}.hero-section{display:flex;flex-direction:column-reverse;text-align:center;padding:35px 0 18px;gap:0}.warden-stage{min-height:270px;width:100%}.warden-hero-art{width:min(100%,450px)}.warden-bubble{display:none}.hero-content h1{text-align:center;font-size:clamp(42px,10vw,75px)}.hero-content p{margin:16px auto 26px}.hero-ctas,.hero-proof{justify-content:center}.action-section{grid-template-columns:1fr}.staff-grid{grid-template-columns:1fr}.rules-page .rule-list{grid-template-columns:1fr}.rules-page h1{font-size:27px}body.application-page .topnav{margin:10px 12px 0;flex-wrap:wrap;justify-content:center}body.application-page main{padding:16px 12px 70px}.site-footer{margin-top:25px}}
@media(max-width:500px){.feature-grid{grid-template-columns:1fr}.container{padding:0 16px}.info-panel{padding:22px}.warden-stage{min-height:230px}.hero-section{padding-top:20px}.hero-proof{gap:12px}.hero-content h2{font-size:22px}body.application-page .question{padding:18px 15px}.rules-page .rules-wrap{margin-top:24px}.site-shell .navbar .navlinks a{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}

/* LEGEND CRAFT — crystal cave backdrop selected by the owner. */
#sky-scene {background:#edf8ff;}
#sky-scene .cave-parallax {position:absolute;inset:-50px;background-image:url("crystal-cave-original.webp");background-position:center center;background-size:cover;background-repeat:no-repeat;will-change:transform;transform:translate3d(0,0,0);}
#sky-scene .cave-veil {position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(242,249,255,.12),rgba(248,252,255,.35) 48%,rgba(240,249,255,.24));}
#sky-scene .sky-grid {opacity:.095;}
#sky-scene .sky-glow {opacity:.20;}
#sky-scene .float-pixel {opacity:.45;}
@media(max-width:760px){#sky-scene .cave-parallax{background-position:center center;}#sky-scene .cave-veil{background:linear-gradient(180deg,rgba(245,251,255,.09),rgba(248,252,255,.52),rgba(246,251,255,.37));}}

/* Exact user-selected blue crystal cave, no obstructing layers. */
body{font-family: "Segoe UI",Tahoma,Arial,sans-serif!important}
#sky-scene{z-index:-1!important;isolation:isolate;overflow:hidden;background:#eaf6ff!important;contain:paint}
#sky-scene .cave-parallax{
  position:absolute;inset:-20px;background-image:url("crystal-cave-original.webp")!important;
  background-size:cover;background-position:center center;background-repeat:no-repeat;
  transform:translate3d(0,0,0);will-change:transform;
}
#sky-scene .cave-veil,#sky-scene .sky-grid,#sky-scene .sky-glow,#sky-scene .float-pixel{display:none!important}
.site-shell{position:relative;z-index:1;isolation:isolate}
/* Avoid large costly backdrop blurs and constant animation. */
.navbar,.topnav,.glass-card,.info-panel,.rules-lead,.success-panel{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
}
.navbar,body.application-page .topnav,body.rules-page .topnav,body.success-page .topnav{background:rgba(255,255,255,.92)!important}
.glass-card{background:rgba(255,255,255,.94)!important}
.warden-hero-art{animation:none!important;will-change:auto!important}
.warden-stage{will-change:transform}
@media(max-width:760px){
 #sky-scene .cave-parallax{inset:0;background-position:center center;will-change:auto;transform:none!important}
}
@media(prefers-reduced-motion:reduce){.warden-stage,.cave-parallax{transform:none!important;will-change:auto!important}}

/* Exact Warden/Legend Craft concept image — pointer accessible hotspots. */
.visual-landing{display:none}
@media (min-width:1025px){
 body.image-reference-home #sky-scene{display:none!important}
 body.image-reference-home .site-shell>header.navbar,
 body.image-reference-home .hero-section,
 body.image-reference-home #features{display:none!important}
 body.image-reference-home .visual-landing{display:block;width:100%;position:relative;overflow:hidden;background:#b8d5eb}
 body.image-reference-home .visual-stage{position:relative;direction:ltr;width:100%;transform:translate3d(0,0,0) scale(1.008);transform-origin:center center;will-change:transform}
 body.image-reference-home .visual-stage>img{display:block;width:100%;height:auto;user-select:none;pointer-events:none}
 body.image-reference-home .visual-hit{position:absolute;display:block;z-index:5;border-radius:14px;outline-offset:-2px;transition:box-shadow .17s,background .17s;}
 body.image-reference-home .visual-hit:hover{background:rgba(255,255,255,.09);box-shadow:inset 0 0 0 2px rgba(255,255,255,.75),0 0 19px rgba(0,172,255,.35)}
 body.image-reference-home .visual-hit:focus-visible{outline:3px solid #004cbb;background:rgba(255,255,255,.17)}
 body.image-reference-home .hs-home{left:76.3%;top:2.7%;width:11%;height:5.5%}
 body.image-reference-home .hs-rules-top{left:68.1%;top:2.7%;width:8.4%;height:5.5%}
 body.image-reference-home .hs-apply-top{left:53.3%;top:2.7%;width:12.1%;height:5.5%}
 body.image-reference-home .hs-about{left:43%;top:2.7%;width:10.4%;height:5.5%}
 body.image-reference-home .hs-discord{left:14.1%;top:2.7%;width:11%;height:5.5%}
 body.image-reference-home .hs-rules-cta{left:30%;top:68.9%;width:20%;height:6.6%;border-radius:60px}
 body.image-reference-home .hs-apply-cta{left:50.7%;top:68.9%;width:20%;height:6.6%;border-radius:60px}
 body.image-reference-home .action-section{margin-top:38px}
 body.image-reference-home .site-shell{background:linear-gradient(#eaf6ff,#f5faff)}
}
@media (prefers-reduced-motion:reduce){.visual-stage{transform:none!important;will-change:auto!important}}

/* Compact desktop home: visually reduce the large reference illustration,
   preserving image aspect ratio and all percentage-based interactive hotspots. */
@media (min-width: 1025px) {
  body.image-reference-home .visual-landing {
    width: min(91vw, 1510px, 170svh);
    max-width: 100%;
    margin: 12px auto 28px;
    border-radius: 20px;
    box-shadow: 0 12px 42px rgba(8, 58, 112, .10);
  }
  body.image-reference-home .site-shell {
    background: linear-gradient(150deg, #d9eeff 0%, #eff7ff 55%, #f8fcff 100%);
  }
}

/* 2026-11-07: Responsive size correction for the exact selected artwork.
   Keep its 1672:941 aspect ratio and percentage-positioned clickable hotspots.
   Limit both width AND height so the header/logo/buttons fit on laptop screens.
   No cropping, stretching or duplicate overlays. */
@media (min-width: 1025px) {
  body.image-reference-home .visual-landing {
    width: min(94vw, 1540px, 146svh);
    max-width: 100%;
    margin: 16px auto 28px;
    border-radius: 18px;
    overflow: hidden;
  }
  body.image-reference-home .visual-stage {
    width: 100%;
    transform: none!important;
    transform-origin: center center;
    will-change: auto;
  }
  body.image-reference-home .visual-stage>img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1672 / 941;
    object-fit: contain;
  }
}


/* 2026-11-07: center the IP/Discord panels under the artwork on desktop,
   and re-enable smooth mouse motion for the selected exact artwork. */
@media (min-width: 1025px) {
  body.image-reference-home .visual-stage {
    transform: translate3d(0,0,0) scale(1.004) !important;
    transform-origin: center center;
    will-change: transform;
  }
  body.image-reference-home .action-section {
    width: min(92vw, 1120px);
    margin: 38px auto 0;
    grid-template-columns: repeat(2, minmax(320px, 460px));
    justify-content: center;
    align-items: stretch;
  }
  body.image-reference-home .info-panel {
    max-width: 460px;
    margin: 0 auto;
    text-align: center;
  }
  body.image-reference-home .ip-tools {
    justify-content: center;
  }
  body.image-reference-home .ip-tools .btn {
    flex: 0 1 auto;
    min-width: 180px;
  }
}
@media (min-width: 1025px) and (max-width: 1280px) {
  body.image-reference-home .action-section {
    width: min(94vw, 980px);
    grid-template-columns: repeat(2, minmax(280px, 420px));
  }
}


/* LEGEND CRAFT / قائمة الإدارة - 17 عضو */
.team-directory {
  max-width: 1180px;
  margin: 54px auto 42px;
}
.team-heading {margin-bottom: 26px;}
.team-heading h2 {display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap}
.team-count{
  display:inline-flex;align-items:center;justify-content:center;
  padding:4px 14px;border-radius:999px;background:#e2f2ff;
  color:#0873c7;border:1px solid #bcdeff;font-size:14px;font-weight:900;
}
.staff-roster{
  border:1px solid #bedefa;border-radius:25px;overflow:hidden;
  background:rgba(255,255,255,.92);
  box-shadow:0 17px 45px rgba(12,73,142,.09);
}
.staff-roster-header,.staff-entry{
  display:grid;grid-template-columns:58px minmax(0,1fr) minmax(175px,240px);
  align-items:center;gap:20px;
}
.staff-roster-header{
  background:linear-gradient(100deg,#0b58b9,#098fdf);
  color:white;font-size:14px;font-weight:900;padding:16px 24px;
}
.staff-roster-header span:first-child{text-align:center}
.staff-entry{
  padding:12px 24px;min-height:64px;
  border-top:1px solid #e5f0fb;
  transition:background-color .16s ease;
}
.staff-entry:nth-child(even){background:rgba(234,246,255,.52)}
.staff-entry:hover{background:#e6f4ff}
.staff-entry--top{background:linear-gradient(96deg,#eff9ff,#dcefff)!important}
.staff-index{
  font:800 13px/1 Arial,sans-serif;color:#6b9dc6;
  text-align:center;direction:ltr;
}
.staff-name{
  display:flex;align-items:center;gap:13px;
  min-width:0;font-family:Arial,Tahoma,sans-serif;color:#103766;
}
.staff-name strong{font-size:18px;overflow-wrap:anywhere;line-height:1.4}
.staff-clan{
  display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;
  font:900 12px/1 Arial,sans-serif;min-width:38px;height:29px;
  color:#0873d4;background:#dcefff;border:1px solid #add7ff;border-radius:9px
}
.staff-rank{
  justify-self:start;display:inline-flex;align-items:center;justify-content:center;
  min-height:34px;max-width:100%;padding:6px 13px;border-radius:10px;
  font:800 14px/1.35 Arial,Tahoma,sans-serif;white-space:normal;text-align:left;
  border:1px solid #c9e3f6;background:#eaf5fe;color:#17639f;
}
.staff-rank.rank-baron{
  background:linear-gradient(90deg,#0c55b8,#0087df);border-color:#0b81e2;
  color:white;box-shadow:0 4px 14px #007ddd1e;
}
.staff-rank.rank-owner{background:#e1edff;color:#0753aa;border-color:#bcd8ff}
.staff-rank.rank-lead{background:#e9f7fa;color:#096b82;border-color:#c0e8f2}
.staff-rank.rank-admin{background:#eaf3ff;color:#1d56a2;border-color:#c9dffe}
.staff-rank.rank-helper{background:#eef9fb;color:#217484;border-color:#cfedf2}
.staff-rank.rank-unset{background:#f2f5f8;color:#71829a;border-color:#dce5ee}
@media(max-width:760px){
  .team-directory{margin:36px auto}
  .staff-roster-header,.staff-entry{
    grid-template-columns:30px minmax(0,1fr) auto;gap:10px
  }
  .staff-roster-header{padding:13px 12px}
  .staff-entry{padding:12px 10px}
  .staff-name{gap:7px}
  .staff-name strong{font-size:14px}
  .staff-clan{min-width:28px;height:25px;font-size:11px}
  .staff-rank{font-size:12px;padding:6px 8px;min-height:30px;max-width:150px;word-break:normal}
  .staff-index{font-size:11px}
}
@media(max-width:440px){
  .staff-roster-header,.staff-entry{grid-template-columns:24px minmax(0,1fr);gap:8px}
  .staff-roster-header span:last-child{display:none}
  .staff-entry .staff-rank{grid-column:2;justify-self:start;margin-top:-3px;max-width:100%}
}

.staff-clan{min-width:42px}
@media(max-width:760px){.staff-clan{min-width:34px}}

/* LEGEND CRAFT FEATURES / 2026-11-07 */
.section-shortcuts{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;margin:22px auto 10px;max-width:1200px}
.section-shortcuts a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-size:14px;font-weight:900;color:#0d54a5;padding:11px 16px;background:#fff;border:1px solid #c3dffa;border-radius:13px;box-shadow:0 8px 19px #0c63af0d;transition:transform .15s,background .15s}
.section-shortcuts a:hover{background:#e7f5ff;transform:translateY(-2px)}
.upgrades-status,.upgrades-gallery,.upgrades-events{max-width:1180px;margin:36px auto 56px}
.status-card,.section-card{background:rgba(255,255,255,.96);border:1px solid #c5e0f7;box-shadow:0 16px 42px #1267ad14;border-radius:24px;padding:26px}
.status-lead{display:flex;align-items:center;gap:13px;margin-bottom:19px}
.server-live-indicator{height:17px;width:17px;border-radius:50%;background:#95b7cf;border:3px solid white;box-shadow:0 0 0 2px #bdd4e6}
.server-live-indicator.online{background:#1ab17a;box-shadow:0 0 0 2px #a4edd1}
.server-live-indicator.offline{background:#ed7281;box-shadow:0 0 0 2px #f4c0c7}
.status-lead strong{font-size:20px;display:block;color:#0e3a72}
.status-subtle{font-size:12px;color:#6486ab;display:block;margin-top:3px}
.status-stats{display:grid;grid-template-columns:1fr 1fr minmax(160px,1.4fr);gap:12px}
.status-stats>div{background:#eaf6ff;border:1px solid #cbe7ff;padding:13px 16px;border-radius:14px;min-width:0}
.status-stats span{display:block;color:#5980a7;font-size:12px}
.status-stats strong{display:block;color:#0b4f9c;font-size:18px;word-break:break-word}
.status-actions{display:flex;gap:15px;align-items:center;flex-wrap:wrap;margin-top:17px}
.status-actions .btn{font-size:14px;padding:10px 18px;cursor:pointer}
.gallery-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.gallery-tile{padding:0;overflow:hidden;border:1px solid #c7e1f6;border-radius:21px;background:#fff;box-shadow:0 12px 30px #125f9f18;margin:0}
.gallery-tile img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.gallery-caption{padding:14px 16px}
.gallery-caption strong{display:block;color:#0a427f;font-size:16px}
.gallery-caption span{display:block;color:#6c88a7;font-size:12px;margin-top:5px}
.events-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.event-tile{padding:23px;border:1px solid #c8e3fa;border-radius:20px;background:#fff;box-shadow:0 9px 22px #0b6ba80d}
.event-tile h3{margin:0 0 8px;color:#0b438b}
.event-tile p{color:#56799f;margin:0 0 14px}
.event-date{display:inline-flex;gap:8px;align-items:center;background:#e8f4ff;color:#0d64b7;border:1px solid #c6e2ff;border-radius:100px;padding:5px 12px;font-size:12px;font-weight:900}
.event-countdown{display:block;margin-top:14px;font-weight:900;color:#1267b1;font-variant-numeric:tabular-nums}
.empty-copy{border-radius:16px;padding:22px;background:#eff8ff;color:#577aa1;margin:0;text-align:center;font-weight:700}
@media(min-width:1025px){body.image-reference-home .visual-stage{will-change:transform}}
@media(max-width:850px){.gallery-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:660px){.upgrades-status,.upgrades-gallery,.upgrades-events{margin:30px auto 40px}.status-card,.section-card{padding:16px}.status-stats{grid-template-columns:1fr 1fr}.status-stats>div:last-child{grid-column:1 / -1}.gallery-list,.events-list{grid-template-columns:1fr}.section-shortcuts{padding:0 12px}.section-shortcuts a{font-size:12px;padding:9px 12px}}
@media(prefers-reduced-motion:reduce){.section-shortcuts a{transition:none}}

/* Screenshots from the actual server: show the full image, no labels/cropping. */
.gallery-tile img{aspect-ratio:2048/1096;object-fit:contain;}
.gallery-tile{line-height:0;}

/* LEGEND CRAFT 2026 — free visual/interactivity pack.
   Lightweight CSS; animations run on transforms, never continuous expensive blur. */
.page-progress{position:fixed;top:0;left:0;right:0;height:4px;z-index:1200;pointer-events:none;background:transparent}
.page-progress span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#0a61d1,#15bde9);transform:scaleX(0);transform-origin:left center;box-shadow:0 1px 7px #15bde980}
.quick-tools{position:fixed;z-index:500;right:18px;bottom:18px;display:grid;gap:10px;justify-items:end}
.quick-menu-button,.back-to-top{appearance:none;cursor:pointer;border:1px solid #a3d2ff;color:#fff;background:linear-gradient(135deg,#0754bd,#079ad9);box-shadow:0 7px 20px #07549d38;font-weight:900;transition:transform .15s ease,box-shadow .15s ease}
.quick-menu-button{border-radius:999px;padding:12px 18px;font-size:14px}
.quick-menu-button:hover,.back-to-top:hover{transform:translateY(-2px);box-shadow:0 10px 22px #07549d45}
.quick-menu-button:focus-visible,.back-to-top:focus-visible,.gallery-open:focus-visible,.lightbox-arrow:focus-visible,.lightbox-close:focus-visible{outline:3px solid #0aaaff;outline-offset:3px}
.quick-menu{min-width:210px;max-height:min(65vh,480px);overflow:auto;display:grid;gap:2px;padding:11px;background:#fafdff;border:1px solid #c5e1fc;border-radius:18px;box-shadow:0 12px 35px #06386a35}
.quick-menu[hidden]{display:none!important}
.quick-menu a{display:block;color:#093e82;text-decoration:none;border-radius:10px;padding:9px 11px;font-weight:800;font-size:13px}
.quick-menu a:hover,.quick-menu a:focus-visible{background:#e1f2ff}
.back-to-top{position:fixed;z-index:501;bottom:18px;left:18px;border-radius:50%;width:49px;height:49px;display:grid;place-items:center;font-size:26px;line-height:1}
.back-to-top[hidden]{display:none!important}
.action-toast{position:fixed;z-index:800;bottom:77px;left:50%;transform:translate(-50%,10px);padding:10px 18px;max-width:min(90vw,400px);border-radius:13px;background:#073e7e;color:white;box-shadow:0 12px 30px #073e7e40;font-size:14px;font-weight:800;opacity:0;pointer-events:none;transition:opacity .17s ease,transform .17s ease;text-align:center}
.action-toast.is-visible{opacity:1;transform:translate(-50%,0)}
.gallery-open{position:relative;display:block;width:100%;padding:0;border:0;background:transparent;text-align:inherit;cursor:zoom-in;border-radius:inherit;overflow:hidden}
.gallery-open img{display:block;width:100%;transition:transform .23s ease}
.gallery-open:hover img{transform:scale(1.035)}
.gallery-zoom{position:absolute;bottom:12px;left:12px;background:#092e6ccc;color:#fff;padding:3px 10px;border-radius:10px;font-size:24px;font-weight:800}
.gallery-lightbox{position:fixed;inset:0;border:1px solid #4388d4;border-radius:20px;background:#071933f5;color:#fff;box-shadow:0 22px 75px #0009;width:min(95vw,1300px);max-width:95vw;max-height:94vh;padding:12px 16px 16px;overflow:auto}
.gallery-lightbox::backdrop{background:rgba(2,11,32,.84)}
.gallery-lightbox:not([open]){display:none}
.lightbox-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;color:#def3ff;font-weight:900;direction:ltr}
.lightbox-close,.lightbox-arrow{border:1px solid #8bc6f080;color:white;background:#173a66;cursor:pointer;border-radius:12px}
.lightbox-close{font-size:28px;line-height:1;width:43px;height:43px}
.lightbox-main{display:flex;justify-content:center;align-items:center;gap:12px;direction:ltr}
.lightbox-main img{min-width:0;max-width:min(80vw,1050px);max-height:72vh;width:auto;height:auto;object-fit:contain;border-radius:12px}
.lightbox-arrow{width:45px;height:56px;flex-shrink:0;font-size:23px}
.lightbox-hint{text-align:center;color:#c7dff6;font-size:12px;margin:10px 0 0}
.faq-section{margin:54px auto 12px}
.faq-list{max-width:930px;margin:0 auto;display:grid;gap:12px}
.faq-item{border:1px solid #c5e2f8;border-radius:16px;background:#fffffff0;box-shadow:0 5px 17px #106fac10;overflow:hidden}
.faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:15px;cursor:pointer;list-style:none;padding:16px 20px;font-weight:900;color:#093f81}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary span{font-size:22px;color:#168be1;transition:transform .15s ease}
.faq-item[open] summary{background:#eaf6ff}
.faq-item[open] summary span{transform:rotate(45deg)}
.faq-item .faq-answer{padding:15px 20px 19px;color:#315979;font-size:14px;line-height:1.9}
.faq-answer a{color:#0065cb;font-weight:900}
.reveal-ready{opacity:0;transform:translateY(15px);transition:opacity .4s ease,transform .4s ease}
.reveal-ready.reveal-visible{opacity:1;transform:translateY(0)}
@media(max-width:650px){.quick-tools{right:10px;bottom:12px}.back-to-top{left:10px;bottom:12px}.quick-menu-button{padding:11px 13px;font-size:13px}.lightbox-main{gap:4px}.lightbox-arrow{width:32px;height:47px;font-size:16px}.lightbox-main img{max-width:75vw;max-height:70vh}.gallery-lightbox{padding:9px}.lightbox-hint{font-size:11px}}
@media(prefers-reduced-motion:reduce){.reveal-ready{opacity:1;transform:none;transition:none}.gallery-open img,.quick-menu-button,.back-to-top,.action-toast,.faq-item summary span{transition:none!important}}


/* LEGEND CRAFT — server rank selector. No external libraries or paid services. */
.upgrades-ranks{max-width:1200px;margin:42px auto 62px}
.upgrades-ranks .section-heading{max-width:880px}
.ranks-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:20px;align-items:start}
.rank-card{--accent:#09b8c9;--accent-2:#1680c4;--soft:#ecfcff;
  position:relative;min-width:0;padding:22px;border:1px solid #c8e2f8;border-radius:24px;
  background:linear-gradient(152deg,var(--soft) -26%,#fff 38%,#f7fbff 100%);
  box-shadow:0 11px 31px #0f6baf12;overflow:hidden;
  transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.rank-card::before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,var(--accent),var(--accent-2));}
.rank-card:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 18px 36px #0f6baf20}
.rank-vyse{--accent:#00bfc9;--accent-2:#1f80c5;--soft:#e8fcff}
.rank-slava{--accent:#c12ac9;--accent-2:#7a5edb;--soft:#f9edff}
.rank-shadow{--accent:#717d99;--accent-2:#3b6c9e;--soft:#eff3f9}
.rank-venom{--accent:#13b94c;--accent-2:#059d87;--soft:#eafcf2}
.rank-dragon{--accent:#ffb000;--accent-2:#e77b00;--soft:#fff7e6}
.rank-card-head{position:relative;text-align:center;display:grid;justify-items:center;gap:5px;padding:6px 0 18px}
.rank-serial{position:absolute;top:0;right:0;direction:ltr;color:#879fb9;font:800 11px/1.4 Arial,sans-serif;letter-spacing:1px}
.rank-glyph{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;
  background:var(--soft);color:var(--accent-2);font-size:31px;line-height:1;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 25%,transparent)}
.rank-name{font:900 clamp(25px,3vw,31px)/1.2 Arial,Tahoma,sans-serif;color:var(--accent-2);margin:8px 0 0;letter-spacing:.45px}
.rank-price{font:900 29px/1.25 Arial,sans-serif;letter-spacing:-.65px;margin:5px 0 0;color:#123f75}
.rank-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 18px;direction:ltr}
.rank-metrics>div{min-width:0;text-align:center;padding:11px 7px;background:#fff;border:1px solid #dfedf8;border-radius:13px}
.rank-metrics dt{font:700 12px/1.35 Arial,sans-serif;color:#6d89a2;margin-bottom:4px}
.rank-metrics dd{font:900 21px/1.25 Arial,sans-serif;color:#0b4b89;margin:0}
.rank-metrics small{font-size:11px;font-weight:700;color:#6890b1}
.rank-more{background:#f5faff;border:1px solid #d8eafb;border-radius:14px;overflow:hidden}
.rank-more>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;
  gap:10px;padding:13px 15px;color:#0b5ba4;font-size:14px;font-weight:900;user-select:none}
.rank-more>summary::-webkit-details-marker{display:none}
.rank-more>summary:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.rank-more[open]>summary{background:#e6f4ff}
.rank-chevron{color:var(--accent-2);transition:transform .18s ease;font-size:19px}
.rank-more[open] .rank-chevron{transform:rotate(180deg)}
.rank-more-body{padding:12px 15px 17px;display:grid;gap:15px}
.rank-perks-block h4{margin:0 0 7px;font-size:14px;color:#0b4d93}
.rank-perks-block ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.rank-perks-block li{padding:7px 10px;color:#375d7d;background:white;border:1px solid #e2eef9;border-radius:9px;
 font:700 12px/1.4 Arial,Tahoma,sans-serif;text-align:left;overflow-wrap:anywhere}
.ranks-note{margin:20px auto 0;padding:12px 16px;max-width:890px;border:1px solid #c8e1fa;border-radius:14px;
  background:#f5fbff;color:#5b7fa5;text-align:center;font-size:13px}
@media(max-width:760px){.upgrades-ranks{margin:30px auto 45px}.ranks-grid{gap:15px}.rank-card{padding:17px}.rank-metrics dd{font-size:19px}}
@media(prefers-reduced-motion:reduce){.rank-card,.rank-chevron{transition:none!important}.rank-card:hover{transform:none}}


/* تحسين كتابة بطاقات الرتب بالعربي مع الحفاظ على تصميمها */
.upgrades-ranks{max-width:1200px;padding-inline:20px}
.ranks-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;align-items:stretch}
.ranks-grid .rank-card{grid-column:span 2;display:flex;flex-direction:column;gap:0;padding:22px;overflow:hidden}
.ranks-grid .rank-card:nth-child(4){grid-column:2/span 2}
.ranks-grid .rank-card:nth-child(5){grid-column:4/span 2}
.rank-card-head{padding:8px 8px 16px}
.rank-price-label{color:#547399;font-size:12px;font-weight:800;line-height:1.4;margin-top:4px}
.rank-card .rank-price{margin-top:0;font-size:clamp(24px,2.3vw,29px);white-space:nowrap}
.rank-card .rank-metrics{direction:rtl;gap:10px;margin:0 0 18px;grid-template-columns:repeat(2,minmax(0,1fr))}
.rank-card .rank-metrics>div{min-height:79px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-width:0;padding:10px 6px}
.rank-card .rank-metrics dt{font:800 13px/1.45 Tahoma,Arial,sans-serif;color:#52779d;text-align:center}
.rank-card .rank-metrics dd{font:900 21px/1.3 Arial,Tahoma,sans-serif;text-align:center;white-space:normal}
.rank-card .rank-metrics dd small{display:inline-block;font:700 12px/1.5 Tahoma,Arial,sans-serif;color:#597eaa}
.rank-card .rank-more{margin-top:auto}
.rank-card .rank-more>summary{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px;line-height:1.6;text-align:right}
.rank-card .rank-more-body{direction:rtl}
.rank-card .rank-perks-block h4{font-size:15px;text-align:right}
.rank-card .rank-perks-block li{display:flex;align-items:center;justify-content:space-between;gap:10px;direction:rtl;text-align:right;font:750 13px/1.8 Tahoma,Arial,sans-serif;padding:10px 12px;flex-wrap:wrap}
.rank-command{direction:ltr;unicode-bidi:isolate;display:inline-block;border:1px solid #c9e0f5;border-radius:6px;background:#eff8ff;color:#055dbe;padding:2px 7px;font:800 13px/1.55 Consolas,'Courier New',monospace;white-space:nowrap}
.rank-alias{font-size:12px;color:#6383a2}
@media(max-width:1050px){
  .ranks-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .ranks-grid .rank-card,.ranks-grid .rank-card:nth-child(4),.ranks-grid .rank-card:nth-child(5){grid-column:auto}
  .ranks-grid .rank-card:last-child:nth-child(odd){grid-column:1/-1;max-width:520px;width:100%;justify-self:center}
}
@media(max-width:650px){
  .upgrades-ranks{padding-inline:14px}
  .ranks-grid{grid-template-columns:minmax(0,1fr)}
  .ranks-grid .rank-card,.ranks-grid .rank-card:nth-child(4),.ranks-grid .rank-card:nth-child(5),.ranks-grid .rank-card:last-child:nth-child(odd){grid-column:auto;width:100%;max-width:100%}
  .rank-card .rank-metrics dt{font-size:13px}
  .rank-card .rank-metrics dd{font-size:19px}
}


/* Dedicated administration roster page, keeping the homepage compact. */
.staff-invite{margin:58px auto 38px;max-width:1120px;}
.staff-invite-content{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:18px;
  padding:24px 30px;border:1px solid #b9dcfb;border-radius:26px;
  background:linear-gradient(115deg,rgba(255,255,255,.98),rgba(222,241,255,.96));
  box-shadow:0 18px 43px rgba(22,93,159,.09);
}
.staff-invite-icon{width:66px;height:66px;display:grid;place-items:center;border-radius:18px;
  background:#dcefff;color:#0b70c5;font-size:36px;}
.staff-invite-copy{flex:1;min-width:210px}
.staff-invite-copy .eyebrow{font-size:12px;font-weight:900;color:#1481ca;letter-spacing:1.4px}
.staff-invite-copy h2{margin:3px 0 0;font-size:clamp(22px,2.7vw,29px);color:#0c3264}
.staff-invite-copy p{margin:4px 0 0;color:#547ba0;font-size:14px}
.staff-invite-link{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;
  background:linear-gradient(110deg,#0860c5,#079de3);color:#fff;font-weight:900;padding:13px 24px;
  border-radius:14px;box-shadow:0 8px 20px #0b7fd72a;transition:transform .15s ease}
.staff-invite-link:hover{transform:translateY(-2px)}
.staff-invite-link:focus-visible{outline:3px solid #0b6fc4;outline-offset:3px}
.staff-page{background:linear-gradient(145deg,#edf8ff,#f8fcff 58%,#e1f1ff)!important;}
.staff-page main{max-width:1160px;margin:0 auto;padding-bottom:36px;}
.staff-page-nav{position:relative;z-index:5;}
.staff-page-nav .navlinks .active{background:#e0f2ff;color:#075bb4}
.staff-page-tools{display:flex;justify-content:space-between;align-items:end;gap:20px;
  margin:32px auto -22px;flex-wrap:wrap;}
.staff-back-link{color:#075fac;text-decoration:none;font-weight:800;padding:10px}
.staff-back-link:hover{text-decoration:underline}
.staff-search{margin-right:auto;display:flex;flex-direction:column;gap:6px;width:min(100%,380px);}
.staff-search label{font-size:13px;color:#376b99;font-weight:800;}
.staff-search input{width:100%;border:1px solid #a9d1f2;background:#fff;
  color:#123b6a;border-radius:13px;padding:11px 15px;outline-offset:3px;}
.staff-search input:focus{outline:2px solid #148ada;}
.staff-search small{color:#587ea3;font-size:12px;}
.staff-page .team-directory{margin-top:40px;}
.staff-page .staff-entry[hidden], .staff-search-empty[hidden]{display:none!important;}
.staff-search-empty{text-align:center;font-size:15px;font-weight:700;color:#316c9b;padding:26px;}
.staff-return{text-align:center;margin:22px 0}
.staff-return a{display:inline-block;text-decoration:none;color:#0b60ba;background:#e8f5ff;
 border:1px solid #bddef7;border-radius:13px;padding:11px 18px;font-weight:800}
@media(max-width:760px){
 .staff-invite{margin-top:32px;}
 .staff-invite-content{padding:20px;justify-content:center;text-align:center}
 .staff-invite-icon{margin:0 auto}
 .staff-invite-copy{flex-basis:100%}
 .staff-invite-link{width:100%}
 .staff-page-tools{margin:26px auto 0;align-items:stretch}
 .staff-search{width:100%}
 .staff-page .team-directory{margin-top:24px}
}
@media(prefers-reduced-motion:reduce){.staff-invite-link{transition:none}}
