:root {
  --bg: #05080d;
  --bg-soft: #080d14;
  --panel: #0b121c;
  --panel-2: #0e1723;
  --panel-3: #101c2a;
  --line: #1b2b3d;
  --line-strong: #27435f;
  --text: #f4f8fc;
  --muted: #8fa1b4;
  --blue: #1976c9;
  --blue-bright: #2b96ee;
  --blue-deep: #0e4f8a;
  --silver: #b8c4d2;
  --danger: #e45461;
  --success: #35b97f;
  --warning: #e5b24c;
  --radius: 14px;
  --radius-sm: 9px;
  --shadow: 0 18px 60px rgba(0,0,0,.25);
  --content: 1240px;
}
* { box-sizing: border-box; }
html { background: var(--bg); color-scheme: dark; }
body { margin: 0; background: radial-gradient(circle at 70% 0%, rgba(25,118,201,.09), transparent 32rem), var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.55; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button, a, input, textarea, select { -webkit-tap-highlight-color: transparent; }
img { max-width: 100%; }
code { font-family: "SFMono-Regular", Consolas, monospace; color: #a9d8ff; }
.site-shell { min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; }
.topbar { position: sticky; z-index: 50; top: 0; min-height: 72px; padding: 10px max(20px, calc((100vw - var(--content))/2)); display: flex; align-items: center; justify-content: space-between; gap: 22px; background: rgba(5,8,13,.92); border-bottom: 1px solid rgba(39,67,95,.5); backdrop-filter: blur(18px); }
.brand { display: flex; align-items: center; gap: 10px; min-width: max-content; }
.brand img { width: 45px; height: 45px; object-fit: contain; }
.brand span { display: grid; line-height: 1.05; }
.brand strong { font-size: .98rem; letter-spacing: .02em; }
.brand small { color: var(--muted); font-size: .68rem; margin-top: 5px; }
.main-nav { display: flex; align-items: center; justify-content: flex-end; gap: 18px; color: var(--muted); font-size: .9rem; }
.main-nav > a:not(.button):hover { color: var(--text); }
.nav-separator { width: 1px; height: 24px; background: var(--line); }
.mobile-menu-btn { display: none; background: transparent; border: 1px solid var(--line); color: var(--text); border-radius: 8px; width: 42px; height: 42px; }
.inline-form { display: inline-flex; margin: 0; }
.notification-link { position: relative; }
.notification-count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 4px; background: var(--blue); color: white; font-size: .68rem; border-radius: 99px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 18px; background: linear-gradient(180deg, #278add, #1767ad); border: 1px solid #3999e7; color: #fff; border-radius: 9px; font-weight: 750; letter-spacing: .01em; cursor: pointer; box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
.button:hover { background: linear-gradient(180deg, #3198e8, #1a70bb); }
.button.ghost { background: #0b131e; color: #cfe9ff; border-color: var(--line-strong); box-shadow: none; }
.button.small { min-height: 36px; padding: 0 13px; font-size: .82rem; }
.full-button { width: 100%; margin-top: 16px; }
.text-button { background: transparent; color: #a8c8e6; border: 0; padding: 7px 8px; cursor: pointer; }
.text-button.danger { color: #ff8791; }
.button-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.footer { max-width: var(--content); width: calc(100% - 40px); margin: 50px auto 0; padding: 26px 0 40px; display: flex; justify-content: space-between; gap: 30px; border-top: 1px solid var(--line); color: var(--muted); font-size: .84rem; }
.footer strong { color: var(--text); }
.footer p { margin: 4px 0 0; }
.footer-links { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 18px; }
.section, .team-page, .page-hero { width: min(var(--content), calc(100% - 40px)); margin: 0 auto; }
.section { padding: 76px 0; }
.page-hero { padding: 76px 0 20px; }
.page-hero.compact { max-width: 900px; margin-left: max(20px, calc((100vw - var(--content))/2)); }
.page-hero h1, .page-title-row h1 { font-size: clamp(2rem, 4vw, 4.1rem); line-height: .98; letter-spacing: -.04em; margin: 8px 0 16px; }
.page-hero p, .page-title-row p { color: var(--muted); max-width: 720px; margin: 0; font-size: 1.05rem; }
.section-kicker, .eyebrow, .admin-label, .mechanical-mark { color: #61b3f4; font-family: "SFMono-Regular", Consolas, monospace; font-size: .72rem; letter-spacing: .15em; text-transform: uppercase; }
.hero { width: min(var(--content), calc(100% - 40px)); min-height: calc(100svh - 72px); margin: 0 auto; display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: clamp(30px, 6vw, 90px); padding: 70px 0; position: relative; overflow: hidden; }
.hero-grid-pattern { position: absolute; inset: 0; pointer-events: none; opacity: .12; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to right, black, transparent 74%); }
.hero-copy, .hero-visual { position: relative; z-index: 1; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 99px; background: rgba(10,19,30,.7); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #42b4ff; box-shadow: 0 0 14px rgba(66,180,255,.8); }
.hero h1 { font-size: clamp(3.15rem, 7vw, 6.7rem); line-height: .85; letter-spacing: -.065em; max-width: 780px; margin: 25px 0; }
.hero p { max-width: 680px; color: #aab9c8; font-size: clamp(1rem, 1.5vw, 1.2rem); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.language-switch { display: inline-flex; gap: 4px; margin-top: 34px; padding: 4px; border: 1px solid var(--line); border-radius: 8px; }
.language-switch a { padding: 6px 9px; color: var(--muted); border-radius: 5px; font-weight: 800; font-size: .75rem; }
.language-switch a.active { background: var(--panel-3); color: white; }
.hero-visual { display: grid; place-items: center; }
.logo-stage { width: min(500px, 88vw); aspect-ratio: 1; display: grid; place-items: center; position: relative; background: radial-gradient(circle, rgba(25,118,201,.16), rgba(5,8,13,.15) 58%, transparent 70%); }
.hex-frame { clip-path: polygon(25% 4%, 75% 4%, 98% 50%, 75% 96%, 25% 96%, 2% 50%); border: 0; }
.logo-stage::before { content: ""; position: absolute; inset: 8%; clip-path: polygon(25% 4%, 75% 4%, 98% 50%, 75% 96%, 25% 96%, 2% 50%); border: 1px solid transparent; background: linear-gradient(135deg, #244969, #0d1b29 40%, #1976c9 85%) border-box; -webkit-mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: .8; }
.hero-logo { width: 63%; filter: drop-shadow(0 18px 24px rgba(0,0,0,.45)); }
.mechanical-mark { position: absolute; bottom: 12%; color: #65829d; }
.split-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(30px,6vw,100px); align-items: start; }
.section h2 { font-size: clamp(1.8rem, 3vw, 3.3rem); line-height: 1; letter-spacing: -.035em; margin: 10px 0 18px; }
.lead { color: var(--muted); font-size: 1.12rem; max-width: 580px; }
.feature-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.feature-card { min-height: 190px; padding: 20px; background: linear-gradient(155deg, rgba(16,28,42,.95), rgba(8,14,22,.95)); border: 1px solid var(--line); border-radius: var(--radius); }
.feature-card h3 { margin: 36px 0 5px; }
.feature-card p { color: var(--muted); margin: 0; font-size: .9rem; }
.feature-index { color: #4ea9ef; font-family: monospace; font-size: .72rem; border: 1px solid #22405a; padding: 4px 7px; border-radius: 6px; }
.school-strip { display: grid; grid-template-columns: 220px 1fr; gap: 45px; align-items: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.school-logo-wrap { min-height: 220px; display: grid; place-items: center; background: radial-gradient(circle, rgba(27,105,168,.14), transparent 68%); }
.school-logo-wrap img { width: 175px; max-height: 205px; object-fit: contain; }
.school-strip p { color: var(--muted); max-width: 700px; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-bottom: 26px; }
.section-heading p { max-width: 430px; color: var(--muted); }
.public-member-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.public-member-card { --rank-color: var(--blue); display: flex; align-items: center; gap: 13px; min-width: 0; padding: 16px; background: var(--panel); border: 1px solid color-mix(in srgb, var(--rank-color) 48%, var(--line)); border-left: 3px solid var(--rank-color); border-radius: var(--radius-sm); }
.public-member-card h3 { margin: 0; font-size: .96rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.public-member-card span { color: var(--muted); font-size: .75rem; }
.avatar { flex: none; display: inline-grid; place-items: center; object-fit: cover; border-radius: 50%; border: 1px solid #284761; background: var(--panel-2); }
.avatar-sm { width: 34px; height: 34px; font-size: .68rem; }
.avatar-md { width: 46px; height: 46px; }
.avatar-lg { width: 62px; height: 62px; font-size: .9rem; }
.avatar-xl { width: 108px; height: 108px; font-size: 1.4rem; }
.avatar-fallback { background: var(--avatar-bg); color: #e9f3fa; font-weight: 850; }
.gallery-grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 12px; }
.gallery-grid figure, .gallery-placeholder { min-height: 280px; margin: 0; position: relative; overflow: hidden; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); }
.gallery-grid figure:first-child { grid-row: span 2; min-height: 570px; }
.gallery-grid img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gallery-grid figcaption { position: absolute; left: 12px; bottom: 12px; background: rgba(4,8,13,.8); padding: 6px 9px; border-radius: 6px; font-size: .78rem; }
.gallery-placeholder { display: grid; place-content: center; text-align: center; color: var(--muted); }
.gallery-placeholder span { color: #3c8cc9; font-size: 2rem; font-family: monospace; }
.gallery-placeholder.technical { background: linear-gradient(135deg, #09121c, #0b1d2d); }
.sponsor-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.sponsor-card { min-height: 125px; display: grid; place-items: center; gap: 8px; padding: 18px; background: #091019; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); text-align: center; }
.sponsor-card img { max-height: 64px; max-width: 160px; object-fit: contain; }
.cta-panel { padding: 34px; display: flex; align-items: center; justify-content: space-between; gap: 28px; background: linear-gradient(135deg, #0e1d2c, #071019 65%); border: 1px solid #1e4261; border-radius: 18px; }
.cta-panel p { color: var(--muted); margin: 0; }
.empty-state { padding: 28px; border: 1px dashed #29425a; background: rgba(9,16,25,.45); border-radius: 10px; color: var(--muted); text-align: center; }
.timeline { display: grid; gap: 0; max-width: 800px; }
.timeline article { display: grid; grid-template-columns: 120px 1fr; gap: 30px; border-left: 1px solid #29506f; padding: 0 0 55px 30px; position: relative; }
.timeline article::before { content:""; position:absolute; width:9px; height:9px; left:-5px; top:8px; background:var(--blue-bright); border-radius:50%; }
.timeline article > span { color: #64b2ef; font-family: monospace; }
.timeline h3 { margin: 0 0 7px; font-size: 1.4rem; }
.timeline p { margin: 0; color: var(--muted); }
.timeline .muted { opacity: .5; }
.info-panel, .panel { background: linear-gradient(160deg, rgba(15,24,36,.96), rgba(8,14,22,.98)); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; box-shadow: 0 1px 0 rgba(255,255,255,.02) inset; }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.large-link { font-size: clamp(1.2rem, 3vw, 2rem); color: #79c3ff; word-break: break-word; }
.social-list { display: grid; gap: 8px; }
.social-list a, .social-list span { padding: 10px 0; border-bottom: 1px solid var(--line); color: var(--muted); }
.prose { max-width: 800px; margin-left: max(20px, calc((100vw - var(--content))/2)); }
.prose p { color: var(--muted); }
.narrow { max-width: 760px; }
.honeypot { position: absolute !important; left: -10000px !important; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.form-grid label, label { display: grid; gap: 6px; }
.form-grid label > span, label > span, fieldset legend { color: #a7b7c7; font-size: .78rem; font-weight: 700; }
.full { grid-column: 1 / -1; }
input, textarea, select { width: 100%; min-height: 42px; border: 1px solid #26394d; border-radius: 8px; background: #080f17; color: var(--text); padding: 9px 11px; outline: none; }
textarea { resize: vertical; }
input:focus, textarea:focus, select:focus { border-color: #2c83c9; box-shadow: 0 0 0 3px rgba(44,131,201,.12); }
input[type="checkbox"] { width: 16px; min-height: 16px; accent-color: var(--blue-bright); }
input[type="color"] { width: 45px; min-height: 38px; padding: 3px; }
input[type="file"] { padding: 7px; }
fieldset { border: 1px solid var(--line); border-radius: 9px; padding: 13px; margin: 0; }
fieldset legend { padding: 0 7px; }
.form-actions { display: flex; justify-content: flex-end; }
.notice { padding: 14px 16px; margin-bottom: 14px; border-radius: 9px; border: 1px solid var(--line); color: #c8d8e7; background: #0a141f; }
.notice.warning { border-color: #6f5524; background: #1b160a; }
.notice.info { border-color: #24577e; background: #07182a; }
.flash-stack { position: fixed; z-index: 100; top: 82px; right: 16px; width: min(410px, calc(100% - 32px)); display: grid; gap: 8px; }
.flash { padding: 12px 14px; border: 1px solid var(--line-strong); background: #0b1722; box-shadow: var(--shadow); border-radius: 9px; }
.flash.success { border-color: #276648; }
.flash.error { border-color: #74353b; }
.flash.info { border-color: #2a5578; }
.auth-shell { width: min(1120px, calc(100% - 40px)); min-height: calc(100vh - 72px); margin: 0 auto; padding: 70px 0; display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 70px; }
.auth-panel { max-width: 490px; }
.auth-panel h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); line-height: .92; letter-spacing: -.05em; margin: 12px 0 18px; }
.auth-panel > p { color: var(--muted); margin-bottom: 26px; }
.google-button { width: 100%; gap: 10px; }
.google-button span { width: 24px; height: 24px; display: grid; place-items: center; background: white; color: #1b1b1b; border-radius: 50%; font-weight: 900; }
.demo-login-box { margin-top: 22px; border-top: 1px solid var(--line); padding-top: 20px; color: var(--muted); }
.demo-login-box > span { font-family: monospace; font-size: .7rem; letter-spacing: .1em; }
.demo-buttons { display: flex; flex-wrap: wrap; gap: 7px; margin: 9px 0; }
.auth-visual { min-height: 520px; display: grid; place-items: center; position: relative; background: radial-gradient(circle, rgba(23,118,201,.16), transparent 55%); }
.auth-visual img { width: 60%; }
.auth-visual span { position: absolute; bottom: 13%; font: .72rem monospace; letter-spacing: .14em; color: #4d7392; }
.team-page { padding: 28px 0 70px; }
.team-nav { display: flex; align-items: center; gap: 4px; margin-bottom: 38px; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.team-nav a { padding: 11px 14px; color: var(--muted); font-size: .86rem; white-space: nowrap; border-bottom: 2px solid transparent; }
.team-nav a.active, .team-nav a:hover { color: white; border-bottom-color: var(--blue-bright); }
.dashboard-hero, .profile-header { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 30px; border: 1px solid #1f3d58; border-radius: 17px; background: linear-gradient(125deg, #0c1b29, #081018 70%); }
.member-identity, .profile-header { display: flex; align-items: center; gap: 20px; }
.member-identity h1, .profile-header h1 { margin: 5px 0 9px; font-size: clamp(1.9rem, 4vw, 3.4rem); letter-spacing: -.04em; }
.tag-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.rank-tag, .dept-tag { display: inline-flex; align-items: center; min-height: 25px; padding: 3px 8px; border-radius: 6px; font-size: .7rem; font-weight: 750; }
.rank-tag { --rank-color: #3b82f6; color: color-mix(in srgb, var(--rank-color) 75%, white); background: color-mix(in srgb, var(--rank-color) 16%, transparent); border: 1px solid color-mix(in srgb, var(--rank-color) 46%, transparent); }
.dept-tag { --dept-color: #1e88e5; color: color-mix(in srgb, var(--dept-color) 50%, #c8dceb); background: color-mix(in srgb, var(--dept-color) 7%, #0c1823); border: 1px solid color-mix(in srgb, var(--dept-color) 27%, #21394e); }
.dept-tag.neutralized { --dept-color: #667684 !important; color: #9aa8b4; background: #101820; border-color: #293642; }
.score-module { min-width: 155px; display: grid; text-align: right; }
.score-module span { color: var(--muted); font: .68rem monospace; letter-spacing: .1em; }
.score-module strong { font-size: 3.2rem; line-height: 1; color: #7ec7ff; }
.score-module small { color: var(--muted); }
.stat-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 12px 0; }
.stat-card { min-height: 104px; display: flex; flex-direction: column; justify-content: space-between; padding: 16px; background: #09111a; border: 1px solid var(--line); border-radius: 10px; }
.stat-card span { color: var(--muted); font-size: .78rem; }
.stat-card strong { font-size: 2rem; letter-spacing: -.04em; }
.small-stat { font-size: 1.1rem !important; }
.dashboard-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.panel-heading h2 { margin: 0; font-size: 1.05rem; }
.panel-heading a, .panel-heading > span { color: #76baf0; font-size: .78rem; }
.list-stack { display: grid; }
.list-row { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); }
.list-row:first-child { border-top: 0; }
.list-row small { display: block; color: var(--muted); margin-top: 2px; }
.list-row > span { color: #85c9ff; font-weight: 800; }
.list-row.clickable { margin: 0 -8px; padding: 0 8px; border-radius: 7px; }
.list-row.clickable:hover { background: #0b1722; }
.mini-person { display: flex; align-items: center; gap: 9px; min-width: 0; }
.page-title-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin: 0 0 24px; }
.page-title-row h1 { font-size: clamp(2.3rem,4vw,4rem); margin-bottom: 8px; }
.filter-bar { display: grid; grid-template-columns: 1.5fr 1fr 1fr auto; gap: 8px; padding: 10px; margin-bottom: 15px; background: #080f17; border: 1px solid var(--line); border-radius: 10px; }
.member-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
.member-card { --rank-color: var(--blue); min-width: 0; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; padding: 17px; background: var(--panel); border: 1px solid color-mix(in srgb, var(--rank-color) 28%, var(--line)); border-left: 3px solid var(--rank-color); border-radius: 11px; }
.member-card:hover { background: #0d1824; }
.member-card h3 { margin: 0 0 6px; }
.member-card p { margin: 8px 0 0; color: var(--muted); font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 460px; }
.member-card-score { display: grid; text-align: right; }
.member-card-score strong { font-size: 1.6rem; }
.member-card-score span { color: var(--muted); font-size: .7rem; }
.profile-header { --rank-color: var(--blue); border-left: 4px solid var(--rank-color); }
.profile-main { flex: 1; }
.profile-main p { max-width: 620px; color: var(--muted); }
.detail-list { display: grid; }
.detail-list > div { display: flex; justify-content: space-between; gap: 15px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.detail-list span { color: var(--muted); }
.profile-edit-preview { display: flex; align-items: center; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.profile-edit-preview div { display: grid; }
.profile-edit-preview span { color: var(--muted); }
.ranking-list { max-width: 850px; display: grid; gap: 5px; }
.ranking-row { display: grid; grid-template-columns: 54px 36px 1fr auto; align-items: center; gap: 10px; min-height: 65px; padding: 9px 13px; background: #09111a; border: 1px solid var(--line); border-radius: 8px; }
.ranking-row.is-you { border-color: #2e76aa; background: #0a1824; }
.ranking-number { color: #6e879c; font-family: monospace; }
.ranking-person { display: grid; }
.ranking-person span { color: var(--muted); font-size: .75rem; }
.ranking-score { color: #84cbff; font-size: 1.2rem; }
.notification-list { max-width: 850px; display: grid; gap: 7px; }
.notification-item { display: flex; gap: 13px; padding: 16px; background: #09121b; border: 1px solid var(--line); border-radius: 9px; }
.notification-item p { margin: 3px 0; color: var(--muted); }
.notification-item small { color: #627991; }
.notification-icon { color: var(--blue-bright); padding-top: 2px; }
.event-code-box { display: flex; align-items: end; gap: 8px; padding: 13px; margin-bottom: 17px; background: #0a1621; border: 1px solid #234565; border-radius: 10px; }
.event-code-box label { flex: 1; }
.event-code-box input { font-family: monospace; letter-spacing: .18em; text-transform: uppercase; }
.event-grid, .event-admin-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
.event-card, .event-admin-card { padding: 20px; background: var(--panel); border: 1px solid var(--line); border-radius: 11px; }
.event-card.closed { opacity: .72; }
.event-card-top { display: flex; justify-content: space-between; gap: 8px; }
.event-card h2, .event-admin-card h2 { margin: 15px 0 7px; }
.event-card p, .event-admin-card p { color: var(--muted); min-height: 48px; }
.status-pill { display: inline-flex; align-items: center; min-height: 24px; padding: 3px 7px; border: 1px solid #365069; border-radius: 99px; color: #a9bdd1; font: .65rem monospace; text-transform: uppercase; }
.status-pill.open, .status-pill.active, .status-pill.fixed { border-color: #2b6c50; color: #71d9a6; background: #0a1e16; }
.status-pill.closed, .status-pill.archived { color: #9da7b2; }
.status-pill.attended { border-color: #285982; color: #7bc7ff; }
.status-pill.suspended, .status-pill.open:not(.event-card .status-pill.open) { border-color: #754148; color: #ff9aa3; }
.status-pill.mentor { border-color: #5d4d80; color: #c8adff; }
.status-pill.alumni { border-color: #536373; color: #b8c4d2; }
.event-meta { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin-top: 15px; }
.event-meta span { display: grid; color: var(--muted); font-size: .72rem; }
.event-meta strong { color: var(--text); margin-top: 3px; font-size: .86rem; }
.admin-shell { width: min(1440px, calc(100% - 30px)); margin: 0 auto; display: grid; grid-template-columns: 205px 1fr; gap: 26px; padding: 25px 0 70px; }
.admin-sidebar { position: sticky; top: 90px; height: fit-content; display: grid; gap: 2px; padding: 10px; background: #080e15; border: 1px solid var(--line); border-radius: 11px; }
.admin-label { padding: 8px 9px 12px; color: #5c89aa; }
.admin-sidebar a { padding: 8px 10px; border-radius: 7px; color: var(--muted); font-size: .82rem; }
.admin-sidebar a:hover, .admin-sidebar a.active { background: #0f1d2a; color: #d7edff; }
.admin-separator { color: #506274; font-size: .63rem; letter-spacing: .11em; padding: 14px 10px 5px; }
.admin-main { min-width: 0; }
.admin-stats { grid-template-columns: repeat(4,1fr); }
.admin-stats .stat-card { cursor: pointer; }
.admin-filters { grid-template-columns: 1.5fr repeat(4, .8fr) auto; }
.bulk-toolbar { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin: 0 0 8px auto; }
.bulk-toolbar span { margin-right: auto; color: var(--muted); font-size: .8rem; }
.bulk-toolbar input { width: 130px; }
.admin-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; background: #080f17; }
.admin-table { width: 100%; border-collapse: collapse; min-width: 850px; font-size: .8rem; }
.admin-table th { text-align: left; color: #70869a; font-size: .67rem; letter-spacing: .06em; text-transform: uppercase; background: #09121b; }
.admin-table th, .admin-table td { padding: 10px 11px; border-bottom: 1px solid #172534; }
.admin-table tr:last-child td { border-bottom: 0; }
.gear-button { width: 34px; height: 34px; display: grid; place-items: center; color: #93b7d5; background: #0d1a25; border: 1px solid #263c50; border-radius: 7px; cursor: pointer; }
.compact-tags .dept-tag { padding: 2px 5px; font-size: .62rem; }
.drawer { width: min(610px, 100%); max-width: none; height: 100%; max-height: none; margin: 0 0 0 auto; padding: 0; border: 0; background: transparent; color: var(--text); }
.drawer::backdrop { background: rgba(0,0,0,.62); }
.drawer-panel { height: 100%; display: flex; flex-direction: column; background: #071019; border-left: 1px solid #274057; box-shadow: -25px 0 80px rgba(0,0,0,.45); }
.drawer-header { display: flex; justify-content: space-between; gap: 18px; align-items: start; padding: 20px; border-bottom: 1px solid var(--line); }
.drawer-header h2 { margin: 4px 0 0; }
.drawer-header small { color: var(--muted); }
.close-drawer { width: 38px; height: 38px; border-radius: 8px; background: #0e1a25; border: 1px solid var(--line); color: white; font-size: 1.3rem; cursor: pointer; }
.drawer-body { overflow-y: auto; padding: 20px; }
.drawer-actions { padding: 14px 20px; border-top: 1px solid var(--line); display: flex; align-items: center; gap: 12px; background: #071019; }
.drawer.is-loading .drawer-body { opacity: .45; pointer-events: none; }
.save-state { color: var(--muted); font-size: .8rem; }
.checkbox-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 7px; }
.check-card { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 8px !important; min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px; background: #09121a; }
.check-card span { font-size: .78rem !important; }
.card-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
.request-card { display: grid; grid-template-columns: 120px 1fr; background: #09121b; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.request-card > img, .request-avatar { width: 120px; height: 100%; min-height: 250px; object-fit: cover; background: #102233; display: grid; place-items: center; font-size: 2rem; }
.request-body { padding: 18px; }
.request-body h2 { margin: 0; }
.request-body > p { color: var(--muted); margin-top: 3px; }
.inline-create { display: grid; grid-template-columns: 1fr auto 1.5fr 90px auto; gap: 7px; padding: 10px; background: #09111a; border: 1px solid var(--line); border-radius: 9px; margin-bottom: 12px; }
.settings-list { display: grid; gap: 5px; }
.settings-row { display: grid; grid-template-columns: auto minmax(160px,1fr) auto minmax(160px,1.5fr) 80px auto auto; align-items: center; gap: 8px; padding: 10px; background: #09111a; border: 1px solid var(--line); border-radius: 8px; }
.settings-row > div { display: grid; }
.settings-row small { color: var(--muted); }
.color-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--dot); box-shadow: 0 0 9px color-mix(in srgb, var(--dot) 55%, transparent); }
.small-input { width: 78px !important; }
.event-admin-card .panel-heading { align-items: start; }
.event-code { font: 1rem monospace; letter-spacing: .15em; color: #80caff; }
.export-fields { grid-template-columns: repeat(3,1fr); }
.content-editor { display: grid; gap: 10px; }
.sticky-save { position: sticky; bottom: 12px; display: flex; justify-content: flex-end; pointer-events: none; }
.sticky-save .button { pointer-events: auto; box-shadow: 0 10px 35px rgba(0,0,0,.5); }
.gallery-admin-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 12px; }
.gallery-admin-grid article { overflow: hidden; background: #09111a; border: 1px solid var(--line); border-radius: 9px; }
.gallery-admin-grid img { width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.gallery-admin-grid article > div { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 9px; }
.bug-list { display: grid; gap: 10px; }
.bug-card h2 { margin: 6px 0 0; }
.pre-wrap { white-space: pre-wrap; color: #bcc9d5; }
.screenshot-link { display: inline-block; margin: 12px 0; color: #75c3ff; }

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr 420px; }
  .public-member-grid { grid-template-columns: repeat(2,1fr); }
  .feature-grid { grid-template-columns: 1fr; }
  .split-section { grid-template-columns: 1fr 1fr; }
  .admin-shell { grid-template-columns: 1fr; }
  .admin-sidebar { position: static; display: flex; overflow-x: auto; border-radius: 8px; }
  .admin-sidebar a, .admin-separator, .admin-label { white-space: nowrap; }
  .admin-separator { padding: 8px 5px; }
  .admin-filters { grid-template-columns: repeat(3,1fr); }
  .card-grid { grid-template-columns: 1fr; }
  .settings-row { grid-template-columns: auto 1fr auto 1fr; }
  .settings-row > *:nth-last-child(-n+3) { justify-self: start; }
}
@media (max-width: 820px) {
  .topbar { min-height: 64px; }
  .mobile-menu-btn { display: block; }
  .main-nav { display: none; position: absolute; top: 64px; left: 12px; right: 12px; padding: 12px; flex-direction: column; align-items: stretch; gap: 2px; background: #071019; border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow); }
  .main-nav.is-open { display: flex; }
  .main-nav a, .main-nav form .button { width: 100%; justify-content: flex-start; padding: 10px 12px; }
  .nav-separator { width: 100%; height: 1px; margin: 4px 0; }
  .hero { grid-template-columns: 1fr; min-height: auto; padding: 58px 0 30px; }
  .hero-visual { order: -1; }
  .logo-stage { width: min(380px, 90vw); }
  .hero h1 { font-size: clamp(3.2rem, 16vw, 6rem); }
  .split-section, .school-strip, .auth-shell, .contact-grid, .dashboard-grid { grid-template-columns: 1fr; }
  .school-strip { padding-top: 45px; padding-bottom: 45px; text-align: center; }
  .school-logo-wrap { min-height: 160px; }
  .gallery-grid { grid-template-columns: 1fr 1fr; }
  .gallery-grid figure:first-child { grid-column: span 2; grid-row: auto; min-height: 420px; }
  .sponsor-grid { grid-template-columns: repeat(2,1fr); }
  .auth-shell { gap: 30px; }
  .auth-visual { min-height: 350px; order: -1; }
  .member-grid { grid-template-columns: 1fr; }
  .dashboard-hero, .profile-header { align-items: flex-start; flex-direction: column; }
  .score-module { text-align: left; }
  .stat-grid, .admin-stats { grid-template-columns: repeat(2,1fr); }
  .filter-bar, .admin-filters { grid-template-columns: 1fr 1fr; }
  .event-grid, .event-admin-grid { grid-template-columns: 1fr; }
  .request-card { grid-template-columns: 90px 1fr; }
  .request-card > img, .request-avatar { width: 90px; }
  .inline-create { grid-template-columns: 1fr 1fr; }
  .gallery-admin-grid { grid-template-columns: repeat(2,1fr); }
  .footer { flex-direction: column; }
  .footer-links { justify-content: flex-start; }
}
@media (max-width: 560px) {
  .section, .team-page, .page-hero, .hero { width: min(100% - 24px, var(--content)); }
  .section { padding: 52px 0; }
  .hero { padding-top: 35px; }
  .hero h1 { margin: 18px 0; }
  .hero-actions .button { flex: 1; }
  .hero-visual { margin: -20px 0 -45px; transform: scale(.86); }
  .section-heading, .cta-panel, .page-title-row { align-items: stretch; flex-direction: column; }
  .public-member-grid, .feature-grid, .sponsor-grid { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: 1fr; }
  .gallery-grid figure:first-child { grid-column: auto; min-height: 330px; }
  .gallery-grid figure, .gallery-placeholder { min-height: 250px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .full { grid-column: auto; }
  .auth-shell { width: calc(100% - 24px); padding: 40px 0; }
  .auth-visual { min-height: 290px; }
  .team-page { padding-top: 15px; }
  .team-nav { margin: 0 -2px 28px; }
  .dashboard-hero, .profile-header { padding: 18px; }
  .member-identity { align-items: flex-start; flex-direction: column; }
  .avatar-xl { width: 88px; height: 88px; }
  .stat-grid, .admin-stats { grid-template-columns: 1fr 1fr; }
  .filter-bar, .admin-filters { grid-template-columns: 1fr; }
  .member-card { grid-template-columns: auto 1fr; }
  .member-card-score { grid-column: 2; text-align: left; grid-auto-flow: column; justify-content: start; gap: 5px; align-items: baseline; }
  .ranking-row { grid-template-columns: 42px 32px 1fr auto; padding: 8px; }
  .event-code-box { align-items: stretch; flex-direction: column; }
  .event-meta { grid-template-columns: 1fr 1fr 1fr; }
  .admin-shell { width: calc(100% - 18px); padding-top: 10px; }
  .admin-sidebar { margin: 0 -2px; }
  .bulk-toolbar { align-items: stretch; flex-wrap: wrap; }
  .bulk-toolbar span { width: 100%; }
  .bulk-toolbar input { flex: 1; width: auto; }
  .drawer { width: 100%; }
  .checkbox-grid, .export-fields { grid-template-columns: 1fr; }
  .inline-create { grid-template-columns: 1fr; }
  .settings-row { grid-template-columns: 1fr 1fr; }
  .settings-row .color-dot { display: none; }
  .gallery-admin-grid { grid-template-columns: 1fr; }
  .request-card { grid-template-columns: 1fr; }
  .request-card > img, .request-avatar { width: 100%; height: 160px; min-height: 160px; }
  .footer { width: calc(100% - 24px); }
}
.nav-language { display:inline-flex; align-items:center; gap:4px; color:#58748d; font:700 .68rem monospace; }
.nav-language a { color:#8ebfe5; padding:4px; }

/* v0.2 member lifecycle / fast admin UX */
.form-section-title { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 12px 0 3px; border-bottom: 1px solid var(--line); }
.form-section-title strong { font-size: .9rem; }
.form-section-title small { color: var(--muted); font-size: .72rem; text-align: right; }
.table-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.quick-role-button { color: #77c6ff; font-size: 1.05rem; }
.inactive-table-row { opacity: .72; }
.neutralized { --rank-color: #65717d !important; filter: grayscale(1); color: #a8b0b8 !important; border-color: #35404a !important; background: #11161b !important; }
.inactive-member { --rank-color: #5b6672 !important; border-color: #28313a; border-left-color: #56616c; background: #0a0f14; color: #c4cbd2; }
.inactive-member:hover { background: #0d1319; }
.inactive-member .avatar { filter: grayscale(.7) saturate(.55); opacity: .82; }
.inactive-profile { border-left-color: #59636d !important; background: linear-gradient(125deg, #11161b, #090d12 70%) !important; }
.inactive-profile .avatar { filter: grayscale(.65) saturate(.55); opacity: .84; }
.neutral-tags { margin-top: 5px; }
.neutral-tag { display: inline-flex; align-items: center; min-height: 25px; padding: 3px 8px; border-radius: 6px; font-size: .7rem; font-weight: 700; color: #aeb7c0; background: #11171d; border: 1px solid #313c46; }
.archive-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.archive-title-row h3 { margin: 0; }
.archive-notice { margin-top: 12px; padding: 9px 11px; border-left: 2px solid #5f6a75; background: #10151a; color: #9ca7b1; font-size: .78rem; }
.muted-score strong { color: #9ca6af; }
.private-details-panel { margin-top: 12px; border-color: #2d4154; }
.archive-filters { grid-template-columns: 1.5fr 1fr auto; }
.status-pill.withdrawn, .status-pill.removed, .status-pill.veteran { color: #aeb7c0; border-color: #4d5965; background: #10161b; }
.status-pill.removed { color: #d6a5aa; border-color: #65444a; }
.status-pill.veteran { color: #c4b58f; border-color: #645a3e; }

@media (max-width: 560px) {
  .form-section-title { align-items: flex-start; flex-direction: column; }
  .form-section-title small { text-align: left; }
  .archive-filters { grid-template-columns: 1fr; }
}

/* v0.3 applications, social content and admin quality-of-life */
.flash { transition: opacity .25s ease, transform .25s ease; }
.flash.is-leaving { opacity: 0; transform: translateY(-8px); }
.invalid-field, .form-attempted :invalid { border-color: #d9525f !important; box-shadow: 0 0 0 3px rgba(217,82,95,.13) !important; }
input[type="file"] { padding: 5px; color: #9fb2c3; }
input[type="file"]::file-selector-button { min-height: 34px; margin-right: 10px; padding: 0 12px; border-radius: 7px; border: 1px solid #315779; background: #0e2233; color: #d9edff; font-weight: 700; cursor: pointer; }
input[type="file"]::file-selector-button:hover { background: #153047; border-color: #3c78a8; }
.form-section-title { margin-top: 8px; margin-bottom: 10px; padding-bottom: 8px; }
.form-section-title + label, .form-section-title + fieldset { margin-top: 3px; }
.application-form label > small { display: block; margin-top: 5px; color: var(--muted); font-size: .72rem; }
.trait-fieldset { border: 1px solid var(--line); border-radius: 9px; padding: 14px; }
.trait-fieldset legend { padding: 0 7px; font-weight: 750; }
.trait-fieldset legend small { color: var(--muted); font-weight: 500; }
.trait-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
.application-answer { margin: 14px 0 10px; padding: 12px; border-left: 2px solid #337fba; background: #081724; border-radius: 0 8px 8px 0; }
.application-answer > span { color: #7da9ca; font-size: .7rem; text-transform: uppercase; letter-spacing: .07em; }
.application-answer p { margin: 7px 0 0; white-space: pre-wrap; }
.trait-summary { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.trait-summary span { padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; background: #09131d; color: #93a8ba; font-size: .72rem; }
.trait-summary strong { color: #d9edff; }
.request-card-v3 { grid-template-columns: 150px minmax(0,1fr); }
.request-photo-wrap { width: 150px; align-self: start; aspect-ratio: 1; background: #102233; overflow: hidden; }
.request-photo-wrap img, .request-photo-wrap .request-avatar { width: 100%; height: 100%; min-height: 0; object-fit: cover; }
.request-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.request-heading h2 { margin: 2px 0; }
.request-heading p { margin: 0; color: var(--muted); }
.request-details { grid-template-columns: repeat(2, minmax(0,1fr)); }
.approval-form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-top: 12px; border-top: 1px solid var(--line); }
.approval-form .full { grid-column: 1 / -1; }
.approval-form fieldset { border: 1px solid var(--line); border-radius: 8px; padding: 10px; }
.approval-form legend { padding: 0 6px; color: #a9bfd2; font-size: .76rem; }

.google-button.icon-only { min-height: 54px; padding: 8px; background: #fff; border-color: #d9dde2; box-shadow: none; }
.google-button.icon-only:hover { background: #f6f8fa; }
.google-button.icon-only img { width: 32px; height: 32px; display: block; }
.hidden-account-badge, .graduate-tag { display: inline-flex; align-items: center; min-height: 21px; padding: 2px 6px; border-radius: 5px; border: 1px solid #535c66; background: #131820; color: #aeb7bf; font: 700 .58rem/1 monospace; letter-spacing: .06em; }
.hidden-user-row { opacity: .68; border-style: dashed; }

.ftc-badge { display: inline-flex; flex-direction: column; gap: 3px; margin-top: 18px; padding: 10px 12px; width: fit-content; border: 1px solid #244f70; border-radius: 8px; background: rgba(6,22,34,.82); }
.ftc-badge span { color: #698da8; font: 700 .64rem monospace; letter-spacing: .08em; text-transform: uppercase; }
.ftc-badge strong { color: #d7edff; font-size: .82rem; }
.social-section { padding-top: 42px; }
.social-link-placeholder { display: grid !important; place-items: center; aspect-ratio: 1; color: #7fc8ff; background: linear-gradient(145deg,#09131e,#111926); }
.upload-panel { margin-bottom: 14px; border-color: #294861; background: linear-gradient(145deg,#09131d,#081018); }
.upload-panel-heading { display: flex; justify-content: space-between; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.upload-panel-heading small { color: var(--muted); }

.event-code-actions { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.copy-button { min-height: 30px !important; padding: 0 9px !important; font-size: .7rem !important; }
.quick-role-button { width: auto; min-width: 54px; padding: 0 8px; font-size: .68rem; font-weight: 800; }
.clickable-row { text-decoration: none; color: inherit; }
.clickable-row:hover { background: #0d1a25; }

.compact-create-form { margin-bottom: 12px; }
.settings-card { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 8px; padding: 10px; border: 1px solid var(--line); border-radius: 9px; background: #09111a; }
.settings-edit-form { display: grid; grid-template-columns: auto minmax(140px,1fr) 92px minmax(180px,1.6fr) 88px auto; align-items: end; gap: 8px; }
.settings-edit-form label { gap: 4px; }
.settings-edit-form label > span { font-size: .65rem; color: #71889b; text-transform: uppercase; letter-spacing: .04em; }
.settings-edit-form .color-dot { align-self: center; margin-bottom: 12px; }
.settings-edit-form .color-field input { width: 100%; }
.settings-meta { align-self: center; margin-bottom: 8px; color: var(--muted); font-size: .76rem; }
.department-edit-form { grid-template-columns: auto minmax(180px,1.4fr) 92px minmax(100px,.5fr) auto; }
.settings-delete-form { padding-bottom: 2px; }
.user-role-row { grid-template-columns: minmax(170px,1.4fr) auto minmax(270px,1fr) auto; }
.inline-role-form { display: flex; gap: 7px; align-items: center; }
.inline-role-form select { min-width: 125px; }

@media (max-width: 900px) {
  .trait-grid { grid-template-columns: repeat(2,1fr); }
  .settings-card { grid-template-columns: 1fr; }
  .settings-edit-form, .department-edit-form { grid-template-columns: auto 1fr 100px; }
  .settings-edit-form label:nth-of-type(3), .settings-edit-form .order-field, .settings-edit-form button, .settings-meta { grid-column: span 1; }
  .user-role-row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .trait-grid, .request-details, .approval-form { grid-template-columns: 1fr; }
  .approval-form .full { grid-column: auto; }
  .request-card-v3 { grid-template-columns: 1fr; }
  .request-photo-wrap { width: 100%; max-width: 180px; margin: 14px 0 0 14px; border-radius: 8px; }
  .settings-edit-form, .department-edit-form { grid-template-columns: 1fr 1fr; }
  .settings-edit-form .color-dot { display: none; }
  .settings-edit-form label:nth-of-type(3), .settings-edit-form button, .settings-meta { grid-column: 1 / -1; }
  .user-role-row { grid-template-columns: 1fr; }
  .inline-role-form { align-items: stretch; flex-direction: column; }
}
.google-icon-button { width: 100%; min-height: 54px; padding: 8px; display: grid; place-items: center; background: #fff; border: 1px solid #d9dde2; border-radius: 9px; box-shadow: none; }
.google-icon-button:hover { background: #f6f8fa; }
.google-icon-button img { width: 32px; height: 32px; display: block; }

/* v0.4 mobile breathing room, media-only social cards and safer admin controls */
.interactive-logo { cursor: pointer; user-select: none; outline: none; transform-origin: center; }
.interactive-logo:focus-visible { box-shadow: 0 0 0 3px rgba(43,150,238,.32); }
.interactive-logo.is-bouncing { animation: prismatech-logo-bounce .72s cubic-bezier(.2,.85,.3,1); }
@keyframes prismatech-logo-bounce {
  0% { transform: translateY(0) scale(1); }
  28% { transform: translateY(-20px) scale(1.035) rotate(-1deg); }
  52% { transform: translateY(5px) scale(.985) rotate(.7deg); }
  72% { transform: translateY(-7px) scale(1.012); }
  100% { transform: translateY(0) scale(1); }
}

.google-wordmark-button { width: 190px; min-height: 44px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid #d7dde4; border-radius: 8px; background: #fff; color: #202124; font-weight: 650; box-shadow: 0 1px 2px rgba(0,0,0,.16); }
.google-wordmark-button:hover { background: #f8fafc; }
.google-wordmark-button img { width: 20px; height: 20px; }
.google-wordmark-button span { font-size: .95rem; letter-spacing: .01em; }
.calculated-age { min-height: 42px; display: flex; align-items: center; padding: 9px 11px; border: 1px solid #26394d; border-radius: 8px; background: #0b1219; color: #d9e7f3; }

.staff-roster { padding-top: 24px; }

.gallery-title-row { position: sticky; top: 82px; z-index: 8; padding: 12px 0; background: linear-gradient(180deg, rgba(5,8,13,.98), rgba(5,8,13,.92)); backdrop-filter: blur(12px); }
.gallery-admin-grid-v4 { margin-top: 6px; }
.gallery-admin-grid-v4 article { position: relative; }
.gallery-admin-image { position: relative; }
.gallery-admin-image > .status-pill { position: absolute; top: 9px; right: 9px; backdrop-filter: blur(10px); }
.gallery-admin-actions { display: grid !important; gap: 10px !important; align-items: stretch !important; }
.gallery-admin-actions > strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gallery-hidden-item img { filter: grayscale(.9) brightness(.48); }
.gallery-hidden-item { border-style: dashed !important; }

.bulk-tools { display: grid; grid-template-columns: auto minmax(250px,.7fr) minmax(500px,1.7fr); gap: 10px; align-items: start; padding: 10px; margin-bottom: 10px; border: 1px solid var(--line); border-radius: 10px; background: #081018; }
.bulk-selected { min-height: 42px; display: flex; align-items: center; gap: 5px; color: var(--muted); white-space: nowrap; }
.bulk-selected strong { color: #d9edff; }
.bulk-tools .bulk-toolbar { margin: 0; justify-content: flex-start; }
.permanent-delete-button { color: #ff8b95; border-color: #69383e !important; }
.permanent-delete-button:hover { background: #271015 !important; }
.table-actions form { display: inline-flex; margin: 0; }

.version-log { display: grid; gap: 12px; }
.version-card { padding: 20px 22px; }
.version-heading { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.version-heading h2 { margin: 0; font-size: 1.08rem; }
.version-number { color: #7dc8ff; font: 800 .76rem/1 monospace; padding: 5px 7px; border: 1px solid #295273; border-radius: 6px; background: #091826; }
.version-card ul { margin: 14px 0 0; padding-left: 20px; color: #a8bac9; }
.version-card li + li { margin-top: 6px; }

@media (max-width: 1120px) {
  .bulk-tools { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  .main-nav .signout-form { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
  .main-nav .signout-form .button { min-height: 44px; }
  .main-nav > .button.ghost[href*="/admin"] { margin-bottom: 4px; }
  .gallery-title-row { top: 64px; }
}

@media (max-width: 560px) {
  .section, .team-page, .page-hero, .hero { width: min(100% - 36px, var(--content)); }
  .section { padding: 62px 0; }
  .section + .section { border-top-color: rgba(27,43,61,.55); }
  .page-hero { padding-top: 58px; }
  .page-hero p, .page-title-row p, .lead { line-height: 1.7; }
  .info-panel, .panel { padding: 20px; }
  .feature-card { padding: 22px; min-height: 176px; }
  .cta-panel { padding: 28px 24px; gap: 22px; border-radius: 16px; }
  .cta-panel h2 { margin-top: 12px; line-height: 1.08; }
  .cta-panel p { line-height: 1.7; }
  .cta-panel .button { width: 100%; min-height: 48px; }
  .section-heading { gap: 18px; }
  .section-heading p { margin-top: 0; line-height: 1.65; }
  .public-member-card { padding: 18px; }
  .gallery-title-row { position: static; padding-top: 0; }
  .gallery-title-row .button { width: 100%; }
  .gallery-admin-grid-v4 { gap: 14px; }
  .gallery-admin-actions { padding: 13px !important; }
  .bulk-tools { padding: 12px; }
  .google-wordmark-button { width: 170px; min-height: 42px; }
}

/* v0.5 onboarding reliability, compact admin structures and event controls */
.onboarding-heading-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.onboarding-heading-row > div:first-child { min-width: 0; }
.onboarding-language-switch { flex: 0 0 auto; display: inline-flex; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 9px; background: #08111a; }
.onboarding-language-switch a { min-width: 42px; padding: 7px 9px; border-radius: 6px; text-align: center; color: var(--muted); font-size: .74rem; font-weight: 850; }
.onboarding-language-switch a.active { background: #12304a; color: #e2f2ff; }
.required-note { padding: 10px 12px; border: 1px solid #29455d; border-radius: 8px; background: #091724; color: #9db7ca; font-size: .78rem; line-height: 1.55; }
.onboarding-notice { display: flex; align-items: baseline; flex-wrap: wrap; gap: 7px; }
.onboarding-notice strong + span, .notice strong + span { margin-left: 2px; }
.application-form .form-section-title { gap: 18px; }
.application-form .form-section-title strong { flex: 0 0 auto; }
.application-form .form-section-title small { line-height: 1.5; }
.trait-fieldset legend small { margin-left: 7px; }
.auto-join-date { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 8px 12px; min-height: 62px; padding: 12px 14px; border: 1px solid #263c50; border-radius: 9px; background: #09131c; }
.auto-join-date > span { color: #8098ab; font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; }
.auto-join-date strong { color: #e3f1fc; }
.auto-join-date small { color: var(--muted); line-height: 1.4; }

/* A compact Google control: small wordmark plus a distinct icon tile. */
.google-wordmark-button { width: 152px; min-height: 40px; padding: 5px 12px 5px 7px; gap: 9px; justify-content: flex-start; border-color: #2c4154; background: #0b141d; color: #e6edf3; box-shadow: none; }
.google-wordmark-button:hover { background: #101e2a; border-color: #3b5c76; }
.google-wordmark-button img { width: 27px; height: 27px; padding: 4px; border: 1px solid #d9dee5; border-radius: 6px; background: #fff; }
.google-wordmark-button span { font-size: .86rem; font-weight: 750; }

/* Keep the public language selector clearly below the FTC badge rather than on the same line. */
.public-hero .ftc-badge, .public-hero .language-switch { display: flex; width: fit-content; }
.public-hero .language-switch { margin-top: 28px; }

.team-nav-admin { margin-left: 8px; padding-left: 18px !important; border-left: 1px solid #26394a; }

.compact-settings-list { gap: 8px; }
.settings-collapsible { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #09111a; }
.settings-collapsible > summary { min-height: 58px; display: grid; grid-template-columns: auto minmax(0,1fr) auto auto; align-items: center; gap: 11px; padding: 10px 13px; cursor: pointer; list-style: none; user-select: none; }
.settings-collapsible > summary::-webkit-details-marker { display: none; }
.settings-collapsible > summary:hover { background: #0c1823; }
.settings-collapsible[open] > summary { border-bottom: 1px solid var(--line); background: #0c1823; }
.settings-collapsible .color-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--dot); box-shadow: 0 0 0 3px color-mix(in srgb, var(--dot) 18%, transparent); }
.settings-summary-copy { min-width: 0; display: grid; gap: 3px; }
.settings-summary-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #e0edf7; font-size: .9rem; }
.settings-summary-copy small, .settings-summary-meta { color: var(--muted); font-size: .72rem; }
.settings-summary-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.settings-summary-meta { white-space: nowrap; }
.settings-chevron { color: #78bff2; font-size: 1.05rem; transition: transform .18s ease; }
.settings-collapsible[open] .settings-chevron { transform: rotate(180deg); }
.settings-collapsible-body { display: grid; gap: 10px; padding: 13px; }
.settings-collapsible .settings-edit-form { grid-template-columns: minmax(150px,1fr) 90px minmax(190px,1.5fr) 82px auto; }
.settings-collapsible .department-edit-form { grid-template-columns: minmax(180px,1.4fr) 90px minmax(100px,.5fr) auto; }
.settings-collapsible .settings-delete-form { display: flex; justify-content: flex-end; padding: 0; }

.icon-copy-button { width: 30px; min-width: 30px; height: 30px; min-height: 30px !important; padding: 6px !important; display: inline-grid; place-items: center; border-radius: 7px; }
.icon-copy-button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.icon-copy-button.is-copied { color: #8de0aa; border-color: #32694a; background: #0d2418; }

.bulk-tools-points-only { grid-template-columns: auto minmax(260px, .7fr); }

@media (max-width: 820px) {
  .onboarding-heading-row { flex-direction: column; gap: 16px; }
  .settings-collapsible .settings-edit-form, .settings-collapsible .department-edit-form { grid-template-columns: 1fr 100px; }
  .settings-collapsible .settings-edit-form label:nth-of-type(3), .settings-collapsible .settings-edit-form .order-field, .settings-collapsible .settings-edit-form button, .settings-collapsible .settings-meta { grid-column: 1 / -1; }
  .team-nav-admin { margin-left: 0; padding-left: 14px !important; border-left: 0; }
}

@media (max-width: 560px) {
  .onboarding-section { padding-top: 36px; }
  .application-form { row-gap: 15px; }
  .application-form .form-section-title { gap: 7px; margin-top: 14px; padding-bottom: 11px; }
  .auto-join-date { grid-template-columns: 1fr; gap: 5px; }
  .settings-collapsible > summary { grid-template-columns: auto minmax(0,1fr) auto; }
  .settings-summary-meta { display: none; }
  .settings-collapsible .settings-edit-form, .settings-collapsible .department-edit-form { grid-template-columns: 1fr; }
  .settings-collapsible .settings-edit-form > *, .settings-collapsible .department-edit-form > * { grid-column: auto !important; }
  .bulk-tools-points-only { grid-template-columns: 1fr; }
  .google-wordmark-button { width: 148px; min-height: 40px; }
  .public-hero .language-switch { margin-top: 32px; }
}

/* v0.5.1 — export preview, login intent, compact media and clearer admin cards */
.login-panel-v051 { max-width: 560px; }
.login-intent-form { display: grid; gap: 18px; }
.login-intent-options { display: grid; gap: 10px; padding: 0; border: 0; }
.login-intent-options > legend { margin-bottom: 8px; color: #93aabd; font-size: .76rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.login-intent-card { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: flex-start; gap: 11px; padding: 13px 14px; border: 1px solid #24394b; border-radius: 10px; background: #08121b; cursor: pointer; transition: border-color .15s ease, background .15s ease, transform .15s ease; }
.login-intent-card:hover { border-color: #32658c; background: #0a1824; transform: translateY(-1px); }
.login-intent-card:has(input:checked) { border-color: #287bc0; background: #0a1c2b; box-shadow: inset 0 0 0 1px rgba(65,161,229,.18); }
.login-intent-card input { margin-top: 3px; accent-color: #2f96dc; }
.login-intent-card > span { display: grid; gap: 4px; }
.login-intent-card strong { color: #e7f2fb; font-size: .9rem; }
.login-intent-card small { color: var(--muted); line-height: 1.45; font-size: .75rem; }
/* Explicitly keep the Google button small: icon tile + word only. */
.login-intent-form .google-wordmark-button,
.google-wordmark-button { width: 132px; min-height: 38px; padding: 5px 11px 5px 6px; gap: 8px; border-radius: 8px; }
.google-wordmark-button img { width: 24px; height: 24px; padding: 4px; border-radius: 6px; }
.google-wordmark-button span { font-size: .84rem; letter-spacing: .01em; }

.onboarding-mode-switch { display: inline-flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; padding: 4px; border: 1px solid #233b50; border-radius: 10px; background: #07111a; }
.onboarding-mode-switch a { padding: 8px 12px; border-radius: 7px; color: #91a9bc; font-size: .78rem; font-weight: 800; }
.onboarding-mode-switch a.active { color: #e6f4ff; background: #10304a; box-shadow: inset 0 0 0 1px #285f88; }
.request-status-stack { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.compact-request-note { margin-top: 12px; }

/* Ranks/departments: stronger, cleaner blue containers. */
.settings-collapsible { border-color: #1d5f91; background: linear-gradient(145deg,#08131d,#091722); box-shadow: inset 0 0 0 1px rgba(44,133,196,.08), 0 5px 18px rgba(0,0,0,.16); }
.settings-collapsible:hover { border-color: #2d78ab; }
.settings-collapsible[open] { border-color: #3387bd; box-shadow: inset 0 0 0 1px rgba(59,155,222,.13), 0 8px 24px rgba(0,0,0,.2); }
.settings-collapsible[open] > summary { border-bottom-color: #245d85; }

/* Export builder with a visible, editable member preview. */
.export-builder { display: grid; gap: 16px; }
.export-selection-panel, .export-options-panel { margin: 0; }
.export-selected-badge { display: inline-flex; align-items: baseline; gap: 5px; padding: 6px 10px; border: 1px solid #275779; border-radius: 999px; background: #0b1d2b; color: #9db9cd; font-size: .74rem; }
.export-selected-badge strong { color: #e4f4ff; font-size: .9rem; }
.export-mode-tabs { display: inline-grid; grid-template-columns: 1fr 1fr; gap: 5px; margin: 14px 0; padding: 4px; border: 1px solid #24394b; border-radius: 10px; background: #07111a; }
.export-mode-tabs label { cursor: pointer; }
.export-mode-tabs input { position: absolute; opacity: 0; pointer-events: none; }
.export-mode-tabs span { display: block; padding: 8px 13px; border-radius: 7px; color: #91a7b9; font-size: .78rem; font-weight: 800; text-align: center; }
.export-mode-tabs input:checked + span { background: #12324b; color: #e7f3fc; }
.export-filter-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 13px; }
.export-filter-grid label { display: grid; gap: 6px; }
.export-filter-grid label > span { color: #89a0b3; font-size: .72rem; font-weight: 700; }
.export-member-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 8px 0; }
.export-member-list { display: grid; gap: 6px; max-height: 510px; overflow: auto; padding: 4px 5px 4px 0; scrollbar-gutter: stable; }
.export-member-row { display: grid; grid-template-columns: auto minmax(180px,1.1fr) minmax(150px,1fr) auto; align-items: center; gap: 11px; padding: 10px 11px; border: 1px solid #1e3446; border-radius: 9px; background: #07111a; cursor: pointer; }
.export-member-row:hover { border-color: #2c638b; background: #091722; }
.export-member-row.is-filtered-out { display: none; }
.export-member-row input { accent-color: #319be0; }
.export-member-main { min-width: 0; display: grid; gap: 2px; }
.export-member-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #e4f1fa; font-size: .84rem; }
.export-member-main small, .export-member-departments { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #809aad; font-size: .72rem; }

.media-tile { position: relative; width: 100%; height: 100%; padding: 0; border: 0; background: #000; color: inherit; cursor: zoom-in; overflow: hidden; display: block; }
.media-expand { position: absolute; right: 8px; bottom: 8px; display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; background: rgba(3,8,13,.72); color: #fff; font-size: .8rem; opacity: 0; transform: translateY(3px); transition: opacity .15s ease, transform .15s ease; }
.media-tile:hover .media-expand, .media-tile:focus-visible .media-expand { opacity: 1; transform: translateY(0); }

/* Public gallery: smaller thumbnails and full-size preview on click. */
.gallery-grid.gallery-grid-compact { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.gallery-grid.gallery-grid-compact figure,
.gallery-grid.gallery-grid-compact figure:first-child,
.gallery-grid.gallery-grid-compact .gallery-placeholder { min-height: 0; aspect-ratio: 4 / 3; grid-column: auto; grid-row: auto; }
.gallery-grid.gallery-grid-compact figure { border-radius: 10px; }
.gallery-grid.gallery-grid-compact img { width: 100%; height: 100%; object-fit: cover; }
.gallery-grid.gallery-grid-compact figcaption { max-width: calc(100% - 24px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.media-lightbox { width: min(94vw, 1120px); max-width: none; height: min(92vh, 900px); max-height: none; padding: 0; border: 1px solid #294b63; border-radius: 14px; background: #04090e; color: #fff; box-shadow: 0 30px 90px rgba(0,0,0,.65); }
.media-lightbox::backdrop { background: rgba(0,0,0,.82); backdrop-filter: blur(5px); }
.media-lightbox-shell { position: relative; display: grid; grid-template-rows: 1fr auto; width: 100%; height: 100%; padding: 42px 14px 14px; }
.media-lightbox-stage { min-height: 0; display: grid; place-items: center; overflow: hidden; border-radius: 9px; background: #000; }
.media-lightbox-stage img, .media-lightbox-stage video { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.media-lightbox-stage video { width: 100%; height: 100%; }
.media-lightbox-close { position: absolute; top: 9px; right: 11px; z-index: 2; width: 32px; height: 32px; border: 1px solid #365267; border-radius: 999px; background: #0b1721; color: #fff; font-size: 1.25rem; line-height: 1; cursor: pointer; }
.media-lightbox-link { justify-self: center; margin-top: 10px; }
.media-lightbox-link[hidden] { display: none !important; }

@media (max-width: 1050px) {
  .gallery-grid.gallery-grid-compact { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .export-filter-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
  .export-member-row { grid-template-columns: auto minmax(0,1fr) auto; }
  .export-member-departments { grid-column: 2 / -1; white-space: normal; }
  .export-filter-grid { grid-template-columns: 1fr; }
  .export-member-toolbar { align-items: flex-start; flex-direction: column; }
  .gallery-grid.gallery-grid-compact { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px) {
  .login-intent-card { padding: 12px; }
  .login-intent-form .google-wordmark-button, .google-wordmark-button { width: 126px; min-height: 38px; }
  .onboarding-mode-switch { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
  .onboarding-mode-switch a { text-align: center; }
  .request-status-stack { align-items: flex-start; }
  .gallery-grid.gallery-grid-compact { grid-template-columns: 1fr 1fr; gap: 8px; }
  .media-expand { opacity: 1; transform: none; }
  .media-lightbox { width: 96vw; height: 88vh; }
}
.export-filter-grid.individual-mode label:not(:last-child) { display: none; }
.export-filter-grid.individual-mode { grid-template-columns: minmax(240px, 520px); }


/* v0.5.2 — polished login flow, classic export preview, gallery-only public media */
.login-panel-v052 { max-width: 540px; }
.login-panel-v052 > p { max-width: 520px; margin-bottom: 24px; }
.login-access-form { display: grid; gap: 18px; }
.login-route-picker { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0; border: 0; }
.login-route-picker > legend { grid-column: 1 / -1; margin: 0 0 2px; padding: 0; color: #7893aa; font: 700 .68rem/1.3 "SFMono-Regular", Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
.login-route-option { position: relative; display: block; cursor: pointer; }
.login-route-option > input { position: absolute; inset: 0; opacity: 0; pointer-events: none; }
.login-route-surface { min-height: 158px; height: 100%; display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto 1fr; align-items: start; gap: 13px; padding: 17px; border: 1px solid #1d3448; border-radius: 13px; background: linear-gradient(155deg, #0c1722, #071019 72%); box-shadow: inset 0 1px 0 rgba(255,255,255,.025); transition: border-color .16s ease, background .16s ease, transform .16s ease, box-shadow .16s ease; }
.login-route-option:hover .login-route-surface { transform: translateY(-2px); border-color: #315d7d; background: linear-gradient(155deg, #0e1c29, #08121b 72%); }
.login-route-option > input:focus-visible + .login-route-surface { outline: 2px solid #49aaf0; outline-offset: 3px; }
.login-route-option > input:checked + .login-route-surface { border-color: #2b8fd5; background: linear-gradient(155deg, #0d2232, #08141f 76%); box-shadow: inset 0 0 0 1px rgba(64,164,232,.16), 0 14px 35px rgba(0,0,0,.18); }
.login-route-icon { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #2a4a64; border-radius: 10px; background: #0b1925; position: relative; }
.login-route-icon i, .login-route-icon::before, .login-route-icon::after { content: ""; display: block; position: absolute; }
.login-route-icon-member i { width: 10px; height: 10px; top: 8px; border: 2px solid #69bdf6; border-radius: 50%; }
.login-route-icon-member::after { width: 17px; height: 9px; bottom: 7px; border: 2px solid #69bdf6; border-bottom: 0; border-radius: 9px 9px 2px 2px; }
.login-route-icon-apply::before { width: 15px; height: 19px; border: 2px solid #69bdf6; border-radius: 3px; }
.login-route-icon-apply::after { width: 8px; height: 2px; background: #69bdf6; box-shadow: 0 5px 0 #69bdf6; }
.login-route-copy { min-width: 0; display: grid; align-content: start; gap: 7px; padding-top: 1px; }
.login-route-copy strong { color: #edf7ff; font-size: .94rem; line-height: 1.25; letter-spacing: -.01em; }
.login-route-copy small { color: #8199ad; font-size: .75rem; line-height: 1.48; }
.login-route-check { width: 21px; height: 21px; display: grid; place-items: center; border: 1px solid #2c465c; border-radius: 50%; color: transparent; font-size: .7rem; font-weight: 900; background: #08121a; transition: all .15s ease; }
.login-route-option > input:checked + .login-route-surface .login-route-check { color: #fff; background: #1976c9; border-color: #4ba9ec; }
.login-google-row { display: flex; align-items: center; gap: 13px; padding-top: 2px; }
.login-google-row > small { color: #6f879b; font-size: .7rem; }
.google-login-button { min-height: 40px; padding: 5px 14px 5px 6px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid #31516b; border-radius: 9px; background: linear-gradient(180deg, #0e1d29, #09131c); color: #edf6fd; font-weight: 800; cursor: pointer; box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.google-login-button:hover { border-color: #3d789f; background: linear-gradient(180deg, #112738, #0b1823); }
.google-login-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; background: #fff; box-shadow: 0 1px 5px rgba(0,0,0,.25); }
.google-login-icon img { width: 16px; height: 16px; display: block; }
.google-login-button > span:last-child { padding-right: 2px; font-size: .86rem; letter-spacing: .01em; }

.export-classic { gap: 15px; }
.export-classic > fieldset { margin-bottom: 1px; }
.export-preview-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; margin-top: 9px; padding: 20px 0 5px; border-top: 1px solid var(--line); }
.export-preview-head h2 { margin: 6px 0 5px; font-size: 1.3rem; letter-spacing: -.025em; }
.export-preview-head p { margin: 0; max-width: 680px; color: var(--muted); font-size: .82rem; }
.export-preview-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.export-selected-badge { display: inline-flex; align-items: baseline; gap: 5px; min-height: 36px; padding: 7px 11px; border: 1px solid #2a5878; border-radius: 9px; background: #0a1b28; color: #8fa9bd; font-size: .72rem; }
.export-selected-badge strong { color: #e7f6ff; font-size: .9rem; }
.export-member-table-wrap { max-height: 470px; overflow: auto; border: 1px solid #1d3447; border-radius: 11px; background: #071019; scrollbar-gutter: stable; }
.export-member-table { margin: 0; min-width: 760px; }
.export-member-table thead { position: sticky; top: 0; z-index: 2; background: #0c1721; }
.export-member-table th { background: #0c1721; }
.export-member-table tbody tr { transition: background .12s ease; }
.export-member-table tbody tr:hover { background: #0a1722; }
.export-member-table tr[hidden] { display: none; }
.export-check-cell { width: 46px; text-align: center; }
.export-check-cell input { margin: 0 auto; display: block; }
.export-person-copy { min-width: 0; display: grid; gap: 2px; }
.export-person-copy strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.export-person-copy small, .muted-cell { color: var(--muted); font-size: .72rem; }
.export-filter-empty { margin: 12px; }
.export-download-row { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; border: 1px solid #24577e; border-radius: 10px; background: linear-gradient(135deg, #081929, #07121d); }
.export-download-row > div { display: flex; align-items: baseline; gap: 6px; color: var(--muted); font-size: .8rem; }
.export-download-row > div strong { color: #e5f4ff; font-size: 1.12rem; }


@media (max-width: 760px) {
  .login-route-picker { grid-template-columns: 1fr; }
  .login-route-surface { min-height: 0; }
  .login-google-row { align-items: flex-start; flex-direction: column; }
  .export-preview-head { align-items: flex-start; flex-direction: column; }
  .export-preview-actions { justify-content: flex-start; }
  .export-download-row { align-items: stretch; flex-direction: column; }
  .export-download-row .button { width: 100%; }
}

/* v0.5.3 — simplified login selector, cleaner onboarding typography and request waiting page */
.login-panel-v053 { max-width: 520px; }
.login-panel-v053 > p { max-width: 500px; margin-bottom: 24px; }
.login-access-form-v053 { gap: 20px; }
.login-simple-picker { margin: 0; padding: 0; border: 0; }
.login-simple-picker > legend { margin: 0 0 9px; padding: 0; color: #7893aa; font: 700 .68rem/1.3 "SFMono-Regular", Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
.login-segmented-switch { width: min(100%, 390px); display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; padding: 4px; border: 1px solid #2a4357; border-radius: 11px; background: #071019; box-shadow: inset 0 1px 0 rgba(255,255,255,.025); }
.login-segmented-switch label { position: relative; min-width: 0; cursor: pointer; }
.login-segmented-switch input { position: absolute; opacity: 0; pointer-events: none; }
.login-segmented-switch span { min-height: 44px; display: grid; place-items: center; padding: 0 14px; border-radius: 7px; color: #7f97aa; font: 800 .76rem/1 "SFMono-Regular", Consolas, monospace; letter-spacing: .075em; background: transparent; border: 1px solid transparent; }
.login-segmented-switch input:checked + span { color: #e7f5ff; background: #10283a; border-color: #285879; }
.login-segmented-switch input:focus-visible + span { outline: 2px solid #4aa8e8; outline-offset: -1px; }
.login-picker-note { width: min(100%, 430px); margin: 9px 0 0 !important; color: #71899c !important; font-size: .72rem !important; line-height: 1.55; }
.login-google-stack { display: grid; justify-items: start; gap: 7px; }
.login-continue-label { color: #71899c; font-size: .68rem; font-weight: 700; letter-spacing: .02em; }
.google-login-button-v053 { min-height: 40px; min-width: 118px; padding: 5px 15px 5px 6px; border-color: #2b485f; background: #0a1721; box-shadow: none; }
.google-login-button-v053:hover { border-color: #376581; background: #0d1d29; }
.google-login-button-v053 .google-login-icon { width: 27px; height: 27px; border-radius: 6px; box-shadow: none; }
.google-login-button-v053 .google-login-icon img { width: 15px; height: 15px; }

/* Use the exact public-site RO/EN control on onboarding; only remove the hero-specific top margin. */
.onboarding-heading-row > .onboarding-form-language { flex: 0 0 auto; margin-top: 0; }

/* Section headings are intentionally stacked so bold and explanatory text never run together. */
.application-form .form-section-title { display: grid; grid-template-columns: 1fr; align-items: start; justify-content: stretch; gap: 7px; margin-top: 13px; margin-bottom: 12px; padding: 13px 0 10px; }
.application-form .form-section-title strong { display: block; font-size: 1rem; line-height: 1.25; }
.application-form .form-section-title small { display: block; max-width: 760px; text-align: left; color: var(--muted); font-size: .76rem; line-height: 1.55; }
.application-form .form-section-title + label,
.application-form .form-section-title + fieldset { margin-top: 4px; }
.auto-join-date { grid-template-columns: auto 1fr; align-items: baseline; gap: 6px 16px; }
.auto-join-date > span { grid-column: 1; }
.auto-join-date > strong { grid-column: 2; }
.auto-join-date > small { grid-column: 1 / -1; display: block; margin-top: 2px; }

.request-status-shell { align-items: stretch; }
.request-status-panel { max-width: 610px; }
.request-status-topline { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.request-status-language { margin-top: 0; flex: 0 0 auto; }
.request-state { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; padding: 13px 14px; border: 1px solid #29465c; border-radius: 10px; background: #09151f; }
.request-state-mark { width: 12px; height: 12px; flex: 0 0 auto; border-radius: 50%; background: #5e829c; box-shadow: 0 0 0 5px rgba(94,130,156,.09); }
.request-state > div { display: grid; gap: 3px; }
.request-state > div > span { color: #6f8ba1; font: 800 .63rem/1.2 "SFMono-Regular", Consolas, monospace; letter-spacing: .11em; }
.request-state > div > strong { color: #e6f3fc; font-size: .9rem; }
.request-state-pending { border-color: #2b5673; background: #091925; }
.request-state-pending .request-state-mark { background: #4c9bd0; box-shadow: 0 0 0 5px rgba(76,155,208,.1); }
.request-state-rejected { border-color: #5a4148; background: #181115; }
.request-state-rejected .request-state-mark { background: #b96a73; box-shadow: 0 0 0 5px rgba(185,106,115,.09); }
.request-status-panel h1 { margin-bottom: 10px; }
.request-status-panel > p { max-width: 570px; color: #91a5b5; line-height: 1.7; }
.request-status-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 24px 0; }
.request-status-summary > div { min-width: 0; display: grid; gap: 5px; padding: 12px 13px; border: 1px solid #20394d; border-radius: 9px; background: #08131c; }
.request-status-summary span { color: #6f879a; font-size: .66rem; text-transform: uppercase; letter-spacing: .07em; }
.request-status-summary strong { overflow-wrap: anywhere; color: #dcecf7; font-size: .86rem; }
.request-status-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.request-status-actions form { margin: 0; }
.request-status-visual { opacity: .92; }

@media (max-width: 700px) {
  .login-segmented-switch { width: 100%; }
  .request-status-summary { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .login-panel-v053 > p { margin-bottom: 19px; }
  .login-segmented-switch span { min-height: 42px; padding: 0 9px; font-size: .7rem; }
  .onboarding-heading-row > .onboarding-form-language { margin-top: 2px; }
  .application-form .form-section-title { gap: 8px; padding-top: 15px; }
  .auto-join-date { grid-template-columns: 1fr; gap: 5px; }
  .auto-join-date > span, .auto-join-date > strong, .auto-join-date > small { grid-column: 1; }
  .request-status-topline { align-items: flex-start; flex-direction: column; gap: 12px; }
  .request-status-actions { align-items: stretch; flex-direction: column; }
  .request-status-actions .button, .request-status-actions form, .request-status-actions form button { width: 100%; }
}

/* v0.5.4 — final login choice cards + reliable live export filtering */
.login-panel-v054 { max-width: 590px; }
.login-panel-v054 > p { max-width: 560px; margin-bottom: 24px; }
.login-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.login-choice-card { min-height: 218px; display: flex; flex-direction: column; gap: 11px; padding: 18px; border: 1px solid #24445d; border-radius: 11px; background: #08131d; color: inherit; text-decoration: none; box-shadow: inset 0 1px 0 rgba(255,255,255,.025); }
.login-choice-card:hover, .login-choice-card:focus-visible { border-color: #3b78a3; background: #0a1824; outline: none; }
.login-choice-topline { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #718ca2; font: 700 .66rem/1.2 "SFMono-Regular", Consolas, monospace; letter-spacing: .1em; }
.login-choice-number { color: #4d89b1; }
.login-choice-label { text-align: right; }
.login-choice-card > strong { margin-top: 5px; color: #edf7ff; font-size: 1.02rem; line-height: 1.3; }
.login-choice-card > p { margin: 0; color: #849bad; font-size: .78rem; line-height: 1.58; }
.login-choice-google { margin-top: auto; min-height: 40px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 9px; padding-top: 12px; border-top: 1px solid #1b3346; color: #cfe5f4; font-size: .76rem; font-weight: 800; }
.google-mini-icon { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 6px; background: #fff; }
.google-mini-icon img { width: 15px; height: 15px; display: block; }
.login-choice-arrow { color: #5faee4; font-size: 1rem; }
.export-visible-badge { display: inline-flex; align-items: baseline; gap: 5px; min-height: 36px; padding: 7px 11px; border: 1px solid #203f56; border-radius: 9px; background: #081721; color: #8099ab; font-size: .72rem; }
.export-visible-badge strong { color: #bdddf1; font-size: .9rem; }
.export-member-table tbody tr.is-filtered-out { display: none !important; }

@media (max-width: 760px) {
  .login-choice-grid { grid-template-columns: 1fr; }
  .login-choice-card { min-height: 176px; }
}


/* v0.5.6 — access-review spacing, global language switch and official contact channels */
.request-details {
  column-gap: clamp(26px, 3vw, 48px);
  row-gap: 0;
}
.request-details > div {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(118px, .8fr) minmax(0, 1.2fr);
  align-items: start;
  column-gap: 18px;
  padding: 13px 0;
}
.request-details > div > span {
  line-height: 1.45;
}
.request-details > div > strong {
  min-width: 0;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.nav-language a.active { color: #e5f4ff; background: #10283a; border-radius: 5px; }
.contact-social-panel { padding: clamp(20px, 3vw, 30px); }
.social-list-v056 { gap: 0; margin-top: 8px; }
.social-list-v056 a {
  display: grid;
  grid-template-columns: minmax(96px, .7fr) minmax(0, 1.4fr) auto;
  align-items: center;
  gap: 18px;
  padding: 15px 2px;
  color: #a8bed0;
  transition: color .15s ease, padding-left .15s ease;
}
.social-list-v056 a:hover { color: #e4f4ff; padding-left: 6px; }
.social-list-v056 a strong { color: #dceeff; font-size: .92rem; }
.social-list-v056 a span { color: #718ca2; overflow-wrap: anywhere; }
.social-list-v056 a b { color: #4d9ed9; font-size: .9rem; }

@media (max-width: 760px) {
  .request-details { grid-template-columns: 1fr; }
  .request-details > div { grid-template-columns: minmax(112px, .7fr) minmax(0, 1.3fr); column-gap: 20px; }
  .social-list-v056 a { grid-template-columns: 1fr auto; gap: 8px 14px; }
  .social-list-v056 a span { grid-column: 1 / -1; font-size: .74rem; }
}

@media (max-width: 430px) {
  .request-details > div { grid-template-columns: 1fr; gap: 5px; }
}

/* v0.5.7 — complete Access Requests queue + reconsideration archive */
.access-page-title { margin-bottom: 12px; }
.access-tabs { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.access-tabs a { min-height: 38px; display: inline-flex; align-items: center; gap: 9px; padding: 7px 11px; border: 1px solid #20394d; border-radius: 9px; background: #08131c; color: #8fa6b8; text-decoration: none; font-size: .76rem; font-weight: 750; }
.access-tabs a:hover { border-color: #315e7c; color: #d8edfb; }
.access-tabs a.active { border-color: #2c79ad; background: #0a1c29; color: #e4f5ff; }
.access-tabs a strong { min-width: 24px; min-height: 22px; display: grid; place-items: center; padding: 0 6px; border-radius: 999px; background: #10283a; color: #8fd0fb; font: 800 .68rem/1 monospace; }
.access-list-summary { display: flex; align-items: baseline; gap: 7px; margin: 0 0 12px; color: #71899c; font-size: .72rem; }
.access-list-summary strong { color: #dcedf8; font-size: .9rem; }
.request-review-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; }
.request-review-actions form { margin: 0; }
.request-card-archived { border-color: #273a49; background: #081119; }
.status-pill.archived { border-color: #4b4b57; background: #15151b; color: #aeb2bf; }
.status-pill.danger { border-color: #633d43; background: #1b1114; color: #e8959e; }
.archived-request-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); }
.archived-request-footer > div { min-width: 0; display: grid; gap: 4px; }
.archived-request-footer > div > span { color: #cbdce7; font-weight: 800; font-size: .78rem; }
.archived-request-footer small { color: #748b9d; line-height: 1.45; }
.access-empty-state { grid-column: 1 / -1; }
.access-empty-state a { color: #77c6f7; }
@media (max-width: 700px) {
  .access-tabs { align-items: stretch; }
  .access-tabs a { flex: 1; justify-content: space-between; }
  .request-review-actions, .archived-request-footer { align-items: stretch; flex-direction: column; }
  .request-review-actions form, .request-review-actions button, .archived-request-footer form, .archived-request-footer button { width: 100%; }
}
.request-state-archived { border-color: #4a4f5d; background: #111319; }
.request-state-archived .request-state-mark { background: #8b93a4; box-shadow: 0 0 0 5px rgba(139,147,164,.09); }


/* v0.5.8 — readable full-width Access Request cards */
.access-grid {
  grid-template-columns: 1fr;
  gap: 14px;
}
.access-grid .request-card-v3 {
  grid-template-columns: 132px minmax(0, 1fr);
}
.access-grid .request-photo-wrap {
  width: 132px;
}
.access-grid .request-body {
  min-width: 0;
  padding: 20px 22px;
}
.access-grid .request-heading {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.access-grid .request-details {
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  column-gap: clamp(30px, 4vw, 58px);
  margin-top: 4px;
}
.access-grid .request-details > div {
  grid-template-columns: minmax(132px, .72fr) minmax(0, 1.28fr);
  column-gap: 20px;
  padding: 14px 0;
}
.access-grid .request-details > div > span {
  color: #86a0b4;
  line-height: 1.45;
}
.access-grid .request-details > div > strong {
  color: #e6f2fb;
  line-height: 1.48;
  word-break: normal;
  overflow-wrap: break-word;
  hyphens: none;
}

@media (max-width: 1080px) {
  .access-grid .request-details {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .access-grid .request-card-v3 {
    grid-template-columns: 1fr;
  }
  .access-grid .request-photo-wrap {
    width: 104px;
    margin: 16px 0 0 18px;
    border-radius: 9px;
  }
  .access-grid .request-body {
    padding: 16px 18px 20px;
  }
}

@media (max-width: 470px) {
  .access-grid .request-details > div {
    grid-template-columns: 1fr;
    gap: 5px;
    padding: 12px 0;
  }
}


/* v0.5.9 — subtle department identity and safer member editing */
.admin-table .dept-tag, .member-card .dept-tag { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dept-color) 5%, transparent); }
.drawer-actions button:disabled { opacity: .5; cursor: wait; }

/* v0.5.10: compact rank/department ordering controls */
.settings-order-item{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;align-items:stretch}
.settings-order-controls{display:flex;flex-direction:column;gap:6px;justify-content:center}
.settings-order-controls form{margin:0}
.order-arrow{width:32px;height:32px;border:1px solid rgba(74,144,226,.32);border-radius:9px;background:rgba(9,22,35,.72);color:#9cc9f4;font:700 16px/1 system-ui;cursor:pointer;transition:border-color .15s ease,background .15s ease,color .15s ease}
.order-arrow:hover:not(:disabled){border-color:rgba(74,144,226,.72);background:rgba(28,73,112,.45);color:#d9efff}
.order-arrow:disabled{opacity:.28;cursor:not-allowed}
@media(max-width:640px){.settings-order-item{grid-template-columns:30px minmax(0,1fr);gap:7px}.order-arrow{width:29px;height:29px;border-radius:8px}}

/* v0.5.11 — department-targeted events and mandatory attendance rules */
.event-rule-box { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 9px; background: #09141f; }
.event-rule-box > div:first-child { display: grid; gap: 3px; }
.event-rule-box small { display: block; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.event-required-row { grid-template-columns: minmax(230px,1fr) minmax(180px,.55fr); align-items: end; }
.event-required-check { min-height: 100%; }
.event-required-check > span { display: grid; gap: 2px; }
.event-department-picker { grid-template-columns: repeat(3,minmax(0,1fr)); }
.event-department-picker .check-card { justify-content: flex-start; }
.event-pill-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.event-target-summary { display: grid; gap: 6px; margin-top: 10px; }
.event-target-summary > span { color: var(--muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }
.event-member-targets { margin-top: 10px; }
.event-meta.event-meta-four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.event-meta.event-meta-four strong { overflow-wrap: anywhere; }
.event-finalized-note, .event-member-warning { margin-top: 12px; padding: 9px 10px; border: 1px solid #29445d; border-radius: 8px; background: #0a1722; color: #9fc2df; font-size: .74rem; line-height: 1.45; }
.event-member-warning.missed { border-color: #633d43; background: #1b1114; color: #e8959e; }
.event-member-warning.attended { border-color: #2b6c50; background: #0a1e16; color: #71d9a6; }
.event-settings-panel { margin-top: 12px; }
.event-settings-panel .panel-heading > div { display: grid; gap: 3px; }
.event-settings-panel .panel-heading span { color: var(--muted); font-size: .72rem; }

@media (max-width: 900px) {
  .event-department-picker { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .event-meta.event-meta-four { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .event-required-row { grid-template-columns: 1fr; }
  .event-department-picker { grid-template-columns: 1fr; }
  .event-meta.event-meta-four { grid-template-columns: 1fr 1fr; }
}

/* v0.5.12 — achievements + delegated media editing */
.achievement-timeline { max-width: 920px; }
.achievement-date { line-height: 1.45; font-weight: 700; letter-spacing: .02em; }
.public-edit-link { margin-top: 14px; width: fit-content; }
.achievement-admin-list { display: grid; gap: 10px; margin-top: 14px; }
.achievement-admin-card { padding: 0; overflow: hidden; }
.achievement-admin-card > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; }
.achievement-admin-card > summary::-webkit-details-marker { display: none; }
.achievement-admin-card > summary > div { display: grid; gap: 4px; min-width: 0; }
.achievement-admin-card > summary strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.achievement-admin-card > summary small { color: var(--muted); font-family: monospace; }
.achievement-admin-card[open] > summary { border-bottom: 1px solid var(--line); background: #0b1621; }
.achievement-admin-body { display: grid; gap: 14px; padding: 18px; }
.achievement-create-panel { margin-top: 14px; }
.media-permission-form { display: flex; align-items: center; }
.user-role-row { grid-template-columns: minmax(170px,1.3fr) auto minmax(250px,1fr) minmax(180px,auto) auto; }

@media (max-width: 1050px) {
  .user-role-row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 680px) {
  .achievement-admin-card > summary { padding: 14px; }
  .achievement-admin-body { padding: 14px; }
  .timeline.achievement-timeline article { grid-template-columns: 92px 1fr; gap: 18px; padding-left: 22px; }
  .user-role-row { grid-template-columns: 1fr; }
}