/* Extra layer for abrak.org: milky-way sky, contact UI, small utilities. */

.milkyway-canvas{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:0;
  opacity:.95;
}

.noise,.aurora{
  z-index:1;
}

/* Keep stars visible, but preserve the existing aurora mood. */
.aurora{opacity:.75}
.noise{opacity:.14}

.contact-link{
  color:var(--fg);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}
.contact-link:hover{opacity:.9}

.contact-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.contact-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--border);
  border-radius:999px;
  padding:10px 14px;
  font-size:12px;
  color:var(--fg);
  background:rgba(255,255,255,.06);
  transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.contact-pill:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.09);
  border-color:rgba(110,231,255,.45);
}

.contact-form label{
  display:block;
  font-size:12px;
  color:var(--soft);
}
.contact-form .field{margin-top:12px}

.contact-input,.contact-textarea,.contact-select{
  width:100%;
  margin-top:8px;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid var(--border);
  background:rgba(16,20,32,.6);
  color:var(--fg);
}
.theme-light .contact-input,.theme-light .contact-textarea,.theme-light .contact-select{
  background:rgba(255,255,255,.7);
}

.contact-input:focus,.contact-textarea:focus,.contact-select:focus{
  outline:none;
  border-color:rgba(110,231,255,.55);
  box-shadow:0 0 0 4px rgba(110,231,255,.12);
}

.contact-textarea{
  min-height:140px;
  resize:vertical;
}

.toast{
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  z-index:50;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(16,20,32,.82);
  border:1px solid rgba(255,255,255,.14);
  color:var(--fg);
  font-size:12px;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
}
.toast.is-on{
  opacity:1;
  transform:translateX(-50%) translateY(-2px);
}


/* Hub smart mega menu (login/logout + modules). */

/* Backdrop-filter on glass sections creates stacking contexts; keep header/menu above content. */
body > div.relative.z-10 > header{position:relative;z-index:80}

.hub-menu{position:relative;display:inline-block}
.hub-menu[open]{z-index:9999}
.hub-menu__summary{
  list-style:none;
  cursor:pointer;
  user-select:none;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  color:var(--soft);
  transition:transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
}
.hub-menu__summary:hover{transform:translateY(-1px);background:rgba(255,255,255,.07);border-color:rgba(110,231,255,.35);color:var(--fg)}
.hub-menu[open] .hub-menu__summary{background:rgba(255,255,255,.09);border-color:rgba(110,231,255,.55);color:var(--fg)}
.hub-menu__summary::-webkit-details-marker{display:none}
.hub-menu__summary::marker{content:""}
.hub-menu__caret{
  width:8px;
  height:8px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
  opacity:.65;
  margin-top:-2px;
}
.hub-menu[open] .hub-menu__caret{transform:rotate(-135deg);margin-top:2px;opacity:.9}

.hub-menu__panel{
  position:absolute;
  z-index:9999;
  right:0;
  top:calc(100% + 12px);
  width:min(820px, 92vw);
  max-height:min(640px, calc(100vh - 140px));
  overflow:auto;
  transform-origin:top right;
  opacity:0;
  transform:translateY(-6px) scale(.985);
  pointer-events:none;
  transition:opacity .15s ease, transform .15s ease;
}
.hub-menu[open] .hub-menu__panel{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}

.hub-menu__kicker{
  font-size:11px;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--soft);
}
.hub-menu__lead{margin-top:8px;color:var(--fg-muted);font-size:13px;line-height:1.5}

.hub-user__head{display:flex;align-items:center;gap:12px}
.hub-avatar{
  width:40px;
  height:40px;
  border-radius:14px;
  border:1px solid var(--border);
  background:radial-gradient(30px 30px at 30% 30%, rgba(110,231,255,.22), transparent 60%),
             radial-gradient(36px 36px at 80% 10%, rgba(155,123,255,.18), transparent 70%),
             rgba(16,20,32,.55);
  color:var(--fg);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
}
.hub-user__name{font-weight:600;color:var(--fg)}
.hub-user__sub{font-size:12px;color:var(--soft);margin-top:2px}

.hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
@media(min-width:860px){.hub-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

.hub-card{
  display:block;
  min-height:96px;
  border:1px solid var(--border);
  border-radius:18px;
  padding:14px 14px 12px;
  background:rgba(16,20,32,.55);
  transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.hub-card:hover{transform:translateY(-1px);background:rgba(16,20,32,.68);border-color:rgba(110,231,255,.45)}
.hub-card__title{display:block;font-weight:600;color:var(--fg)}
.hub-card__desc{display:block;margin-top:6px;font-size:12px;line-height:1.35;color:var(--soft)}
.hub-card--danger:hover{border-color:rgba(244,178,107,.55)}

@media(max-width:640px){
  .hub-menu{position:static}
  .hub-menu__panel{left:12px;right:12px;width:auto}
}

@media(prefers-reduced-motion:reduce){
  .hub-menu__summary,.hub-card{transition:none}
  .hub-menu__panel{transition:none;transform:none}
}

/* Font unification for performance: use Vazirmatn across UI to reduce font requests. */
:root{--font-sans:Vazirmatn,ui-sans-serif,system-ui,sans-serif}
body{font-family:Vazirmatn,ui-sans-serif,system-ui,sans-serif}
.font-display{font-family:Vazirmatn,ui-sans-serif,system-ui,sans-serif;letter-spacing:0}


/* --- Patch: theme/light + contrast + performance guards (release-managed) --- */

/* Light theme: keep the galaxy, but make it subtle to avoid washing out UI. */
.theme-light .milkyway-canvas{display:block;opacity:.78}

/* Light theme: keep a starfield even before JS paints the canvas. */
.theme-light .bg-night{
  background:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27320%27%20height%3D%27320%27%20viewBox%3D%270%200%20320%20320%27%3E%3Cg%20fill%3D%27%2338bdf8%27%20opacity%3D%270.55%27%3E%3Ccircle%20cx%3D%2716%27%20cy%3D%2728%27%20r%3D%271%27%2F%3E%3Ccircle%20cx%3D%2772%27%20cy%3D%2758%27%20r%3D%270.9%27%2F%3E%3Ccircle%20cx%3D%27128%27%20cy%3D%2730%27%20r%3D%271.1%27%2F%3E%3Ccircle%20cx%3D%27180%27%20cy%3D%2766%27%20r%3D%270.8%27%2F%3E%3Ccircle%20cx%3D%27260%27%20cy%3D%2740%27%20r%3D%271.2%27%2F%3E%3Ccircle%20cx%3D%2736%27%20cy%3D%27120%27%20r%3D%270.8%27%2F%3E%3Ccircle%20cx%3D%2798%27%20cy%3D%27110%27%20r%3D%271%27%2F%3E%3Ccircle%20cx%3D%27154%27%20cy%3D%27142%27%20r%3D%270.9%27%2F%3E%3Ccircle%20cx%3D%27218%27%20cy%3D%27118%27%20r%3D%271.1%27%2F%3E%3Ccircle%20cx%3D%27288%27%20cy%3D%27134%27%20r%3D%270.8%27%2F%3E%3Ccircle%20cx%3D%2754%27%20cy%3D%27206%27%20r%3D%271.1%27%2F%3E%3Ccircle%20cx%3D%27122%27%20cy%3D%27230%27%20r%3D%270.8%27%2F%3E%3Ccircle%20cx%3D%27192%27%20cy%3D%27212%27%20r%3D%271%27%2F%3E%3Ccircle%20cx%3D%27264%27%20cy%3D%27238%27%20r%3D%270.9%27%2F%3E%3Ccircle%20cx%3D%2728%27%20cy%3D%27284%27%20r%3D%270.9%27%2F%3E%3Ccircle%20cx%3D%27102%27%20cy%3D%27296%27%20r%3D%271.2%27%2F%3E%3Ccircle%20cx%3D%27230%27%20cy%3D%27286%27%20r%3D%270.9%27%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%27%23ffffff%27%20opacity%3D%270.35%27%3E%3Ccircle%20cx%3D%2748%27%20cy%3D%2744%27%20r%3D%270.7%27%2F%3E%3Ccircle%20cx%3D%27206%27%20cy%3D%2754%27%20r%3D%270.7%27%2F%3E%3Ccircle%20cx%3D%2792%27%20cy%3D%27162%27%20r%3D%270.6%27%2F%3E%3Ccircle%20cx%3D%27244%27%20cy%3D%27172%27%20r%3D%270.7%27%2F%3E%3Ccircle%20cx%3D%27168%27%20cy%3D%27276%27%20r%3D%270.6%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    radial-gradient(900px 520px at 12% -10%, #2563eb1f, transparent 55%),
    radial-gradient(700px 420px at 85% 0, #38bdf81a, transparent 55%),
    linear-gradient(#f9f7f2,#f3efe7);
  background-size:320px 320px,auto,auto,auto;
  background-position:0 0,center,center,center;
}

/* Globe card: add a Milky Way layer inside the globe box (cheap CSS, no animation). */
.globe-galaxy{
  position:absolute;
  inset:-45%;
  pointer-events:none;
  opacity:1;
  transform:rotate(-18deg);
  mix-blend-mode:screen;
  background:
    radial-gradient(closest-side at 50% 54%, rgba(255,255,255,.12), rgba(255,255,255,0) 66%),
    radial-gradient(closest-side at 48% 54%, rgba(110,231,255,.18), rgba(110,231,255,0) 64%),
    radial-gradient(closest-side at 62% 52%, rgba(155,123,255,.14), rgba(155,123,255,0) 72%),
    linear-gradient(90deg, rgba(0,0,0,0), rgba(110,231,255,.14), rgba(155,123,255,.16), rgba(244,178,107,.10), rgba(0,0,0,0)),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27240%27%20height%3D%27240%27%20viewBox%3D%270%200%20240%20240%27%3E%0A%3Crect%20width%3D%27240%27%20height%3D%27240%27%20fill%3D%27none%27%2F%3E%0A%3Cg%20fill%3D%27%236ee7ff%27%20opacity%3D%270.55%27%3E%0A%20%20%3Ccircle%20cx%3D%2718%27%20cy%3D%2732%27%20r%3D%271.1%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2754%27%20cy%3D%2718%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2796%27%20cy%3D%2740%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27132%27%20cy%3D%2722%27%20r%3D%270.8%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27170%27%20cy%3D%2744%27%20r%3D%271.2%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27210%27%20cy%3D%2728%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2730%27%20cy%3D%2786%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2778%27%20cy%3D%2792%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27118%27%20cy%3D%2774%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27160%27%20cy%3D%2798%27%20r%3D%271.1%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27204%27%20cy%3D%2784%27%20r%3D%270.8%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2744%27%20cy%3D%27142%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2792%27%20cy%3D%27156%27%20r%3D%270.8%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27136%27%20cy%3D%27132%27%20r%3D%271.1%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27182%27%20cy%3D%27150%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27220%27%20cy%3D%27138%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2724%27%20cy%3D%27206%27%20r%3D%270.8%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2762%27%20cy%3D%27196%27%20r%3D%271.1%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27110%27%20cy%3D%27210%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27154%27%20cy%3D%27192%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27198%27%20cy%3D%27214%27%20r%3D%270.8%27%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20fill%3D%27%23ffffff%27%20opacity%3D%270.35%27%3E%0A%20%20%3Ccircle%20cx%3D%2726%27%20cy%3D%2756%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27146%27%20cy%3D%2762%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27188%27%20cy%3D%2768%27%20r%3D%270.6%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2764%27%20cy%3D%27116%27%20r%3D%270.6%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27172%27%20cy%3D%27120%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27120%27%20cy%3D%27168%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27206%27%20cy%3D%27176%27%20r%3D%270.6%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2740%27%20cy%3D%27224%27%20r%3D%270.6%27%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E");
  background-size:auto,auto,auto,200% 100%,240px 240px;
  background-position:center,center,center,50% 50%,0 0;
}
.theme-light .globe-galaxy{
  opacity:.68;
  mix-blend-mode:multiply;
  background:
    radial-gradient(closest-side at 50% 54%, rgba(37,99,235,.14), rgba(37,99,235,0) 66%),
    radial-gradient(closest-side at 48% 54%, rgba(56,189,248,.14), rgba(56,189,248,0) 66%),
    linear-gradient(90deg, rgba(0,0,0,0), rgba(37,99,235,.12), rgba(56,189,248,.14), rgba(242,177,92,.08), rgba(0,0,0,0)),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27240%27%20height%3D%27240%27%20viewBox%3D%270%200%20240%20240%27%3E%0A%3Crect%20width%3D%27240%27%20height%3D%27240%27%20fill%3D%27none%27%2F%3E%0A%3Cg%20fill%3D%27%236ee7ff%27%20opacity%3D%270.55%27%3E%0A%20%20%3Ccircle%20cx%3D%2718%27%20cy%3D%2732%27%20r%3D%271.1%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2754%27%20cy%3D%2718%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2796%27%20cy%3D%2740%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27132%27%20cy%3D%2722%27%20r%3D%270.8%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27170%27%20cy%3D%2744%27%20r%3D%271.2%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27210%27%20cy%3D%2728%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2730%27%20cy%3D%2786%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2778%27%20cy%3D%2792%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27118%27%20cy%3D%2774%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27160%27%20cy%3D%2798%27%20r%3D%271.1%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27204%27%20cy%3D%2784%27%20r%3D%270.8%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2744%27%20cy%3D%27142%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2792%27%20cy%3D%27156%27%20r%3D%270.8%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27136%27%20cy%3D%27132%27%20r%3D%271.1%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27182%27%20cy%3D%27150%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27220%27%20cy%3D%27138%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2724%27%20cy%3D%27206%27%20r%3D%270.8%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2762%27%20cy%3D%27196%27%20r%3D%271.1%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27110%27%20cy%3D%27210%27%20r%3D%270.9%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27154%27%20cy%3D%27192%27%20r%3D%271.0%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27198%27%20cy%3D%27214%27%20r%3D%270.8%27%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20fill%3D%27%23ffffff%27%20opacity%3D%270.35%27%3E%0A%20%20%3Ccircle%20cx%3D%2726%27%20cy%3D%2756%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27146%27%20cy%3D%2762%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27188%27%20cy%3D%2768%27%20r%3D%270.6%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2764%27%20cy%3D%27116%27%20r%3D%270.6%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27172%27%20cy%3D%27120%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27120%27%20cy%3D%27168%27%20r%3D%270.7%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%27206%27%20cy%3D%27176%27%20r%3D%270.6%27%2F%3E%0A%20%20%3Ccircle%20cx%3D%2740%27%20cy%3D%27224%27%20r%3D%270.6%27%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E");
  background-size:auto,auto,200% 100%,240px 240px;
  background-position:center,center,50% 50%,0 0;
}

/* Ensure active language pill and CTA pill have contrast even without color-mix support. */
.lang-switch button.is-active{background:rgba(244,246,251,.14);color:var(--fg)}
.cta-pill{background:rgba(244,246,251,.08);color:var(--fg)}