/* Shared narrow-screen safeguards, loaded after component styles. */
.portal-main,.control-main,.split>*,.form-grid>*,.cards>*,.contact-routes>*{min-width:0}
.bank-details p,.record p,.record pre{overflow-wrap:anywhere}
dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}
dialog form,dialog .form-grid{min-width:0}dialog input,dialog select,dialog textarea{max-width:100%;min-width:0}
@media(max-width:640px){
 .table-wrap:has(.mobile-record-table){border:0;background:transparent;overflow:visible}
 .mobile-record-table,.mobile-record-table tbody{display:block;width:100%;min-width:0!important}
 .mobile-record-table thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .mobile-record-table tbody tr{display:block;border:1px solid #dce4ee;border-radius:12px;background:#fff;margin:0 0 16px;padding:8px 16px;box-shadow:0 3px 12px #17314c05}
 .mobile-record-table tbody td{display:grid;grid-template-columns:minmax(76px,30%) minmax(0,1fr);gap:12px;align-items:start;min-width:0;width:auto;padding:12px 0;border:0;border-bottom:1px solid #edf1f5;text-align:left;font-size:13px;line-height:1.65;overflow-wrap:anywhere;white-space:normal}
 .mobile-record-table tbody td:last-child{border-bottom:0}
 .mobile-record-table td::before{content:attr(data-label);font-size:11px;font-weight:600;color:#58708b;letter-spacing:.025em}
 .mobile-record-table td.mobile-actions-cell{display:flex;flex-wrap:wrap;gap:10px}
 .mobile-record-table td.mobile-actions-cell::before{flex-basis:100%}
 .mobile-record-table .button{min-height:44px;max-width:100%;margin:0;font-size:12px;padding:12px 16px}
 .mobile-record-table td.mobile-empty-cell{display:block}
 .mobile-record-table td.mobile-empty-cell::before{display:none}
 dialog{width:calc(100% - 24px);margin:auto;padding:48px 20px 24px;border-radius:14px}
 dialog h2{font-size:27px;line-height:1.25}dialog h3{font-size:22px}dialog p{font-size:14px;overflow-wrap:anywhere}
 dialog .close{top:8px;right:8px;min-width:44px;min-height:44px}
 input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px!important}
 input[type=file]{width:100%;max-width:100%;font-size:12px!important}
 input[type=file]::file-selector-button{max-width:100%;padding:10px}
 .form-actions{display:flex;flex-wrap:wrap;gap:12px}.form-actions .button{max-width:100%;min-height:44px}
 .bank-details{padding:22px}.bank-details p{font-size:14px}
 .row,.record-actions{flex-wrap:wrap}.record-actions .button{min-height:44px}
 .chapter-row{grid-template-columns:1fr}.chapter-row>*{min-width:0;overflow-wrap:anywhere}
 .programme-pagination{flex-wrap:wrap;gap:14px}.programme-compare-tray{max-height:40dvh;overflow:auto}
 .footer-bottom span{overflow-wrap:anywhere}.control-topline{gap:12px;flex-wrap:wrap}
}
@media(max-width:380px){.section{padding-inline:18px}.portal-main{padding-inline:14px}.pathfinder{width:calc(100% - 28px);padding:20px}.nav{padding-inline:14px;gap:8px}.nav-actions{gap:8px}.dashboard-welcome-profile{flex-direction:column}.footer{padding-inline:18px}}
.table-wrap .button.outline,dialog .button.outline{color:#155a96;border:1px solid #b8cde0;background:#fff}.table-wrap .button.outline:hover,dialog .button.outline:hover{background:#edf4fb}
.footer .footer-signature{flex-direction:column;align-items:flex-start;gap:18px}.footer-official-logo{display:block;width:160px;max-width:100%;height:auto;aspect-ratio:239/95;object-fit:contain}
.library-nav .button.outline{color:#155a96;border:1px solid #b8cde0;background:#fff}.library-nav{flex-wrap:wrap}.library-nav .button{min-height:44px}

/* Preserve the official artwork and interior white; hide the exterior only. */
img.brand-logo[src*="/images/branding/ieepc-logo-sharpened.png"],
img.footer-official-logo[src*="/images/branding/ieepc-logo-sharpened.png"] {
  -webkit-mask-image: url('/images/branding/ieepc-logo-oval-mask.svg');
  mask-image: url('/images/branding/ieepc-logo-oval-mask.svg');
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
/* Blue campaign panels: quiet orbital detail, with clear foreground contrast. */
.section.dark:has(> .chapter-row),
.story {
  background: #155a96;
  color: #fff;
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.section.dark:has(> .chapter-row)::before,
.story::before {
  content: '';
  position: absolute;
  width: clamp(360px, 48vw, 760px);
  aspect-ratio: 1;
  right: -14%;
  top: -240px;
  border: 1px solid #ffffff26;
  border-radius: 50%;
  box-shadow: 0 0 0 42px #ffffff08, 0 0 0 43px #ffffff14,
              0 0 0 100px #ffffff05, 0 0 0 101px #ffffff12;
  pointer-events: none;
  z-index: 0;
}
.section.dark:has(> .chapter-row)::after {
  content: '';
  position: absolute;
  width: 340px;
  aspect-ratio: 1;
  left: -200px;
  bottom: -210px;
  border: 36px solid #ffffff0a;
  border-radius: 50%;
  box-shadow: 0 0 0 24px #ffffff08;
  pointer-events: none;
}
.section.dark:has(> .chapter-row) > * { position: relative; z-index: 1; }
.section.dark:has(> .chapter-row) .eyebrow { color: #d3e7fa; }
.section.dark:has(> .chapter-row) .intro { color: #e7f1fa; }
.section.dark:has(> .chapter-row) .chapter { border-color: #ffffff4d; }
.section.dark:has(> .chapter-row) .badge { background: #e6effa; color: #164b78; }
.section.dark:has(> .chapter-row) .badge.active { background: #d9f3e4; color: #155237; }
.section.dark:has(> .chapter-row) .text-link { color: #fff; }
.story img { opacity: .2; }
.story::after {
  display: block;
  background: linear-gradient(90deg, #155a96eb, #155a9655);
  pointer-events: none;
  z-index: 0;
}
.story::before { z-index: 1; top: -32%; right: -12%; }
.story .story-copy, .story .carousel-controls { z-index: 2; }
.story .story-copy p { color: #edf5fc; }
.story .carousel-controls button { background: #ffffff12; border-color: #ffffff66; color: #fff; min-width: 44px; min-height: 44px; }
.story .carousel-controls button:hover { background: #ffffff2b; }
@media(max-width:800px) {
  .story img { opacity: .4; }
  .story::after { background: linear-gradient(180deg, #155a9622, #155a96 68%); }
  .story::before { width: 390px; top: auto; bottom: -110px; right: -240px; }
  .section.dark:has(> .chapter-row)::before { top: -170px; right: -270px; }
  .section.dark:has(> .chapter-row) .chapter-row { gap: 28px 20px; }
}

/* Contact hero: orbital blue, with the existing photograph kept clear. */
.page-head:has(+ .contact-experience) {
  background-color: #155a96;
  background-image:
    radial-gradient(circle at 40% 120%, transparent 0 125px, #ffffff0d 126px 155px, transparent 156px 181px, #ffffff0a 182px 183px, transparent 184px),
    radial-gradient(circle at 98% -30%, transparent 0 235px, #ffffff0d 236px 277px, transparent 278px 312px, #ffffff14 313px 314px, transparent 315px),
    linear-gradient(115deg, #124e84, #1b659f);
}
.page-head:has(+ .contact-experience) p { color: #e8f2fc; }
.page-head:has(+ .contact-experience) .breadcrumbs { color: #d2e5f7; }
@media(max-width:800px) {
  .page-head:has(+ .contact-experience) {
    background-image:
      radial-gradient(circle at 115% 0%, transparent 0 150px, #ffffff0d 151px 183px, transparent 184px 215px, #ffffff14 216px 217px, transparent 218px),
      linear-gradient(145deg, #124e84, #1b659f);
  }
}

.password-reveal{display:block;position:relative;width:100%;min-width:0}
.password-reveal input{display:block;width:100%;padding-right:78px!important}
.password-reveal-toggle{position:absolute;right:5px;top:50%;transform:translateY(-50%);min-width:64px;min-height:44px;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:#155a96;font-size:12px;font-weight:600;line-height:1;cursor:pointer}
.password-reveal-toggle:hover{background:#155a9610}
.password-reveal-toggle:focus-visible{outline:2px solid #155a96;outline-offset:-2px}

/* Shared public page heroes use the institute's blue orbital design. */
.page-head {
 background-color:#155a96;
 background-image:
  radial-gradient(circle at 40% 120%,transparent 0 125px,#ffffff0d 126px 155px,transparent 156px 181px,#ffffff0a 182px 183px,transparent 184px),
  radial-gradient(circle at 98% -30%,transparent 0 235px,#ffffff0d 236px 277px,transparent 278px 312px,#ffffff14 313px 314px,transparent 315px),
  linear-gradient(115deg,#124e84,#1b659f);
 color:#fff;
}
.page-head p{color:#e8f2fc}
.page-head .breadcrumbs{color:#d2e5f7}
@media(max-width:800px){
 .page-head{
  background-image:radial-gradient(circle at 115% 0%,transparent 0 150px,#ffffff0d 151px 183px,transparent 184px 215px,#ffffff14 216px 217px,transparent 218px),linear-gradient(145deg,#124e84,#1b659f);
 }
}
@media print{.page-head{background:#fff;color:#111}.page-head p,.page-head .breadcrumbs{color:#333}}

/* Quiet blue-grey body surfaces; white content cards and blue heroes stay distinct. */
#main > .section:not(.dark){background:#f3f7fb}
#main > .section.soft{background:#eaf1f7}
#main > .section .card,
#main > .section .chapter-card,
#main > .section .contact-form-card{background:#fff;border-color:#dce6ef}
#main > .section .notice{background:#e8f0f8;color:#274760}
#main > .section .auth{background:#fff;border:1px solid #dce6ef;border-radius:16px;padding:36px;max-width:570px;box-shadow:0 12px 40px #163b5b06}
#main > .section .contact-routes>a{background:#fff}
@media(max-width:640px){
 #main > .section .auth{padding:26px 20px;border-radius:12px}
}
@media print{
 #main > .section:not(.dark),#main > .section.soft{background:#fff}
 #main > .section .auth{box-shadow:none}
}

/* Restore the photographic story panel and its original readable copy width. */
.story{background:#121722;color:#fff;isolation:auto}
.story::before{display:none}
.story img{opacity:1}
.story::after{display:block;z-index:0;background:linear-gradient(transparent,#000b)}
.story .story-copy{box-sizing:content-box;max-width:680px;padding:64px max(32px,calc((100vw - 1240px)/2));width:auto;flex-shrink:0}
.story .story-copy h2{max-width:680px}
.story .story-copy p{max-width:620px;color:#fff}
@media(max-width:800px){
 .story{display:block;aspect-ratio:auto;height:auto}
 .story::after{display:none}
 .story .story-copy{box-sizing:border-box;max-width:none;width:100%;padding:28px 24px 90px}
 .story .story-copy h2{max-width:24ch}
 .story .story-copy p{max-width:48ch}
}

.selfie-native-button{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:44px;overflow:hidden;cursor:pointer}
.selfie-native-button input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.selfie-native-button:focus-within{outline:2px solid #155a96;outline-offset:3px}
.selfie-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.selfie-field .selfie-preview{max-width:100%;height:auto;max-height:420px;object-fit:contain;border-radius:12px;background:#142d43}
.selfie-field video.selfie-preview{transform:scaleX(-1)}

/* Training evidence is visible and mandatory only after selecting Yes. */
#application-form [data-training-evidence][hidden]{display:none!important}