/* NJ Gymnastics shared design system.
   This file is safe for both the public package and the authenticated app. */
:root{
  --njg-navy:#03152b;
  --njg-navy-2:#071d35;
  --njg-navy-3:#0c2744;
  --njg-red:#f21f3b;
  --njg-red-dark:#c7112b;
  --njg-canvas:#f5f7f9;
  --njg-paper:#fff;
  --njg-text:#152b42;
  --njg-muted:#536476;
  --njg-border:#d7dfe6;
  --njg-serif:"Roboto Slab",Georgia,serif;
  --njg-sans:"DM Sans",Arial,sans-serif;
}

/* The authenticated shell consumes the exact public-site palette and type. */
body.njg-studio,.njg-experience{
  --experience-ink:var(--njg-navy);
  --experience-red:var(--njg-red);
  --experience-line:var(--njg-border);
  --experience-paper:var(--njg-paper);
  --experience-canvas:var(--njg-canvas);
  --njg-ink:var(--njg-text);
  --njg-midnight:var(--njg-navy);
  --njg-crimson:var(--njg-red);
  --njg-line:var(--njg-border);
  --brand-body:var(--njg-sans);
  --brand-display:var(--njg-serif);
  font-family:var(--njg-sans);
}
.njg-experience :is(button,input,select,textarea,table){font-family:var(--njg-sans)}
.njg-experience :is(h1,h2,h3,h4,.pagehead h1,.landing-masthead h1,.fan-center-header h1,.news-masthead h1,.member-account-hero h1){font-family:var(--njg-serif)!important;font-weight:800!important}

/* Public-style masthead, tightened for application use. */
.njg-signature.njg-experience[data-page] .experience-header{background:var(--njg-navy);border-bottom:3px solid var(--njg-red)}
.njg-signature.njg-experience[data-page] .experience-edition{min-height:28px;padding-block:6px;background:#020e1b;color:#c9d3de}
.njg-signature.njg-experience[data-page] .topbar{height:78px;min-height:78px;background:var(--njg-navy);color:#fff}
.njg-signature.njg-experience[data-page] .experience-brand{flex-basis:230px}
.njg-signature.njg-experience[data-page] .experience-brand img{width:230px;max-height:58px}
.njg-signature.njg-experience[data-page] .experience-journeys button{color:#e3e9ef;font-weight:700}
.njg-signature.njg-experience[data-page] .experience-journeys button small{color:#9dabb9}
.njg-signature.njg-experience[data-page] .experience-journeys button.active{color:#fff}
.njg-signature.njg-experience[data-page] .experience-journeys button:after{background:var(--njg-red)}
.njg-signature.njg-experience[data-page] .experience-find{background:#ffffff10;border-color:#ffffff30;color:#fff}
.njg-signature.njg-experience[data-page] .experience-find:hover{background:#ffffff1d;border-color:var(--njg-red)}
.njg-signature.njg-experience[data-page] .experience-find kbd{color:#dce5ee;border-color:#ffffff45}
.njg-signature.njg-experience[data-page] .hub-account-menu summary{color:#fff}
.njg-signature.njg-experience[data-page] .hub-account-initial{background:var(--njg-red);color:#fff}
.njg-signature.njg-experience[data-page] .experience-sectionbar{max-width:none;padding-inline:max(32px,calc((100% - 1360px)/2));min-height:46px;background:#fff;border-top:0}
.njg-signature.njg-experience[data-page] .experience-sectionbar a{min-height:46px}
.njg-signature.njg-experience[data-page] .experience-sectionbar a:hover,.njg-signature.njg-experience[data-page] .experience-sectionbar a.active{color:var(--njg-red)}
.njg-signature.njg-experience[data-page] .experience-sectionbar a.active:after{background:var(--njg-red)}

/* Shared compact photo heroes. Images remain public brand assets only. */
.experience-page-hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:285px;overflow:hidden;background:var(--njg-navy) center/cover no-repeat;color:#fff}
.experience-page-hero:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(1,10,23,.98) 0%,rgba(3,17,34,.88) 34%,rgba(3,17,34,.2) 76%),linear-gradient(0deg,rgba(3,17,34,.72),transparent 55%)}
.experience-page-hero-results,.experience-page-hero-schedule,.experience-page-hero-news{background-image:url("njg-results-hero-v17-natural.jpg");background-position:center 48%}
.experience-page-hero-programs{background-image:url("njg-team-hero-v17-natural.jpg");background-position:center 47%}
.experience-page-hero-qualification{background-image:url("njg-rankings-hero-v17-natural.jpg");background-position:center 45%}
.experience-page-hero-athlete{background-image:url("njg-recruiting-hero-v17-natural.jpg");background-position:center 45%}
.experience-page-hero-resources{background-image:url("njg-team-bars-v16-natural.jpg");background-position:center 47%}
.experience-page-hero-inner{width:min(1360px,100%);margin:0 auto;padding:42px 32px 38px}
.experience-page-hero .experience-hero-kicker{display:block;margin:0 0 10px;color:#ff6075;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.experience-page-hero h1{max-width:750px;margin:0;font-family:var(--njg-serif)!important;font-size:clamp(42px,5vw,68px);line-height:.98;letter-spacing:-.055em;color:#fff;font-weight:800!important}
.experience-page-hero h1 em{font-style:normal;color:var(--njg-red)}
.experience-page-hero p{max-width:660px;margin:14px 0 0;color:#e8edf3;font-size:15px;line-height:1.55}

/* Content surfaces inherit the public site's sharper editorial rhythm. */
.njg-signature.njg-experience[data-page] .content{max-width:1424px;padding-top:28px}
.njg-signature.njg-experience .pagehead{border-bottom:2px solid var(--njg-navy)}
.njg-signature.njg-experience .eyebrow{color:var(--njg-red);font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.njg-signature.njg-experience .btn{font-weight:800!important}
.njg-signature.njg-experience .btn.primary{background:var(--njg-red);border-color:var(--njg-red)}
.njg-signature.njg-experience .btn.primary:hover{background:var(--njg-red-dark);border-color:var(--njg-red-dark)}
.njg-signature.njg-experience :is(.card,.judgebox,.resource-card,.score-runner-main,.desk-attempt){border-radius:9px!important}
.njg-signature.njg-experience :is(input,select,textarea):focus-visible{outline-color:#f21f3b35!important;border-color:var(--njg-red)!important}
.njg-experience :is(button,a,summary):focus-visible{outline-color:var(--njg-red)}
.njg-signature.njg-experience .experience-footer strong{font-family:var(--njg-serif);color:var(--njg-navy)}
.njg-signature.njg-experience .experience-footer button{color:var(--njg-red)}

/* Account entry now uses the same exact brand primitives as the public site. */
body.njg-studio .login-screen{font-family:var(--njg-sans)}
body.njg-studio .login-screen :is(h1,h2,h3){font-family:var(--njg-serif)!important;font-weight:800!important}
body.njg-studio .login-brand-side{background:var(--njg-navy)}
body.njg-studio .login-brand-center h1 em{color:#ff6075}
body.njg-studio .login-enter{background:var(--njg-red);border-color:var(--njg-red)}

@media(max-width:1000px){
  .njg-signature.njg-experience[data-page] .experience-brand{flex-basis:180px}
  .njg-signature.njg-experience[data-page] .experience-brand img{width:180px}
}
@media(max-width:760px){
  .njg-signature.njg-experience[data-page] .experience-edition{padding-inline:18px}
  .njg-signature.njg-experience[data-page] .topbar{height:68px;min-height:68px;background:var(--njg-navy)}
  .njg-signature.njg-experience[data-page] .experience-sectionbar{padding-inline:18px}
  .experience-page-hero{min-height:245px;background-position:60% center}
  .experience-page-hero-inner{padding:38px 22px 30px}
  .experience-page-hero h1{font-size:clamp(38px,10vw,52px);max-width:520px}
  .experience-page-hero p{font-size:13px;max-width:460px}
  .njg-signature.njg-experience[data-page] .content{padding:23px 18px 90px}
}
@media(max-width:520px){
  .experience-page-hero{min-height:225px}
  .experience-page-hero h1{font-size:39px}
  .experience-page-hero p{font-size:12px}
}

/* Shared component values for public pages and operational workspaces. */
:root {
  --njg-panel:#0b1e35;
  --njg-panel-raised:#10263f;
  --njg-field:#06172c;
  --njg-copy:#eef3f8;
  --njg-secondary:#bbc9d8;
  --njg-stroke:rgba(255,255,255,.16);
  --njg-accent-copy:#ff8a9b;
  --njg-action:linear-gradient(135deg,#d91e39,#bd132f);
  --njg-radius:10px;
}

/* Persistent account shortcuts, shared by public pages and the member workspace. */
.site-header .brand {order:0}
.site-header .primary-nav {order:1;margin-left:auto}
.site-header .header-tools {order:2;display:flex;align-items:center;gap:4px;margin-left:20px;flex-shrink:0}
.site-header .menu-toggle {order:3;flex-shrink:0}
.site-header .header-tool {display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.2);border-radius:50%;color:#fff;text-decoration:none;background:rgba(255,255,255,.04)}
.site-header .header-tool[hidden] {display:none}
.site-header .header-tool svg {width:21px;height:21px}
.site-header .header-tool:hover {background:#173957;border-color:#ff6479;color:#fff}
.site-header .header-tool:focus-visible {outline:3px solid #fff;outline-offset:3px}
@media (min-width:1181px) and (max-width:1400px) {
 .site-header .primary-nav,body.njg-studio .site-header .primary-nav {gap:20px}
 .site-header .brand img {width:220px}
}
@media (max-width:1180px) {
 .site-header,body.njg-studio .site-header {height:68px;min-height:68px;padding:0 18px}
 .site-header .brand img,body.njg-studio .site-header .brand img {width:174px}
 .site-header .menu-toggle,body.njg-studio .site-header .menu-toggle {display:block}
 .site-header .header-tools {margin-left:auto;margin-right:6px}
 .site-header .primary-nav,body.njg-studio .site-header .primary-nav {position:absolute;top:68px;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:12px 24px 25px;background:#03152b;border-bottom:3px solid #e82446}
 .site-header .primary-nav.open,body.njg-studio .site-header .primary-nav.open {display:flex}
 .site-header .primary-nav>a,body.njg-studio .site-header .primary-nav>a {padding:14px}
 .site-header .nav-rule {display:none}
}
@media (max-width:380px) {
 .site-header,body.njg-studio .site-header {padding:0 10px}
 .site-header .brand img,body.njg-studio .site-header .brand img {width:140px}
 .site-header .menu-toggle {padding:4px}
 .site-header .menu-toggle span:not(.sr-only) {width:22px;margin:5px 3px}
 .site-header .header-tools {gap:2px;margin-right:2px}
}

.site-header .header-messaging {position:relative;overflow:visible}
.site-header .mail-unread-badge {position:absolute;top:-5px;right:-6px;min-width:20px;height:20px;padding:0 5px;border:2px solid #03152b;border-radius:999px;display:flex;align-items:center;justify-content:center;background:#e82446;color:#fff;font:800 11px/1 Arial,sans-serif;pointer-events:none}
.site-header .mail-unread-badge[hidden] {display:none}

/* Readable public pages: compact data sections and photos sized by their height. */
body.interior-page .page-hero.site-photo-hero,body.interior-page .meet-hero.site-photo-hero,body .hero.site-photo-hero {isolation:isolate;display:flex;position:relative;min-height:240px;height:auto;background:#03152b;align-items:center;overflow:hidden}
body .site-photo-hero img.site-hero-photo {position:absolute;inset:0 0 0 auto;width:auto;max-width:none;height:100%;object-fit:contain;object-position:right top;filter:none}
body .site-photo-hero :is(.page-hero-shade,.meet-hero-shade,.hero-shade) {position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#03152b 0%,#03152b 36%,transparent 65%)}
body .site-photo-hero :is(.page-hero-copy,.meet-hero-copy,.hero-copy) {position:relative;z-index:2;flex:0 0 45%;width:45%;max-width:none;margin:0;padding:30px 0 30px max(24px,5vw)}
body .site-photo-hero :is(.page-hero-copy,.meet-hero-copy,.hero-copy) h1 {font-size:clamp(32px,4vw,56px);line-height:1.1;margin:0;max-width:none}
body .site-photo-hero :is(.page-hero-copy,.meet-hero-copy) p:last-child {font-size:14px;line-height:1.5;margin:12px 0 0;max-width:420px}
body .home-photo-hero.hero {min-height:380px}
body .home-photo-hero .hero-tag {display:none}
body .home-photo-hero .hero-copy {padding-bottom:32px}
body .home-photo-hero .hero-deck {font-size:15px;margin:16px 0}
body .home-photo-hero .hero-actions {gap:10px;margin:0;max-width:470px}
body .home-photo-hero .hero-actions .button {padding:12px 16px;min-height:44px;font-size:12px}
body.interior-page .page-shell {padding-top:24px;padding-bottom:40px}
body.interior-page .page-shell::before {display:none}
.site-data-meta {max-width:1390px;margin:0 auto 16px;color:#b7c5d2;font-size:12px;line-height:1.6}
.site-data-details {max-width:1390px;margin:18px auto 0;padding:16px 0;border-top:1px solid #ffffff24;color:#b7c5d2;font-size:12px;line-height:1.6}
.site-data-details summary,.profile-directory-details summary {cursor:pointer;font-weight:700;min-height:24px}
.site-data-details p {max-width:820px;margin:12px 0 0}
.site-data-details a {color:inherit}
body .shore-feature.shore-feature-compact {margin:20px max(16px,5vw);padding:16px 20px;display:block}
.shore-feature-compact .shore-feature-copy {display:grid;grid-template-columns:1fr auto;column-gap:24px;align-items:center}
.shore-feature-compact .shore-feature-copy h2 {font-size:21px;margin:3px 0 6px;line-height:1.3}
.shore-feature-compact .shore-feature-copy p {font-size:12px;line-height:1.5;margin:0;grid-column:1}
.shore-feature-compact .shore-feature-copy a {grid-column:2;grid-row:1/4;white-space:nowrap;font-size:12px}
.home-coverage {margin:0 max(16px,5vw) 20px}
body .home-data-visual,body .latest-news-section {padding-top:24px;padding-bottom:24px}
body .latest-news-section .public-data-heading h2 {font-size:30px;margin:0}
body .public-metrics {margin-top:12px}
body .public-metrics article {padding:14px;min-height:0}
body .public-metrics strong {font-size:26px}
/* Profiles keep people beside, rather than behind, school identity and points. */
body .profile-hero {position:relative;background:#03152b;min-height:240px;overflow:hidden}
body .profile-hero .profile-scene-photo {position:absolute;right:0;top:0;width:45%;height:100%;object-fit:contain;object-position:right top}
body .profile-hero .profile-hero-inner {width:55%;margin:0;padding:24px max(20px,4vw)}
body .profile-hero .team-hero-grid {grid-template-columns:1fr;gap:16px}
body .profile-hero .profile-identity {gap:16px}
body .profile-hero .profile-identity h1 {font-size:clamp(26px,3vw,42px);line-height:1.15}
body .profile-hero #team-profile-school {font-size:20px;line-height:1.35}
body .profile-hero .back-link {margin-bottom:16px}
body .profile-hero .profile-mark {width:76px;height:76px;flex-basis:76px}
body .profile-hero .hero-ranking-metrics {gap:12px}
body .profile-hero .hero-ranking-metrics article {padding:12px}
body .profile-hero .hero-ranking-metrics strong {font-size:28px}
.profile-directory-details {margin-top:12px;font-size:12px;line-height:1.6;color:#c8d5df}
body .performance-snapshot>details {padding:16px 0;color:#153b59;border-color:#dce4ec}
body .performance-snapshot>details .performance-metrics {margin-top:16px}
body .performance-snapshot>.viz-panel {margin-bottom:0}
body .athlete-summary {margin:16px 0}
body .athlete-access-details {margin-bottom:18px}
@media(max-width:1100px){
 body .profile-hero .profile-scene-photo {position:static;display:block;width:100%;height:190px;object-fit:contain;object-position:right top;background:#03152b}
 body .profile-hero .profile-hero-inner {width:100%;padding:20px max(18px,4vw)}
}
@media(max-width:700px){
 body.interior-page .page-hero.site-photo-hero,body.interior-page .meet-hero.site-photo-hero,body .hero.site-photo-hero {min-height:0;display:flex;flex-direction:column;align-items:stretch}
 body .site-photo-hero img.site-hero-photo {position:static;display:block;flex:none;width:100%;height:max(150px,40vw);object-fit:cover;object-position:right top}
 body .home-photo-hero img.site-hero-photo {height:auto;aspect-ratio:1672/941;object-fit:contain}
 body .site-photo-hero :is(.page-hero-shade,.meet-hero-shade,.hero-shade) {display:none}
 body .site-photo-hero :is(.page-hero-copy,.meet-hero-copy,.hero-copy) {flex:none;width:100%;padding:18px 20px 22px;margin:0}
 body .site-photo-hero :is(.page-hero-copy,.meet-hero-copy,.hero-copy) h1 {font-size:32px}
 body .site-photo-hero .eyebrow {font-size:9px;margin-bottom:10px}
 body .site-photo-hero :is(.page-hero-copy,.meet-hero-copy) p:last-child {font-size:13px;margin-top:10px}
 body .home-photo-hero .hero-copy h1 br {display:none}
 body .home-photo-hero .hero-copy h1 {font-size:30px;line-height:1.2}
 body .home-photo-hero .hero-deck {font-size:13px;margin:12px 0}
 body .home-photo-hero .hero-actions {flex-direction:row;max-width:none;flex-wrap:wrap}
 body .home-photo-hero .hero-actions .button {width:auto;padding:10px 12px;font-size:11px}
 body.interior-page .page-shell {padding:20px 16px 32px}
 .site-data-meta {font-size:11px;margin-bottom:12px}
 body .shore-feature.shore-feature-compact {padding:14px 16px}
 .shore-feature-compact .shore-feature-copy {display:block}
 .shore-feature-compact .shore-feature-copy h2 {font-size:19px}
 .shore-feature-compact .shore-feature-copy a {display:inline-block;margin-top:12px}
 body .profile-hero .profile-scene-photo {height:max(150px,40vw);object-fit:cover;object-position:right top}
 body .profile-hero .profile-hero-inner {padding:18px 16px}
 body .profile-hero .profile-mark {width:60px;height:60px;flex-basis:60px}
 body .profile-hero #team-profile-school {font-size:17px}
 body .profile-hero .hero-ranking-metrics article {padding:10px}
 body .profile-hero .hero-ranking-metrics strong {font-size:25px}
}
body.interior-page:not(.meet-center-page) .page-shell::before {content:none;display:none}
body .home-data-visual {max-width:none;margin:0;padding:24px max(16px,5vw)}
body .shore-feature-compact .shore-feature-primary {display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;background:#d7193f;color:#fff;border-radius:6px;text-decoration:none;font-weight:700}
body .team-card,body .athlete-card {min-width:0}
body .team-card>div,body .athlete-card>div {min-width:0}
body .team-card h3,body .athlete-card h3 {overflow-wrap:anywhere}
@media(max-width:600px){body .team-card {grid-template-columns:52px minmax(0,1fr)}body .team-grid,body .athlete-grid {grid-template-columns:minmax(0,1fr)}}
body .profile-hero {display:block}

body .team-card[hidden],body .athlete-card[hidden] {display:none}
