/* Imperial Dark Sector visual identity system */
:root{
  --ids-gunmetal:#0b1016;
  --ids-gunmetal-2:#121922;
  --ids-silver:#c7d0d7;
  --ids-silver-dim:#83919c;
  --ids-red:#a72c35;
  --ids-red-bright:#c54a53;
  --ids-accent:#8999a5;
  --ids-accent-rgb:137,153,165;
  --ids-sector-label:"IDS";
}

body.ids-visual-system{
  position:relative;
  background:
    radial-gradient(circle at 86% -6%,rgba(var(--ids-accent-rgb),.10),transparent 28rem),
    radial-gradient(circle at 8% 24%,rgba(167,44,53,.055),transparent 30rem),
    #050609;
}
body.ids-visual-system::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.18;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 70%);
}
body[data-ids-section="lore"]{--ids-accent:#ad3b44;--ids-accent-rgb:173,59,68;--ids-sector-label:"LORE"}
body[data-ids-section="characters"]{--ids-accent:#a7b4bd;--ids-accent-rgb:167,180,189;--ids-sector-label:"CHARACTER FILE"}
body[data-ids-section="galaxy"]{--ids-accent:#668aa1;--ids-accent-rgb:102,138,161;--ids-sector-label:"GALAXY"}
body[data-ids-section="religion"]{--ids-accent:#8c8199;--ids-accent-rgb:140,129,153;--ids-sector-label:"RELIGION"}
body[data-ids-section="timeline"]{--ids-accent:#8d969f;--ids-accent-rgb:141,150,159;--ids-sector-label:"TIMELINE"}
body[data-ids-section="media"]{--ids-accent:#758a98;--ids-accent-rgb:117,138,152;--ids-sector-label:"MEDIA"}
body[data-ids-section="collecting"]{--ids-accent:#a3aab0;--ids-accent-rgb:163,170,176;--ids-sector-label:"COLLECTING"}
body[data-ids-section="tools"]{--ids-accent:#b23a43;--ids-accent-rgb:178,58,67;--ids-sector-label:"TOOLS"}
body[data-ids-section="editorial"]{--ids-accent:#798d9c;--ids-accent-rgb:121,141,156;--ids-sector-label:"EDITORIAL"}
body[data-ids-section="discovery"]{--ids-accent:#8a98a3;--ids-accent-rgb:138,152,163;--ids-sector-label:"DISCOVERY"}
body[data-ids-section="home"]{--ids-accent:#a72c35;--ids-accent-rgb:167,44,53;--ids-sector-label:"IMPERIAL DARK SECTOR"}

.ids-visual-system .site-header{
  min-height:78px;
  border-bottom:1px solid rgba(155,169,179,.22);
  background:linear-gradient(180deg,rgba(8,11,15,.97),rgba(4,6,9,.94));
  box-shadow:0 14px 40px rgba(0,0,0,.26);
}
.ids-visual-system .site-header::after{
  content:"";
  position:absolute;
  left:max(20px,calc((100vw - var(--max))/2));
  bottom:-1px;
  width:min(180px,18vw);
  height:2px;
  background:linear-gradient(90deg,var(--ids-red),rgba(var(--ids-accent-rgb),.65),transparent);
  pointer-events:none;
}
.ids-visual-system .brand{gap:14px}
.ids-visual-system .brand-mark,
.ids-visual-system .ids-footer-brand .brand-mark{
  position:relative;
  width:54px;
  height:54px;
  flex:0 0 54px;
  border:0;
  border-radius:0;
  background:url("/images/ids-metallic-logo-approved.jpg?v=1") center/contain no-repeat;
  box-shadow:none;
  color:transparent!important;
  font-size:0!important;
  overflow:hidden;
}
.ids-visual-system .brand strong{
  color:#f0f3f5;
  font-size:.86rem;
  letter-spacing:.14em;
}
.ids-visual-system .brand small{
  margin-top:5px;
  color:#8c99a3;
  font-size:.58rem;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.ids-visual-system .ids-main-nav>a,
.ids-visual-system .ids-nav-section-link{
  position:relative;
}
.ids-visual-system .ids-main-nav>a::after,
.ids-visual-system .ids-nav-section-link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-9px;
  height:1px;
  background:var(--ids-accent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .16s ease;
}
.ids-visual-system .ids-main-nav>a:hover::after,
.ids-visual-system .ids-nav-section-link:hover::after,
.ids-visual-system .ids-main-nav a[aria-current="page"]::after{
  transform:scaleX(1);
}

.ids-visual-system main{
  position:relative;
}
.ids-visual-system main::before{
  content:var(--ids-sector-label);
  position:absolute;
  z-index:0;
  top:20px;
  right:max(16px,calc((100vw - var(--max))/2));
  color:rgba(var(--ids-accent-rgb),.28);
  font:900 .58rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.22em;
  pointer-events:none;
}
.ids-visual-system main>section,
.ids-visual-system main>article,
.ids-visual-system main>div{
  position:relative;
  z-index:1;
}

.ids-visual-system .section-tag,
.ids-visual-system .eyebrow,
.ids-visual-system .meta,
.ids-visual-system .column-label{
  color:var(--ids-accent)!important;
}
.ids-visual-system h1{
  position:relative;
  text-wrap:balance;
}
.ids-visual-system h1::after{
  content:"";
  display:block;
  width:78px;
  height:3px;
  margin-top:18px;
  background:linear-gradient(90deg,var(--ids-red),var(--ids-accent));
  box-shadow:28px 0 0 -1px rgba(var(--ids-accent-rgb),.42);
}
.ids-visual-system .home-hero h1::after{width:108px}
.ids-visual-system h2{
  text-wrap:balance;
}
.ids-visual-system .ids-breadcrumbs{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.69rem;
  letter-spacing:.035em;
  text-transform:uppercase;
}
.ids-visual-system .ids-breadcrumbs::before{
  content:"IDS /";
  color:var(--ids-red);
  font-weight:900;
}

.ids-visual-system .archive-card,
.ids-visual-system .ids-entry,
.ids-visual-system .ids-context-grid a,
.ids-visual-system .home-new-card,
.ids-visual-system .home-destination-card,
.ids-visual-system .home-tools-grid a,
.ids-visual-system .home-collector-grid a,
.ids-visual-system .character-hub-link,
.ids-visual-system .character-hub-index-card,
.ids-visual-system .ids-standard-card{
  position:relative;
}
.ids-visual-system .archive-card::before,
.ids-visual-system .ids-entry::before,
.ids-visual-system .ids-context-grid a::before,
.ids-visual-system .home-new-card::before,
.ids-visual-system .home-destination-card::before,
.ids-visual-system .home-tools-grid a::before,
.ids-visual-system .home-collector-grid a::before,
.ids-visual-system .character-hub-link::before,
.ids-visual-system .character-hub-index-card::before,
.ids-visual-system .ids-standard-card::before{
  content:"";
  position:absolute;
  left:-1px;
  top:-1px;
  width:44px;
  height:2px;
  background:linear-gradient(90deg,var(--ids-accent),transparent);
  pointer-events:none;
}
.ids-visual-system .archive-card:hover,
.ids-visual-system .ids-entry:hover,
.ids-visual-system .ids-context-grid a:hover,
.ids-visual-system .home-new-card:hover,
.ids-visual-system .home-destination-card:hover,
.ids-visual-system .home-tools-grid a:hover,
.ids-visual-system .home-collector-grid a:hover,
.ids-visual-system .character-hub-link:hover,
.ids-visual-system .character-hub-index-card:hover,
.ids-visual-system .ids-standard-card:hover{
  box-shadow:0 18px 46px rgba(0,0,0,.20),inset 0 1px 0 rgba(var(--ids-accent-rgb),.12);
}

.ids-visual-system .home-hero-visual,
.ids-visual-system .lead-story,
.ids-visual-system .character-hero,
.ids-visual-system .profile-hero{
  position:relative;
}
.ids-visual-system .home-hero-visual::after,
.ids-visual-system .lead-story::after{
  content:"IDS // DARK SECTOR";
  position:absolute;
  right:14px;
  top:14px;
  z-index:4;
  padding:6px 8px;
  border:1px solid rgba(200,208,214,.18);
  background:rgba(4,6,8,.7);
  color:#aeb8c0;
  font:900 .52rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.15em;
  pointer-events:none;
}
.ids-visual-system .home-hero-caption{
  position:relative;
}
.ids-visual-system .home-hero-caption::after{
  content:"ARCHIVE // ACTIVE";
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-50%);
  color:rgba(var(--ids-accent-rgb),.58);
  font:800 .5rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.13em;
}

.ids-visual-system .gold-button,
.ids-visual-system .store-link,
.ids-visual-system .dialog-actions button{
  border-color:var(--ids-red);
  background:rgba(167,44,53,.16);
  color:#edf1f4;
}
.ids-visual-system .gold-button:hover,
.ids-visual-system .dialog-actions button:hover{
  border-color:var(--ids-red-bright);
  background:rgba(167,44,53,.25);
}

.ids-visual-system .ids-site-footer{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg,#040609,#020304);
  border-top:1px solid rgba(var(--ids-accent-rgb),.25);
}
.ids-visual-system .ids-site-footer::before{
  content:"IMPERIAL DARK SECTOR // INDEPENDENT ARCHIVE";
  position:absolute;
  right:max(18px,calc((100vw - var(--max))/2));
  top:15px;
  color:rgba(var(--ids-accent-rgb),.2);
  font:900 .52rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.18em;
}
.ids-visual-system .ids-footer-brand>a{
  display:flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
}
.ids-visual-system .ids-footer-brand strong{
  color:#eef1f3;
  letter-spacing:.1em;
  text-transform:uppercase;
}

@media(max-width:760px){
  .ids-visual-system .site-header{min-height:66px}
  .ids-visual-system .brand-mark{width:43px;height:43px;flex-basis:43px}
  .ids-visual-system main::before{top:12px;right:14px;font-size:.48rem}
  .ids-visual-system h1::after{margin-top:13px;width:58px;height:2px}
  .ids-visual-system .home-hero-visual::after,
  .ids-visual-system .lead-story::after{right:10px;top:10px}
  .ids-visual-system .home-hero-caption::after{display:none}
}
@media(prefers-reduced-motion:reduce){
  .ids-visual-system *{scroll-behavior:auto!important;transition:none!important}
}


/* IDS RECORD SIGNATURE V2 */
.ids-record-strip{
  max-width:1480px;
  margin:0 auto;
  padding:8px 22px 0;
  display:grid;
  grid-template-columns:.8fr .9fr 1.35fr 1.15fr 1.2fr;
  gap:1px;
  background:transparent;
}
.ids-record-strip>div,
.ids-record-strip>a{
  min-width:0;
  min-height:58px;
  padding:10px 12px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(8,12,17,.78);
  text-decoration:none;
}
.ids-record-strip>div:first-child{
  border-left:2px solid var(--ids-accent);
}
.ids-record-strip>a:hover,
.ids-record-strip>a:focus-visible{
  background:#111922;
  border-color:rgba(var(--ids-accent-rgb),.42);
}
.ids-record-strip small{
  color:#667580;
  font:850 .5rem/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.ids-record-strip strong{
  margin-top:6px;
  overflow:hidden;
  color:#cbd3d9;
  font-size:.7rem;
  line-height:1.22;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ids-record-strip>div:first-child strong{
  color:#eef2f4;
  letter-spacing:.035em;
  text-transform:uppercase;
}
.ids-record-strip>div:nth-child(3) strong{
  color:var(--ids-accent);
}
.ids-lens-signature{
  display:grid;
  grid-template-columns:auto repeat(6,minmax(0,1fr));
  gap:1px;
  margin-top:20px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.06);
}
.ids-lens-signature>.ids-lens-label,
.ids-lens-signature>div{
  min-height:56px;
  padding:10px 11px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:#080d13;
}
.ids-lens-signature>.ids-lens-label{
  min-width:92px;
  color:var(--ids-red-bright);
  font:900 .56rem/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.ids-lens-signature small{
  color:#687682;
  font-size:.5rem;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.ids-lens-signature strong{
  margin-top:5px;
  color:#d8dfe4;
  font-size:.66rem;
  line-height:1.2;
}
.ids-footer-method{
  margin-top:12px!important;
  color:#778590!important;
  font:800 .58rem/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
@media(max-width:1080px){
  .ids-record-strip{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .ids-record-strip>a:last-child{
    grid-column:span 2;
  }
  .ids-lens-signature{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .ids-lens-signature>.ids-lens-label{
    grid-column:1/-1;
    min-height:38px;
  }
}
@media(max-width:700px){
  .ids-record-strip{
    padding:7px 14px 0;
    display:flex;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .ids-record-strip::-webkit-scrollbar{display:none}
  .ids-record-strip>div,
  .ids-record-strip>a{
    flex:0 0 190px;
    min-height:54px;
  }
  .ids-record-strip>a:last-child{grid-column:auto}
  .ids-lens-signature{
    grid-template-columns:1fr 1fr;
  }
  .ids-lens-signature>.ids-lens-label{
    grid-column:1/-1;
  }
}