/*
 * ARIFE Design System v300
 * Phase 01 — premium cinematic surfaces, dimensional controls and unified nav.
 * Loaded last by arife-site.js so legacy feature behavior can remain untouched.
 */

:root{
  --arife-bg:#07090d;
  --arife-bg-raised:#0d1118;
  --arife-surface:#161b24;
  --arife-surface-deep:#0c1016;
  --arife-surface-soft:#202735;
  --arife-edge:#394456;
  --arife-edge-soft:#252d3a;
  --arife-text:#f5f7fb;
  --arife-muted:#909aaa;
  --arife-accent:#91baff;
  --arife-accent-bright:#c9ddff;
  --arife-accent-deep:#5366bd;
  --arife-violet:#8c7cf2;
  --arife-cyan:#79d7f2;
  --arife-danger:#ff8f9e;
  --arife-radius-sm:11px;
  --arife-radius-md:16px;
  --arife-radius-lg:22px;
  --arife-shadow-deep:#04060a;
  --arife-shadow-card:
    inset 0 1px rgba(255,255,255,.09),
    inset 0 -1px rgba(0,0,0,.42),
    0 5px 0 var(--arife-shadow-deep),
    0 18px 42px rgba(0,0,0,.34);

  /* Legacy tokens now resolve to the premium blue family. */
  --bg:var(--arife-bg);
  --panel:var(--arife-surface);
  --panel2:var(--arife-surface-soft);
  --line:var(--arife-edge-soft);
  --text:var(--arife-text);
  --muted:var(--arife-muted);
  --lime:var(--arife-accent);
  --studio-lime:var(--arife-accent);
  --film-lime:var(--arife-accent);
  --violet:var(--arife-violet);
  --blue:var(--arife-cyan);
}

html{
  color-scheme:dark;
  accent-color:var(--arife-accent);
  scrollbar-color:#4e5f79 #090c12;
}

body{
  background:
    radial-gradient(circle at 13% -8%,rgba(111,145,224,.11),transparent 30%),
    radial-gradient(circle at 96% 18%,rgba(126,101,224,.08),transparent 28%),
    linear-gradient(180deg,#080b10 0%,var(--arife-bg) 36%,#080a0f 100%)!important;
  color:var(--arife-text);
}

::selection{background:rgba(145,186,255,.3);color:#fff}

:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid var(--arife-accent-bright)!important;
  outline-offset:3px!important;
}

/* --------------------------------------------------------------------------
   Unified cinematic navigation
   -------------------------------------------------------------------------- */

html body .site-nav{
  --arife-nav-height:68px;
  position:sticky!important;
  top:0!important;
  right:0!important;
  left:0!important;
  z-index:1000!important;
  width:100%!important;
  height:var(--arife-nav-height)!important;
  min-height:var(--arife-nav-height)!important;
  max-height:var(--arife-nav-height)!important;
  grid-template-columns:150px minmax(0,1fr) 320px!important;
  gap:18px!important;
  padding:0 24px!important;
  border:0!important;
  border-bottom:1px solid #334054!important;
  background:
    radial-gradient(circle at 78% -40%,rgba(137,171,255,.14),transparent 32%),
    linear-gradient(180deg,rgba(24,30,40,.97),rgba(10,13,19,.97))!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.08),
    inset 0 -1px rgba(0,0,0,.65),
    0 5px 0 rgba(3,5,9,.9),
    0 18px 42px rgba(0,0,0,.34)!important;
  backdrop-filter:blur(22px) saturate(120%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(120%)!important;
  overflow:visible!important;
  animation:none!important;
}

html body .landing-page .site-nav{
  position:sticky!important;
  background:
    radial-gradient(circle at 78% -40%,rgba(137,171,255,.15),transparent 32%),
    linear-gradient(180deg,rgba(20,26,36,.95),rgba(8,11,16,.93))!important;
}

html body .site-nav::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:linear-gradient(90deg,transparent 3%,rgba(201,221,255,.42) 36%,rgba(140,124,242,.32) 70%,transparent 97%);
  pointer-events:none;
}

/* 로고를 감싸던 상자(테두리·배경·그림자)를 걷어내고 로고만 남긴다. */
html body .site-nav .brand{
  position:relative!important;
  width:auto!important;
  min-width:0!important;
  height:40px!important;
  padding:0 4px!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
}

html body .site-nav .brand .company-logo,
html body .site-nav .company-logo{
  width:82px!important;
  min-width:82px!important;
  max-width:82px!important;
  height:24px!important;
  min-height:24px!important;
  max-height:24px!important;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.28))!important;
}

html body .site-nav .nav-links{
  align-self:center!important;
  justify-self:center!important;
  width:max-content!important;
  max-width:100%!important;
  height:44px!important;
  gap:3px!important;
  padding:4px!important;
  border:1px solid #2d3747!important;
  border-radius:15px!important;
  background:linear-gradient(180deg,#111722,#090d13)!important;
  box-shadow:inset 0 3px 9px rgba(0,0,0,.42),0 1px rgba(255,255,255,.035)!important;
}

html body .site-nav .nav-links a{
  height:34px!important;
  padding:0 10px!important;
  border:1px solid transparent!important;
  border-radius:10px!important;
  color:#8f9aaa!important;
  font-size:12px!important;
  font-weight:720!important;
  letter-spacing:-.018em!important;
  transition:color .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease,translate .16s ease!important;
}

html body .site-nav .nav-links a:hover{
  border-color:rgba(143,177,232,.18)!important;
  background:rgba(124,157,214,.08)!important;
  color:#e6efff!important;
}

html body .site-nav .nav-links a.active,
html body .site-nav .nav-links a[aria-current="page"]{
  border-color:#5772a6!important;
  background:
    radial-gradient(circle at 72% 0,rgba(255,255,255,.12),transparent 42%),
    linear-gradient(145deg,#344a73,#222f50)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.17),
    inset 0 -3px 7px rgba(7,14,31,.32),
    0 3px 0 #10182a,
    0 8px 14px rgba(25,51,103,.22)!important;
  color:#fff!important;
  text-shadow:0 2px 5px rgba(5,12,28,.55);
}

html body .site-nav .nav-links a::after{
  right:auto!important;
  bottom:4px!important;
  left:50%!important;
  width:3px!important;
  height:3px!important;
  border-radius:50%!important;
  background:var(--arife-accent-bright)!important;
  box-shadow:0 0 8px rgba(145,186,255,.78)!important;
  opacity:0!important;
  transform:translateX(-50%) scale(.5)!important;
}

html body .site-nav .nav-links a.active::after,
html body .site-nav .nav-links a[aria-current="page"]::after{
  opacity:1!important;
  transform:translateX(-50%) scale(1)!important;
}

html body .site-nav .nav-actions{height:46px!important;gap:10px!important}

html body .site-nav.site-nav .nav-actions .nav-pill.primary.primary{
  position:relative!important;
  overflow:hidden!important;
  border:1px solid #9bc5ff!important;
  border-radius:12px!important;
  background:
    radial-gradient(circle at 78% 10%,rgba(255,255,255,.2),transparent 29%),
    linear-gradient(135deg,#477fdf 0%,#5579dd 48%,#7166d5 100%)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.34),
    inset 0 -7px 12px rgba(15,30,83,.28),
    0 5px 0 #263f86,
    0 14px 28px rgba(36,78,170,.27)!important;
  color:#fff!important;
  text-shadow:0 2px 5px rgba(14,30,72,.4)!important;
}

html body .site-nav.site-nav .nav-actions .nav-pill.primary.primary:hover{
  border-color:#c4dcff!important;
  filter:brightness(1.07)!important;
  transform:translateY(-2px)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.42),
    inset 0 -7px 12px rgba(15,30,83,.25),
    0 7px 0 #263f86,
    0 19px 34px rgba(36,78,170,.35)!important;
}

html body .site-nav.site-nav .nav-actions .nav-pill.primary.primary:active{
  filter:brightness(.98)!important;
  transform:translateY(4px)!important;
  box-shadow:
    inset 0 4px 10px rgba(15,27,70,.34),
    inset 0 1px rgba(255,255,255,.18),
    0 1px 0 #263f86,
    0 7px 15px rgba(26,57,126,.24)!important;
}

html body .site-nav .nav-console-icon{
  border-color:rgba(201,221,255,.4)!important;
  background:linear-gradient(145deg,#dce9ff,#8eaff0)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.72),0 3px 0 #405687,0 7px 12px rgba(44,72,136,.24)!important;
}

html body .site-nav .nav-console-icon i{background:#17264b!important}

html body.market-v226 .market-hero h1 em{
  color:#aecaff!important;
  text-shadow:0 0 28px rgba(105,145,226,.22)!important;
}

html body.market-v226 .market-hero-action.primary,
html body.market-v226 .market-role-dock a:last-child,
html body.market-v226 .market-tag.active{
  border-color:#9bc5ff!important;
  background:
    radial-gradient(circle at 78% 10%,rgba(255,255,255,.2),transparent 29%),
    linear-gradient(135deg,#477fdf 0%,#5579dd 48%,#7166d5 100%)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.34),
    inset 0 -6px 11px rgba(15,30,83,.27),
    0 4px 0 #263f86,
    0 12px 24px rgba(36,78,170,.27)!important;
  color:#fff!important;
  text-shadow:0 2px 5px rgba(14,30,72,.38)!important;
}

html #market-preview-modal .market-preview-dialog,
html #contract-modal .contract-dialog{
  border-color:#4b5d78!important;
  background:
    radial-gradient(circle at 88% -5%,rgba(145,186,255,.1),transparent 34%),
    linear-gradient(145deg,rgba(255,255,255,.045),transparent 42%),
    linear-gradient(145deg,#171e29,#080c12 72%)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.1),
    inset 0 -1px rgba(0,0,0,.5),
    0 7px 0 #04060a,
    0 36px 100px rgba(0,0,0,.7)!important;
}

html #market-preview-modal .market-preview-head,
html #contract-modal .contract-top{
  border-color:#344156!important;
  background:
    linear-gradient(90deg,rgba(145,186,255,.035),transparent 52%),
    rgba(8,12,18,.32)!important;
}

html #market-preview-modal .market-preview-head .kicker,
html #contract-modal .contract-top .kicker,
html #market-preview-modal .market-preview-info strong{
  color:#a9c8ff!important;
}

html #market-preview-modal .market-preview-close,
html #contract-modal .contract-close{
  border-color:#536580!important;
  background:
    radial-gradient(circle at 70% 12%,rgba(255,255,255,.13),transparent 34%),
    linear-gradient(145deg,#283345,#111722)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.13),
    inset 0 -3px 7px rgba(3,7,14,.34),
    0 4px 0 #05070b,
    0 11px 21px rgba(0,0,0,.32)!important;
  color:#e7efff!important;
}

html #market-preview-modal .market-preview-close:hover,
html #contract-modal .contract-close:hover{
  border-color:#a8c7ff!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.17),
    0 6px 0 #05070b,
    0 15px 27px rgba(45,77,145,.22)!important;
}

html #market-preview-modal .market-preview-stage{
  border-color:#354762!important;
  background:
    radial-gradient(circle at 50% 46%,rgba(101,137,214,.18),transparent 27%),
    linear-gradient(145deg,#0b1420,#03060b 74%)!important;
  box-shadow:
    inset 0 0 84px rgba(1,4,9,.76),
    0 4px 0 #05070a,
    0 15px 30px rgba(0,0,0,.24)!important;
}

html #market-preview-modal .market-preview-play{
  border-color:#7696c7!important;
  background:
    radial-gradient(circle at 72% 10%,rgba(255,255,255,.17),transparent 32%),
    linear-gradient(145deg,#334664,#121a27)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.16),
    inset 0 -6px 12px rgba(4,10,23,.38),
    0 6px 0 #060a11,
    0 18px 38px rgba(0,0,0,.45),
    0 0 0 8px rgba(75,105,168,.08)!important;
}

html #market-preview-modal .market-preview-play[aria-pressed="true"]{
  border-color:#b9d3ff!important;
  background:
    radial-gradient(circle at 72% 10%,rgba(255,255,255,.22),transparent 32%),
    linear-gradient(145deg,#4a83df,#7166d5)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.32),
    inset 0 -6px 12px rgba(15,30,83,.28),
    0 6px 0 #263f86,
    0 18px 38px rgba(36,78,170,.34)!important;
  color:#fff!important;
}

html #market-preview-modal #preview-to-contract,
html #contract-modal .contract-submit{
  border-color:#9bc5ff!important;
  background:
    radial-gradient(circle at 78% 10%,rgba(255,255,255,.2),transparent 29%),
    linear-gradient(135deg,#477fdf 0%,#5579dd 48%,#7166d5 100%)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.34),
    inset 0 -7px 12px rgba(15,30,83,.28),
    0 5px 0 #263f86,
    0 14px 28px rgba(36,78,170,.28)!important;
  color:#fff!important;
  text-shadow:0 2px 5px rgba(14,30,72,.4)!important;
}

html #market-preview-modal #preview-to-contract:hover,
html #contract-modal .contract-submit:hover{
  border-color:#c4dcff!important;
  filter:brightness(1.07)!important;
  transform:translateY(-2px)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.42),
    inset 0 -7px 12px rgba(15,30,83,.25),
    0 7px 0 #263f86,
    0 19px 34px rgba(36,78,170,.35)!important;
}

html #market-preview-modal #preview-to-contract:active,
html #contract-modal .contract-submit:active{
  filter:brightness(.98)!important;
  transform:translateY(4px)!important;
  box-shadow:
    inset 0 4px 10px rgba(15,27,70,.34),
    inset 0 1px rgba(255,255,255,.18),
    0 1px 0 #263f86,
    0 7px 15px rgba(26,57,126,.24)!important;
}

/* --------------------------------------------------------------------------
   Dimensional buttons based on the Film Studio master-render control
   -------------------------------------------------------------------------- */

html body :is(
  .button.primary,
  .nav-pill.primary,
  .flow-submit,
  .role-submit button,
  .persona-actions .primary,
  .hub-route a,
  .product-submit,
  .license-submit,
  .contract-submit,
  .film-modal-submit,
  .motion-modal-start,
  .unified-generate,
  .checkout-submit,
  [data-entry-submit]
){
  position:relative!important;
  overflow:hidden!important;
  border:1px solid #9bc5ff!important;
  border-radius:12px!important;
  background:
    radial-gradient(circle at 78% 10%,rgba(255,255,255,.2),transparent 29%),
    linear-gradient(135deg,#477fdf 0%,#5579dd 48%,#7166d5 100%)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.34),
    inset 0 -7px 12px rgba(15,30,83,.28),
    0 5px 0 #263f86,
    0 14px 28px rgba(36,78,170,.27)!important;
  color:#fff!important;
  text-shadow:0 2px 5px rgba(14,30,72,.4)!important;
  transform:translateY(0);
  transition:transform .14s ease,translate .16s ease,box-shadow .14s ease,filter .14s ease!important;
}

html body:not(.auth-body):not(.auth-popup-page):not(.landing-page) :is(
  .button.primary,
  .nav-pill.primary,
  .flow-submit,
  .role-submit button,
  .persona-actions .primary,
  .hub-route a,
  .product-submit,
  .license-submit,
  .contract-submit,
  .film-modal-submit,
  .motion-modal-start,
  .unified-generate,
  .checkout-submit,
  [data-entry-submit]
){
  border-color:#9bc5ff!important;
  background:
    radial-gradient(circle at 78% 10%,rgba(255,255,255,.2),transparent 29%),
    linear-gradient(135deg,#477fdf 0%,#5579dd 48%,#7166d5 100%)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.34),
    inset 0 -7px 12px rgba(15,30,83,.28),
    0 5px 0 #263f86,
    0 14px 28px rgba(36,78,170,.27)!important;
  color:#fff!important;
  text-shadow:0 2px 5px rgba(14,30,72,.4)!important;
}

html body :is(
  .button.primary,
  .nav-pill.primary,
  .flow-submit,
  .role-submit button,
  .persona-actions .primary,
  .hub-route a,
  .product-submit,
  .license-submit,
  .contract-submit,
  .film-modal-submit,
  .motion-modal-start,
  .unified-generate,
  .checkout-submit,
  [data-entry-submit]
):hover{
  filter:brightness(1.07)!important;
  transform:translateY(-2px)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.42),
    inset 0 -7px 12px rgba(15,30,83,.25),
    0 7px 0 #263f86,
    0 19px 34px rgba(36,78,170,.35)!important;
}

html body:not(.auth-body):not(.auth-popup-page):not(.landing-page) :is(
  .button.primary,
  .nav-pill.primary,
  .flow-submit,
  .role-submit button,
  .persona-actions .primary,
  .hub-route a,
  .product-submit,
  .license-submit,
  .contract-submit,
  .film-modal-submit,
  .motion-modal-start,
  .unified-generate,
  .checkout-submit,
  [data-entry-submit]
):hover{
  filter:brightness(1.07)!important;
  transform:translateY(-2px)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.42),
    inset 0 -7px 12px rgba(15,30,83,.25),
    0 7px 0 #263f86,
    0 19px 34px rgba(36,78,170,.35)!important;
}

html body :is(
  .button.primary,
  .nav-pill.primary,
  .flow-submit,
  .role-submit button,
  .persona-actions .primary,
  .hub-route a,
  .product-submit,
  .license-submit,
  .contract-submit,
  .film-modal-submit,
  .motion-modal-start,
  .unified-generate,
  .checkout-submit,
  [data-entry-submit]
):active{
  filter:brightness(.98)!important;
  transform:translateY(4px)!important;
  box-shadow:
    inset 0 4px 10px rgba(15,27,70,.34),
    inset 0 1px rgba(255,255,255,.18),
    0 1px 0 #263f86,
    0 7px 15px rgba(26,57,126,.24)!important;
}

html body:not(.auth-body):not(.auth-popup-page):not(.landing-page) :is(
  .button.primary,
  .nav-pill.primary,
  .flow-submit,
  .role-submit button,
  .persona-actions .primary,
  .hub-route a,
  .product-submit,
  .license-submit,
  .contract-submit,
  .film-modal-submit,
  .motion-modal-start,
  .unified-generate,
  .checkout-submit,
  [data-entry-submit]
):active{
  filter:brightness(.98)!important;
  transform:translateY(4px)!important;
  box-shadow:
    inset 0 4px 10px rgba(15,27,70,.34),
    inset 0 1px rgba(255,255,255,.18),
    0 1px 0 #263f86,
    0 7px 15px rgba(26,57,126,.24)!important;
}

html body :is(.button,.nav-pill):not(.primary){
  border-color:#3d4859!important;
  border-radius:12px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.055),transparent 48%),
    linear-gradient(180deg,#252c37,#141922)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.1),
    inset 0 -1px rgba(0,0,0,.42),
    0 4px 0 #070a0f,
    0 11px 23px rgba(0,0,0,.25)!important;
  color:#dbe3f0!important;
}

html body :is(.button,.nav-pill):not(.primary):hover{
  border-color:#64738a!important;
  color:#fff!important;
  transform:translateY(-2px)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.13),
    0 6px 0 #070a0f,
    0 16px 28px rgba(0,0,0,.3)!important;
}

/* Keep the original master-render geometry, replace its remaining lime key. */
html body.film-page .film-render-button{
  border-color:#a9caff!important;
  background:
    radial-gradient(circle at 78% 15%,rgba(255,255,255,.2),transparent 28%),
    linear-gradient(135deg,#477fdf 0%,#5579dd 48%,#7166d5 100%)!important;
}

html body.film-page .film-render-button .film-render-arrow{
  border-color:#d4e4ff!important;
  background:linear-gradient(145deg,#f1f6ff,#a9c7ff)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.78),
    inset 0 -4px 7px rgba(53,83,154,.2),
    0 4px 0 #526aa4,
    0 8px 16px rgba(49,78,151,.3)!important;
  color:#18264b!important;
}

html body.film-page #film-export-open.primary{
  border-color:#9bc5ff!important;
  background:
    radial-gradient(circle at 78% 10%,rgba(255,255,255,.2),transparent 29%),
    linear-gradient(135deg,#477fdf 0%,#5579dd 48%,#7166d5 100%)!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.34),
    inset 0 -6px 11px rgba(15,30,83,.27),
    0 4px 0 #263f86,
    0 12px 24px rgba(36,78,170,.27)!important;
  color:#fff!important;
  text-shadow:0 2px 5px rgba(14,30,72,.4)!important;
}

/* --------------------------------------------------------------------------
   Shared 3D surfaces
   -------------------------------------------------------------------------- */

html body :is(
  .card,
  .feature-card,
  .price,
  .price-v2,
  .commission-card,
  .market-card,
  .account-hero-card,
  .account-stats article,
  .account-job,
  .account-empty,
  .account-tools article,
  .legal-body article,
  .admin-card,
  .admin-stats article,
  .admin-section,
  .persona-hero,
  .persona-stats article,
  .persona-panel,
  .role-route,
  .hub-status article,
  .hub-route,
  .seller-hub-hero,
  .product-form,
  .product-guide,
  .license-card,
  .business-panel,
  .revenue-card,
  .refund-card
){
  border-color:var(--arife-edge)!important;
  background:
    radial-gradient(circle at 92% -8%,rgba(130,163,231,.11),transparent 32%),
    linear-gradient(145deg,rgba(255,255,255,.055),transparent 42%),
    linear-gradient(145deg,var(--arife-surface),var(--arife-surface-deep))!important;
  box-shadow:var(--arife-shadow-card)!important;
}

html body :is(
  .card,
  .feature-card,
  .price-v2,
  .commission-card,
  .market-card,
  .account-job,
  .account-tools article,
  .admin-card,
  .persona-stats article,
  .persona-panel,
  .role-route,
  .hub-route,
  .license-card
):hover{
  border-color:#617493!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.12),
    0 7px 0 var(--arife-shadow-deep),
    0 24px 48px rgba(0,0,0,.4),
    0 0 0 1px rgba(145,186,255,.045)!important;
}

html body :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
  select,
  textarea
){
  border-color:#3d4859!important;
  border-radius:11px!important;
  background:linear-gradient(180deg,#171d27,#0d1118)!important;
  box-shadow:inset 3px 4px 10px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.04)!important;
  color:#f5f7fb!important;
}

html body :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
  select,
  textarea
):focus{
  border-color:#789bd4!important;
  box-shadow:
    inset 3px 4px 9px rgba(0,0,0,.29),
    0 0 0 3px rgba(145,186,255,.1),
    0 9px 21px rgba(26,54,108,.12)!important;
}

html body :is(.eyebrow,.kicker,.role-kicker,.film-inspector-title small){
  color:var(--arife-accent)!important;
}

html body :is(.card-link,.account-mini.ok,.nav-credit em,.nav-credit strong b){
  color:var(--arife-accent-bright)!important;
}

html body .nav-avatar-button,
html body .account-avatar{
  border-color:transparent!important;
  box-shadow:
    0 0 0 1.5px rgba(145,186,255,.62),
    0 4px 0 #070a10,
    0 10px 20px rgba(0,0,0,.3)!important;
}

html body .nav-avatar-button:hover{
  box-shadow:
    0 0 0 1.5px var(--arife-accent-bright),
    0 5px 0 #070a10,
    0 13px 24px rgba(58,94,170,.28)!important;
}

html body :is(.nav-avatar-menu,.top-role-menu){
  border-color:#4a5870!important;
  background:
    radial-gradient(circle at 88% 0,rgba(145,186,255,.11),transparent 30%),
    linear-gradient(150deg,rgba(31,38,50,.99),rgba(9,12,18,.99))!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.1),
    0 7px 0 #05070b,
    0 32px 80px rgba(0,0,0,.68)!important;
}

/* --------------------------------------------------------------------------
   Pointer proximity layer
   -------------------------------------------------------------------------- */

.arife-pointer-aura{
  position:fixed;
  z-index:2147483000;
  left:0;
  top:0;
  width:270px;
  height:270px;
  margin:-135px 0 0 -135px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(137,176,255,.12) 0%,rgba(121,105,225,.055) 34%,transparent 70%);
  mix-blend-mode:screen;
  opacity:0;
  pointer-events:none;
  will-change:transform,opacity;
  transition:opacity .24s ease;
}

.arife-proximity-enabled .arife-pointer-aura.is-visible{opacity:1}

[data-arife-proximity]{
  translate:var(--arife-shift-x,0) var(--arife-shift-y,0);
  transition:
    translate .18s cubic-bezier(.22,1,.36,1),
    filter .18s ease,
    border-color .18s ease!important;
  will-change:translate,filter;
}

[data-arife-proximity].is-arife-near{
  filter:
    brightness(calc(1 + var(--arife-near,.2) * .055))
    saturate(calc(1 + var(--arife-near,.2) * .08))
    drop-shadow(0 8px 14px rgba(75,112,194,var(--arife-near-alpha,.08)));
}

@media(max-width:1220px){
  html body .site-nav{
    grid-template-columns:126px minmax(0,1fr) 284px!important;
    gap:10px!important;
    padding-inline:16px!important;
  }
  html body .site-nav .nav-links a{padding-inline:7px!important;font-size:12px!important}
}

@media(max-width:980px){
  html body .site-nav{grid-template-columns:112px 1fr auto!important}
  html body .site-nav .menu-button{
    display:grid!important;
    grid-column:2!important;
    justify-self:end!important;
    width:40px!important;
    height:40px!important;
    place-items:center!important;
    border:1px solid #4a5870!important;
    border-radius:12px!important;
    background:linear-gradient(145deg,#283141,#111620)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.1),0 4px 0 #06080d!important;
    color:#e8effb!important;
  }
  html body .site-nav .nav-links{display:none!important}
  html body .site-nav .nav-links.open{
    position:absolute!important;
    top:calc(var(--arife-nav-height) + 11px)!important;
    right:12px!important;
    left:12px!important;
    width:auto!important;
    max-width:none!important;
    height:auto!important;
    display:grid!important;
    gap:5px!important;
    padding:10px!important;
    border:1px solid #48566c!important;
    border-radius:17px!important;
    background:linear-gradient(150deg,rgba(28,35,47,.99),rgba(8,11,17,.99))!important;
    box-shadow:inset 0 1px rgba(255,255,255,.09),0 7px 0 #05070b,0 28px 65px rgba(0,0,0,.62)!important;
  }
  html body .site-nav .nav-links.open a{
    justify-content:flex-start!important;
    height:42px!important;
    padding:0 13px!important;
  }
}

@media(max-width:620px){
  html body .site-nav{
    --arife-nav-height:60px;
    grid-template-columns:96px 1fr auto!important;
    height:var(--arife-nav-height)!important;
    min-height:var(--arife-nav-height)!important;
    max-height:var(--arife-nav-height)!important;
    padding-inline:11px!important;
  }
  html body .site-nav .brand{
    width:auto!important;
    min-width:0!important;
    height:38px!important;
    padding-inline:2px!important;
  }
  html body .site-nav .brand .company-logo,
  html body .site-nav .company-logo{
    width:74px!important;
    min-width:74px!important;
    max-width:74px!important;
  }
}

@media(pointer:coarse),(prefers-reduced-motion:reduce){
  .arife-pointer-aura{display:none!important}
  [data-arife-proximity]{
    translate:0 0!important;
    filter:none!important;
    transition:none!important;
  }
}