/* Release 52: focused lesson slides, narration seeking, mobile fit, and navigation alignment. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body,#app,.portal-shell,.portal-main,.workspace,.workspace main{max-width:100%}
.slide-body{display:block;max-width:100%;padding-bottom:0}
.slide-body>*{min-width:0}
.slide img,.quiz img{display:block;max-width:100%;height:auto!important;object-fit:contain}

.audio{display:grid!important;grid-template-columns:auto minmax(130px,auto) auto;grid-template-rows:auto auto;column-gap:13px;row-gap:4px;align-items:center;justify-content:center}
.audio .play{grid-column:1;grid-row:1;width:46px;height:46px;line-height:1;font-family:Arial,sans-serif;font-weight:900;letter-spacing:-4px;padding-right:8px}
.audio .play.pause-active{padding:0;letter-spacing:normal;display:grid;place-items:center}
.audio-summary{grid-column:2;grid-row:1;display:grid;min-width:150px}
.audio select{grid-column:3;grid-row:1}
.audio-timeline{grid-column:1/4;grid-row:2;display:grid!important;grid-template-columns:42px minmax(160px,360px) 42px;gap:8px;align-items:center;min-width:0}
.audio-timeline span{font-size:10px;color:#687588;font-variant-numeric:tabular-nums;text-align:center}
.audio-timeline input{width:100%;height:22px;margin:0;cursor:pointer;accent-color:#D91515;background:transparent}
.module-continuation{margin-top:24px;padding-top:18px;border-top:1px solid #dce3ec}
.module-continuation .portal-primary{white-space:normal;text-align:center;line-height:1.35}

.portal-nav .admin-nav-main{grid-template-columns:24px minmax(0,1fr) 20px!important;align-items:center!important}
.portal-nav .admin-nav-main>span:first-child,.portal-nav nav button .nav-icon{display:grid!important;place-items:center!important;align-self:center!important}
.portal-nav .admin-nav-main>span:nth-child(2),.portal-nav .admin-nav-main>b,.portal-nav nav button>span{align-self:center!important;line-height:1.2!important}
.portal-nav .admin-nav-main>b{display:grid;place-items:center;width:20px;height:20px;margin:0}
.portal-nav nav button{cursor:pointer}
.portal-main.course-completion-main{padding:0;overflow:auto}

.course-completion-header{min-height:72px;background:#fff;border-bottom:1px solid #dce3ec;display:flex;align-items:center;gap:16px;padding:12px 28px}
.course-completion-header small{color:#637286;font-size:10px;font-weight:800;letter-spacing:.14em}
.course-completion-header h1{margin:3px 0 0;color:#071d37;font:700 17px/1.25 Georgia,serif}
.course-completion-canvas{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:38px 28px 50px;background:#f3f6fa;overflow:hidden}
.course-completion-card{position:relative;width:min(920px,100%);background:#fff;border:1px solid #dce3ec;border-top:7px solid #D91515;border-radius:16px;padding:42px 54px 38px;box-shadow:0 24px 65px #071d3716;text-align:center;overflow:hidden}
.course-completion-card:before,.course-completion-card:after{content:"";position:absolute;border:1px solid #ef9f9f;border-radius:50%;pointer-events:none}
.course-completion-card:before{width:250px;height:250px;right:-145px;top:-145px}
.course-completion-card:after{width:170px;height:170px;left:-110px;bottom:-105px}
.course-completion-seal{position:relative;margin:0 auto 18px;width:86px;height:86px;border-radius:50%;display:grid;place-items:center;background:#fcecec;border:1px solid #e98989}
.course-completion-seal:before{content:"";position:absolute;width:60px;height:60px;border-radius:50%;background:#D91515}
.course-completion-seal span{position:relative;color:#fff;font:900 32px/1 Arial,sans-serif}
.course-completion-eyebrow{color:#D91515;font-size:11px;font-weight:900;letter-spacing:.18em;margin-bottom:12px}
.course-completion-card h2{max-width:750px;margin:0 auto;color:#071d37;font:700 clamp(34px,4vw,48px)/1.08 Georgia,serif}
.course-completion-lead{max-width:690px;margin:20px auto 0;color:#637286;font-size:17px;line-height:1.6}
.course-completion-metrics{margin:31px auto 0;display:grid;grid-template-columns:repeat(3,1fr);max-width:690px;border:1px solid #dce3ec;border-radius:10px;overflow:hidden}
.course-completion-metrics>div{padding:17px 12px;background:#fafbfd}
.course-completion-metrics>div+div{border-left:1px solid #dce3ec}
.course-completion-metrics b{display:block;color:#071d37;font-size:23px;margin-bottom:4px}
.course-completion-metrics span{color:#637286;font-size:10px;font-weight:800;letter-spacing:.04em}
.course-completion-certificate{max-width:690px;margin:25px auto 0;padding:16px 20px;border-left:4px solid #D91515;background:#fff5f5;text-align:left;border-radius:0 8px 8px 0;line-height:1.5}
.course-completion-certificate b,.course-completion-certificate span{display:block}
.course-completion-certificate b{color:#071d37;margin-bottom:3px}
.course-completion-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:27px}
.course-completion-actions button{min-height:46px;border-radius:7px;padding:0 22px;font-weight:800;font-size:13px}
.course-completion-review{display:inline-block;margin-top:19px;border:0;background:transparent;color:#D91515;font-size:12px;font-weight:800;text-decoration:underline;cursor:pointer}

@media(max-width:800px){
  html,body,#app{width:100%;max-width:100vw;min-width:0;overflow-x:hidden}
  body{position:relative}
  .portal-shell,.portal-main,.portal-section,.course-card,.course-info,.activity-row,.activity-row>div{width:auto;min-width:0;max-width:100%}
  .portal-shell{grid-template-columns:minmax(0,1fr)!important}
  .portal-main{padding-left:max(10px,env(safe-area-inset-left,0px));padding-right:max(10px,env(safe-area-inset-right,0px))}
  .portal-section{overflow:hidden}
  .course-card{box-sizing:border-box;grid-template-columns:72px minmax(0,1fr)!important;gap:12px!important;padding:12px!important;overflow:hidden}
  .course-cover{min-width:0;width:72px;max-width:100%}
  .course-info h3,.course-info p,.activity-row b,.activity-row p{overflow-wrap:anywhere}
  .course-progress{min-width:0}
  .course-progress i{min-width:0}
  .course-card>.portal-primary{box-sizing:border-box;max-width:100%;white-space:normal}
  .activity-row{display:grid!important;grid-template-columns:68px minmax(0,1fr)!important}
  .activity-row time{display:none}
  .stage>footer{grid-template-columns:52px minmax(0,1fr) 52px!important;min-width:0}
  .stage>footer .audio{grid-template-columns:auto minmax(0,1fr) auto!important;grid-template-rows:auto auto!important;column-gap:7px!important;width:100%;padding:5px 4px!important}
  .stage>footer .audio .play{width:42px!important;height:42px!important;flex-basis:42px!important}
  .stage>footer .audio-summary{display:grid!important;min-width:0!important;max-width:none!important}
  .stage>footer .audio-summary b,.stage>footer .audio-summary span{font-size:9px!important}
  .stage>footer .audio select{width:54px!important;font-size:12px!important;padding:5px 2px!important}
  .stage>footer .audio-timeline{display:grid!important;grid-column:1/4;grid-template-columns:34px minmax(0,1fr) 34px!important;gap:4px;min-width:0;width:100%}
  .stage>footer .audio-timeline span{display:block!important;font-size:8px!important}
  .stage>footer .audio-timeline input{min-width:0;width:100%}
  .portal-nav nav .admin-nav-main{display:grid!important;grid-template-columns:24px minmax(0,1fr) 20px!important;grid-template-rows:auto!important;text-align:left!important}
  .module-continuation .portal-primary{width:100%}
  .course-completion-header{min-height:62px;padding:10px 14px}
  .course-completion-header h1{font-size:13px}
  .course-completion-canvas{min-height:calc(100vh - 130px);padding:16px 10px 26px}
  .course-completion-card{padding:30px 18px 26px;border-radius:12px}
  .course-completion-seal{width:72px;height:72px}
  .course-completion-seal:before{width:50px;height:50px}
  .course-completion-seal span{font-size:27px}
  .course-completion-card h2{font-size:31px}
  .course-completion-lead{font-size:15px}
  .course-completion-metrics{grid-template-columns:1fr;margin-top:23px}
  .course-completion-metrics>div+div{border-left:0;border-top:1px solid #dce3ec}
  .course-completion-actions{display:grid}
  .course-completion-actions button{width:100%}
  .course-completion-certificate{font-size:14px}
}

@media(max-width:390px){
  .stage>footer .audio-summary{display:none!important}
  .stage>footer .audio{grid-template-columns:auto minmax(0,1fr) auto!important}
  .audio-timeline{grid-column:1/4!important}
}