/* FRONTIER 1.2 — NOVA presentation layer. No build process required. */
:root {
  --frontier-red: #a62940;
  --frontier-patch-gold: #3385ff;
  --frontier-white: #fff;
  --frontier-gutter: clamp(8px, 2.5vw, 48px);
  --frontier-black: #000;
  --frontier-panel: #0d1013;
  --frontier-line: #315984;
  --frontier-text: #edf2f2;
  --frontier-muted: #bcb6b7;
  --frontier-gold: #94c4ff;
}
html { min-height:100%; background:#040304; }
body.frontier { margin:0; min-height:100vh; height:auto; background:radial-gradient(ellipse at top,#a6294044,transparent 65%),url('../images/stars.svg') center top / 1000px auto repeat,#040304; color:var(--frontier-text); font-family:'Segoe UI',Arial,sans-serif; line-height:1.7; }
.frontier *, .frontier *::before, .frontier *::after { box-sizing:border-box; }
.frontier a { color:var(--frontier-gold); text-underline-offset:4px; border-bottom-color:#3385ff55; }
.frontier a:hover { color:#f4f9f9; border-bottom-color:#e6e2e1; }
.frontier :focus-visible { outline:2px solid #94c4ff; outline-offset:3px; }
.frontier .frontier-skip { position:fixed; top:-100px; left:20px; z-index:200; padding:10px 18px; background:#94c4ff; color:#0d1013; border-radius:5px; }
.frontier .frontier-skip:focus { top:12px; }
.frontier .frontier-site { position:relative; --frontier-frame-radius:16px; width:calc(100% - var(--frontier-gutter)*2); max-width:none; margin:clamp(12px,2vw,32px) auto; min-height:0; border:2px solid #3385ff; border-radius:var(--frontier-frame-radius); background:#000; box-shadow:0 20px 70px #0009; }
/* Inner frame sits above the banner so both colours remain visible. */
.frontier .frontier-site::after { content:""; position:absolute; inset:0; border:2px solid var(--frontier-red); border-radius:calc(var(--frontier-frame-radius) - 2px); pointer-events:none; z-index:40; }
.frontier .frontier-site > header { overflow:visible; position:relative; padding:0; margin:0; border:0; isolation:isolate; border-radius:inherit; background:#000; z-index:20; }
.frontier header .inner { overflow:visible; position:relative; max-width:none; margin:0; padding:0; border-radius:16px 16px 0 0; background:#000; isolation:isolate; }
.frontier header .background { position:absolute; top:0; left:auto; right:0; width:100%; height:calc((100vw - var(--frontier-gutter)*2 - 4px)/4.5); max-width:none; object-fit:cover; object-position:right center; padding:0; mask-image:none; transform:none; z-index:-2; opacity:1; border-radius:16px 16px 0 0; }
.frontier header .inner::before { display:none; }
.frontier header .gradient { position:absolute; inset:0; width:100%; height:calc((100vw - var(--frontier-gutter)*2 - 4px)/4.5); z-index:-1; border-radius:inherit; background:linear-gradient(0deg,#000 0%,#000000e6 5%,#00000080 12%,transparent 24%),linear-gradient(90deg,#000000a0 0%,#00000040 26%,transparent 45%); }
.frontier header .top { position:relative; display:flex; align-items:center; flex-wrap:wrap; gap:24px; min-height:max(200px,calc((100vw - var(--frontier-gutter)*2 - 4px)/4.5)); padding:60px clamp(24px,4.5vw,88px) 30px; }
.frontier header .top > .frontier-eyebrow { position:absolute; top:26px; left:clamp(24px,4.5vw,88px); max-width:65%; }
.frontier .frontier-brand { display:flex; align-items:center; gap:22px; flex:1; min-width:0; max-width:42%; margin-top:15px; }
.frontier .frontier-name { min-width:0; overflow-wrap:anywhere; }
.frontier .frontier-name h1 { margin:0; color:#ffffff; font-family:'Segoe UI',Arial,sans-serif; font-size:clamp(30px,4.2vw,76px); font-weight:300; line-height:1.15; letter-spacing:.075em; text-transform:uppercase; text-shadow:0 0 20px #3385ff6b,0 3px 10px #000; }
.frontier .frontier-eyebrow { color:#dcd8d7; font-size:11px; font-weight:600; letter-spacing:.15em; overflow-wrap:anywhere; }
.frontier .frontier-subtitle { display:block; margin-top:14px; color:#d4d0cf; font-size:13px; letter-spacing:.08em; overflow-wrap:anywhere; }
.frontier header .logo img { width:auto; max-width:180px; height:80px; object-fit:contain; }
.frontier header .signin-container { position:absolute; top:24px; right:26px; margin:0; padding:0; }
.frontier header .logged-in-controls { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.frontier header .logged-in-controls > span { margin:0; }
.frontier header .logged-in-controls a { display:inline-flex; align-items:center; gap:7px; min-height:40px; padding:6px 10px; border:0; border-radius:6px; color:#ebf0f0; font-size:12px; background:#05070866; }
.frontier header .logged-in-controls a:hover { background:#28425599; }
.frontier header img.icon { width:20px; height:20px; filter:brightness(1.2); }
.frontier header .bottom { position:relative; width:max-content; max-width:calc(100% - 48px); margin:0 auto; padding:0 10px; background:rgba(7,17,26,.64); border:1px solid #3385ff; border-radius:10px; backdrop-filter:blur(12px); }
.frontier header .bottom .container { max-width:none; display:block; }
.frontier header .bottom .left { display:block; }
.frontier .nav-main > ul { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:3px; padding:6px 0; margin:0; list-style:none; }
.frontier .nav-main > ul > li { margin:0; padding:0; min-width:0; }
.frontier .nav-main ul > li { margin-left:0; margin-right:0; }
.frontier .frontier-submenu { min-width:0; }
.frontier .nav-main > ul > li > a, .frontier .frontier-nav-group > a { display:flex; align-items:center; min-height:42px; padding:11px 16px; color:#e7e3e2; background:transparent; border:0; border-radius:6px; font-size:13px; line-height:1.4; font-weight:500; }
.frontier .nav-main > ul > li > a:hover, .frontier .frontier-nav-group > a:hover { background:#102839aa; color:#fff; }
.frontier .nav-main a.active { border-radius:6px; color:#fbfefe; background:linear-gradient(#8b2035bb,#401422bb); box-shadow:inset 0 0 0 1px #3385ff; }
.frontier-nav-toggle { display:none; }
.frontier-nav-group { position:relative; display:flex; align-items:center; border-radius:6px; }
.frontier .frontier-nav-group > a { padding-right:6px; }
.frontier-submenu-toggle { display:flex; align-items:center; justify-content:center; flex:0 0 30px; width:30px; min-height:42px; color:#e9eeee; background:transparent; border:0; border-radius:0 6px 6px 0; font-size:17px; line-height:1; cursor:pointer; }
.frontier-submenu-toggle:hover, .frontier-nav-group.is-open { background:#102635bb; }
.frontier-submenu { position:absolute; z-index:30; top:calc(100% + 8px); left:50%; transform:translateX(calc(-50% + var(--dropdown-shift,0px))); width:max-content; max-width:calc(100vw - var(--frontier-gutter)*2 - 24px); padding:6px; border:1px solid #3385ff; border-radius:8px; background:rgba(7,17,26,.78); box-shadow:0 12px 30px #000b; backdrop-filter:blur(14px); display:none; }
.frontier-submenu::before { content:''; position:absolute; top:-10px; left:0; width:100%; height:10px; }
.frontier .frontier-submenu > ul { display:flex; align-items:center; flex-wrap:nowrap; gap:3px; max-width:100%; overflow-x:auto; margin:0; padding:0; list-style:none; scrollbar-width:thin; scrollbar-color:#3c627e #090e11; }
.frontier .frontier-submenu li { margin:0; padding:0; flex:0 0 auto; }
.frontier .frontier-submenu li.spacer { display:none; }
.frontier .frontier-submenu a { display:block; min-height:40px; padding:10px 15px; white-space:nowrap; border:0; border-radius:5px; color:#eaefef; font-size:13px; line-height:1.5; background:transparent; }
.frontier .frontier-submenu a:hover, .frontier .frontier-submenu a.active { color:#fff; background:linear-gradient(#a62940cc,#11293bcc); box-shadow:inset 0 0 0 1px #989493; }
.frontier .frontier-site:not(.frontier-enhanced) .frontier-nav-group:hover > .frontier-submenu,
.frontier .frontier-site:not(.frontier-enhanced) .frontier-nav-group:focus-within > .frontier-submenu,
.frontier .frontier-nav-group.is-open > .frontier-submenu { display:block; }
.frontier .frontier-site:not(.frontier-enhanced) .frontier-submenu-toggle { display:none; }
.frontier main { margin:0; padding:0; position:relative; z-index:1; background:#000; }
.frontier main .wrapper { max-width:none; margin:0; padding:0; }
.frontier main .body { display:grid; grid-template-columns:minmax(0,1fr); gap:0; align-items:stretch; }
.frontier main .body > .content { grid-column:auto; min-width:0; width:100%; max-width:none; }
.frontier main .content-card { width:100%; max-width:none; min-height:260px; padding:64px clamp(24px,4.5vw,88px) 38px; background:transparent; border:0; border-radius:0; box-shadow:none; overflow-wrap:anywhere; }
.frontier-admin main .body { grid-template-columns:minmax(0,1fr) clamp(220px,17vw,280px); }
.frontier .nav-sub { min-width:0; background:rgba(7,17,26,.74); backdrop-filter:blur(10px); border-left:1px solid #223848; border-top:1px solid #315984; padding:30px 18px; }
.frontier-nav-heading { color:#cecac9; display:flex; justify-content:space-between; padding:0 12px 16px; font-size:10px; letter-spacing:.14em; text-transform:uppercase; }
.frontier .nav-sub ul { list-style:none; padding:0; margin:0; }
.frontier .nav-sub ul li a { display:block; min-height:42px; padding:10px 12px; color:#e1dddc; border:0; border-radius:5px; font-size:13px; line-height:1.5; }
.frontier .nav-sub ul li a:hover, .frontier .nav-sub ul li a.active { background:#1e313f; color:white; }
.frontier .nav-sub .menu_category { color:#bcb8b7; font-size:11px; padding:20px 12px 5px; }
.frontier-subnav-fallback { padding:12px clamp(24px,4.5vw,88px) 0; }
.frontier-subnav-fallback ul { display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
.frontier-subnav-fallback a { display:block; padding:7px 12px; border:1px solid #2c485d; border-radius:5px; }
.frontier h1,.frontier h2,.frontier h3,.frontier h4 { color:#ffffff; line-height:1.3; letter-spacing:-.015em; }
.frontier .content-card h1,.frontier .content-card h2 { font-size:clamp(26px,2.6vw,38px); font-weight:650; margin:0 0 18px; }
.frontier .content-card h3 { font-size:24px; margin:22px 0 14px; }
.frontier .content-card h4 { font-size:18px; margin:14px 0 10px; }
.frontier :is(.content-card,.card) .page-head { color:var(--frontier-white); }
.frontier .page-subhead { color:var(--frontier-muted); }
.frontier p { font-size:15px; line-height:1.8; margin:0 0 22px; }
.frontier .gray { color:#c6c2c1; }
.frontier hr { border-color:#2a4559; margin:24px 0; }
.frontier blockquote { padding:14px 20px; margin:22px 0; border-left:3px solid #b3afae; background:#081219; }
.frontier pre { white-space:pre-wrap; overflow-wrap:anywhere; }
.frontier :where(.content-card,.card) :where(img,svg,video,canvas,iframe,embed,object) { display:inline-block; vertical-align:middle; max-width:100%; }
.frontier .content-card img { max-width:100%; height:auto; }
.frontier :where(.content-card,.card) center { display:block; text-align:center; }
.frontier :where(.content-card,.card) :where(p,div,h1,h2,h3,h4,h5,h6,td,th,table)[align='center' i] { text-align:center; }
.frontier :where(.content-card,.card) :where(p,div,h1,h2,h3,h4,h5,h6,td,th,table)[align='left' i] { text-align:left; }
.frontier :where(.content-card,.card) :where(p,div,h1,h2,h3,h4,h5,h6,td,th,table)[align='right' i] { text-align:right; }
.frontier :where(.content-card,.card) :where(p,div,h1,h2,h3,h4,h5,h6,td,th)[align='justify' i] { text-align:justify; }
.frontier :where(.content-card,.card) center table,.frontier :where(.content-card,.card) table[align='center' i] { margin-left:auto; margin-right:auto; }
.frontier input:not([type]),.frontier input[type=text],.frontier input[type=password],.frontier input[type=email],.frontier input[type=number],.frontier input[type=search],.frontier input[type=url],.frontier input[type=tel],.frontier input[type=date],.frontier input[type=datetime-local],.frontier input[type=month],.frontier input[type=time],.frontier input[type=week],.frontier textarea,.frontier select { background:#0a0d10; border:1px solid #3b5e78; color:#f3f8f8; border-radius:6px; padding:10px 12px; max-width:100%; font:inherit; font-size:14px; box-shadow:none; }
.frontier textarea { width:100%; min-height:180px; }
.frontier input::placeholder,.frontier textarea::placeholder { color:#b3afae; }
.frontier input:focus,.frontier textarea:focus,.frontier select:focus { background:#0e151a; border-color:#94c4ff; color:#f3f8f8; box-shadow:0 0 0 2px #3385ff2b; }
.frontier input[type=checkbox],.frontier input[type=radio] { accent-color:#275e85; }
.frontier .button-main { display:inline-block; background:linear-gradient(#a62940,#122b3d); border:1px solid #3385ff; color:white; border-radius:6px; padding:10px 22px; font-size:13px; line-height:1.5; font-weight:650; }
.frontier .button-main:hover { background:#275e86; color:white; }
.frontier .button-sec,.frontier .button-small { display:inline-block; background:#070f15; border:1px solid #3c637f; color:#e4e9e9; border-radius:6px; font-size:13px; }
.frontier .button-sec:hover,.frontier .button-small:hover { background:#203544; color:white; }
.frontier .flash_message { border:1px solid currentColor; border-radius:6px; margin:0 0 24px; }
.frontier .flash_message p { padding:12px 16px; margin:0; }
.frontier .flash-info { background:#0b1a24; color:#bcece9; border-color:#3385ff; }
.frontier .flash-success { background:#153329; color:#c2ecd7; border-color:#50856c; }
.frontier .flash-error { background:#1a2b38; color:#dbf5f3; border-color:#589a96; }
.frontier .frontier-table-scroll { max-width:100%; overflow-x:auto; margin-bottom:16px; scrollbar-color:#3385ff #0a0d10; }
/* Center the manifest heading, selector, legend and filter controls together. */
.frontier .content-card:has(#manifest) > .page-head { text-align:center; }
.frontier #manifest { width:100%; max-width:1100px; margin-left:auto; margin-right:auto; text-align:center; }
.frontier #manifest table { margin-left:auto; margin-right:auto; }
/* Center the roster as a block; crew names and details retain left alignment. */
.frontier #manifest .frontier-manifest-scroll { width:100%; max-width:1100px; margin-left:auto; margin-right:auto; }
.frontier #manifest .frontier-manifest-table { width:100%; min-width:850px; text-align:left; }
/* Support the mod's unclassified table and ordinary NOVA tables without JS. */
.frontier #manifest table.manifest_table,
.frontier #manifest table:has(img.charimg) { max-width:1100px; margin-left:auto; margin-right:auto; text-align:left; }
/* The mod uses col_15 for portraits. Reserve 80px plus cell padding. */
.frontier #manifest td:has(img.charimg) { width:96px; min-width:96px; }
.frontier #manifest img.charimg { display:inline-block; width:80px; height:80px; min-width:80px; max-width:80px; object-fit:cover; vertical-align:middle; }
/*
|---------------------------------------------------------------
| CHARACTER BIO
|---------------------------------------------------------------
*/

.frontier .character-rank-display {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	vertical-align: middle;
	margin-left: 4px;
}

.frontier img.character-rank-image {
	display: block;
	max-width: 140px;
	height: auto;
	margin: 4px 0 2px 0;
}

.frontier .character-rank-name {
	display: block;
}

.frontier .character-awards-box {
	margin: 0 0 18px 0;
	padding: 0;
}

.frontier .character-awards-rack {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
}

.frontier .character-award-item {
	display: inline-block;
	line-height: 0;
	margin: 0;
	padding: 0;
}

.frontier img.character-award-ribbon {
	display: block;
	max-width: 50px;
	height: auto;
	margin: 0;
	padding: 0;
}

/*
|---------------------------------------------------------------
| RELATED CHARACTERS
|---------------------------------------------------------------
*/

.frontier .character-related-image {
	margin: 0 auto 4px auto;
	text-align: center;
	width: 55px;
	height: 70px;
	overflow: hidden;
}

.frontier .character-related-image img {
	display: block !important;
	width: 55px !important;
	height: 70px !important;
	max-width: 55px !important;
	max-height: 70px !important;
	margin: 0 auto !important;
	padding: 0 !important;
	object-fit: cover;
	border: 1px solid #333;
}

.frontier .character-related-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px 4px;
	width: 100%;
}


/* Character biography: center the whole layout, retain normal left text. */
.frontier-main .content-card > .row:has(> .span4):has(> .span12) {
  display:grid; grid-template-columns:minmax(200px,250px) minmax(0,1fr); gap:32px;
  width:100%; max-width:1100px; margin:0 auto; text-align:left;
}
.frontier-main .content-card > .row:has(> .span4):has(> .span12)::before,
.frontier-main .content-card > .row:has(> .span4):has(> .span12)::after { display:none; }
.frontier-main .content-card > .row:has(> .span4):has(> .span12) > :is(.span4,.span12) {
  float:none; width:auto; min-width:0; margin:0; text-align:left;
}
.frontier-main .content-card > .row:has(> .span4):has(> .span12) .gallery { margin:0 0 18px; padding:0; list-style:none; }
.frontier-main .content-card > .row:has(> .span4):has(> .span12) .gallery img { max-width:min(100%,200px); }
.frontier .character-related-item { min-width:0; text-align:center; overflow-wrap:anywhere; }
.frontier .character-related-link a { display:block; text-decoration:none; }
.frontier .character-related-rank { color:var(--frontier-muted); font-size:75%; line-height:1.15; }
.frontier .character-related-name { font-size:85%; font-weight:bold; line-height:1.15; margin-top:2px; }
@media(max-width:760px) {
  .frontier-main .content-card > .row:has(> .span4):has(> .span12) { grid-template-columns:minmax(0,1fr); gap:26px; }
  .frontier .character-related-grid { max-width:300px; }
}

.frontier table { max-width:100%; border-collapse:collapse; font-size:14px; }
.frontier td { padding:10px 8px; }
.frontier th { padding:12px 8px; border-bottom:1px solid #2a4559; color:#d8d4d3; font-size:11px; letter-spacing:.05em; }
.frontier tr.alt td,.frontier tr.light_gray,.frontier .alt { background:#0f1215; }
.frontier table.acp { border-color:#2a4559; }
.frontier .post_info,.frontier #news_blocks p,.frontier #comments p,.frontier .info-full,.frontier #notes { padding:12px 16px; background:#050b10; border:1px solid #284254; border-radius:6px; }
.frontier #acp-panel,.frontier #online { background:#060e14; border-color:#315984; }
.frontier #acp-panel .panel { background:#09131a; border-color:#315984; min-width:0; }
.frontier #panelmenu li a { color:#e1dddc; }
.frontier #panelmenu li a.active,.frontier #panelmenu li a:hover { background:#203544; color:white; border-color:#467393; }
.frontier .ui-widget { font-family:inherit; font-size:14px; }
.frontier .ui-widget-content { color:#edf2f2; background:#0f1215; border-color:#304f65; }
.frontier .ui-widget-header { color:#edf2f2; background:#0d1013; border-color:#304f65; }
.frontier .ui-state-default { background:#0e161c; border-color:#304f65; }
.frontier .ui-state-default a,.frontier .ui-state-default a:link { color:#e1dddc; }
.frontier .ui-state-active { background:#8b2035; border-color:#63cac4; }
.frontier .ui-state-active a,.frontier .ui-state-active a:link { color:#fff; }
.frontier .ui-tabs-nav { display:flex; flex-wrap:wrap; }
/* NOVA's classic selected class and newer jQuery UI active class both apply. */
.frontier .ui-tabs .ui-tabs-nav { background:#0d1013; border-color:#315984; }
.frontier .ui-tabs .ui-tabs-nav li { background:#0e161c; border-color:#315984; }
.frontier .ui-tabs .ui-tabs-nav li a { color:#e5eaea; background:transparent; }
.frontier .ui-tabs .ui-tabs-nav li a:hover { color:#fbfefe; background:#1a2b38; border-color:#969291; }
.frontier .ui-tabs .ui-tabs-nav li.ui-tabs-selected,
.frontier .ui-tabs .ui-tabs-nav li.ui-state-active { background:#8b2035; }
.frontier .ui-tabs .ui-tabs-nav li.ui-tabs-selected a,
.frontier .ui-tabs .ui-tabs-nav li.ui-state-active a { color:#fbfefe; background:#8b2035; border-color:#3385ff; }
.frontier .subtabs .ui-tabs-nav { background:transparent; }
.frontier .subtabs .ui-tabs-nav li.ui-tabs-selected a,
.frontier .subtabs .ui-tabs-nav li.ui-state-active a { color:#fbfefe; background:#8b2035; }

.frontier .chosen-container,.frontier .chzn-container { max-width:100%; }
.frontier .chosen-container .chosen-drop,.frontier .chzn-container .chzn-drop,.frontier .chosen-container .chosen-single,.frontier .chzn-container .chzn-single { background:#0c1922; color:#edf2f2; border-color:#385b75; }
.frontier .chosen-results li.highlighted,.frontier .chzn-results li.highlighted { background:#385d77; color:white; }
.frontier .page-supplemental,.frontier #category-panel,.frontier .category-panel-header { background:#0a161e; border-color:#304f65; }
.frontier .subnav-options-list { background:#1c2d3a; }
.frontier .subnav-options-list ul li a { color:#e4e0df!important; }
.frontier .subnav-options-list ul li a:hover { background:#2d495e; }
.frontier #category-panel { width:100%; }
.frontier .page-main,.frontier .wiki-subnav,.frontier .subnav-content ul { flex-wrap:wrap; gap:12px; }
.frontier .bio_main_image { margin:0 0 20px 24px; }
.frontier footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 22px; margin:0 clamp(24px,3vw,60px); padding:16px 0; border-top:1px solid #253d4e; background:#000; color:#cdc9c8; font-size:11px; line-height:1.7; border-radius:0 0 16px 16px; }
.frontier footer > span { margin:0; }
.frontier footer a { color:#d7d3d2; border:0; }
.frontier .frontier-credit { color:#e8e4e3; font-weight:500; }
.frontier .frontier-art-credit { flex-basis:100%; font-size:9px; color:#aeaaa9; }
.frontier .panel-wrapper { position:fixed; inset:0; z-index:100; }
.frontier .panel-wrapper.hidden,.frontier .panel-wrapper[aria-hidden='true'] { display:none!important; }
.frontier .panel-overlay { position:fixed; inset:0; background:#000b; backdrop-filter:blur(6px); }
.frontier #panel { position:fixed; inset:0; z-index:101; padding:50px 16px; overflow-y:auto; }
.frontier #panel .panel-body { position:relative; max-width:680px; margin:auto; padding:24px; border:1px solid #3f6885; border-radius:12px; background:#090e11; box-shadow:0 20px 80px #000b; }
.frontier #frontier-panel-title { margin:0 0 22px; padding-right:44px; font-size:24px; }
.frontier .panel-close { position:absolute; top:14px; right:14px; width:40px; height:40px; padding:8px; border-radius:6px; background:#162f52; color:#e9eeee; }
.frontier .panel-close > svg { color:#e9eeee; }
.frontier .panel-body h4 { color:#d1cdcc; padding:8px 12px; }
.frontier .panel-body > ul > li > ul > li > a { color:#e4e0df; }
.frontier .panel-body > ul > li > ul > li > a:hover { color:white; background:#162f52; }
body.frontier.frontier-panel-open { overflow:hidden; }
.frontier-login > header { position:fixed; inset:0; padding:0; pointer-events:none; isolation:isolate; }
.frontier-login header .background { mask-image:none; width:100%; height:100%; object-fit:cover; opacity:.4; }
.frontier-login header .gradient { height:100%; background:radial-gradient(ellipse at center,#0006,#000c 80%); }
.frontier-login > .wrapper { position:relative; z-index:1; min-height:100vh; width:calc(100% - var(--frontier-gutter)*2); max-width:550px; padding:54px 0; margin:0 auto; }
.frontier-login .head { max-width:none; text-align:center; }
.frontier-login .head .title { font-size:28px; color:#ffffff; margin:18px 0; }
.frontier-login .head .logo img { height:85px; max-width:200px; }
.frontier-login .body { width:100%; max-width:none; margin-top:20px; border:2px solid var(--frontier-patch-gold); border-radius:12px; background:#090e11f2; box-shadow:inset 0 0 0 2px var(--frontier-red),0 20px 80px #0008; }
.frontier-login .card { padding:34px; border-radius:12px; background:transparent; }
.frontier-login .card h1 { font-size:26px; }
.frontier-login input[type=text],.frontier-login input[type=email],.frontier-login input[type=password] { width:100%; }
.frontier-login .controls { flex-wrap:wrap; gap:18px; }
.frontier-login .frontier-login-credit { margin:22px 0 0; padding:0 12px; justify-content:center; text-align:center; background:transparent; border:0; }
@media(max-width:1050px) {
  .frontier .nav-main > ul > li > a,.frontier .frontier-nav-group > a { padding-left:10px; padding-right:8px; font-size:12px; }
  .frontier header .top { min-height:max(186.667px,calc((100vw - var(--frontier-gutter)*2 - 4px)/4.5)); }
  .frontier header .background { width:100%; }
}
@media(max-width:760px) {
  .frontier .frontier-site { --frontier-frame-radius:12px; }
  .frontier header .inner { border-radius:12px 12px 0 0; background:#000; }
  .frontier header .top { display:block; min-height:0; padding:calc((100vw - var(--frontier-gutter)*2 - 4px)/3 + 76px) 20px 24px; }
  .frontier header .inner::before { display:none; }
  .frontier header .background { top:54px; width:100%; height:calc((100vw - var(--frontier-gutter)*2 - 4px)/3); mask-image:none; object-fit:cover; object-position:right center; padding:0; clip-path:none; border-radius:12px 12px 0 0; }
  .frontier header .gradient { top:54px; bottom:auto; height:calc((100vw - var(--frontier-gutter)*2 - 4px)/3); background:linear-gradient(0deg,#000 0%,#000000b0 7%,transparent 22%),linear-gradient(90deg,#00000020,transparent 25%); }
  .frontier .frontier-brand { margin-top:0; gap:12px; max-width:none; }
  .frontier .frontier-name h1 { font-size:clamp(27px,7vw,42px); letter-spacing:.045em; }
  .frontier header .logo img { height:54px; max-width:100px; }
  .frontier header .top > .frontier-eyebrow { top:calc((100vw - var(--frontier-gutter)*2 - 4px)/3 + 54px); left:20px; max-width:100%; font-size:9px; }
  .frontier header .signin-container { top:14px; right:10px; }
  .frontier header .logged-in-controls { gap:1px; }
  .frontier header .logged-in-controls a { padding:6px; font-size:11px; }
  .frontier header .bottom { width:calc(100% - 28px); max-width:calc(100% - 28px); margin:0 auto; padding:0 8px; }
  .frontier .frontier-enhanced .nav-main { display:none; }
  .frontier .frontier-enhanced .nav-main.is-open { display:block; }
  .frontier .frontier-enhanced .frontier-nav-toggle { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:48px; padding:12px 8px; color:#e7e3e2; border:0; background:transparent; font-size:13px; }
  .frontier .nav-main > ul { flex-direction:column; align-items:stretch; padding:8px 0; gap:4px; }
  .frontier .nav-main > ul > li { width:100%; max-width:100%; align-self:stretch; }
  .frontier .nav-main > ul > li > a { padding:11px 12px; min-height:44px; }
  .frontier .frontier-nav-group { flex-wrap:wrap; width:100%; }
  .frontier .frontier-nav-group > a { min-width:0; flex:1; padding:11px 12px; min-height:44px; }
  .frontier-submenu-toggle { width:44px; flex-basis:44px; min-height:44px; }
  .frontier .frontier-submenu { position:static; transform:none; min-width:0; width:100%; max-width:100%; margin:5px 0; padding:5px; flex-basis:100%; backdrop-filter:none; box-shadow:none; }
  .frontier .frontier-submenu::before { display:none; }
  .frontier .frontier-submenu > ul { width:100%; overflow-x:auto; }
  .frontier .frontier-site:not(.frontier-enhanced) .frontier-submenu { display:block; }
  .frontier .frontier-submenu a { min-height:44px; padding:11px 12px; }
  .frontier main .content-card { min-height:0; padding:32px 22px; }
  .frontier-admin main .body { grid-template-columns:minmax(0,1fr); }
  .frontier-admin .nav-sub { grid-row:1; border-left:0; border-bottom:1px solid #223848; padding:20px 16px; }
  .frontier-admin .nav-sub ul { display:flex; flex-wrap:wrap; gap:4px; }
  .frontier-admin .nav-sub .menu_category { width:100%; padding:12px 8px 4px; }
  .frontier-admin .nav-sub .spacer { display:none; }
  .frontier-admin .frontier-admin-collapsible > .frontier-nav-heading { display:none; }
  .frontier-admin-disclosures { display:grid; gap:10px; }
  .frontier-admin-disclosure { min-width:0; border:1px solid var(--frontier-line); border-radius:8px; background:rgba(7,17,26,.78); }
  .frontier-admin-disclosure summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:48px; padding:12px 14px; color:var(--frontier-white); cursor:pointer; list-style:none; overflow-wrap:anywhere; }
  .frontier-admin-disclosure summary::-webkit-details-marker { display:none; }
  .frontier-admin-disclosure summary::after { content:"+"; flex:none; color:var(--frontier-gold); font-size:20px; }
  .frontier-admin-disclosure[open] summary::after { content:"−"; }
  .frontier-admin-disclosure[open] summary { border-bottom:1px solid var(--frontier-line); }
  .frontier-admin .nav-sub .frontier-admin-disclosure > ul { display:block; margin:0; padding:6px; }
  .frontier-admin .nav-sub .frontier-admin-disclosure > ul > li { display:block; width:100%; margin:0; }

  .frontier .content-card h1,.frontier .content-card h2 { font-size:27px; }
  .frontier input[type=text],.frontier input[type=password],.frontier input[type=email],.frontier textarea,.frontier select { font-size:16px; }
  .frontier #acp-panel { flex-direction:column; }
  .frontier #acp-panel .panelnav { width:100%; }
  .frontier #acp-panel .panel { border-left:0; border-top:1px solid #315984; }
  .frontier #panelmenu { display:flex; flex-wrap:wrap; }
  .frontier .bio_main_image { float:none; margin:0 auto 22px; }
  .frontier footer { margin:0 22px; justify-content:flex-start; padding:18px 0; }
  .frontier-login .card { padding:26px 22px; }
}
/* Restore Login's full viewport backdrop after narrow header overrides. */
.frontier-login header .background,.frontier-login header .gradient { top:0; width:100%; height:100%; clip-path:none; }
@media(prefers-reduced-motion:reduce) { .frontier * { transition:none!important; scroll-behavior:auto!important; } }
@media print {
  .frontier .frontier-site::after { display:none; }
  body.frontier { background:white; color:black; }
  .frontier .frontier-site { width:100%; margin:0; border:0; box-shadow:none; }
  .frontier header,.frontier footer,.frontier .nav-sub,.frontier .panel-wrapper,.frontier-subnav-fallback { display:none!important; }
  .frontier main .body { display:block; }
  .frontier main .content-card { padding:0; color:black; }
  .frontier h1,.frontier h2,.frontier h3,.frontier h4,.frontier a { color:black; }
}

/* Portrait personnel layout; desktop presentation remains unchanged. */
@media(max-width:760px) {
 .frontier .content-card:has(#manifest), .frontier .content-card:has(.gallery):has(#tabs) { padding-left:16px; padding-right:16px; }
 .frontier #manifest table { width:100%; min-width:0; max-width:100%; }
 .frontier #manifest .frontier-manifest-scroll { overflow:visible; }
 .frontier #manifest :is(.frontier-manifest-table,table:has(tr.active),table:has(img.charimg)) { display:block; width:100%; min-width:0; border-spacing:0; }
 .frontier #manifest :is(.frontier-manifest-table,table:has(tr.active),table:has(img.charimg)) > tbody { display:block; }
 .frontier #manifest :is(.frontier-manifest-table,table:has(tr.active),table:has(img.charimg)) > tbody > tr { display:grid; grid-template-columns:64px minmax(0,1fr); gap:6px 12px; padding:16px 0; border-bottom:1px solid var(--frontier-line); text-align:left; }
 .frontier #manifest :is(.frontier-manifest-table,table:has(tr.active),table:has(img.charimg)) td { display:block; width:auto; min-width:0; padding:0; text-align:left; overflow-wrap:anywhere; }
 .frontier #manifest :is(.frontier-manifest-table,table:has(tr.active),table:has(img.charimg)) td:empty { display:none; }
 .frontier #manifest td.col_150 { grid-column:2; grid-row:1; align-self:start; }
 .frontier #manifest td.col_150 img { width:120px; max-width:100%; height:auto; }
 .frontier #manifest td:has(img.charimg) { grid-column:1; grid-row:1 / span 4; width:64px; min-width:0; }
 .frontier #manifest img.charimg { width:64px; height:64px; min-width:0; max-width:64px; }
 .frontier #manifest td:has(strong), .frontier #manifest td.col_75 { grid-column:2; }
 .frontier #manifest td[colspan="6"] { grid-column:1 / -1; }
 .frontier #manifest td[colspan="6"] h3 { margin:12px 0 0; }
 .frontier #manifest td strong.fontMedium { font-size:16px; line-height:1.4; }
 .frontier #manifest table:not(.frontier-manifest-table):not(:has(tr.active)):not(:has(img.charimg)) tr { display:flex; flex-wrap:wrap; gap:8px; }
 .frontier #manifest table:not(.frontier-manifest-table):not(:has(tr.active)):not(:has(img.charimg)) td { display:block; flex:1 1 100%; text-align:left; }
 .frontier .content-card:has(.gallery):has(#tabs) .row { display:flex; flex-direction:column; gap:20px; margin:0; }
 .frontier .content-card:has(.gallery):has(#tabs) .row > * { width:100%; max-width:100%; min-width:0; margin-left:0; float:none; }
 .frontier .content-card:has(.gallery):has(#tabs) .gallery { margin:0 0 16px; text-align:center; }
 .frontier .content-card:has(.gallery):has(#tabs) .gallery img { max-width:100%; width:auto; max-height:240px; height:auto; object-fit:contain; }
 .frontier .content-card:has(.gallery):has(#tabs) .span4 > ul:not(.gallery) { margin:8px 0 16px; padding:0; list-style:none; }
 .frontier .content-card:has(.gallery):has(#tabs) .span4 > ul:not(.gallery) a { display:inline-block; padding:6px 0; }
 .frontier #tabs .ui-tabs-nav { display:flex; flex-wrap:wrap; gap:4px; padding:6px; }
 .frontier #tabs .ui-tabs-nav li { float:none; margin:0; flex:1 1 auto; }
 .frontier #tabs .ui-tabs-nav li a { display:block; padding:10px 8px; font-size:14px; text-align:center; white-space:normal; }
 .frontier #tabs .ui-tabs-panel { padding:16px 12px; }
 .frontier #tabs .frontier-table-scroll { overflow:visible; }
 .frontier #tabs table:has(.cell-label), .frontier #tabs table:has(.cell-label) > tbody { display:block; width:100%; min-width:0; }
 .frontier #tabs table:has(.cell-label) tr { display:block; padding:10px 0 14px; }
 .frontier #tabs table:has(.cell-label) td { display:block; width:100%; min-width:0; padding:0; text-align:left; overflow-wrap:anywhere; }
 .frontier #tabs table:has(.cell-label) td.cell-label { font-weight:650; margin-bottom:8px; }
 .frontier #tabs table:has(.cell-label) td.cell-spacer { display:none; }
 .frontier .character-related-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media(max-width:760px) {
 /* NOVA controls row visibility; layout must never override its hidden class. */
 .frontier #manifest :is(.frontier-manifest-table,table:has(tr.active),table:has(img.charimg)) > tbody > tr.hidden { display:none; }
 .frontier #manifest tr[hidden] { display:none!important; }
 .frontier #manifest tr[style*="display: table-row"], .frontier #manifest tr[style*="display: block"], .frontier #manifest tr[style*="display: grid"] { display:grid!important; }
 .frontier #manifest .frontier-manifest-table td:not(:has(img.charimg)):not([colspan="6"]) { grid-column:2; }
 .frontier #manifest .frontier-manifest-table tr.open td.col_150 { grid-column:1 / -1; }
}

/* Inherited frame base; Frontier red / blue overrides below. */
:root { --frontier-red:#287b83; --frontier-patch-gold:#355767; --frontier-panel:#0b1424; --frontier-line:#355767; --frontier-text:#eef3f6; --frontier-muted:#a9becd; --frontier-gold:#74d4d0; }
.frontier .frontier-site { border:2px solid transparent; background:linear-gradient(#000,#000) padding-box,#3385ff border-box; }
.frontier .frontier-site::after { display:none; }
.frontier-login .body { border:2px solid transparent; background:linear-gradient(#0b1424,#0b1424) padding-box,#3385ff border-box; box-shadow:0 20px 80px #0008; }

/* Starbase Frontier: red / blue frame and unaltered station artwork. */
.frontier .frontier-site { --frontier-banner-height:clamp(280px,32vw,480px); border:3px solid #3385ff; background:#000; }
.frontier .frontier-site::after { display:block; border:2px solid #df405c; border-radius:calc(var(--frontier-frame-radius) - 3px); }
.frontier header .background { width:100%; height:var(--frontier-banner-height); object-fit:contain; object-position:right center; }
.frontier header .gradient { height:var(--frontier-banner-height); background:linear-gradient(0deg,#000 0%,#000a 8%,transparent 30%),linear-gradient(90deg,#000 0%,#000b 22%,transparent 50%); }
.frontier header .top { min-height:var(--frontier-banner-height); }
.frontier .nav-main a.active,.frontier .ui-tabs .ui-tabs-nav li.ui-tabs-selected { background:#8b2035; border-color:#df405c; }
.frontier h2,.frontier h3 { color:#d7e8ff; }
.frontier .button-main { background:linear-gradient(#b8324b,#7d2034); border-color:#df405c; }
.frontier-login .body { border:3px solid #3385ff; background:#0b1424; box-shadow:inset 0 0 0 2px #df405c,0 20px 80px #0008; }
.frontier-login header .background { height:100%; object-fit:cover; }
@media(max-width:760px) {
 .frontier .frontier-site { --frontier-banner-height:calc((100vw - var(--frontier-gutter)*2 - 6px)*0.508333); }
 .frontier header .background,.frontier header .gradient { top:54px; height:var(--frontier-banner-height); }
 .frontier header .background { object-fit:contain; object-position:center; }
 .frontier header .gradient { background:linear-gradient(0deg,#000,transparent 30%); }
 .frontier header .top { min-height:0; padding-top:calc(var(--frontier-banner-height) + 76px); }
 .frontier header .top > .frontier-eyebrow { top:calc(var(--frontier-banner-height) + 54px); }
 .frontier-login header .background { top:0; height:100%; object-fit:cover; }
}

@media(min-width:761px) { .frontier:not(.frontier-login) header .background { mask-image:linear-gradient(90deg,transparent 0%,#000 22%,#000 100%); } }

/* Frontier 1.1: gold details complement the red and blue theme. */
:root { --frontier-gold:#e8c66b; }
.frontier a { color:#e8c66b; }
.frontier a:hover { color:#fff1c8; }
.frontier :focus-visible { outline-color:#e8c66b; }
.frontier h2,.frontier h3 { color:#f2d98f; }
.frontier .nav-main a.active { box-shadow:inset 0 -2px 0 #e8c66b; }
.frontier .ui-tabs .ui-tabs-nav li.ui-tabs-selected { border-bottom-color:#e8c66b; }
.frontier .button-main { border-color:#e8c66b; }
.frontier header .background { width:100%; object-fit:cover; object-position:right center; mask-image:none; }
@media(min-width:761px) { .frontier:not(.frontier-login) header .background { mask-image:none; } }
@media(max-width:760px) { .frontier:not(.frontier-login) header .background { object-fit:cover; object-position:right center; } }

@media(min-width:761px) { .frontier .frontier-site { --frontier-banner-height:calc((100vw - var(--frontier-gutter)*2 - 6px)/3); } }

/* Match the established Guinevere/Tokyo banner proportions. */
@media(min-width:761px) { .frontier .frontier-site { --frontier-banner-height:calc((100vw - var(--frontier-gutter)*2 - 6px)/4.5); } }
@media(max-width:760px) { .frontier .frontier-site { --frontier-banner-height:calc((100vw - var(--frontier-gutter)*2 - 6px)/3); } }

@media(min-width:761px) {
 .frontier:not(.frontier-login) header .background { object-fit:contain; object-position:right center; mask-image:linear-gradient(90deg,transparent 0%,#000 35%); }
 .frontier:not(.frontier-login) header .inner::before { display:block; content:""; position:absolute; top:0; left:0; width:100%; height:var(--frontier-banner-height); background:url('../images/banner.png?v=1.2') left center / cover no-repeat; clip-path:inset(0 60% 0 0); z-index:-3; border-radius:inherit; }
}

@media(min-width:761px) {
 .frontier:not(.frontier-login) header .background { mask-image:linear-gradient(90deg,transparent 0%,#000 60%); }
 .frontier:not(.frontier-login) header .inner::before { clip-path:none; mask-image:linear-gradient(90deg,#000 0%,#000 20%,transparent 50%); }
}