:root{
  --po-paper:#f3f1eb;
  --po-paper-2:#e9e5dc;
  --po-frame:#e5e0d6;
  --po-card:#faf9f5;
  --po-ink:#171b20;
  --po-copy:#5e6368;
  --po-line:#cbc6bc;
  --po-dark:#151a1f;
  --po-dark-2:#20262d;
  --po-dark-3:#2d343c;
  --po-gold:#b38a43;
  --po-gold-2:#d3ab62;
  --po-cream:#eee2cb;
  --po-soft:#e5e3df;
  --po-green:#66926f;
  --po-white:#fff;
}

html,body{margin:0!important;padding:0!important;width:100%;max-width:100%;}
body{background:var(--po-dark);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP","Helvetica Neue",Arial,sans-serif;}
body.elementor-page .elementor,
body.elementor-page .elementor-section-wrap,
body.elementor-page .elementor-widget-html,
body.elementor-page .elementor-widget-html>.elementor-widget-container,
body.elementor-page .elementor .e-con,
body.elementor-page .elementor .e-con-inner,
body.elementor-page .site-main,
body.elementor-page .page-content{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;gap:0!important;overflow:visible!important;}
.po-top,.po-top *{box-sizing:border-box;}
.po-top a{text-decoration:none;}
button{font:inherit;}

/* =============== HEADER =============== */
.po-header{position:fixed;top:0;left:0;right:0;height:72px;z-index:900;pointer-events:none;}
.po-logo{position:absolute;left:26px;top:27px;color:var(--po-ink)!important;pointer-events:auto;transition:color .25s ease;}
.po-logo strong{display:block;font-size:23px;font-weight:950;line-height:1;letter-spacing:1.5px;white-space:nowrap;}
.po-logo small{display:block;margin-top:8px;font-size:9px;font-weight:800;letter-spacing:2.3px;opacity:.66;white-space:nowrap;}
.po-actions{position:absolute;right:24px;top:20px;display:flex;gap:8px;pointer-events:auto;}
.po-head-btn{display:inline-flex;min-height:35px;padding:0 15px;align-items:center;justify-content:center;border:1px solid rgba(23,27,32,.5);background:rgba(243,241,235,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--po-ink)!important;font-size:10px;font-weight:900;letter-spacing:1.2px;cursor:pointer;transition:.2s ease;}
.po-head-btn:hover,.po-head-btn[aria-expanded="true"]{background:var(--po-dark);border-color:var(--po-dark);color:#fff!important;}
.po-explore-icon{display:inline-block;position:relative;width:13px;height:10px;margin-right:8px;}
.po-explore-icon:before,.po-explore-icon:after,.po-explore-icon span{content:"";position:absolute;left:0;width:13px;height:1px;background:currentColor;}
.po-explore-icon:before{top:0}.po-explore-icon span{top:4px}.po-explore-icon:after{top:8px}

/* =============== DESKTOP =============== */
.po-desktop{position:relative;width:100%;height:100svh;min-height:680px;overflow:hidden;background:var(--po-paper);}
.po-scenes{position:absolute;inset:0;}
.po-scene{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;transform:translateX(30px);transition:opacity .35s ease,transform .45s cubic-bezier(.22,.61,.36,1),visibility .35s;overflow:hidden;background:var(--po-paper);color:var(--po-ink);}
.po-scene.is-active{opacity:1;visibility:visible;pointer-events:auto;transform:none;}
.po-scene-inner{height:100%;padding:86px 340px 24px 28px;}
.po-scene-canvas{height:100%;min-height:0;display:flex;flex-direction:column;}
.po-eyebrow{margin:0 0 10px;color:var(--po-gold);font-size:10px;font-weight:950;letter-spacing:.20em;}
.po-scene-title{margin:0;color:var(--po-ink);font-size:clamp(42px,4.2vw,76px);font-weight:950;line-height:.98;letter-spacing:-.055em;}
.po-scene-copy{margin:0;color:var(--po-copy);font-size:clamp(12px,.9vw,16px);line-height:1.85;}
.po-head-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.58fr);align-items:end;gap:48px;margin-bottom:22px;}

/* Desktop vertical scene navigation */
.po-scene-nav{position:fixed;z-index:850;right:24px;top:70px;display:flex;align-items:flex-start;}
.po-scene-nav button{position:relative;display:flex;width:46px;min-height:168px;padding:11px 10px 24px;align-items:center;justify-content:flex-start;border:0;border-left:1px solid rgba(23,27,32,.25);background:transparent;color:var(--po-ink);font-size:11px;font-weight:900;line-height:1.22;letter-spacing:.03em;writing-mode:vertical-rl;text-orientation:upright;cursor:pointer;transition:.18s ease;}
.po-scene-nav button:last-child{border-right:1px solid rgba(23,27,32,.25);}
.po-scene-nav button:after{content:"↓";position:absolute;left:50%;bottom:6px;transform:translateX(-50%);writing-mode:horizontal-tb;font-size:10px;opacity:.55;}
.po-scene-nav button:hover,.po-scene-nav button.is-active{background:var(--po-dark);color:#fff;border-left-color:var(--po-dark);}
.po-scene-nav button.is-active:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--po-gold-2);}

/* =============== START HERE / CONVERSATION =============== */
.po-start-layout{display:grid;grid-template-columns:minmax(250px,310px) minmax(0,1fr);height:100%;border:1px solid var(--po-line);background:var(--po-card);}
.po-start-sidebar{display:flex;flex-direction:column;min-height:0;background:var(--po-dark);color:#fff;padding:24px 20px 18px;}
.po-start-sidebar .po-eyebrow{color:var(--po-gold-2);}
.po-start-sidebar h2{margin:0 0 8px;font-size:26px;line-height:1.15;}
.po-start-sidebar>p{margin:0 0 20px;color:#aeb5bc;font-size:12px;line-height:1.7;}
.po-journey-steps{display:grid;gap:7px;margin-top:4px;}
.po-journey-step{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;padding:12px 10px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.025);cursor:pointer;color:#fff;text-align:left;}
.po-journey-step:hover{background:rgba(255,255,255,.08);}
.po-journey-step span{display:grid;width:30px;height:30px;place-items:center;border:1px solid rgba(255,255,255,.25);font-size:9px;font-weight:950;}
.po-journey-step strong{display:block;margin:1px 0 4px;font-size:13px;}
.po-journey-step small{display:block;color:#aeb5bc;font-size:9px;line-height:1.45;}
.po-start-sidebar-foot{margin-top:auto;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);font-size:9px;line-height:1.6;color:#8d979f;letter-spacing:.06em;}

.po-start-main{min-width:0;min-height:0;display:flex;flex-direction:column;padding:clamp(22px,2.3vw,38px) clamp(26px,3vw,54px) 22px;background:var(--po-paper);overflow:auto;}
.po-start-head{display:flex;justify-content:space-between;gap:30px;align-items:end;padding-bottom:16px;border-bottom:1px solid var(--po-line);}
.po-start-head h1{margin:0;font-size:clamp(36px,3.7vw,66px);font-weight:950;line-height:.96;letter-spacing:-.055em;}
.po-start-head p{max-width:420px;margin:0;color:var(--po-copy);font-size:clamp(11px,.82vw,14px);line-height:1.8;}
.po-chat{display:grid;gap:15px;margin-top:20px;max-width:1120px;}
.po-chat-row{display:flex;gap:14px;align-items:flex-start;}
.po-chat-row.captain{flex-direction:row-reverse;}
.po-avatar{flex:0 0 58px;text-align:center;}
.po-avatar img{display:block;width:54px;height:54px;border:1px solid #aaa49a;border-radius:50%;object-fit:cover;background:#fff;}
.po-avatar small{display:block;margin-top:5px;color:#77716a;font-size:8px;font-weight:800;}
.po-chat-bubble{position:relative;max-width:min(80%,820px);padding:15px 18px;border-radius:9px;font-size:clamp(13px,.95vw,17px);line-height:1.75;}
.po-chat-row.fo .po-chat-bubble{background:var(--po-soft);color:var(--po-ink);}
.po-chat-row.captain .po-chat-bubble{background:var(--po-cream);color:#302a22;}
.po-chat-bubble strong{font-weight:950;}
.po-guide-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:18px;}
.po-guide-card{display:block;padding:13px 14px;border:1px solid var(--po-line);background:var(--po-card);color:var(--po-ink)!important;cursor:pointer;transition:.18s ease;}
.po-guide-card:hover{transform:translateY(-2px);border-color:#8c857a;box-shadow:0 10px 22px rgba(23,27,32,.06);}
.po-guide-card small{display:block;margin-bottom:7px;color:var(--po-gold);font-size:8px;font-weight:950;letter-spacing:.12em;}
.po-guide-card strong{display:block;font-size:clamp(13px,1vw,17px);line-height:1.3;}
.po-guide-card span{display:block;margin-top:6px;color:var(--po-copy);font-size:9px;line-height:1.5;}

/* =============== GUIDED CHOICE / BECOME + LEARNING =============== */
.po-guidance-row{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);
  gap:10px;
  margin-bottom:12px;
}
.po-mini-dialogue{
  display:grid;
  gap:8px;
  padding:12px 14px;
  border:1px solid var(--po-line);
  background:var(--po-card);
}
.po-mini-dialogue .po-chat-row{
  gap:10px;
  margin:0;
}
.po-mini-dialogue .po-avatar{
  flex:0 0 44px;
}
.po-mini-dialogue .po-avatar img{
  width:42px;
  height:42px;
}
.po-mini-dialogue .po-avatar small{
  margin-top:3px;
  font-size:7px;
}
.po-mini-dialogue .po-chat-bubble{
  max-width:calc(100% - 54px);
  padding:10px 13px;
  border-radius:7px;
  font-size:clamp(11px,.74vw,13px);
  line-height:1.65;
}
.po-choice-panel{
  padding:12px 14px;
  border:1px solid var(--po-line);
  background:var(--po-paper-2);
}
.po-choice-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin-bottom:9px;
}
.po-choice-title strong{
  color:var(--po-ink);
  font-size:13px;
}
.po-choice-title span{
  color:#888176;
  font-size:8px;
  font-weight:850;
  letter-spacing:.08em;
}
.po-choice-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
}
button.po-choice-card{
  appearance:none!important;
  width:100%!important;
  margin:0!important;
  padding:9px 10px!important;
  border:1px solid #c9c3b8!important;
  border-radius:2px!important;
  background:#faf9f5!important;
  color:var(--po-ink)!important;
  text-align:left!important;
  font-family:inherit!important;
  cursor:pointer!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease!important;
}
button.po-choice-card:hover{
  transform:translateY(-1px);
  border-color:#8f877b!important;
  background:#fff!important;
}
button.po-choice-card.is-active{
  border-color:var(--po-gold)!important;
  background:#efe5d3!important;
  box-shadow:inset 3px 0 0 var(--po-gold)!important;
}
.po-choice-card small{
  display:block;
  margin-bottom:3px;
  color:var(--po-gold)!important;
  font-size:7px;
  font-weight:950;
  letter-spacing:.1em;
}
.po-choice-card strong{
  display:block;
  color:inherit!important;
  font-size:10.5px;
  line-height:1.35;
}
.po-choice-result{
  margin:8px 0 0;
  padding-top:8px;
  border-top:1px solid #d5cfc5;
  color:#625d55;
  font-size:8.5px;
  line-height:1.55;
}
.po-choice-result strong{
  color:var(--po-ink);
}

/* =============== BECOME =============== */
.po-route-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  flex:1;
  min-height:0;
}
.po-route{
  display:flex;
  flex-direction:column;
  min-height:0;
  padding:clamp(16px,1.5vw,24px);
  border:1px solid var(--po-line);
  background:var(--po-card);
  transition:opacity .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.po-route-num{color:#9c958b;font-size:9px;font-weight:950;letter-spacing:.12em;}
.po-route h3{margin:14px 0 7px;font-size:clamp(18px,1.4vw,26px);line-height:1.15;}
.po-route>p{margin:0;color:var(--po-copy);font-size:clamp(10px,.75vw,13px);line-height:1.7;}
.po-route-details{display:grid;gap:8px;margin-top:auto;padding-top:14px;}
.po-route-details div{padding-top:8px;border-top:1px solid #dedad1;}
.po-route-details small{display:block;margin-bottom:3px;color:var(--po-gold);font-size:7px;font-weight:950;letter-spacing:.1em;}
.po-route-details span{font-size:clamp(9px,.7vw,12px);line-height:1.5;}
.po-route.is-muted{opacity:.34;}
.po-route.is-recommended{
  opacity:1;
  border-color:var(--po-gold);
  box-shadow:0 12px 28px rgba(76,59,31,.10);
  transform:translateY(-2px);
}
.po-next-cta{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:12px;padding:14px 16px;border:1px solid var(--po-line);background:var(--po-dark);color:#fff;}
.po-next-cta p{margin:0;font-size:12px;line-height:1.6;}
.po-next-cta button{border:1px solid rgba(255,255,255,.42);background:transparent;color:#fff;padding:10px 14px;font-size:9px;font-weight:950;letter-spacing:.1em;cursor:pointer;}

/* =============== ONLINE LEARNING =============== */
.po-learning-choice-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.po-course-grid{
  display:grid;
  grid-template-columns:1.15fr .9fr .9fr .95fr;
  gap:10px;
  flex:1;
  min-height:0;
}
.po-course-group{
  position:relative;
  padding:14px 16px;
  border:2px solid #aaa398;
  background:var(--po-card);
  overflow:auto;
  transition:opacity .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.po-course-head{display:flex;align-items:end;justify-content:space-between;gap:10px;padding-bottom:9px;margin-bottom:3px;border-bottom:2px solid var(--po-dark);}
.po-course-head h3{margin:0;font-size:clamp(20px,1.7vw,30px);}
.po-course-head small{font-size:8px;color:#8e877c;font-weight:900;letter-spacing:.08em;}
.po-course-link{
  position:relative;
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:8px 2px;
  border-bottom:1px solid #d6d1c7;
  color:var(--po-ink)!important;
  font-size:clamp(11px,.82vw,14px);
  font-weight:800;
  line-height:1.3;
  transition:background .16s ease,padding .16s ease;
}
.po-course-link:after{content:"→";color:var(--po-gold);}
.po-course-link:hover{background:#eeeae1;padding-left:6px;}
.po-course-group.is-muted{opacity:.32;}
.po-course-group.is-recommended{
  opacity:1;
  border-color:var(--po-gold);
  box-shadow:0 12px 28px rgba(76,59,31,.10);
  transform:translateY(-2px);
}
.po-course-link.is-recommended{
  margin:2px -7px;
  padding:8px 7px;
  border-bottom-color:#d4b577;
  background:#efe5d3;
}
.po-course-link.is-recommended:before{
  content:"RECOMMENDED";
  position:absolute;
  right:23px;
  top:50%;
  transform:translateY(-50%);
  color:#9b7330;
  font-size:6px;
  font-weight:950;
  letter-spacing:.08em;
}
@media(max-width:1250px) and (min-width:901px){
  .po-guidance-row{
    grid-template-columns:1fr;
  }
  .po-mini-dialogue{
    grid-template-columns:1fr 1fr;
  }
  .po-mini-dialogue .po-chat-row.captain{
    flex-direction:row;
  }
  .po-learning-choice-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}



/* =============== V9 / GUIDANCE-FIRST BALANCE =============== */
/* The conversation + guided choice is the primary entry point.
   The lower route/course lists should only use the height they need. */

.po-guidance-row{
  grid-template-columns:minmax(0,1.12fr) minmax(440px,.88fr);
  gap:14px;
  margin-bottom:14px;
  flex:0 0 auto;
}

.po-mini-dialogue{
  gap:11px;
  min-height:190px;
  padding:17px 18px;
}
.po-mini-dialogue .po-chat-row{
  gap:12px;
}
.po-mini-dialogue .po-avatar{
  flex-basis:54px;
}
.po-mini-dialogue .po-avatar img{
  width:52px;
  height:52px;
}
.po-mini-dialogue .po-avatar small{
  margin-top:4px;
  font-size:7.5px;
}
.po-mini-dialogue .po-chat-bubble{
  max-width:calc(100% - 66px);
  padding:13px 16px;
  font-size:clamp(12.5px,.88vw,15px);
  line-height:1.72;
}

.po-choice-panel{
  min-height:190px;
  padding:16px 17px;
}
.po-choice-title{
  margin-bottom:12px;
}
.po-choice-title strong{
  font-size:15px;
}
.po-choice-title span{
  font-size:8px;
}
.po-choice-grid{
  gap:8px;
}
button.po-choice-card{
  min-height:55px!important;
  padding:11px 12px!important;
}
.po-choice-card small{
  margin-bottom:4px;
  font-size:7.5px;
}
.po-choice-card strong{
  font-size:12px;
  line-height:1.35;
}
.po-choice-result{
  margin-top:11px;
  padding-top:10px;
  font-size:9.5px;
  line-height:1.6;
}

/* Route cards: compact reference, not the main event. */
.po-route-grid{
  flex:0 0 auto;
  align-items:start;
  gap:8px;
}
.po-route{
  min-height:0;
  height:auto;
  padding:13px 14px;
}
.po-route-num{
  font-size:8px;
}
.po-route h3{
  margin:9px 0 5px;
  font-size:clamp(17px,1.22vw,22px);
}
.po-route>p{
  font-size:clamp(9.5px,.68vw,11.5px);
  line-height:1.58;
}
.po-route-details{
  gap:5px;
  margin-top:10px;
  padding-top:0;
}
.po-route-details div{
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  gap:7px;
  align-items:start;
  padding-top:5px;
}
.po-route-details small{
  margin:0;
  font-size:6.5px;
}
.po-route-details span{
  font-size:clamp(8.5px,.62vw,10.5px);
  line-height:1.4;
}
.po-next-cta{
  flex:0 0 auto;
  margin-top:9px;
  padding:10px 13px;
}
.po-next-cta p{
  font-size:10.5px;
  line-height:1.5;
}
.po-next-cta button{
  padding:8px 12px;
  font-size:8px;
}

/* Course library: groups stop at their actual content height. */
.po-course-grid{
  flex:0 0 auto;
  align-items:start;
  gap:8px;
}
.po-course-group{
  height:auto;
  min-height:0;
  padding:10px 12px;
  overflow:visible;
}
.po-course-head{
  padding-bottom:6px;
  margin-bottom:1px;
}
.po-course-head h3{
  font-size:clamp(18px,1.45vw,25px);
}
.po-course-head small{
  font-size:7px;
}
.po-course-link{
  padding:5.5px 2px;
  font-size:clamp(10px,.72vw,12.5px);
  line-height:1.25;
}
.po-course-link.is-recommended{
  margin:1px -5px;
  padding:5.5px 5px;
}
.po-course-link.is-recommended:before{
  right:21px;
  font-size:5.5px;
}

/* On shorter laptop screens, preserve the guidance area first. */
@media(max-height:780px) and (min-width:901px){
  .po-guidance-row{
    gap:10px;
    margin-bottom:9px;
  }
  .po-mini-dialogue,
  .po-choice-panel{
    min-height:160px;
    padding:12px 14px;
  }
  .po-mini-dialogue .po-avatar{
    flex-basis:46px;
  }
  .po-mini-dialogue .po-avatar img{
    width:44px;
    height:44px;
  }
  .po-mini-dialogue .po-chat-bubble{
    max-width:calc(100% - 56px);
    padding:9px 12px;
    font-size:11.5px;
    line-height:1.55;
  }
  button.po-choice-card{
    min-height:44px!important;
    padding:8px 9px!important;
  }
  .po-choice-result{
    margin-top:7px;
    padding-top:7px;
  }
  .po-route{
    padding:10px 11px;
  }
  .po-route h3{
    margin:6px 0 4px;
  }
  .po-route>p{
    line-height:1.45;
  }
  .po-route-details{
    gap:3px;
    margin-top:6px;
  }
  .po-route-details div{
    padding-top:3px;
  }
  .po-course-group{
    padding:8px 10px;
  }
  .po-course-link{
    padding:4px 2px;
  }
}

@media(max-width:1250px) and (min-width:901px){
  .po-guidance-row{
    grid-template-columns:minmax(0,1fr);
  }
  .po-mini-dialogue{
    grid-template-columns:1fr 1fr;
    min-height:0;
  }
  .po-choice-panel{
    min-height:0;
  }
}



/* =============== V10 / THREE-STAGE GUIDANCE =============== */
/* 1. Conversation
   2. Guided choice
   3. Route / Course reference list */

.po-guidance-row{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  margin-bottom:12px!important;
}

/* Stage 1 / Conversation */
.po-mini-dialogue{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:9px!important;
  width:100%!important;
  min-height:0!important;
  padding:15px 18px!important;
}

.po-mini-dialogue .po-chat-row{
  width:100%!important;
  max-width:none!important;
}

.po-mini-dialogue .po-chat-row.fo{
  padding-right:12%!important;
}

.po-mini-dialogue .po-chat-row.captain{
  padding-left:12%!important;
}

.po-mini-dialogue .po-chat-bubble{
  width:auto!important;
  max-width:min(78%,920px)!important;
  padding:12px 16px!important;
  font-size:clamp(12.5px,.86vw,15px)!important;
  line-height:1.7!important;
}

/* Stage 2 / Guided choice */
.po-choice-panel{
  width:100%!important;
  min-height:0!important;
  padding:13px 15px 14px!important;
}

.po-choice-title{
  margin-bottom:9px!important;
}

.po-choice-title strong{
  font-size:14px!important;
}

.po-choice-grid{
  display:grid!important;
  gap:7px!important;
}

/* 4 choices for How to Become a Pilot */
.po-choice-grid:not(.po-learning-choice-grid){
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

/* 6 choices for Online Learning */
.po-learning-choice-grid{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
}

button.po-choice-card{
  min-height:50px!important;
  padding:9px 10px!important;
}

.po-choice-card strong{
  font-size:11px!important;
}

.po-choice-result{
  margin-top:8px!important;
  padding-top:8px!important;
  font-size:9px!important;
}

/* Stage 3 / Compact reference */
.po-route-grid,
.po-course-grid{
  margin-top:0!important;
  flex:0 0 auto!important;
}

.po-route{
  padding:11px 12px!important;
}

.po-route h3{
  margin:7px 0 4px!important;
  font-size:clamp(16px,1.15vw,21px)!important;
}

.po-route>p{
  font-size:clamp(9px,.64vw,11px)!important;
  line-height:1.48!important;
}

.po-route-details{
  margin-top:7px!important;
  gap:3px!important;
}

.po-route-details div{
  padding-top:3px!important;
}

.po-course-group{
  padding:9px 11px!important;
}

.po-course-link{
  padding:4.5px 2px!important;
  font-size:clamp(9.5px,.68vw,12px)!important;
}

/* Medium desktop / laptop */
@media(max-width:1360px) and (min-width:901px){
  .po-learning-choice-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  .po-choice-grid:not(.po-learning-choice-grid){
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }

  .po-mini-dialogue .po-chat-row.fo{
    padding-right:7%!important;
  }

  .po-mini-dialogue .po-chat-row.captain{
    padding-left:7%!important;
  }

  .po-mini-dialogue .po-chat-bubble{
    max-width:84%!important;
  }
}

/* Short screens: still keep the same 3-stage structure,
   only tighten vertical spacing. */
@media(max-height:780px) and (min-width:901px){
  .po-guidance-row{
    gap:7px!important;
    margin-bottom:8px!important;
  }

  .po-mini-dialogue{
    gap:6px!important;
    padding:10px 13px!important;
  }

  .po-mini-dialogue .po-avatar{
    flex-basis:42px!important;
  }

  .po-mini-dialogue .po-avatar img{
    width:40px!important;
    height:40px!important;
  }

  .po-mini-dialogue .po-chat-bubble{
    padding:8px 11px!important;
    font-size:11px!important;
    line-height:1.5!important;
  }

  .po-choice-panel{
    padding:9px 11px 10px!important;
  }

  button.po-choice-card{
    min-height:40px!important;
    padding:6px 8px!important;
  }

  .po-choice-card strong{
    font-size:10px!important;
  }

  .po-route{
    padding:8px 9px!important;
  }

  .po-course-group{
    padding:7px 9px!important;
  }

  .po-course-link{
    padding:3.5px 2px!important;
  }
}



/* =============== V11 / 2 TURNS + 2 ROW CHOICE + FULL LIST =============== */

/* Overall 3-stage flow:
   1) conversation
   2) choice cards in two rows
   3) list fills all remaining space */
.po-scene[data-panel="become"] .po-scene-canvas,
.po-scene[data-panel="learning"] .po-scene-canvas{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
}

/* Stage 1: two round trips, full width */
.po-guidance-row{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  margin-bottom:10px!important;
  flex:0 0 auto!important;
}

.po-mini-dialogue{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:7px!important;
  width:100%!important;
  min-height:0!important;
  padding:12px 16px!important;
}

.po-mini-dialogue .po-chat-row{
  width:100%!important;
  max-width:none!important;
}

.po-mini-dialogue .po-chat-row.fo{
  padding-right:11%!important;
}

.po-mini-dialogue .po-chat-row.captain{
  padding-left:11%!important;
}

.po-mini-dialogue .po-chat-bubble{
  max-width:min(80%,980px)!important;
  padding:10px 14px!important;
  font-size:clamp(11.5px,.78vw,14px)!important;
  line-height:1.62!important;
}

/* Stage 2: two rows, much clearer/larger */
.po-choice-panel{
  width:100%!important;
  min-height:0!important;
  padding:12px 14px!important;
}

.po-choice-title{
  margin-bottom:10px!important;
}

.po-choice-title strong{
  font-size:clamp(15px,1.05vw,18px)!important;
}

.po-choice-title span{
  font-size:8px!important;
}

.po-choice-grid{
  display:grid!important;
  gap:9px!important;
}

/* 4 cards -> 2 x 2 */
.po-choice-grid:not(.po-learning-choice-grid){
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

/* 6 cards -> 3 x 2 */
.po-learning-choice-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

button.po-choice-card{
  min-height:64px!important;
  padding:11px 14px!important;
}

.po-choice-card small{
  margin-bottom:5px!important;
  font-size:8px!important;
}

.po-choice-card strong{
  font-size:clamp(13px,.9vw,16px)!important;
  line-height:1.35!important;
}

.po-choice-result{
  margin-top:9px!important;
  padding-top:9px!important;
  font-size:10px!important;
  line-height:1.55!important;
}

/* Stage 3: fill whatever height is left */
.po-route-grid,
.po-course-grid{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  margin-top:0!important;
  align-items:stretch!important;
}

/* Route cards stretch to remaining height */
.po-route-grid{
  gap:9px!important;
}
.po-route{
  height:100%!important;
  min-height:0!important;
  padding:clamp(13px,1vw,18px)!important;
  overflow:auto!important;
}
.po-route h3{
  margin:9px 0 6px!important;
  font-size:clamp(18px,1.35vw,25px)!important;
}
.po-route>p{
  font-size:clamp(10px,.72vw,12.5px)!important;
  line-height:1.58!important;
}
.po-route-details{
  margin-top:auto!important;
  padding-top:10px!important;
  gap:6px!important;
}
.po-route-details div{
  padding-top:6px!important;
}
.po-route-details small{
  font-size:7px!important;
}
.po-route-details span{
  font-size:clamp(9px,.66vw,11.5px)!important;
}

/* Course groups also use the remaining height */
.po-course-grid{
  gap:9px!important;
}
.po-course-group{
  height:100%!important;
  min-height:0!important;
  padding:12px 14px!important;
  overflow:auto!important;
}
.po-course-head{
  position:sticky!important;
  top:-12px!important;
  z-index:2!important;
  margin:-12px -14px 2px!important;
  padding:12px 14px 8px!important;
  background:var(--po-card)!important;
}
.po-course-head h3{
  font-size:clamp(20px,1.55vw,28px)!important;
}
.po-course-link{
  padding:7px 2px!important;
  font-size:clamp(10.5px,.76vw,13.5px)!important;
  line-height:1.3!important;
}

/* CTA should not steal large vertical space */
.po-next-cta{
  flex:0 0 auto!important;
  margin-top:8px!important;
  padding:9px 12px!important;
}
.po-next-cta p{
  font-size:10px!important;
}
.po-next-cta button{
  padding:8px 11px!important;
}

/* Short laptop screens: preserve the structure, let stage 3 scroll internally */
@media(max-height:820px) and (min-width:901px){
  .po-guidance-row{
    gap:7px!important;
    margin-bottom:7px!important;
  }

  .po-mini-dialogue{
    gap:5px!important;
    padding:8px 11px!important;
  }

  .po-mini-dialogue .po-avatar{
    flex-basis:40px!important;
  }

  .po-mini-dialogue .po-avatar img{
    width:38px!important;
    height:38px!important;
  }

  .po-mini-dialogue .po-chat-row.fo{
    padding-right:6%!important;
  }

  .po-mini-dialogue .po-chat-row.captain{
    padding-left:6%!important;
  }

  .po-mini-dialogue .po-chat-bubble{
    max-width:86%!important;
    padding:7px 10px!important;
    font-size:10.5px!important;
    line-height:1.45!important;
  }

  .po-choice-panel{
    padding:8px 10px!important;
  }

  .po-choice-title{
    margin-bottom:6px!important;
  }

  button.po-choice-card{
    min-height:46px!important;
    padding:7px 9px!important;
  }

  .po-choice-card small{
    margin-bottom:2px!important;
    font-size:6.5px!important;
  }

  .po-choice-card strong{
    font-size:10.5px!important;
  }

  .po-choice-result{
    margin-top:5px!important;
    padding-top:5px!important;
    font-size:8px!important;
  }

  .po-route{
    padding:9px 10px!important;
  }

  .po-route h3{
    margin:6px 0 4px!important;
  }

  .po-route-details{
    gap:3px!important;
    padding-top:5px!important;
  }

  .po-course-group{
    padding:8px 10px!important;
  }

  .po-course-head{
    top:-8px!important;
    margin:-8px -10px 1px!important;
    padding:8px 10px 5px!important;
  }

  .po-course-link{
    padding:4px 2px!important;
  }
}

/* Narrower desktop: keep the selection area in exactly two rows */
@media(max-width:1180px) and (min-width:901px){
  .po-choice-grid:not(.po-learning-choice-grid){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .po-learning-choice-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  .po-mini-dialogue .po-chat-row.fo{
    padding-right:5%!important;
  }

  .po-mini-dialogue .po-chat-row.captain{
    padding-left:5%!important;
  }
}



/* =============== V12 / MATCH START HERE VISUAL LANGUAGE =============== */
/* Stage 1: conversation floats directly on the page, like START HERE. */
.po-mini-dialogue{
  border:0!important;
  background:transparent!important;
  padding:2px 0 4px!important;
  gap:12px!important;
}

.po-mini-dialogue .po-chat-row{
  gap:14px!important;
  margin:0!important;
}

.po-mini-dialogue .po-avatar{
  flex:0 0 58px!important;
}

.po-mini-dialogue .po-avatar img{
  width:54px!important;
  height:54px!important;
}

.po-mini-dialogue .po-avatar small{
  margin-top:5px!important;
  font-size:8px!important;
}

.po-mini-dialogue .po-chat-row.fo{
  padding-right:8%!important;
}

.po-mini-dialogue .po-chat-row.captain{
  padding-left:8%!important;
}

.po-mini-dialogue .po-chat-bubble{
  max-width:min(80%,820px)!important;
  padding:15px 18px!important;
  border-radius:9px!important;
  font-size:clamp(13px,.95vw,17px)!important;
  line-height:1.75!important;
}

/* Stage 2: remove the big wrapper completely.
   Only the individual choice cards remain, matching START HERE. */
.po-choice-panel{
  border:0!important;
  background:transparent!important;
  padding:0!important;
}

.po-choice-title{
  margin:2px 0 10px!important;
  padding:0!important;
}

.po-choice-title strong{
  font-size:clamp(14px,1vw,17px)!important;
}

.po-choice-title span{
  font-size:8px!important;
}

.po-choice-grid{
  gap:8px!important;
}

button.po-choice-card{
  min-height:68px!important;
  padding:13px 14px!important;
  border:1px solid var(--po-line)!important;
  border-radius:0!important;
  background:var(--po-card)!important;
  color:var(--po-ink)!important;
  box-shadow:none!important;
}

button.po-choice-card:hover{
  transform:translateY(-2px)!important;
  border-color:#8c857a!important;
  background:var(--po-card)!important;
  box-shadow:0 10px 22px rgba(23,27,32,.06)!important;
}

button.po-choice-card.is-active{
  border-color:var(--po-gold)!important;
  background:#f2eadc!important;
  box-shadow:none!important;
}

.po-choice-card small{
  display:block!important;
  margin-bottom:7px!important;
  color:var(--po-gold)!important;
  font-size:8px!important;
  font-weight:950!important;
  letter-spacing:.12em!important;
}

.po-choice-card strong{
  display:block!important;
  font-size:clamp(13px,1vw,17px)!important;
  line-height:1.3!important;
}

.po-choice-result{
  margin:9px 0 0!important;
  padding:0!important;
  border:0!important;
  color:var(--po-copy)!important;
  font-size:10px!important;
  line-height:1.6!important;
}

/* Keep the two-row structure. */
.po-choice-grid:not(.po-learning-choice-grid){
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

.po-learning-choice-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

/* Give the lower lists the remaining room. */
.po-route-grid,
.po-course-grid{
  flex:1 1 auto!important;
  min-height:0!important;
  align-items:stretch!important;
}

.po-route,
.po-course-group{
  height:100%!important;
  min-height:0!important;
}

.po-course-group{
  overflow:auto!important;
}

/* Laptop-height tuning */
@media(max-height:820px) and (min-width:901px){
  .po-mini-dialogue{
    gap:7px!important;
    padding:0!important;
  }

  .po-mini-dialogue .po-avatar{
    flex-basis:46px!important;
  }

  .po-mini-dialogue .po-avatar img{
    width:44px!important;
    height:44px!important;
  }

  .po-mini-dialogue .po-chat-bubble{
    max-width:84%!important;
    padding:9px 12px!important;
    font-size:11px!important;
    line-height:1.5!important;
  }

  button.po-choice-card{
    min-height:50px!important;
    padding:9px 11px!important;
  }

  .po-choice-card small{
    margin-bottom:3px!important;
    font-size:6.5px!important;
  }

  .po-choice-card strong{
    font-size:11px!important;
  }

  .po-choice-result{
    margin-top:5px!important;
    font-size:8.5px!important;
  }
}



/* =============== V13 / CENTER GUIDANCE LIKE START HERE =============== */
/* Match START HERE's reading width instead of pushing the bubbles inward
   with large per-row padding. */

.po-guidance-row{
  width:100%!important;
}

/* Conversation uses the same centered reading width as START HERE. */
.po-mini-dialogue{
  width:min(100%,1060px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

.po-mini-dialogue .po-chat-row{
  width:100%!important;
  max-width:none!important;
  padding-left:0!important;
  padding-right:0!important;
}

/* Let the conversation naturally alternate inside the centered column. */
.po-mini-dialogue .po-chat-row.fo{
  justify-content:flex-start!important;
}

.po-mini-dialogue .po-chat-row.captain{
  justify-content:flex-start!important;
  flex-direction:row-reverse!important;
}

.po-mini-dialogue .po-chat-bubble{
  max-width:min(82%,760px)!important;
}

/* Choice area follows START HERE's guide-strip width. */
.po-choice-panel{
  width:min(100%,1120px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Stage 3 intentionally remains full width so the comparison/library
   can use the rest of the desktop workspace. */
.po-route-grid,
.po-course-grid{
  width:100%!important;
}

/* Medium desktop keeps the same centered proportions. */
@media(max-width:1280px) and (min-width:901px){
  .po-mini-dialogue{
    width:min(100%,980px)!important;
  }

  .po-choice-panel{
    width:min(100%,1020px)!important;
  }

  .po-mini-dialogue .po-chat-bubble{
    max-width:84%!important;
  }
}

/* Short screens: preserve centering rather than reintroducing side offsets. */
@media(max-height:820px) and (min-width:901px){
  .po-mini-dialogue .po-chat-row.fo,
  .po-mini-dialogue .po-chat-row.captain{
    padding-left:0!important;
    padding-right:0!important;
  }
}



/* =============== V14 / FULL START HERE UNIFICATION =============== */
/* Unify the top of BECOME and LEARNING with START HERE:
   centered eyebrow -> centered title -> centered description -> conversation -> choices -> list */

.po-scene[data-panel="become"] .po-head-grid,
.po-scene[data-panel="learning"] .po-head-grid{
  display:block!important;
  width:min(100%,1120px)!important;
  margin:0 auto 18px!important;
  text-align:center!important;
}

.po-scene[data-panel="become"] .po-head-grid>div,
.po-scene[data-panel="learning"] .po-head-grid>div{
  width:100%!important;
}

.po-scene[data-panel="become"] .po-head-grid .po-eyebrow,
.po-scene[data-panel="learning"] .po-head-grid .po-eyebrow{
  margin:0 0 10px!important;
  text-align:center!important;
}

.po-scene[data-panel="become"] .po-scene-title,
.po-scene[data-panel="learning"] .po-scene-title{
  max-width:920px!important;
  margin:0 auto 11px!important;
  text-align:center!important;
}

.po-scene[data-panel="become"] .po-scene-copy,
.po-scene[data-panel="learning"] .po-scene-copy{
  max-width:780px!important;
  margin:0 auto!important;
  text-align:center!important;
  font-size:clamp(11px,.82vw,14px)!important;
  line-height:1.75!important;
}

/* Keep the guidance stack visually centered beneath the title. */
.po-scene[data-panel="become"] .po-guidance-row,
.po-scene[data-panel="learning"] .po-guidance-row{
  width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

.po-scene[data-panel="become"] .po-mini-dialogue,
.po-scene[data-panel="learning"] .po-mini-dialogue{
  width:min(100%,1060px)!important;
}

.po-scene[data-panel="become"] .po-choice-panel,
.po-scene[data-panel="learning"] .po-choice-panel{
  width:min(100%,1120px)!important;
}

/* Slightly increase vertical rhythm so it feels intentional, not cramped. */
.po-scene[data-panel="become"] .po-guidance-row,
.po-scene[data-panel="learning"] .po-guidance-row{
  gap:12px!important;
  margin-bottom:14px!important;
}

/* Short-screen tuning */
@media(max-height:820px) and (min-width:901px){
  .po-scene[data-panel="become"] .po-head-grid,
  .po-scene[data-panel="learning"] .po-head-grid{
    margin-bottom:10px!important;
  }

  .po-scene[data-panel="become"] .po-head-grid .po-eyebrow,
  .po-scene[data-panel="learning"] .po-head-grid .po-eyebrow{
    margin-bottom:6px!important;
  }

  .po-scene[data-panel="become"] .po-scene-title,
  .po-scene[data-panel="learning"] .po-scene-title{
    margin-bottom:6px!important;
  }

  .po-scene[data-panel="become"] .po-scene-copy,
  .po-scene[data-panel="learning"] .po-scene-copy{
    font-size:10.5px!important;
    line-height:1.5!important;
  }

  .po-scene[data-panel="become"] .po-guidance-row,
  .po-scene[data-panel="learning"] .po-guidance-row{
    gap:7px!important;
    margin-bottom:8px!important;
  }
}



/* =============== V15 / EXACT START HERE FORMAT =============== */
/* The first two stages now literally use START HERE classes.
   Only these modifiers define grid counts and the added third stage. */

.po-guided-start-layout{
  height:100%!important;
}

.po-guided-start-main{
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
}

/* START HERE uses 4 cards in one row.
   These keep the exact card styling while arranging the requested two rows. */
.po-guide-strip.po-guided-route-strip{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

.po-guide-strip.po-guided-course-strip{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

/* Selection state: same card, only a subtle gold marker. */
.po-guided-start-main .po-guide-card.is-active{
  border-color:var(--po-gold)!important;
  box-shadow:inset 0 3px 0 var(--po-gold)!important;
}

/* Third stage is the only extra block compared with START HERE. */
.po-guided-third-stage{
  width:100%!important;
  flex:1 1 auto!important;
  min-height:0!important;
  margin-top:16px!important;
  align-items:stretch!important;
}

.po-guided-third-stage .po-route,
.po-guided-third-stage .po-course-group{
  height:100%!important;
  min-height:0!important;
}

/* Keep the third stage useful on shorter screens without changing
   the START HERE header/chat/card format. */
@media(max-height:820px) and (min-width:901px){
  .po-guided-third-stage{
    margin-top:10px!important;
  }
}

/* Narrow desktop: still two visual rows. */
@media(max-width:1180px) and (min-width:901px){
  .po-guide-strip.po-guided-route-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .po-guide-strip.po-guided-course-strip{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}



/* =============== V16 / LESSON SECTION REMOVED =============== */
.po-scene[data-panel="start"] .po-guide-strip{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

@media(max-width:900px){
  .po-mobile-guide a:last-child:nth-child(odd){
    grid-column:1 / -1;
  }

  /* Keep the mobile dark/light rhythm after deleting the old lesson block. */
  .po-mobile-careers{
    background:#071522!important;
    color:#fff!important;
  }
  .po-mobile-careers .po-mobile-copy{
    color:#b9c5d2!important;
  }

  .po-mobile-news{
    background:var(--po-paper)!important;
    color:var(--po-ink)!important;
  }
  .po-mobile-news .po-mobile-copy{
    color:var(--po-copy)!important;
  }
  .po-mobile-news-item{
    border-color:var(--po-line)!important;
    background:var(--po-card)!important;
    color:var(--po-ink)!important;
  }
  .po-mobile-news-item small{
    color:var(--po-gold)!important;
  }

  .po-mobile-about{
    background:#071522!important;
    color:#fff!important;
  }
  .po-mobile-about .po-mobile-copy{
    color:#b9c5d2!important;
  }
}




/* =============== V21 / CAPTAIN ROUTE ADVICE =============== */
.po-route-captain-guide{
  display:flex;
  align-items:center;
  gap:16px;
  width:min(100%,1160px);
  min-height:84px;
  margin:14px auto 10px;
  padding:0 4px;
  flex:0 0 auto;
}

.po-route-captain-avatar{
  flex:0 0 76px;
  text-align:center;
}

.po-route-captain-avatar img{
  display:block;
  width:68px;
  height:68px;
  margin:0 auto 5px;
  border-radius:50%;
  object-fit:cover;
}

.po-route-captain-avatar small{
  display:block;
  color:#8d8579;
  font-size:7px;
  font-weight:950;
  letter-spacing:.08em;
  white-space:nowrap;
}

.po-route-captain-bubble{
  position:relative;
  flex:1;
  min-width:0;
  min-height:72px;
  padding:14px 19px;
  border:1px solid #d8cebd;
  border-radius:10px;
  background:#eee4d2;
  color:var(--po-ink);
}

.po-route-captain-bubble:before{
  content:"";
  position:absolute;
  left:-8px;
  top:25px;
  width:14px;
  height:14px;
  border-left:1px solid #d8cebd;
  border-bottom:1px solid #d8cebd;
  background:#eee4d2;
  transform:rotate(45deg);
}

.po-route-captain-bubble strong{
  display:block;
  margin-bottom:5px;
  font-size:clamp(14px,1vw,17px);
  font-weight:950;
  line-height:1.3;
}

.po-route-captain-bubble span{
  display:block;
  color:#5f5a52;
  font-size:clamp(11.5px,.8vw,13.5px);
  line-height:1.62;
}

.po-route[data-route-advice]{
  cursor:help;
}

.po-route[data-route-advice]:hover,
.po-route[data-route-advice]:focus{
  outline:none!important;
  border-color:var(--po-gold)!important;
  box-shadow:0 12px 26px rgba(69,52,24,.09)!important;
  transform:translateY(-2px);
}

.po-route[data-route-advice]:hover .po-route-num,
.po-route[data-route-advice]:focus .po-route-num{
  color:var(--po-gold)!important;
}

@media(max-height:820px) and (min-width:901px){
  .po-route-captain-guide{
    min-height:62px;
    margin:8px auto 6px;
    gap:11px;
  }

  .po-route-captain-avatar{
    flex-basis:54px;
  }

  .po-route-captain-avatar img{
    width:48px;
    height:48px;
    margin-bottom:2px;
  }

  .po-route-captain-avatar small{
    font-size:5.8px;
  }

  .po-route-captain-bubble{
    min-height:54px;
    padding:9px 13px;
  }

  .po-route-captain-bubble:before{
    top:18px;
    width:12px;
    height:12px;
  }

  .po-route-captain-bubble strong{
    margin-bottom:2px;
    font-size:11px;
  }

  .po-route-captain-bubble span{
    font-size:9.5px;
    line-height:1.45;
  }
}

@media(max-width:900px){
  .po-route-captain-guide{
    display:none!important;
  }
}


/* =============== V18 / CAPTAIN COURSE HOVER GUIDE =============== */
.po-course-captain-guide{
  display:flex;
  align-items:center;
  gap:13px;
  width:min(100%,1120px);
  min-height:66px;
  margin:14px auto 10px;
  padding:0 2px;
}

.po-course-captain-avatar{
  flex:0 0 58px;
  text-align:center;
}
.po-course-captain-avatar img{
  display:block;
  width:52px;
  height:52px;
  margin:0 auto 4px;
  border-radius:50%;
  object-fit:cover;
}
.po-course-captain-avatar small{
  display:block;
  color:#8d8579;
  font-size:6.5px;
  font-weight:950;
  letter-spacing:.08em;
  white-space:nowrap;
}

.po-course-captain-bubble{
  position:relative;
  flex:1;
  min-width:0;
  padding:11px 15px;
  border:1px solid #d8cebd;
  border-radius:8px;
  background:#eee4d2;
  color:var(--po-ink);
  transition:background .15s ease,border-color .15s ease;
}
.po-course-captain-bubble:before{
  content:"";
  position:absolute;
  left:-7px;
  top:21px;
  width:12px;
  height:12px;
  border-left:1px solid #d8cebd;
  border-bottom:1px solid #d8cebd;
  background:#eee4d2;
  transform:rotate(45deg);
}
.po-course-captain-bubble strong{
  display:block;
  margin-bottom:3px;
  font-size:11px;
  font-weight:950;
}
.po-course-captain-bubble span{
  display:block;
  color:#5f5a52;
  font-size:10px;
  line-height:1.55;
}

.po-course-link:hover,
.po-course-link:focus{
  position:relative;
  z-index:1;
}

.po-course-link:hover:before,
.po-course-link:focus:before{
  content:"CAPTAIN →";
  position:absolute;
  right:23px;
  top:50%;
  transform:translateY(-50%);
  color:#a77a30;
  font-size:5.5px;
  font-weight:950;
  letter-spacing:.08em;
}

.po-course-link.is-recommended:hover:before,
.po-course-link.is-recommended:focus:before{
  content:"CAPTAIN →";
}

@media(max-height:820px) and (min-width:901px){
  .po-course-captain-guide{
    min-height:48px;
    margin:8px auto 6px;
    gap:9px;
  }
  .po-course-captain-avatar{
    flex-basis:42px;
  }
  .po-course-captain-avatar img{
    width:38px;
    height:38px;
    margin-bottom:2px;
  }
  .po-course-captain-avatar small{
    font-size:5.5px;
  }
  .po-course-captain-bubble{
    padding:7px 11px;
  }
  .po-course-captain-bubble:before{
    top:15px;
  }
  .po-course-captain-bubble strong{
    margin-bottom:1px;
    font-size:9px;
  }
  .po-course-captain-bubble span{
    font-size:8px;
    line-height:1.4;
  }
}

/* Desktop-only interaction. Mobile uses its own simplified learning section. */
@media(max-width:900px){
  .po-course-captain-guide{
    display:none!important;
  }
}



/* =============== V19 / READABLE CAPTAIN'S GUIDE =============== */
.po-course-captain-guide{
  gap:16px!important;
  width:min(100%,1160px)!important;
  min-height:92px!important;
  margin:16px auto 12px!important;
  padding:0 4px!important;
}

.po-course-captain-avatar{
  flex:0 0 76px!important;
}

.po-course-captain-avatar img{
  width:68px!important;
  height:68px!important;
  margin-bottom:5px!important;
}

.po-course-captain-avatar small{
  font-size:7.5px!important;
  letter-spacing:.09em!important;
}

.po-course-captain-bubble{
  min-height:78px!important;
  padding:15px 20px!important;
  border-radius:10px!important;
}

.po-course-captain-bubble:before{
  left:-8px!important;
  top:27px!important;
  width:14px!important;
  height:14px!important;
}

.po-course-captain-bubble strong{
  margin-bottom:6px!important;
  font-size:clamp(14px,1vw,17px)!important;
  line-height:1.3!important;
}

.po-course-captain-bubble span{
  font-size:clamp(12px,.82vw,14px)!important;
  line-height:1.65!important;
}

/* Make the course currently being explained obvious. */
.po-course-link:hover,
.po-course-link:focus{
  padding-left:8px!important;
  background:#f1e7d7!important;
  font-weight:950!important;
}

/* Keep the hover hint readable too. */
.po-course-link:hover:before,
.po-course-link:focus:before{
  right:24px!important;
  font-size:7px!important;
  letter-spacing:.08em!important;
}

/* Laptop-height tuning: still readable, just slightly tighter. */
@media(max-height:820px) and (min-width:901px){
  .po-course-captain-guide{
    min-height:68px!important;
    margin:9px auto 7px!important;
    gap:12px!important;
  }

  .po-course-captain-avatar{
    flex-basis:58px!important;
  }

  .po-course-captain-avatar img{
    width:52px!important;
    height:52px!important;
    margin-bottom:3px!important;
  }

  .po-course-captain-avatar small{
    font-size:6.5px!important;
  }

  .po-course-captain-bubble{
    min-height:60px!important;
    padding:10px 14px!important;
  }

  .po-course-captain-bubble:before{
    top:21px!important;
    width:12px!important;
    height:12px!important;
  }

  .po-course-captain-bubble strong{
    margin-bottom:3px!important;
    font-size:12px!important;
  }

  .po-course-captain-bubble span{
    font-size:10.5px!important;
    line-height:1.5!important;
  }
}



/* =============== V23 / READABLE HOVER CAPTAIN ADVICE =============== */
/* Only enlarge the hover/focus guidance panels.
   Normal conversation bubbles stay exactly as they were in V21. */

/* HOW TO BECOME A PILOT / CAPTAIN'S ADVICE */
.po-route-captain-guide{
  min-height:98px!important;
  gap:18px!important;
  margin:16px auto 12px!important;
}

.po-route-captain-avatar{
  flex-basis:82px!important;
}

.po-route-captain-avatar img{
  width:74px!important;
  height:74px!important;
}

.po-route-captain-avatar small{
  font-size:8px!important;
}

.po-route-captain-bubble{
  min-height:84px!important;
  padding:17px 21px!important;
}

.po-route-captain-bubble:before{
  top:30px!important;
}

.po-route-captain-bubble strong{
  margin-bottom:7px!important;
  font-size:clamp(16px,1.15vw,20px)!important;
  line-height:1.3!important;
}

.po-route-captain-bubble span{
  font-size:clamp(13px,.95vw,16px)!important;
  line-height:1.7!important;
  color:#403c36!important;
}

/* ONLINE LEARNING / CAPTAIN'S GUIDE */
.po-course-captain-guide{
  min-height:100px!important;
  gap:18px!important;
  margin:16px auto 12px!important;
}

.po-course-captain-avatar{
  flex-basis:82px!important;
}

.po-course-captain-avatar img{
  width:74px!important;
  height:74px!important;
}

.po-course-captain-avatar small{
  font-size:8px!important;
}

.po-course-captain-bubble{
  min-height:86px!important;
  padding:17px 21px!important;
}

.po-course-captain-bubble:before{
  top:30px!important;
}

.po-course-captain-bubble strong{
  margin-bottom:7px!important;
  font-size:clamp(16px,1.15vw,20px)!important;
  line-height:1.3!important;
}

.po-course-captain-bubble span{
  font-size:clamp(13px,.95vw,16px)!important;
  line-height:1.7!important;
  color:#403c36!important;
}

/* Keep it readable on shorter laptop displays too. */
@media(max-height:820px) and (min-width:901px){
  .po-route-captain-guide,
  .po-course-captain-guide{
    min-height:76px!important;
    gap:13px!important;
    margin:9px auto 7px!important;
  }

  .po-route-captain-avatar,
  .po-course-captain-avatar{
    flex-basis:62px!important;
  }

  .po-route-captain-avatar img,
  .po-course-captain-avatar img{
    width:56px!important;
    height:56px!important;
  }

  .po-route-captain-avatar small,
  .po-course-captain-avatar small{
    font-size:6.5px!important;
  }

  .po-route-captain-bubble,
  .po-course-captain-bubble{
    min-height:66px!important;
    padding:11px 15px!important;
  }

  .po-route-captain-bubble strong,
  .po-course-captain-bubble strong{
    margin-bottom:4px!important;
    font-size:13px!important;
  }

  .po-route-captain-bubble span,
  .po-course-captain-bubble span{
    font-size:11px!important;
    line-height:1.55!important;
  }
}



/* =============== V24 / INLINE ONE-LINE HOVER ADVICE =============== */
.po-route-captain-guide,
.po-course-captain-guide{
  min-height:64px!important;
  margin:10px auto 8px!important;
  gap:12px!important;
}

.po-route-captain-avatar,
.po-course-captain-avatar{
  flex-basis:58px!important;
}

.po-route-captain-avatar img,
.po-course-captain-avatar img{
  width:52px!important;
  height:52px!important;
  margin-bottom:2px!important;
}

.po-route-captain-avatar small,
.po-course-captain-avatar small{
  font-size:6px!important;
}

.po-route-captain-bubble,
.po-course-captain-bubble{
  min-height:52px!important;
  display:flex!important;
  align-items:center!important;
  padding:10px 15px!important;
}

.po-route-captain-bubble:before,
.po-course-captain-bubble:before{
  top:19px!important;
  width:11px!important;
  height:11px!important;
}

.po-route-captain-bubble span,
.po-course-captain-bubble span{
  display:block!important;
  width:100%!important;
  color:#403c36!important;
  font-size:clamp(12px,.82vw,14px)!important;
  line-height:1.45!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.po-route-captain-bubble span strong,
.po-course-captain-bubble span strong{
  display:inline!important;
  margin:0!important;
  color:#191c20!important;
  font-size:inherit!important;
  font-weight:950!important;
  line-height:inherit!important;
}

/* On smaller desktop widths, allow a second line only if truly necessary. */
@media(max-width:1180px) and (min-width:901px){
  .po-route-captain-bubble span,
  .po-course-captain-bubble span{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    font-size:11.5px!important;
  }
}

@media(max-height:820px) and (min-width:901px){
  .po-route-captain-guide,
  .po-course-captain-guide{
    min-height:52px!important;
    margin:6px auto 5px!important;
  }

  .po-route-captain-avatar,
  .po-course-captain-avatar{
    flex-basis:46px!important;
  }

  .po-route-captain-avatar img,
  .po-course-captain-avatar img{
    width:42px!important;
    height:42px!important;
  }

  .po-route-captain-bubble,
  .po-course-captain-bubble{
    min-height:44px!important;
    padding:7px 11px!important;
  }

  .po-route-captain-bubble span,
  .po-course-captain-bubble span{
    font-size:10.5px!important;
  }
}



/* =============== V25 / HEADER TYPEWRITER + MATCHED ADVICE TYPE =============== */

/* CAPTAIN'S ADVICE / GUIDE uses the exact same body size as normal chat. */
.po-route-captain-bubble span,
.po-course-captain-bubble span{
  font-size:clamp(13px,.95vw,17px)!important;
  line-height:1.75!important;
}

.po-route-captain-bubble span strong,
.po-course-captain-bubble span strong{
  font-size:inherit!important;
  line-height:inherit!important;
}

/* Keep the one-line desktop behavior from V24. */
@media(min-width:1181px){
  .po-route-captain-bubble span,
  .po-course-captain-bubble span{
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

/* Header center: old "君は空を飛びたいか" typewriter motif. */
.po-header-typing{
  position:absolute;
  left:50%;
  top:22px;
  transform:translateX(-50%);
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:240px;
  pointer-events:none;
  color:#1b2025;
  font-size:13px;
  font-weight:850;
  letter-spacing:.16em;
  white-space:nowrap;
}

.po-header-typing:before{
  content:"";
  position:absolute;
  left:50%;
  bottom:-8px;
  width:34px;
  height:1px;
  transform:translateX(-50%);
  background:rgba(27,32,37,.22);
}

.po-typing-caret{
  display:inline-block;
  width:1px;
  height:1.15em;
  margin-left:5px;
  background:currentColor;
  animation:poTypingCaretBlink .8s steps(1,end) infinite;
}

@keyframes poTypingCaretBlink{
  0%,48%{opacity:1}
  49%,100%{opacity:0}
}

/* Avoid collisions on narrower desktops; mobile remains clean. */
@media(max-width:1120px){
  .po-header-typing{
    display:none!important;
  }
}



/* =============== V26 / CENTERED HEADER TYPEWRITER =============== */
.po-header-typing{
  left:50%!important;
  top:27px!important;
  transform:translateX(-50%)!important;
  min-width:320px!important;
  font-size:clamp(17px,1.25vw,21px)!important;
  font-weight:900!important;
  line-height:1!important;
  letter-spacing:.13em!important;
  text-align:center!important;
}

.po-header-typing:before{
  bottom:-10px!important;
  width:44px!important;
}

.po-typing-caret{
  height:1.05em!important;
  margin-left:6px!important;
}

.po-typing-caret.is-finished{
  animation:none!important;
  opacity:0!important;
  transition:opacity .35s ease!important;
}



/* =============== V27 / HEADER ALIGNMENT + SIDEBAR UPGRADE =============== */
@media(min-width:901px){

  /* Align the visual centers of the three header zones. */
  .po-logo{
    top:23px!important;
  }

  .po-header-typing{
    top:24px!important;
    font-size:clamp(18px,1.3vw,22px)!important;
    line-height:1!important;
  }

  .po-actions{
    top:17px!important;
  }

  /* No decorative underline beneath the typing line. */
  .po-header-typing:before{
    content:none!important;
    display:none!important;
  }

  /* Sidebar menu should read like navigation, not micro-copy. */
  .po-global-left{
    padding:20px 16px 14px!important;
  }

  .po-global-left-head>p:last-child{
    margin-bottom:14px!important;
    font-size:11px!important;
  }

  .po-global-left-list{
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-right:4px!important;
    scrollbar-width:thin;
  }

  .po-global-section-label{
    flex:0 0 auto;
    margin:4px 3px 2px;
    color:var(--po-gold-2)!important;
    font-size:8px;
    font-weight:950;
    letter-spacing:.18em;
  }

  .po-global-course-label{
    margin-top:13px;
    padding-top:13px;
    border-top:1px solid rgba(255,255,255,.12);
  }

  .po-global-item,
  .po-global-item:focus,
  .po-global-item:active{
    flex:0 0 auto;
    grid-template-columns:36px minmax(0,1fr)!important;
    gap:11px!important;
    min-height:48px!important;
    padding:7px 10px!important;
    align-items:center!important;
  }

  .po-global-item>span{
    width:34px!important;
    height:34px!important;
    font-size:9px!important;
  }

  .po-global-item>strong,
  .po-global-item strong{
    display:block!important;
    margin:0!important;
    color:#fff!important;
    font-size:14px!important;
    font-weight:900!important;
    line-height:1.25!important;
  }

  /* Old micro-description text is intentionally hidden if any survives. */
  .po-global-item small{
    display:none!important;
  }

  .po-global-course-link{
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr);
    gap:10px;
    align-items:center;
    flex:0 0 auto;
    min-height:39px;
    padding:6px 9px;
    border:1px solid transparent;
    color:#fff!important;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
  }

  .po-global-course-link:hover{
    transform:translateX(2px);
    border-color:rgba(255,255,255,.14);
    background:#242a31;
  }

  .po-global-course-link>span{
    display:grid;
    min-width:44px;
    min-height:25px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:var(--po-gold-2)!important;
    font-size:8px;
    font-weight:950;
    letter-spacing:.04em;
  }

  .po-global-course-link>strong{
    color:#e9ecef!important;
    font-size:12px!important;
    font-weight:850!important;
    line-height:1.25!important;
  }

  .po-global-all-courses{
    flex:0 0 auto;
    width:100%!important;
    margin:3px 0 0!important;
    padding:9px 10px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    font-size:9px!important;
    font-weight:950!important;
    letter-spacing:.1em!important;
    cursor:pointer!important;
  }

  .po-global-all-courses:hover{
    border-color:var(--po-gold)!important;
    background:#242a31!important;
  }

  /* Old footer isn't needed once direct shortcuts are visible. */
  .po-global-left-foot{
    display:none!important;
  }
}

/* Keep the sidebar readable on smaller desktop widths too. */
@media(min-width:901px) and (max-width:1280px){
  .po-global-item,
  .po-global-item:focus,
  .po-global-item:active{
    grid-template-columns:32px minmax(0,1fr)!important;
    min-height:43px!important;
    padding:6px 7px!important;
  }

  .po-global-item>span{
    width:30px!important;
    height:30px!important;
  }

  .po-global-item>strong,
  .po-global-item strong{
    font-size:12px!important;
  }

  .po-global-course-link{
    grid-template-columns:42px minmax(0,1fr);
    min-height:35px;
    padding:5px 7px;
  }

  .po-global-course-link>span{
    min-width:39px;
  }

  .po-global-course-link>strong{
    font-size:11px!important;
  }
}



/* =============== V28 / TRUE HEADER CENTER + COURSE LIBRARY =============== */

@media(min-width:901px){

  /* True vertical centering: all three header zones share the same center line. */
  .po-logo{
    top:50%!important;
    transform:translateY(-50%)!important;
  }

  .po-header-typing{
    top:50%!important;
    transform:translate(-50%,-50%)!important;
  }

  .po-actions{
    top:50%!important;
    transform:translateY(-50%)!important;
  }

  /* COURSE LIBRARY category buttons in left sidebar. */
  .po-global-catalog-item{
    -webkit-appearance:none!important;
    appearance:none!important;
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:center!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-height:43px!important;
    margin:0!important;
    padding:6px 9px!important;
    border:1px solid transparent!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    font-family:inherit!important;
    cursor:pointer!important;
    transition:background .16s ease,border-color .16s ease,transform .16s ease!important;
  }

  .po-global-catalog-item:hover{
    transform:translateX(2px)!important;
    border-color:rgba(255,255,255,.14)!important;
    background:#242a31!important;
  }

  .po-global-catalog-item.is-active{
    border-color:#4a5159!important;
    background:#353b42!important;
    box-shadow:inset 3px 0 0 var(--po-gold)!important;
  }

  .po-global-catalog-item>span{
    display:grid!important;
    min-width:44px!important;
    min-height:27px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.18)!important;
    color:var(--po-gold-2)!important;
    font-size:8px!important;
    font-weight:950!important;
    letter-spacing:.03em!important;
  }

  .po-global-catalog-item>strong{
    color:#f0f2f4!important;
    font-size:13px!important;
    font-weight:900!important;
    line-height:1.2!important;
  }

  /* Old direct course-link styles are no longer used. */
  .po-global-course-link{
    display:none!important;
  }
}

/* ---------- Dynamic course catalog scene ---------- */
.po-catalog-shell{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:0;
  padding:clamp(24px,2.3vw,40px) clamp(28px,3vw,52px) 24px;
  border:1px solid var(--po-line);
  background:var(--po-paper);
  overflow:hidden;
}

.po-catalog-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  flex:0 0 auto;
  padding-bottom:18px;
  border-bottom:1px solid var(--po-line);
}

.po-catalog-head>div:first-child{
  min-width:0;
}

.po-catalog-head .po-eyebrow{
  margin-bottom:9px;
}

.po-catalog-head h1{
  margin:0;
  color:var(--po-ink);
  font-size:clamp(34px,3.3vw,58px);
  line-height:.98;
  letter-spacing:-.045em;
}

.po-catalog-head p{
  max-width:760px;
  margin:12px 0 0;
  color:var(--po-copy);
  font-size:12px;
  line-height:1.7;
}

.po-catalog-meta{
  display:flex;
  gap:7px;
  flex:0 0 auto;
  padding-bottom:2px;
}

.po-catalog-meta span{
  padding:7px 9px;
  border:1px solid #d4cec3;
  background:#fbfaf6;
  color:#777067;
  font-size:7px;
  font-weight:950;
  letter-spacing:.09em;
  white-space:nowrap;
}

.po-catalog-guide{
  display:flex;
  align-items:center;
  gap:14px;
  width:min(100%,1120px);
  min-height:66px;
  margin:14px auto 12px;
  flex:0 0 auto;
}

.po-catalog-guide-avatar{
  flex:0 0 60px;
  text-align:center;
}

.po-catalog-guide-avatar img{
  display:block;
  width:54px;
  height:54px;
  margin:0 auto 3px;
  border-radius:50%;
  object-fit:cover;
}

.po-catalog-guide-avatar small{
  display:block;
  color:#8a837a;
  font-size:6px;
  font-weight:950;
  letter-spacing:.08em;
  white-space:nowrap;
}

.po-catalog-guide p{
  position:relative;
  flex:1;
  margin:0;
  padding:12px 16px;
  border:1px solid #d8cebd;
  border-radius:8px;
  background:#eee4d2;
  color:#403c36;
  font-size:clamp(13px,.95vw,17px);
  line-height:1.6;
}

.po-catalog-guide p:before{
  content:"";
  position:absolute;
  left:-7px;
  top:21px;
  width:12px;
  height:12px;
  border-left:1px solid #d8cebd;
  border-bottom:1px solid #d8cebd;
  background:#eee4d2;
  transform:rotate(45deg);
}

.po-catalog-guide p strong{
  color:#171b20;
  font-weight:950;
}

.po-catalog-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  align-content:start;
  padding-right:2px;
}

.po-catalog-card{
  display:flex;
  flex-direction:column;
  min-height:182px;
  padding:16px;
  border:1px solid #cbc5bb;
  background:#fbfaf6;
  color:var(--po-ink)!important;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
}

a.po-catalog-card:hover{
  transform:translateY(-2px);
  border-color:#9e968a;
  background:#fffefa;
  box-shadow:0 12px 25px rgba(25,29,34,.06);
}

.po-catalog-card.is-planned{
  background:#f1efe9;
  border-style:dashed;
}

.po-catalog-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:13px;
}

.po-catalog-code{
  display:inline-flex;
  min-height:25px;
  padding:0 8px;
  align-items:center;
  border:1px solid #beb6a9;
  color:#8c692f;
  font-size:7px;
  font-weight:950;
  letter-spacing:.09em;
}

.po-catalog-status{
  color:#979087;
  font-size:6.5px;
  font-weight:950;
  letter-spacing:.09em;
}

.po-catalog-card h3{
  margin:0 0 7px;
  color:var(--po-ink);
  font-size:clamp(16px,1.2vw,21px);
  line-height:1.2;
}

.po-catalog-card p{
  margin:0;
  color:var(--po-copy);
  font-size:9.5px;
  line-height:1.55;
}

.po-catalog-learn{
  margin-top:11px;
  padding-top:9px;
  border-top:1px solid #ded9cf;
  color:#635e57;
  font-size:8px;
  line-height:1.45;
}

.po-catalog-learn strong{
  color:#8c692f;
  font-weight:950;
}

.po-catalog-open{
  margin-top:auto;
  padding-top:12px;
  color:#1d2227;
  font-size:8px;
  font-weight:950;
  letter-spacing:.07em;
}

.po-catalog-card.is-planned .po-catalog-open{
  color:#9a938a;
}

@media(max-width:1320px) and (min-width:901px){
  .po-catalog-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .po-global-catalog-item{
    grid-template-columns:42px minmax(0,1fr)!important;
    min-height:38px!important;
    padding:5px 7px!important;
  }

  .po-global-catalog-item>span{
    min-width:39px!important;
    min-height:24px!important;
    font-size:7px!important;
  }

  .po-global-catalog-item>strong{
    font-size:11px!important;
  }
}

@media(max-height:820px) and (min-width:901px){
  .po-catalog-shell{
    padding-top:22px;
    padding-bottom:16px;
  }

  .po-catalog-head{
    padding-bottom:11px;
  }

  .po-catalog-head h1{
    font-size:36px;
  }

  .po-catalog-head p{
    margin-top:7px;
    font-size:10px;
    line-height:1.5;
  }

  .po-catalog-guide{
    min-height:50px;
    margin:8px auto 7px;
  }

  .po-catalog-guide-avatar{
    flex-basis:46px;
  }

  .po-catalog-guide-avatar img{
    width:42px;
    height:42px;
  }

  .po-catalog-guide p{
    padding:8px 11px;
    font-size:11px;
    line-height:1.45;
  }

  .po-catalog-card{
    min-height:150px;
    padding:12px;
  }

  .po-catalog-card-top{
    margin-bottom:8px;
  }

  .po-catalog-card h3{
    font-size:15px;
  }

  .po-catalog-card p{
    font-size:8px;
  }
}



/* =============== V29 / COURSE LIBRARY HOVER CAPTAIN =============== */
.po-catalog-card[data-catalog-advice]{
  cursor:help;
}

.po-catalog-card[data-catalog-advice]:hover,
.po-catalog-card[data-catalog-advice]:focus{
  outline:none!important;
  transform:translateY(-3px)!important;
  border-color:var(--po-gold)!important;
  box-shadow:0 14px 28px rgba(61,47,24,.10)!important;
}

.po-catalog-card[data-catalog-advice]:hover .po-catalog-code,
.po-catalog-card[data-catalog-advice]:focus .po-catalog-code{
  border-color:var(--po-gold)!important;
  background:#efe5d3!important;
  color:#6d4d1f!important;
}

.po-catalog-guide p{
  font-size:clamp(13px,.95vw,17px)!important;
  line-height:1.6!important;
}

.po-catalog-guide p strong{
  color:#171b20!important;
  font-size:inherit!important;
  font-weight:950!important;
}



/* =============== V30 / LOWER HEADER + CLEANER SIDEBAR =============== */
@media(min-width:901px){

  /* Same centerline, moved down closer to the main frame. */
  .po-logo{
    top:50px!important;
    transform:translateY(-50%)!important;
  }

  .po-header-typing{
    top:50px!important;
    transform:translate(-50%,-50%)!important;
  }

  .po-actions{
    top:50px!important;
    transform:translateY(-50%)!important;
  }

  /* Home entry: simple, unnumbered PILOT ONLINE. */
  .po-global-home{
    -webkit-appearance:none!important;
    appearance:none!important;
    display:flex!important;
    align-items:center!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-height:48px!important;
    margin:0!important;
    padding:9px 11px!important;
    border:1px solid rgba(255,255,255,.10)!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    font-family:inherit!important;
    cursor:pointer!important;
    transition:background .16s ease,border-color .16s ease,transform .16s ease!important;
  }

  .po-global-home strong{
    color:#fff!important;
    font-size:15px!important;
    font-weight:950!important;
    letter-spacing:.07em!important;
    line-height:1!important;
  }

  .po-global-home:hover{
    transform:translateX(2px)!important;
    border-color:rgba(255,255,255,.18)!important;
    background:#242a31!important;
  }

  .po-global-home.is-active{
    border-color:#4a5159!important;
    background:#353b42!important;
    box-shadow:inset 3px 0 0 var(--po-gold)!important;
  }

  .po-global-course-label{
    margin-top:16px!important;
  }

  .po-global-all-courses{
    display:none!important;
  }
}

@media(min-width:901px) and (max-width:1120px){
  .po-logo,
  .po-actions{
    top:49px!important;
  }

  .po-header-typing{
    display:none!important;
  }
}



/* =============== V33 / CARET BLINKS 5 TIMES AFTER TYPING =============== */
.po-typing-caret.is-finishing{
  animation:poTypingCaretBlink .8s steps(1,end) 5 forwards!important;
}



/* =============== V34 / SIMPLE AVIATION NEWS FEED =============== */

/* Retire old category-tile concept. */
.po-news-bento,
.po-news-tile{
  display:none!important;
}

.po-news-simple-head{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:clamp(30px,4vw,70px);
  align-items:end;
  flex:0 0 auto;
  padding:clamp(8px,1vw,16px) 0 24px;
  border-bottom:1px solid var(--po-line);
}

.po-news-simple-intro{
  justify-self:end;
  max-width:560px;
}

.po-news-simple-intro p{
  margin:0;
  color:var(--po-copy);
  font-size:clamp(11px,.8vw,14px);
  line-height:1.8;
}

.po-news-simple-intro a{
  display:inline-block;
  margin-top:15px;
  color:var(--po-ink)!important;
  font-size:8px;
  font-weight:950;
  letter-spacing:.1em;
}

.po-news-feed{
  display:flex;
  flex:1 1 auto;
  min-height:0;
  flex-direction:column;
  border-left:1px solid var(--po-line);
  border-right:1px solid var(--po-line);
  border-bottom:1px solid var(--po-line);
  background:var(--po-card);
  overflow:hidden;
}

.po-news-feed-top{
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex:0 0 auto;
  padding:11px 17px;
  border-bottom:1px solid var(--po-line);
  color:#8a8379;
  font-size:7px;
  font-weight:950;
  letter-spacing:.13em;
}

.po-news-row{
  display:grid;
  grid-template-columns:50px 140px minmax(0,1fr) 28px;
  gap:18px;
  align-items:center;
  flex:1 1 0;
  min-height:62px;
  padding:12px 18px;
  border-bottom:1px solid var(--po-line);
  color:var(--po-ink)!important;
  transition:background .18s ease,color .18s ease,padding .18s ease;
}

.po-news-row:last-child{
  border-bottom:0;
}

.po-news-no{
  color:#a49c91;
  font-size:8px;
  font-weight:950;
  letter-spacing:.1em;
}

.po-news-source{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.09em;
  white-space:nowrap;
}

.po-news-row strong{
  min-width:0;
  font-size:clamp(14px,1.12vw,20px);
  font-weight:850;
  line-height:1.35;
  letter-spacing:-.015em;
}

.po-news-arrow{
  justify-self:end;
  font-size:18px;
  line-height:1;
  transition:transform .18s ease;
}

.po-news-row:hover,
.po-news-row:focus{
  outline:none;
  padding-left:23px;
  background:var(--po-dark);
  color:#fff!important;
}

.po-news-row:hover .po-news-no,
.po-news-row:focus .po-news-no{
  color:#9ea7ae;
}

.po-news-row:hover .po-news-source,
.po-news-row:focus .po-news-source{
  color:var(--po-gold-2);
}

.po-news-row:hover .po-news-arrow,
.po-news-row:focus .po-news-arrow{
  transform:translateX(4px);
}

@media(max-width:1250px) and (min-width:901px){
  .po-news-row{
    grid-template-columns:38px 110px minmax(0,1fr) 22px;
    gap:12px;
    min-height:54px;
    padding:9px 13px;
  }

  .po-news-row strong{
    font-size:13px;
  }

  .po-news-source{
    font-size:7px;
  }
}

@media(max-height:820px) and (min-width:901px){
  .po-news-simple-head{
    padding-bottom:13px;
  }

  .po-news-simple-intro p{
    font-size:10px;
    line-height:1.55;
  }

  .po-news-simple-intro a{
    margin-top:8px;
  }

  .po-news-feed-top{
    padding:7px 12px;
  }

  .po-news-row{
    min-height:45px;
    padding-top:7px;
    padding-bottom:7px;
  }

  .po-news-row strong{
    font-size:12px;
  }
}

@media(max-width:900px){
  .po-mobile-simple-news{
    margin-top:24px;
    border-top:1px solid var(--po-line);
  }

  .po-mobile-simple-news a{
    display:grid;
    grid-template-columns:minmax(0,1fr) 22px;
    gap:5px 12px;
    padding:16px 2px;
    border-bottom:1px solid var(--po-line);
    color:var(--po-ink)!important;
  }

  .po-mobile-simple-news small{
    grid-column:1;
    color:var(--po-gold);
    font-size:7px;
    font-weight:950;
    letter-spacing:.1em;
  }

  .po-mobile-simple-news strong{
    grid-column:1;
    font-size:14px;
    line-height:1.45;
  }

  .po-mobile-simple-news span{
    grid-column:2;
    grid-row:1 / 3;
    align-self:center;
    justify-self:end;
    font-size:18px;
  }
}



/* =============== V35 / REAL NEWS HEADLINES =============== */
.po-news-date{
  color:#8f887f;
  font-size:8px;
  font-weight:950;
  letter-spacing:.08em;
  white-space:nowrap;
}

.po-news-row:hover .po-news-date,
.po-news-row:focus .po-news-date{
  color:#c6cdd2;
}



/* =============== V36 / LIVE RSS NEWS =============== */
#po-news-live-list{
  display:flex;
  flex:1 1 auto;
  min-height:0;
  flex-direction:column;
}

#po-news-live-list .po-news-row{
  flex:1 1 0;
}



/* =============== V37 / READABLE NEWS META =============== */

/* Top strip labels */
.po-news-feed-top{
  padding:12px 18px!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:.11em!important;
}

/* Give date/source enough room and make them genuinely readable. */
.po-news-row{
  grid-template-columns:64px 165px minmax(0,1fr) 30px!important;
  gap:20px!important;
}

.po-news-date{
  color:#6f6961!important;
  font-size:11px!important;
  font-weight:950!important;
  letter-spacing:.05em!important;
}

.po-news-source{
  color:var(--po-gold)!important;
  font-size:11px!important;
  font-weight:950!important;
  letter-spacing:.06em!important;
  white-space:nowrap!important;
}

.po-news-row:hover .po-news-date,
.po-news-row:focus .po-news-date{
  color:#d6dce0!important;
}

.po-news-row:hover .po-news-source,
.po-news-row:focus .po-news-source{
  color:var(--po-gold-2)!important;
}

/* Medium desktop: still readable, just slightly tighter. */
@media(max-width:1250px) and (min-width:901px){
  .po-news-row{
    grid-template-columns:54px 135px minmax(0,1fr) 24px!important;
    gap:14px!important;
  }

  .po-news-date{
    font-size:10px!important;
  }

  .po-news-source{
    font-size:10px!important;
  }

  .po-news-feed-top{
    font-size:8px!important;
  }
}

/* Mobile metadata should also be readable. */
@media(max-width:900px){
  .po-mobile-simple-news small{
    font-size:10px!important;
    line-height:1.35!important;
    letter-spacing:.07em!important;
  }
}



/* =============== V39 / GLOBAL READABILITY BOOST =============== */

/* ---------------- NEWS ---------------- */
.po-news-feed-top{
  padding:14px 20px!important;
  font-size:10px!important;
  font-weight:950!important;
  letter-spacing:.10em!important;
}

.po-news-row{
  grid-template-columns:72px 180px minmax(0,1fr) 32px!important;
  gap:22px!important;
  min-height:72px!important;
  padding:14px 20px!important;
}

.po-news-date{
  font-size:12px!important;
  font-weight:950!important;
  letter-spacing:.04em!important;
}

.po-news-source{
  font-size:12px!important;
  font-weight:950!important;
  letter-spacing:.05em!important;
}

.po-news-row strong{
  font-size:clamp(18px,1.28vw,25px)!important;
  line-height:1.34!important;
}

.po-news-arrow{
  font-size:20px!important;
}

.po-news-simple-intro p{
  font-size:clamp(13px,.92vw,16px)!important;
  line-height:1.8!important;
}

.po-news-simple-intro a{
  font-size:10px!important;
}

/* ---------------- GENERIC SCENE TYPOGRAPHY ---------------- */
.po-scene-copy,
.po-head-grid > p,
.po-head-grid p,
.po-scene-inner p:not(.po-eyebrow){
  font-size:clamp(13px,.95vw,16px);
  line-height:1.75;
}

.po-eyebrow{
  font-size:11px!important;
  letter-spacing:.18em!important;
}

/* Main scene headings slightly stronger */
.po-scene-title{
  font-size:clamp(44px,4.15vw,72px)!important;
  line-height:.96!important;
}

/* ---------------- DIALOGUE / GUIDANCE ---------------- */
.po-dialogue-bubble,
.po-chat-bubble,
.po-guide-bubble,
.po-speech,
.po-speech-bubble{
  font-size:clamp(14px,1vw,18px)!important;
  line-height:1.72!important;
}

.po-dialogue-bubble p,
.po-chat-bubble p,
.po-guide-bubble p,
.po-speech p,
.po-speech-bubble p{
  font-size:inherit!important;
  line-height:inherit!important;
}

.po-dialogue-name,
.po-chat-name,
.po-guide-name{
  font-size:10px!important;
  letter-spacing:.10em!important;
}

/* ---------------- CHOICE / GUIDE BUTTONS ---------------- */
.po-guide-choice,
.po-choice-button,
.po-route-choice,
.po-learning-choice,
.po-choice-card,
.po-guided-choice{
  min-height:74px!important;
  padding:15px 18px!important;
}

.po-guide-choice strong,
.po-choice-button strong,
.po-route-choice strong,
.po-learning-choice strong,
.po-choice-card strong,
.po-guided-choice strong{
  font-size:clamp(18px,1.2vw,24px)!important;
  line-height:1.2!important;
}

.po-guide-choice small,
.po-choice-button small,
.po-route-choice small,
.po-learning-choice small,
.po-choice-card small,
.po-guided-choice small{
  display:block!important;
  margin-top:5px!important;
  font-size:12px!important;
  line-height:1.45!important;
  letter-spacing:0!important;
  color:inherit!important;
  opacity:.86!important;
}

/* ---------------- LIST / COURSE / ROUTE CARDS ---------------- */
.po-course-card,
.po-route-card,
.po-panel-card,
.po-mini-card,
.po-list-card{
  padding:18px!important;
}

.po-course-card h3,
.po-route-card h3,
.po-panel-card h3,
.po-mini-card h3,
.po-list-card h3{
  font-size:clamp(19px,1.32vw,26px)!important;
  line-height:1.18!important;
}

.po-course-card p,
.po-route-card p,
.po-panel-card p,
.po-mini-card p,
.po-list-card p{
  font-size:13px!important;
  line-height:1.62!important;
}

.po-course-card li,
.po-route-card li,
.po-panel-card li,
.po-mini-card li,
.po-list-card li{
  font-size:12px!important;
  line-height:1.55!important;
}

/* ---------------- CAPTAIN HOVER ADVICE ---------------- */
.po-hover-advice,
.po-captain-advice,
.po-hover-note{
  font-size:clamp(14px,1vw,18px)!important;
  line-height:1.65!important;
}

/* ---------------- COURSE LIBRARY ---------------- */
.po-catalog-head p{
  font-size:14px!important;
  line-height:1.78!important;
}

.po-catalog-meta span{
  font-size:9px!important;
  padding:8px 11px!important;
}

.po-catalog-guide p{
  font-size:clamp(15px,1.02vw,18px)!important;
  line-height:1.62!important;
}

.po-catalog-card{
  min-height:196px!important;
  padding:18px!important;
}

.po-catalog-code{
  min-height:28px!important;
  font-size:8px!important;
  padding:0 10px!important;
}

.po-catalog-status{
  font-size:8px!important;
}

.po-catalog-card h3{
  font-size:clamp(18px,1.28vw,24px)!important;
  line-height:1.18!important;
}

.po-catalog-card p{
  font-size:12px!important;
  line-height:1.62!important;
}

.po-catalog-learn{
  font-size:10px!important;
  line-height:1.5!important;
}

.po-catalog-open{
  font-size:10px!important;
  letter-spacing:.06em!important;
}

/* ---------------- LEFT SIDEBAR ---------------- */
.po-global-section-label{
  font-size:9px!important;
}

.po-global-home strong{
  font-size:16px!important;
}

.po-global-item>strong,
.po-global-item strong{
  font-size:15px!important;
  line-height:1.25!important;
}

.po-global-catalog-item>strong{
  font-size:14px!important;
}

.po-global-item>span,
.po-global-catalog-item>span{
  font-size:9px!important;
}

/* ---------------- MOBILE ---------------- */
@media(max-width:900px){
  .po-mobile-kicker{
    font-size:10px!important;
    letter-spacing:.16em!important;
  }

  .po-mobile-title{
    font-size:clamp(34px,9vw,52px)!important;
    line-height:.98!important;
  }

  .po-mobile-copy{
    font-size:15px!important;
    line-height:1.7!important;
  }

  .po-mobile-simple-news small{
    font-size:11px!important;
    line-height:1.35!important;
  }

  .po-mobile-simple-news strong{
    font-size:16px!important;
    line-height:1.45!important;
  }

  .po-mobile-cta{
    font-size:14px!important;
  }
}

/* ---------------- MID WIDTH DESKTOP ---------------- */
@media(max-width:1250px) and (min-width:901px){
  .po-news-row{
    grid-template-columns:62px 148px minmax(0,1fr) 26px!important;
    gap:16px!important;
    min-height:64px!important;
    padding:12px 16px!important;
  }

  .po-news-date{
    font-size:11px!important;
  }

  .po-news-source{
    font-size:11px!important;
  }

  .po-news-row strong{
    font-size:16px!important;
  }

  .po-news-feed-top{
    font-size:9px!important;
  }

  .po-catalog-card{
    min-height:176px!important;
    padding:15px!important;
  }

  .po-catalog-card p{
    font-size:11px!important;
  }

  .po-global-item>strong,
  .po-global-item strong{
    font-size:13px!important;
  }

  .po-global-catalog-item>strong{
    font-size:12px!important;
  }
}

/* ---------------- SHORT DESKTOP HEIGHT ---------------- */
@media(max-height:820px) and (min-width:901px){
  .po-news-row{
    min-height:56px!important;
  }

  .po-news-row strong{
    font-size:15px!important;
  }

  .po-catalog-head p{
    font-size:12px!important;
    line-height:1.6!important;
  }

  .po-catalog-guide p{
    font-size:13px!important;
  }

  .po-catalog-card p{
    font-size:10.5px!important;
  }
}



/* =============== V40 / CAREER STORIES INTERVIEW CTA =============== */

.po-career-interview-cta{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:28px;
  align-items:center;
  margin-top:18px;
  padding:20px 22px;
  border:1px solid var(--po-line);
  background:#f7f4ee;
}

.po-career-interview-kicker{
  margin:0 0 7px!important;
  color:var(--po-gold)!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:.14em!important;
}

.po-career-interview-cta h3{
  margin:0;
  color:var(--po-ink);
  font-size:clamp(20px,1.45vw,28px);
  line-height:1.2;
}

.po-career-interview-cta p:not(.po-career-interview-kicker){
  max-width:780px;
  margin:8px 0 0;
  color:var(--po-copy);
  font-size:13px!important;
  line-height:1.65!important;
}

.po-career-interview-cta>a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:150px;
  min-height:46px;
  padding:0 18px;
  border:1px solid var(--po-ink);
  color:var(--po-ink)!important;
  font-size:10px;
  font-weight:950;
  letter-spacing:.09em;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}

.po-career-interview-cta>a:hover{
  transform:translateY(-1px);
  background:var(--po-ink);
  color:#fff!important;
}

@media(max-width:900px){
  .po-mobile-career-interview{
    margin-top:26px;
    padding:20px 0 0;
    border-top:1px solid var(--po-line);
  }

  .po-mobile-career-interview small{
    display:block;
    margin-bottom:7px;
    color:var(--po-gold);
    font-size:9px;
    font-weight:950;
    letter-spacing:.12em;
  }

  .po-mobile-career-interview strong{
    display:block;
    color:var(--po-ink);
    font-size:18px;
    line-height:1.4;
  }

  .po-mobile-career-interview a{
    display:inline-flex;
    margin-top:14px;
    padding:11px 14px;
    border:1px solid var(--po-ink);
    color:var(--po-ink)!important;
    font-size:10px;
    font-weight:950;
    letter-spacing:.08em;
  }
}



/* =============== V41 / READABLE GUIDE CARDS =============== */

/* These are the START HERE / route-choice / course-choice cards. */
.po-guide-card,
.po-guide-card:focus,
.po-guide-card:active{
  min-height:102px!important;
  padding:16px 18px!important;
}

/* BEGINNER / JAPAN / UNITED STATES / STEP 01 etc. */
.po-guide-card small{
  display:block!important;
  margin-bottom:8px!important;
  color:var(--po-gold)!important;
  font-size:11px!important;
  font-weight:950!important;
  line-height:1.15!important;
  letter-spacing:.10em!important;
}

/* Main card title */
.po-guide-card strong{
  display:block!important;
  color:var(--po-ink)!important;
  font-size:clamp(18px,1.25vw,22px)!important;
  font-weight:900!important;
  line-height:1.28!important;
}

/* Supporting description */
.po-guide-card span{
  display:block!important;
  margin-top:8px!important;
  color:var(--po-copy)!important;
  font-size:12px!important;
  font-weight:500!important;
  line-height:1.5!important;
}

/* The six Online Learning cards get a little more vertical breathing room. */
.po-guided-course-strip .po-guide-card{
  min-height:110px!important;
}

/* Pilot-route chooser uses the same readable scale. */
.po-guided-route-strip .po-guide-card{
  min-height:108px!important;
}

/* START HERE cards also remain readable without becoming oversized. */
.po-scene[data-panel="start"] .po-guide-card{
  min-height:104px!important;
}

/* Medium laptop widths */
@media(max-width:1250px) and (min-width:901px){
  .po-guide-card,
  .po-guide-card:focus,
  .po-guide-card:active{
    min-height:94px!important;
    padding:13px 14px!important;
  }

  .po-guide-card small{
    font-size:10px!important;
    margin-bottom:6px!important;
  }

  .po-guide-card strong{
    font-size:16px!important;
  }

  .po-guide-card span{
    display:block!important;
    margin-top:6px!important;
    font-size:11px!important;
  }

  .po-guided-course-strip .po-guide-card,
  .po-guided-route-strip .po-guide-card{
    min-height:98px!important;
  }
}

/* Short screens: keep all three text levels visible. */
@media(max-height:820px) and (min-width:901px){
  .po-guide-card,
  .po-guide-card:focus,
  .po-guide-card:active{
    min-height:82px!important;
    padding:10px 12px!important;
  }

  .po-guide-card small{
    font-size:9px!important;
    margin-bottom:5px!important;
  }

  .po-guide-card strong{
    font-size:15px!important;
    line-height:1.2!important;
  }

  .po-guide-card span{
    display:block!important;
    margin-top:5px!important;
    font-size:10px!important;
    line-height:1.35!important;
  }

  .po-guided-course-strip .po-guide-card,
  .po-guided-route-strip .po-guide-card{
    min-height:88px!important;
  }
}

/* Mobile */
@media(max-width:900px){
  .po-guide-card{
    min-height:96px!important;
    padding:14px 15px!important;
  }

  .po-guide-card small{
    font-size:10px!important;
  }

  .po-guide-card strong{
    font-size:17px!important;
  }

  .po-guide-card span{
    display:block!important;
    font-size:11px!important;
  }
}



/* =============== V42 / ACCOUNT LOGIN + REGISTER =============== */

@media(min-width:901px){
  .po-global-account-label{
    margin-top:16px!important;
    padding-top:13px!important;
    border-top:1px solid rgba(255,255,255,.12)!important;
  }

  .po-global-account-item{
    -webkit-appearance:none!important;
    appearance:none!important;
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:center!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-height:43px!important;
    margin:0!important;
    padding:6px 9px!important;
    border:1px solid transparent!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    font-family:inherit!important;
    cursor:pointer!important;
    transition:background .16s ease,border-color .16s ease,transform .16s ease!important;
  }

  .po-global-account-item:hover{
    transform:translateX(2px)!important;
    border-color:rgba(255,255,255,.14)!important;
    background:#242a31!important;
  }

  .po-global-account-item.is-active{
    border-color:#4a5159!important;
    background:#353b42!important;
    box-shadow:inset 3px 0 0 var(--po-gold)!important;
  }

  .po-global-account-item>span{
    display:grid!important;
    min-width:44px!important;
    min-height:27px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.18)!important;
    color:var(--po-gold-2)!important;
    font-size:8px!important;
    font-weight:950!important;
    letter-spacing:.03em!important;
  }

  .po-global-account-item>strong{
    color:#f0f2f4!important;
    font-size:14px!important;
    font-weight:900!important;
  }
}

.po-auth-shell{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(430px,.72fr);
  gap:clamp(36px,5vw,88px);
  align-items:center;
  height:100%;
  padding:clamp(28px,4vw,64px);
  border:1px solid var(--po-line);
  background:var(--po-paper);
  overflow:auto;
}

.po-auth-intro h2{
  margin:10px 0 18px;
  color:var(--po-ink);
  font-size:clamp(48px,4.4vw,76px);
  line-height:.96;
  letter-spacing:-.05em;
}

.po-auth-intro>p:not(.po-eyebrow){
  max-width:670px;
  margin:0;
  color:var(--po-copy);
  font-size:15px!important;
  line-height:1.8!important;
}

.po-auth-points{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:32px;
}

.po-auth-points>div{
  padding:15px;
  border:1px solid var(--po-line);
  background:#fbfaf6;
}

.po-auth-points span{
  display:block;
  margin-bottom:14px;
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
}

.po-auth-points strong{
  display:block;
  color:var(--po-ink);
  font-size:15px;
}

.po-auth-points small{
  display:block;
  margin-top:5px;
  color:var(--po-copy);
  font-size:10px;
  line-height:1.45;
}

.po-auth-card{
  align-self:center;
  width:100%;
  max-width:560px;
  border:1px solid #cfc8bd;
  background:#fffefa;
  box-shadow:0 22px 50px rgba(29,33,38,.07);
}

.po-auth-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-bottom:1px solid #d7d0c5;
}

.po-auth-tabs button{
  min-height:52px;
  border:0;
  border-right:1px solid #d7d0c5;
  background:#f1eee8;
  color:#777067;
  font-family:inherit;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}

.po-auth-tabs button:last-child{
  border-right:0;
}

.po-auth-tabs button.is-active{
  background:#fffefa;
  color:var(--po-ink);
  box-shadow:inset 0 -3px 0 var(--po-gold);
}

.po-auth-pane{
  display:none;
  padding:27px 30px 24px;
}

.po-auth-pane.is-active{
  display:block;
}

.po-auth-heading small{
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
  letter-spacing:.13em;
}

.po-auth-heading h3{
  margin:5px 0 5px;
  color:var(--po-ink);
  font-size:32px;
  line-height:1.1;
}

.po-auth-heading p{
  margin:0 0 20px!important;
  color:var(--po-copy)!important;
  font-size:13px!important;
}

.po-auth-social{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.po-auth-social a{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:46px;
  padding:0 12px;
  border:1px solid #c8c1b6;
  color:var(--po-ink)!important;
  background:#fff;
  font-size:11px;
  font-weight:850;
}

.po-auth-social a:hover{
  border-color:var(--po-ink);
}

.po-auth-social a>span{
  display:grid;
  width:22px;
  height:22px;
  place-items:center;
  font-size:13px;
  font-weight:950;
}

.po-auth-divider{
  position:relative;
  margin:20px 0;
  text-align:center;
}

.po-auth-divider:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:1px;
  background:#ddd6cc;
}

.po-auth-divider span{
  position:relative;
  z-index:1;
  padding:0 10px;
  background:#fffefa;
  color:#9b948a;
  font-size:8px;
  font-weight:950;
}

.po-auth-form{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.po-auth-form>label>span{
  display:block;
  margin-bottom:6px;
  color:#514c46;
  font-size:11px;
  font-weight:850;
}

.po-auth-form input[type="text"],
.po-auth-form input[type="email"],
.po-auth-form input[type="password"]{
  width:100%;
  height:48px;
  padding:0 13px;
  border:1px solid #bfb8ae;
  border-radius:0;
  outline:none;
  background:#fff;
  color:#191d21;
  font:inherit;
  font-size:14px;
}

.po-auth-form input:focus{
  border-color:var(--po-gold);
  box-shadow:0 0 0 2px rgba(174,128,50,.10);
}

.po-auth-options{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.po-auth-remember{
  display:flex!important;
  align-items:center;
  gap:7px;
  margin:0!important;
}

.po-auth-remember span,
.po-auth-options>a{
  margin:0!important;
  color:#716b63!important;
  font-size:10px!important;
  font-weight:600!important;
}

.po-auth-options>a:hover{
  color:var(--po-ink)!important;
}

.po-auth-form>button{
  min-height:50px;
  margin-top:2px;
  border:1px solid var(--po-dark);
  border-radius:0;
  background:var(--po-dark);
  color:#fff;
  font-family:inherit;
  font-size:12px;
  font-weight:950;
  letter-spacing:.06em;
  cursor:pointer;
}

.po-auth-form>button:hover{
  background:#2a3036;
}

.po-auth-register-note{
  margin:0!important;
  padding:10px 12px;
  border-left:3px solid var(--po-gold);
  background:#f3efe7;
  color:#6d665d!important;
  font-size:10px!important;
  line-height:1.55!important;
}

.po-auth-card-foot{
  padding:12px 30px;
  border-top:1px solid #ddd6cc;
  background:#f7f4ee;
  text-align:right;
}

.po-auth-card-foot a{
  color:var(--po-ink)!important;
  font-size:9px;
  font-weight:950;
  letter-spacing:.07em;
}

@media(max-width:1250px) and (min-width:901px){
  .po-auth-shell{
    grid-template-columns:minmax(0,.78fr) minmax(390px,.8fr);
    gap:28px;
    padding:28px;
  }

  .po-auth-intro h2{
    font-size:48px;
  }

  .po-auth-points{
    grid-template-columns:1fr;
    gap:5px;
    margin-top:20px;
  }

  .po-auth-points>div{
    display:grid;
    grid-template-columns:28px 110px 1fr;
    gap:9px;
    align-items:center;
    padding:9px 11px;
  }

  .po-auth-points span,
  .po-auth-points strong,
  .po-auth-points small{
    margin:0!important;
  }
}

@media(max-width:900px){
  .po-auth-shell{
    display:block;
    height:auto;
    padding:24px 18px 40px;
  }

  .po-auth-intro{
    display:none;
  }

  .po-auth-card{
    max-width:none;
  }

  .po-auth-social{
    grid-template-columns:1fr;
  }
}



/* =============== V44 / CLEAR SOCIAL LOGIN EXPLANATION =============== */

.po-auth-social-intro{
  margin:0 0 14px;
  padding:14px 16px;
  border:1px solid #d8d0c4;
  border-left:3px solid var(--po-gold);
  background:#f5f1e9;
}

.po-auth-social-intro small{
  display:block;
  margin-bottom:5px;
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
  letter-spacing:.12em;
}

.po-auth-social-intro strong{
  display:block;
  color:var(--po-ink);
  font-size:16px;
  font-weight:950;
  line-height:1.3;
}

.po-auth-social-intro p{
  margin:7px 0 0!important;
  color:#625d56!important;
  font-size:12px!important;
  line-height:1.6!important;
}

.po-auth-social a{
  min-height:50px!important;
  font-size:12px!important;
  font-weight:900!important;
}

.po-auth-divider span{
  padding:0 12px!important;
  font-size:9px!important;
  letter-spacing:.04em!important;
  text-transform:none!important;
}

@media(max-width:900px){
  .po-auth-social-intro{
    padding:13px 14px;
  }

  .po-auth-social-intro strong{
    font-size:15px;
  }

  .po-auth-social-intro p{
    font-size:11px!important;
  }
}



/* =============== V47 / AVIATION RESOURCES =============== */

.po-resources-shell{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:0;
  padding:clamp(24px,2.7vw,44px);
  border:1px solid var(--po-line);
  background:var(--po-paper);
  overflow:hidden;
}

.po-resources-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.85fr);
  gap:36px;
  align-items:end;
  flex:0 0 auto;
  padding-bottom:18px;
  border-bottom:1px solid var(--po-line);
}

.po-resources-head .po-scene-title{
  margin:4px 0 0;
}

.po-resources-intro{
  margin:0!important;
  color:var(--po-copy)!important;
  font-size:14px!important;
  line-height:1.75!important;
}

.po-resources-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  flex:1 1 auto;
  min-height:0;
  padding-top:14px;
  overflow:hidden;
}

.po-resource-group{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
  border:1px solid #cbc5bb;
  background:#fbfaf6;
}

.po-resource-group-head{
  display:flex;
  align-items:center;
  gap:12px;
  flex:0 0 auto;
  min-height:72px;
  padding:13px 16px;
  border-bottom:1px solid #d8d2c8;
  background:#f4f1ea;
}

.po-resource-group-head>span{
  display:grid;
  width:36px;
  height:36px;
  place-items:center;
  flex:0 0 36px;
  border:1px solid #c6b89f;
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
}

.po-resource-group-head small{
  display:block;
  margin-bottom:3px;
  color:#8d857b;
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}

.po-resource-group-head h3{
  margin:0;
  color:var(--po-ink);
  font-size:21px;
  line-height:1.1;
}

.po-resource-list{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  scrollbar-width:thin;
}

.po-resource-list>a{
  display:grid;
  grid-template-columns:minmax(0,1fr) 22px;
  gap:4px 12px;
  padding:13px 15px;
  border-bottom:1px solid #e0dbd2;
  color:var(--po-ink)!important;
  transition:background .16s ease,padding-left .16s ease;
}

.po-resource-list>a:last-child{
  border-bottom:0;
}

.po-resource-list>a:hover{
  padding-left:19px;
  background:var(--po-dark);
  color:#fff!important;
}

.po-resource-list strong{
  grid-column:1;
  font-size:14px;
  font-weight:900;
  line-height:1.35;
}

.po-resource-list span{
  grid-column:1;
  color:#777067;
  font-size:11px;
  line-height:1.4;
}

.po-resource-list b{
  grid-column:2;
  grid-row:1 / 3;
  align-self:center;
  justify-self:end;
  font-size:16px;
  font-weight:500;
}

.po-resource-list>a:hover span{
  color:#c5cbd0;
}

.po-resource-list>a:hover b{
  color:var(--po-gold-2);
}

@media(max-width:1250px) and (min-width:901px){
  .po-resources-grid{
    grid-template-columns:1fr 1fr;
    overflow-y:auto;
  }

  .po-resource-group:last-child{
    grid-column:1 / -1;
  }

  .po-resource-list strong{
    font-size:13px;
  }

  .po-resource-list span{
    font-size:10px;
  }
}

@media(max-height:820px) and (min-width:901px){
  .po-resources-shell{
    padding:20px 24px 16px;
  }

  .po-resources-head{
    padding-bottom:11px;
  }

  .po-resources-intro{
    font-size:12px!important;
    line-height:1.55!important;
  }

  .po-resources-grid{
    padding-top:9px;
  }

  .po-resource-group-head{
    min-height:58px;
    padding:9px 12px;
  }

  .po-resource-group-head h3{
    font-size:18px;
  }

  .po-resource-list>a{
    padding:9px 11px;
  }

  .po-resource-list strong{
    font-size:12px;
  }

  .po-resource-list span{
    font-size:9px;
  }
}

@media(max-width:900px){
  .po-resources-shell{
    height:auto;
    padding:22px 16px 40px;
  }

  .po-resources-head{
    display:block;
  }

  .po-resources-intro{
    margin-top:12px!important;
  }

  .po-resources-grid{
    display:block;
    overflow:visible;
  }

  .po-resource-group{
    margin-top:14px;
  }

  .po-resource-list{
    overflow:visible;
  }

  .po-resource-list strong{
    font-size:15px;
  }

  .po-resource-list span{
    font-size:11px;
  }
}



/* =============== V48 / RESOURCE TABS - NO INNER SCROLL =============== */

.po-resources-tabbed{
  overflow:hidden!important;
}

.po-resource-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  flex:0 0 auto;
  margin-top:14px;
}

.po-resource-tabs button{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:11px;
  align-items:center;
  min-height:64px;
  padding:11px 14px;
  border:1px solid #cbc5bb;
  background:#f5f2ec;
  color:var(--po-ink);
  text-align:left;
  font-family:inherit;
  cursor:pointer;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}

.po-resource-tabs button:hover{
  transform:translateY(-1px);
  border-color:#aaa195;
}

.po-resource-tabs button.is-active{
  border-color:var(--po-gold);
  background:#fffefa;
  box-shadow:inset 0 -3px 0 var(--po-gold);
}

.po-resource-tabs button>span{
  display:grid;
  width:36px;
  height:36px;
  place-items:center;
  border:1px solid #c7b99f;
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
}

.po-resource-tabs small{
  display:block;
  margin-bottom:3px;
  color:#8b847a;
  font-size:8px;
  font-weight:950;
  letter-spacing:.1em;
}

.po-resource-tabs strong{
  display:block;
  font-size:16px;
  font-weight:900;
}

.po-resource-panels{
  flex:1 1 auto;
  min-height:0;
  padding-top:10px;
  overflow:hidden;
}

.po-resource-panel{
  display:none;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  align-content:start;
  height:100%;
}

.po-resource-panel.is-active{
  display:grid;
}

.po-resource-panel>a{
  display:grid;
  grid-template-columns:minmax(0,1fr) 20px;
  gap:4px 10px;
  align-content:center;
  min-height:72px;
  padding:11px 13px;
  border:1px solid #d7d1c8;
  background:#fbfaf6;
  color:var(--po-ink)!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}

.po-resource-panel>a:hover{
  transform:translateY(-1px);
  border-color:var(--po-gold);
  background:var(--po-dark);
  color:#fff!important;
}

.po-resource-panel strong{
  grid-column:1;
  font-size:13px;
  font-weight:900;
  line-height:1.3;
}

.po-resource-panel span{
  grid-column:1;
  color:#777067;
  font-size:10px;
  line-height:1.35;
}

.po-resource-panel b{
  grid-column:2;
  grid-row:1/3;
  align-self:center;
  justify-self:end;
  font-size:15px;
  font-weight:500;
}

.po-resource-panel>a:hover span{
  color:#c8ced3;
}

.po-resource-panel>a:hover b{
  color:var(--po-gold-2);
}

/* Weather has the most links, so keep it compact enough to fit without scroll. */
.po-resource-panel[data-resource-panel="weather"]>a{
  min-height:60px;
  padding:8px 11px;
}

.po-resource-panel[data-resource-panel="weather"] strong{
  font-size:12px;
}

.po-resource-panel[data-resource-panel="weather"] span{
  font-size:9px;
}

@media(max-width:1250px) and (min-width:901px){
  .po-resource-panel{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .po-resource-panel>a{
    min-height:58px;
    padding:8px 10px;
  }

  .po-resource-panel strong{
    font-size:12px;
  }

  .po-resource-panel span{
    font-size:9px;
  }

  .po-resource-tabs button{
    min-height:56px;
    padding:8px 10px;
  }

  .po-resource-tabs strong{
    font-size:14px;
  }
}

@media(max-height:820px) and (min-width:901px){
  .po-resource-tabs{
    margin-top:8px;
  }

  .po-resource-tabs button{
    min-height:50px;
  }

  .po-resource-panels{
    padding-top:7px;
  }

  .po-resource-panel{
    gap:6px;
  }

  .po-resource-panel>a{
    min-height:48px;
    padding:6px 9px;
  }

  .po-resource-panel strong{
    font-size:11px;
  }

  .po-resource-panel span{
    font-size:8px;
  }

  .po-resource-panel[data-resource-panel="weather"]>a{
    min-height:44px;
    padding:5px 8px;
  }
}

@media(max-width:900px){
  .po-resource-tabs{
    grid-template-columns:1fr;
  }

  .po-resource-panel,
  .po-resource-panel.is-active{
    grid-template-columns:1fr;
    height:auto;
  }

  .po-resource-panels{
    overflow:visible;
  }

  .po-resource-panel>a{
    min-height:66px;
  }
}



/* =============== V49 / PILOT ONLINE HOME ICON =============== */
@media(min-width:901px){
  .po-global-home{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:center!important;
  }

  .po-home-plane{
    display:grid!important;
    width:34px!important;
    height:34px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.18)!important;
    color:var(--po-gold-2)!important;
    font-size:17px!important;
    font-weight:900!important;
    line-height:1!important;
  }
}



/* =============== V50 / CLEAR RESOURCE TAB HIERARCHY =============== */

/* Categories should read as navigation tabs, not content cards. */
.po-resource-tabs{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:0!important;
  margin-top:16px!important;
  border-bottom:1px solid #cfc8bd!important;
  background:transparent!important;
}

.po-resource-tabs button{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-height:58px!important;
  padding:10px 16px!important;
  border:0!important;
  border-right:1px solid #ddd7ce!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
}

.po-resource-tabs button:last-child{
  border-right:0!important;
}

.po-resource-tabs button:hover{
  background:#f5f1ea!important;
  transform:none!important;
}

.po-resource-tabs button.is-active{
  background:#f8f5ef!important;
  box-shadow:none!important;
}

.po-resource-tabs button.is-active:after{
  content:""!important;
  position:absolute!important;
  left:12px!important;
  right:12px!important;
  bottom:-1px!important;
  height:4px!important;
  background:var(--po-gold)!important;
}

.po-resource-tabs button>span{
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  border:0!important;
  color:var(--po-gold)!important;
  font-size:10px!important;
  font-weight:950!important;
}

.po-resource-tabs small{
  margin-bottom:2px!important;
  color:#9a9389!important;
  font-size:8px!important;
  letter-spacing:.11em!important;
}

.po-resource-tabs strong{
  font-size:16px!important;
  line-height:1.2!important;
}

/* Explicit separator between navigation and the content below. */
.po-resource-content-head{
  display:flex!important;
  align-items:baseline!important;
  gap:10px!important;
  flex:0 0 auto!important;
  margin:14px 0 9px!important;
  padding:0 2px!important;
}

.po-resource-content-head small{
  color:var(--po-gold)!important;
  font-size:8px!important;
  font-weight:950!important;
  letter-spacing:.14em!important;
}

.po-resource-content-head strong{
  color:var(--po-ink)!important;
  font-size:15px!important;
  font-weight:900!important;
}

/* Content cards remain clearly boxed, contrasting with the flat tabs above. */
.po-resource-panel>a{
  border:1px solid #d7d1c8!important;
  background:#fffefa!important;
}

.po-resource-panel>a:hover{
  border-color:var(--po-gold)!important;
  background:var(--po-dark)!important;
}

/* Keep the distinction on tighter screens too. */
@media(max-width:1250px) and (min-width:901px){
  .po-resource-tabs button{
    min-height:52px!important;
    padding:8px 11px!important;
  }

  .po-resource-tabs strong{
    font-size:14px!important;
  }

  .po-resource-content-head{
    margin-top:10px!important;
    margin-bottom:7px!important;
  }
}

@media(max-width:900px){
  .po-resource-tabs{
    grid-template-columns:1fr!important;
    border-bottom:0!important;
    gap:0!important;
  }

  .po-resource-tabs button{
    border-right:0!important;
    border-bottom:1px solid #ddd7ce!important;
  }

  .po-resource-tabs button.is-active:after{
    left:0!important;
    right:auto!important;
    top:8px!important;
    bottom:8px!important;
    width:4px!important;
    height:auto!important;
  }
}



/* =============== V51 / ALL RESOURCES VISIBLE - NO TABS, NO INNER SCROLL =============== */

.po-resources-all{
  overflow:hidden!important;
}

.po-resources-all-grid{
  display:grid;
  grid-template-columns:1.35fr .85fr;
  grid-template-rows:auto 1fr;
  gap:10px;
  flex:1 1 auto;
  min-height:0;
  padding-top:12px;
  overflow:hidden;
}

.po-resource-block{
  min-width:0;
  border:1px solid #d1cbc1;
  background:#faf8f3;
}

.po-resource-block-weather{
  grid-column:1 / -1;
}

.po-resource-block-head{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:8px 12px;
  border-bottom:1px solid #d8d2c8;
  background:#f1ede6;
}

.po-resource-block-no{
  display:grid;
  width:30px;
  height:30px;
  flex:0 0 30px;
  place-items:center;
  border:1px solid #c4b699;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
}

.po-resource-block-head small{
  display:block;
  margin-bottom:2px;
  color:#8b847a;
  font-size:7px;
  font-weight:950;
  letter-spacing:.11em;
}

.po-resource-block-head h3{
  margin:0;
  color:var(--po-ink);
  font-size:17px;
  line-height:1.1;
}

.po-resource-links{
  display:grid;
  gap:6px;
  padding:7px;
}

.po-resource-links-aviation{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.po-resource-links-study{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.po-resource-links-weather{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.po-resource-links>a{
  display:grid;
  grid-template-columns:minmax(0,1fr) 16px;
  gap:2px 7px;
  align-content:center;
  min-width:0;
  min-height:54px;
  padding:7px 9px;
  border:1px solid #ddd7ce;
  background:#fffefa;
  color:var(--po-ink)!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}

.po-resource-links>a:hover{
  transform:translateY(-1px);
  border-color:var(--po-gold);
  background:var(--po-dark);
  color:#fff!important;
}

.po-resource-links strong{
  grid-column:1;
  min-width:0;
  font-size:11px;
  font-weight:900;
  line-height:1.25;
}

.po-resource-links span{
  grid-column:1;
  min-width:0;
  overflow:hidden;
  color:#777067;
  font-size:8.5px;
  line-height:1.3;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.po-resource-links b{
  grid-column:2;
  grid-row:1 / 3;
  align-self:center;
  justify-self:end;
  font-size:13px;
  font-weight:500;
}

.po-resource-links>a:hover span{
  color:#c8ced3;
}

.po-resource-links>a:hover b{
  color:var(--po-gold-2);
}

/* Weather has 16 links: four columns x four rows keeps all visible. */
.po-resource-links-weather>a{
  min-height:48px;
  padding:6px 8px;
}

.po-resource-links-weather strong{
  font-size:10.5px;
}

.po-resource-links-weather span{
  font-size:8px;
}

@media(max-width:1320px) and (min-width:901px){
  .po-resources-all-grid{
    grid-template-columns:1.25fr .75fr;
    gap:8px;
    padding-top:9px;
  }

  .po-resource-links{
    gap:5px;
    padding:6px;
  }

  .po-resource-links-aviation{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .po-resource-links-study{
    grid-template-columns:1fr;
  }

  .po-resource-links-weather{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .po-resource-links>a{
    min-height:48px;
    padding:6px 7px;
  }

  .po-resource-links strong{
    font-size:10px;
  }

  .po-resource-links span{
    font-size:7.5px;
  }
}

@media(max-height:820px) and (min-width:901px){
  .po-resources-head{
    padding-bottom:8px!important;
  }

  .po-resources-all-grid{
    gap:6px;
    padding-top:7px;
  }

  .po-resource-block-head{
    min-height:39px;
    padding:5px 9px;
  }

  .po-resource-block-no{
    width:25px;
    height:25px;
    flex-basis:25px;
  }

  .po-resource-block-head h3{
    font-size:15px;
  }

  .po-resource-links{
    gap:4px;
    padding:5px;
  }

  .po-resource-links>a{
    min-height:39px;
    padding:4px 6px;
  }

  .po-resource-links strong{
    font-size:9px;
    line-height:1.2;
  }

  .po-resource-links span{
    font-size:7px;
  }

  .po-resource-links-weather>a{
    min-height:37px;
  }

  .po-resource-links-weather strong{
    font-size:9px;
  }

  .po-resource-links-weather span{
    font-size:6.8px;
  }
}

@media(max-width:900px){
  .po-resources-all{
    overflow:visible!important;
  }

  .po-resources-all-grid{
    display:block;
    overflow:visible;
  }

  .po-resource-block{
    margin-top:14px;
  }

  .po-resource-links,
  .po-resource-links-aviation,
  .po-resource-links-study,
  .po-resource-links-weather{
    grid-template-columns:1fr;
  }

  .po-resource-links>a,
  .po-resource-links-weather>a{
    min-height:62px;
  }

  .po-resource-links strong,
  .po-resource-links-weather strong{
    font-size:14px;
  }

  .po-resource-links span,
  .po-resource-links-weather span{
    font-size:10px;
    white-space:normal;
  }
}



/* =============== V52 / RESOURCE LINKS: TITLE ONLY, LARGER =============== */

/* Hide the tiny second-line descriptions entirely. */
.po-resource-links span{
  display:none!important;
}

/* Make each resource link a clean single-line row. */
.po-resource-links>a{
  grid-template-columns:minmax(0,1fr) 20px!important;
  grid-template-rows:1fr!important;
  align-items:center!important;
  min-height:58px!important;
  padding:10px 12px!important;
}

.po-resource-links strong{
  grid-column:1!important;
  grid-row:1!important;
  font-size:14px!important;
  font-weight:900!important;
  line-height:1.3!important;
}

.po-resource-links b{
  grid-column:2!important;
  grid-row:1!important;
  align-self:center!important;
  justify-self:end!important;
  font-size:16px!important;
}

/* Weather stays compact enough to fit, but remains readable. */
.po-resource-links-weather>a{
  min-height:54px!important;
  padding:9px 11px!important;
}

.po-resource-links-weather strong{
  font-size:13px!important;
}

/* Slightly larger category headings too. */
.po-resource-block-head{
  min-height:52px!important;
  padding:9px 13px!important;
}

.po-resource-block-head h3{
  font-size:19px!important;
}

.po-resource-block-head small{
  font-size:8px!important;
}

/* Medium desktop */
@media(max-width:1320px) and (min-width:901px){
  .po-resource-links>a{
    min-height:52px!important;
    padding:8px 10px!important;
  }

  .po-resource-links strong{
    font-size:12.5px!important;
  }

  .po-resource-links-weather>a{
    min-height:48px!important;
  }

  .po-resource-links-weather strong{
    font-size:12px!important;
  }
}

/* Short screens */
@media(max-height:820px) and (min-width:901px){
  .po-resource-links>a{
    min-height:45px!important;
    padding:6px 8px!important;
  }

  .po-resource-links strong{
    font-size:11.5px!important;
  }

  .po-resource-links-weather>a{
    min-height:42px!important;
  }

  .po-resource-links-weather strong{
    font-size:11px!important;
  }

  .po-resource-block-head{
    min-height:42px!important;
  }

  .po-resource-block-head h3{
    font-size:16px!important;
  }
}

/* Mobile */
@media(max-width:900px){
  .po-resource-links>a,
  .po-resource-links-weather>a{
    min-height:58px!important;
    padding:10px 12px!important;
  }

  .po-resource-links strong,
  .po-resource-links-weather strong{
    font-size:15px!important;
  }
}



/* =============== V53 / VERTICAL RESOURCE COLUMNS =============== */
.po-resources-columns{overflow:hidden!important}
.po-resource-column-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:9px;
  flex:1 1 auto;
  min-height:0;
  padding-top:12px;
  overflow:hidden;
}
.po-resource-column{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
  border:1px solid #d0c9bf;
  background:#faf8f3;
}
.po-resource-column-head{
  display:flex;
  align-items:center;
  gap:9px;
  flex:0 0 auto;
  min-height:62px;
  padding:10px 11px;
  border-bottom:1px solid #d8d1c7;
  background:#f0ece5;
}
.po-resource-column-head>span{
  display:grid;
  width:32px;height:32px;flex:0 0 32px;
  place-items:center;
  border:1px solid #c4b493;
  color:var(--po-gold);
  font-size:8px;font-weight:950;
}
.po-resource-column-head small{
  display:block;margin-bottom:3px;
  color:#8f887e;font-size:7px;font-weight:950;letter-spacing:.08em;
}
.po-resource-column-head h3{
  margin:0;color:var(--po-ink);font-size:16px;font-weight:900;line-height:1.15;
}
.po-resource-column-list{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
}
.po-resource-column-list>a{
  display:grid;
  grid-template-columns:minmax(0,1fr) 17px;
  gap:8px;
  align-items:center;
  flex:1 1 0;
  min-height:40px;
  padding:8px 10px;
  border-bottom:1px solid #ded8cf;
  background:#fffefa;
  color:var(--po-ink)!important;
  transition:background .16s ease,color .16s ease,padding-left .16s ease;
}
.po-resource-column-list>a:last-child{border-bottom:0}
.po-resource-column-list>a:hover{
  padding-left:13px;background:var(--po-dark);color:#fff!important;
}
.po-resource-column-list strong{
  min-width:0;font-size:13px;font-weight:900;line-height:1.28;
}
.po-resource-column-list b{
  justify-self:end;color:#8b8278;font-size:14px;font-weight:500;
}
.po-resource-column-list>a:hover b{color:var(--po-gold-2)}
.po-resource-column:nth-child(4) .po-resource-column-list strong{font-size:11.5px}
.po-resource-column:nth-child(4) .po-resource-column-list>a{
  min-height:34px;padding-top:5px;padding-bottom:5px;
}
.po-resource-column:nth-child(2) .po-resource-column-list>a,
.po-resource-column:nth-child(5) .po-resource-column-list>a{
  flex:0 0 auto;min-height:48px;
}

@media(max-width:1350px) and (min-width:901px){
  .po-resource-column-grid{gap:6px}
  .po-resource-column-head{min-height:55px;padding:8px}
  .po-resource-column-head>span{width:27px;height:27px;flex-basis:27px}
  .po-resource-column-head h3{font-size:14px}
  .po-resource-column-list>a{padding-left:7px;padding-right:7px}
  .po-resource-column-list strong{font-size:11.5px}
  .po-resource-column:nth-child(4) .po-resource-column-list strong{font-size:10px}
}
@media(max-height:820px) and (min-width:901px){
  .po-resources-head{padding-bottom:8px!important}
  .po-resource-column-grid{padding-top:7px;gap:5px}
  .po-resource-column-head{min-height:47px;padding:6px 7px}
  .po-resource-column-head small{font-size:6px}
  .po-resource-column-head h3{font-size:13px}
  .po-resource-column-list>a{min-height:30px;padding:4px 6px}
  .po-resource-column-list strong{font-size:10px}
  .po-resource-column:nth-child(4) .po-resource-column-list strong{font-size:9px}
  .po-resource-column:nth-child(2) .po-resource-column-list>a,
  .po-resource-column:nth-child(5) .po-resource-column-list>a{min-height:38px}
}
@media(max-width:900px){
  .po-resources-columns{overflow:visible!important}
  .po-resource-column-grid{display:block;overflow:visible}
  .po-resource-column{margin-top:14px}
  .po-resource-column-list>a,
  .po-resource-column:nth-child(2) .po-resource-column-list>a,
  .po-resource-column:nth-child(4) .po-resource-column-list>a,
  .po-resource-column:nth-child(5) .po-resource-column-list>a{
    min-height:54px;padding:10px 12px;
  }
  .po-resource-column-list strong,
  .po-resource-column:nth-child(4) .po-resource-column-list strong{font-size:14px}
}



/* =============== V54 / EQUAL-SIZE RESOURCE BOXES =============== */

/* Every resource link uses exactly the same box size. */
.po-resource-column-list{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
}

.po-resource-column-list>a,
.po-resource-column:nth-child(2) .po-resource-column-list>a,
.po-resource-column:nth-child(4) .po-resource-column-list>a,
.po-resource-column:nth-child(5) .po-resource-column-list>a{
  flex:0 0 48px!important;
  width:100%!important;
  min-height:48px!important;
  height:48px!important;
  padding:7px 9px!important;
}

.po-resource-column-list strong,
.po-resource-column:nth-child(4) .po-resource-column-list strong{
  font-size:12px!important;
  line-height:1.25!important;
}

/* Category headers also stay identical in height. */
.po-resource-column-head{
  min-height:60px!important;
  height:60px!important;
  padding:9px 10px!important;
}

/* Medium desktop: all boxes shrink together, never individually. */
@media(max-width:1350px) and (min-width:901px){
  .po-resource-column-list>a,
  .po-resource-column:nth-child(2) .po-resource-column-list>a,
  .po-resource-column:nth-child(4) .po-resource-column-list>a,
  .po-resource-column:nth-child(5) .po-resource-column-list>a{
    flex-basis:44px!important;
    min-height:44px!important;
    height:44px!important;
    padding:6px 7px!important;
  }

  .po-resource-column-list strong,
  .po-resource-column:nth-child(4) .po-resource-column-list strong{
    font-size:11px!important;
  }

  .po-resource-column-head{
    min-height:54px!important;
    height:54px!important;
  }
}

/* Short screens: same-size boxes remain, only uniformly shorter. */
@media(max-height:820px) and (min-width:901px){
  .po-resource-column-list>a,
  .po-resource-column:nth-child(2) .po-resource-column-list>a,
  .po-resource-column:nth-child(4) .po-resource-column-list>a,
  .po-resource-column:nth-child(5) .po-resource-column-list>a{
    flex-basis:36px!important;
    min-height:36px!important;
    height:36px!important;
    padding:4px 6px!important;
  }

  .po-resource-column-list strong,
  .po-resource-column:nth-child(4) .po-resource-column-list strong{
    font-size:10px!important;
  }

  .po-resource-column-head{
    min-height:44px!important;
    height:44px!important;
  }
}

/* Mobile: equal cards, but comfortably tappable. */
@media(max-width:900px){
  .po-resource-column-list>a,
  .po-resource-column:nth-child(2) .po-resource-column-list>a,
  .po-resource-column:nth-child(4) .po-resource-column-list>a,
  .po-resource-column:nth-child(5) .po-resource-column-list>a{
    flex-basis:56px!important;
    min-height:56px!important;
    height:56px!important;
    padding:9px 11px!important;
  }

  .po-resource-column-list strong,
  .po-resource-column:nth-child(4) .po-resource-column-list strong{
    font-size:14px!important;
  }

  .po-resource-column-head{
    min-height:58px!important;
    height:58px!important;
  }
}


/* =============== LESSON EXPERIENCE =============== */
.po-lesson-shell{
  display:grid;
  grid-template-columns:minmax(280px,330px) minmax(0,1fr);
  height:100%;
  min-height:0;
  border:1px solid var(--po-line);
  background:#f7f5f0;
  overflow:hidden;
}
.po-lesson-side{
  display:flex;
  flex-direction:column;
  min-height:0;
  padding:22px 16px 16px;
  background:#181d22;
  color:#fff!important;
}
.po-lesson-side .po-eyebrow{
  margin:0 0 10px;
  color:#e2aa4f!important;
}
.po-lesson-side h3{
  margin:0 0 5px;
  color:#fff!important;
  font-size:22px;
  line-height:1.15;
}
.po-lesson-side>small{
  display:block;
  color:#aeb6bd!important;
  font-size:9px;
  line-height:1.55;
}
.po-progress{
  height:5px;
  margin:15px 0 7px;
  overflow:hidden;
  background:#394149;
}
.po-progress span{
  display:block;
  width:40%;
  height:100%;
  background:var(--po-green);
  transition:width .25s ease;
}
.po-progress-copy{
  margin-bottom:17px;
  color:#b7bec4!important;
  font-size:8px;
  font-weight:800;
  letter-spacing:.03em;
}
.po-lesson-menu-label{
  margin:0 0 7px;
  color:#89949e!important;
  font-size:7px;
  font-weight:950;
  letter-spacing:.14em;
}
.po-lesson-menu{
  display:grid;
  gap:5px;
  min-height:0;
  overflow:auto;
  padding-right:2px;
}
button.po-lesson-item,
button.po-lesson-item:visited,
button.po-lesson-item:focus,
button.po-lesson-item:active{
  -webkit-appearance:none!important;
  appearance:none!important;
  display:grid!important;
  grid-template-columns:31px minmax(0,1fr)!important;
  gap:9px!important;
  width:100%!important;
  min-height:58px!important;
  margin:0!important;
  padding:9px 10px!important;
  border:1px solid transparent!important;
  border-radius:3px!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  color:#d9dee2!important;
  text-align:left!important;
  font-family:inherit!important;
  cursor:pointer!important;
  transition:background .16s ease,border-color .16s ease,color .16s ease!important;
}
button.po-lesson-item:hover{
  border-color:#4b535b!important;
  background:#252b31!important;
  color:#fff!important;
}
button.po-lesson-item.is-active{
  border-color:#454c53!important;
  background:#3b4249!important;
  color:#fff!important;
  box-shadow:inset 2px 0 0 #d8a348!important;
}
button.po-lesson-item.is-done{
  color:#d7dcdf!important;
}
.po-lesson-item-num{
  display:flex;
  width:31px;
  height:31px;
  align-items:center;
  justify-content:center;
  align-self:center;
  border:1px solid #59616a;
  color:#aab2b9!important;
  font-size:8px;
  font-weight:950;
  line-height:1;
}
.po-lesson-item.is-active .po-lesson-item-num{
  border-color:#d8a348;
  color:#fff!important;
}
.po-lesson-item.is-done .po-lesson-item-num:before{
  content:"✓";
  color:#7ec98d!important;
  font-size:11px;
}
.po-lesson-item.is-done .po-lesson-item-num span{
  display:none;
}
.po-lesson-item-copy{
  display:block;
  align-self:center;
  min-width:0;
  color:inherit!important;
}
.po-lesson-item-title{
  display:block;
  margin-bottom:2px;
  color:inherit!important;
  font-size:10.5px;
  font-weight:900;
  line-height:1.35;
}
.po-lesson-item-desc{
  display:block;
  color:#929ca4!important;
  font-size:7.5px;
  line-height:1.45;
}
.po-lesson-item.is-active .po-lesson-item-desc{
  color:#d4d8db!important;
}
.po-lesson-side-bottom{
  margin-top:auto;
  padding-top:13px;
}
.po-lesson-side-tip{
  margin:0 0 10px;
  padding-top:11px;
  border-top:1px solid #333a41;
  color:#9099a1!important;
  font-size:8px;
  line-height:1.6;
}
.po-complete-btn{
  width:100%!important;
  min-height:42px!important;
  margin:0!important;
  padding:0 14px!important;
  border:0!important;
  border-radius:999px!important;
  background:#f2f1ed!important;
  color:#171b20!important;
  font-family:inherit!important;
  font-size:10px!important;
  font-weight:950!important;
  cursor:pointer!important;
}
.po-complete-btn:hover{
  background:#fff!important;
  color:#111!important;
}

.po-lesson-main{
  min-height:0;
  padding:24px clamp(22px,2.8vw,50px);
  overflow:auto;
  background:#f7f5f0;
}
.po-lesson-main h2{
  margin:0 0 7px;
  font-size:clamp(30px,3vw,54px);
  line-height:1;
  letter-spacing:-.045em;
}
.po-lesson-main .lead{
  margin:0 0 20px;
  color:var(--po-copy);
  font-size:13px;
  line-height:1.8;
}
.po-lesson-meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:0 0 17px;
}
.po-lesson-meta span{
  padding:6px 8px;
  border:1px solid #d8d3c9;
  background:#fbfaf7;
  color:#746d63;
  font-size:7px;
  font-weight:900;
  letter-spacing:.08em;
}
.po-lesson-section-title{
  display:flex;
  align-items:center;
  gap:9px;
  margin:21px 0 10px;
  color:#22272c;
  font-size:12px;
  font-weight:950;
}
.po-lesson-section-title:before{
  content:"";
  width:22px;
  height:2px;
  background:#d2a14d;
}
.po-point{
  display:inline-flex;
  padding:7px 11px;
  margin-bottom:12px;
  background:#e9dfca;
  color:#4a3e2c;
  font-size:9px;
  font-weight:950;
  letter-spacing:.1em;
}
.po-lesson-main .po-chat{
  display:grid;
  gap:13px;
}
.po-lesson-main .po-chat-row{
  margin:0;
}
.po-lesson-main .po-chat-bubble{
  font-size:clamp(13px,.82vw,15px);
  line-height:1.8;
}
.po-lesson-concepts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:17px;
}
.po-lesson-concept{
  padding:13px 14px;
  border:1px solid #d6d1c7;
  background:#fbfaf6;
}
.po-lesson-concept small{
  display:block;
  margin-bottom:5px;
  color:#a4772f;
  font-size:7px;
  font-weight:950;
  letter-spacing:.1em;
}
.po-lesson-concept strong{
  display:block;
  margin-bottom:5px;
  color:#22272c;
  font-size:12px;
}
.po-lesson-concept p{
  margin:0;
  color:#69645c;
  font-size:9px;
  line-height:1.65;
}
.po-note{
  margin-top:17px;
  padding:15px 17px;
  border-left:3px solid var(--po-gold);
  background:#ece8df;
}
.po-note strong{
  display:block;
  margin-bottom:5px;
  font-size:10px;
  letter-spacing:.07em;
}
.po-note p{
  margin:0;
  color:var(--po-copy);
  font-size:11px;
  line-height:1.75;
}
.po-lesson-summary{
  margin-top:17px;
  padding:15px 17px;
  border:1px solid #d5d0c7;
  background:#fffefa;
}
.po-lesson-summary-title{
  margin:0 0 10px;
  color:#22272c;
  font-size:11px;
  font-weight:950;
}
.po-lesson-summary ul{
  display:grid;
  gap:7px;
  margin:0;
  padding:0;
  list-style:none;
}
.po-lesson-summary li{
  position:relative;
  padding-left:18px;
  color:#57534c;
  font-size:10px;
  line-height:1.65;
}
.po-lesson-summary li:before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color:#5f9e6c;
  font-weight:950;
}
.po-lesson-controls{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:18px;
  padding-top:15px;
  border-top:1px solid #d7d2c9;
}
.po-lesson-nav-btn{
  display:inline-flex!important;
  min-height:40px!important;
  padding:0 14px!important;
  align-items:center!important;
  gap:10px!important;
  border:1px solid #2b3035!important;
  border-radius:2px!important;
  background:#fffefa!important;
  color:#22272c!important;
  font-family:inherit!important;
  font-size:9px!important;
  font-weight:950!important;
  cursor:pointer!important;
}
.po-lesson-nav-btn.next{
  margin-left:auto!important;
  background:#20252a!important;
  color:#fff!important;
}
.po-lesson-nav-btn:disabled{
  opacity:.32!important;
  cursor:default!important;
}

@media(max-width:1120px) and (min-width:901px){
  .po-lesson-shell{grid-template-columns:270px minmax(0,1fr);}
  .po-lesson-concepts{grid-template-columns:1fr;}
}


/* =============== CAREER STORIES =============== */
.po-career-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;flex:1;min-height:0;}
.po-career-card{position:relative;display:flex;align-items:flex-end;min-height:0;overflow:hidden;background:#242a31;color:#fff!important;border:1px solid #a59f94;}
.po-career-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}.po-career-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,18,22,.98),rgba(15,18,22,.28) 65%,rgba(15,18,22,.04));}
.po-career-content{position:relative;z-index:2;padding:20px;width:100%;}.po-career-content small{color:var(--po-gold-2);font-size:8px;font-weight:950;letter-spacing:.12em;}.po-career-content h3{margin:7px 0 6px;font-size:clamp(22px,2vw,34px);}.po-career-content p{margin:0;color:#d1d6da;font-size:10px;line-height:1.6;}.po-career-more{display:block;margin-top:14px;padding-top:10px;border-top:1px solid rgba(255,255,255,.25);font-size:9px;font-weight:900;}


/* =============== V20 / CAREER STORIES 10-PANEL WALL =============== */
.po-career-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  grid-template-rows:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  flex:1 1 auto!important;
  min-height:0!important;
}

.po-career-card{
  min-height:0!important;
  height:100%!important;
  border-color:#999288!important;
}

.po-career-card.is-sample{
  cursor:default!important;
}

.po-career-card.is-sample:before{
  content:"SAMPLE";
  position:absolute;
  z-index:4;
  top:10px;
  right:10px;
  padding:4px 6px;
  border:1px solid rgba(255,255,255,.5);
  background:rgba(17,22,27,.55);
  color:#fff;
  font-size:6px;
  font-weight:950;
  letter-spacing:.11em;
  backdrop-filter:blur(4px);
}

.po-career-placeholder-visual{
  position:absolute;
  inset:0;
  overflow:hidden;
  background:linear-gradient(135deg,#8f9aa3,#26323b);
}

.po-career-placeholder-visual:before{
  content:"";
  position:absolute;
  width:110%;
  height:110%;
  left:-32%;
  top:-38%;
  border:28px solid rgba(255,255,255,.08);
  border-radius:50%;
}

.po-career-placeholder-visual:after{
  content:"";
  position:absolute;
  width:74%;
  height:74%;
  right:-24%;
  bottom:-32%;
  border:20px solid rgba(214,165,76,.15);
  border-radius:50%;
}

/* Give the placeholder wall enough visual variation without pretending
   these are real people/photos. */
.po-career-card:nth-child(2) .po-career-placeholder-visual{background:linear-gradient(135deg,#9a8f84,#263640);}
.po-career-card:nth-child(3) .po-career-placeholder-visual{background:linear-gradient(135deg,#b7a997,#3c3030);}
.po-career-card:nth-child(4) .po-career-placeholder-visual{background:linear-gradient(135deg,#8fa3ad,#2c3e46);}
.po-career-card:nth-child(5) .po-career-placeholder-visual{background:linear-gradient(135deg,#a79a82,#3e4546);}
.po-career-card:nth-child(6) .po-career-placeholder-visual{background:linear-gradient(135deg,#8da39a,#2c4039);}
.po-career-card:nth-child(7) .po-career-placeholder-visual{background:linear-gradient(135deg,#b39b83,#493a2f);}
.po-career-card:nth-child(8) .po-career-placeholder-visual{background:linear-gradient(135deg,#9ea2a7,#33383d);}
.po-career-card:nth-child(9) .po-career-placeholder-visual{background:linear-gradient(135deg,#91a9b7,#304858);}
.po-career-card:nth-child(10) .po-career-placeholder-visual{background:linear-gradient(135deg,#b0a09a,#4b3e3b);}

.po-career-content{
  padding:14px!important;
}

.po-career-content small{
  font-size:7px!important;
}

.po-career-content h3{
  margin:6px 0 5px!important;
  font-size:clamp(15px,1.15vw,21px)!important;
  line-height:1.22!important;
}

.po-career-content p{
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  margin:0!important;
  color:#d1d6da!important;
  font-size:9px!important;
  line-height:1.5!important;
}

.po-career-more{
  margin-top:10px!important;
  padding-top:8px!important;
  font-size:7.5px!important;
}

/* Keep 10 panels useful on mid-sized desktop screens. */
@media(max-width:1450px) and (min-width:901px){
  .po-career-grid{
    grid-template-columns:repeat(5,minmax(180px,1fr))!important;
    grid-template-rows:repeat(2,minmax(180px,1fr))!important;
    overflow:auto!important;
  }
}

/* Short screens: reduce text footprint rather than hiding cards. */
@media(max-height:820px) and (min-width:901px){
  .po-career-grid{
    gap:7px!important;
  }

  .po-career-content{
    padding:10px!important;
  }

  .po-career-content h3{
    font-size:13px!important;
  }

  .po-career-content p{
    -webkit-line-clamp:2;
    font-size:7.5px!important;
  }

  .po-career-more{
    margin-top:6px!important;
    padding-top:5px!important;
  }
}


/* =============== NEWS / BENTO =============== */
.po-news-bento{display:grid;grid-template-columns:1.15fr .9fr .9fr;grid-template-rows:1fr 1fr;gap:12px;flex:1;min-height:0;}
.po-news-tile{position:relative;padding:18px 20px;border:1px solid var(--po-line);background:var(--po-card);color:var(--po-ink)!important;overflow:hidden;display:flex;flex-direction:column;}
.po-news-tile.feature{grid-row:1/3;background:var(--po-dark);color:#fff!important;border-color:var(--po-dark);}
.po-news-type{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:auto;color:var(--po-gold);font-size:8px;font-weight:950;letter-spacing:.12em;}.po-news-tile.feature .po-news-type{color:var(--po-gold-2);}
.po-news-tile h3{margin:18px 0 8px;font-size:clamp(19px,1.75vw,31px);line-height:1.18;letter-spacing:-.025em;}.po-news-tile.feature h3{font-size:clamp(30px,3vw,54px);}.po-news-tile p{margin:0;color:var(--po-copy);font-size:clamp(10px,.72vw,12px);line-height:1.65;}.po-news-tile.feature p{color:#c8d0d7;max-width:560px;}.po-news-footer{display:flex;justify-content:space-between;gap:10px;margin-top:14px;padding-top:10px;border-top:1px solid #d7d1c7;font-size:8px;font-weight:900;}.po-news-tile.feature .po-news-footer{border-color:rgba(255,255,255,.16);color:#b8c1c8;}

/* =============== ABOUT =============== */
.po-about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:14px;flex:1;min-height:0;}.po-about-message{display:flex;flex-direction:column;justify-content:center;padding:clamp(24px,3vw,50px);border:1px solid var(--po-line);background:var(--po-card);}.po-about-message h2{margin:0 0 18px;font-size:clamp(42px,4.2vw,78px);line-height:1;letter-spacing:-.055em;}.po-about-message p{max-width:760px;margin:0;color:var(--po-copy);font-size:clamp(12px,.9vw,15px);line-height:1.95;}.po-about-pillars{display:grid;grid-template-rows:repeat(3,1fr);gap:10px;}.po-about-pillar{padding:20px;border:1px solid var(--po-line);background:var(--po-paper-2);display:flex;flex-direction:column;justify-content:flex-end;}.po-about-pillar small{color:var(--po-gold);font-size:8px;font-weight:950;letter-spacing:.12em}.po-about-pillar strong{margin:8px 0 4px;font-size:24px}.po-about-pillar span{color:var(--po-copy);font-size:10px;line-height:1.6}

/* =============== EXPLORE OVERLAY =============== */
.po-explore-panel{position:fixed;z-index:1000;inset:0;visibility:hidden;opacity:0;transition:.2s ease;}.po-explore-panel.is-open{visibility:visible;opacity:1;}.po-explore-backdrop{position:absolute;inset:0;background:rgba(14,17,20,.52);backdrop-filter:blur(5px);}.po-explore-card{position:absolute;top:70px;right:24px;width:min(720px,calc(100% - 48px));padding:28px;background:var(--paper,#f3f1eb);border:1px solid var(--po-line);box-shadow:0 28px 70px rgba(0,0,0,.18);}.po-explore-card h2{margin:0 0 20px;font-size:28px;}.po-explore-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}.po-explore-col small{display:block;margin-bottom:9px;color:var(--po-gold);font-size:8px;font-weight:950;letter-spacing:.12em}.po-explore-col a,.po-explore-col button{display:block;width:100%;padding:8px 0;border:0;background:none;color:var(--po-ink)!important;text-align:left;font-size:12px;font-weight:800;cursor:pointer;}

/* =============== MOBILE FLOW =============== */
.po-mobile{display:none;}
@media(max-width:900px){
  html,body{overflow-x:hidden!important;overflow-y:auto!important;background:#071522;}
  .po-desktop,.po-scene-nav{display:none!important;}
  .po-mobile{display:block;background:#071522;}
  .po-header{height:56px;position:fixed;}.po-logo{top:20px;left:16px}.po-logo strong{font-size:17px}.po-logo small{display:none}.po-actions{top:10px;right:8px;gap:5px}.po-head-btn{min-height:31px;padding:0 10px;font-size:9px;letter-spacing:.7px;}
  .po-mobile-section{padding:74px 16px;}.po-mobile-inner{width:100%;max-width:640px;margin:0 auto;}.po-mobile-kicker{margin:0 0 9px;color:var(--po-gold);font-size:9px;font-weight:950;letter-spacing:.16em}.po-mobile-title{margin:0;font-size:36px;line-height:1.04;letter-spacing:-.045em}.po-mobile-copy{margin:15px 0 0;font-size:13px;line-height:1.8}.po-mobile-cta{display:inline-flex;margin-top:20px;min-height:42px;padding:0 15px;align-items:center;border:1px solid currentColor;color:inherit!important;font-size:9px;font-weight:950;letter-spacing:.08em}.po-mobile-cta:after{content:"→";margin-left:14px;font-size:15px;}

  /* Top conversation is the landing hero */
  .po-mobile-start{padding-top:78px;padding-bottom:58px;background:var(--po-paper);color:var(--po-ink);}
  .po-mobile-start .po-mobile-title{font-size:clamp(33px,10vw,46px);white-space:nowrap;}
  .po-mobile-start-head{padding:18px 0 16px;border-bottom:1px solid var(--po-line);}.po-mobile-start-head p{margin:10px 0 0;color:var(--po-copy);font-size:12px;line-height:1.7;}
  .po-mobile-start .po-chat{gap:12px;margin-top:18px}.po-mobile-start .po-avatar{flex-basis:46px}.po-mobile-start .po-avatar img{width:44px;height:44px}.po-mobile-start .po-chat-bubble{max-width:calc(100% - 58px);padding:12px 13px;font-size:13px;line-height:1.65;}
  .po-mobile-guide{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}.po-mobile-guide a{padding:13px;border:1px solid var(--po-line);background:var(--po-card);color:var(--po-ink)!important}.po-mobile-guide small{display:block;color:var(--po-gold);font-size:7px;font-weight:950;letter-spacing:.1em}.po-mobile-guide strong{display:block;margin-top:5px;font-size:13px;line-height:1.3}.po-mobile-scroll{display:flex;margin-top:28px;align-items:center;justify-content:center;gap:8px;color:#80786c;font-size:8px;font-weight:900;letter-spacing:.15em}.po-mobile-scroll:after{content:"↓";font-size:16px;}

  /* Alternate light/dark, simplified */
  .po-mobile-become{background:#071522;color:#fff}.po-mobile-become .po-mobile-copy{color:#b9c5d2}.po-mobile-route-cards{display:grid;gap:8px;margin-top:24px}.po-mobile-route-card{padding:17px;border:1px solid rgba(255,255,255,.16);background:#0c2032}.po-mobile-route-card small{display:block;color:var(--po-gold-2);font-size:7px;font-weight:950;letter-spacing:.1em}.po-mobile-route-card strong{display:block;margin:5px 0;font-size:21px}.po-mobile-route-card p{margin:0;color:#b9c5d2;font-size:11px;line-height:1.7}
  .po-mobile-learning{background:var(--po-paper);color:var(--po-ink)}.po-mobile-learning .po-mobile-copy{color:var(--po-copy)}.po-mobile-who{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px}.po-mobile-who div{padding:13px;border:1px solid var(--po-line);background:var(--po-card)}.po-mobile-who small{display:block;color:var(--po-gold);font-size:7px;font-weight:950}.po-mobile-who strong{display:block;margin:5px 0 3px;font-size:13px}.po-mobile-who span{color:var(--po-copy);font-size:9px;line-height:1.45}
  .po-mobile-lesson{background:#071522;color:#fff}.po-mobile-lesson .po-mobile-copy{color:#b9c5d2}.po-mobile-lesson-demo{margin-top:22px;padding:16px;background:#f3f1eb;color:var(--po-ink)}.po-mobile-lesson-demo .po-chat-bubble{font-size:12px}.po-mobile-lesson-demo .po-avatar{flex-basis:44px}.po-mobile-lesson-demo .po-avatar img{width:42px;height:42px}
  .po-mobile-careers{background:var(--po-paper);color:var(--po-ink)}.po-mobile-careers .po-mobile-copy{color:var(--po-copy)}.po-mobile-career-card{margin-top:22px;min-height:420px;position:relative;overflow:hidden;background:#20262d}.po-mobile-career-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.po-mobile-career-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,18,22,.96),rgba(15,18,22,.1) 70%)}.po-mobile-career-content{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:20px;color:#fff}.po-mobile-career-content small{color:var(--po-gold-2);font-size:8px;font-weight:950}.po-mobile-career-content h3{margin:7px 0 5px;font-size:29px}.po-mobile-career-content p{margin:0;color:#d4d9dd;font-size:11px;line-height:1.6}
  .po-mobile-news{background:#071522;color:#fff}.po-mobile-news .po-mobile-copy{color:#b9c5d2}.po-mobile-news-list{display:grid;gap:8px;margin-top:22px}.po-mobile-news-item{padding:15px;border:1px solid rgba(255,255,255,.16);background:#0c2032;color:#fff!important}.po-mobile-news-item small{display:block;color:var(--po-gold-2);font-size:7px;font-weight:950;letter-spacing:.1em}.po-mobile-news-item strong{display:block;margin:5px 0;font-size:15px;line-height:1.4}.po-mobile-news-item span{color:#aebbc6;font-size:9px}
  .po-mobile-about{background:var(--po-paper);color:var(--po-ink)}.po-mobile-about .po-mobile-copy{color:var(--po-copy)}
  .po-explore-card{top:58px;left:10px;right:10px;width:auto;padding:20px}.po-explore-grid{grid-template-columns:1fr 1fr}.po-explore-card h2{font-size:23px}
}

@media(min-width:901px) and (max-width:1280px){
  .po-scene-inner{padding-right:316px;}
  .po-scene-nav button{width:41px;font-size:10px;}
  .po-route-grid{grid-template-columns:repeat(3,minmax(0,1fr));overflow:auto;align-content:start}.po-route{min-height:250px}.po-course-link{padding:6px 2px}.po-guide-card span{display:none}.po-chat-bubble{font-size:13px}.po-news-bento{grid-template-columns:1fr 1fr}.po-news-tile.feature{grid-row:auto;grid-column:1/3}.po-news-bento{grid-template-rows:auto}.po-career-grid{grid-template-columns:repeat(2,minmax(0,1fr));overflow:auto}.po-career-card{min-height:300px}
}
@media(min-width:901px) and (max-height:760px){
  .po-scene-inner{padding-top:76px;padding-bottom:14px}.po-head-grid{margin-bottom:12px}.po-start-main{padding-top:18px}.po-chat{gap:10px;margin-top:12px}.po-guide-strip{margin-top:12px}.po-route h3{margin-top:9px}.po-route-details{gap:4px}.po-course-link{padding:5px 2px}.po-lesson-main{padding-top:18px;padding-bottom:18px}
}
@media(prefers-reduced-motion:reduce){.po-scene,.po-guide-card,.po-head-btn{transition:none!important}}


/* =========================================================
V2 / CENTERED DESKTOP LAYOUT
START HERE = lesson-like left guide + centered conversation
Right side = persistent site scene navigation
========================================================= */
@media(min-width:901px){
  /* Keep left guide and right global navigation visually balanced. */
  .po-scene-inner{
    padding-left:clamp(22px,1.7vw,34px);
    padding-right:clamp(300px,17.4vw,340px);
  }

  .po-scene-nav{
    top:50%;
    right:22px;
    transform:translateY(-50%);
    align-items:stretch;
  }
  .po-scene-nav button{
    width:clamp(40px,2.4vw,48px);
    min-height:clamp(158px,17vh,184px);
    color:var(--po-ink)!important;
  }
  .po-scene-nav button:hover,
  .po-scene-nav button.is-active{
    background:var(--po-dark)!important;
    color:#fff!important;
  }

  /* START HERE: mimic the real lesson-page composition. */
  .po-start-layout{
    grid-template-columns:clamp(275px,16.2vw,320px) minmax(0,1fr);
    background:var(--po-paper);
    border-color:#c8c2b8;
  }
  .po-start-sidebar{
    padding:22px 16px 18px;
    background:#181d22!important;
    border-right:1px solid #2d343b;
  }
  .po-start-sidebar .po-eyebrow,
  .po-start-sidebar h2,
  .po-start-sidebar>p,
  .po-start-sidebar-foot,
  .po-start-sidebar *{
    color:#fff;
  }
  .po-start-sidebar .po-eyebrow{color:var(--po-gold-2)!important;}
  .po-start-sidebar>p{color:#b8c0c7!important;}
  .po-start-sidebar-foot{color:#98a2aa!important;}

  .po-start-progress-label{
    display:flex;
    justify-content:space-between;
    gap:12px;
    margin:3px 0 8px;
    color:#c9d0d5!important;
    font-size:9px;
    font-weight:900;
    letter-spacing:.08em;
  }
  .po-start-progress{
    height:5px;
    margin-bottom:18px;
    overflow:hidden;
    border-radius:999px;
    background:#f1f1ef;
  }
  .po-start-progress span{
    display:block;
    width:25%;
    height:100%;
    background:var(--po-green);
  }
  .po-start-menu-label{
    margin:0 0 8px;
    color:#8f9aa3!important;
    font-size:8px;
    font-weight:950;
    letter-spacing:.13em;
  }
  .po-journey-steps{gap:4px;margin-top:0;}
  .po-journey-step,
  .po-journey-step:focus,
  .po-journey-step:active{
    -webkit-appearance:none!important;
    appearance:none!important;
    width:100%;
    min-height:60px;
    padding:10px 10px!important;
    border:0!important;
    border-left:3px solid transparent!important;
    border-radius:5px!important;
    outline:none!important;
    box-shadow:none!important;
    background:transparent!important;
    color:#fff!important;
  }
  .po-journey-step:hover{
    background:#2a3036!important;
    color:#fff!important;
  }
  .po-journey-step.is-current{
    background:#343a40!important;
    border-left-color:var(--po-gold-2)!important;
  }
  .po-journey-step span{
    color:#eef2f4!important;
    border-color:#5c656d!important;
    background:#14191e!important;
  }
  .po-journey-step strong{
    color:#fff!important;
    font-size:13px;
  }
  .po-journey-step small{
    color:#b9c2c9!important;
    font-size:9px;
  }

  /* The reading/conversation column sits in the visual center. */
  .po-start-main{
    padding:clamp(26px,2.3vw,42px) clamp(28px,3.2vw,62px) 24px;
  }
  .po-start-head,
  .po-start-main>.po-chat,
  .po-start-main>.po-guide-strip{
    width:min(100%,980px);
    margin-left:auto;
    margin-right:auto;
  }
  .po-start-head{
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);
    gap:34px;
  }
  .po-start-main>.po-chat{margin-top:24px;}
  .po-chat-bubble{
    max-width:min(82%,760px);
    font-size:clamp(14px,.92vw,17px);
    line-height:1.8;
  }
  .po-guide-strip{
    gap:9px;
    margin-top:22px!important;
  }
  .po-guide-card,
  .po-guide-card:focus,
  .po-guide-card:active{
    -webkit-appearance:none!important;
    appearance:none!important;
    border:1px solid #bdb7ac!important;
    border-radius:3px!important;
    outline:none!important;
    box-shadow:none!important;
    background:#faf9f5!important;
    color:var(--po-ink)!important;
  }
  .po-guide-card:hover{
    background:#eee9df!important;
    border-color:#81786a!important;
    color:var(--po-ink)!important;
  }
  .po-guide-card strong{color:var(--po-ink)!important;}
  .po-guide-card span{color:var(--po-copy)!important;}
  .po-guide-card small{color:var(--po-gold)!important;}

  /* Lesson preview: center the actual article like the real TutorLMS page. */
  .po-lesson-shell{
    grid-template-columns:clamp(270px,16vw,320px) minmax(0,1fr);
  }
  .po-lesson-main{
    padding:clamp(26px,2.4vw,44px) clamp(32px,4.2vw,84px);
  }
  .po-lesson-main>*{
    width:min(100%,960px);
    margin-left:auto;
    margin-right:auto;
  }
  .po-lesson-main>.po-chat{margin-top:20px;}

  /* Give the site navigation its own visual gutter instead of overlapping content. */
  .po-scene[data-panel="start"] .po-scene-inner,
  .po-scene[data-panel="lesson"] .po-scene-inner{
    padding-right:clamp(305px,17.6vw,350px);
  }
}

@media(min-width:901px) and (max-width:1320px){
  .po-scene-inner{padding-right:292px;}
  .po-scene[data-panel="start"] .po-scene-inner,
  .po-scene[data-panel="lesson"] .po-scene-inner{padding-right:300px;}
  .po-start-layout{grid-template-columns:260px minmax(0,1fr);}
  .po-start-head{grid-template-columns:1fr;gap:10px;align-items:start;}
  .po-start-head p{max-width:720px;}
  .po-guide-card span{display:none;}
  .po-scene-nav{right:12px;}
  .po-scene-nav button{width:40px;font-size:10px;}
}



/* =========================================================
V3 / UNIFIED LEFT NAVIGATION
PC: lesson-style global navigation beside the centered content
========================================================= */
@media(min-width:901px){
  :root{
    --po-shell-max:1640px;
    --po-shell-gap:22px;
    --po-left-nav:292px;
    --po-shell-gutter:max(28px, calc((100vw - var(--po-shell-max)) / 2));
  }

  /* Align both header edges to the exact content grid. */
  .po-logo{
    left:var(--po-shell-gutter)!important;
  }

  .po-actions{
    right:var(--po-shell-gutter)!important;
  }

  /* The old right-side vertical navigation is no longer used. */
  .po-scene-nav{display:none!important;}

  /* Global left menu sits next to the content, not at the viewport edge. */
  .po-global-left{
    position:fixed;
    z-index:860;
    top:86px;
    bottom:24px;
    left:var(--po-shell-gutter);
    width:var(--po-left-nav);
    display:flex;
    flex-direction:column;
    min-height:0;
    padding:22px 18px 16px;
    border:1px solid #2b3138;
    background:var(--po-dark);
    color:#fff;
    box-shadow:0 18px 44px rgba(15,18,22,.08);
  }
  .po-global-left .po-eyebrow{color:var(--po-gold-2);margin-bottom:8px;}
  .po-global-left-head h2{margin:0;font-size:26px;line-height:1.12;letter-spacing:-.035em;color:#fff;}
  .po-global-left-head>p:last-child{margin:10px 0 17px;color:#aeb6bd;font-size:11px;line-height:1.65;}
  .po-global-left-list{display:grid;gap:5px;min-height:0;overflow:auto;padding-right:2px;}
  .po-global-item,
  .po-global-item:focus,
  .po-global-item:active{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:10px;
    width:100%;
    padding:10px 9px;
    align-items:start;
    border:1px solid rgba(255,255,255,.10)!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left;
    box-shadow:none!important;
    cursor:pointer;
    transition:background .18s ease,border-color .18s ease,transform .18s ease;
  }
  .po-global-item:hover{background:#242a31!important;border-color:rgba(255,255,255,.18)!important;transform:translateX(2px);}
  .po-global-item.is-active{background:#353b42!important;border-color:#4a5159!important;box-shadow:inset 3px 0 0 var(--po-gold)!important;}
  .po-global-item>span{display:grid;width:30px;height:30px;place-items:center;border:1px solid rgba(255,255,255,.24);color:var(--po-gold-2)!important;font-size:8px;font-weight:950;}
  .po-global-item strong{display:block;margin:1px 0 3px;color:#fff!important;font-size:12px;font-weight:900;line-height:1.35;}
  .po-global-item small{display:block;color:#9fa8b0!important;font-size:8px;line-height:1.45;}
  .po-global-left-foot{margin-top:auto;padding-top:13px;border-top:1px solid rgba(255,255,255,.12);color:#7f8992;font-size:8px;line-height:1.55;letter-spacing:.03em;}

  /* Every scene now uses one shared centered workspace. */
  .po-scene-inner{
    padding-top:86px!important;
    padding-bottom:24px!important;
    padding-left:calc(var(--po-shell-gutter) + var(--po-left-nav) + var(--po-shell-gap))!important;
    padding-right:var(--po-shell-gutter)!important;
  }
  .po-scene-canvas{max-width:1320px;margin:0 auto;width:100%;}

  /* START HERE no longer has its own duplicate sidebar. */
  .po-start-layout{display:block!important;height:100%;border:1px solid var(--po-line);background:var(--po-paper);}
  .po-start-sidebar{display:none!important;}
  .po-start-main{height:100%;max-width:none!important;margin:0!important;padding:clamp(24px,2.2vw,38px) clamp(30px,3vw,54px) 24px!important;overflow:auto;}
  .po-start-head{max-width:1120px;margin:0 auto;}
  .po-start-main>.po-chat{max-width:1060px;margin-left:auto!important;margin-right:auto!important;}
  .po-guide-strip{max-width:1120px;margin-left:auto!important;margin-right:auto!important;}

  /* The lesson preview may keep its own local curriculum column. */
  .po-lesson-shell{max-width:1320px;margin:0 auto;}
}

@media(min-width:901px) and (max-width:1280px){
  :root{--po-left-nav:248px;--po-shell-gap:14px;--po-shell-gutter:18px;}
  .po-global-left{top:78px;bottom:14px;padding:16px 12px 12px;}
  .po-global-left-head h2{font-size:21px;}
  .po-global-left-head>p:last-child{display:none;}
  .po-global-item{grid-template-columns:30px minmax(0,1fr);padding:8px 7px;}
  .po-global-item>span{width:26px;height:26px;}
  .po-global-item strong{font-size:10px;}
  .po-global-item small{font-size:7px;}
  .po-scene-inner{padding-top:78px!important;padding-bottom:14px!important;}
}

@media(max-width:900px){
  .po-global-left{display:none!important;}
}


/* =========================================================
V55 / EXACT COURSE-PLAYER SHELL MATCH
TOP PAGE DESKTOP FRAME = LESSON PLAYER FRAME
- same outer gutter
- same 86px / 24px vertical frame
- same 330px desktop sidebar
- same 292px sidebar <= 1280px
- zero gap between sidebar and content
========================================================= */
@media(min-width:901px){

  :root{
    --po-shell-max:1640px!important;
    --po-shell-gap:0px!important;
    --po-left-nav:330px!important;
    --po-shell-gutter:max(28px, calc((100vw - var(--po-shell-max)) / 2))!important;
  }

  /* Header aligns to the exact same outer frame edges as the Lesson Player. */
  .po-logo{
    left:var(--po-shell-gutter)!important;
  }

  .po-actions{
    right:var(--po-shell-gutter)!important;
  }

  /* One visual outer frame, matching .po-course-player. */
  .po-desktop:before{
    content:"";
    position:fixed;
    z-index:859;
    top:86px;
    bottom:24px;
    left:var(--po-shell-gutter);
    right:var(--po-shell-gutter);
    border:1px solid var(--po-line);
    background:transparent;
    box-shadow:0 18px 44px rgba(15,18,22,.06);
    pointer-events:none;
  }

  /* Sidebar occupies exactly the Lesson Player curriculum column. */
  .po-global-left{
    z-index:860!important;
    top:86px!important;
    bottom:24px!important;
    left:var(--po-shell-gutter)!important;
    width:var(--po-left-nav)!important;
    margin:0!important;
    border:0!important;
    border-right:1px solid #30363d!important;
    border-radius:0!important;
    box-shadow:none!important;
  }

  /* Main pane begins on the exact pixel where the sidebar ends. */
  .po-scene-inner{
    height:100%!important;
    padding-top:86px!important;
    padding-bottom:24px!important;
    padding-left:calc(var(--po-shell-gutter) + var(--po-left-nav))!important;
    padding-right:var(--po-shell-gutter)!important;
  }

  /* Remove the old centered 1320px workspace offset.
     The right pane now fills the same shell as Lesson Player. */
  .po-scene-canvas{
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    overflow:hidden!important;
  }

  /* The shared outer frame now owns the border.
     Avoid a duplicate border at the sidebar/content seam. */
  .po-start-layout,
  .po-catalog-shell,
  .po-resources-shell,
  .po-auth-shell{
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }

  /* START / guided pages are the right pane itself. */
  .po-start-layout,
  .po-guided-start-layout{
    display:block!important;
  }

  .po-start-main,
  .po-guided-start-main{
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    margin:0!important;
  }

  /* Career / News / About scenes also occupy the exact right-pane width. */
  .po-career-grid,
  .po-news-feed,
  .po-about-grid{
    width:100%!important;
    max-width:none!important;
  }
}

/* Lesson Player changes only the curriculum width at <=1280px.
   Keep the same top/bottom coordinates and remove the old 78px/14px rule. */
@media(min-width:901px) and (max-width:1280px){

  :root{
    --po-left-nav:292px!important;
    --po-shell-gap:0px!important;
    --po-shell-gutter:18px!important;
  }

  .po-desktop:before,
  .po-global-left{
    top:86px!important;
    bottom:24px!important;
  }

  .po-scene-inner{
    padding-top:86px!important;
    padding-bottom:24px!important;
    padding-left:calc(var(--po-shell-gutter) + var(--po-left-nav))!important;
    padding-right:var(--po-shell-gutter)!important;
  }
}



/* =========================================================
V56 / HEADER CENTER PIXEL FIX
The top page has a typewriter caret while Lesson Player does not.
Cancel the caret's layout width so the phrase itself is centered
on the exact same x-coordinate as the Lesson Player header.
========================================================= */
@media(min-width:901px){
  .po-typing-caret{
    margin-left:6px!important;
    margin-right:-7px!important; /* 1px caret + 6px left margin = net 0px */
  }
}



/* =========================================================
V57 / FAA COURSE HUB DEEP LINKS
FAA COURSES opens the dedicated fixed page.
Individual FAA course links open that same page with the
corresponding left-menu course preselected via URL hash.
========================================================= */
@media(min-width:901px){
  a.po-global-catalog-item{
    text-decoration:none!important;
  }
}


/* =========================================================
V62 / EXPANDABLE FAA COURSE MENU
FAA opens inside the left navigation and keeps the first click
inside the top-page scene system.
========================================================= */
@media(min-width:901px){
  .po-global-catalog-group{
    display:block;
    width:100%;
  }

  .po-global-catalog-toggle{
    grid-template-columns:48px minmax(0,1fr) 18px!important;
  }

  .po-global-catalog-chevron{
    display:grid;
    width:18px;
    height:18px;
    place-items:center;
    color:#aeb5bc;
    font-size:14px;
    font-weight:500;
    line-height:1;
    transition:transform .2s ease,color .2s ease;
  }

  .po-global-catalog-group.is-open .po-global-catalog-chevron{
    transform:rotate(180deg);
    color:var(--po-gold-2);
  }

  .po-global-course-submenu{
    max-height:0;
    margin:0 0 0 18px;
    padding:0 0 0 10px;
    overflow:hidden;
    border-left:1px solid transparent;
    opacity:0;
    visibility:hidden;
    transition:max-height .3s ease,opacity .2s ease,padding .3s ease,border-color .2s ease,visibility .2s ease;
  }

  .po-global-catalog-group.is-open .po-global-course-submenu{
    max-height:540px;
    padding-top:6px;
    padding-bottom:6px;
    border-left-color:rgba(211,171,98,.52);
    opacity:1;
    visibility:visible;
  }

  .po-global-course-submenu a,
  .po-global-course-submenu button{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:34px minmax(0,1fr) 14px;
    gap:8px;
    width:100%;
    align-items:center;
    min-height:34px;
    padding:5px 8px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:transparent;
    color:#dfe3e6!important;
    text-align:left;
    cursor:pointer;
    transition:background .16s ease,color .16s ease,transform .16s ease;
  }

  .po-global-course-submenu a:last-child,
  .po-global-course-submenu button:last-child{
    border-bottom:0;
  }

  .po-global-course-submenu a:hover,
  .po-global-course-submenu button:hover,
  .po-global-course-submenu button.is-active{
    transform:translateX(2px);
    background:rgba(255,255,255,.065);
    color:#fff!important;
  }

  .po-global-course-submenu button.is-active{
    box-shadow:inset 2px 0 0 var(--po-gold-2);
  }

  .po-global-course-submenu small{
    color:var(--po-gold-2);
    font-size:7px;
    font-weight:950;
    letter-spacing:.04em;
  }

  .po-global-course-submenu strong{
    min-width:0;
    overflow:hidden;
    font-size:10px;
    font-weight:800;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .po-global-course-submenu b{
    color:#7f8992;
    font-size:10px;
    font-weight:500;
    text-align:right;
  }
}

@media(min-width:901px) and (max-width:1320px){
  .po-global-catalog-toggle{
    grid-template-columns:42px minmax(0,1fr) 16px!important;
  }

  .po-global-course-submenu{
    margin-left:12px;
    padding-left:8px;
  }
}


/* =========================================================
V63 / INLINE FAA PPL REGISTRATION
PPL opens as a right-side workspace scene without leaving HOME.
========================================================= */
@media(min-width:901px){
  .po-scene[data-panel="faa-detail"] .po-scene-inner{
    padding-bottom:24px!important;
  }

  .po-scene[data-panel="faa-detail"] .po-scene-canvas{
    overflow:hidden;
    border:1px solid var(--po-line);
    background:var(--po-paper);
  }

  .po-inline-ppl{
    height:100%;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:#aaa59b transparent;
  }

  .po-inline-ppl-inner{
    width:min(100%,1180px);
    margin:0 auto;
    padding:clamp(28px,3vw,50px) clamp(28px,4vw,64px) 54px;
  }

  .po-inline-ppl-top{
    display:grid;
    grid-template-columns:minmax(0,1.02fr) minmax(390px,.92fr);
    gap:clamp(28px,4vw,64px);
    align-items:start;
  }

  .po-inline-ppl-kicker,
  .po-inline-ppl-label{
    margin:0;
    color:var(--po-gold);
    font-size:10px;
    font-weight:950;
    letter-spacing:.18em;
  }

  .po-inline-ppl-title{
    margin:22px 0 18px;
    color:var(--po-ink);
    font-size:clamp(52px,5vw,84px);
    font-weight:950;
    line-height:.9;
    letter-spacing:-.06em;
  }

  .po-inline-ppl-lead{
    max-width:640px;
    margin:0;
    color:var(--po-copy);
    font-size:15px;
    line-height:2;
  }

  .po-inline-ppl-overview{
    margin-top:28px;
    border-top:1px solid var(--po-line);
  }

  .po-inline-ppl-overview>div{
    display:grid;
    grid-template-columns:90px 150px minmax(0,1fr);
    gap:18px;
    align-items:center;
    min-height:66px;
    border-bottom:1px solid var(--po-line);
  }

  .po-inline-ppl-overview small,
  .po-inline-ppl-enroll small,
  .po-inline-ppl-curriculum-head small{
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
    letter-spacing:.14em;
  }

  .po-inline-ppl-overview strong{
    color:var(--po-ink);
    font-size:15px;
    font-weight:950;
  }

  .po-inline-ppl-overview span{
    color:var(--po-copy);
    font-size:11px;
  }

  .po-inline-ppl-enroll{
    border:1px solid #aaa49a;
    border-top:6px solid var(--po-gold);
    background:var(--po-card);
    box-shadow:0 20px 45px rgba(23,27,32,.07);
    padding:34px 34px 30px;
  }

  .po-inline-ppl-enroll h2{
    margin:25px 0 12px;
    color:var(--po-ink);
    font-size:clamp(35px,3vw,52px);
    line-height:1.05;
    letter-spacing:-.045em;
  }

  .po-inline-ppl-enroll>p{
    margin:0 0 26px;
    color:var(--po-copy);
    font-size:13px;
    line-height:1.9;
  }

  .po-inline-ppl-meta{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-top:1px solid var(--po-line);
    border-bottom:1px solid var(--po-line);
    padding:14px 0;
  }

  .po-inline-ppl-meta>div{
    min-width:0;
    padding:0 12px;
    border-right:1px solid var(--po-line);
  }

  .po-inline-ppl-meta>div:first-child{padding-left:0;}
  .po-inline-ppl-meta>div:last-child{border-right:0;padding-right:0;}
  .po-inline-ppl-meta small{display:block;margin-bottom:6px;font-size:7px;}
  .po-inline-ppl-meta strong{display:block;font-size:12px;white-space:nowrap;}

  .po-inline-ppl-preview{
    display:block;
    margin:18px 0 8px;
    color:#6c6f72;
    font-size:8px;
    font-weight:950;
    letter-spacing:.12em;
  }

  .po-inline-ppl-start{
    display:flex;
    justify-content:space-between;
    align-items:center;
    min-height:68px;
    padding:0 24px;
    background:var(--po-dark);
    color:#fff!important;
    font-size:13px;
    font-weight:950;
    letter-spacing:.08em;
    transition:background .18s ease,transform .18s ease;
  }

  .po-inline-ppl-start:hover{background:#242b32;transform:translateY(-1px);}

  .po-inline-ppl-buy-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-top:8px;
  }

  .po-inline-ppl-buy{
    display:flex;
    min-height:132px;
    padding:18px 16px;
    flex-direction:column;
    border:1px solid var(--po-line);
    background:#fbfaf7;
    color:var(--po-ink)!important;
  }

  .po-inline-ppl-buy.is-featured{background:#f1ecdf;border-color:#cbb98e;}
  .po-inline-ppl-buy strong{display:block;margin-top:9px;font-size:17px;line-height:1.35;}
  .po-inline-ppl-buy span{margin-top:auto;color:#74787c;font-size:8px;font-weight:900;letter-spacing:.06em;}
  .po-inline-ppl-buy.is-disabled{opacity:.48;pointer-events:none;}

  .po-inline-ppl-conversation{
    display:grid;
    gap:12px;
    margin-top:42px;
    padding:24px 0 32px;
    border-top:1px solid var(--po-line);
    border-bottom:1px solid var(--po-line);
  }

  .po-inline-ppl-chat{
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:14px;
    align-items:center;
  }

  .po-inline-ppl-chat.is-captain{grid-template-columns:minmax(0,1fr) 54px;}
  .po-inline-ppl-chat.is-captain .po-inline-ppl-avatar{grid-column:2;}
  .po-inline-ppl-chat.is-captain p{grid-column:1;grid-row:1;background:var(--po-cream);}

  .po-inline-ppl-avatar img{
    display:block;
    width:48px;
    height:48px;
    border-radius:50%;
    object-fit:cover;
  }

  .po-inline-ppl-avatar small{
    display:block;
    margin-top:3px;
    color:#74787c;
    font-size:7px;
    text-align:center;
  }

  .po-inline-ppl-chat p{
    margin:0;
    padding:17px 20px;
    border-radius:9px;
    background:var(--po-soft);
    color:var(--po-ink);
    font-size:14px;
    line-height:1.75;
  }

  .po-inline-ppl-curriculum{margin-top:36px;}
  .po-inline-ppl-curriculum-head{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:18px;}
  .po-inline-ppl-curriculum-head h2{margin:8px 0 0;font-size:30px;letter-spacing:-.035em;}
  .po-inline-ppl-curriculum-head>span{color:#73777b;font-size:9px;font-weight:900;letter-spacing:.08em;}
  .po-inline-ppl-curriculum-list{display:grid;gap:8px;}

  .po-inline-ppl-section{
    border:1px solid var(--po-line);
    background:var(--po-card);
  }

  .po-inline-ppl-section summary{
    display:grid;
    grid-template-columns:42px minmax(0,1fr) auto 18px;
    gap:12px;
    align-items:center;
    min-height:58px;
    padding:0 16px;
    list-style:none;
    cursor:pointer;
  }

  .po-inline-ppl-section summary::-webkit-details-marker{display:none;}
  .po-inline-ppl-section summary>span:first-child{color:var(--po-gold);font-size:10px;font-weight:950;}
  .po-inline-ppl-section summary strong{font-size:13px;}
  .po-inline-ppl-section summary small{color:#7c8084;font-size:8px;}
  .po-inline-ppl-section summary b:before{content:"+";font-size:16px;font-weight:500;}
  .po-inline-ppl-section[open] summary b:before{content:"−";}
  .po-inline-ppl-lessons{border-top:1px solid var(--po-line);padding:0 16px;}
  .po-inline-ppl-lesson{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:12px;align-items:center;min-height:44px;border-bottom:1px solid #dedad1;font-size:11px;}
  .po-inline-ppl-lesson:last-child{border-bottom:0;}
  .po-inline-ppl-lesson>span:first-child{color:var(--po-gold);font-size:8px;font-weight:900;}
  .po-inline-ppl-lesson em{color:#7b7f83;font-size:7px;font-style:normal;font-weight:800;letter-spacing:.06em;}
  .po-inline-ppl-status{padding:22px;border:1px solid var(--po-line);background:var(--po-card);color:var(--po-copy);font-size:12px;line-height:1.7;}
}

@media(min-width:901px) and (max-width:1180px){
  .po-inline-ppl-top{grid-template-columns:1fr;}
  .po-inline-ppl-enroll{max-width:none;}
}


/* =========================================================
V64 / QUIET SIDEBAR SCROLLBAR
Keep the menu scrollbar slim and integrated with the dark nav.
========================================================= */
@media(min-width:901px){
  .po-global-left-list{
    padding-right:8px!important;
    scrollbar-width:thin;
    scrollbar-color:#646b72 rgba(255,255,255,.035);
  }

  .po-global-left-list::-webkit-scrollbar{
    width:5px;
  }

  .po-global-left-list::-webkit-scrollbar-track{
    margin:2px 0;
    border-radius:999px;
    background:rgba(255,255,255,.035);
  }

  .po-global-left-list::-webkit-scrollbar-thumb{
    min-height:54px;
    border-radius:999px;
    background:#646b72;
  }

  .po-global-left-list::-webkit-scrollbar-thumb:hover{
    background:var(--po-gold-2);
  }

  .po-global-left-list::-webkit-scrollbar-button{
    display:none;
    width:0;
    height:0;
  }
}


/* =========================================================
V65 / FAA CONVERSATION GUIDE
FAA parent view explains the system; course selection stays left.
========================================================= */
@media(min-width:901px){
  .po-faa-overview{
    display:none;
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    padding:22px clamp(10px,2.2vw,34px) 30px;
    scrollbar-width:thin;
    scrollbar-color:#aaa59b transparent;
  }

  .po-catalog-shell.is-faa-intro .po-catalog-guide,
  .po-catalog-shell.is-faa-intro .po-catalog-grid{
    display:none!important;
  }

  .po-catalog-shell.is-faa-intro .po-faa-overview{
    display:block;
  }

  .po-faa-dialogue-group{
    width:min(100%,1050px);
    margin:0 auto;
    padding:22px 0;
    border-bottom:1px solid var(--po-line);
  }

  .po-faa-dialogue-group:first-child{padding-top:4px;}
  .po-faa-dialogue-group:last-of-type{border-bottom:0;}

  .po-faa-dialogue-row{
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    gap:16px;
    align-items:center;
  }

  .po-faa-dialogue-row+.po-faa-dialogue-row{
    margin-top:12px;
  }

  .po-faa-dialogue-row.is-captain{
    grid-template-columns:minmax(0,1fr) 62px;
  }

  .po-faa-dialogue-row.is-captain .po-faa-overview-avatar{
    grid-column:2;
    grid-row:1;
  }

  .po-faa-dialogue-row.is-captain .po-faa-overview-bubble{
    grid-column:1;
    grid-row:1;
    background:var(--po-cream);
    border-color:#d8c7a8;
  }

  .po-faa-overview-avatar{
    text-align:center;
  }

  .po-faa-overview-avatar img{
    display:block;
    width:54px;
    height:54px;
    margin:0 auto 4px;
    border-radius:50%;
    object-fit:cover;
  }

  .po-faa-overview-avatar small{
    display:block;
    color:#7e7971;
    font-size:7px;
    font-weight:900;
    white-space:nowrap;
  }

  .po-faa-overview-bubble{
    position:relative;
    margin:0;
    padding:15px 18px;
    border:1px solid #d4d0c8;
    border-radius:8px;
    background:var(--po-soft);
    color:var(--po-ink);
    font-size:14px;
    line-height:1.75;
  }

  .po-faa-overview-bubble strong{font-weight:950;}

  .po-faa-license-guide{
    width:calc(100% - 78px);
    margin:14px 78px 2px 0;
    border-top:1px solid #bdb7ad;
    border-bottom:1px solid #bdb7ad;
  }

  .po-faa-license-line{
    display:grid;
    grid-template-columns:128px minmax(0,1fr);
    gap:20px;
    align-items:center;
    min-height:54px;
    padding:8px 2px;
    border-bottom:1px solid #d9d4ca;
  }

  .po-faa-license-line:last-child{border-bottom:0;}

  .po-faa-license-line>small{
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
    letter-spacing:.13em;
  }

  .po-faa-license-line>div{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    align-items:center;
  }

  .po-faa-license-line span{
    color:#252a2f;
    font-size:12px;
    font-weight:900;
  }

  .po-faa-license-line b{
    color:var(--po-gold);
    font-size:10px;
    font-weight:700;
  }

  .po-faa-license-line em{
    color:#74787c;
    font-size:10px;
    font-style:normal;
  }

  .po-faa-audience-list{
    width:calc(100% - 78px);
    margin:14px 78px 2px 0;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    border-top:1px solid #c7c1b7;
  }

  .po-faa-audience-list div{
    position:relative;
    padding:13px 12px 13px 27px;
    border-bottom:1px solid #d9d4ca;
    color:#4f5459;
    font-size:11px;
    line-height:1.55;
  }

  .po-faa-audience-list div:before{
    content:"";
    position:absolute;
    left:8px;
    top:19px;
    width:8px;
    height:2px;
    background:var(--po-gold);
  }

  .po-faa-audience-list div:nth-child(odd){border-right:1px solid #d9d4ca;}

  .po-faa-left-guide{
    width:min(100%,1050px);
    margin:12px auto 0;
    padding:13px 16px;
    border-left:3px solid var(--po-gold);
    background:#ece8df;
    color:#454a4f;
    font-size:11px;
    line-height:1.7;
  }

  .po-faa-left-guide strong{color:var(--po-ink);font-weight:950;}

  .po-faa-overview::-webkit-scrollbar{width:5px;}
  .po-faa-overview::-webkit-scrollbar-track{background:transparent;}
  .po-faa-overview::-webkit-scrollbar-thumb{border-radius:999px;background:#aaa59b;}
}

@media(min-width:901px) and (max-height:820px){
  .po-faa-overview{padding-top:10px;padding-bottom:18px;}
  .po-faa-dialogue-group{padding:14px 0;}
  .po-faa-overview-avatar img{width:46px;height:46px;}
  .po-faa-overview-bubble{padding:11px 14px;font-size:12px;line-height:1.65;}
  .po-faa-license-line{min-height:44px;}
  .po-faa-audience-list div{padding-top:9px;padding-bottom:9px;}
  .po-faa-audience-list div:before{top:15px;}
}


/* =========================================================
V66 / READABLE EXPANDED COURSE MENU
Give the nested FAA courses the same visual importance as nav.
========================================================= */
@media(min-width:901px){
  .po-global-catalog-group.is-open .po-global-course-submenu{
    max-height:620px;
    padding-top:8px;
    padding-bottom:8px;
  }

  .po-global-course-submenu a,
  .po-global-course-submenu button{
    grid-template-columns:38px minmax(0,1fr) 16px;
    gap:9px;
    min-height:42px;
    padding:7px 9px;
    border-bottom-color:rgba(255,255,255,.09);
  }

  .po-global-course-submenu small{
    font-size:8px;
    letter-spacing:.055em;
  }

  .po-global-course-submenu strong{
    font-size:11.5px;
    line-height:1.35;
  }

  .po-global-course-submenu b{
    font-size:11px;
  }
}


/* =========================================================
V69 / ALL COURSE LIBRARIES USE THE SAME EXPANDABLE SUBMENU
JCAB / TCCA / AIRBUS / BOEING / ICAO now share the FAA pattern.
Only one library stays expanded at a time.
========================================================= */

/* =========================================================
V68 / LARGER FAA SUBMENU + LOCKED ENROLL PANEL RHYTHM
- Expanded FAA course items are one more step larger.
- Enrollment title always owns exactly two lines of space.
- Enrollment copy owns exactly three lines of space.
  This keeps every control below them on the same Y-position.
========================================================= */
@media(min-width:901px){
  .po-global-catalog-group.is-open .po-global-course-submenu{
    max-height:760px;
    padding-top:9px;
    padding-bottom:9px;
  }

  .po-global-course-submenu a,
  .po-global-course-submenu button{
    grid-template-columns:42px minmax(0,1fr) 18px;
    gap:11px;
    min-height:50px;
    padding:9px 11px;
  }

  .po-global-course-submenu small{
    font-size:9.5px;
    letter-spacing:.055em;
  }

  .po-global-course-submenu strong{
    font-size:13.5px;
    line-height:1.35;
  }

  .po-global-course-submenu b{
    font-size:13px;
  }

  .po-inline-ppl-enroll h2{
    height:2.1em;
    min-height:2.1em;
    display:flex;
    align-items:center;
    overflow:hidden;
  }

  .po-inline-ppl-enroll>p{
    height:5.7em;
    min-height:5.7em;
    overflow:hidden;
  }
}

/* =========================================================
V72 / COURSE LIBRARY TOGGLE BOX STYLE
Keep the original V69 sidebar design. Only replace the category
chevron at the far right with a boxed + / − control that matches
the boxed style used elsewhere in the sidebar.
========================================================= */
@media(min-width:901px){
  .po-global-catalog-toggle{
    grid-template-columns:48px minmax(0,1fr) 26px!important;
  }
  .po-global-catalog-chevron{
    display:grid!important;
    width:24px!important;
    min-width:24px!important;
    height:24px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.18)!important;
    background:rgba(255,255,255,.03)!important;
    transform:none!important;
    font-size:0!important;
    color:#d8dde1!important;
    line-height:1!important;
  }
  .po-global-catalog-chevron:before{
    content:"+";
    display:block;
    font-size:17px;
    font-weight:400;
    line-height:1;
  }
  .po-global-catalog-group.is-open .po-global-catalog-chevron{
    transform:none!important;
    color:var(--po-gold-2)!important;
    border-color:rgba(211,171,98,.34)!important;
    background:rgba(211,171,98,.08)!important;
  }
  .po-global-catalog-group.is-open .po-global-catalog-chevron:before{
    content:"−";
  }
}

@media(min-width:901px) and (max-width:1320px){
  .po-global-catalog-toggle{
    grid-template-columns:42px minmax(0,1fr) 24px!important;
  }
  .po-global-catalog-chevron{
    width:22px!important;
    min-width:22px!important;
    height:22px!important;
  }
}



/* =========================================================
V73 / COURSE LIBRARY ROWS MATCH GUIDE
Make every COURSE LIBRARY category row use the same full-width
boxed treatment as the GUIDE rows while preserving the +/- box.
========================================================= */
@media(min-width:901px){
  .po-global-catalog-group{
    width:100%!important;
  }

  .po-global-catalog-toggle,
  .po-global-catalog-toggle:focus,
  .po-global-catalog-toggle:active{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr) 26px!important;
    gap:10px!important;
    width:100%!important;
    min-height:52px!important;
    margin:0!important;
    padding:9px 9px!important;
    align-items:center!important;
    border:1px solid rgba(255,255,255,.10)!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    box-shadow:none!important;
    cursor:pointer!important;
    transition:background .18s ease,border-color .18s ease,transform .18s ease!important;
  }

  .po-global-catalog-toggle:hover{
    background:#242a31!important;
    border-color:rgba(255,255,255,.18)!important;
    transform:translateX(2px)!important;
  }

  .po-global-catalog-toggle.is-active,
  .po-global-catalog-group.is-open .po-global-catalog-toggle{
    background:#353b42!important;
    border-color:#4a5159!important;
    box-shadow:inset 3px 0 0 var(--po-gold)!important;
  }

  .po-global-catalog-toggle>span{
    display:grid!important;
    width:44px!important;
    min-width:44px!important;
    height:30px!important;
    min-height:30px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.24)!important;
    color:var(--po-gold-2)!important;
    font-size:8px!important;
    font-weight:950!important;
    letter-spacing:.03em!important;
  }

  .po-global-catalog-toggle>strong{
    display:block!important;
    margin:0!important;
    color:#fff!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:1.35!important;
  }

  .po-global-catalog-chevron{
    justify-self:end!important;
  }
}

@media(min-width:901px) and (max-width:1320px){
  .po-global-catalog-toggle,
  .po-global-catalog-toggle:focus,
  .po-global-catalog-toggle:active{
    grid-template-columns:40px minmax(0,1fr) 24px!important;
    min-height:48px!important;
    padding:8px 7px!important;
  }
  .po-global-catalog-toggle>span{
    width:40px!important;
    min-width:40px!important;
    height:28px!important;
    min-height:28px!important;
  }
  .po-global-catalog-toggle>strong{
    font-size:11px!important;
  }
}


/* =========================================================
V74 / DIRECT LESSON PLAYER ENTRY
Available JCAB / TCCA / AIRBUS courses now use Pilot LMS START
instead of the legacy Tutor course registration/detail page.
Boeing / ICAO remain COMING SOON until real lesson content exists.
========================================================= */


/* =========================================================
V77 / UNIFIED SHORT COURSE PANEL TITLES
Keep long formal course names in the main content, but use
short labels in the top-right registration panel for MEI/ATPL.
========================================================= */

/* =========================================================
V76 / NON-FAA DIRECT LESSON START
JCAB / TCCA use the exact Pilot LMS course titles shown in
Pilot Courses. START COURSE resolves the first Pilot lesson
from the curriculum API instead of using old Tutor course URLs.
Enrollment headings use only the short course code (PPL / IFR / CPL / MEI / ATPL etc.) so the right panel stays compact.
========================================================= */


/* =========================================================
V78 / RESTORE FAA OVERVIEW NAVIGATION
Category row opens its overview; boxed + / − only toggles submenu.
FAA therefore returns to the captain / first-officer conversation page.
========================================================= */


/* =========================================================
V80 / FAA OVERVIEW LIST READABILITY
Keep the conversation layout, but make the explanatory lists
large enough to scan comfortably even on shorter desktop viewports.
========================================================= */
@media(min-width:901px){
  .po-faa-license-line{
    grid-template-columns:142px minmax(0,1fr)!important;
    gap:22px!important;
    min-height:64px!important;
    padding:11px 4px!important;
  }

  .po-faa-license-line>small{
    font-size:10px!important;
    letter-spacing:.12em!important;
  }

  .po-faa-license-line>div{
    gap:9px!important;
  }

  .po-faa-license-line span{
    font-size:14px!important;
  }

  .po-faa-license-line b{
    font-size:12px!important;
  }

  .po-faa-license-line em{
    font-size:12px!important;
    line-height:1.55!important;
  }

  .po-faa-audience-list div{
    padding:15px 14px 15px 30px!important;
    font-size:12.5px!important;
    line-height:1.6!important;
  }

  .po-faa-audience-list div:before{
    left:9px!important;
    top:22px!important;
    width:9px!important;
  }
}

@media(min-width:901px) and (max-height:820px){
  .po-faa-license-line{
    min-height:58px!important;
    padding:9px 4px!important;
  }

  .po-faa-license-line>small{
    font-size:9.5px!important;
  }

  .po-faa-license-line span{
    font-size:13.5px!important;
  }

  .po-faa-license-line em{
    font-size:11.5px!important;
  }

  .po-faa-audience-list div{
    padding-top:12px!important;
    padding-bottom:12px!important;
    font-size:12px!important;
  }

  .po-faa-audience-list div:before{
    top:19px!important;
  }
}



/* =========================================================
V83 / START HERE VERTICAL FIT RESTORE
Desktop START HERE uses the full lesson-player-height frame again.
Only the START scene is affected.
========================================================= */
@media(min-width:901px) and (min-height:821px){
  .po-scene[data-panel="start"] .po-start-main{
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
    gap:18px!important;
    overflow:hidden!important;
  }

  .po-scene[data-panel="start"] .po-start-head,
  .po-scene[data-panel="start"] .po-start-main>.po-chat,
  .po-scene[data-panel="start"] .po-start-main>.po-guide-strip{
    flex:0 0 auto!important;
  }

  .po-scene[data-panel="start"] .po-start-main>.po-chat{
    margin-top:0!important;
  }

  .po-scene[data-panel="start"] .po-start-main>.po-guide-strip{
    margin-top:0!important;
  }
}

/* Shorter desktop screens keep the compact/scroll-safe behavior. */
@media(min-width:901px) and (max-height:820px){
  .po-scene[data-panel="start"] .po-start-main{
    justify-content:flex-start!important;
    overflow:auto!important;
  }
}


/* =========================================================
V85 / A320 COURSE SPLIT
AIRBUS menu now separates the full Airbus A320 course from A320 CBT.
Pilot LMS direct-start tries exact course-title candidates and opens
the first real lesson in the matching course.
========================================================= */


/* =========================================================
V86 / HIDE A320 CBT FROM TOP COURSE LIBRARY
The legacy A320 CBT course remains untouched in WordPress/Tutor LMS,
but is no longer shown in the top-page AIRBUS menu or catalog.
========================================================= */


/* =========================================================
V87 / AIRBUS 320 EXACT COURSE BINDING
The top-page A320 entry now resolves only the Pilot LMS course
named exactly "Airbus 320". Broad A320 fallbacks were removed so
it cannot accidentally resolve to the legacy A320 CBT course.
========================================================= */


/* =========================================================
V88 / AIRBUS + BOEING LINEUP
AIRBUS: A320 / A330 / A350
BOEING: 737 / 747 / 767 / 777 / 787
New/planned aircraft have in-page detail/registration screens only;
no external lesson/course link is attached yet.
========================================================= */


/* =========================================================
V89 / COURSE CATEGORY CONVERSATION OVERVIEWS
FAA / JCAB / TCCA / AIRBUS / BOEING / ICAO parent rows all open
the same conversation-first category explanation layout.
Only Course Library category overview behavior is affected.
========================================================= */
@media(min-width:901px){
  .po-catalog-shell.is-category-intro .po-catalog-guide,
  .po-catalog-shell.is-category-intro .po-catalog-grid{
    display:none!important;
  }

  .po-catalog-shell.is-category-intro .po-faa-overview{
    display:block!important;
  }
}


/* =========================================================
V91 / COURSE DETAIL TOP BALANCE
Shrink the right registration panel on desktop so its height is
closer to the left summary block, reducing the blank area before
the conversation / curriculum sections.
========================================================= */
@media(min-width:901px){
  .po-inline-ppl-top{
    gap:clamp(24px,3vw,48px)!important;
    align-items:start!important;
  }

  .po-inline-ppl-enroll{
    padding:24px 26px 22px!important;
    box-shadow:0 12px 28px rgba(23,27,32,.06)!important;
  }

  .po-inline-ppl-enroll h2{
    margin:16px 0 10px!important;
    font-size:clamp(28px,2.6vw,44px)!important;
    line-height:1.02!important;
  }

  .po-inline-ppl-enroll > p{
    margin:0 0 18px!important;
    font-size:12.5px!important;
    line-height:1.72!important;
  }

  .po-inline-ppl-meta{
    padding:12px 0!important;
  }

  .po-inline-ppl-meta small{
    margin-bottom:5px!important;
  }

  .po-inline-ppl-meta strong{
    font-size:11px!important;
  }

  .po-inline-ppl-preview{
    margin:12px 0 8px!important;
  }

  .po-inline-ppl-start{
    min-height:58px!important;
    padding:0 20px!important;
  }

  .po-inline-ppl-buy-grid{
    gap:6px!important;
    margin-top:6px!important;
  }

  .po-inline-ppl-buy{
    min-height:104px!important;
    padding:14px 14px!important;
  }

  .po-inline-ppl-buy strong{
    margin-top:7px!important;
    font-size:15px!important;
    line-height:1.3!important;
  }

  .po-inline-ppl-curriculum{
    margin-top:24px!important;
  }
}

@media(min-width:901px) and (max-width:1180px){
  .po-inline-ppl-enroll{
    padding:22px 22px 20px!important;
  }

  .po-inline-ppl-enroll h2{
    font-size:clamp(26px,2.4vw,38px)!important;
  }

  .po-inline-ppl-buy{
    min-height:96px!important;
  }

  .po-inline-ppl-buy strong{
    font-size:14px!important;
  }
}


/* =========================================================
V92 / CURRICULUM = LIGHT VERSION OF LEFT COURSE MENU
Use the same visual language as the left navigation:
boxed section number, full bordered row, boxed + / − control,
and a gold active accent when the section is open.
========================================================= */
.po-inline-ppl-curriculum-list{
  gap:7px!important;
}

.po-inline-ppl-section{
  overflow:hidden!important;
  border:1px solid #b9b3aa!important;
  background:#fbfaf7!important;
  box-shadow:none!important;
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease!important;
}

.po-inline-ppl-section summary{
  grid-template-columns:46px minmax(0,1fr) auto 34px!important;
  gap:13px!important;
  min-height:62px!important;
  padding:7px 9px!important;
  background:#fbfaf7!important;
  transition:background .16s ease!important;
}

.po-inline-ppl-section summary:hover{
  background:#f6f3ed!important;
}

.po-inline-ppl-section summary>span:first-child{
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  min-width:42px!important;
  height:34px!important;
  border:1px solid #c6bfae!important;
  background:#f3efe6!important;
  color:var(--po-gold)!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:.04em!important;
}

.po-inline-ppl-section summary strong{
  color:var(--po-ink)!important;
  font-size:14px!important;
  font-weight:900!important;
  line-height:1.35!important;
}

.po-inline-ppl-section summary small{
  color:#777b7e!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.06em!important;
  white-space:nowrap!important;
}

.po-inline-ppl-section summary b{
  display:grid!important;
  place-items:center!important;
  width:32px!important;
  height:32px!important;
  border:1px solid #b9b3aa!important;
  background:#fff!important;
  color:#575d62!important;
  font-weight:500!important;
}

.po-inline-ppl-section summary b:before{
  font-size:18px!important;
  line-height:1!important;
}

.po-inline-ppl-section[open]{
  border-color:#9f978a!important;
  background:#fff!important;
  box-shadow:inset 3px 0 0 var(--po-gold)!important;
}

.po-inline-ppl-section[open] summary{
  background:#f2eadc!important;
}

.po-inline-ppl-section[open] summary>span:first-child{
  border-color:#c7aa71!important;
  background:#fffaf0!important;
}

.po-inline-ppl-section[open] summary b{
  border-color:#b78a3d!important;
  color:var(--po-gold)!important;
  background:#fffaf0!important;
}

.po-inline-ppl-lessons{
  margin:0 10px 8px 58px!important;
  padding:0!important;
  border-top:1px solid #d8d2c8!important;
  background:#fff!important;
}

.po-inline-ppl-lesson{
  grid-template-columns:34px minmax(0,1fr) auto!important;
  gap:12px!important;
  min-height:46px!important;
  padding:0 10px 0 0!important;
  border-bottom:1px solid #e1ddd5!important;
}

.po-inline-ppl-lesson>span:first-child{
  display:grid!important;
  place-items:center!important;
  width:28px!important;
  height:25px!important;
  border:1px solid #ddd7cb!important;
  color:var(--po-gold)!important;
  font-size:7px!important;
  font-weight:950!important;
}

.po-inline-ppl-lesson strong{
  color:var(--po-ink)!important;
  font-size:11.5px!important;
  font-weight:800!important;
  line-height:1.45!important;
}

.po-inline-ppl-lesson em{
  color:#74787c!important;
  font-size:7px!important;
  font-weight:900!important;
  letter-spacing:.05em!important;
  white-space:nowrap!important;
}

@media(max-width:900px){
  .po-inline-ppl-section summary{
    grid-template-columns:42px minmax(0,1fr) 30px!important;
    gap:10px!important;
    min-height:58px!important;
    padding:6px 8px!important;
  }

  .po-inline-ppl-section summary>span:first-child{
    width:38px!important;
    min-width:38px!important;
    height:32px!important;
  }

  .po-inline-ppl-section summary small{
    display:none!important;
  }

  .po-inline-ppl-section summary b{
    width:30px!important;
    height:30px!important;
  }

  .po-inline-ppl-lessons{
    margin-left:48px!important;
  }

  .po-inline-ppl-lesson{
    grid-template-columns:30px minmax(0,1fr)!important;
  }

  .po-inline-ppl-lesson em{
    grid-column:2!important;
    padding-bottom:8px!important;
    white-space:normal!important;
  }
}


/* =========================================================
V93 / RESTORE SLIM SITE FOOTER
Desktop: fixed in the reserved 24px strip below the main frame.
Mobile: shown once at the true end of the page.
========================================================= */
.po-site-footer{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#7b776f;
  font-size:7.5px;
  font-weight:800;
  line-height:1;
  letter-spacing:.18em;
  white-space:nowrap;
}

@media(min-width:901px){
  .po-site-footer{
    position:fixed;
    z-index:861;
    left:0;
    right:0;
    bottom:0;
    height:24px;
    border-top:1px solid rgba(23,27,32,.18);
    background:var(--po-frame);
    pointer-events:none;
  }
}

@media(max-width:900px){
  .po-site-footer{
    position:relative;
    width:100%;
    min-height:38px;
    border-top:1px solid rgba(255,255,255,.12);
    background:#071522;
    color:rgba(255,255,255,.56);
  }
}


/* =========================================================
V94 / CLICKABLE CURRICULUM LESSONS
Real Pilot LMS lesson rows link directly to that lesson page.
Section headers remain accordion toggles.
========================================================= */
.po-inline-ppl-lesson.is-clickable{
  color:inherit!important;
  text-decoration:none!important;
  cursor:pointer!important;
  transition:background .14s ease,transform .14s ease!important;
}

.po-inline-ppl-lesson.is-clickable:hover{
  background:#f6f1e7!important;
}

.po-inline-ppl-lesson.is-clickable:hover strong{
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}

.po-inline-ppl-lesson.is-clickable:focus-visible{
  outline:2px solid var(--po-gold)!important;
  outline-offset:-2px!important;
  background:#f6f1e7!important;
}


/* =========================================================
V95 / SIDEBAR MY PAGE
Always-visible MY PAGE shortcut under ACCOUNT.
Login can still hide automatically for logged-in WordPress users.
========================================================= */
@media(min-width:901px){
  .po-global-mypage-item{
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:center!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-height:43px!important;
    margin:0!important;
    padding:6px 9px!important;
    border:1px solid transparent!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    text-decoration:none!important;
    font-family:inherit!important;
    cursor:pointer!important;
    transition:background .16s ease,border-color .16s ease,transform .16s ease!important;
  }

  .po-global-mypage-item:hover{
    transform:translateX(2px)!important;
    border-color:rgba(255,255,255,.14)!important;
    background:#242a31!important;
  }

  .po-global-mypage-item>span{
    display:grid!important;
    min-width:44px!important;
    min-height:27px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.18)!important;
    color:var(--po-gold-2)!important;
    font-size:8px!important;
    font-weight:950!important;
    letter-spacing:.03em!important;
  }

  .po-global-mypage-item>strong{
    color:#f0f2f4!important;
    font-size:14px!important;
    font-weight:900!important;
  }
}


/* =========================================================
V96 / LOGIN STATE DETECTION
Sidebar login visibility is confirmed against the live WordPress
session instead of depending only on body.logged-in.
========================================================= */


/* =========================================================
V97 / INLINE MY PAGE
Pilot Online-native dashboard shown inside the right workspace.
No Tutor LMS dashboard page transition.
========================================================= */
.po-mypage-shell{
  height:100%;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:clamp(28px,3vw,48px) clamp(30px,4vw,62px) 54px;
  background:var(--po-paper);
  scrollbar-width:thin;
  scrollbar-color:#aaa59b transparent;
}

.po-mypage-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:36px;
  align-items:end;
  padding-bottom:24px;
  border-bottom:1px solid var(--po-line);
}

.po-mypage-head h1{
  margin:12px 0 10px;
  color:var(--po-ink);
  font-size:clamp(42px,4.2vw,68px);
  font-weight:950;
  line-height:.96;
  letter-spacing:-.055em;
}

.po-mypage-head>div:first-child>p:last-child{
  max-width:760px;
  margin:0;
  color:var(--po-copy);
  font-size:13px;
  line-height:1.8;
}

.po-mypage-head-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(120px,1fr));
  border:1px solid var(--po-line);
  background:#fbfaf7;
}

.po-mypage-head-meta>div{
  min-width:130px;
  padding:14px 16px;
  border-right:1px solid var(--po-line);
}

.po-mypage-head-meta>div:last-child{border-right:0;}

.po-mypage-head-meta small,
.po-mypage-card-kicker,
.po-mypage-block-head small,
.po-mypage-access-card>small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.14em;
}

.po-mypage-head-meta small{display:block;margin-bottom:7px;}
.po-mypage-head-meta strong{font-size:11px;font-weight:950;}

.po-mypage-top{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(260px,.72fr);
  gap:14px;
  margin-top:18px;
}

.po-mypage-continue{
  min-height:248px;
  padding:28px 30px;
  border:1px solid #aaa49a;
  border-top:6px solid var(--po-gold);
  background:#fbfaf7;
}

.po-mypage-card-kicker{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
}

.po-mypage-card-kicker>span{font-size:9px;}
.po-mypage-card-kicker>small{
  color:#777b7e;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
}

.po-mypage-continue h2{
  max-width:760px;
  margin:27px 0 10px;
  font-size:clamp(28px,3vw,46px);
  line-height:1.05;
  letter-spacing:-.04em;
}

.po-mypage-continue>p{
  max-width:700px;
  margin:0 0 24px;
  color:var(--po-copy);
  font-size:12.5px;
  line-height:1.75;
}

.po-mypage-continue-btn{
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:min(100%,440px);
  min-height:56px;
  padding:0 20px;
  background:var(--po-dark);
  color:#fff!important;
  text-decoration:none!important;
  font-size:11px;
  font-weight:950;
  letter-spacing:.08em;
}

.po-mypage-continue-btn.is-disabled{
  opacity:.38;
  pointer-events:none;
}

.po-mypage-summary{
  display:grid;
  border:1px solid var(--po-line);
  background:#fff;
}

.po-mypage-summary-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:4px 16px;
  align-items:center;
  padding:17px 18px;
  border-bottom:1px solid var(--po-line);
}

.po-mypage-summary-row:last-child{border-bottom:0;}
.po-mypage-summary-row small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}
.po-mypage-summary-row strong{
  grid-row:1 / span 2;
  grid-column:2;
  font-size:18px;
  font-weight:950;
}
.po-mypage-summary-row span{
  color:#777b7e;
  font-size:9px;
}

.po-mypage-block{margin-top:22px;}

.po-mypage-block-head{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:end;
  margin-bottom:10px;
}

.po-mypage-block-head h2{
  margin:5px 0 0;
  font-size:22px;
  letter-spacing:-.025em;
}

.po-mypage-block-head>span{
  color:#74787c;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
}

.po-mypage-recent-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

.po-mypage-recent-card{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 24px;
  gap:12px;
  align-items:center;
  min-height:74px;
  padding:9px 12px;
  border:1px solid #b9b3aa;
  background:#fbfaf7;
  color:var(--po-ink)!important;
  text-align:left;
  cursor:pointer;
}

.po-mypage-recent-card:hover{
  border-color:#9f978a;
  background:#f4eee3;
}

.po-mypage-recent-card>span{
  display:grid;
  place-items:center;
  min-height:34px;
  border:1px solid #c6bfae;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
}

.po-mypage-recent-card strong{
  display:block;
  overflow:hidden;
  font-size:12px;
  font-weight:900;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.po-mypage-recent-card small{
  display:block;
  margin-top:4px;
  color:#7b7f82;
  font-size:7.5px;
  font-weight:850;
  letter-spacing:.05em;
}

.po-mypage-recent-card b{
  color:#6d7174;
  font-size:16px;
  font-weight:500;
}

.po-mypage-empty{
  grid-column:1/-1;
  padding:24px;
  border:1px dashed #bcb6ac;
  background:#fbfaf7;
  color:#767a7d;
  font-size:11px;
}

.po-mypage-bottom{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(280px,.72fr);
  gap:14px;
  margin-top:22px;
}

.po-mypage-bottom .po-mypage-block{margin-top:0;}

.po-mypage-sync-card{
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 26px;
  gap:14px;
  align-items:center;
  min-height:104px;
  padding:14px;
  border:1px solid #b9b3aa;
  background:#fbfaf7;
}

.po-mypage-sync-card>span{
  display:grid;
  min-height:42px;
  place-items:center;
  border:1px solid #c6bfae;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
}

.po-mypage-sync-card strong{display:block;margin-bottom:5px;font-size:13px;}

.po-mypage-sync-card p{
  margin:0;
  color:var(--po-copy);
  font-size:10px;
  line-height:1.6;
}

.po-mypage-sync-card b{
  color:#6d7174;
  font-size:17px;
  font-weight:500;
}

.po-mypage-access-card{
  padding:20px;
  border:1px solid #aaa49a;
  background:#f2eadc;
}

.po-mypage-access-card h2{
  margin:8px 0 10px;
  font-size:26px;
  letter-spacing:-.035em;
}

.po-mypage-access-card>p{
  margin:0 0 16px;
  color:var(--po-copy);
  font-size:10px;
  line-height:1.65;
}

.po-mypage-access-lines{
  border-top:1px solid rgba(23,27,32,.18);
}

.po-mypage-access-lines>div{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:10px 0;
  border-bottom:1px solid rgba(23,27,32,.14);
}

.po-mypage-access-lines span{
  color:#777b7e;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.08em;
}

.po-mypage-access-lines strong{font-size:9px;font-weight:950;}

@media(min-width:901px){
  .po-global-mypage-item.is-active{
    border-color:#4a5159!important;
    background:#353b42!important;
    box-shadow:inset 3px 0 0 var(--po-gold)!important;
  }
}

@media(max-width:1180px) and (min-width:901px){
  .po-mypage-top,
  .po-mypage-bottom{grid-template-columns:1fr;}
  .po-mypage-summary{grid-template-columns:repeat(3,minmax(0,1fr));}
  .po-mypage-summary-row{
    border-right:1px solid var(--po-line);
    border-bottom:0;
  }
  .po-mypage-summary-row:last-child{border-right:0;}
  .po-mypage-recent-list{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media(max-width:900px){
  .po-mypage-shell{padding:26px 18px 42px;}
  .po-mypage-head{grid-template-columns:1fr;}
  .po-mypage-head-meta{grid-template-columns:1fr 1fr;}
  .po-mypage-top,
  .po-mypage-bottom{grid-template-columns:1fr;}
  .po-mypage-summary{grid-template-columns:1fr;}
  .po-mypage-summary-row{
    border-right:0;
    border-bottom:1px solid var(--po-line);
  }
  .po-mypage-recent-list{grid-template-columns:1fr;}
}


/* =========================================================
V98 / MY PAGE LOGIN GATE
Only MY PAGE remains in the sidebar.
Logged out  -> MY PAGE itself becomes the login/register screen.
Logged in   -> Pilot Online MY PAGE dashboard.
========================================================= */
.po-mypage-auth-gate{
  height:100%;
}

.po-mypage-auth-gate .po-auth-shell{
  height:100%!important;
  border:0!important;
}

.po-mypage-auth-checking{
  display:grid;
  height:100%;
  place-content:center;
  gap:8px;
  background:var(--po-paper);
  text-align:center;
}

.po-mypage-auth-checking small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.16em;
}

.po-mypage-auth-checking strong{
  color:var(--po-ink);
  font-size:15px;
  font-weight:900;
}

[data-mypage-view][hidden]{
  display:none!important;
}


/* =========================================================
V99 / AVIATION RADIO
New Course Library category between JCAB and TCCA.
========================================================= */
@media(min-width:901px) and (max-width:1180px){
  [data-course-accordion="radio"] .po-global-catalog-item>strong{
    font-size:12px!important;
    letter-spacing:-.01em!important;
  }
}


/* =========================================================
V100 / AVIATION RADIO EXPANDED MENU
BASICS / ARO / PHRASEOLOGY / ATC / FCC RR
========================================================= */
[data-course-accordion="radio"] .po-global-course-submenu button{
  min-height:48px!important;
}

[data-course-accordion="radio"] .po-global-course-submenu button strong{
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  line-height:1.25!important;
}



/* =========================================================
V102 / EXPANDABLE AVIATION RESOURCES
GUIDE 05 becomes an expandable authority directory.
========================================================= */
@media(min-width:901px){
  .po-global-resource-group{
    flex:0 0 auto;
  }

  .po-global-resource-toggle{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:36px minmax(0,1fr) 30px;
    gap:11px;
    align-items:center;
    width:100%;
    min-height:48px;
    padding:7px 10px;
    border:1px solid transparent;
    background:transparent;
    color:#fff;
    text-align:left;
    font-family:inherit;
    cursor:pointer;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
  }

  .po-global-resource-toggle:hover,
  .po-global-resource-toggle.is-active{
    transform:translateX(2px);
    border-color:rgba(255,255,255,.14);
    background:#242a31;
  }

  .po-global-resource-toggle.is-active{
    box-shadow:inset 3px 0 0 var(--po-gold);
  }

  .po-global-resource-toggle>span{
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:var(--po-gold-2);
    font-size:9px;
    font-weight:950;
  }

  .po-global-resource-toggle>strong{
    color:#fff;
    font-size:14px;
    font-weight:900;
    line-height:1.25;
  }

  .po-global-resource-chevron{
    position:relative;
    display:grid;
    width:28px;
    height:28px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:#cfd4d8;
  }

  .po-global-resource-chevron:before{
    content:"+";
    font-size:18px;
    font-weight:500;
    line-height:1;
  }

  .po-global-resource-group.is-open .po-global-resource-chevron:before{
    content:"−";
  }

  .po-global-resource-submenu{
    max-height:0;
    margin:0 0 0 18px;
    padding:0 0 0 10px;
    overflow:hidden;
    border-left:1px solid transparent;
    opacity:0;
    visibility:hidden;
    transition:max-height .3s ease,opacity .2s ease,padding .3s ease,border-color .2s ease,visibility .2s ease;
  }

  .po-global-resource-group.is-open .po-global-resource-submenu{
    max-height:410px;
    padding-top:6px;
    padding-bottom:6px;
    border-left-color:rgba(211,171,98,.52);
    opacity:1;
    visibility:visible;
  }

  .po-global-resource-submenu button{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:34px minmax(0,1fr) 14px;
    gap:8px;
    width:100%;
    align-items:center;
    min-height:35px;
    padding:5px 8px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:transparent;
    color:#dfe3e6;
    text-align:left;
    cursor:pointer;
    transition:background .16s ease,color .16s ease,transform .16s ease;
  }

  .po-global-resource-submenu button:last-child{border-bottom:0;}

  .po-global-resource-submenu button:hover,
  .po-global-resource-submenu button.is-active{
    transform:translateX(2px);
    background:rgba(255,255,255,.065);
    color:#fff;
  }

  .po-global-resource-submenu button.is-active{
    box-shadow:inset 2px 0 0 var(--po-gold-2);
  }

  .po-global-resource-submenu small{
    color:var(--po-gold-2);
    font-size:7px;
    font-weight:950;
    letter-spacing:.03em;
  }

  .po-global-resource-submenu strong{
    min-width:0;
    overflow:hidden;
    font-size:10px;
    font-weight:800;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .po-global-resource-submenu b{
    color:#7f8992;
    font-size:10px;
    font-weight:500;
    text-align:right;
  }
}

.po-resource-authority-meta{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  flex:0 0 auto;
  margin-top:12px;
  border:1px solid #cbc5bb;
  background:#fbfaf7;
}

.po-resource-authority-meta>div{
  padding:10px 14px;
  border-right:1px solid #d8d2c8;
}

.po-resource-authority-meta>div:last-child{border-right:0;}

.po-resource-authority-meta small{
  display:block;
  margin-bottom:4px;
  color:var(--po-gold);
  font-size:7px;
  font-weight:950;
  letter-spacing:.12em;
}

.po-resource-authority-meta strong{
  color:var(--po-ink);
  font-size:10px;
  font-weight:950;
}

.po-resource-column-grid{
  flex:1 1 auto;
  min-height:0;
  margin-top:12px;
  overflow-y:auto;
  align-content:start;
}

.po-resource-column.is-placeholder{
  opacity:.72;
}

.po-resource-column-list .po-resource-note{
  display:block;
  padding:13px 15px;
  color:#777b7e;
  font-size:10px;
  line-height:1.6;
}

@media(max-width:900px){
  .po-resource-authority-meta{
    grid-template-columns:1fr;
  }
  .po-resource-authority-meta>div{
    border-right:0;
    border-bottom:1px solid #d8d2c8;
  }
  .po-resource-authority-meta>div:last-child{border-bottom:0;}
}




/* =========================================================
V104 / RESOURCE MENU + WIDE CONTENT REDESIGN
- "航空情報・資料" submenu uses the same visual language as FAA courses
- No inner submenu scroll; let the main left sidebar grow/scroll naturally
- Resource content switches from narrow 5-column panels to wide horizontal sections
========================================================= */

/* ---------- Left sidebar: make resources behave like FAA submenu ---------- */
@media(min-width:901px){
  .po-global-resource-group{
    flex:0 0 auto;
  }

  .po-global-resource-toggle{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr) 30px!important;
    gap:11px!important;
    align-items:center!important;
    width:100%!important;
    min-height:48px!important;
    padding:7px 10px!important;
    border:1px solid transparent!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    font-family:inherit!important;
    cursor:pointer!important;
    transition:background .16s ease,border-color .16s ease,transform .16s ease!important;
  }

  .po-global-resource-toggle:hover,
  .po-global-resource-toggle.is-active{
    transform:translateX(2px)!important;
    border-color:rgba(255,255,255,.14)!important;
    background:#242a31!important;
  }

  .po-global-resource-toggle.is-active{
    box-shadow:inset 3px 0 0 var(--po-gold)!important;
  }

  .po-global-resource-toggle>span{
    display:grid!important;
    width:34px!important;
    height:34px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.18)!important;
    color:var(--po-gold-2)!important;
    font-size:9px!important;
    font-weight:950!important;
  }

  .po-global-resource-toggle>strong{
    color:#fff!important;
    font-size:14px!important;
    font-weight:900!important;
    line-height:1.25!important;
  }

  .po-global-resource-chevron{
    position:relative!important;
    display:grid!important;
    width:28px!important;
    height:28px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.18)!important;
    color:#cfd4d8!important;
  }

  .po-global-resource-chevron:before{
    content:"+"!important;
    font-size:18px!important;
    font-weight:500!important;
    line-height:1!important;
  }

  .po-global-resource-group.is-open .po-global-resource-chevron:before{
    content:"−"!important;
  }

  .po-global-resource-submenu{
    max-height:0!important;
    margin:0 0 0 18px!important;
    padding:0 0 0 10px!important;
    overflow:hidden!important;
    border-left:1px solid transparent!important;
    opacity:0!important;
    visibility:hidden!important;
    transition:max-height .3s ease,opacity .2s ease,padding .3s ease,border-color .2s ease,visibility .2s ease!important;
  }

  .po-global-resource-group.is-open .po-global-resource-submenu{
    max-height:1200px!important; /* open fully; no internal scroll */
    padding-top:6px!important;
    padding-bottom:6px!important;
    border-left-color:rgba(211,171,98,.52)!important;
    opacity:1!important;
    visibility:visible!important;
    overflow:visible!important;
  }

  .po-global-resource-submenu button{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr) 14px!important;
    gap:8px!important;
    width:100%!important;
    align-items:center!important;
    min-height:34px!important;
    padding:5px 8px!important;
    border:0!important;
    border-bottom:1px solid rgba(255,255,255,.07)!important;
    background:transparent!important;
    color:#dfe3e6!important;
    text-align:left!important;
    cursor:pointer!important;
    transition:background .16s ease,color .16s ease,transform .16s ease!important;
  }

  .po-global-resource-submenu button:last-child{
    border-bottom:0!important;
  }

  .po-global-resource-submenu button:hover,
  .po-global-resource-submenu button.is-active{
    transform:translateX(2px)!important;
    background:rgba(255,255,255,.065)!important;
    color:#fff!important;
  }

  .po-global-resource-submenu button.is-active{
    box-shadow:inset 2px 0 0 var(--po-gold-2)!important;
  }

  .po-global-resource-submenu small{
    color:var(--po-gold-2)!important;
    font-size:7px!important;
    font-weight:950!important;
    letter-spacing:.04em!important;
  }

  .po-global-resource-submenu strong{
    min-width:0!important;
    overflow:hidden!important;
    font-size:10px!important;
    font-weight:800!important;
    line-height:1.25!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  .po-global-resource-submenu b{
    color:#7f8992!important;
    font-size:10px!important;
    font-weight:500!important;
    text-align:right!important;
  }
}

@media(min-width:901px) and (max-width:1320px){
  .po-global-resource-submenu{
    margin-left:12px!important;
    padding-left:8px!important;
  }
}

/* ---------- Right workspace: wide horizontal resource sections ---------- */
@media(min-width:901px){
  .po-resources-columns{
    display:flex!important;
    flex-direction:column!important;
    min-height:100%!important;
    padding:clamp(28px,3vw,48px) clamp(28px,4vw,56px) 54px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:#aaa59b transparent;
  }

  .po-resources-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(280px,.72fr)!important;
    gap:26px!important;
    align-items:end!important;
    padding-bottom:16px!important;
    border-bottom:1px solid var(--po-line)!important;
  }

  .po-resource-authority-meta{
    margin-top:14px!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  .po-resource-column-grid{
    display:block!important;
    flex:1 1 auto!important;
    min-height:0!important;
    margin-top:18px!important;
    padding-top:0!important;
    overflow:visible!important;
  }

  .po-resource-column{
    display:block!important;
    min-height:auto!important;
    margin-top:14px!important;
    border:1px solid #d0c9bf!important;
    background:#faf8f3!important;
  }

  .po-resource-column:first-child{
    margin-top:0!important;
  }

  .po-resource-column-head{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:12px!important;
    align-items:center!important;
    min-height:72px!important;
    padding:14px 16px!important;
    border-bottom:1px solid #d8d1c7!important;
    background:#f0ece5!important;
  }

  .po-resource-column-head>span{
    display:grid!important;
    width:34px!important;
    height:34px!important;
    place-items:center!important;
    border:1px solid #c4b493!important;
    color:var(--po-gold)!important;
    font-size:8px!important;
    font-weight:950!important;
  }

  .po-resource-column-head small{
    display:block!important;
    margin-bottom:3px!important;
    color:#8f887e!important;
    font-size:7px!important;
    font-weight:950!important;
    letter-spacing:.1em!important;
  }

  .po-resource-column-head h3{
    margin:0!important;
    color:var(--po-ink)!important;
    font-size:22px!important;
    font-weight:900!important;
    line-height:1.15!important;
    letter-spacing:-.02em!important;
  }

  .po-resource-column-list{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:0!important;
    min-height:auto!important;
  }

  .po-resource-column-list>a{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 18px!important;
    gap:10px!important;
    align-items:center!important;
    min-height:58px!important;
    padding:0 16px!important;
    border-bottom:1px solid #ded8cf!important;
    border-right:1px solid #ded8cf!important;
    background:#fffefa!important;
    color:var(--po-ink)!important;
    transition:background .16s ease,color .16s ease,padding-left .16s ease!important;
  }

  .po-resource-column-list>a:nth-child(2n){
    border-right:0!important;
  }

  .po-resource-column-list>a:last-child:nth-child(odd){
    grid-column:1 / -1!important;
    border-right:0!important;
  }

  .po-resource-column-list strong{
    min-width:0!important;
    font-size:14px!important;
    font-weight:900!important;
    line-height:1.35!important;
  }

  .po-resource-column-list b{
    justify-self:end!important;
    color:#8b8278!important;
    font-size:14px!important;
    font-weight:500!important;
  }

  .po-resource-column-list>a:hover{
    padding-left:20px!important;
    background:var(--po-dark)!important;
    color:#fff!important;
  }

  .po-resource-column-list>a:hover b{
    color:var(--po-gold-2)!important;
  }

  .po-resource-column-list .po-resource-note{
    display:block!important;
    grid-column:1 / -1!important;
    padding:18px 16px!important;
    color:#777b7e!important;
    font-size:11px!important;
    line-height:1.75!important;
    background:#fffefa!important;
  }

  .po-resource-column.is-placeholder .po-resource-column-list{
    grid-template-columns:1fr!important;
  }
}

@media(min-width:901px) and (max-width:1180px){
  .po-resources-head{
    grid-template-columns:1fr!important;
  }

  .po-resource-column-list{
    grid-template-columns:1fr!important;
  }

  .po-resource-column-list>a{
    border-right:0!important;
  }

  .po-resource-column-list>a:last-child:nth-child(odd){
    grid-column:auto!important;
  }
}

@media(max-width:900px){
  .po-resources-columns{
    overflow:visible!important;
  }

  .po-resource-column-grid{
    display:block!important;
    overflow:visible!important;
  }

  .po-resource-column{
    margin-top:14px!important;
  }

  .po-resource-column-list{
    display:block!important;
  }

  .po-resource-column-list>a{
    min-height:54px!important;
    padding:10px 12px!important;
    border-right:0!important;
  }

  .po-resource-column-list strong{
    font-size:14px!important;
  }
}


/* =========================================================
V106 / EXPANDABLE AVIATION NEWS HUB
Parent 04 = existing latest-news feed.
Submenu = AIR / MFG / SAF / OPS / BIZ / SRC.
========================================================= */
@media(min-width:901px){
  .po-global-news-group{
    flex:0 0 auto;
  }

  .po-global-news-toggle{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:36px minmax(0,1fr) 30px;
    gap:11px;
    align-items:center;
    width:100%;
    min-height:48px;
    padding:7px 10px;
    border:1px solid transparent;
    background:transparent;
    color:#fff;
    text-align:left;
    font-family:inherit;
    cursor:pointer;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
  }

  .po-global-news-toggle:hover,
  .po-global-news-toggle.is-active{
    transform:translateX(2px);
    border-color:rgba(255,255,255,.14);
    background:#242a31;
  }

  .po-global-news-toggle.is-active{
    box-shadow:inset 3px 0 0 var(--po-gold);
  }

  .po-global-news-toggle>span{
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:var(--po-gold-2);
    font-size:9px;
    font-weight:950;
  }

  .po-global-news-toggle>strong{
    color:#fff;
    font-size:14px;
    font-weight:900;
    line-height:1.25;
  }

  .po-global-news-chevron{
    position:relative;
    display:grid;
    width:28px;
    height:28px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:#cfd4d8;
  }

  .po-global-news-chevron:before{
    content:"+";
    font-size:18px;
    font-weight:500;
    line-height:1;
  }

  .po-global-news-group.is-open .po-global-news-chevron:before{
    content:"−";
  }

  .po-global-news-submenu{
    max-height:0;
    margin:0 0 0 18px;
    padding:0 0 0 10px;
    overflow:hidden;
    border-left:1px solid transparent;
    opacity:0;
    visibility:hidden;
    transition:max-height .3s ease,opacity .2s ease,padding .3s ease,border-color .2s ease,visibility .2s ease;
  }

  .po-global-news-group.is-open .po-global-news-submenu{
    max-height:360px;
    padding-top:6px;
    padding-bottom:6px;
    border-left-color:rgba(211,171,98,.52);
    opacity:1;
    visibility:visible;
  }

  .po-global-news-submenu button{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:34px minmax(0,1fr) 14px;
    gap:8px;
    width:100%;
    align-items:center;
    min-height:34px;
    padding:5px 8px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:transparent;
    color:#dfe3e6;
    text-align:left;
    cursor:pointer;
    transition:background .16s ease,color .16s ease,transform .16s ease;
  }

  .po-global-news-submenu button:last-child{border-bottom:0;}

  .po-global-news-submenu button:hover,
  .po-global-news-submenu button.is-active{
    transform:translateX(2px);
    background:rgba(255,255,255,.065);
    color:#fff;
  }

  .po-global-news-submenu button.is-active{
    box-shadow:inset 2px 0 0 var(--po-gold-2);
  }

  .po-global-news-submenu small{
    color:var(--po-gold-2);
    font-size:7px;
    font-weight:950;
    letter-spacing:.04em;
  }

  .po-global-news-submenu strong{
    min-width:0;
    overflow:hidden;
    font-size:10px;
    font-weight:800;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .po-global-news-submenu b{
    color:#7f8992;
    font-size:10px;
    font-weight:500;
    text-align:right;
  }

  .po-news-workspace{
    overflow:hidden!important;
  }

  #po-news-top-view,
  #po-news-category-view{
    height:100%;
    min-height:0;
  }

  #po-news-category-view{
    overflow-y:auto;
    padding:clamp(28px,3vw,48px) clamp(28px,4vw,58px) 54px;
    background:var(--po-paper);
    scrollbar-width:thin;
    scrollbar-color:#aaa59b transparent;
  }

  .po-news-category-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);
    gap:32px;
    align-items:end;
    padding-bottom:18px;
    border-bottom:1px solid var(--po-line);
  }

  .po-news-category-head>p{
    margin:0;
    color:var(--po-copy);
    font-size:13px;
    line-height:1.8;
  }

  .po-news-category-meta{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
    border:1px solid #cbc5bb;
    background:#fbfaf7;
  }

  .po-news-category-meta>div{
    padding:10px 14px;
    border-right:1px solid #d8d2c8;
  }

  .po-news-category-meta>div:last-child{border-right:0;}

  .po-news-category-meta small{
    display:block;
    margin-bottom:4px;
    color:var(--po-gold);
    font-size:7px;
    font-weight:950;
    letter-spacing:.12em;
  }

  .po-news-category-meta strong{
    color:var(--po-ink);
    font-size:10px;
    font-weight:950;
  }

  .po-news-directory{
    margin-top:18px;
    border-top:1px solid #c9c3b9;
  }

  .po-news-directory-group{
    border-left:1px solid #c9c3b9;
    border-right:1px solid #c9c3b9;
    border-bottom:1px solid #c9c3b9;
    background:#fffefa;
  }

  .po-news-directory-group-head{
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    gap:14px;
    align-items:center;
    min-height:68px;
    padding:10px 14px;
    border-bottom:1px solid #d8d1c7;
    background:#f0ece5;
  }

  .po-news-directory-group-head>span{
    display:grid;
    width:40px;
    height:34px;
    place-items:center;
    border:1px solid #c4b493;
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
  }

  .po-news-directory-group-head small{
    display:block;
    margin-bottom:3px;
    color:#8f887e;
    font-size:7px;
    font-weight:950;
    letter-spacing:.10em;
  }

  .po-news-directory-group-head h3{
    margin:0;
    color:var(--po-ink);
    font-size:20px;
    font-weight:900;
    letter-spacing:-.02em;
  }

  .po-news-directory-row{
    display:grid;
    grid-template-columns:132px minmax(0,1fr) minmax(230px,.65fr) 24px;
    gap:18px;
    align-items:center;
    min-height:64px;
    padding:10px 16px;
    border-bottom:1px solid #ded8cf;
    color:var(--po-ink)!important;
    text-decoration:none!important;
    transition:background .16s ease,color .16s ease,padding-left .16s ease;
  }

  .po-news-directory-row:last-child{border-bottom:0;}

  .po-news-directory-row>small{
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-news-directory-row>strong{
    min-width:0;
    font-size:14px;
    font-weight:900;
    line-height:1.35;
  }

  .po-news-directory-row>span{
    color:#777b7e;
    font-size:10px;
    line-height:1.5;
  }

  .po-news-directory-row>b{
    justify-self:end;
    color:#8b8278;
    font-size:15px;
    font-weight:500;
  }

  .po-news-directory-row:hover{
    padding-left:20px;
    background:var(--po-dark);
    color:#fff!important;
  }

  .po-news-directory-row:hover>span{
    color:#c9d0d4;
  }

  .po-news-directory-row:hover>b{
    color:var(--po-gold-2);
  }
}

@media(min-width:901px) and (max-width:1180px){
  .po-global-news-submenu{
    margin-left:12px;
    padding-left:8px;
  }

  .po-news-category-head{
    grid-template-columns:1fr;
  }

  .po-news-directory-row{
    grid-template-columns:104px minmax(0,1fr) 22px;
  }

  .po-news-directory-row>span{
    grid-column:2;
  }

  .po-news-directory-row>b{
    grid-column:3;
    grid-row:1 / span 2;
  }
}

@media(max-width:900px){
  #po-news-category-view{
    display:none!important;
  }
}


/* V106 final / preserve the original news feed flex layout inside its new view wrapper */
#po-news-top-view:not([hidden]){
  display:flex!important;
  flex-direction:column!important;
}

#po-news-top-view[hidden],
#po-news-category-view[hidden]{
  display:none!important;
}


/* =========================================================
V107 / AVIATION RESOURCES INTRO
Parent 航空情報・資料 now opens a conversation-first overview.
Country/resource buttons open the actual link library.
========================================================= */
.po-resources-intro-view{
  height:100%;
  overflow-y:auto;
  background:var(--po-paper);
  scrollbar-width:thin;
  scrollbar-color:#aaa59b transparent;
}

.po-resources-intro-inner{
  width:min(100%,1180px);
  margin:0 auto;
  padding:clamp(30px,3.5vw,56px) clamp(30px,4vw,68px) 64px;
}

.po-resources-intro-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);
  gap:42px;
  align-items:end;
  padding-bottom:24px;
  border-bottom:1px solid var(--po-line);
}

.po-resources-intro-head h1{
  margin:14px 0 0;
  color:var(--po-ink);
  font-size:clamp(48px,5vw,78px);
  font-weight:950;
  line-height:.94;
  letter-spacing:-.055em;
}

.po-resources-intro-head>p:last-child{
  margin:0;
  color:var(--po-copy);
  font-size:13px;
  line-height:1.85;
}

.po-resources-chat{
  display:grid;
  gap:12px;
  margin-top:28px;
}

.po-resources-chat-row{
  display:grid;
  grid-template-columns:82px minmax(0,1fr);
  gap:18px;
  align-items:start;
}

.po-resources-chat-row.is-captain{
  grid-template-columns:minmax(0,1fr) 82px;
}

.po-resources-chat-row.is-captain .po-resources-avatar{
  grid-column:2;
}

.po-resources-chat-row.is-captain p{
  grid-column:1;
  grid-row:1;
  justify-self:end;
  background:#f2eadc;
}

.po-resources-avatar{
  display:grid;
  place-items:center;
  min-height:70px;
  border:1px solid #c7c0b5;
  background:#f8f5ef;
}

.po-resources-avatar span{
  color:var(--po-gold);
  font-size:10px;
  font-weight:950;
  letter-spacing:.08em;
}

.po-resources-avatar small{
  margin-top:3px;
  color:#7d817f;
  font-size:7px;
  font-weight:900;
}

.po-resources-chat-row p{
  max-width:820px;
  margin:0;
  padding:18px 20px;
  border:1px solid #d0c9bf;
  background:#fff;
  color:var(--po-ink);
  font-size:13px;
  line-height:1.9;
}

.po-resources-chat-row p strong{
  color:#9b6d25;
  font-weight:950;
}

.po-resources-guide-lines{
  margin-top:32px;
  border-top:1px solid #c9c3b9;
}

.po-resources-guide-line{
  display:grid;
  grid-template-columns:150px 220px minmax(0,1fr);
  gap:22px;
  align-items:center;
  min-height:72px;
  padding:10px 4px;
  border-bottom:1px solid #d8d2c8;
}

.po-resources-guide-line small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}

.po-resources-guide-line strong{
  color:var(--po-ink);
  font-size:14px;
  font-weight:950;
}

.po-resources-guide-line span{
  color:#686d70;
  font-size:12px;
  line-height:1.65;
}

.po-resources-chat-bottom{
  margin-top:32px;
}

.po-resources-intro-cta{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  margin-top:30px;
  padding:18px 20px;
  border:1px solid #b9b3aa;
  border-left:4px solid var(--po-gold);
  background:#fbfaf7;
}

.po-resources-intro-cta span{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}

.po-resources-intro-cta strong{
  color:var(--po-ink);
  font-size:12px;
  font-weight:900;
}

#po-resources-intro-view[hidden],
#po-resources-library-view[hidden]{
  display:none!important;
}

@media(max-width:1180px) and (min-width:901px){
  .po-resources-intro-head{
    grid-template-columns:1fr;
  }

  .po-resources-guide-line{
    grid-template-columns:130px 190px minmax(0,1fr);
  }
}

@media(max-width:900px){
  .po-resources-intro-inner{
    padding:26px 18px 46px;
  }

  .po-resources-intro-head{
    grid-template-columns:1fr;
  }

  .po-resources-chat-row,
  .po-resources-chat-row.is-captain{
    grid-template-columns:58px minmax(0,1fr);
  }

  .po-resources-chat-row.is-captain .po-resources-avatar{
    grid-column:1;
  }

  .po-resources-chat-row.is-captain p{
    grid-column:2;
    grid-row:1;
    justify-self:stretch;
  }

  .po-resources-avatar{
    min-height:58px;
  }

  .po-resources-guide-line{
    grid-template-columns:1fr;
    gap:5px;
    padding:14px 0;
  }

  .po-resources-intro-cta{
    display:block;
  }

  .po-resources-intro-cta strong{
    display:block;
    margin-top:7px;
  }
}


/* =========================================================
V108 / AVIATION RESOURCES INTRO = FAA OVERVIEW BASE
Reuse the proven Course Library overview layout so title,
conversation spacing, avatars and guide rows stay consistent.
========================================================= */
#po-resources-intro-view{
  height:100%;
  min-height:0;
  overflow:hidden;
  background:var(--po-paper);
}

#po-resources-intro-view .po-resources-intro-catalog{
  height:100%;
  min-height:0;
}

#po-resources-intro-view .po-resources-overview{
  display:block;
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:22px clamp(10px,2.2vw,34px) 30px;
  scrollbar-width:thin;
  scrollbar-color:#aaa59b transparent;
}

#po-resources-intro-view .po-catalog-head h1{
  white-space:normal;
}

#po-resources-intro-view .po-catalog-head p strong{
  color:var(--po-ink);
  font-weight:950;
}

#po-resources-intro-view .po-faa-license-guide,
#po-resources-intro-view .po-faa-audience-list{
  margin-right:78px;
}

#po-resources-intro-view .po-resources-overview::-webkit-scrollbar{
  width:5px;
}

#po-resources-intro-view .po-resources-overview::-webkit-scrollbar-track{
  background:transparent;
}

#po-resources-intro-view .po-resources-overview::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:#aaa59b;
}

@media(min-width:901px) and (max-height:820px){
  #po-resources-intro-view .po-resources-overview{
    padding-top:10px;
    padding-bottom:18px;
  }
}

@media(max-width:900px){
  #po-resources-intro-view{
    overflow:visible;
  }

  #po-resources-intro-view .po-resources-intro-catalog{
    height:auto;
    overflow:visible;
  }

  #po-resources-intro-view .po-resources-overview{
    overflow:visible;
    padding:18px 0 30px;
  }
}


/* =========================================================
V109 / LARGER GUIDE SUBMENUS
Make Aviation News and Aviation Resources submenus easier to read,
matching the stronger visual weight of the Course Library navigation.
========================================================= */
@media(min-width:901px){
  .po-global-news-submenu,
  .po-global-resource-submenu{
    margin-left:18px!important;
    padding-left:10px!important;
  }

  .po-global-news-submenu button,
  .po-global-resource-submenu button{
    grid-template-columns:44px minmax(0,1fr) 18px!important;
    gap:10px!important;
    min-height:44px!important;
    padding:7px 10px!important;
  }

  .po-global-news-submenu small,
  .po-global-resource-submenu small{
    display:grid!important;
    place-items:center!important;
    width:40px!important;
    min-width:40px!important;
    height:28px!important;
    border:1px solid rgba(255,255,255,.12)!important;
    color:var(--po-gold-2)!important;
    font-size:8px!important;
    font-weight:950!important;
    letter-spacing:.03em!important;
  }

  .po-global-news-submenu strong,
  .po-global-resource-submenu strong{
    font-size:12px!important;
    font-weight:850!important;
    line-height:1.3!important;
  }

  .po-global-news-submenu b,
  .po-global-resource-submenu b{
    font-size:12px!important;
  }

  .po-global-news-group.is-open .po-global-news-submenu{
    max-height:460px!important;
  }

  .po-global-resource-group.is-open .po-global-resource-submenu{
    max-height:1600px!important;
  }
}

@media(min-width:901px) and (max-width:1320px){
  .po-global-news-submenu,
  .po-global-resource-submenu{
    margin-left:12px!important;
    padding-left:8px!important;
  }

  .po-global-news-submenu button,
  .po-global-resource-submenu button{
    grid-template-columns:40px minmax(0,1fr) 16px!important;
    min-height:42px!important;
    padding:6px 8px!important;
  }

  .po-global-news-submenu small,
  .po-global-resource-submenu small{
    width:36px!important;
    min-width:36px!important;
    height:26px!important;
  }

  .po-global-news-submenu strong,
  .po-global-resource-submenu strong{
    font-size:11px!important;
  }
}


/* =========================================================
V111 / EXPANDABLE CAREER STORIES + INLINE YOUR STORY FORM
Parent 03 = Career Stories wall.
YOU submenu = submission form in the same right workspace.
========================================================= */
@media(min-width:901px){
  .po-global-career-group{
    flex:0 0 auto;
  }

  .po-global-career-toggle{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:36px minmax(0,1fr) 30px;
    gap:11px;
    align-items:center;
    width:100%;
    min-height:48px;
    padding:7px 10px;
    border:1px solid transparent;
    background:transparent;
    color:#fff;
    text-align:left;
    font-family:inherit;
    cursor:pointer;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
  }

  .po-global-career-toggle:hover,
  .po-global-career-toggle.is-active{
    transform:translateX(2px);
    border-color:rgba(255,255,255,.14);
    background:#242a31;
  }

  .po-global-career-toggle.is-active{
    box-shadow:inset 3px 0 0 var(--po-gold);
  }

  .po-global-career-toggle>span{
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:var(--po-gold-2);
    font-size:9px;
    font-weight:950;
  }

  .po-global-career-toggle>strong{
    color:#fff;
    font-size:14px;
    font-weight:900;
    line-height:1.25;
  }

  .po-global-career-chevron{
    position:relative;
    display:grid;
    width:28px;
    height:28px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:#cfd4d8;
  }

  .po-global-career-chevron:before{
    content:"+";
    font-size:18px;
    font-weight:500;
  }

  .po-global-career-group.is-open .po-global-career-chevron:before{
    content:"−";
  }

  .po-global-career-submenu{
    max-height:0;
    margin:0 0 0 18px;
    padding:0 0 0 10px;
    overflow:hidden;
    border-left:1px solid transparent;
    opacity:0;
    visibility:hidden;
    transition:max-height .3s ease,opacity .2s ease,padding .3s ease,border-color .2s ease,visibility .2s ease;
  }

  .po-global-career-group.is-open .po-global-career-submenu{
    max-height:120px;
    padding-top:6px;
    padding-bottom:6px;
    border-left-color:rgba(211,171,98,.52);
    opacity:1;
    visibility:visible;
  }

  .po-global-career-submenu button{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 18px;
    gap:10px;
    width:100%;
    align-items:center;
    min-height:44px;
    padding:7px 10px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:transparent;
    color:#dfe3e6;
    text-align:left;
    cursor:pointer;
  }

  .po-global-career-submenu button:hover,
  .po-global-career-submenu button.is-active{
    transform:translateX(2px);
    background:rgba(255,255,255,.065);
    color:#fff;
  }

  .po-global-career-submenu button.is-active{
    box-shadow:inset 2px 0 0 var(--po-gold-2);
  }

  .po-global-career-submenu small{
    display:grid;
    place-items:center;
    width:40px;
    height:28px;
    border:1px solid rgba(255,255,255,.12);
    color:var(--po-gold-2);
    font-size:8px;
    font-weight:950;
  }

  .po-global-career-submenu strong{
    font-size:12px;
    font-weight:850;
  }

  .po-global-career-submenu b{
    color:#7f8992;
    font-size:12px;
    font-weight:500;
    text-align:right;
  }
}

.po-careers-view{
  height:100%;
  min-height:0;
}

#po-careers-stories-view{
  display:flex;
  flex-direction:column;
}

.po-career-submit-view{
  overflow-y:auto;
  background:var(--po-paper);
  scrollbar-width:thin;
  scrollbar-color:#aaa59b transparent;
}

.po-career-submit-inner{
  width:min(100%,1180px);
  margin:0 auto;
  padding:clamp(30px,3vw,50px) clamp(30px,4vw,64px) 60px;
}

.po-career-submit-head{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.72fr);
  gap:40px;
  align-items:end;
  padding-bottom:22px;
  border-bottom:1px solid var(--po-line);
}

.po-career-submit-head h1{
  margin:12px 0 0;
  color:var(--po-ink);
  font-size:clamp(42px,4.2vw,68px);
  font-weight:950;
  line-height:.96;
  letter-spacing:-.055em;
}

.po-career-submit-head>p{
  margin:0;
  color:var(--po-copy);
  font-size:13px;
  line-height:1.85;
}

.po-career-submit-guide{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:16px;
  border:1px solid #cbc5bb;
  background:#fbfaf7;
}

.po-career-submit-guide>div{
  padding:14px 16px;
  border-right:1px solid #d8d2c8;
}

.po-career-submit-guide>div:last-child{border-right:0;}

.po-career-submit-guide small{
  display:block;
  margin-bottom:6px;
  color:var(--po-gold);
  font-size:7px;
  font-weight:950;
  letter-spacing:.12em;
}

.po-career-submit-guide strong{
  display:block;
  font-size:13px;
  font-weight:950;
}

.po-career-submit-guide span{
  display:block;
  margin-top:4px;
  color:#777b7e;
  font-size:9px;
}

.po-career-submit-form{
  margin-top:20px;
}

.po-career-form-section{
  margin-top:14px;
  border:1px solid #c9c3b9;
  background:#fbfaf7;
}

.po-career-form-section-head{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:14px;
  align-items:center;
  min-height:70px;
  padding:10px 14px;
  border-bottom:1px solid #d8d1c7;
  background:#f0ece5;
}

.po-career-form-section-head>span{
  display:grid;
  width:40px;
  height:34px;
  place-items:center;
  border:1px solid #c4b493;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
}

.po-career-form-section-head small{
  display:block;
  margin-bottom:3px;
  color:#8f887e;
  font-size:7px;
  font-weight:950;
  letter-spacing:.1em;
}

.po-career-form-section-head h2{
  margin:0;
  font-size:20px;
  font-weight:900;
}

.po-career-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  padding:18px;
}

.po-career-form-grid.is-single{
  grid-template-columns:1fr;
}

.po-career-submit-form label>span{
  display:block;
  margin-bottom:7px;
  color:#686d70;
  font-size:9px;
  font-weight:900;
  letter-spacing:.04em;
}

.po-career-submit-form input,
.po-career-submit-form select,
.po-career-submit-form textarea{
  width:100%;
  border:1px solid #c9c3b9;
  border-radius:0;
  background:#fff;
  color:var(--po-ink);
  font:inherit;
  font-size:12px;
  outline:none;
}

.po-career-submit-form input,
.po-career-submit-form select{
  min-height:48px;
  padding:0 13px;
}

.po-career-submit-form textarea{
  padding:12px 13px;
  resize:vertical;
  line-height:1.7;
}

.po-career-submit-form input:focus,
.po-career-submit-form select:focus,
.po-career-submit-form textarea:focus{
  border-color:var(--po-gold);
  box-shadow:inset 3px 0 0 rgba(183,138,61,.18);
}

.po-career-form-check{
  display:flex!important;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:9px 12px;
  border:1px solid #c9c3b9;
  background:#fff;
}

.po-career-form-check input{
  flex:0 0 auto;
  width:16px!important;
  min-height:0!important;
  height:16px;
  padding:0!important;
}

.po-career-form-check>span{
  margin:0!important;
  line-height:1.5;
}

.po-career-submit-actions{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  padding:0 18px 18px;
}

.po-career-submit-actions p{
  max-width:620px;
  margin:0;
  color:#777b7e;
  font-size:10px;
  line-height:1.6;
}

.po-career-submit-actions button{
  min-width:220px;
  min-height:54px;
  border:0;
  background:var(--po-dark);
  color:#fff;
  font-size:10px;
  font-weight:950;
  letter-spacing:.08em;
  cursor:pointer;
}

.po-career-submit-actions button:hover{
  background:#2a3036;
}

.po-career-form-status{
  margin:0 18px 18px;
  padding:12px 14px;
  border:1px solid #c9c3b9;
  background:#f2eadc;
  color:var(--po-ink);
  font-size:10px;
  line-height:1.6;
}

#po-careers-stories-view[hidden],
#po-careers-submit-view[hidden]{
  display:none!important;
}

@media(max-width:1180px) and (min-width:901px){
  .po-career-submit-head{
    grid-template-columns:1fr;
  }
}

@media(max-width:900px){
  .po-career-submit-inner{
    padding:26px 18px 46px;
  }

  .po-career-submit-head,
  .po-career-submit-guide,
  .po-career-form-grid{
    grid-template-columns:1fr;
  }

  .po-career-submit-guide>div{
    border-right:0;
    border-bottom:1px solid #d8d2c8;
  }

  .po-career-submit-guide>div:last-child{
    border-bottom:0;
  }

  .po-career-submit-actions{
    display:block;
  }

  .po-career-submit-actions button{
    width:100%;
    margin-top:14px;
  }
}


/* =========================================================
V112 / FULL CAREER STORY SUBMISSION FORM
Collects enough material for Profile / Story Summary / Career Route /
Interview / Extra Q&A / Media / Review.
========================================================= */
.po-career-field-note{
  display:block;
  margin-top:7px;
  color:#8a8d8f;
  font-size:8px;
  line-height:1.55;
}

.po-career-highlight-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  border-top:1px solid #e1dcd3;
}

.po-career-route-help,
.po-career-interview-intro{
  display:flex;
  justify-content:space-between;
  gap:22px;
  align-items:center;
  margin:16px 18px 0;
  padding:12px 14px;
  border:1px solid #d6d0c6;
  border-left:3px solid var(--po-gold);
  background:#f5f1e9;
}

.po-career-route-help strong,
.po-career-interview-intro strong{
  color:var(--po-ink);
  font-size:11px;
  font-weight:950;
}

.po-career-route-help span,
.po-career-interview-intro span{
  color:#74787c;
  font-size:9px;
  line-height:1.55;
  text-align:right;
}

.po-career-repeat-list{
  display:grid;
  gap:8px;
  padding:14px 18px 0;
}

.po-career-repeat-item{
  position:relative;
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 30px;
  gap:12px;
  align-items:start;
  padding:14px;
  border:1px solid #d2ccc3;
  background:#fff;
}

.po-career-repeat-number{
  display:grid;
  place-items:center;
  min-height:38px;
  border:1px solid #c9b88f;
  background:#fbf7ef;
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
}

.po-career-repeat-fields{
  min-width:0;
}

.po-career-repeat-fields>.po-career-form-grid{
  padding:0 0 12px!important;
}

.po-career-repeat-fields>label>span{
  display:block;
  margin-bottom:7px;
  color:#686d70;
  font-size:9px;
  font-weight:900;
  letter-spacing:.04em;
}

.po-career-repeat-fields>label textarea,
.po-career-repeat-fields>label input{
  width:100%;
}

.po-career-repeat-remove{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  padding:0;
  border:1px solid #d2ccc3;
  background:#fff;
  color:#7a7e80;
  font-size:16px;
  cursor:pointer;
}

.po-career-repeat-remove:hover{
  border-color:#b78a3d;
  color:var(--po-gold);
  background:#fffaf0;
}

.po-career-repeat-actions{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  padding:12px 18px 18px;
}

.po-career-repeat-actions button{
  min-height:42px;
  padding:0 16px;
  border:1px solid #b9b3aa;
  background:#fbfaf7;
  color:var(--po-ink);
  font-size:9px;
  font-weight:950;
  cursor:pointer;
}

.po-career-repeat-actions button:hover{
  border-color:#b78a3d;
  background:#f2eadc;
}

.po-career-repeat-actions span{
  color:#7b7f82;
  font-size:8px;
}

.po-career-interview-fields{
  padding-top:14px!important;
}

.po-career-interview-fields label{
  padding-bottom:4px;
}

.po-career-repeat-item.is-qa{
  grid-template-columns:46px minmax(0,1fr) 30px;
}

.po-career-review-points{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  margin:18px;
  border:1px solid #d2ccc3;
  background:#fff;
}

.po-career-review-points>div{
  padding:14px;
  border-right:1px solid #e0dad1;
}

.po-career-review-points>div:last-child{
  border-right:0;
}

.po-career-review-points strong{
  display:block;
  margin-bottom:5px;
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
}

.po-career-review-points span{
  color:#666b6e;
  font-size:9px;
  line-height:1.55;
}

@media(max-width:1180px) and (min-width:901px){
  .po-career-highlight-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:900px){
  .po-career-highlight-grid{
    grid-template-columns:1fr!important;
  }

  .po-career-route-help,
  .po-career-interview-intro{
    display:block;
  }

  .po-career-route-help span,
  .po-career-interview-intro span{
    display:block;
    margin-top:5px;
    text-align:left;
  }

  .po-career-repeat-item,
  .po-career-repeat-item.is-qa{
    grid-template-columns:38px minmax(0,1fr);
  }

  .po-career-repeat-remove{
    position:absolute;
    top:10px;
    right:10px;
  }

  .po-career-repeat-actions{
    display:block;
  }

  .po-career-repeat-actions span{
    display:block;
    margin-top:7px;
  }

  .po-career-review-points{
    grid-template-columns:1fr;
  }

  .po-career-review-points>div{
    border-right:0;
    border-bottom:1px solid #e0dad1;
  }

  .po-career-review-points>div:last-child{
    border-bottom:0;
  }
}


/* =========================================================
V113 / CAREER FORM TITLE = 2 LINES
Keep the hero headline to exactly two lines on desktop.
========================================================= */
@media(min-width:901px){
  .po-career-submit-head{
    grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr)!important;
  }

  .po-career-submit-head h1{
    font-size:clamp(36px,3.2vw,52px)!important;
    line-height:.98!important;
    letter-spacing:-.05em!important;
  }

  .po-career-submit-head h1>span{
    display:block!important;
    white-space:nowrap!important;
  }
}

@media(max-width:1180px) and (min-width:901px){
  .po-career-submit-head{
    grid-template-columns:1fr!important;
  }

  .po-career-submit-head h1>span{
    white-space:normal!important;
  }
}


/* =========================================================
V114 / SHAREABLE CAREER FORM URL
Opening the form writes #career-story-form into the URL.
Direct visits to that hash open the same form automatically.
========================================================= */
.po-career-submit-head-copy>p{
  margin:0;
  color:var(--po-copy);
  font-size:13px;
  line-height:1.85;
}

.po-career-submit-head-copy>small{
  display:block;
  margin-top:12px;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.08em;
  word-break:break-all;
}


/* =========================================================
V115 / EXPANDABLE "HOW TO BECOME A PILOT"
Parent = existing 5-route comparison.
Children = route explanation pages + premium guide gate.
========================================================= */
@media(min-width:901px){
  .po-global-become-group{
    flex:0 0 auto;
  }

  .po-global-become-toggle{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:36px minmax(0,1fr) 30px;
    gap:11px;
    align-items:center;
    width:100%;
    min-height:48px;
    padding:7px 10px;
    border:1px solid transparent;
    background:transparent;
    color:#fff;
    text-align:left;
    font-family:inherit;
    cursor:pointer;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
  }

  .po-global-become-toggle:hover,
  .po-global-become-toggle.is-active{
    transform:translateX(2px);
    border-color:rgba(255,255,255,.14);
    background:#242a31;
  }

  .po-global-become-toggle.is-active{
    box-shadow:inset 3px 0 0 var(--po-gold);
  }

  .po-global-become-toggle>span{
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:var(--po-gold-2);
    font-size:9px;
    font-weight:950;
  }

  .po-global-become-toggle>strong{
    color:#fff;
    font-size:14px;
    font-weight:900;
    line-height:1.25;
  }

  .po-global-become-chevron{
    position:relative;
    display:grid;
    width:28px;
    height:28px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:#cfd4d8;
  }

  .po-global-become-chevron:before{
    content:"+";
    font-size:18px;
    font-weight:500;
  }

  .po-global-become-group.is-open .po-global-become-chevron:before{
    content:"−";
  }

  .po-global-become-submenu{
    max-height:0;
    margin:0 0 0 18px;
    padding:0 0 0 10px;
    overflow:hidden;
    border-left:1px solid transparent;
    opacity:0;
    visibility:hidden;
    transition:max-height .3s ease,opacity .2s ease,padding .3s ease,border-color .2s ease,visibility .2s ease;
  }

  .po-global-become-group.is-open .po-global-become-submenu{
    max-height:320px;
    padding-top:6px;
    padding-bottom:6px;
    border-left-color:rgba(211,171,98,.52);
    opacity:1;
    visibility:visible;
  }

  .po-global-become-submenu button{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 18px;
    gap:10px;
    width:100%;
    align-items:center;
    min-height:44px;
    padding:7px 10px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:transparent;
    color:#dfe3e6;
    text-align:left;
    cursor:pointer;
    transition:background .16s ease,color .16s ease,transform .16s ease;
  }

  .po-global-become-submenu button:last-child{border-bottom:0;}

  .po-global-become-submenu button:hover,
  .po-global-become-submenu button.is-active{
    transform:translateX(2px);
    background:rgba(255,255,255,.065);
    color:#fff;
  }

  .po-global-become-submenu button.is-active{
    box-shadow:inset 2px 0 0 var(--po-gold-2);
  }

  .po-global-become-submenu small{
    display:grid;
    place-items:center;
    width:40px;
    height:28px;
    border:1px solid rgba(255,255,255,.12);
    color:var(--po-gold-2);
    font-size:8px;
    font-weight:950;
  }

  .po-global-become-submenu strong{
    font-size:12px;
    font-weight:850;
  }

  .po-global-become-submenu b{
    color:#7f8992;
    font-size:12px;
    font-weight:500;
    text-align:right;
  }
}

#po-become-overview-view,
#po-become-route-view{
  height:100%;
  min-height:0;
}

.po-become-route-view{
  overflow-y:auto;
  background:var(--po-paper);
  scrollbar-width:thin;
  scrollbar-color:#aaa59b transparent;
}

.po-become-route-inner{
  width:min(100%,1180px);
  margin:0 auto;
  padding:clamp(30px,3vw,50px) clamp(30px,4vw,64px) 60px;
}

.po-become-route-head{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);
  gap:34px;
  align-items:end;
  padding-bottom:22px;
  border-bottom:1px solid var(--po-line);
}

.po-become-route-head h1{
  margin:12px 0 12px;
  color:var(--po-ink);
  font-size:clamp(48px,4.7vw,74px);
  font-weight:950;
  line-height:.94;
  letter-spacing:-.055em;
}

.po-become-route-head>div>p:last-child{
  max-width:760px;
  margin:0;
  color:var(--po-copy);
  font-size:13px;
  line-height:1.8;
}

.po-become-route-summary{
  display:grid;
  border:1px solid #c9c3b9;
  background:#fbfaf7;
}

.po-become-route-summary>div{
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  gap:12px;
  align-items:center;
  min-height:52px;
  padding:8px 12px;
  border-bottom:1px solid #ddd7ce;
}

.po-become-route-summary>div:last-child{border-bottom:0;}

.po-become-route-summary small{
  color:var(--po-gold);
  font-size:7px;
  font-weight:950;
  letter-spacing:.11em;
}

.po-become-route-summary strong{
  color:var(--po-ink);
  font-size:10px;
  font-weight:950;
  line-height:1.4;
}

.po-become-route-chat{
  display:grid;
  gap:12px;
  margin-top:24px;
}

.po-become-section-head{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:end;
  margin-bottom:10px;
}

.po-become-section-head small,
.po-become-premium-head small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.13em;
}

.po-become-section-head h2,
.po-become-premium-head h2{
  margin:5px 0 0;
  color:var(--po-ink);
  font-size:24px;
  font-weight:950;
  letter-spacing:-.03em;
}

.po-become-section-head>span,
.po-become-premium-head>span{
  color:#74787c;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
}

.po-become-route-free,
.po-become-route-flow{
  margin-top:28px;
}

.po-become-route-lines{
  border-top:1px solid #c9c3b9;
}

.po-become-route-line{
  display:grid;
  grid-template-columns:150px 220px minmax(0,1fr);
  gap:22px;
  align-items:center;
  min-height:66px;
  padding:10px 4px;
  border-bottom:1px solid #d8d2c8;
}

.po-become-route-line small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.1em;
}

.po-become-route-line strong{
  color:var(--po-ink);
  font-size:13px;
  font-weight:950;
}

.po-become-route-line span{
  color:#686d70;
  font-size:11px;
  line-height:1.65;
}

.po-become-flow-list{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border:1px solid #c9c3b9;
  background:#fbfaf7;
}

.po-become-flow-step{
  position:relative;
  min-height:122px;
  padding:16px;
  border-right:1px solid #ddd7ce;
}

.po-become-flow-step:last-child{border-right:0;}

.po-become-flow-step small{
  display:block;
  margin-bottom:14px;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
}

.po-become-flow-step strong{
  display:block;
  margin-bottom:7px;
  color:var(--po-ink);
  font-size:13px;
  font-weight:950;
}

.po-become-flow-step p{
  margin:0;
  color:#6d7275;
  font-size:9.5px;
  line-height:1.6;
}

.po-become-premium{
  margin-top:32px;
  border:1px solid #aa9f90;
  border-top:5px solid var(--po-gold);
  background:#f7f3eb;
}

.po-become-premium-head{
  display:flex;
  justify-content:space-between;
  gap:30px;
  align-items:start;
  padding:20px 22px;
  border-bottom:1px solid #d7cfc3;
}

.po-become-premium-head p{
  max-width:760px;
  margin:8px 0 0;
  color:#656a6d;
  font-size:11px;
  line-height:1.7;
}

.po-become-premium-preview{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  border-bottom:1px solid #d7cfc3;
}

.po-become-premium-preview>div{
  min-height:92px;
  padding:15px 16px;
  border-right:1px solid #d7cfc3;
  background:rgba(255,255,255,.48);
}

.po-become-premium-preview>div:nth-child(3n){border-right:0;}

.po-become-premium-preview small{
  display:block;
  margin-bottom:7px;
  color:var(--po-gold);
  font-size:7px;
  font-weight:950;
  letter-spacing:.09em;
}

.po-become-premium-preview strong{
  display:block;
  color:var(--po-ink);
  font-size:11px;
  font-weight:900;
  line-height:1.4;
}

.po-become-premium-lock{
  display:grid;
  grid-template-columns:62px minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:18px 22px;
  background:rgba(255,255,255,.75);
}

.po-become-lock-icon{
  display:grid;
  place-items:center;
  width:56px;
  height:46px;
  border:1px solid #b9b3aa;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.08em;
}

.po-become-premium-lock small{
  display:block;
  margin-bottom:4px;
  color:var(--po-gold);
  font-size:7px;
  font-weight:950;
  letter-spacing:.1em;
}

.po-become-premium-lock strong{
  display:block;
  color:var(--po-ink);
  font-size:12px;
  font-weight:950;
}

.po-become-premium-lock p{
  margin:5px 0 0;
  color:#73777a;
  font-size:9px;
  line-height:1.55;
}

.po-become-premium-lock a{
  display:grid;
  place-items:center;
  min-height:48px;
  padding:0 16px;
  background:var(--po-dark);
  color:#fff!important;
  text-decoration:none!important;
  font-size:9px;
  font-weight:950;
  white-space:nowrap;
}

#po-become-overview-view[hidden],
#po-become-route-view[hidden]{
  display:none!important;
}

@media(max-width:1180px) and (min-width:901px){
  .po-become-route-head{
    grid-template-columns:1fr;
  }

  .po-become-route-line{
    grid-template-columns:130px 190px minmax(0,1fr);
  }

  .po-become-flow-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .po-become-flow-step:nth-child(2){
    border-right:0;
  }

  .po-become-flow-step:nth-child(-n+2){
    border-bottom:1px solid #ddd7ce;
  }

  .po-become-premium-lock{
    grid-template-columns:62px minmax(0,1fr);
  }

  .po-become-premium-lock a{
    grid-column:1 / -1;
  }
}

@media(max-width:900px){
  .po-become-route-inner{
    padding:26px 18px 46px;
  }

  .po-become-route-head,
  .po-become-route-line,
  .po-become-flow-list,
  .po-become-premium-preview,
  .po-become-premium-lock{
    grid-template-columns:1fr;
  }

  .po-become-flow-step{
    border-right:0;
    border-bottom:1px solid #ddd7ce;
  }

  .po-become-flow-step:last-child{border-bottom:0;}

  .po-become-premium-preview>div{
    border-right:0;
    border-bottom:1px solid #d7cfc3;
  }

  .po-become-premium-preview>div:last-child{border-bottom:0;}
}


/* =========================================================
V116 / CADET LONG-FORM PAYWALL SAMPLE
Conversation → List → Conversation → Panels → blurred teaser → Unlock
========================================================= */
.po-cadet-longform{
  margin-top:26px;
}

.po-cadet-free-list,
.po-cadet-panel-section{
  margin-top:30px;
}

.po-cadet-point-list{
  border-top:1px solid #c9c3b9;
}

.po-cadet-point{
  display:grid;
  grid-template-columns:140px 260px minmax(0,1fr);
  gap:22px;
  align-items:center;
  min-height:78px;
  padding:12px 4px;
  border-bottom:1px solid #d8d2c8;
}

.po-cadet-point small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.1em;
}

.po-cadet-point strong{
  color:var(--po-ink);
  font-size:13px;
  font-weight:950;
  line-height:1.45;
}

.po-cadet-point p{
  margin:0;
  color:#686d70;
  font-size:11px;
  line-height:1.7;
}

.po-cadet-mid-chat,
.po-cadet-teaser-chat{
  display:grid;
  gap:12px;
  margin-top:32px;
}

.po-cadet-card-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border:1px solid #c9c3b9;
  background:#fbfaf7;
}

.po-cadet-card{
  min-height:160px;
  padding:20px 18px;
  border-right:1px solid #ddd7ce;
}

.po-cadet-card:last-child{
  border-right:0;
}

.po-cadet-card small{
  display:block;
  margin-bottom:18px;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}

.po-cadet-card strong{
  display:block;
  margin-bottom:8px;
  color:var(--po-ink);
  font-size:17px;
  font-weight:950;
}

.po-cadet-card p{
  margin:0;
  color:#6d7275;
  font-size:10px;
  line-height:1.7;
}

/* Paywall teaser */
.po-cadet-paywall{
  position:relative;
  min-height:560px;
  margin-top:26px;
  overflow:hidden;
  border-top:1px solid #c9c3b9;
  background:#f7f3eb;
}

.po-cadet-locked-content{
  padding:30px 4px 80px;
  filter:blur(7px);
  opacity:.64;
  transform:scale(1.012);
  transform-origin:center top;
  user-select:none;
  pointer-events:none;
}

.po-cadet-locked-chat{
  display:grid;
  grid-template-columns:70px minmax(0,1fr);
  gap:18px;
  align-items:start;
  max-width:860px;
}

.po-cadet-ghost-avatar{
  height:64px;
  border:1px solid #c9c3b9;
  background:#ece7dd;
}

.po-cadet-ghost-lines{
  min-height:76px;
  padding:18px;
  border:1px solid #d2ccc3;
  background:#fff;
}

.po-cadet-ghost-lines span{
  display:block;
  height:8px;
  margin-bottom:10px;
  background:#bdb8af;
}

.po-cadet-ghost-lines span:nth-child(1){width:84%;}
.po-cadet-ghost-lines span:nth-child(2){width:70%;}
.po-cadet-ghost-lines span:nth-child(3){width:54%;}

.po-cadet-locked-list{
  margin-top:28px;
  border-top:1px solid #c9c3b9;
}

.po-cadet-locked-list>div{
  display:grid;
  grid-template-columns:80px 220px minmax(0,1fr);
  gap:18px;
  min-height:66px;
  align-items:center;
  border-bottom:1px solid #d8d2c8;
}

.po-cadet-locked-list small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
}

.po-cadet-locked-list strong{
  font-size:13px;
  font-weight:950;
}

.po-cadet-locked-list p{
  margin:0;
  color:#6d7275;
  font-size:10px;
}

.po-cadet-locked-panels{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:28px;
  border:1px solid #c9c3b9;
}

.po-cadet-locked-panels>div{
  min-height:116px;
  padding:18px;
  border-right:1px solid #d8d2c8;
  background:#fff;
}

.po-cadet-locked-panels>div:last-child{border-right:0;}

.po-cadet-locked-panels small{
  display:block;
  margin-bottom:14px;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
}

.po-cadet-locked-panels strong{
  font-size:15px;
  font-weight:950;
}

/* Gradual fade from visible/free into locked area */
.po-cadet-paywall-fade{
  position:absolute;
  z-index:2;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(
      to bottom,
      rgba(247,243,235,0) 0%,
      rgba(247,243,235,.08) 14%,
      rgba(247,243,235,.52) 36%,
      rgba(247,243,235,.88) 62%,
      rgba(247,243,235,.98) 100%
    );
}

.po-cadet-unlock{
  position:absolute;
  z-index:3;
  top:48%;
  left:50%;
  width:min(90%,560px);
  transform:translate(-50%,-50%);
  padding:28px 30px;
  border:1px solid #9e9588;
  border-top:5px solid var(--po-gold);
  background:rgba(255,255,255,.96);
  box-shadow:0 20px 50px rgba(22,25,28,.14);
  text-align:center;
}

.po-cadet-unlock small{
  display:block;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.14em;
}

.po-cadet-unlock strong{
  display:block;
  margin-top:10px;
  color:var(--po-ink);
  font-size:22px;
  font-weight:950;
  line-height:1.25;
  letter-spacing:-.025em;
}

.po-cadet-unlock p{
  max-width:460px;
  margin:10px auto 18px;
  color:#676c6f;
  font-size:11px;
  line-height:1.7;
}

.po-cadet-unlock a{
  display:flex;
  justify-content:center;
  align-items:center;
  width:min(100%,360px);
  min-height:56px;
  margin:0 auto;
  background:var(--po-dark);
  color:#fff!important;
  text-decoration:none!important;
  font-size:10px;
  font-weight:950;
  letter-spacing:.08em;
}

.po-cadet-unlock>span{
  display:block;
  margin-top:10px;
  color:#8a8d8f;
  font-size:7px;
  font-weight:900;
  letter-spacing:.1em;
}

.po-become-route-view.is-cadet-sample .po-become-route-free,
.po-become-route-view.is-cadet-sample .po-become-route-flow,
.po-become-route-view.is-cadet-sample .po-become-premium{
  display:none!important;
}

@media(max-width:1180px) and (min-width:901px){
  .po-cadet-point{
    grid-template-columns:120px 220px minmax(0,1fr);
  }

  .po-cadet-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .po-cadet-card:nth-child(2){
    border-right:0;
  }

  .po-cadet-card:nth-child(-n+2){
    border-bottom:1px solid #ddd7ce;
  }
}

@media(max-width:900px){
  .po-cadet-point{
    grid-template-columns:1fr;
    gap:5px;
    padding:14px 0;
  }

  .po-cadet-card-grid,
  .po-cadet-locked-panels{
    grid-template-columns:1fr;
  }

  .po-cadet-card,
  .po-cadet-locked-panels>div{
    border-right:0;
    border-bottom:1px solid #ddd7ce;
  }

  .po-cadet-card:last-child,
  .po-cadet-locked-panels>div:last-child{
    border-bottom:0;
  }

  .po-cadet-paywall{
    min-height:620px;
  }

  .po-cadet-unlock{
    width:calc(100% - 24px);
    padding:22px 18px;
  }

  .po-cadet-locked-list>div{
    grid-template-columns:1fr;
    gap:4px;
    padding:12px 0;
  }
}


/* =========================================================
V117 / ROUTE PANELS = DIRECT NAVIGATION
The five route cards at the bottom of "パイロットになるには"
now open the matching expanded-menu route.
========================================================= */
@media(min-width:901px){
  .po-scene[data-panel="become"] .po-route[data-route]{
    cursor:pointer!important;
  }

  .po-scene[data-panel="become"] .po-route[data-route]:hover{
    border-color:var(--po-gold)!important;
    box-shadow:0 12px 28px rgba(76,59,31,.10)!important;
    transform:translateY(-2px)!important;
  }

  .po-scene[data-panel="become"] .po-route[data-route]:focus-visible{
    outline:2px solid var(--po-gold)!important;
    outline-offset:3px!important;
  }
}


/* =========================================================
V118 / DARKER HEADER + FOOTER
Keep the center workspace unchanged; only strengthen the outer frame.
========================================================= */
.po-header{
  background:#11161b!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 5px 18px rgba(0,0,0,.10)!important;
}

.po-logo{
  color:#fff!important;
}

.po-logo small{
  color:rgba(255,255,255,.68)!important;
}

.po-header-typing{
  color:#f4f1e9!important;
}

.po-header-typing:before{
  background:rgba(255,255,255,.24)!important;
}

.po-head-btn{
  border-color:rgba(255,255,255,.30)!important;
  background:rgba(255,255,255,.07)!important;
  color:#fff!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
}

.po-head-btn:hover,
.po-head-btn[aria-expanded="true"]{
  border-color:var(--po-gold-2)!important;
  background:#252c33!important;
  color:#fff!important;
}

.po-site-footer{
  border-top:1px solid rgba(255,255,255,.09)!important;
  background:#11161b!important;
  color:rgba(255,255,255,.62)!important;
}

@media(max-width:900px){
  .po-header{
    background:#11161b!important;
  }

  .po-site-footer{
    background:#11161b!important;
  }
}


/* =========================================================
V119 / SOFT HEADER + FOOTER
Based on the main paper background (#f3f1eb), only slightly darker.
========================================================= */
.po-header{
  background:#e1ddd4!important;
  border-bottom:1px solid #d1cbc1!important;
  box-shadow:none!important;
}

.po-logo{
  color:var(--po-ink)!important;
}

.po-logo small{
  color:#777168!important;
}

.po-header-typing{
  color:var(--po-ink)!important;
}

.po-header-typing:before{
  background:rgba(23,27,32,.20)!important;
}

.po-head-btn{
  border-color:rgba(23,27,32,.34)!important;
  background:rgba(255,255,255,.34)!important;
  color:var(--po-ink)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
}

.po-head-btn:hover,
.po-head-btn[aria-expanded="true"]{
  border-color:var(--po-dark)!important;
  background:var(--po-dark)!important;
  color:#fff!important;
}

.po-site-footer{
  border-top:1px solid #d1cbc1!important;
  background:#e1ddd4!important;
  color:#777168!important;
}

@media(max-width:900px){
  .po-header,
  .po-site-footer{
    background:#e1ddd4!important;
  }

  .po-site-footer{
    color:#777168!important;
  }
}


/* =========================================================
V121 / GUIDE 02 LABEL + LARGER GOLD TABLE LABELS
========================================================= */
.po-cadet-point small{
  font-size:10px!important;
  line-height:1.25!important;
  letter-spacing:.08em!important;
}

.po-become-section-head small{
  font-size:9px!important;
}


/* =========================================================
V122 / EXPANDABLE LEARNING GUIDE
02 "何を学べばいい？"
========================================================= */
@media(min-width:901px){
  .po-global-learning-group{
    flex:0 0 auto;
  }

  .po-global-learning-toggle{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:36px minmax(0,1fr) 30px;
    gap:11px;
    align-items:center;
    width:100%;
    min-height:48px;
    padding:7px 10px;
    border:1px solid transparent;
    background:transparent;
    color:#fff;
    text-align:left;
    font-family:inherit;
    cursor:pointer;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
  }

  .po-global-learning-toggle:hover,
  .po-global-learning-toggle.is-active{
    transform:translateX(2px);
    border-color:rgba(255,255,255,.14);
    background:#242a31;
  }

  .po-global-learning-toggle.is-active{
    box-shadow:inset 3px 0 0 var(--po-gold);
  }

  .po-global-learning-toggle>span{
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:var(--po-gold-2);
    font-size:9px;
    font-weight:950;
  }

  .po-global-learning-toggle>strong{
    color:#fff;
    font-size:14px;
    font-weight:900;
    line-height:1.25;
  }

  .po-global-learning-chevron{
    position:relative;
    display:grid;
    width:28px;
    height:28px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:#cfd4d8;
  }

  .po-global-learning-chevron:before{
    content:"+";
    font-size:18px;
    font-weight:500;
  }

  .po-global-learning-group.is-open .po-global-learning-chevron:before{
    content:"−";
  }

  .po-global-learning-submenu{
    max-height:0;
    margin:0 0 0 18px;
    padding:0 0 0 10px;
    overflow:hidden;
    border-left:1px solid transparent;
    opacity:0;
    visibility:hidden;
    transition:max-height .3s ease,opacity .2s ease,padding .3s ease,border-color .2s ease,visibility .2s ease;
  }

  .po-global-learning-group.is-open .po-global-learning-submenu{
    max-height:380px;
    padding-top:6px;
    padding-bottom:6px;
    border-left-color:rgba(211,171,98,.52);
    opacity:1;
    visibility:visible;
  }

  .po-global-learning-submenu button{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 18px;
    gap:10px;
    width:100%;
    align-items:center;
    min-height:44px;
    padding:7px 10px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:transparent;
    color:#dfe3e6;
    text-align:left;
    cursor:pointer;
  }

  .po-global-learning-submenu button:last-child{border-bottom:0;}

  .po-global-learning-submenu button:hover,
  .po-global-learning-submenu button.is-active{
    transform:translateX(2px);
    background:rgba(255,255,255,.065);
    color:#fff;
  }

  .po-global-learning-submenu button.is-active{
    box-shadow:inset 2px 0 0 var(--po-gold-2);
  }

  .po-global-learning-submenu small{
    display:grid;
    place-items:center;
    width:40px;
    height:28px;
    border:1px solid rgba(255,255,255,.12);
    color:var(--po-gold-2);
    font-size:8px;
    font-weight:950;
  }

  .po-global-learning-submenu strong{
    font-size:12px;
    font-weight:850;
  }

  .po-global-learning-submenu b{
    color:#7f8992;
    font-size:12px;
    font-weight:500;
    text-align:right;
  }
}

#po-learning-overview-view,
#po-learning-guide-view{
  height:100%;
  min-height:0;
}

.po-learning-guide-view{
  overflow-y:auto;
  background:var(--po-paper);
  scrollbar-width:thin;
  scrollbar-color:#aaa59b transparent;
}

.po-learning-guide-inner{
  width:min(100%,1180px);
  margin:0 auto;
  padding:clamp(30px,3vw,50px) clamp(30px,4vw,64px) 60px;
}

.po-learning-guide-head{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);
  gap:34px;
  align-items:end;
  padding-bottom:22px;
  border-bottom:1px solid var(--po-line);
}

.po-learning-guide-head h1{
  margin:12px 0;
  color:var(--po-ink);
  font-size:clamp(48px,4.7vw,74px);
  font-weight:950;
  line-height:.94;
  letter-spacing:-.055em;
}

.po-learning-guide-head>div>p:last-child{
  max-width:760px;
  margin:0;
  color:var(--po-copy);
  font-size:13px;
  line-height:1.8;
}

.po-learning-guide-meta{
  display:grid;
  border:1px solid #c9c3b9;
  background:#fbfaf7;
}

.po-learning-guide-meta>div{
  display:grid;
  grid-template-columns:82px minmax(0,1fr);
  gap:12px;
  align-items:center;
  min-height:52px;
  padding:8px 12px;
  border-bottom:1px solid #ddd7ce;
}

.po-learning-guide-meta>div:last-child{border-bottom:0;}

.po-learning-guide-meta small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.1em;
}

.po-learning-guide-meta strong{
  color:var(--po-ink);
  font-size:10px;
  font-weight:950;
}

.po-learning-guide-chat{
  display:grid;
  gap:12px;
  margin-top:24px;
}

.po-learning-guide-section{
  margin-top:30px;
}

.po-learning-roadmap{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  border:1px solid #c9c3b9;
  background:#fbfaf7;
}

.po-learning-roadmap-step{
  min-height:150px;
  padding:17px 15px;
  border-right:1px solid #ddd7ce;
}

.po-learning-roadmap-step:last-child{border-right:0;}

.po-learning-roadmap-step small{
  display:block;
  margin-bottom:14px;
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
  letter-spacing:.08em;
}

.po-learning-roadmap-step strong{
  display:block;
  color:var(--po-ink);
  font-size:14px;
  font-weight:950;
  line-height:1.35;
}

.po-learning-roadmap-step p{
  margin:8px 0 0;
  color:#6b7073;
  font-size:9.5px;
  line-height:1.65;
}

.po-learning-topic-list{
  border-top:1px solid #c9c3b9;
}

.po-learning-topic-row{
  display:grid;
  grid-template-columns:140px 230px minmax(0,1fr);
  gap:22px;
  align-items:center;
  min-height:72px;
  padding:11px 4px;
  border-bottom:1px solid #d8d2c8;
}

.po-learning-topic-row small{
  color:var(--po-gold);
  font-size:10px;
  font-weight:950;
  letter-spacing:.08em;
}

.po-learning-topic-row strong{
  color:var(--po-ink);
  font-size:13px;
  font-weight:950;
}

.po-learning-topic-row span{
  color:#686d70;
  font-size:11px;
  line-height:1.65;
}

.po-learning-guide-chat.is-second{
  margin-top:32px;
}

.po-learning-next-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:30px;
  align-items:center;
  margin-top:30px;
  padding:20px 22px;
  border:1px solid #aaa398;
  border-left:5px solid var(--po-gold);
  background:#f5f1e9;
}

.po-learning-next-panel small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}

.po-learning-next-panel strong{
  display:block;
  margin-top:5px;
  color:var(--po-ink);
  font-size:18px;
  font-weight:950;
}

.po-learning-next-panel p{
  margin:7px 0 0;
  color:#686d70;
  font-size:10px;
  line-height:1.65;
}

.po-learning-next-panel button{
  min-height:50px;
  padding:0 18px;
  border:0;
  background:var(--po-dark);
  color:#fff;
  font-size:9px;
  font-weight:950;
  cursor:pointer;
}

#po-learning-overview-view[hidden],
#po-learning-guide-view[hidden]{
  display:none!important;
}

@media(max-width:1180px) and (min-width:901px){
  .po-learning-guide-head{
    grid-template-columns:1fr;
  }

  .po-learning-roadmap{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .po-learning-roadmap-step{
    border-bottom:1px solid #ddd7ce;
  }
}

@media(max-width:900px){
  .po-learning-guide-inner{
    padding:26px 18px 46px;
  }

  .po-learning-guide-head,
  .po-learning-roadmap,
  .po-learning-topic-row,
  .po-learning-next-panel{
    grid-template-columns:1fr;
  }

  .po-learning-roadmap-step{
    border-right:0;
    border-bottom:1px solid #ddd7ce;
  }

  .po-learning-roadmap-step:last-child{border-bottom:0;}

  .po-learning-topic-row{
    gap:5px;
    padding:14px 0;
  }
}


/* =========================================================
V124 / STANDALONE AVIATION MEDICAL GUIDE
03 航空身体検査 is now a main GUIDE item.
MED also remains under 02 "何を学べばいい？".
========================================================= */
.po-global-item[data-medical-main].is-active{
  transform:translateX(2px);
  border-color:rgba(255,255,255,.14)!important;
  background:#242a31!important;
  box-shadow:inset 3px 0 0 var(--po-gold)!important;
}


/* =========================================================
V125 / EXPANDABLE AVIATION MEDICAL GUIDE
03 航空身体検査
BAS / SYS / CHK / VAL / AME
========================================================= */
@media(min-width:901px){
  .po-global-medical-group{
    flex:0 0 auto;
  }

  .po-global-medical-toggle{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:36px minmax(0,1fr) 30px;
    gap:11px;
    align-items:center;
    width:100%;
    min-height:48px;
    padding:7px 10px;
    border:1px solid transparent;
    background:transparent;
    color:#fff;
    text-align:left;
    font-family:inherit;
    cursor:pointer;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
  }

  .po-global-medical-toggle:hover,
  .po-global-medical-toggle.is-active{
    transform:translateX(2px);
    border-color:rgba(255,255,255,.14);
    background:#242a31;
  }

  .po-global-medical-toggle.is-active{
    box-shadow:inset 3px 0 0 var(--po-gold);
  }

  .po-global-medical-toggle>span{
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:var(--po-gold-2);
    font-size:9px;
    font-weight:950;
  }

  .po-global-medical-toggle>strong{
    color:#fff;
    font-size:14px;
    font-weight:900;
    line-height:1.25;
  }

  .po-global-medical-chevron{
    position:relative;
    display:grid;
    width:28px;
    height:28px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    color:#cfd4d8;
  }

  .po-global-medical-chevron:before{
    content:"+";
    font-size:18px;
    font-weight:500;
  }

  .po-global-medical-group.is-open .po-global-medical-chevron:before{
    content:"−";
  }

  .po-global-medical-submenu{
    max-height:0;
    margin:0 0 0 18px;
    padding:0 0 0 10px;
    overflow:hidden;
    border-left:1px solid transparent;
    opacity:0;
    visibility:hidden;
    transition:max-height .3s ease,opacity .2s ease,padding .3s ease,border-color .2s ease,visibility .2s ease;
  }

  .po-global-medical-group.is-open .po-global-medical-submenu{
    max-height:320px;
    padding-top:6px;
    padding-bottom:6px;
    border-left-color:rgba(211,171,98,.52);
    opacity:1;
    visibility:visible;
  }

  .po-global-medical-submenu button{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 18px;
    gap:10px;
    width:100%;
    align-items:center;
    min-height:44px;
    padding:7px 10px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:transparent;
    color:#dfe3e6;
    text-align:left;
    cursor:pointer;
  }

  .po-global-medical-submenu button:last-child{border-bottom:0;}

  .po-global-medical-submenu button:hover,
  .po-global-medical-submenu button.is-active{
    transform:translateX(2px);
    background:rgba(255,255,255,.065);
    color:#fff;
  }

  .po-global-medical-submenu button.is-active{
    box-shadow:inset 2px 0 0 var(--po-gold-2);
  }

  .po-global-medical-submenu small{
    display:grid;
    place-items:center;
    width:40px;
    height:28px;
    border:1px solid rgba(255,255,255,.12);
    color:var(--po-gold-2);
    font-size:8px;
    font-weight:950;
  }

  .po-global-medical-submenu strong{
    font-size:12px;
    font-weight:850;
  }

  .po-global-medical-submenu b{
    color:#7f8992;
    font-size:12px;
    font-weight:500;
    text-align:right;
  }
}


/* =========================================================
V126 / STABLE LEFT-SIDEBAR SCROLLBAR
Reserve scrollbar space from the beginning so opening/closing
accordions does not horizontally shift the menu buttons.
========================================================= */
@media(min-width:901px){
  .po-global-left-list{
    overflow-y:scroll!important;
    scrollbar-gutter:stable!important;
  }

  /* Keep the reserved track visually quiet when there is little content. */
  .po-global-left-list::-webkit-scrollbar{
    width:8px;
  }

  .po-global-left-list::-webkit-scrollbar-track{
    background:transparent;
  }

  .po-global-left-list::-webkit-scrollbar-thumb{
    background:rgba(255,255,255,.16);
    border-radius:8px;
  }

  .po-global-left-list::-webkit-scrollbar-thumb:hover{
    background:rgba(255,255,255,.28);
  }
}


/* =========================================================
V127 / A320 COURSE VISUAL TEST
Only the Airbus 320 registration panel gets an aircraft visual.
The image is used as a background hero band, not as a full-page image.
========================================================= */
.po-inline-ppl-enroll{
  position:relative;
}

.po-inline-ppl-enroll.is-a320-visual{
  overflow:hidden!important;
  padding-top:190px!important;
  background:var(--po-card)!important;
}

.po-inline-ppl-enroll.is-a320-visual::before{
  content:"";
  position:absolute;
  z-index:0;
  top:0;
  left:0;
  right:0;
  height:178px;
  background:
    linear-gradient(to bottom,
      rgba(250,249,245,.00) 0%,
      rgba(250,249,245,.03) 48%,
      rgba(250,249,245,.58) 78%,
      var(--po-card) 100%),
    url("https://thumb.wikimedia.org/wikipedia/commons/thumb/a/ab/Airbus_A320-200_Airbus_Industries_%28AIB%29_%27House_colors%27_F-WWBA_-_MSN_001_%2810276181983%29_crop.jpg/1280px-Airbus_A320-200_Airbus_Industries_%28AIB%29_%27House_colors%27_F-WWBA_-_MSN_001_%2810276181983%29_crop.jpg");
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center 45%;
  pointer-events:none;
}

.po-inline-ppl-enroll.is-a320-visual > *{
  position:relative;
  z-index:1;
}

.po-a320-photo-credit{
  display:none;
}

.po-inline-ppl-enroll.is-a320-visual .po-a320-photo-credit{
  display:block;
  position:absolute;
  z-index:2;
  top:10px;
  right:10px;
  padding:5px 7px;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(14,18,22,.56);
  color:#fff!important;
  font-size:6px;
  font-weight:850;
  letter-spacing:.08em;
  line-height:1;
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}

.po-inline-ppl-enroll.is-a320-visual .po-a320-photo-credit:hover{
  background:rgba(14,18,22,.76);
}

@media(max-width:900px){
  .po-inline-ppl-enroll.is-a320-visual{
    padding-top:172px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual::before{
    height:162px;
    background-position:center 45%;
  }
}


/* =========================================================
V128 / A320 OVERLAY + COMPACT PANEL
Move A320 title/copy onto the image area so the panel does not
stretch vertically as much.
========================================================= */
.po-inline-ppl-enroll.is-a320-visual{
  padding-top:162px!important;
}

.po-inline-ppl-enroll.is-a320-visual::before{
  height:170px;
  background:
    linear-gradient(180deg,
      rgba(7,12,20,.02) 0%,
      rgba(7,12,20,.08) 28%,
      rgba(7,12,20,.26) 56%,
      rgba(7,12,20,.62) 82%,
      rgba(250,249,245,.92) 100%),
    linear-gradient(90deg,
      rgba(7,12,20,.56) 0%,
      rgba(7,12,20,.18) 44%,
      rgba(7,12,20,.00) 74%),
    url("https://thumb.wikimedia.org/wikipedia/commons/thumb/a/ab/Airbus_A320-200_Airbus_Industries_%28AIB%29_%27House_colors%27_F-WWBA_-_MSN_001_%2810276181983%29_crop.jpg/1280px-Airbus_A320-200_Airbus_Industries_%28AIB%29_%27House_colors%27_F-WWBA_-_MSN_001_%2810276181983%29_crop.jpg");
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center 44%;
}

.po-inline-ppl-enroll.is-a320-visual > small:first-of-type{
  position:absolute;
  top:18px;
  left:24px;
  z-index:2;
  margin:0;
  color:rgba(255,255,255,.90)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.25);
}

.po-inline-ppl-enroll.is-a320-visual > h2{
  position:absolute;
  left:24px;
  bottom:82px;
  z-index:2;
  max-width:58%;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(34px,2.6vw,48px)!important;
  line-height:1!important;
  text-shadow:0 2px 12px rgba(0,0,0,.28);
}

.po-inline-ppl-enroll.is-a320-visual > p{
  position:absolute;
  left:24px;
  right:148px;
  bottom:22px;
  z-index:2;
  margin:0!important;
  color:rgba(255,255,255,.95)!important;
  font-size:11px!important;
  line-height:1.65!important;
  text-shadow:0 1px 10px rgba(0,0,0,.28);
}

.po-inline-ppl-enroll.is-a320-visual .po-inline-ppl-meta{
  margin-top:2px;
}

@media(max-width:900px){
  .po-inline-ppl-enroll.is-a320-visual{
    padding-top:152px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual::before{
    height:160px;
    background-position:center 44%;
  }

  .po-inline-ppl-enroll.is-a320-visual > h2{
    left:18px;
    bottom:72px;
    max-width:62%;
    font-size:34px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual > p{
    left:18px;
    right:18px;
    bottom:14px;
    font-size:10px!important;
    line-height:1.58!important;
  }

  .po-inline-ppl-enroll.is-a320-visual > small:first-of-type{
    left:18px;
    top:14px;
  }
}


/* =========================================================
V129 / FIXED-SIZE LOWER GUIDE PANELS
Do not squeeze the bottom route/course boxes to fit short screens.
The right workspace scrolls vertically instead.
========================================================= */
@media(min-width:901px){

  .po-scene[data-panel="become"] .po-guided-start-main,
  .po-scene[data-panel="learning"] .po-guided-start-main{
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }

  .po-scene[data-panel="become"] .po-guided-third-stage,
  .po-scene[data-panel="learning"] .po-guided-third-stage{
    flex:0 0 auto!important;
    height:auto!important;
    min-height:0!important;
    align-items:stretch!important;
  }

  /* パイロットになるには */
  .po-scene[data-panel="become"] .po-guided-third-stage .po-route{
    height:auto!important;
    min-height:285px!important;
  }

  /* 何を学べばいい？ */
  .po-scene[data-panel="learning"] .po-guided-third-stage .po-course-group{
    height:auto!important;
    min-height:420px!important;
  }
}

/* When route cards wrap on narrower desktop widths,
   keep each card readable and let the page become taller. */
@media(min-width:901px) and (max-width:1280px){
  .po-scene[data-panel="become"] .po-guided-third-stage .po-route{
    min-height:265px!important;
  }
}


/* =========================================================
V130 / A320 HERO OVERLAY FIX
Anchor the A320 title/copy to the image area itself.
Do not position them relative to the panel bottom.
========================================================= */
.po-inline-ppl-enroll.is-a320-visual{
  padding-top:196px!important;
}

.po-inline-ppl-enroll.is-a320-visual::before{
  height:194px!important;
  background:
    linear-gradient(180deg,
      rgba(7,12,20,.02) 0%,
      rgba(7,12,20,.05) 38%,
      rgba(7,12,20,.22) 62%,
      rgba(7,12,20,.60) 88%,
      rgba(250,249,245,.96) 100%),
    linear-gradient(90deg,
      rgba(7,12,20,.54) 0%,
      rgba(7,12,20,.20) 48%,
      rgba(7,12,20,.00) 78%),
    url("https://thumb.wikimedia.org/wikipedia/commons/thumb/a/ab/Airbus_A320-200_Airbus_Industries_%28AIB%29_%27House_colors%27_F-WWBA_-_MSN_001_%2810276181983%29_crop.jpg/1280px-Airbus_A320-200_Airbus_Industries_%28AIB%29_%27House_colors%27_F-WWBA_-_MSN_001_%2810276181983%29_crop.jpg")!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-position:center 43%!important;
}

/* START COURSE label remains in the upper-left of the image. */
.po-inline-ppl-enroll.is-a320-visual > small:first-of-type{
  top:18px!important;
  left:24px!important;
  bottom:auto!important;
}

/* Title is pinned to the lower-left of the image. */
.po-inline-ppl-enroll.is-a320-visual > h2{
  top:104px!important;
  left:24px!important;
  right:24px!important;
  bottom:auto!important;
  max-width:none!important;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(36px,2.7vw,50px)!important;
  line-height:.95!important;
  text-shadow:0 2px 14px rgba(0,0,0,.34)!important;
}

/* Course message sits directly below the title, still inside the photo. */
.po-inline-ppl-enroll.is-a320-visual > p{
  top:151px!important;
  left:24px!important;
  right:24px!important;
  bottom:auto!important;
  margin:0!important;
  color:rgba(255,255,255,.96)!important;
  font-size:10.5px!important;
  line-height:1.5!important;
  text-shadow:0 1px 10px rgba(0,0,0,.38)!important;
}

/* Content below the image begins cleanly after the hero. */
.po-inline-ppl-enroll.is-a320-visual .po-inline-ppl-meta{
  margin-top:0!important;
}

@media(max-width:900px){
  .po-inline-ppl-enroll.is-a320-visual{
    padding-top:184px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual::before{
    height:182px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual > h2{
    top:96px!important;
    left:18px!important;
    right:18px!important;
    font-size:36px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual > p{
    top:138px!important;
    left:18px!important;
    right:18px!important;
    font-size:9.5px!important;
    line-height:1.45!important;
  }
}


/* =========================================================
V131 / A320 MESSAGE BELOW IMAGE
Keep the A320 title on the image, but move the course message
into a dedicated text area below the photo.
========================================================= */
.po-inline-ppl-enroll.is-a320-visual{
  padding-top:208px!important;
}

.po-inline-ppl-enroll.is-a320-visual::before{
  height:198px!important;
}

.po-inline-ppl-enroll.is-a320-visual > h2{
  top:124px!important;
}

.po-inline-ppl-enroll.is-a320-visual > p{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  display:block!important;
  margin:0 0 16px!important;
  color:var(--po-copy)!important;
  font-size:11px!important;
  line-height:1.72!important;
  text-shadow:none!important;
  z-index:1!important;
}

.po-inline-ppl-enroll.is-a320-visual .po-inline-ppl-meta{
  margin-top:0!important;
}

@media(max-width:900px){
  .po-inline-ppl-enroll.is-a320-visual{
    padding-top:196px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual::before{
    height:188px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual > h2{
    top:114px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual > p{
    margin:0 0 14px!important;
    font-size:10px!important;
    line-height:1.65!important;
  }
}


/* =========================================================
V132 / A320 MESSAGE SPACING + READABILITY
Give the message more breathing room below the image,
increase font size, and use a darker text color.
========================================================= */
.po-inline-ppl-enroll.is-a320-visual{
  padding-top:214px!important;
}

.po-inline-ppl-enroll.is-a320-visual > p{
  margin:14px 0 22px!important;
  padding:0 2px!important;
  color:#25292d!important;
  font-size:13px!important;
  font-weight:500!important;
  line-height:1.78!important;
  text-shadow:none!important;
}

@media(max-width:900px){
  .po-inline-ppl-enroll.is-a320-visual{
    padding-top:202px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual > p{
    margin:12px 0 18px!important;
    font-size:11.5px!important;
    line-height:1.72!important;
  }
}


/* =========================================================
V133 / A320 MESSAGE BALANCE
Use the empty space better:
- slightly larger message text
- tighter spacing below the message
========================================================= */
.po-inline-ppl-enroll.is-a320-visual{
  padding-top:210px!important;
}

.po-inline-ppl-enroll.is-a320-visual > p{
  margin:12px 0 12px!important;
  padding:0 2px!important;
  color:#21262b!important;
  font-size:14px!important;
  font-weight:550!important;
  line-height:1.68!important;
  letter-spacing:.005em!important;
}

.po-inline-ppl-enroll.is-a320-visual .po-inline-ppl-meta{
  margin-top:2px!important;
}

@media(max-width:900px){
  .po-inline-ppl-enroll.is-a320-visual{
    padding-top:198px!important;
  }

  .po-inline-ppl-enroll.is-a320-visual > p{
    margin:10px 0 10px!important;
    font-size:12px!important;
    line-height:1.62!important;
  }
}


/* =========================================================
V134 / TARGET BOX + NO CHAT IN COURSE DETAIL
Replace the conversation area with a "best for" box inside the
upper-left content area, and bring curriculum upward.
========================================================= */
.po-inline-ppl-audience{
  margin-top:26px;
  padding:18px 20px 19px;
  border:1px solid var(--po-line);
  background:#faf8f2;
}

.po-inline-ppl-audience-head{
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  align-items:flex-end;
}

.po-inline-ppl-audience-head small{
  color:var(--po-gold);
  font-size:10px;
  font-weight:900;
  letter-spacing:.18em;
}

.po-inline-ppl-audience-head strong{
  color:var(--po-ink);
  font-size:22px;
  font-weight:950;
  line-height:1.08;
}

.po-inline-ppl-audience-list{
  list-style:none;
  margin:15px 0 0;
  padding:0;
  display:grid;
  gap:10px;
}

.po-inline-ppl-audience-list li{
  position:relative;
  margin:0;
  padding-left:18px;
  color:var(--po-copy);
  font-size:12px;
  line-height:1.72;
  font-weight:600;
}

.po-inline-ppl-audience-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--po-gold);
  transform:translateY(-50%);
}

.po-inline-ppl-curriculum{
  margin-top:32px!important;
}

@media(max-width:900px){
  .po-inline-ppl-audience{
    margin-top:22px;
    padding:16px 16px 17px;
  }

  .po-inline-ppl-audience-head strong{
    font-size:18px;
  }

  .po-inline-ppl-audience-list{
    gap:8px;
    margin-top:12px;
  }

  .po-inline-ppl-audience-list li{
    font-size:11px;
    line-height:1.66;
  }

  .po-inline-ppl-curriculum{
    margin-top:26px!important;
  }
}


/* =========================================================
V135 / UNIVERSAL COURSE HERO
All course detail registration panels now use the approved A320
visual structure: photo hero, short title on image, copy below.
========================================================= */
.po-inline-ppl-enroll.is-course-visual{
  position:relative!important;
  overflow:hidden!important;
  padding-top:210px!important;
  background:var(--po-card)!important;
}

.po-inline-ppl-enroll.is-course-visual::before{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  top:0!important;
  left:0!important;
  right:0!important;
  height:208px!important;
  background-color:#d7e3f0!important;
  background-image:
    linear-gradient(180deg,
      rgba(250,249,245,.00) 0%,
      rgba(250,249,245,.00) 48%,
      rgba(250,249,245,.10) 68%,
      rgba(250,249,245,.82) 100%),
    linear-gradient(90deg,
      rgba(7,12,20,.20) 0%,
      rgba(7,12,20,.05) 30%,
      rgba(7,12,20,.00) 62%),
    var(--po-course-hero-image)!important;
  background-repeat:no-repeat!important;
  background-size:cover,cover,contain!important;
  background-position:center center,center center,var(--po-course-hero-position,center 50%)!important;
  filter:saturate(1.10) contrast(1.03) brightness(1.05)!important;
  pointer-events:none!important;
}

.po-inline-ppl-enroll.is-course-visual > *{
  position:relative;
  z-index:1;
}

.po-inline-ppl-enroll.is-course-visual > small:first-of-type{
  position:absolute!important;
  z-index:2!important;
  top:18px!important;
  left:24px!important;
  right:auto!important;
  bottom:auto!important;
  margin:0!important;
  color:rgba(255,255,255,.94)!important;
  text-shadow:0 1px 6px rgba(0,0,0,.38)!important;
}

.po-inline-ppl-enroll.is-course-visual > h2{
  position:absolute!important;
  z-index:2!important;
  top:124px!important;
  left:24px!important;
  right:24px!important;
  bottom:auto!important;
  max-width:none!important;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(36px,2.7vw,50px)!important;
  font-weight:950!important;
  line-height:.95!important;
  letter-spacing:-.045em!important;
  text-shadow:0 2px 14px rgba(0,0,0,.38)!important;
}

.po-inline-ppl-enroll.is-course-visual.is-long-hero-title > h2{
  top:132px!important;
  font-size:clamp(28px,2.15vw,40px)!important;
  letter-spacing:-.035em!important;
}

.po-inline-ppl-enroll.is-course-visual.is-xlong-hero-title > h2{
  top:136px!important;
  font-size:clamp(24px,1.8vw,33px)!important;
}

.po-inline-ppl-enroll.is-course-visual > p{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  display:block!important;
  margin:12px 0 12px!important;
  padding:0 2px!important;
  color:#21262b!important;
  font-size:14px!important;
  font-weight:550!important;
  line-height:1.68!important;
  letter-spacing:.005em!important;
  text-shadow:none!important;
}

.po-course-photo-credit{
  display:block!important;
  position:absolute!important;
  z-index:3!important;
  top:10px!important;
  right:10px!important;
  max-width:58%!important;
  padding:5px 7px!important;
  border:1px solid rgba(255,255,255,.22)!important;
  background:rgba(14,18,22,.58)!important;
  color:#fff!important;
  font-size:6px!important;
  font-weight:850!important;
  letter-spacing:.07em!important;
  line-height:1.15!important;
  text-align:right!important;
  backdrop-filter:blur(5px)!important;
  -webkit-backdrop-filter:blur(5px)!important;
}

.po-course-photo-credit:hover{
  background:rgba(14,18,22,.80)!important;
}

.po-inline-ppl-enroll.is-course-visual .po-inline-ppl-meta{
  margin-top:2px!important;
}

@media(max-width:900px){
  .po-inline-ppl-enroll.is-course-visual{
    padding-top:198px!important;
  }

  .po-inline-ppl-enroll.is-course-visual::before{
    height:188px!important;
  }

  .po-inline-ppl-enroll.is-course-visual > small:first-of-type{
    top:14px!important;
    left:18px!important;
  }

  .po-inline-ppl-enroll.is-course-visual > h2{
    top:116px!important;
    left:18px!important;
    right:18px!important;
    font-size:36px!important;
  }

  .po-inline-ppl-enroll.is-course-visual.is-long-hero-title > h2{
    top:124px!important;
    font-size:29px!important;
  }

  .po-inline-ppl-enroll.is-course-visual.is-xlong-hero-title > h2{
    top:128px!important;
    font-size:24px!important;
  }

  .po-inline-ppl-enroll.is-course-visual > p{
    margin:10px 0 10px!important;
    font-size:12px!important;
    line-height:1.62!important;
  }
}


/* =========================================================
V137 / LIGHTWEIGHT COURSE HERO IMAGES
Use smaller 960px Wikimedia thumbnail variants for course hero
backgrounds instead of the larger 1280px versions.
This is a better balance for the current right-panel display size.
========================================================= */
.po-inline-ppl-enroll.is-course-visual::before{
  image-rendering:auto;
}


/* =========================================================
V138 / VERIFIED + FAIL-SAFE COURSE IMAGES
V139 / USER-SELECTED FAA HERO SWAPS
PPL=C172 front-oriented photo, CPL=DA42, MEL=Seneca front view,
CFI=two-person cockpit shot, ATP-CTP=A320 simulated cockpit,
SEA=Vancouver seaplane.
Remote Commons filenames were replaced with verified file names.
A per-course lightweight SVG fallback prevents the silver/blank hero
if Wikimedia fails or a network request is blocked.
========================================================= */


/* =========================================================
V140 / FAST COURSE IMAGE DELIVERY
- direct upload.wikimedia.org 960px thumbnails (no Special:FilePath redirect)
- CDN preconnect
- pointer/focus/touch preload before course click
- real photo is applied immediately; fallback only on actual error
========================================================= */


/* =========================================================
V141 / CUSTOM FLIGHT-INSTRUCTOR IMAGE
Flight Instructor course now uses the user-selected cockpit image
embedded as a lightweight WebP data URI for instant rendering.
========================================================= */


/* =========================================================
V142 / CUSTOM PPL IMAGE
PPL course now uses the user-selected C172 image
embedded as a lightweight WebP data URI for instant rendering.
========================================================= */


/* =========================================================
V143 / BRIGHTER FULL-AIRCRAFT HERO STYLE
Global course-hero treatment updated for a more aspirational feel:
- brighter / cleaner overlays
- actual aircraft image uses contain instead of cover
- slightly taller hero area
- higher saturation / brightness
- positions nudged to keep more of the aircraft visible
========================================================= */


/* =========================================================
V144 / GRADIENT AIRCRAFT HERO RESTORE
"Whole aircraft visible" means the aircraft itself should be framed
within the photo — not that the entire rectangular photo should be
letterboxed inside the panel.
Restore the blended photo treatment:
- image fills the hero naturally
- soft fade into the paper/card background
- lighter/cleaner overlay than the older dark version
========================================================= */
.po-inline-ppl-enroll.is-course-visual{
  padding-top:210px!important;
}

.po-inline-ppl-enroll.is-course-visual::before{
  height:198px!important;
  background-color:transparent!important;
  background-image:
    linear-gradient(180deg,
      rgba(250,249,245,.00) 0%,
      rgba(250,249,245,.00) 52%,
      rgba(250,249,245,.12) 70%,
      rgba(250,249,245,.58) 86%,
      rgba(250,249,245,.98) 100%),
    linear-gradient(90deg,
      rgba(8,14,22,.26) 0%,
      rgba(8,14,22,.10) 34%,
      rgba(8,14,22,.00) 66%),
    var(--po-course-hero-image)!important;
  background-repeat:no-repeat!important;
  background-size:cover,cover,cover!important;
  background-position:center center,center center,var(--po-course-hero-position,center 50%)!important;
  filter:saturate(1.08) contrast(1.025) brightness(1.035)!important;
}

/* Keep the title readable without making the whole image feel dark. */
.po-inline-ppl-enroll.is-course-visual > h2{
  text-shadow:0 2px 12px rgba(0,0,0,.34)!important;
}

/* The copy below the image stays dark and readable. */
.po-inline-ppl-enroll.is-course-visual > p{
  color:#21262b!important;
}


/* =========================================================
V145 / INLINE CAREER STORY DETAIL
Career cards open inside the right workspace instead of navigating
to the old standalone dark Career Stories page.
========================================================= */
.po-career-card:not(.is-sample){
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  padding:0;
  text-align:left;
  font-family:inherit;
  cursor:pointer;
}
.po-career-card:not(.is-sample):hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(23,27,32,.16);
}

.po-career-detail-view{
  overflow-y:auto;
  background:var(--po-paper);
  scrollbar-width:thin;
  scrollbar-color:#aaa59b transparent;
}
.po-career-detail-inner{
  width:min(100%,1180px);
  margin:0 auto;
  padding:clamp(28px,3vw,46px) clamp(30px,4vw,64px) 64px;
}
.po-career-detail-back{
  appearance:none;
  -webkit-appearance:none;
  min-height:38px;
  padding:0 12px;
  border:1px solid #bdb7ad;
  background:#fbfaf7;
  color:var(--po-ink);
  font-size:8px;
  font-weight:950;
  letter-spacing:.08em;
  cursor:pointer;
}
.po-career-detail-back:hover{
  background:var(--po-dark);
  border-color:var(--po-dark);
  color:#fff;
}
.po-career-detail-hero{
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(300px,.72fr);
  gap:38px;
  align-items:stretch;
  margin-top:18px;
  padding-bottom:26px;
  border-bottom:1px solid var(--po-line);
}
.po-career-detail-hero-copy{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:330px;
}
.po-career-detail-hero h1{
  margin:12px 0 14px;
  color:var(--po-ink);
  font-size:clamp(48px,4.7vw,76px);
  font-weight:950;
  line-height:.93;
  letter-spacing:-.055em;
}
.po-career-detail-route{
  max-width:760px;
  margin:0;
  color:var(--po-copy);
  font-size:13px;
  line-height:1.85;
}
.po-career-detail-hero blockquote{
  margin:24px 0 0;
  padding:16px 18px;
  border-left:4px solid var(--po-gold);
  background:#eee5d3;
  color:#25292d;
  font-size:16px;
  font-weight:750;
  line-height:1.75;
}
.po-career-detail-photo{
  position:relative;
  min-height:330px;
  overflow:hidden;
  border:1px solid #bdb7ad;
  background:#d7d9da;
}
.po-career-detail-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.po-career-detail-highlights{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:18px;
  border:1px solid #c9c3b9;
  background:#fbfaf7;
}
.po-career-detail-highlight{
  min-height:82px;
  padding:14px 16px;
  border-right:1px solid #d8d2c8;
}
.po-career-detail-highlight:last-child{border-right:0;}
.po-career-detail-highlight small{
  display:block;
  margin-bottom:8px;
  color:var(--po-gold);
  font-size:7px;
  font-weight:950;
  letter-spacing:.10em;
}
.po-career-detail-highlight strong{
  display:block;
  color:var(--po-ink);
  font-size:13px;
  font-weight:950;
  line-height:1.45;
}
.po-career-detail-section{margin-top:34px;}
.po-career-detail-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-bottom:14px;
}
.po-career-detail-section-head small{
  display:block;
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.13em;
}
.po-career-detail-section-head h2{
  margin:5px 0 0;
  color:var(--po-ink);
  font-size:30px;
  font-weight:950;
  letter-spacing:-.035em;
}
.po-career-detail-section-head>span{
  color:#928b81;
  font-size:7px;
  font-weight:900;
  letter-spacing:.12em;
}
.po-career-detail-timeline{border-top:1px solid #c9c3b9;}
.po-career-detail-step{
  display:grid;
  grid-template-columns:120px 260px minmax(0,1fr);
  gap:24px;
  align-items:start;
  padding:18px 4px;
  border-bottom:1px solid #d8d2c8;
}
.po-career-detail-step small{
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
  letter-spacing:.08em;
}
.po-career-detail-step strong{
  color:var(--po-ink);
  font-size:14px;
  font-weight:950;
  line-height:1.45;
}
.po-career-detail-step p{
  margin:0;
  color:#62676b;
  font-size:11px;
  line-height:1.8;
}
.po-career-detail-interview{
  display:grid;
  gap:12px;
}
.po-career-detail-qa{
  border:1px solid #cbc5bb;
  background:#fbfaf7;
}
.po-career-detail-qa h3{
  margin:0;
  padding:14px 16px;
  border-bottom:1px solid #d9d3c9;
  background:#f0ece5;
  color:var(--po-ink);
  font-size:13px;
  font-weight:950;
  line-height:1.55;
}
.po-career-detail-qa p{
  margin:0;
  padding:16px;
  color:#51565a;
  font-size:12px;
  line-height:1.9;
}
.po-career-detail-body{
  padding:22px;
  border:1px solid #cbc5bb;
  background:#fbfaf7;
}
.po-career-detail-body p{
  margin:0 0 14px;
  color:#51565a;
  font-size:12px;
  line-height:1.95;
}
.po-career-detail-body p:last-child{margin-bottom:0;}
.po-career-detail-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid var(--po-line);
}
.po-career-detail-links a{
  display:inline-flex;
  min-height:40px;
  padding:0 14px;
  align-items:center;
  border:1px solid #bdb7ad;
  background:#fbfaf7;
  color:var(--po-ink)!important;
  font-size:8px;
  font-weight:950;
}
.po-career-detail-links a:hover{
  background:var(--po-dark);
  border-color:var(--po-dark);
  color:#fff!important;
}
@media(max-width:1180px) and (min-width:901px){
  .po-career-detail-hero{grid-template-columns:minmax(0,1fr) 320px;}
  .po-career-detail-highlights{grid-template-columns:repeat(2,minmax(0,1fr));}
  .po-career-detail-highlight:nth-child(2){border-right:0;}
  .po-career-detail-highlight:nth-child(-n+2){border-bottom:1px solid #d8d2c8;}
  .po-career-detail-step{grid-template-columns:110px 220px minmax(0,1fr);}
}
@media(max-width:900px){
  .po-career-detail-inner{padding:24px 18px 48px;}
  .po-career-detail-hero{grid-template-columns:1fr;}
  .po-career-detail-hero-copy{min-height:0;}
  .po-career-detail-photo{min-height:280px;order:-1;}
  .po-career-detail-highlights{grid-template-columns:1fr 1fr;}
  .po-career-detail-highlight:nth-child(2n){border-right:0;}
  .po-career-detail-highlight:nth-child(-n+2){border-bottom:1px solid #d8d2c8;}
  .po-career-detail-step{grid-template-columns:1fr;gap:6px;}
}


/* =========================================================
V146 / FULL LEGACY CAREER STORY INFORMATION
Keep the inline light-window layout, but restore the complete old
Career Story data model: job/location, meta[], timeline[], qas[],
plus previous/next story navigation.
========================================================= */
.po-career-detail-job{
  margin:0 0 4px;
  color:var(--po-ink);
  font-size:15px;
  font-weight:900;
  line-height:1.5;
}
.po-career-detail-location{
  margin:0 0 12px;
  color:var(--po-gold);
  font-size:9px;
  font-weight:950;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.po-career-detail-route{
  margin-top:4px!important;
}

.po-career-detail-nav{
  display:grid;
  grid-template-columns:1fr 1fr;
  margin-top:38px;
  border-top:1px solid var(--po-line);
  border-bottom:1px solid var(--po-line);
}
.po-career-detail-nav button{
  appearance:none;
  -webkit-appearance:none;
  display:flex;
  min-height:88px;
  padding:16px 18px;
  flex-direction:column;
  justify-content:center;
  gap:7px;
  border:0;
  background:transparent;
  color:var(--po-ink);
  text-align:left;
  cursor:pointer;
}
.po-career-detail-nav button+button{
  border-left:1px solid var(--po-line);
  text-align:right;
  align-items:flex-end;
}
.po-career-detail-nav button:hover{
  background:#ebe6dd;
}
.po-career-detail-nav small{
  color:var(--po-gold);
  font-size:7px;
  font-weight:950;
  letter-spacing:.11em;
}
.po-career-detail-nav strong{
  max-width:420px;
  font-size:15px;
  font-weight:950;
  line-height:1.45;
}

@media(max-width:900px){
  .po-career-detail-nav{
    grid-template-columns:1fr;
  }
  .po-career-detail-nav button+button{
    border-left:0;
    border-top:1px solid var(--po-line);
  }
}


/* =========================================================
V150 / HEADER NAVIGATION CLEANUP
Desktop:
- remove the duplicated EXPLORE menu
- keep MY PAGE only

Mobile:
- MY PAGE on the left
- three-line hamburger at the far right
- drawer navigation is generated from the desktop left menu,
  so there is no second hard-coded menu to maintain.
========================================================= */

.po-visually-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

/* No duplicated menu on desktop. */
.po-mobile-menu-btn{
  display:none!important;
}

@media(min-width:901px){
  .po-actions{
    right:var(--po-shell-gutter,24px)!important;
  }
}

/* Mobile header = MY PAGE + hamburger. */
@media(max-width:900px){
  .po-actions{
    top:10px!important;
    right:10px!important;
    gap:6px!important;
    align-items:center!important;
  }

  .po-header-mypage{
    min-height:36px!important;
    padding:0 12px!important;
    font-size:8px!important;
    letter-spacing:.08em!important;
  }

  .po-mobile-menu-btn{
    display:inline-flex!important;
    width:38px!important;
    min-width:38px!important;
    height:36px!important;
    min-height:36px!important;
    padding:0!important;
    align-items:center!important;
    justify-content:center!important;
  }

  .po-mobile-menu-btn .po-explore-icon{
    width:17px!important;
    height:12px!important;
    margin:0!important;
  }

  .po-mobile-menu-btn .po-explore-icon:before,
  .po-mobile-menu-btn .po-explore-icon:after,
  .po-mobile-menu-btn .po-explore-icon span{
    width:17px!important;
    height:1.5px!important;
    border-radius:99px;
  }

  .po-mobile-menu-btn .po-explore-icon:before{top:0!important;}
  .po-mobile-menu-btn .po-explore-icon span{top:5px!important;}
  .po-mobile-menu-btn .po-explore-icon:after{top:10px!important;}

  /* Old Explore card is no longer used. */
  .po-explore-card{display:none!important;}

  .po-mobile-menu-panel{
    z-index:1200!important;
    display:block!important;
  }

  .po-mobile-menu-panel .po-explore-backdrop{
    background:rgba(15,18,22,.42)!important;
    backdrop-filter:blur(4px)!important;
    -webkit-backdrop-filter:blur(4px)!important;
  }

  .po-mobile-drawer{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    width:min(88vw,390px);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border-left:1px solid #30363d;
    background:#171c21;
    color:#fff;
    box-shadow:-20px 0 52px rgba(0,0,0,.20);
    transform:translateX(102%);
    transition:transform .28s cubic-bezier(.22,.61,.36,1);
  }

  .po-mobile-menu-panel.is-open .po-mobile-drawer{
    transform:none;
  }

  .po-mobile-drawer-head{
    flex:0 0 66px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:0 15px 0 18px;
    border-bottom:1px solid rgba(255,255,255,.12);
  }

  .po-mobile-drawer-head small{
    display:block;
    color:var(--po-gold-2);
    font-size:7px;
    font-weight:950;
    letter-spacing:.15em;
  }

  .po-mobile-drawer-head strong{
    display:block;
    margin-top:4px;
    color:#fff;
    font-size:17px;
    font-weight:950;
    letter-spacing:.06em;
  }

  .po-mobile-drawer-close{
    appearance:none;
    -webkit-appearance:none;
    width:36px;
    height:36px;
    border:1px solid rgba(255,255,255,.18);
    background:transparent;
    color:#fff;
    font-size:24px;
    font-weight:300;
    line-height:1;
    cursor:pointer;
  }

  .po-mobile-drawer-nav{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    padding:14px 12px 28px;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.20) transparent;
  }

  .po-mobile-drawer-nav::-webkit-scrollbar{width:7px;}
  .po-mobile-drawer-nav::-webkit-scrollbar-track{background:transparent;}
  .po-mobile-drawer-nav::-webkit-scrollbar-thumb{
    border-radius:8px;
    background:rgba(255,255,255,.18);
  }

  .po-mobile-drawer-nav .po-global-section-label{
    margin:12px 8px 7px!important;
    padding:0!important;
    color:#808b94!important;
    font-size:7px!important;
    font-weight:950!important;
    letter-spacing:.15em!important;
  }

  .po-mobile-drawer-nav .po-global-home,
  .po-mobile-drawer-nav .po-global-become-toggle,
  .po-mobile-drawer-nav .po-global-learning-toggle,
  .po-mobile-drawer-nav .po-global-medical-toggle,
  .po-mobile-drawer-nav .po-global-career-toggle,
  .po-mobile-drawer-nav .po-global-news-toggle,
  .po-mobile-drawer-nav .po-global-resource-toggle,
  .po-mobile-drawer-nav .po-global-catalog-item,
  .po-mobile-drawer-nav .po-global-mypage-item{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr) 28px!important;
    gap:10px!important;
    align-items:center!important;
    width:100%!important;
    min-height:48px!important;
    margin:0!important;
    padding:7px 8px!important;
    border:1px solid transparent!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    font-family:inherit!important;
    text-decoration:none!important;
    cursor:pointer!important;
  }

  .po-mobile-drawer-nav .po-global-home{
    grid-template-columns:34px minmax(0,1fr)!important;
  }

  .po-mobile-drawer-nav .po-global-home:hover,
  .po-mobile-drawer-nav [class*="-toggle"]:hover,
  .po-mobile-drawer-nav .po-global-catalog-item:hover,
  .po-mobile-drawer-nav .po-global-mypage-item:hover{
    border-color:rgba(255,255,255,.12)!important;
    background:#242a31!important;
  }

  .po-mobile-drawer-nav .po-global-home>span,
  .po-mobile-drawer-nav [class*="-toggle"]>span,
  .po-mobile-drawer-nav .po-global-catalog-item>span,
  .po-mobile-drawer-nav .po-global-mypage-item>span{
    display:grid!important;
    width:32px!important;
    height:32px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.17)!important;
    color:var(--po-gold-2)!important;
    font-size:8px!important;
    font-weight:950!important;
  }

  .po-mobile-drawer-nav .po-global-home strong,
  .po-mobile-drawer-nav [class*="-toggle"]>strong,
  .po-mobile-drawer-nav .po-global-catalog-item>strong,
  .po-mobile-drawer-nav .po-global-mypage-item>strong{
    min-width:0;
    color:#fff!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:1.3!important;
  }

  .po-mobile-drawer-nav [class*="-chevron"],
  .po-mobile-drawer-nav .po-global-catalog-chevron{
    position:relative!important;
    display:grid!important;
    width:27px!important;
    height:27px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.16)!important;
    color:#cfd4d8!important;
  }

  .po-mobile-drawer-nav [class*="-chevron"]:before,
  .po-mobile-drawer-nav .po-global-catalog-chevron:before{
    content:"+"!important;
    font-size:16px!important;
    font-weight:500!important;
  }

  .po-mobile-drawer-nav .is-open > [class*="-toggle"] [class*="-chevron"]:before,
  .po-mobile-drawer-nav .is-open > .po-global-catalog-item .po-global-catalog-chevron:before{
    content:"−"!important;
  }

  /* Every submenu comes from the desktop menu clone. */
  .po-mobile-drawer-nav [class*="submenu"]{
    max-height:0!important;
    margin:0 0 0 18px!important;
    padding:0 0 0 10px!important;
    overflow:hidden!important;
    border-left:1px solid transparent!important;
    opacity:0!important;
    visibility:hidden!important;
    transition:max-height .28s ease,opacity .18s ease,padding .28s ease,border-color .18s ease!important;
  }

  .po-mobile-drawer-nav .is-open > [class*="submenu"]{
    max-height:1100px!important;
    padding-top:5px!important;
    padding-bottom:7px!important;
    border-left-color:rgba(255,255,255,.13)!important;
    opacity:1!important;
    visibility:visible!important;
  }

  .po-mobile-drawer-nav [class*="submenu"] button,
  .po-mobile-drawer-nav [class*="submenu"] a{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) 20px!important;
    gap:8px!important;
    align-items:center!important;
    width:100%!important;
    min-height:39px!important;
    padding:5px 6px!important;
    border:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    text-decoration:none!important;
    font-family:inherit!important;
    cursor:pointer!important;
  }

  .po-mobile-drawer-nav [class*="submenu"] button:hover,
  .po-mobile-drawer-nav [class*="submenu"] a:hover{
    background:rgba(255,255,255,.07)!important;
  }

  .po-mobile-drawer-nav [class*="submenu"] small{
    color:var(--po-gold-2)!important;
    font-size:7px!important;
    font-weight:950!important;
    letter-spacing:.06em!important;
  }

  .po-mobile-drawer-nav [class*="submenu"] strong{
    min-width:0;
    color:#dfe4e7!important;
    font-size:10px!important;
    font-weight:800!important;
    line-height:1.35!important;
  }

  .po-mobile-drawer-nav [class*="submenu"] b{
    color:#8f999f!important;
    font-size:11px!important;
    font-weight:500!important;
  }

  body.po-mobile-menu-open{
    overflow:hidden!important;
  }
}


/* =========================================================
V152 / AVIATION ACCIDENTS — CASE STUDIES PROTOTYPE
========================================================= */

@media(min-width:901px){
  .po-scene[data-panel="accidents"] .po-scene-canvas{
    overflow:hidden!important;
    background:var(--po-paper);
  }

  .po-accident-course{
    height:100%;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:#aaa59b transparent;
  }

  .po-accident-course::-webkit-scrollbar{width:8px;}
  .po-accident-course::-webkit-scrollbar-track{background:transparent;}
  .po-accident-course::-webkit-scrollbar-thumb{background:#aaa59b;border-radius:8px;}

  .po-accident-overview,
  .po-accident-detail{
    width:min(100%,1180px);
    margin:0 auto;
    padding:clamp(28px,3vw,48px) clamp(28px,4vw,62px) 64px;
  }

  .po-accident-head{
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(250px,.65fr);
    gap:44px;
    align-items:end;
    padding-bottom:24px;
    border-bottom:1px solid var(--po-line);
  }

  .po-accident-head h1{
    margin:13px 0 18px;
    color:var(--po-ink);
    font-size:clamp(56px,5.7vw,92px);
    font-weight:950;
    line-height:.82;
    letter-spacing:-.065em;
  }

  .po-accident-head p{
    max-width:720px;
    margin:0;
    color:var(--po-copy);
    font-size:14px;
    line-height:1.95;
  }

  .po-accident-head-meta{
    display:grid;
    gap:8px;
    align-self:end;
  }

  .po-accident-head-meta span{
    display:flex;
    min-height:40px;
    padding:0 13px;
    align-items:center;
    border:1px solid var(--po-line);
    background:var(--po-card);
    color:#777168;
    font-size:8px;
    font-weight:950;
    letter-spacing:.11em;
  }

  .po-accident-feature{
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(260px,.65fr);
    gap:18px;
    margin-top:28px;
  }

  .po-accident-video{
    border:1px solid var(--po-line);
    background:#0d1115;
  }

  .po-accident-video-frame{
    position:relative;
    aspect-ratio:16/9;
    overflow:hidden;
    background:#0b0f13;
  }

  .po-accident-video-frame iframe{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;
  }

  .po-accident-video-caption{
    display:flex;
    min-height:66px;
    padding:12px 14px;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    background:#171c21;
    color:#fff;
  }

  .po-accident-video-caption small{
    display:block;
    color:var(--po-gold-2);
    font-size:7px;
    font-weight:950;
    letter-spacing:.11em;
  }

  .po-accident-video-caption strong{
    display:block;
    margin-top:4px;
    font-size:15px;
  }

  .po-accident-video-caption a{
    flex:0 0 auto;
    color:#fff!important;
    font-size:8px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-accident-feature-note{
    display:flex;
    padding:24px;
    flex-direction:column;
    justify-content:flex-end;
    border:1px solid var(--po-line);
    background:#e7e2d8;
  }

  .po-accident-feature-note small{
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
    letter-spacing:.12em;
  }

  .po-accident-feature-note strong{
    margin:10px 0 14px;
    color:var(--po-ink);
    font-size:24px;
    line-height:1.18;
  }

  .po-accident-feature-note p{
    margin:0;
    color:var(--po-copy);
    font-size:11px;
    line-height:1.8;
  }

  .po-accident-dialogue{
    display:grid;
    gap:12px;
    width:min(100%,980px);
    margin:34px auto 0;
  }

  .po-accident-browser,
  .po-accident-timeline{
    margin-top:46px;
    padding-top:28px;
    border-top:1px solid var(--po-line);
  }

  .po-accident-section-head{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:18px;
  }

  .po-accident-section-head small{
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
    letter-spacing:.13em;
  }

  .po-accident-section-head h2{
    margin:6px 0 0;
    color:var(--po-ink);
    font-size:30px;
    line-height:1;
    letter-spacing:-.03em;
  }

  .po-accident-section-head>span{
    color:#8b8377;
    font-size:8px;
    font-weight:900;
    letter-spacing:.09em;
  }

  .po-accident-filter{
    display:flex;
    gap:7px;
    flex-wrap:wrap;
    margin-bottom:15px;
  }

  .po-accident-filter button{
    appearance:none;
    -webkit-appearance:none;
    min-height:32px;
    padding:0 11px;
    border:1px solid #c8c2b8;
    background:transparent;
    color:#5e5a53;
    font-size:7px;
    font-weight:950;
    letter-spacing:.08em;
    cursor:pointer;
  }

  .po-accident-filter button:hover,
  .po-accident-filter button.is-active{
    border-color:var(--po-dark);
    background:var(--po-dark);
    color:#fff;
  }

  .po-accident-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .po-accident-case{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:86px minmax(0,1fr) 28px;
    gap:15px;
    min-height:146px;
    padding:18px;
    align-items:start;
    border:1px solid var(--po-line);
    background:var(--po-card);
    color:var(--po-ink);
    text-align:left;
    cursor:pointer;
    transition:transform .16s ease,border-color .16s ease,background .16s ease;
  }

  .po-accident-case:hover{
    transform:translateY(-2px);
    border-color:#9a9183;
    background:#eee9df;
  }

  .po-accident-case-year{
    color:var(--po-gold);
    font-size:19px;
    font-weight:950;
    letter-spacing:-.02em;
  }

  .po-accident-case-copy small{
    display:block;
    color:#80786d;
    font-size:7px;
    font-weight:950;
    letter-spacing:.09em;
  }

  .po-accident-case-copy strong{
    display:block;
    margin:7px 0 6px;
    font-size:19px;
    line-height:1.12;
  }

  .po-accident-case-copy p{
    margin:0;
    color:var(--po-copy);
    font-size:10px;
    line-height:1.65;
  }

  .po-accident-case>i{
    color:#8e867b;
    font-size:17px;
    font-style:normal;
    text-align:right;
  }

  .po-accident-timeline-track{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-top:1px solid #bdb6aa;
    border-left:1px solid #bdb6aa;
  }

  .po-accident-time{
    min-height:120px;
    padding:15px;
    border-right:1px solid #bdb6aa;
    border-bottom:1px solid #bdb6aa;
    background:#ece8df;
  }

  .po-accident-time small{
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
  }

  .po-accident-time strong{
    display:block;
    margin:7px 0 5px;
    font-size:14px;
    line-height:1.2;
  }

  .po-accident-time span{
    color:#6f6a62;
    font-size:8px;
    line-height:1.45;
  }

  .po-accident-back{
    appearance:none;
    -webkit-appearance:none;
    min-height:38px;
    padding:0 13px;
    border:1px solid #bdb6aa;
    background:transparent;
    color:var(--po-ink);
    font-size:8px;
    font-weight:950;
    letter-spacing:.08em;
    cursor:pointer;
  }

  .po-accident-detail-hero{
    display:grid;
    grid-template-columns:minmax(0,1.3fr) minmax(240px,.7fr);
    gap:34px;
    margin-top:26px;
    padding-bottom:26px;
    border-bottom:1px solid var(--po-line);
  }

  .po-accident-detail-hero small{
    color:var(--po-gold);
    font-size:9px;
    font-weight:950;
    letter-spacing:.12em;
  }

  .po-accident-detail-hero h1{
    margin:10px 0 16px;
    font-size:clamp(48px,5vw,78px);
    line-height:.9;
    letter-spacing:-.055em;
  }

  .po-accident-detail-hero p{
    margin:0;
    color:var(--po-copy);
    font-size:14px;
    line-height:1.9;
  }

  .po-accident-facts{
    display:grid;
    align-content:start;
    border-top:1px solid var(--po-line);
  }

  .po-accident-facts div{
    display:grid;
    grid-template-columns:92px 1fr;
    gap:12px;
    padding:11px 0;
    border-bottom:1px solid var(--po-line);
  }

  .po-accident-facts small{
    color:#857d71;
    font-size:7px;
  }

  .po-accident-facts strong{
    font-size:11px;
    line-height:1.4;
  }

  .po-accident-detail-dialogue{
    display:grid;
    gap:12px;
    width:min(100%,940px);
    margin:30px auto 0;
  }

  .po-accident-lessons{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:28px;
  }

  .po-accident-lesson{
    min-height:138px;
    padding:18px;
    border:1px solid var(--po-line);
    background:#ece8df;
  }

  .po-accident-lesson small{
    color:var(--po-gold);
    font-size:7px;
    font-weight:950;
    letter-spacing:.1em;
  }

  .po-accident-lesson strong{
    display:block;
    margin:8px 0 6px;
    font-size:15px;
  }

  .po-accident-lesson p{
    margin:0;
    color:var(--po-copy);
    font-size:9px;
    line-height:1.65;
  }

  .po-accident-report{
    display:flex;
    margin-top:24px;
    padding:18px 20px;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border:1px solid #2f353b;
    background:#171c21;
    color:#fff;
  }

  .po-accident-report small{
    display:block;
    color:var(--po-gold-2);
    font-size:7px;
    font-weight:950;
    letter-spacing:.11em;
  }

  .po-accident-report strong{
    display:block;
    margin-top:5px;
    font-size:14px;
  }

  .po-accident-report a{
    color:#fff!important;
    font-size:8px;
    font-weight:950;
    letter-spacing:.08em;
  }
}

@media(max-width:900px){
  .po-mobile-accidents{
    background:var(--po-paper);
    color:var(--po-ink);
  }

  .po-mobile-accidents .po-mobile-copy{color:var(--po-copy);}

  .po-mobile-accident-video{
    position:relative;
    aspect-ratio:16/9;
    margin-top:22px;
    overflow:hidden;
    background:#111;
  }

  .po-mobile-accident-video iframe{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;
  }

  .po-mobile-accident-list{
    display:grid;
    gap:8px;
    margin-top:16px;
  }

  .po-mobile-accident-list>div{
    padding:13px;
    border:1px solid var(--po-line);
    background:var(--po-card);
  }

  .po-mobile-accident-list small{
    display:block;
    color:var(--po-gold);
    font-size:7px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-mobile-accident-list strong{
    display:block;
    margin:5px 0 3px;
    font-size:16px;
  }

  .po-mobile-accident-list span{
    color:var(--po-copy);
    font-size:9px;
  }
}


/* =========================================================
V154 / AVIATION ACCIDENTS — CLEARER LIBRARY + TOGGLE FIX
- Timeline first, themes only as filters
- Single-column rows instead of dense two-column cards
- Decade groups for scanning
- Hard overflow protection for long Japanese/English copy
========================================================= */
@media(min-width:901px){
  .po-accident-browser-lead{
    max-width:780px;
    margin:-4px 0 16px;
    color:var(--po-copy);
    font-size:11px;
    line-height:1.75;
  }

  .po-accident-filter{
    margin-bottom:24px!important;
  }

  .po-accident-filter button{
    min-height:34px!important;
    padding:0 12px!important;
    white-space:nowrap;
  }

  .po-accident-list{
    display:block!important;
  }

  .po-accident-decade{
    margin-top:0;
  }

  .po-accident-decade + .po-accident-decade{
    margin-top:28px;
  }

  .po-accident-decade-head{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:14px;
    align-items:center;
    margin-bottom:8px;
  }

  .po-accident-decade-head span{
    color:var(--po-gold);
    font-size:11px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-accident-decade-head i{
    display:block;
    height:1px;
    background:#c9c2b6;
  }

  .po-accident-decade-cases{
    display:grid;
    gap:7px;
  }

  .po-accident-case{
    display:grid!important;
    grid-template-columns:74px minmax(0,1fr) 34px!important;
    gap:18px!important;
    min-height:0!important;
    padding:16px 16px!important;
    align-items:center!important;
    overflow:hidden!important;
  }

  .po-accident-case-year{
    align-self:start;
    padding-top:4px;
    font-size:18px!important;
  }

  .po-accident-case-copy{
    min-width:0!important;
    overflow:hidden!important;
  }

  .po-accident-case-tags{
    display:flex;
    min-width:0;
    gap:5px;
    flex-wrap:wrap;
    margin-bottom:7px;
  }

  .po-accident-case-tags em{
    display:inline-flex;
    min-height:21px;
    padding:0 7px;
    align-items:center;
    border:1px solid #d0c8bc;
    background:#eee9df;
    color:#756b5d;
    font-size:6.5px;
    font-style:normal;
    font-weight:950;
    letter-spacing:.07em;
    white-space:nowrap;
  }

  .po-accident-case-copy strong{
    display:block!important;
    margin:0 0 4px!important;
    min-width:0!important;
    overflow:hidden!important;
    color:var(--po-ink)!important;
    font-size:18px!important;
    line-height:1.2!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  .po-accident-case-copy>small{
    display:block!important;
    margin-bottom:7px;
    overflow:hidden;
    color:#81786c!important;
    font-size:8px!important;
    font-weight:800!important;
    line-height:1.35!important;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .po-accident-case-copy p{
    display:-webkit-box!important;
    margin:0!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    color:var(--po-copy)!important;
    font-size:10px!important;
    line-height:1.55!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
  }

  .po-accident-case>i{
    align-self:center!important;
    color:#8c8377!important;
  }
}


/* =========================================================
V155 / AVIATION ACCIDENTS — COURSE FLOW REDESIGN
Parent = WHY accident study matters.
Children = real content chapters, never scroll-jump filters.
========================================================= */
@media(min-width:901px){
  .po-accident-home,
  .po-accident-chapter,
  .po-accident-detail{
    width:min(100%,1120px)!important;
    margin:0 auto!important;
    padding:clamp(30px,3vw,50px) clamp(30px,4vw,62px) 64px!important;
  }

  .po-accident-home-head{
    display:grid;
    grid-template-columns:minmax(0,.95fr) minmax(320px,1.05fr);
    gap:54px;
    align-items:end;
    padding-bottom:24px;
    border-bottom:1px solid var(--po-line);
  }

  .po-accident-home-head h1{
    margin:14px 0 0;
    color:var(--po-ink);
    font-size:clamp(58px,5.8vw,92px);
    font-weight:950;
    line-height:.82;
    letter-spacing:-.065em;
  }

  .po-accident-home-head>p{
    margin:0;
    color:var(--po-copy);
    font-size:14px;
    line-height:1.95;
  }

  .po-accident-home-dialogue,
  .po-accident-chapter-dialogue{
    display:grid;
    gap:12px;
    width:min(100%,940px);
    margin:32px auto 0;
  }

  .po-accident-principles{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:34px;
  }

  .po-accident-principles article{
    min-height:190px;
    padding:22px;
    border:1px solid var(--po-line);
    background:#ece8df;
  }

  .po-accident-principles small,
  .po-accident-course-map-head small,
  .po-accident-section-title small{
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
    letter-spacing:.12em;
  }

  .po-accident-principles strong{
    display:block;
    margin:10px 0 8px;
    color:var(--po-ink);
    font-size:18px;
    line-height:1.25;
  }

  .po-accident-principles p{
    margin:0;
    color:var(--po-copy);
    font-size:10px;
    line-height:1.75;
  }

  .po-accident-course-map{
    margin-top:46px;
    padding-top:28px;
    border-top:1px solid var(--po-line);
  }

  .po-accident-course-map-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);
    gap:32px;
    align-items:end;
    margin-bottom:18px;
  }

  .po-accident-course-map-head h2,
  .po-accident-section-title h2{
    margin:6px 0 0;
    color:var(--po-ink);
    font-size:30px;
    line-height:1.08;
    letter-spacing:-.035em;
  }

  .po-accident-course-map-head>p{
    margin:0;
    color:var(--po-copy);
    font-size:10px;
    line-height:1.7;
  }

  .po-accident-chapter-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }

  .po-accident-chapter-grid button{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:48px minmax(0,1fr) 24px;
    gap:14px;
    min-height:142px;
    padding:18px;
    align-items:start;
    border:1px solid var(--po-line);
    background:var(--po-card);
    color:var(--po-ink);
    text-align:left;
    cursor:pointer;
    transition:.16s ease;
  }

  .po-accident-chapter-grid button:hover{
    transform:translateY(-2px);
    border-color:#948a7b;
    background:#eee9df;
  }

  .po-accident-chapter-grid button>span{
    color:var(--po-gold);
    font-size:22px;
    font-weight:950;
  }

  .po-accident-chapter-grid button small{
    display:block;
    color:#857d72;
    font-size:7px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-accident-chapter-grid button strong{
    display:block;
    margin:6px 0;
    font-size:17px;
    line-height:1.2;
  }

  .po-accident-chapter-grid button p{
    margin:0;
    color:var(--po-copy);
    font-size:9px;
    line-height:1.55;
  }

  .po-accident-chapter-grid button>b{
    color:#8c8377;
    font-size:14px;
    font-weight:500;
  }

  .po-accident-chapter-head{
    margin-top:24px;
    padding-bottom:26px;
    border-bottom:1px solid var(--po-line);
  }

  .po-accident-chapter-head>small{
    color:var(--po-gold);
    font-size:9px;
    font-weight:950;
    letter-spacing:.12em;
  }

  .po-accident-chapter-head h1{
    margin:10px 0 16px;
    color:var(--po-ink);
    font-size:clamp(48px,4.8vw,76px);
    line-height:.9;
    letter-spacing:-.055em;
  }

  .po-accident-chapter-head p{
    max-width:820px;
    margin:0;
    color:var(--po-copy);
    font-size:13px;
    line-height:1.9;
  }

  .po-accident-chapter-video{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(250px,.55fr);
    margin-top:26px;
    border:1px solid var(--po-line);
    background:#171c21;
  }

  .po-accident-chapter-video>div:last-child{
    display:flex;
    padding:20px;
    flex-direction:column;
    justify-content:flex-end;
    color:#fff;
  }

  .po-accident-chapter-video small{
    color:var(--po-gold-2);
    font-size:7px;
    font-weight:950;
    letter-spacing:.1em;
  }

  .po-accident-chapter-video strong{
    margin:8px 0 14px;
    font-size:20px;
  }

  .po-accident-chapter-video a{
    color:#fff!important;
    font-size:8px;
    font-weight:950;
  }

  .po-accident-chapter-concepts,
  .po-accident-chapter-cases,
  .po-accident-investigation-sources{
    margin-top:38px;
    padding-top:26px;
    border-top:1px solid var(--po-line);
  }

  .po-accident-concept-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:16px;
  }

  .po-accident-concept-grid article{
    min-height:150px;
    padding:18px;
    border:1px solid var(--po-line);
    background:#ece8df;
  }

  .po-accident-concept-grid small{
    color:var(--po-gold);
    font-size:7px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-accident-concept-grid strong{
    display:block;
    margin:8px 0 6px;
    font-size:15px;
  }

  .po-accident-concept-grid p{
    margin:0;
    color:var(--po-copy);
    font-size:9px;
    line-height:1.65;
  }

  .po-accident-chapter-case{
    appearance:none;
    -webkit-appearance:none;
    display:grid;
    grid-template-columns:72px minmax(0,1fr) auto;
    gap:18px;
    width:100%;
    min-height:142px;
    margin-top:8px;
    padding:18px;
    align-items:center;
    overflow:hidden;
    border:1px solid var(--po-line);
    background:var(--po-card);
    color:var(--po-ink);
    text-align:left;
    cursor:pointer;
  }

  .po-accident-chapter-case:hover{
    border-color:#948a7b;
    background:#eee9df;
  }

  .po-accident-chapter-case-year{
    align-self:start;
    padding-top:3px;
    color:var(--po-gold);
    font-size:19px;
    font-weight:950;
  }

  .po-accident-chapter-case-main{
    min-width:0;
  }

  .po-accident-chapter-case-main small{
    display:block;
    color:#81786c;
    font-size:7px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-accident-chapter-case-main strong{
    display:block;
    margin:5px 0 3px;
    overflow:hidden;
    font-size:19px;
    line-height:1.2;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .po-accident-chapter-case-main em{
    display:block;
    color:#81786c;
    font-size:8px;
    font-style:normal;
    font-weight:800;
  }

  .po-accident-chapter-case-main p{
    display:-webkit-box;
    margin:8px 0 0;
    overflow:hidden;
    color:var(--po-copy);
    font-size:10px;
    line-height:1.55;
    overflow-wrap:anywhere;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }

  .po-accident-chapter-case>b{
    color:#7d7569;
    font-size:7px;
    font-weight:950;
    letter-spacing:.07em;
    white-space:nowrap;
  }

  .po-accident-reading-flow{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:16px;
  }

  .po-accident-reading-flow>div{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:12px;
    padding:17px;
    border:1px solid var(--po-line);
    background:var(--po-card);
  }

  .po-accident-reading-flow span{
    color:var(--po-gold);
    font-size:16px;
    font-weight:950;
  }

  .po-accident-reading-flow strong{
    font-size:12px;
  }

  .po-accident-reading-flow p{
    grid-column:2;
    margin:0;
    color:var(--po-copy);
    font-size:9px;
    line-height:1.6;
  }

  .po-accident-source-links{
    display:flex;
    gap:8px;
    margin-top:10px;
  }

  .po-accident-source-links a{
    display:inline-flex;
    min-height:38px;
    padding:0 12px;
    align-items:center;
    border:1px solid var(--po-dark);
    background:var(--po-dark);
    color:#fff!important;
    font-size:7px;
    font-weight:950;
    letter-spacing:.06em;
  }
}

@media(max-width:900px){
  .po-mobile-accident-list{
    display:none!important;
  }
}


/* =========================================================
V156 / AVIATION ACCIDENTS — SEPARATE CASE LIBRARY
- General theory stays in theory chapters.
- All accident links live only in "代表的な事故".
- Representative accidents are shown as one chronological vertical flow.
- Fix long course-map copy overflow.
========================================================= */
@media(min-width:901px){

  /* Fix: descriptions such as "Crew Monitoring。" never escape the card. */
  .po-accident-chapter-grid button>div{
    min-width:0!important;
    overflow:hidden!important;
  }

  .po-accident-chapter-grid button p{
    display:-webkit-box!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
  }

  .po-accident-chapter-grid button strong{
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  .po-accident-case-entry{
    margin-top:38px;
  }

  .po-accident-case-entry button{
    appearance:none;
    -webkit-appearance:none;
    display:flex;
    width:100%;
    min-height:92px;
    padding:18px 20px;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    border:1px solid #2d3338;
    background:#171c21;
    color:#fff;
    text-align:left;
    cursor:pointer;
    transition:transform .16s ease,background .16s ease;
  }

  .po-accident-case-entry button:hover{
    transform:translateY(-2px);
    background:#22282e;
  }

  .po-accident-case-entry small{
    display:block;
    color:var(--po-gold-2);
    font-size:7px;
    font-weight:950;
    letter-spacing:.12em;
  }

  .po-accident-case-entry strong{
    display:block;
    margin:5px 0 3px;
    font-size:18px;
  }

  .po-accident-case-entry p{
    margin:0;
    color:#c2c9ce;
    font-size:9px;
  }

  .po-accident-case-entry button>span{
    flex:0 0 auto;
    color:#fff;
    font-size:8px;
    font-weight:950;
    letter-spacing:.08em;
    white-space:nowrap;
  }

  .po-accident-timeline-head{
    padding-bottom:28px!important;
  }

  .po-accident-timeline-flow{
    position:relative;
    margin-top:22px;
  }

  .po-accident-timeline-flow:before{
    content:"";
    position:absolute;
    top:18px;
    bottom:24px;
    left:21px;
    width:1px;
    background:#bdb5a9;
    pointer-events:none;
  }

  .po-accident-timeline-item{
    appearance:none;
    -webkit-appearance:none;
    position:relative;
    display:grid;
    grid-template-columns:44px 72px minmax(0,1fr) auto;
    gap:16px;
    width:100%;
    min-height:132px;
    padding:18px 0 18px;
    align-items:start;
    border:0;
    border-bottom:1px solid var(--po-line);
    background:transparent;
    color:var(--po-ink);
    text-align:left;
    cursor:pointer;
  }

  .po-accident-timeline-item:hover .po-accident-timeline-copy strong{
    color:var(--po-gold);
  }

  .po-accident-timeline-rail{
    position:relative;
    display:flex;
    min-height:96px;
    align-items:flex-start;
    justify-content:center;
    z-index:2;
  }

  .po-accident-timeline-node{
    display:block;
    width:11px;
    height:11px;
    margin-top:5px;
    border:2px solid var(--po-gold);
    border-radius:50%;
    background:var(--po-paper);
  }

  .po-accident-timeline-arrow{
    position:absolute;
    left:50%;
    bottom:-18px;
    transform:translateX(-50%);
    color:var(--po-gold);
    font-size:15px;
    font-style:normal;
    font-weight:900;
    line-height:1;
    background:var(--po-paper);
    padding:3px 0;
  }

  .po-accident-timeline-year{
    padding-top:1px;
    color:var(--po-gold);
    font-size:19px;
    font-weight:950;
    letter-spacing:-.02em;
  }

  .po-accident-timeline-copy{
    min-width:0;
    overflow:hidden;
  }

  .po-accident-timeline-copy small{
    display:block;
    color:#80786d;
    font-size:7px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-accident-timeline-copy strong{
    display:block;
    margin:6px 0 3px;
    overflow:hidden;
    font-size:20px;
    line-height:1.15;
    text-overflow:ellipsis;
    white-space:nowrap;
    transition:color .16s ease;
  }

  .po-accident-timeline-copy em{
    display:block;
    color:#80786d;
    font-size:8px;
    font-style:normal;
    font-weight:800;
  }

  .po-accident-timeline-copy p{
    display:-webkit-box;
    margin:9px 0 0;
    max-width:760px;
    overflow:hidden;
    color:var(--po-copy);
    font-size:10px;
    line-height:1.6;
    overflow-wrap:anywhere;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }

  .po-accident-timeline-item>b{
    align-self:center;
    color:#756d62;
    font-size:7px;
    font-weight:950;
    letter-spacing:.07em;
    white-space:nowrap;
  }
}


/* =========================================================
V157 / AVIATION ACCIDENTS — 24 REPRESENTATIVE CASES
========================================================= */
@media(min-width:901px){
  .po-accident-timeline-meta{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:16px;
  }

  .po-accident-timeline-meta span{
    display:inline-flex;
    min-height:28px;
    padding:0 9px;
    align-items:center;
    border:1px solid #c8c1b5;
    background:#ece8df;
    color:#766d61;
    font-size:7px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-accident-timeline-item{
    min-height:142px!important;
  }
}


/* =========================================================
V158 / AVIATION ACCIDENTS — TIMELINE HOVER FIX
Keep the timeline readable against Elementor/theme button hover styles.
========================================================= */
@media(min-width:901px){
  .po-accident-timeline-item,
  .po-accident-timeline-item:focus,
  .po-accident-timeline-item:active{
    background:transparent!important;
    color:var(--po-ink)!important;
    border-left:0!important;
    border-right:0!important;
    box-shadow:none!important;
    outline:none!important;
  }

  .po-accident-timeline-item:hover{
    background:#ebe6dc!important;
    color:var(--po-ink)!important;
  }

  .po-accident-timeline-item:hover .po-accident-timeline-year{
    color:var(--po-gold)!important;
  }

  .po-accident-timeline-item:hover .po-accident-timeline-copy small,
  .po-accident-timeline-item:hover .po-accident-timeline-copy em,
  .po-accident-timeline-item:hover .po-accident-timeline-copy p{
    color:var(--po-copy)!important;
  }

  .po-accident-timeline-item:hover .po-accident-timeline-copy strong{
    color:var(--po-ink)!important;
  }

  .po-accident-timeline-item:hover>b{
    color:var(--po-gold)!important;
  }

  .po-accident-timeline-item:focus-visible{
    outline:2px solid var(--po-gold)!important;
    outline-offset:-2px!important;
    background:#ebe6dc!important;
  }

  .po-accident-timeline-item:hover .po-accident-timeline-node,
  .po-accident-timeline-item:focus-visible .po-accident-timeline-node{
    background:var(--po-gold)!important;
    border-color:var(--po-gold)!important;
  }
}


/* =========================================================
V159 / EASTERN AIR LINES 401 — FULL CASE STUDY
========================================================= */
@media(min-width:901px){
  .po-e401{
    color:var(--po-ink);
  }

  .po-e401-hero{
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);
    gap:42px;
    margin-top:24px;
    padding-bottom:30px;
    border-bottom:1px solid var(--po-line);
  }

  .po-e401-hero-copy>small,
  .po-e401-section-head>small,
  .po-e401-video-meta small,
  .po-e401-finding small,
  .po-e401-sources small{
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
    letter-spacing:.13em;
  }

  .po-e401-hero h1{
    margin:11px 0 18px;
    font-size:clamp(54px,5.5vw,86px);
    line-height:.86;
    letter-spacing:-.06em;
  }

  .po-e401-hero-copy>p{
    max-width:700px;
    margin:0;
    color:var(--po-copy);
    font-size:14px;
    line-height:1.9;
  }

  .po-e401-fact-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-content:start;
    border-top:1px solid var(--po-line);
    border-left:1px solid var(--po-line);
  }

  .po-e401-fact-grid>div{
    min-width:0;
    min-height:72px;
    padding:12px;
    border-right:1px solid var(--po-line);
    border-bottom:1px solid var(--po-line);
    background:#ece8df;
  }

  .po-e401-fact-grid small{
    display:block;
    color:#857d71;
    font-size:7px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-e401-fact-grid strong{
    display:block;
    margin-top:6px;
    overflow-wrap:anywhere;
    font-size:11px;
    line-height:1.35;
  }

  .po-e401-video-block{
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(270px,.45fr);
    margin-top:28px;
    overflow:hidden;
    border:1px solid #292f35;
    background:#151a1f;
  }

  .po-e401-video{
    position:relative;
    aspect-ratio:16/9;
    background:#0d1115;
  }

  .po-e401-video iframe{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;
  }

  .po-e401-video-meta{
    display:flex;
    min-width:0;
    padding:22px;
    flex-direction:column;
    justify-content:flex-end;
    color:#fff;
  }

  .po-e401-video-meta small{color:var(--po-gold-2);}

  .po-e401-video-meta strong{
    display:block;
    margin:8px 0 8px;
    font-size:19px;
    line-height:1.2;
  }

  .po-e401-video-meta p{
    margin:0 0 18px;
    color:#c1c9cf;
    font-size:9px;
    line-height:1.65;
  }

  .po-e401-video-meta a{
    display:inline-flex;
    min-height:38px;
    padding:0 11px;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.28);
    color:#fff!important;
    font-size:7px;
    font-weight:950;
    letter-spacing:.07em;
  }

  .po-e401-section{
    margin-top:42px;
    padding-top:28px;
    border-top:1px solid var(--po-line);
  }

  .po-e401-section-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);
    gap:28px;
    align-items:end;
    margin-bottom:18px;
  }

  .po-e401-section-head h2{
    grid-column:1;
    margin:6px 0 0;
    font-size:31px;
    line-height:1.08;
    letter-spacing:-.035em;
  }

  .po-e401-section-head>p{
    grid-column:2;
    grid-row:1 / span 2;
    margin:0;
    color:var(--po-copy);
    font-size:10px;
    line-height:1.7;
  }

  .po-e401-event-flow{
    position:relative;
    margin-top:14px;
  }

  .po-e401-event-flow:before{
    content:"";
    position:absolute;
    top:16px;
    bottom:20px;
    left:21px;
    width:1px;
    background:#c0b8ab;
  }

  .po-e401-event-flow article{
    position:relative;
    display:grid;
    grid-template-columns:44px minmax(0,1fr);
    gap:17px;
    padding:0 0 22px;
  }

  .po-e401-event-flow article>span{
    position:relative;
    z-index:2;
    display:grid;
    width:43px;
    height:43px;
    place-items:center;
    border:1px solid #b89a62;
    border-radius:50%;
    background:var(--po-paper);
    color:var(--po-gold);
    font-size:8px;
    font-weight:950;
  }

  .po-e401-event-flow article>div{
    min-width:0;
    padding:4px 0 20px;
    border-bottom:1px solid var(--po-line);
  }

  .po-e401-event-flow small{
    color:var(--po-gold);
    font-size:7px;
    font-weight:950;
    letter-spacing:.1em;
  }

  .po-e401-event-flow strong{
    display:block;
    margin:5px 0 6px;
    font-size:17px;
  }

  .po-e401-event-flow p{
    max-width:850px;
    margin:0;
    color:var(--po-copy);
    font-size:10px;
    line-height:1.75;
  }

  .po-e401-dialogue{
    display:grid;
    gap:12px;
    width:min(100%,940px);
    margin:38px auto 0;
    padding-top:30px;
    border-top:1px solid var(--po-line);
  }

  .po-e401-chain{
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;
    gap:7px;
    align-items:stretch;
  }

  .po-e401-chain article{
    min-width:0;
    min-height:180px;
    padding:16px;
    border:1px solid var(--po-line);
    background:#ece8df;
  }

  .po-e401-chain>i{
    display:grid;
    place-items:center;
    color:var(--po-gold);
    font-size:18px;
    font-style:normal;
    transform:rotate(-90deg);
  }

  .po-e401-chain article>span{
    display:block;
    color:var(--po-gold);
    font-size:18px;
    font-weight:950;
  }

  .po-e401-chain small{
    display:block;
    margin-top:10px;
    color:#847a6d;
    font-size:6.5px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-e401-chain strong{
    display:block;
    margin:6px 0 7px;
    font-size:13px;
    line-height:1.25;
  }

  .po-e401-chain p{
    margin:0;
    color:var(--po-copy);
    font-size:8px;
    line-height:1.6;
  }

  .po-e401-finding{
    margin-top:34px;
    padding:22px 24px;
    border-left:4px solid var(--po-gold);
    background:#171c21;
    color:#fff;
  }

  .po-e401-finding small{color:var(--po-gold-2);}

  .po-e401-finding strong{
    display:block;
    margin:9px 0 8px;
    font-size:18px;
    line-height:1.45;
  }

  .po-e401-finding p{
    margin:0;
    color:#c6cdd2;
    font-size:10px;
    line-height:1.7;
  }

  .po-e401-lessons{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }

  .po-e401-lessons article{
    min-height:154px;
    padding:18px;
    border:1px solid var(--po-line);
    background:var(--po-card);
  }

  .po-e401-lessons small{
    color:var(--po-gold);
    font-size:7px;
    font-weight:950;
    letter-spacing:.08em;
  }

  .po-e401-lessons strong{
    display:block;
    margin:7px 0 6px;
    font-size:16px;
  }

  .po-e401-lessons p{
    margin:0;
    color:var(--po-copy);
    font-size:9px;
    line-height:1.65;
  }

  .po-e401-change{
    margin-top:42px;
    padding-top:28px;
    border-top:1px solid var(--po-line);
  }

  .po-e401-change-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
  }

  .po-e401-change-grid article{
    min-height:178px;
    padding:18px;
    border:1px solid var(--po-line);
    background:#ece8df;
  }

  .po-e401-change-grid span{
    color:var(--po-gold);
    font-size:18px;
    font-weight:950;
  }

  .po-e401-change-grid strong{
    display:block;
    margin:10px 0 7px;
    font-size:14px;
  }

  .po-e401-change-grid p{
    margin:0;
    color:var(--po-copy);
    font-size:9px;
    line-height:1.65;
  }

  .po-e401-discussion{
    margin-top:42px;
    padding-top:28px;
    border-top:1px solid var(--po-line);
  }

  .po-e401-question-list{
    border-top:1px solid var(--po-line);
  }

  .po-e401-question-list>div{
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:12px;
    padding:14px 0;
    border-bottom:1px solid var(--po-line);
  }

  .po-e401-question-list span{
    color:var(--po-gold);
    font-size:9px;
    font-weight:950;
  }

  .po-e401-question-list p{
    margin:0;
    font-size:12px;
    line-height:1.55;
  }

  .po-e401-sources{
    display:flex;
    margin-top:36px;
    padding:18px 20px;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border:1px solid #2f353b;
    background:#171c21;
    color:#fff;
  }

  .po-e401-sources small{
    display:block;
    color:var(--po-gold-2);
  }

  .po-e401-sources strong{
    display:block;
    margin-top:5px;
    font-size:14px;
  }

  .po-e401-source-actions{
    display:flex;
    gap:7px;
    flex-wrap:wrap;
    justify-content:flex-end;
  }

  .po-e401-source-actions a{
    display:inline-flex;
    min-height:36px;
    padding:0 10px;
    align-items:center;
    border:1px solid rgba(255,255,255,.25);
    color:#fff!important;
    font-size:7px;
    font-weight:950;
    letter-spacing:.06em;
  }
}

@media(max-width:900px){
  .po-e401-hero,
  .po-e401-video-block,
  .po-e401-section-head,
  .po-e401-chain,
  .po-e401-lessons,
  .po-e401-change-grid{
    display:block!important;
  }

  .po-e401-fact-grid{
    grid-template-columns:1fr 1fr!important;
  }

  .po-e401-video-meta{
    padding:16px!important;
  }

  .po-e401-chain>i{
    display:block!important;
    padding:7px 0;
    text-align:center;
    transform:none!important;
  }

  .po-e401-chain article,
  .po-e401-lessons article,
  .po-e401-change-grid article{
    margin-top:8px;
  }

  .po-e401-sources{
    display:block!important;
  }

  .po-e401-source-actions{
    margin-top:12px;
    justify-content:flex-start!important;
  }
}


/* =========================================================
V170 / JAPANESE COURSE LIBRARY MENU
========================================================= */
.po-accident-api-status{
  display:flex;
  min-height:220px;
  padding:28px;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  border:1px solid var(--po-line);
  background:var(--po-card);
}
.po-accident-api-status small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}
.po-accident-api-status strong{
  margin:8px 0 5px;
  color:var(--po-ink);
  font-size:20px;
}
.po-accident-api-status span{
  color:var(--po-copy);
  font-size:10px;
}
.po-accident-api-status.is-error{
  border-left:4px solid #8a3f35;
}
.po-mobile-accident-video-placeholder{
  display:flex!important;
  min-height:150px;
  padding:18px;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  background:#171c21!important;
  color:#fff;
}
.po-mobile-accident-video-placeholder span{
  color:var(--po-gold-2);
  font-size:7px;
  font-weight:950;
  letter-spacing:.12em;
}
.po-mobile-accident-video-placeholder strong{
  margin-top:7px;
  font-size:18px;
  line-height:1.25;
}


/* =========================================================
V162 / AVIATION ACCIDENTS — RICH CASES + CLICK-TO-PLAY VIDEO
========================================================= */
.po-accident-study-lens,
.po-accident-related-videos{
  margin-top:32px;
  padding-top:26px;
  border-top:1px solid var(--po-line);
}
.po-accident-study-lens-head,
.po-accident-related-video-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,.62fr);
  gap:28px;
  align-items:end;
  margin-bottom:16px;
}
.po-accident-study-lens-head small,
.po-accident-related-video-head small{
  color:var(--po-gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}
.po-accident-study-lens-head h2,
.po-accident-related-video-head h2{
  margin:6px 0 0;
  color:var(--po-ink);
  font-size:28px;
  line-height:1.08;
  letter-spacing:-.035em;
}
.po-accident-study-lens-head>p,
.po-accident-related-video-head>p{
  margin:0;
  color:var(--po-copy);
  font-size:9px;
  line-height:1.7;
}
.po-accident-study-lens-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.po-accident-study-lens-grid article{
  min-height:86px;
  padding:14px 15px;
  border:1px solid var(--po-line);
  background:#ece8df;
}
.po-accident-study-lens-grid small{
  display:block;
  color:#8a806f;
  font-size:7px;
  font-weight:950;
  letter-spacing:.08em;
}
.po-accident-study-lens-grid strong{
  display:block;
  margin-top:7px;
  color:var(--po-ink);
  font-size:13px;
  line-height:1.3;
}
.po-accident-video-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.po-accident-video-grid.is-single{
  grid-template-columns:minmax(0,820px);
}
.po-accident-video-card{
  overflow:hidden;
  border:1px solid var(--po-line);
  background:var(--po-card);
}
.po-accident-video-stage{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:16/9;
  padding:0!important;
  overflow:hidden;
  border:0!important;
  background:#11171c!important;
  cursor:pointer;
}
.po-accident-video-stage img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .22s ease,filter .22s ease;
}
.po-accident-video-stage:hover img{
  transform:scale(1.018);
  filter:brightness(.78);
}
.po-accident-video-stage iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
.po-accident-video-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.48));
}
.po-accident-video-play{
  position:absolute;
  left:18px;
  bottom:16px;
  display:flex;
  align-items:center;
  gap:10px;
  color:#fff;
}
.po-accident-video-play i{
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border:1px solid rgba(255,255,255,.7);
  border-radius:50%;
  background:rgba(19,24,29,.8);
  font-size:13px;
  font-style:normal;
}
.po-accident-video-play b{
  font-size:8px;
  font-weight:950;
  letter-spacing:.1em;
}
.po-accident-video-copy{
  padding:16px;
}
.po-accident-video-copy small{
  display:block;
  color:var(--po-gold);
  font-size:7px;
  font-weight:950;
  letter-spacing:.08em;
}
.po-accident-video-copy strong{
  display:block;
  margin:7px 0 7px;
  color:var(--po-ink);
  font-size:16px;
  line-height:1.3;
}
.po-accident-video-copy p{
  margin:0;
  color:var(--po-copy);
  font-size:9px;
  line-height:1.65;
}
.po-accident-video-copy a{
  display:inline-flex;
  margin-top:12px;
  color:var(--po-ink)!important;
  font-size:7px;
  font-weight:950;
  letter-spacing:.07em;
  text-decoration:none;
}
.po-accident-video-copy a:hover{
  color:var(--po-gold)!important;
}
@media(max-width:900px){
  .po-accident-study-lens-head,
  .po-accident-related-video-head,
  .po-accident-study-lens-grid,
  .po-accident-video-grid,
  .po-accident-video-grid.is-single{
    display:block!important;
  }
  .po-accident-study-lens-head>p,
  .po-accident-related-video-head>p{
    margin-top:9px!important;
  }
  .po-accident-study-lens-grid article,
  .po-accident-video-card{
    margin-top:8px;
  }
}


/* =========================================================
V163 / ACCIDENT VIDEO — UNAVAILABLE/EMBED BLOCK FALLBACK
========================================================= */
.po-accident-video-loading{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}
.po-accident-video-player-host{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.po-accident-video-player-host iframe{
  width:100%!important;
  height:100%!important;
}
.po-accident-video-stage.is-video-error{
  cursor:default;
}
.po-accident-video-error{
  position:absolute;
  inset:0;
  display:flex;
  padding:24px;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  background:#171c21;
  color:#fff;
  text-align:left;
}
.po-accident-video-error small{
  color:var(--po-gold-2);
  font-size:7px;
  font-weight:950;
  letter-spacing:.12em;
}
.po-accident-video-error strong{
  margin:7px 0 7px;
  font-size:17px;
  line-height:1.3;
}
.po-accident-video-error p{
  margin:0;
  color:#c2c9ce;
  font-size:9px;
  line-height:1.55;
}
.po-accident-video-error a{
  display:inline-flex;
  margin-top:13px;
  min-height:34px;
  padding:0 10px;
  align-items:center;
  border:1px solid rgba(255,255,255,.3);
  color:#fff!important;
  font-size:7px;
  font-weight:950;
  text-decoration:none;
}


/* =========================================================
V165 / AUTO-VERIFY YOUTUBE EMBEDDABILITY
========================================================= */
.po-accident-video-stage.is-video-checking{
  cursor:wait!important;
}
.po-accident-video-stage.is-video-checking img{
  filter:brightness(.42) saturate(.65);
}
.po-accident-video-stage:disabled{
  opacity:1!important;
}


/* =========================================================
V166 / YOUTUBE IFRAME PLAYER PROBE
========================================================= */
.po-accident-video-probe-host{
  position:fixed!important;
  left:-10000px!important;
  top:-10000px!important;
  width:320px!important;
  height:200px!important;
  opacity:.001!important;
  pointer-events:none!important;
  overflow:hidden!important;
}
.po-accident-video-probe-host iframe{
  width:320px!important;
  height:200px!important;
}


/* =========================================================
V168 / ACCIDENT VIDEO — CLEAN HEADER + CENTERED PLAYER
========================================================= */
.po-accident-related-video-head{
  display:block!important;
  max-width:920px;
  margin:0 auto 18px!important;
  text-align:center;
}
.po-accident-related-video-head>div{
  width:100%;
}
.po-accident-related-video-head h2{
  text-align:center;
}
.po-accident-video-grid,
.po-accident-video-grid.is-single{
  display:flex!important;
  justify-content:center!important;
  align-items:flex-start!important;
  width:100%;
}
.po-accident-video-card{
  width:min(100%,920px)!important;
  margin:0 auto!important;
}
.po-accident-video-stage{
  width:100%!important;
  margin:0 auto!important;
}
.po-accident-video-copy{
  text-align:left;
}
@media(max-width:900px){
  .po-accident-related-video-head{
    text-align:left!important;
  }
  .po-accident-related-video-head h2{
    text-align:left!important;
  }
  .po-accident-video-grid,
  .po-accident-video-grid.is-single{
    display:block!important;
  }
  .po-accident-video-card{
    width:100%!important;
  }
}


/* =========================================================
V171 / GLOBAL REVERSE SEARCH
========================================================= */
.po-site-search{
  position:relative;
  width:276px;
  pointer-events:auto;
}
.po-site-search-form{
  position:relative;
  display:flex;
  width:100%;
  height:35px;
  align-items:center;
  border:1px solid rgba(23,27,32,.34);
  background:rgba(255,255,255,.36);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.po-site-search:focus-within .po-site-search-form,
.po-site-search.is-open .po-site-search-form{
  border-color:var(--po-dark);
  background:#f8f6f1;
  box-shadow:0 8px 22px rgba(24,25,27,.08);
}
.po-site-search-icon,
.po-site-search-close{
  flex:0 0 34px;
  width:34px;
  height:33px;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:var(--po-ink)!important;
  cursor:pointer;
}
.po-site-search-icon{
  font-size:20px;
  line-height:1;
  transform:translateY(-1px);
}
.po-site-search-close{
  display:none;
  font-size:18px;
}
.po-site-search-input,
#po-site-search-input{
  min-width:0;
  flex:1 1 auto;
  width:100%;
  height:33px;
  padding:0 8px 0 0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--po-ink)!important;
  font-family:inherit!important;
  font-size:10px!important;
  font-weight:750!important;
  letter-spacing:.02em!important;
}
#po-site-search-input::placeholder{
  color:#716b62;
  opacity:.82;
}
#po-site-search-input::-webkit-search-cancel-button{
  display:none;
}
.po-site-search-panel{
  position:absolute;
  top:43px;
  right:0;
  width:min(520px,calc(100vw - 48px));
  max-height:min(680px,calc(100vh - 96px));
  overflow:auto;
  border:1px solid #cbc5ba;
  background:#f7f4ed;
  box-shadow:0 18px 48px rgba(28,29,30,.18);
  color:var(--po-ink);
  z-index:980;
}
.po-site-search-panel[hidden]{
  display:none!important;
}
.po-site-search-intro,
.po-site-search-state{
  padding:22px;
}
.po-site-search-intro small,
.po-site-search-state small,
.po-site-search-result small{
  color:var(--po-gold);
  font-size:7px;
  font-weight:950;
  letter-spacing:.1em;
}
.po-site-search-intro strong,
.po-site-search-state strong{
  display:block;
  margin-top:7px;
  font-size:17px;
}
.po-site-search-intro p,
.po-site-search-state p{
  margin:7px 0 0;
  color:#666158;
  font-size:10px;
  line-height:1.7;
}
.po-site-search-examples{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin-top:14px;
}
.po-site-search-example{
  min-height:29px;
  padding:0 9px!important;
  border:1px solid #d3cdc2!important;
  background:#ede9df!important;
  color:var(--po-ink)!important;
  font-size:8px!important;
  font-weight:850!important;
  cursor:pointer;
}
.po-site-search-summary{
  display:flex;
  min-height:42px;
  padding:0 15px;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #d8d2c7;
  background:#ede9df;
}
.po-site-search-summary strong{
  font-size:9px;
}
.po-site-search-summary span{
  color:#7c756a;
  font-size:8px;
}
.po-site-search-results{
  display:block;
}
.po-site-search-result{
  position:relative;
  display:block;
  width:100%;
  padding:15px 44px 15px 16px!important;
  border:0!important;
  border-bottom:1px solid #ddd7cc!important;
  background:transparent!important;
  color:var(--po-ink)!important;
  text-align:left!important;
  text-decoration:none!important;
  cursor:pointer;
}
.po-site-search-result:last-child{
  border-bottom:0!important;
}
.po-site-search-result:hover,
.po-site-search-result:focus-visible{
  background:#ebe6dc!important;
  outline:0!important;
}
.po-site-search-result strong{
  display:block;
  margin-top:5px;
  font-size:14px;
  line-height:1.35;
}
.po-site-search-result em{
  display:block;
  margin-top:4px;
  color:#776f64;
  font-size:8px;
  font-style:normal;
  font-weight:800;
}
.po-site-search-result p{
  margin:7px 0 0;
  color:#5e5a54;
  font-size:9px;
  line-height:1.55;
}
.po-site-search-result b{
  position:absolute;
  right:15px;
  top:50%;
  color:var(--po-gold);
  font-size:13px;
  transform:translateY(-50%);
}
.po-site-search-match{
  color:var(--po-gold);
}
@media(min-width:901px) and (max-width:1180px){
  .po-site-search{
    width:220px;
  }
  .po-header-typing{
    display:none!important;
  }
}
@media(max-width:900px){
  .po-actions{
    gap:6px!important;
  }
  .po-site-search{
    width:35px;
  }
  .po-site-search-form{
    width:35px;
  }
  .po-site-search input,
  .po-site-search-close{
    display:none!important;
  }
  .po-site-search.is-open{
    position:fixed;
    left:12px;
    right:12px;
    top:12px;
    width:auto;
    z-index:1005;
  }
  .po-site-search.is-open .po-site-search-form{
    width:100%;
    height:42px;
  }
  .po-site-search.is-open input{
    display:block!important;
    height:40px;
    font-size:12px!important;
  }
  .po-site-search.is-open .po-site-search-close{
    display:block!important;
    height:40px;
  }
  .po-site-search.is-open .po-site-search-icon{
    height:40px;
  }
  .po-site-search-panel{
    position:fixed;
    left:12px;
    right:12px;
    top:60px;
    width:auto;
    max-height:calc(100vh - 76px);
  }
}


/* =========================================================
V178 / SEARCH EXAMPLES — TEXT ONLY
========================================================= */
.po-site-search-examples-text{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:14px;
  color:#777066;
  font-size:8px;
}
.po-site-search-examples-text span{
  font-weight:850;
}
.po-site-search-examples-text b{
  display:inline-flex;
  min-height:26px;
  padding:0 8px;
  align-items:center;
  border:1px solid #d3cdc2;
  background:#ede9df;
  color:var(--po-ink);
  font-size:8px;
  font-weight:850;
  cursor:default;
}


/* =========================================================
V179 / SEARCH TYPOGRAPHY — LARGER + EASIER TO READ
========================================================= */
@media(min-width:901px){
  .po-site-search{
    width:300px!important;
  }
  .po-site-search-form{
    height:39px!important;
  }
  .po-site-search-icon,
  .po-site-search-close{
    height:37px!important;
  }
  .po-site-search-panel{
    top:47px!important;
  }
}
#po-site-search-input{
  height:37px!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.01em!important;
}
#po-site-search-input::placeholder{
  font-size:12px!important;
}
.po-site-search-intro,
.po-site-search-state{
  padding:24px!important;
}
.po-site-search-intro small,
.po-site-search-state small,
.po-site-search-result small{
  font-size:8px!important;
}
.po-site-search-intro strong,
.po-site-search-state strong{
  margin-top:8px!important;
  font-size:19px!important;
  line-height:1.35!important;
}
.po-site-search-intro p,
.po-site-search-state p{
  font-size:11px!important;
  line-height:1.75!important;
}
.po-site-search-examples-text{
  gap:9px!important;
  margin-top:16px!important;
  font-size:9px!important;
}
.po-site-search-examples-text b{
  min-height:30px!important;
  padding:0 10px!important;
  font-size:9px!important;
}
.po-site-search-summary{
  min-height:46px!important;
  padding:0 17px!important;
}
.po-site-search-summary strong{
  font-size:10px!important;
}
.po-site-search-summary span{
  font-size:9px!important;
}
.po-site-search-result{
  padding:17px 48px 17px 18px!important;
}
.po-site-search-result strong{
  margin-top:6px!important;
  font-size:16px!important;
  line-height:1.38!important;
}
.po-site-search-result em{
  margin-top:5px!important;
  font-size:9px!important;
  line-height:1.45!important;
}
.po-site-search-result p{
  margin-top:8px!important;
  font-size:10.5px!important;
  line-height:1.65!important;
}
.po-site-search-result b{
  right:17px!important;
  font-size:15px!important;
}
@media(max-width:900px){
  .po-site-search.is-open .po-site-search-form{
    height:46px!important;
  }
  .po-site-search.is-open input{
    height:44px!important;
    font-size:14px!important;
  }
  .po-site-search.is-open .po-site-search-close,
  .po-site-search.is-open .po-site-search-icon{
    height:44px!important;
  }
  .po-site-search-panel{
    top:64px!important;
  }
  .po-site-search-result strong{
    font-size:15px!important;
  }
  .po-site-search-result p{
    font-size:10.5px!important;
  }
}


/* =========================================================
V180 / SEARCH UI POLISH
- No horizontal scrollbar
- Subtle vertical scrollbar
- Larger text in intro + results panels
========================================================= */
.po-site-search-panel{
  overflow-x:hidden!important;
  overflow-y:auto!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(23,27,32,.22) transparent;
  overscroll-behavior:contain;
}
.po-site-search-panel::-webkit-scrollbar{
  width:7px;
  height:0!important;
}
.po-site-search-panel::-webkit-scrollbar-track{
  background:transparent;
}
.po-site-search-panel::-webkit-scrollbar-thumb{
  background:rgba(23,27,32,.18);
  border-radius:999px;
}
.po-site-search-panel::-webkit-scrollbar-thumb:hover{
  background:rgba(23,27,32,.28);
}
.po-site-search-panel *{
  box-sizing:border-box;
  min-width:0;
}
.po-site-search-results,
.po-site-search-result,
.po-site-search-result p,
.po-site-search-result strong,
.po-site-search-result em,
.po-site-search-intro,
.po-site-search-state{
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.po-site-search-intro small,
.po-site-search-state small,
.po-site-search-result small{
  font-size:9px!important;
}
.po-site-search-intro strong,
.po-site-search-state strong{
  font-size:21px!important;
  line-height:1.35!important;
}
.po-site-search-intro p,
.po-site-search-state p{
  font-size:12px!important;
  line-height:1.8!important;
}
.po-site-search-examples-text{
  font-size:10px!important;
}
.po-site-search-examples-text b{
  min-height:32px!important;
  padding:0 11px!important;
  font-size:10px!important;
}
.po-site-search-summary{
  min-height:48px!important;
}
.po-site-search-summary strong{
  font-size:11px!important;
}
.po-site-search-summary span{
  font-size:9.5px!important;
}
.po-site-search-result{
  overflow:hidden!important;
  padding:19px 48px 19px 18px!important;
}
.po-site-search-result strong{
  font-size:17px!important;
  line-height:1.4!important;
}
.po-site-search-result em{
  font-size:10px!important;
  line-height:1.5!important;
}
.po-site-search-result p{
  font-size:11px!important;
  line-height:1.7!important;
}
@media(max-width:900px){
  .po-site-search-panel{
    overflow-x:hidden!important;
  }
  .po-site-search-intro strong,
  .po-site-search-state strong{
    font-size:19px!important;
  }
  .po-site-search-intro p,
  .po-site-search-state p{
    font-size:11.5px!important;
  }
  .po-site-search-result strong{
    font-size:16px!important;
  }
  .po-site-search-result em{
    font-size:9.5px!important;
  }
  .po-site-search-result p{
    font-size:10.5px!important;
  }
}


/* =========================================================
V181 / SEARCH EXAMPLES — LARGER + JP/EN MIX
========================================================= */
.po-site-search-examples-text{
  gap:10px!important;
  margin-top:18px!important;
  font-size:12px!important;
  line-height:1!important;
}
.po-site-search-examples-text span{
  font-size:11px!important;
  font-weight:900!important;
}
.po-site-search-examples-text b{
  min-height:36px!important;
  padding:0 13px!important;
  font-size:11.5px!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
}
@media(max-width:900px){
  .po-site-search-examples-text{
    gap:8px!important;
    font-size:11px!important;
  }
  .po-site-search-examples-text span{
    font-size:10.5px!important;
  }
  .po-site-search-examples-text b{
    min-height:34px!important;
    padding:0 11px!important;
    font-size:11px!important;
  }
}


/* =========================================================
V182 / TOP-PAGE GUIDE SEARCH
========================================================= */
.po-site-search-result[data-search-local-kind] small{
  color:#9a6817!important;
}
.po-site-search-result[data-search-local-kind]{
  background:rgba(235,230,220,.34)!important;
}
.po-site-search-result[data-search-local-kind]:hover,
.po-site-search-result[data-search-local-kind]:focus-visible{
  background:#e9e3d7!important;
}


/* =========================================================
V183 / SIDEBAR HOME RESET + UNIFIED PARENT TYPOGRAPHY
COURSE LIBRARY parent rows now match GUIDE parent rows.
========================================================= */
@media(min-width:901px){
  .po-global-catalog-toggle>span{
    font-size:9px!important;
  }

  .po-global-catalog-toggle>strong{
    font-size:14px!important;
    font-weight:900!important;
    line-height:1.25!important;
  }
}

/* Keep the same typography even on narrower desktop widths. */
@media(min-width:901px) and (max-width:1320px){
  .po-global-catalog-toggle>strong{
    font-size:14px!important;
  }
}



/* =========================================================
V189 / MOBILE EDITORIAL FLOW — ROBUST VERTICAL LAYOUT
Desktop remains unchanged. Mobile is intentionally document-like and scroll-first.
========================================================= */
@media(max-width:900px){
  html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important;}
  body{background:var(--po-paper)!important;}
  .po-header-typing{display:none!important;}
  .po-mobile{display:block!important;width:100%!important;max-width:100%!important;overflow:hidden!important;background:var(--po-paper)!important;color:var(--po-ink);}
  .po-mobile,.po-mobile *{box-sizing:border-box!important;min-width:0;}
  .po-mobile img,.po-mobile video,.po-mobile iframe,.po-mobile svg{max-width:100%!important;}
  .po-mobile h1,.po-mobile h2,.po-mobile h3,.po-mobile p,.po-mobile strong,.po-mobile span,.po-mobile a{max-width:100%;overflow-wrap:break-word;word-break:normal;}
  .po-mobile a{color:inherit;text-decoration:none;}
  .po-mobile-section{width:100%!important;padding:64px 18px!important;overflow:hidden!important;}
  .po-mobile-inner{width:100%!important;max-width:680px!important;margin:0 auto!important;}
  .po-mobile-kicker{margin:0 0 10px!important;font-size:10px!important;line-height:1.4!important;letter-spacing:.13em!important;}
  .po-mobile-title{margin:0!important;font-size:clamp(30px,9vw,42px)!important;line-height:1.08!important;letter-spacing:-.04em!important;white-space:normal!important;text-wrap:balance;}
  .po-mobile-copy,.po-mobile-start-head>p{margin:15px 0 0!important;font-size:14px!important;line-height:1.85!important;}
  .po-mobile-cta{display:flex!important;width:100%!important;min-height:48px!important;margin-top:22px!important;padding:0 15px!important;justify-content:space-between!important;font-size:11px!important;line-height:1.4!important;letter-spacing:.04em!important;white-space:normal!important;}
  .po-mobile-cta:after{flex:0 0 auto;margin-left:12px!important;}

  /* Fixed header: keep logo/actions from colliding on narrow phones. */
  .po-header{height:56px!important;background:rgba(225,221,212,.96)!important;border-bottom:1px solid #d1cbc1!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);}
  .po-logo{left:12px!important;top:20px!important;max-width:118px!important;overflow:hidden!important;}
  .po-logo strong{font-size:15px!important;letter-spacing:.75px!important;white-space:nowrap!important;}
  .po-actions{right:6px!important;top:10px!important;gap:4px!important;}
  .po-header-mypage{min-height:34px!important;padding:0 8px!important;font-size:8px!important;letter-spacing:.55px!important;}
  .po-mobile-menu-btn{width:34px!important;min-width:34px!important;min-height:34px!important;padding:0!important;}
  .po-mobile-menu-btn .po-explore-icon{margin:0!important;}
  .po-site-search{flex:0 0 auto!important;}

  /* Hero */
  .po-mobile-start{padding-top:88px!important;padding-bottom:54px!important;background:var(--po-paper)!important;color:var(--po-ink)!important;}
  .po-mobile-start-head{padding:0 0 20px!important;border-bottom:1px solid var(--po-line)!important;}
  .po-mobile-start .po-mobile-title{font-size:clamp(32px,10vw,46px)!important;white-space:normal!important;}
  .po-mobile-jump{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:18px;}
  .po-mobile-jump a{display:flex;min-height:104px;padding:13px;border:1px solid var(--po-line);background:var(--po-card);flex-direction:column;align-items:flex-start;justify-content:flex-end;}
  .po-mobile-jump small{color:var(--po-gold);font-size:9px;font-weight:950;}
  .po-mobile-jump strong{margin-top:8px;font-size:17px;line-height:1.25;}
  .po-mobile-jump span{margin-top:3px;color:var(--po-copy);font-size:10px;line-height:1.45;}
  .po-mobile-conversation{display:grid;gap:10px;margin-top:20px;}
  .po-mobile-talk{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;align-items:start;}
  .po-mobile-talk.captain{grid-template-columns:minmax(0,1fr) 44px;}
  .po-mobile-talk.captain img{grid-column:2;grid-row:1;}
  .po-mobile-talk.captain>div{grid-column:1;grid-row:1;}
  .po-mobile-talk img{display:block;width:44px!important;height:44px!important;border:1px solid #aaa49a;border-radius:50%;object-fit:cover;background:#fff;}
  .po-mobile-talk>div{padding:12px 13px;border-radius:8px;background:#e5e3df;}
  .po-mobile-talk.captain>div{background:var(--po-cream);}
  .po-mobile-talk small{display:block;margin-bottom:4px;color:#77716a;font-size:9px;font-weight:900;}
  .po-mobile-talk p{margin:0!important;font-size:13px!important;line-height:1.7!important;}
  .po-mobile-scroll{margin-top:24px!important;font-size:9px!important;}

  /* Alternating long-read sections */
  .po-mobile-become,.po-mobile-news,.po-mobile-accidents{background:#071522!important;color:#fff!important;}
  .po-mobile-become .po-mobile-copy,.po-mobile-news .po-mobile-copy,.po-mobile-accidents .po-mobile-copy{color:#bdc7d0!important;}
  .po-mobile-learning,.po-mobile-medical,.po-mobile-careers,.po-mobile-resources,.po-mobile-about{background:var(--po-paper)!important;color:var(--po-ink)!important;}
  .po-mobile-course-library{background:#e7e2d8!important;color:var(--po-ink)!important;}

  /* Route / guide rows */
  .po-mobile-route-cards-v188{display:grid!important;grid-template-columns:1fr!important;gap:9px!important;margin-top:24px!important;}
  .po-mobile-info-row{display:block!important;width:100%!important;padding:18px!important;border:1px solid rgba(255,255,255,.16)!important;background:#0c2032!important;color:#fff!important;}
  .po-mobile-info-row small{display:block;color:var(--po-gold-2)!important;font-size:9px!important;font-weight:950;letter-spacing:.09em;}
  .po-mobile-info-row strong{display:block;margin:6px 0!important;font-size:22px!important;line-height:1.25!important;}
  .po-mobile-info-row p{margin:0!important;color:#bdc7d0!important;font-size:12px!important;line-height:1.75!important;}
  .po-mobile-info-row span{display:block;margin-top:12px;color:var(--po-gold-2)!important;font-size:10px!important;font-weight:900;}

  /* Learning roadmap */
  .po-mobile-roadmap{position:relative;display:grid;gap:0;margin-top:24px;padding-left:18px;}
  .po-mobile-roadmap:before{content:"";position:absolute;left:5px;top:9px;bottom:9px;width:1px;background:#b9b2a6;}
  .po-mobile-roadmap>div{position:relative;padding:0 0 23px 18px;}
  .po-mobile-roadmap>div:last-child{padding-bottom:0;}
  .po-mobile-roadmap>div:before{content:"";position:absolute;left:-17px;top:6px;width:9px;height:9px;border:2px solid var(--po-paper);border-radius:50%;background:var(--po-gold);box-shadow:0 0 0 1px var(--po-gold);}
  .po-mobile-roadmap small{display:block;color:var(--po-gold);font-size:9px;font-weight:950;letter-spacing:.08em;}
  .po-mobile-roadmap strong{display:block;margin-top:3px;font-size:25px;line-height:1.15;}
  .po-mobile-roadmap p{margin:5px 0 0!important;color:var(--po-copy);font-size:12px!important;line-height:1.7!important;}

  /* Medical */
  .po-mobile-topic-grid{display:grid;grid-template-columns:1fr;gap:8px;margin-top:22px;}
  .po-mobile-topic-grid a{display:block;padding:16px;border:1px solid var(--po-line);background:var(--po-card);}
  .po-mobile-topic-grid small{display:block;color:var(--po-gold);font-size:9px;font-weight:950;letter-spacing:.08em;}
  .po-mobile-topic-grid strong{display:block;margin:5px 0 4px;font-size:17px;line-height:1.3;}
  .po-mobile-topic-grid span{display:block;color:var(--po-copy);font-size:11px;line-height:1.55;}

  /* Course Library */
  .po-mobile-library-list{display:grid;gap:8px;margin-top:24px;}
  .po-mobile-library-list>div,.po-mobile-library-list>a{display:block;width:100%;padding:17px;border:1px solid #c7c0b4;background:#f6f3ec;color:var(--po-ink)!important;}
  .po-mobile-library-list small{display:block;color:var(--po-gold);font-size:9px;font-weight:950;letter-spacing:.09em;}
  .po-mobile-library-list strong{display:block;margin:5px 0;font-size:18px;line-height:1.3;}
  .po-mobile-library-list p{margin:0!important;color:var(--po-copy);font-size:12px!important;line-height:1.7!important;}
  .po-mobile-library-list span{display:block;margin-top:9px;color:#8b6527;font-size:10px;font-weight:900;}

  /* Career */
  .po-mobile-career-card{display:block!important;width:100%!important;min-height:0!important;aspect-ratio:4/5;margin-top:22px!important;}
  .po-mobile-career-card img{width:100%!important;height:100%!important;}
  .po-mobile-career-content{padding:18px!important;}
  .po-mobile-career-content h3{font-size:27px!important;line-height:1.12!important;}
  .po-mobile-career-content p{font-size:12px!important;line-height:1.65!important;}
  .po-mobile-career-interview{width:100%!important;margin:10px 0 0!important;padding:17px!important;}
  .po-mobile-career-interview strong{font-size:15px!important;line-height:1.55!important;}
  .po-mobile-career-interview a{display:inline-flex!important;margin-top:10px!important;font-size:10px!important;}

  /* News: prevent long Japanese headlines from forcing horizontal scroll. */
  .po-mobile-simple-news{display:grid!important;gap:0!important;margin-top:22px!important;}
  .po-mobile-simple-news a{display:grid!important;grid-template-columns:minmax(0,1fr) 20px!important;width:100%!important;padding:16px 0!important;border-bottom:1px solid rgba(255,255,255,.15)!important;}
  .po-mobile-simple-news small,.po-mobile-simple-news strong{grid-column:1!important;min-width:0!important;white-space:normal!important;}
  .po-mobile-simple-news small{font-size:9px!important;line-height:1.45!important;}
  .po-mobile-simple-news strong{margin-top:6px!important;font-size:15px!important;line-height:1.55!important;overflow-wrap:anywhere!important;}
  .po-mobile-simple-news span{grid-column:2!important;grid-row:1/3!important;align-self:center!important;justify-self:end!important;font-size:16px!important;}

  /* Accident timeline */
  .po-mobile-accident-list{display:grid;gap:0;margin-top:23px;}
  .po-mobile-accident-list>div{position:relative;padding:17px 12px 17px 24px;border-left:1px solid rgba(255,255,255,.24);border-bottom:1px solid rgba(255,255,255,.1);}
  .po-mobile-accident-list>div:before{content:"";position:absolute;left:-5px;top:23px;width:9px;height:9px;border-radius:50%;background:var(--po-gold-2);}
  .po-mobile-accident-list small{display:block;color:var(--po-gold-2);font-size:9px;font-weight:950;letter-spacing:.07em;}
  .po-mobile-accident-list strong{display:block;margin:4px 0;font-size:18px;line-height:1.3;}
  .po-mobile-accident-list span{display:block;color:#bdc7d0;font-size:11px;line-height:1.55;}
  .po-mobile-footnote{margin:16px 0 0!important;color:#8fa0ae;font-size:10px!important;line-height:1.6!important;}

  /* Official resources */
  .po-mobile-resource-list{display:grid;gap:8px;margin-top:22px;}
  .po-mobile-resource-list>div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;padding:15px;border:1px solid var(--po-line);background:var(--po-card);align-items:start;}
  .po-mobile-resource-list strong{font-size:14px;line-height:1.3;color:#8b6527;}
  .po-mobile-resource-list span{color:var(--po-copy);font-size:11px;line-height:1.6;}

  .po-site-footer{font-size:10px!important;}
}

@media(max-width:420px){
  .po-mobile-section{padding-left:15px!important;padding-right:15px!important;}
  .po-logo{max-width:106px!important;}
  .po-logo strong{font-size:14px!important;}
  .po-header-mypage{padding:0 7px!important;font-size:7.5px!important;}
  .po-mobile-jump{grid-template-columns:1fr 1fr;}
  .po-mobile-jump a{min-height:96px;padding:11px;}
  .po-mobile-resource-list>div{grid-template-columns:1fr;gap:4px;}
}

@media(max-width:350px){
  .po-logo strong{font-size:13px!important;letter-spacing:.3px!important;}
  .po-header-mypage{display:none!important;}
  .po-mobile-jump{grid-template-columns:1fr!important;}
}

/* =========================================================
V195 / SLOW HERO + MOBILE DESKTOP-SCENE LINKS
========================================================= */
@media(max-width:900px){
  .po-mobile-start{
    padding-top:18px!important;
  }

  .po-mobile-start .po-mobile-inner{
    padding-top:0!important;
  }

  .po-mobile-start .po-mobile-conversation{
    margin-top:0!important;
    gap:16px!important;
  }

  .po-mobile-talk{
    display:grid!important;
    grid-template-columns:58px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:start!important;
  }

  .po-mobile-talk.captain{
    grid-template-columns:minmax(0,1fr) 58px!important;
  }

  .po-mobile-talk-avatar{
    display:flex!important;
    width:58px!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
  }

  .po-mobile-talk-avatar img{
    display:block!important;
    width:46px!important;
    height:46px!important;
    margin:0 auto!important;
    border:1px solid #aaa49a!important;
    border-radius:50%!important;
    object-fit:cover!important;
    background:#fff!important;
  }

  .po-mobile-talk-avatar small{
    display:block!important;
    width:100%!important;
    margin:6px 0 0!important;
    color:#716b63!important;
    font-size:9px!important;
    font-weight:900!important;
    line-height:1.25!important;
    text-align:center!important;
    white-space:nowrap!important;
  }

  .po-mobile-talk-bubble{
    min-width:0!important;
    padding:13px 14px!important;
    border-radius:8px!important;
    background:#e5e3df!important;
  }

  .po-mobile-talk.captain .po-mobile-talk-avatar{
    grid-column:2!important;
    grid-row:1!important;
  }

  .po-mobile-talk.captain .po-mobile-talk-bubble{
    grid-column:1!important;
    grid-row:1!important;
    background:var(--po-cream)!important;
  }

  .po-mobile-talk-bubble p{
    margin:0!important;
    font-size:13.5px!important;
    line-height:1.72!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  .po-mobile-talk>div{
    padding:0;
    background:transparent;
  }

  .po-mobile-talk.captain>div{
    background:transparent;
  }

  .po-mobile-scroll{
    margin-top:22px!important;
  }
}


/* =========================================================
V190 / MOBILE SCROLL STORY
Inspired by restrained scrollytelling: normal vertical scroll,
clear chapter transitions, no scroll-jacking.
========================================================= */
@media(max-width:900px){
  /* Fixed 56px header + comfortable breathing room. */
  .po-mobile-start{
    padding-top:82px!important;
    padding-bottom:38px!important;
  }

  .po-mobile-section{
    scroll-margin-top:58px!important;
  }

  .po-mobile-start .po-mobile-inner{
    padding-top:0!important;
  }

  .po-mobile-start .po-mobile-conversation{
    display:grid!important;
    gap:17px!important;
    margin-top:0!important;
  }

  .po-mobile-talk{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:58px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:start!important;
  }

  .po-mobile-talk.captain{
    grid-template-columns:minmax(0,1fr) 58px!important;
  }

  .po-mobile-talk-avatar{
    display:flex!important;
    width:58px!important;
    max-width:58px!important;
    padding:0!important;
    flex-direction:column!important;
    align-items:center!important;
    background:transparent!important;
  }

  .po-mobile-talk-avatar img{
    width:46px!important;
    height:46px!important;
    max-width:46px!important;
    flex:0 0 46px!important;
    border:1px solid #aaa49a!important;
    border-radius:50%!important;
    background:#fff!important;
    object-fit:cover!important;
  }

  .po-mobile-talk-avatar small{
    display:block!important;
    width:58px!important;
    margin:6px 0 0!important;
    padding:0!important;
    color:#6c665e!important;
    background:transparent!important;
    font-size:9px!important;
    font-weight:950!important;
    line-height:1.2!important;
    letter-spacing:.01em!important;
    text-align:center!important;
    white-space:nowrap!important;
  }

  .po-mobile-talk-bubble{
    position:relative!important;
    min-width:0!important;
    max-width:100%!important;
    padding:13px 14px!important;
    border:1px solid rgba(23,27,32,.06)!important;
    border-radius:9px!important;
    background:#e5e3df!important;
    box-shadow:0 7px 18px rgba(23,27,32,.035)!important;
  }

  .po-mobile-talk.captain .po-mobile-talk-avatar{
    grid-column:2!important;
    grid-row:1!important;
  }

  .po-mobile-talk.captain .po-mobile-talk-bubble{
    grid-column:1!important;
    grid-row:1!important;
    background:#efe4ca!important;
  }

  .po-mobile-talk-bubble:before{
    content:""!important;
    position:absolute!important;
    left:-6px!important;
    top:17px!important;
    width:10px!important;
    height:10px!important;
    background:inherit!important;
    border-left:1px solid rgba(23,27,32,.06)!important;
    border-bottom:1px solid rgba(23,27,32,.06)!important;
    transform:rotate(45deg)!important;
  }

  .po-mobile-talk.captain .po-mobile-talk-bubble:before{
    left:auto!important;
    right:-6px!important;
    border-left:0!important;
    border-bottom:0!important;
    border-right:1px solid rgba(23,27,32,.06)!important;
    border-top:1px solid rgba(23,27,32,.06)!important;
  }

  .po-mobile-talk-bubble p{
    margin:0!important;
    font-size:13.5px!important;
    line-height:1.72!important;
    overflow-wrap:anywhere!important;
  }

  /* Conversation becomes a story opener, not a giant hero title. */
  .po-mobile-scroll-cue{
    display:flex!important;
    width:max-content!important;
    max-width:100%!important;
    min-height:42px!important;
    margin:25px auto 0!important;
    padding:0 15px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:12px!important;
    border:1px solid #c9c2b6!important;
    border-radius:999px!important;
    color:#625d55!important;
    background:rgba(255,255,255,.35)!important;
    font-size:9px!important;
    font-weight:950!important;
    letter-spacing:.12em!important;
    text-decoration:none!important;
  }

  .po-mobile-scroll-cue b{
    display:inline-block!important;
    color:var(--po-gold)!important;
    font-size:16px!important;
    font-weight:900!important;
    animation:po-mobile-arrow-pulse 1.8s ease-in-out infinite!important;
  }

  @keyframes po-mobile-arrow-pulse{
    0%,100%{transform:translateY(-2px);opacity:.55;}
    50%{transform:translateY(3px);opacity:1;}
  }

  /*
   * Chapter bridges:
   * a short gradient blend + down arrow makes the next section feel
   * like a continuation, without pinning or hijacking the scroll.
   */
  .po-mobile-story-bridge{
    position:relative!important;
    display:flex!important;
    width:100%!important;
    height:62px!important;
    margin:0!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }

  .po-mobile-story-bridge.light-to-dark{
    background:linear-gradient(180deg,var(--po-paper) 0%,#dedbd3 30%,#6d7478 68%,#071522 100%)!important;
    color:#fff!important;
  }

  .po-mobile-story-bridge.dark-to-light{
    background:linear-gradient(180deg,#071522 0%,#525c64 42%,#d7d4cd 77%,var(--po-paper) 100%)!important;
    color:#fff!important;
  }

  .po-mobile-story-bridge.light-to-paper{
    background:linear-gradient(180deg,var(--po-paper) 0%,#ebe7de 42%,#e7e2d8 100%)!important;
    color:#6f6658!important;
  }

  .po-mobile-story-bridge span{
    font-size:8px!important;
    font-weight:950!important;
    letter-spacing:.14em!important;
    opacity:.82!important;
  }

  .po-mobile-story-bridge b{
    font-size:17px!important;
    line-height:1!important;
    transform:translateY(-1px)!important;
  }

  /* Avoid double vertical gaps around transition strips. */
  .po-mobile-story-bridge + .po-mobile-section{
    padding-top:54px!important;
  }

  /* Extra narrow phones: preserve bubble space instead of squeezing text. */
  @media(max-width:380px){
    .po-mobile-start{
      padding-top:78px!important;
    }

    .po-mobile-talk,
    .po-mobile-talk.captain{
      grid-template-columns:52px minmax(0,1fr)!important;
      gap:8px!important;
    }

    .po-mobile-talk.captain{
      grid-template-columns:minmax(0,1fr) 52px!important;
    }

    .po-mobile-talk-avatar,
    .po-mobile-talk-avatar small{
      width:52px!important;
      max-width:52px!important;
    }

    .po-mobile-talk-avatar img{
      width:42px!important;
      height:42px!important;
      max-width:42px!important;
      flex-basis:42px!important;
    }

    .po-mobile-talk-bubble{
      padding:12px!important;
    }

    .po-mobile-talk-bubble p{
      font-size:13px!important;
    }
  }

  @media(prefers-reduced-motion:reduce){
    .po-mobile-scroll-cue b{
      animation:none!important;
    }
  }
}


/* =========================================================
V191 / TRAINEE + SMOOTH MOBILE FLOW
========================================================= */
@media(max-width:900px){
  .po-mobile-start{
    padding-bottom:24px!important;
  }

  .po-mobile-start .po-mobile-conversation{
    gap:15px!important;
  }

  .po-mobile-story-bridge{
    height:108px!important;
    gap:0!important;
  }

  .po-mobile-story-bridge.light-to-dark{
    background:linear-gradient(
      180deg,
      var(--po-paper) 0%,
      #f0eee8 14%,
      #dddcd7 31%,
      #b8b9b7 48%,
      #747b80 67%,
      #32404a 84%,
      #071522 100%
    )!important;
  }

  .po-mobile-story-bridge.dark-to-light{
    background:linear-gradient(
      180deg,
      #071522 0%,
      #24333d 16%,
      #59636a 34%,
      #929796 52%,
      #c9c8c3 72%,
      #e7e4dd 88%,
      var(--po-paper) 100%
    )!important;
  }

  .po-mobile-story-bridge.light-to-paper{
    background:linear-gradient(
      180deg,
      var(--po-paper) 0%,
      #f0eee8 28%,
      #ece9e2 53%,
      #e8e4dc 76%,
      #e7e2d8 100%
    )!important;
  }

  .po-mobile-story-bridge b{
    display:block!important;
    font-size:17px!important;
    font-weight:800!important;
    line-height:1!important;
    opacity:.46!important;
    transform:translateY(4px)!important;
  }

  .po-mobile-story-bridge.light-to-dark b,
  .po-mobile-story-bridge.dark-to-light b{
    color:#fff!important;
    text-shadow:0 1px 8px rgba(0,0,0,.14)!important;
  }

  .po-mobile-story-bridge.light-to-paper b{
    color:#8b806d!important;
  }

  .po-mobile-story-bridge + .po-mobile-section{
    padding-top:48px!important;
  }
}


/* =========================================================
V192 / MOBILE CONTINUOUS STORY
One quiet landing hero, then dialogue + information in one
continuous vertical reading flow.
========================================================= */
@media(max-width:900px){
  html,body{
    background:var(--po-paper)!important;
  }

  .po-mobile{
    display:block!important;
    overflow-x:hidden!important;
    background:var(--po-paper)!important;
    color:var(--po-ink)!important;
  }

  .po-mobile-story-bridge{
    display:none!important;
  }

  .po-mobile-section,
  .po-mobile-become,
  .po-mobile-learning,
  .po-mobile-medical,
  .po-mobile-course-library,
  .po-mobile-careers,
  .po-mobile-news,
  .po-mobile-accidents,
  .po-mobile-resources,
  .po-mobile-about{
    background:var(--po-paper)!important;
    color:var(--po-ink)!important;
  }

  .po-mobile-section{
    padding:58px 16px!important;
    scroll-margin-top:58px!important;
  }

  .po-mobile-section + .po-mobile-section,
  .po-mobile-story-dialogue + .po-mobile-section{
    border-top:1px solid rgba(23,27,32,.09)!important;
  }

  .po-mobile-inner{
    width:100%!important;
    max-width:640px!important;
    margin:0 auto!important;
  }

  /* Quiet first-view entrance */
  .po-mobile-start{
    display:flex!important;
    min-height:100svh!important;
    padding:56px 20px 24px!important;
    align-items:center!important;
    justify-content:center!important;
    border:0!important;
  }

  .po-mobile-hero{
    position:relative!important;
    display:flex!important;
    width:100%!important;
    min-height:calc(100svh - 80px)!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
  }

  .po-mobile-hero-type{
    min-height:1.35em!important;
    color:var(--po-ink)!important;
    font-size:clamp(30px,8.9vw,42px)!important;
    font-weight:950!important;
    line-height:1.2!important;
    letter-spacing:-.035em!important;
    white-space:nowrap!important;
  }

  .po-mobile-hero-caret{
    display:inline-block!important;
    width:2px!important;
    height:.95em!important;
    margin-left:6px!important;
    background:var(--po-gold)!important;
    vertical-align:-.05em!important;
    animation:poMobileHeroCaret .82s steps(1,end) infinite!important;
  }

  @keyframes poMobileHeroCaret{
    0%,48%{opacity:1}
    49%,100%{opacity:0}
  }

  .po-mobile-hero p{
    margin:17px 0 0!important;
    color:#777168!important;
    font-size:10px!important;
    font-weight:800!important;
    letter-spacing:.09em!important;
  }

  .po-mobile-hero-scroll{
    position:absolute!important;
    left:50%!important;
    bottom:14px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:6px!important;
    color:#8c8478!important;
    transform:translateX(-50%)!important;
  }

  .po-mobile-hero-scroll span{
    font-size:7px!important;
    font-weight:950!important;
    letter-spacing:.18em!important;
  }

  .po-mobile-hero-scroll b{
    color:var(--po-gold)!important;
    font-size:17px!important;
    font-weight:800!important;
    animation:poMobileScrollHint 1.8s ease-in-out infinite!important;
  }

  @keyframes poMobileScrollHint{
    0%,100%{transform:translateY(-2px);opacity:.4}
    50%{transform:translateY(4px);opacity:1}
  }

  /* Dialogue becomes punctuation between information blocks. */
  .po-mobile-story-dialogue{
    padding:42px 16px!important;
    background:var(--po-paper)!important;
    color:var(--po-ink)!important;
    border-top:1px solid rgba(23,27,32,.09)!important;
  }

  .po-mobile-story-dialogue .po-mobile-conversation{
    display:grid!important;
    gap:14px!important;
  }

  .po-mobile-talk{
    display:grid!important;
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:54px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:start!important;
  }

  .po-mobile-talk.captain{
    grid-template-columns:minmax(0,1fr) 54px!important;
  }

  .po-mobile-talk-avatar{
    display:flex!important;
    width:54px!important;
    padding:0!important;
    flex-direction:column!important;
    align-items:center!important;
    background:transparent!important;
  }

  .po-mobile-talk-avatar img{
    display:block!important;
    width:43px!important;
    height:43px!important;
    border:1px solid #b9b2a6!important;
    border-radius:50%!important;
    background:#fff!important;
    object-fit:cover!important;
  }

  .po-mobile-talk-avatar small{
    display:block!important;
    width:54px!important;
    margin:5px 0 0!important;
    color:#777168!important;
    background:transparent!important;
    font-size:8px!important;
    font-weight:950!important;
    line-height:1.2!important;
    text-align:center!important;
    white-space:nowrap!important;
  }

  .po-mobile-talk-bubble{
    position:relative!important;
    min-width:0!important;
    max-width:100%!important;
    padding:12px 13px!important;
    border:1px solid #ddd7cd!important;
    border-radius:9px!important;
    background:#ebe8e1!important;
    box-shadow:none!important;
  }

  .po-mobile-talk.captain .po-mobile-talk-avatar{
    grid-column:2!important;
    grid-row:1!important;
  }

  .po-mobile-talk.captain .po-mobile-talk-bubble{
    grid-column:1!important;
    grid-row:1!important;
    background:#efe5cf!important;
  }

  .po-mobile-talk-bubble p{
    margin:0!important;
    color:var(--po-ink)!important;
    font-size:13px!important;
    line-height:1.72!important;
    overflow-wrap:anywhere!important;
  }

  /* Editorial sections stay restrained and readable. */
  .po-mobile-kicker{
    margin:0 0 9px!important;
    color:var(--po-gold)!important;
    font-size:8px!important;
    font-weight:950!important;
    letter-spacing:.15em!important;
  }

  .po-mobile-title{
    margin:0!important;
    max-width:100%!important;
    color:var(--po-ink)!important;
    font-size:clamp(27px,8.2vw,35px)!important;
    line-height:1.08!important;
    letter-spacing:-.035em!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .po-mobile-copy,
  .po-mobile-become .po-mobile-copy,
  .po-mobile-learning .po-mobile-copy,
  .po-mobile-news .po-mobile-copy,
  .po-mobile-about .po-mobile-copy{
    margin:14px 0 0!important;
    color:#5f5a52!important;
    font-size:12.5px!important;
    line-height:1.82!important;
  }

  .po-mobile-route-cards,
  .po-mobile-roadmap,
  .po-mobile-library-list,
  .po-mobile-accident-list,
  .po-mobile-resource-list{
    margin-top:22px!important;
  }

  .po-mobile-info-row,
  .po-mobile-info-row.is-dark,
  .po-mobile-library-list>div,
  .po-mobile-library-list>a,
  .po-mobile-roadmap>div,
  .po-mobile-accident-list>div,
  .po-mobile-resource-list>div{
    background:#f9f7f2!important;
    color:var(--po-ink)!important;
    border:1px solid #d9d3c8!important;
  }

  .po-mobile-info-row p,
  .po-mobile-info-row.is-dark p,
  .po-mobile-library-list p,
  .po-mobile-roadmap p,
  .po-mobile-accident-list span,
  .po-mobile-resource-list span{
    color:#625d55!important;
  }

  .po-mobile-info-row small,
  .po-mobile-info-row.is-dark small,
  .po-mobile-library-list small,
  .po-mobile-roadmap small,
  .po-mobile-accident-list small{
    color:var(--po-gold)!important;
  }

  .po-mobile-topic-grid{
    margin-top:22px!important;
  }

  .po-mobile-topic-grid a{
    background:#f9f7f2!important;
    color:var(--po-ink)!important;
    border-color:#d9d3c8!important;
  }

  .po-mobile-text-link{
    display:inline-flex!important;
    margin-top:18px!important;
    color:#7d5a1e!important;
    font-size:10px!important;
    font-weight:950!important;
    line-height:1.4!important;
    text-decoration:none!important;
    border-bottom:1px solid rgba(125,90,30,.34)!important;
  }

  .po-mobile-search-hint{
    margin-top:20px!important;
    padding:15px!important;
    border-left:3px solid var(--po-gold)!important;
    background:#ece8df!important;
  }

  .po-mobile-search-hint small{
    display:block!important;
    color:var(--po-gold)!important;
    font-size:7px!important;
    font-weight:950!important;
    letter-spacing:.14em!important;
  }

  .po-mobile-search-hint strong{
    display:block!important;
    margin-top:5px!important;
    font-size:14px!important;
    line-height:1.4!important;
  }

  .po-mobile-search-hint p{
    margin:6px 0 0!important;
    color:#625d55!important;
    font-size:10px!important;
    line-height:1.65!important;
  }

  /* Career image can remain visually rich without changing page background. */
  .po-mobile-career-card{
    margin-top:22px!important;
    border-radius:0!important;
  }

  /* News used to be dark. Keep it on the same paper canvas. */
  .po-mobile-simple-news a{
    color:var(--po-ink)!important;
    border-color:#d9d3c8!important;
    background:#f9f7f2!important;
  }

  .po-mobile-simple-news small{
    color:var(--po-gold)!important;
  }

  /* The old button-like CTAs are not part of this mobile flow. */
  .po-mobile-cta{
    display:none!important;
  }

  @media(max-width:380px){
    .po-mobile-hero-type{
      font-size:29px!important;
    }
    .po-mobile-talk,
    .po-mobile-talk.captain{
      grid-template-columns:50px minmax(0,1fr)!important;
      gap:8px!important;
    }
    .po-mobile-talk.captain{
      grid-template-columns:minmax(0,1fr) 50px!important;
    }
    .po-mobile-talk-avatar,
    .po-mobile-talk-avatar small{
      width:50px!important;
    }
    .po-mobile-talk-avatar img{
      width:40px!important;
      height:40px!important;
    }
  }

  @media(prefers-reduced-motion:reduce){
    .po-mobile-hero-caret,
    .po-mobile-hero-scroll b{
      animation:none!important;
    }
  }
}


/* =========================================================
V193 / MOBILE SKY HERO + MENU CLOSE FIX
========================================================= */
@media(max-width:900px){
  .po-mobile-start{
    position:relative!important;
    overflow:hidden!important;
    background:#dcecf4!important;
  }

  .po-mobile-hero{
    position:relative!important;
    isolation:isolate!important;
  }

  .po-mobile-hero-video{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
    z-index:0!important;
    pointer-events:none!important;
  }

  .po-mobile-hero-veil{
    position:absolute!important;
    inset:0!important;
    z-index:1!important;
    background:
      linear-gradient(
        180deg,
        rgba(246,247,245,.18) 0%,
        rgba(246,247,245,.34) 48%,
        rgba(243,241,235,.60) 100%
      )!important;
    pointer-events:none!important;
  }

  .po-mobile-hero-content{
    position:relative!important;
    z-index:2!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
  }

  .po-mobile-hero-type{
    color:#17212a!important;
    text-shadow:0 1px 12px rgba(255,255,255,.42)!important;
  }

  .po-mobile-hero-content>p{
    color:#5d676e!important;
    text-shadow:0 1px 9px rgba(255,255,255,.55)!important;
  }

  .po-mobile-hero-scroll{
    z-index:2!important;
  }

  .po-mobile-drawer-close{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    background:rgba(255,255,255,.06)!important;
    border-color:rgba(255,255,255,.28)!important;
    opacity:1!important;
  }

  .po-mobile-drawer-close:hover,
  .po-mobile-drawer-close:focus-visible{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    background:rgba(255,255,255,.12)!important;
    border-color:rgba(255,255,255,.48)!important;
    outline:1px solid rgba(255,255,255,.65)!important;
  }
}


/* =========================================================
V194 / MOBILE DETAIL — REUSE THE DESKTOP SCENES
========================================================= */
@media(max-width:900px){
  body.po-mobile-detail-open{
    overflow:hidden!important;
  }

  .po-mobile-detail-sheet{
    position:fixed!important;
    inset:56px 0 0 0!important;
    z-index:100030!important;
    display:flex!important;
    flex-direction:column!important;
    background:var(--po-paper)!important;
    color:var(--po-ink)!important;
  }

  .po-mobile-detail-sheet[hidden]{
    display:none!important;
  }

  .po-mobile-detail-bar{
    position:relative!important;
    z-index:2!important;
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr) 44px!important;
    min-height:48px!important;
    align-items:center!important;
    border-bottom:1px solid #d4cec3!important;
    background:#e1ddd4!important;
  }

  .po-mobile-detail-bar strong{
    min-width:0!important;
    overflow:hidden!important;
    color:var(--po-ink)!important;
    font-size:12px!important;
    font-weight:950!important;
    text-align:center!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  .po-mobile-detail-back,
  .po-mobile-detail-close{
    width:44px!important;
    height:48px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    color:var(--po-ink)!important;
    -webkit-text-fill-color:var(--po-ink)!important;
    font-size:22px!important;
    font-weight:700!important;
    cursor:pointer!important;
  }

  .po-mobile-detail-content{
    position:relative!important;
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    background:var(--po-paper)!important;
  }

  .po-mobile-detail-content>.po-scenes{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:100%!important;
  }

  .po-mobile-detail-content .po-scene{
    position:relative!important;
    inset:auto!important;
    display:none!important;
    width:100%!important;
    height:auto!important;
    min-height:100%!important;
    overflow:visible!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
    transition:none!important;
  }

  .po-mobile-detail-content .po-scene.is-active{
    display:block!important;
  }

  .po-mobile-detail-content .po-scene-inner{
    width:100%!important;
    height:auto!important;
    min-height:100%!important;
    padding:26px 16px 70px!important;
  }

  .po-mobile-detail-content .po-scene-canvas{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
  }

  .po-mobile-detail-content .po-scene-nav,
  .po-mobile-detail-content .po-start-sidebar{
    display:none!important;
  }

  .po-mobile-detail-content .po-head-grid,
  .po-mobile-detail-content .po-start-layout,
  .po-mobile-detail-content .po-guidance-row,
  .po-mobile-detail-content .po-choice-grid,
  .po-mobile-detail-content .po-learning-choice-grid,
  .po-mobile-detail-content .po-route-grid,
  .po-mobile-detail-content .po-course-grid,
  .po-mobile-detail-content .po-career-grid,
  .po-mobile-detail-content .po-news-bento,
  .po-mobile-detail-content .po-resource-grid,
  .po-mobile-detail-content .po-medical-grid,
  .po-mobile-detail-content .po-learning-roadmap,
  .po-mobile-detail-content .po-learning-topic-grid{
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
  }

  .po-mobile-detail-content .po-head-grid{
    gap:16px!important;
    align-items:start!important;
  }

  .po-mobile-detail-content .po-scene-title{
    max-width:100%!important;
    font-size:clamp(32px,9vw,44px)!important;
    line-height:1.02!important;
    overflow-wrap:anywhere!important;
  }

  .po-mobile-detail-content .po-eyebrow{
    font-size:9px!important;
  }

  .po-mobile-detail-content img,
  .po-mobile-detail-content video,
  .po-mobile-detail-content iframe{
    max-width:100%!important;
    height:auto!important;
  }

  .po-mobile-detail-content table{
    display:block!important;
    max-width:100%!important;
    overflow-x:auto!important;
  }

  .po-mobile-detail-content *{
    min-width:0;
    max-width:100%;
  }

  .po-mobile-detail-content .po-route-grid,
  .po-mobile-detail-content .po-course-grid,
  .po-mobile-detail-content .po-career-grid{
    overflow:visible!important;
  }
}


/* =========================================================
V195 / MOBILE AIRCRAFT HERO
Uses the supplied aircraft image as a centered, phone-fitted hero.
The image is requested only on mobile because the rule is inside
the mobile media query.
========================================================= */
@media(max-width:900px){
  .po-mobile-start{
    position:relative!important;
    overflow:hidden!important;
    background-color:#dcecf4!important;
    background-image:
      linear-gradient(
        180deg,
        rgba(245,248,249,.18) 0%,
        rgba(245,248,249,.22) 48%,
        rgba(243,241,235,.42) 100%
      ),
      url('/wp-content/plugins/pilot-lms-core/assets/media/mobile-aircraft-hero-v195.webp')!important;
    background-repeat:no-repeat!important;
    background-size:cover!important;
    background-position:center center!important;
  }

  .po-mobile-hero{
    background:transparent!important;
  }

  .po-mobile-hero-content{
    position:relative!important;
    z-index:2!important;
  }

  .po-mobile-hero-type{
    color:#14202a!important;
    text-shadow:
      0 1px 2px rgba(255,255,255,.85),
      0 5px 18px rgba(255,255,255,.55)!important;
  }

  .po-mobile-hero-content>p{
    color:#4e5b64!important;
    text-shadow:0 1px 8px rgba(255,255,255,.78)!important;
  }

  .po-mobile-hero-scroll{
    z-index:2!important;
    color:#4f5c64!important;
  }
}


/* =========================================================
V196 / MOBILE SCALE, PANEL RHYTHM + LOGO TYPE FIX
The landing page and the desktop-scene detail sheet now use
one compact mobile scale instead of inherited desktop sizing.
========================================================= */
.po-logo strong{
  font-family:Arial,Helvetica,sans-serif!important;
  font-weight:800!important;
  font-style:normal!important;
  font-stretch:normal!important;
  font-variant:normal!important;
  font-variant-ligatures:none!important;
  font-feature-settings:"liga" 0,"kern" 0!important;
  text-rendering:geometricPrecision;
}

@media(max-width:900px){
  /* Header */
  .po-logo{
    left:14px!important;
    top:19px!important;
    max-width:none!important;
    overflow:visible!important;
  }

  .po-logo strong{
    font-size:15px!important;
    line-height:1!important;
    letter-spacing:.82px!important;
    white-space:nowrap!important;
  }

  .po-actions{
    right:8px!important;
  }

  /* Shared mobile editorial scale */
  .po-mobile-section{
    padding:52px 17px!important;
  }

  .po-mobile-inner{
    width:100%!important;
    max-width:600px!important;
  }

  .po-mobile-kicker{
    margin-bottom:8px!important;
    font-size:8px!important;
    line-height:1.35!important;
    letter-spacing:.14em!important;
  }

  .po-mobile-title{
    max-width:12em!important;
    font-size:clamp(27px,7.7vw,34px)!important;
    line-height:1.1!important;
    letter-spacing:-.035em!important;
    text-wrap:balance!important;
  }

  .po-mobile-copy,
  .po-mobile-become .po-mobile-copy,
  .po-mobile-learning .po-mobile-copy,
  .po-mobile-news .po-mobile-copy,
  .po-mobile-about .po-mobile-copy{
    max-width:38em!important;
    margin-top:12px!important;
    font-size:12.5px!important;
    line-height:1.76!important;
  }

  /* Landing panels */
  .po-mobile-route-cards-v188,
  .po-mobile-library-list,
  .po-mobile-accident-list,
  .po-mobile-resource-list{
    gap:9px!important;
    margin-top:19px!important;
  }

  .po-mobile-info-row,
  .po-mobile-info-row.is-dark,
  .po-mobile-library-list>div,
  .po-mobile-library-list>a{
    min-height:0!important;
    padding:15px 16px!important;
  }

  .po-mobile-info-row small,
  .po-mobile-library-list small{
    font-size:8px!important;
    line-height:1.35!important;
    letter-spacing:.1em!important;
  }

  .po-mobile-info-row strong{
    margin:5px 0 4px!important;
    font-size:19px!important;
    line-height:1.22!important;
  }

  .po-mobile-library-list strong{
    margin:5px 0 4px!important;
    font-size:17px!important;
    line-height:1.25!important;
  }

  .po-mobile-info-row p,
  .po-mobile-library-list p{
    font-size:11.5px!important;
    line-height:1.62!important;
  }

  .po-mobile-info-row span,
  .po-mobile-library-list span{
    margin-top:8px!important;
    font-size:9px!important;
  }

  .po-mobile-topic-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-top:19px!important;
  }

  .po-mobile-topic-grid a{
    min-height:112px!important;
    padding:14px!important;
  }

  .po-mobile-topic-grid small{
    font-size:8px!important;
  }

  .po-mobile-topic-grid strong{
    margin:6px 0 4px!important;
    font-size:15px!important;
    line-height:1.25!important;
  }

  .po-mobile-topic-grid span{
    font-size:10px!important;
    line-height:1.45!important;
  }

  .po-mobile-roadmap{
    margin-top:20px!important;
  }

  .po-mobile-roadmap>div{
    padding-bottom:19px!important;
  }

  .po-mobile-roadmap strong{
    font-size:21px!important;
  }

  .po-mobile-career-card{
    margin-top:20px!important;
    aspect-ratio:4/4.7!important;
  }

  .po-mobile-career-content h3{
    font-size:24px!important;
  }

  .po-mobile-simple-news{
    margin-top:19px!important;
  }

  .po-mobile-simple-news a{
    min-height:0!important;
    padding:13px 12px!important;
    border:1px solid #d9d3c8!important;
    border-bottom:0!important;
  }

  .po-mobile-simple-news a:last-child{
    border-bottom:1px solid #d9d3c8!important;
  }

  .po-mobile-simple-news strong{
    font-size:13.5px!important;
    line-height:1.48!important;
  }

  .po-mobile-resource-list>div{
    grid-template-columns:82px minmax(0,1fr)!important;
    gap:10px!important;
    padding:13px!important;
  }

  /* Detail sheet shell */
  .po-mobile-detail-bar{
    grid-template-columns:42px minmax(0,1fr) 42px!important;
    min-height:48px!important;
  }

  .po-mobile-detail-bar strong{
    padding:0 6px!important;
    font-size:11px!important;
    letter-spacing:.01em!important;
  }

  .po-mobile-detail-back,
  .po-mobile-detail-close{
    width:42px!important;
    height:48px!important;
    font-size:21px!important;
  }

  .po-mobile-detail-content .po-scene-inner{
    padding:22px 15px 58px!important;
  }

  .po-mobile-detail-content .po-scene-canvas,
  .po-mobile-detail-content .po-start-main,
  .po-mobile-detail-content .po-guided-start-main,
  .po-mobile-detail-content .po-resources-shell,
  .po-mobile-detail-content .po-catalog-shell,
  .po-mobile-detail-content .po-mypage-shell{
    width:100%!important;
    max-width:100%!important;
    min-height:0!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }

  .po-mobile-detail-content h1{
    max-width:100%!important;
    font-size:clamp(29px,8.6vw,37px)!important;
    line-height:1.04!important;
    letter-spacing:-.045em!important;
    overflow-wrap:break-word!important;
    text-wrap:balance!important;
  }

  .po-mobile-detail-content h2{
    max-width:100%!important;
    font-size:clamp(21px,6.2vw,27px)!important;
    line-height:1.14!important;
    letter-spacing:-.025em!important;
    overflow-wrap:break-word!important;
  }

  .po-mobile-detail-content h3{
    max-width:100%!important;
    font-size:18px!important;
    line-height:1.25!important;
    overflow-wrap:break-word!important;
  }

  .po-mobile-detail-content p{
    max-width:100%!important;
    font-size:12.5px!important;
    line-height:1.72!important;
  }

  .po-mobile-detail-content .po-eyebrow{
    margin-bottom:8px!important;
    font-size:8px!important;
    line-height:1.35!important;
    letter-spacing:.12em!important;
  }

  /* Detail overview: heading, conversation and choice panels */
  .po-mobile-detail-content .po-start-head,
  .po-mobile-detail-content .po-head-grid,
  .po-mobile-detail-content .po-become-route-head,
  .po-mobile-detail-content .po-learning-guide-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:14px!important;
    align-items:start!important;
    padding:0 0 18px!important;
  }

  .po-mobile-detail-content .po-start-head h1,
  .po-mobile-detail-content .po-become-route-head h1,
  .po-mobile-detail-content .po-learning-guide-head h1{
    margin:7px 0 0!important;
  }

  .po-mobile-detail-content .po-start-head>p,
  .po-mobile-detail-content .po-become-route-head>div>p:last-child,
  .po-mobile-detail-content .po-learning-guide-head>div>p:last-child{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    font-size:12px!important;
    line-height:1.7!important;
  }

  .po-mobile-detail-content .po-chat,
  .po-mobile-detail-content .po-become-route-chat,
  .po-mobile-detail-content .po-learning-guide-chat{
    display:grid!important;
    gap:11px!important;
    width:100%!important;
    margin-top:17px!important;
  }

  .po-mobile-detail-content .po-chat-row,
  .po-mobile-detail-content .po-faa-dialogue-row{
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr)!important;
    gap:9px!important;
    align-items:start!important;
    width:100%!important;
  }

  .po-mobile-detail-content .po-chat-row.captain,
  .po-mobile-detail-content .po-faa-dialogue-row.is-captain{
    grid-template-columns:minmax(0,1fr) 48px!important;
  }

  .po-mobile-detail-content .po-chat-row.captain .po-avatar,
  .po-mobile-detail-content .po-faa-dialogue-row.is-captain .po-faa-overview-avatar{
    grid-column:2!important;
    grid-row:1!important;
  }

  .po-mobile-detail-content .po-chat-row.captain .po-chat-bubble,
  .po-mobile-detail-content .po-faa-dialogue-row.is-captain .po-faa-overview-bubble{
    grid-column:1!important;
    grid-row:1!important;
  }

  .po-mobile-detail-content .po-avatar,
  .po-mobile-detail-content .po-faa-overview-avatar{
    width:48px!important;
    max-width:48px!important;
  }

  .po-mobile-detail-content .po-avatar img,
  .po-mobile-detail-content .po-faa-overview-avatar img{
    width:40px!important;
    height:40px!important;
    max-width:40px!important;
  }

  .po-mobile-detail-content .po-avatar small,
  .po-mobile-detail-content .po-faa-overview-avatar small{
    width:48px!important;
    margin-top:4px!important;
    font-size:7.5px!important;
    text-align:center!important;
    white-space:nowrap!important;
  }

  .po-mobile-detail-content .po-chat-bubble,
  .po-mobile-detail-content .po-faa-overview-bubble{
    width:auto!important;
    max-width:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:11px 12px!important;
    font-size:12.5px!important;
    line-height:1.68!important;
  }

  .po-mobile-detail-content .po-guide-strip,
  .po-mobile-detail-content .po-guided-route-strip,
  .po-mobile-detail-content .po-guided-course-strip,
  .po-mobile-detail-content .po-choice-grid,
  .po-mobile-detail-content .po-learning-choice-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    margin-top:17px!important;
  }

  .po-mobile-detail-content .po-guide-card,
  .po-mobile-detail-content .po-choice,
  .po-mobile-detail-content .po-learning-choice{
    width:100%!important;
    min-height:108px!important;
    height:auto!important;
    padding:12px!important;
  }

  .po-mobile-detail-content .po-guide-card small,
  .po-mobile-detail-content .po-choice small,
  .po-mobile-detail-content .po-learning-choice small{
    font-size:7.5px!important;
  }

  .po-mobile-detail-content .po-guide-card strong,
  .po-mobile-detail-content .po-choice strong,
  .po-mobile-detail-content .po-learning-choice strong{
    margin-top:5px!important;
    font-size:13px!important;
    line-height:1.28!important;
  }

  .po-mobile-detail-content .po-guide-card span,
  .po-mobile-detail-content .po-choice span,
  .po-mobile-detail-content .po-learning-choice span{
    margin-top:4px!important;
    font-size:9px!important;
    line-height:1.45!important;
  }

  /* Detail cards and guidance panels */
  .po-mobile-detail-content .po-route-captain-guide,
  .po-mobile-detail-content .po-course-captain-guide{
    display:grid!important;
    grid-template-columns:50px minmax(0,1fr)!important;
    gap:10px!important;
    width:100%!important;
    margin-top:15px!important;
    padding:12px!important;
  }

  .po-mobile-detail-content .po-route-captain-avatar,
  .po-mobile-detail-content .po-course-captain-avatar{
    width:50px!important;
  }

  .po-mobile-detail-content .po-route-captain-avatar img,
  .po-mobile-detail-content .po-course-captain-avatar img{
    width:38px!important;
    height:38px!important;
  }

  .po-mobile-detail-content .po-route-captain-bubble,
  .po-mobile-detail-content .po-course-captain-bubble{
    min-height:0!important;
    padding:10px 11px!important;
    font-size:11px!important;
    line-height:1.6!important;
  }

  .po-mobile-detail-content .po-route-grid,
  .po-mobile-detail-content .po-course-grid,
  .po-mobile-detail-content .po-career-grid,
  .po-mobile-detail-content .po-news-bento,
  .po-mobile-detail-content .po-resource-grid,
  .po-mobile-detail-content .po-medical-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:9px!important;
    margin-top:17px!important;
  }

  .po-mobile-detail-content .po-route,
  .po-mobile-detail-content .po-course-group,
  .po-mobile-detail-content .po-resource-group,
  .po-mobile-detail-content .po-medical-card{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    padding:15px!important;
  }

  .po-mobile-detail-content .po-route h3,
  .po-mobile-detail-content .po-course-head h3{
    margin:6px 0!important;
    font-size:20px!important;
    line-height:1.2!important;
  }

  .po-mobile-detail-content .po-route-details{
    gap:5px!important;
    margin-top:11px!important;
  }

  .po-mobile-detail-content .po-route-details>div{
    min-height:0!important;
    padding:8px 9px!important;
  }

  .po-mobile-detail-content .po-course-link{
    min-height:42px!important;
    padding:8px 2px!important;
    font-size:11px!important;
  }

  /* Long-form route/learning pages */
  .po-mobile-detail-content .po-become-route-inner,
  .po-mobile-detail-content .po-learning-guide-inner{
    width:100%!important;
    max-width:100%!important;
    padding:0!important;
  }

  .po-mobile-detail-content .po-become-route-summary,
  .po-mobile-detail-content .po-learning-guide-meta{
    margin-top:2px!important;
  }

  .po-mobile-detail-content .po-become-route-summary>div,
  .po-mobile-detail-content .po-learning-guide-meta>div{
    grid-template-columns:70px minmax(0,1fr)!important;
    min-height:44px!important;
    padding:7px 10px!important;
  }

  .po-mobile-detail-content .po-become-route-free,
  .po-mobile-detail-content .po-become-route-flow,
  .po-mobile-detail-content .po-learning-guide-section,
  .po-mobile-detail-content .po-cadet-free-list,
  .po-mobile-detail-content .po-cadet-panel-section{
    margin-top:23px!important;
  }

  .po-mobile-detail-content .po-become-section-head,
  .po-mobile-detail-content .po-become-premium-head{
    display:block!important;
    margin-bottom:9px!important;
  }

  .po-mobile-detail-content .po-become-section-head>span,
  .po-mobile-detail-content .po-become-premium-head>span{
    display:block!important;
    margin-top:5px!important;
  }

  .po-mobile-detail-content .po-become-route-line,
  .po-mobile-detail-content .po-learning-topic-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:4px!important;
    min-height:0!important;
    padding:12px 3px!important;
  }

  .po-mobile-detail-content .po-become-flow-list,
  .po-mobile-detail-content .po-learning-roadmap,
  .po-mobile-detail-content .po-become-premium-preview,
  .po-mobile-detail-content .po-cadet-card-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
  }

  .po-mobile-detail-content .po-become-flow-step,
  .po-mobile-detail-content .po-learning-roadmap-step,
  .po-mobile-detail-content .po-cadet-card{
    min-height:0!important;
    padding:14px!important;
  }

  .po-mobile-detail-content .po-learning-next-panel,
  .po-mobile-detail-content .po-become-premium-lock{
    grid-template-columns:minmax(0,1fr)!important;
    gap:13px!important;
    padding:15px!important;
  }

  .po-mobile-detail-content .po-learning-next-panel button,
  .po-mobile-detail-content .po-become-premium-lock a{
    width:100%!important;
    min-height:46px!important;
  }
}

@media(max-width:380px){
  .po-logo{
    left:11px!important;
  }

  .po-logo strong{
    font-size:13.5px!important;
    letter-spacing:.6px!important;
  }

  .po-mobile-section{
    padding-left:14px!important;
    padding-right:14px!important;
  }

  .po-mobile-title{
    font-size:27px!important;
  }

  .po-mobile-topic-grid,
  .po-mobile-detail-content .po-guide-strip,
  .po-mobile-detail-content .po-guided-route-strip,
  .po-mobile-detail-content .po-guided-course-strip,
  .po-mobile-detail-content .po-choice-grid,
  .po-mobile-detail-content .po-learning-choice-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }

  .po-mobile-topic-grid a,
  .po-mobile-detail-content .po-guide-card,
  .po-mobile-detail-content .po-choice,
  .po-mobile-detail-content .po-learning-choice{
    min-height:0!important;
  }

  .po-mobile-detail-content .po-scene-inner{
    padding-left:12px!important;
    padding-right:12px!important;
  }
}


/* =========================================================
V197 / HERO DIALOGUE OVERLAY
The opening trainee/captain exchange sits near the bottom of the
aircraft hero without an outer panel; the typing stays centered.
========================================================= */
@media(max-width:900px){
  .po-mobile-hero-content{
    position:absolute!important;
    top:50%!important;
    left:14px!important;
    right:14px!important;
    width:auto!important;
    transform:translateY(-50%)!important;
  }

  .po-mobile-hero-dialogue{
    position:absolute!important;
    z-index:3!important;
    left:50%!important;
    top:auto!important;
    bottom:45px!important;
    width:min(100%,520px)!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    transform:translateX(-50%)!important;
  }

  .po-mobile-hero-dialogue .po-mobile-conversation{
    display:grid!important;
    gap:9px!important;
    width:100%!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk,
  .po-mobile-hero-dialogue .po-mobile-talk.captain{
    display:grid!important;
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:8px!important;
    align-items:start!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk.captain{
    grid-template-columns:minmax(0,1fr) 42px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-avatar,
  .po-mobile-hero-dialogue .po-mobile-talk-avatar small{
    width:42px!important;
    max-width:42px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-avatar img{
    width:34px!important;
    height:34px!important;
    max-width:34px!important;
    flex-basis:34px!important;
    border-color:rgba(68,77,82,.35)!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-avatar small{
    margin-top:3px!important;
    color:#4e5559!important;
    font-size:7.5px!important;
    line-height:1.15!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble{
    min-height:0!important;
    padding:9px 10px!important;
    border:1px solid rgba(88,88,82,.13)!important;
    border-radius:7px!important;
    background:rgba(255,255,255,.76)!important;
    box-shadow:none!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk.captain .po-mobile-talk-avatar{
    grid-column:2!important;
    grid-row:1!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk.captain .po-mobile-talk-bubble{
    grid-column:1!important;
    grid-row:1!important;
    background:rgba(239,229,207,.88)!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble:before{
    top:13px!important;
    width:8px!important;
    height:8px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble p{
    color:#20272c!important;
    font-size:11.5px!important;
    line-height:1.55!important;
  }

  .po-mobile-hero-scroll{
    bottom:7px!important;
    gap:2px!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-hero-content{
    top:50%!important;
  }

  .po-mobile-hero-dialogue{
    top:auto!important;
    bottom:39px!important;
    padding:0!important;
  }

  .po-mobile-hero-dialogue .po-mobile-conversation{
    gap:7px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble{
    padding:8px 9px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble p{
    font-size:10.5px!important;
    line-height:1.48!important;
  }
}


/* =========================================================
V198 / MOBILE COURSE DETAIL BRIDGE
Course rows in the EXPLORE drawer now open the existing in-page
course registration/detail scene inside the mobile detail sheet.
========================================================= */
@media(max-width:900px){
  .po-mobile-detail-content .po-scene[data-panel="faa-detail"] .po-scene-inner{
    padding:18px 14px 56px!important;
  }

  .po-mobile-detail-content .po-inline-ppl,
  .po-mobile-detail-content .po-inline-ppl-inner{
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }

  .po-mobile-detail-content .po-inline-ppl-top{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:22px!important;
    align-items:start!important;
  }

  .po-mobile-detail-content .po-inline-ppl-kicker,
  .po-mobile-detail-content .po-inline-ppl-label,
  .po-mobile-detail-content .po-inline-ppl-enroll small,
  .po-mobile-detail-content .po-inline-ppl-curriculum-head small{
    color:var(--po-gold)!important;
    font-size:8px!important;
    font-weight:950!important;
    letter-spacing:.13em!important;
  }

  .po-mobile-detail-content .po-inline-ppl-title{
    margin:10px 0 12px!important;
    color:var(--po-ink)!important;
    font-size:clamp(34px,11vw,48px)!important;
    font-weight:950!important;
    line-height:.96!important;
    letter-spacing:-.055em!important;
  }

  .po-mobile-detail-content .po-inline-ppl-lead{
    margin:0!important;
    color:var(--po-copy)!important;
    font-size:12.5px!important;
    line-height:1.75!important;
  }

  .po-mobile-detail-content .po-inline-ppl-overview{
    margin-top:18px!important;
    border-top:1px solid var(--po-line)!important;
  }

  .po-mobile-detail-content .po-inline-ppl-overview>div{
    display:grid!important;
    grid-template-columns:72px minmax(0,1fr)!important;
    gap:4px 10px!important;
    min-height:0!important;
    padding:10px 0!important;
    align-items:start!important;
    border-bottom:1px solid var(--po-line)!important;
  }

  .po-mobile-detail-content .po-inline-ppl-overview small{
    grid-row:1 / span 2!important;
    color:var(--po-gold)!important;
    font-size:7.5px!important;
    font-weight:950!important;
    letter-spacing:.11em!important;
  }

  .po-mobile-detail-content .po-inline-ppl-overview strong{
    color:var(--po-ink)!important;
    font-size:12px!important;
    line-height:1.35!important;
  }

  .po-mobile-detail-content .po-inline-ppl-overview span{
    color:var(--po-copy)!important;
    font-size:9.5px!important;
    line-height:1.5!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll{
    width:100%!important;
    max-width:100%!important;
    min-height:0!important;
    padding:20px 18px 18px!important;
    border:1px solid #aaa49a!important;
    border-top:5px solid var(--po-gold)!important;
    box-shadow:0 12px 28px rgba(23,27,32,.07)!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll:not(.is-course-visual):not(.is-a320-visual){
    background:var(--po-card)!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll h2{
    height:auto!important;
    min-height:0!important;
    margin:14px 0 9px!important;
    color:var(--po-ink)!important;
    font-size:clamp(27px,8vw,35px)!important;
    line-height:1.05!important;
    overflow:visible!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll>p{
    height:auto!important;
    min-height:0!important;
    margin:0 0 16px!important;
    color:var(--po-copy)!important;
    font-size:11.5px!important;
    line-height:1.65!important;
    overflow:visible!important;
  }

  .po-mobile-detail-content .po-inline-ppl-meta{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    padding:11px 0!important;
    border-top:1px solid var(--po-line)!important;
    border-bottom:1px solid var(--po-line)!important;
  }

  .po-mobile-detail-content .po-inline-ppl-meta>div{
    min-width:0!important;
    padding:0 8px!important;
    border-right:1px solid var(--po-line)!important;
  }
  .po-mobile-detail-content .po-inline-ppl-meta>div:first-child{padding-left:0!important;}
  .po-mobile-detail-content .po-inline-ppl-meta>div:last-child{padding-right:0!important;border-right:0!important;}
  .po-mobile-detail-content .po-inline-ppl-meta small{display:block!important;margin-bottom:4px!important;font-size:6.5px!important;}
  .po-mobile-detail-content .po-inline-ppl-meta strong{display:block!important;font-size:9px!important;line-height:1.25!important;white-space:normal!important;}

  .po-mobile-detail-content .po-inline-ppl-preview{
    display:block!important;
    margin:12px 0 7px!important;
    color:#6c6f72!important;
    font-size:7px!important;
    font-weight:950!important;
    letter-spacing:.1em!important;
  }

  .po-mobile-detail-content .po-inline-ppl-start{
    display:flex!important;
    width:100%!important;
    min-height:54px!important;
    padding:0 17px!important;
    align-items:center!important;
    justify-content:space-between!important;
    background:var(--po-dark)!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.07em!important;
  }

  .po-mobile-detail-content .po-inline-ppl-buy-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:7px!important;
    margin-top:7px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-buy{
    display:flex!important;
    width:100%!important;
    min-height:90px!important;
    padding:14px!important;
    flex-direction:column!important;
    border:1px solid var(--po-line)!important;
    background:#fbfaf7!important;
    color:var(--po-ink)!important;
  }

  .po-mobile-detail-content .po-inline-ppl-buy.is-featured{
    background:#f1ecdf!important;
    border-color:#cbb98e!important;
  }

  .po-mobile-detail-content .po-inline-ppl-buy strong{
    display:block!important;
    margin-top:6px!important;
    font-size:14px!important;
    line-height:1.3!important;
  }

  .po-mobile-detail-content .po-inline-ppl-buy span{
    margin-top:auto!important;
    color:#74787c!important;
    font-size:7px!important;
    font-weight:900!important;
    letter-spacing:.05em!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum{
    margin-top:26px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum-head{
    display:block!important;
    margin-bottom:12px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum-head h2{
    margin:6px 0 0!important;
    font-size:22px!important;
    line-height:1.15!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum-head>span{
    display:block!important;
    margin-top:6px!important;
    color:#73777b!important;
    font-size:7px!important;
    font-weight:900!important;
    letter-spacing:.07em!important;
  }
}


/* =========================================================
V199 / MOBILE COMPACT AUTO-HIDE HEADER
========================================================= */
@media(max-width:900px){
  .po-header{
    height:50px!important;
    transition:
      transform .24s cubic-bezier(.22,.61,.36,1),
      background-color .2s ease,
      box-shadow .2s ease!important;
    will-change:transform;
  }

  .po-header.po-mobile-header-hidden{
    transform:translate3d(0,-105%,0)!important;
  }

  .po-header.po-mobile-header-visible{
    transform:translate3d(0,0,0)!important;
  }

  .po-logo{
    top:17px!important;
    left:12px!important;
    max-width:118px!important;
  }

  .po-logo strong{
    font-size:14px!important;
    letter-spacing:.72px!important;
  }

  .po-actions{
    top:8px!important;
    right:6px!important;
    gap:4px!important;
  }

  .po-header-mypage{
    min-height:32px!important;
    height:32px!important;
    padding:0 7px!important;
    font-size:7.5px!important;
  }

  .po-mobile-menu-btn{
    width:32px!important;
    min-width:32px!important;
    min-height:32px!important;
    height:32px!important;
  }

  .po-site-search-icon{
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    min-height:32px!important;
  }

  .po-mobile-start{
    padding-top:50px!important;
  }

  .po-mobile-section{
    scroll-margin-top:52px!important;
  }

  .po-mobile-detail-sheet{
    inset:50px 0 0 0!important;
  }

  body.po-mobile-menu-open .po-header,
  body.po-mobile-detail-open .po-header{
    transform:translate3d(0,0,0)!important;
  }

  /* Course registration: course name must remain one line on phones. */
  .po-mobile-detail-content .po-inline-ppl-title{
    width:100%!important;
    max-width:100%!important;
    margin:10px 0 12px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    text-wrap:nowrap!important;
    line-height:1!important;
    letter-spacing:-.055em!important;
    font-size:34px!important;
  }
}

@media(max-width:380px){
  .po-header-mypage{
    display:none!important;
  }
}


/* =========================================================
V200 / MOBILE COURSE DETAIL ORDER
Registration > Overview > Curriculum
========================================================= */
@media(max-width:900px){
  .po-mobile-detail-content .po-inline-ppl-top{
    display:flex!important;
    flex-direction:column!important;
    gap:18px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-top > .po-inline-ppl-enroll{
    order:1!important;
    width:100%!important;
    margin:0!important;
  }

  .po-mobile-detail-content .po-inline-ppl-top > div:first-child{
    order:2!important;
    width:100%!important;
    margin:0!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum{
    margin-top:26px!important;
  }

  /* Keep the overview visually separated from the registration card. */
  .po-mobile-detail-content .po-inline-ppl-kicker{
    margin-top:2px!important;
  }
}


/* =========================================================
V201 / MOBILE DETAIL — REMOVE SECOND NAV BAR
Keep only the global header to preserve vertical space.
========================================================= */
@media(max-width:900px){
  .po-mobile-detail-bar{
    display:none!important;
  }

  .po-mobile-detail-sheet{
    inset:50px 0 0 0!important;
  }

  .po-mobile-detail-content{
    flex:1 1 100%!important;
    min-height:0!important;
  }
}


/* =========================================================
V204 / MOBILE-FIRST COURSE CURRICULUM
Phone layout is intentionally independent from desktop.
========================================================= */
@media(max-width:900px){

  .po-mobile-detail-content .po-inline-ppl-curriculum{
    width:100%!important;
    max-width:none!important;
    margin:24px 0 0!important;
    padding:0!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum-head{
    display:block!important;
    width:100%!important;
    margin:0 0 12px!important;
    padding:0 2px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum-head small{
    display:block!important;
    margin:0!important;
    color:#a17c37!important;
    font-size:8px!important;
    font-weight:950!important;
    letter-spacing:.12em!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum-head h2{
    width:100%!important;
    max-width:100%!important;
    margin:6px 0 0!important;
    color:#171b20!important;
    font-size:24px!important;
    line-height:1.08!important;
    letter-spacing:-.045em!important;
    overflow-wrap:anywhere!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum-head>span{
    display:block!important;
    margin-top:8px!important;
    color:#777b7e!important;
    font-size:8px!important;
    font-weight:900!important;
    line-height:1.3!important;
    letter-spacing:.06em!important;
  }

  .po-mobile-detail-content .po-inline-ppl-curriculum-list{
    display:flex!important;
    width:100%!important;
    flex-direction:column!important;
    gap:8px!important;
    margin:0!important;
    padding:0!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:1px solid #c6c0b6!important;
    border-radius:0!important;
    background:#fbfaf7!important;
    box-shadow:none!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section[open]{
    border-color:#b99a61!important;
    background:#fff!important;
    box-shadow:inset 3px 0 0 #b78936!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section > summary{
    display:grid!important;
    grid-template-columns:46px minmax(0,1fr) 32px!important;
    grid-template-rows:auto!important;
    width:100%!important;
    min-height:58px!important;
    margin:0!important;
    padding:8px 9px!important;
    gap:10px!important;
    align-items:center!important;
    list-style:none!important;
    background:#fbfaf7!important;
    box-sizing:border-box!important;
    cursor:pointer!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section[open] > summary{
    background:#f2eadc!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section > summary::-webkit-details-marker{
    display:none!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section > summary > span:first-child{
    display:grid!important;
    grid-column:1!important;
    grid-row:1!important;
    place-items:center!important;
    width:42px!important;
    min-width:42px!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid #c8b27f!important;
    background:#fffaf0!important;
    color:#a17c37!important;
    font-size:11px!important;
    font-weight:950!important;
    line-height:1!important;
    letter-spacing:.04em!important;
    box-sizing:border-box!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section > summary > strong{
    display:block!important;
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    color:#171b20!important;
    font-size:16px!important;
    font-weight:950!important;
    line-height:1.28!important;
    letter-spacing:-.025em!important;
    overflow-wrap:anywhere!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section > summary > small{
    display:none!important;
  }

  /* Replace the old empty boxed control with a compact + / − control. */
  .po-mobile-detail-content .po-inline-ppl-section > summary > b{
    display:grid!important;
    grid-column:3!important;
    grid-row:1!important;
    place-items:center!important;
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    min-height:30px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid #aaa49a!important;
    background:#fff!important;
    color:#171b20!important;
    font-size:0!important;
    line-height:1!important;
    box-sizing:border-box!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section > summary > b::before{
    content:"+"!important;
    display:block!important;
    color:#171b20!important;
    font-size:19px!important;
    font-weight:500!important;
    line-height:1!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section[open] > summary > b::before{
    content:"−"!important;
  }

  .po-mobile-detail-content .po-inline-ppl-lessons{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0 10px 6px 12px!important;
    border-top:1px solid #d9d3c9!important;
    background:#fff!important;
    box-sizing:border-box!important;
  }

  .po-mobile-detail-content .po-inline-ppl-lesson{
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    width:100%!important;
    min-height:58px!important;
    margin:0!important;
    padding:9px 0!important;
    gap:2px 10px!important;
    align-items:start!important;
    border:0!important;
    border-bottom:1px solid #e4dfd7!important;
    background:transparent!important;
    color:#171b20!important;
    text-decoration:none!important;
    box-sizing:border-box!important;
  }

  .po-mobile-detail-content .po-inline-ppl-lesson:last-child{
    border-bottom:0!important;
  }

  .po-mobile-detail-content .po-inline-ppl-lesson > span:first-child{
    display:grid!important;
    grid-column:1!important;
    grid-row:1 / span 2!important;
    place-items:center!important;
    width:34px!important;
    min-width:34px!important;
    height:30px!important;
    min-height:30px!important;
    margin:1px 0 0!important;
    padding:0!important;
    border:1px solid #d8c79f!important;
    background:#fffaf0!important;
    color:#a17c37!important;
    font-size:9px!important;
    font-weight:950!important;
    line-height:1!important;
    box-sizing:border-box!important;
  }

  .po-mobile-detail-content .po-inline-ppl-lesson > strong{
    display:block!important;
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    color:#171b20!important;
    font-size:14px!important;
    font-weight:900!important;
    line-height:1.35!important;
    letter-spacing:-.015em!important;
    overflow-wrap:anywhere!important;
  }

  .po-mobile-detail-content .po-inline-ppl-lesson > em{
    display:block!important;
    grid-column:2!important;
    grid-row:2!important;
    margin:1px 0 0!important;
    padding:0!important;
    color:#85817a!important;
    font-size:8px!important;
    font-style:normal!important;
    font-weight:900!important;
    line-height:1.3!important;
    letter-spacing:.06em!important;
    white-space:normal!important;
  }

  .po-mobile-detail-content .po-inline-ppl-lesson.is-clickable:active{
    background:#f7f3ea!important;
  }
}

/* Slightly tighter on very narrow iPhones. */
@media(max-width:380px){
  .po-mobile-detail-content .po-inline-ppl-section > summary{
    grid-template-columns:42px minmax(0,1fr) 28px!important;
    gap:8px!important;
    padding-left:7px!important;
    padding-right:7px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section > summary > span:first-child{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    min-height:38px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section > summary > strong{
    font-size:15px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-section > summary > b{
    width:28px!important;
    min-width:28px!important;
    height:28px!important;
    min-height:28px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-lesson > strong{
    font-size:13.5px!important;
  }
}


/* =========================================================
V205 / MOBILE OVERLAY STACK + IOS SEARCH FOCUS
Main menu/search must sit above any in-page detail window.
========================================================= */
@media(max-width:900px){

  /* Keep the global header above internal detail windows so search
     and header controls never become trapped behind them. */
  .po-header{
    z-index:2147481000!important;
  }

  /* Main hamburger menu is always the top-most site layer. */
  .po-mobile-menu-panel,
  #po-explore-panel{
    position:fixed!important;
    inset:0!important;
    z-index:2147483000!important;
  }

  .po-mobile-menu-panel .po-explore-backdrop{
    z-index:0!important;
  }

  .po-mobile-drawer{
    position:absolute!important;
    z-index:1!important;
  }

  /* Internal content/detail windows stay below the global controls. */
  .po-mobile-detail-sheet{
    z-index:2147480000!important;
  }

  /* Search belongs above the detail window too. */
  .po-site-search.is-open{
    z-index:2147482200!important;
  }

  .po-site-search-panel{
    z-index:2147482190!important;
  }

  /* iOS Safari auto-zooms focused inputs below 16px.
     16px prevents that without disabling pinch zoom/accessibility. */
  #po-site-search-input,
  .po-site-search.is-open input,
  .po-site-search input[type="search"]{
    font-size:16px!important;
    line-height:1.2!important;
  }

  #po-site-search-input{
    -webkit-text-size-adjust:100%!important;
    text-size-adjust:100%!important;
  }
}


/* =========================================================
V206 / MOBILE REGISTRATION HERO READABILITY
Image hero and explanatory content are separated on phones.
========================================================= */
@media(max-width:900px){

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual{
    padding:250px 18px 18px!important;
    overflow:hidden!important;
    background:#fbfaf7!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual::before{
    height:230px!important;
    background-image:
      linear-gradient(180deg,
        rgba(9,14,20,.06) 0%,
        rgba(9,14,20,.02) 42%,
        rgba(9,14,20,.18) 70%,
        rgba(9,14,20,.62) 100%),
      linear-gradient(90deg,
        rgba(7,12,20,.30) 0%,
        rgba(7,12,20,.10) 42%,
        rgba(7,12,20,.00) 75%),
      var(--po-course-hero-image)!important;
    background-size:cover,cover,cover!important;
    background-position:center center,center center,var(--po-course-hero-position,center 50%)!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual > small:first-of-type{
    top:18px!important;
    left:18px!important;
    right:auto!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:9px!important;
    font-weight:950!important;
    letter-spacing:.13em!important;
    text-shadow:0 2px 8px rgba(0,0,0,.58)!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual > h2{
    top:166px!important;
    left:18px!important;
    right:18px!important;
    margin:0!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:40px!important;
    line-height:.92!important;
    letter-spacing:-.055em!important;
    text-shadow:0 3px 16px rgba(0,0,0,.58)!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual.is-long-hero-title > h2{
    top:170px!important;
    font-size:31px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual.is-xlong-hero-title > h2{
    top:174px!important;
    font-size:25px!important;
  }

  /* Copy starts BELOW the photo. */
  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual > p{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    margin:0 0 18px!important;
    padding:0!important;
    color:#34383c!important;
    -webkit-text-fill-color:#34383c!important;
    font-size:14px!important;
    font-weight:650!important;
    line-height:1.72!important;
    letter-spacing:0!important;
    text-shadow:none!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual .po-inline-ppl-meta{
    margin-top:0!important;
    padding:14px 0!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual .po-inline-ppl-meta small{
    margin-bottom:6px!important;
    font-size:7px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual .po-inline-ppl-meta strong{
    font-size:10px!important;
    line-height:1.35!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual .po-inline-ppl-preview{
    margin:14px 0 9px!important;
    font-size:8px!important;
    color:#6f7275!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual .po-inline-ppl-start{
    min-height:60px!important;
    padding:0 18px!important;
    font-size:12px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual .po-inline-ppl-buy-grid{
    gap:10px!important;
    margin-top:10px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual .po-inline-ppl-buy{
    min-height:104px!important;
    padding:18px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual .po-inline-ppl-buy strong{
    margin-top:8px!important;
    font-size:16px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual .po-course-photo-credit{
    top:12px!important;
    right:12px!important;
    font-size:6.5px!important;
  }
}

@media(max-width:380px){
  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual{
    padding-top:232px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual::before{
    height:214px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual > h2{
    top:154px!important;
    font-size:36px!important;
  }

  .po-mobile-detail-content .po-inline-ppl-enroll.is-course-visual > p{
    font-size:13.5px!important;
  }
}


/* =========================================================
V230 / v4.21 — DESKTOP TOP MENU HIERARCHY UNIFICATION
Same visual language from top to bottom:
darkest navigation background -> lighter parent box ->
lighter open/active parent + gold left accent -> flat dark submenu.
Desktop TOP only.
========================================================= */
@media(min-width:901px){

  /* Keep the navigation canvas as the darkest layer. */
  .po-global-left-list{
    gap:7px!important;
  }

  /* Every top-level actionable row uses the same parent-card language. */
  .po-global-left-list
  :is(
    .po-global-home,
    .po-global-become-toggle,
    .po-global-learning-toggle,
    .po-global-medical-toggle,
    .po-global-career-toggle,
    .po-global-news-toggle,
    .po-global-resource-toggle,
    .po-global-catalog-item,
    .po-global-mypage-item
  ){
    min-height:50px!important;
    margin:0!important;
    border:1px solid #3a424a!important;
    border-radius:0!important;
    background:#20272e!important;
    box-shadow:none!important;
    color:#f2f4f5!important;
    transition:
      background-color .18s ease,
      border-color .18s ease,
      box-shadow .18s ease,
      transform .18s ease!important;
  }

  .po-global-left-list
  :is(
    .po-global-home,
    .po-global-become-toggle,
    .po-global-learning-toggle,
    .po-global-medical-toggle,
    .po-global-career-toggle,
    .po-global-news-toggle,
    .po-global-resource-toggle,
    .po-global-catalog-item,
    .po-global-mypage-item
  ):hover{
    border-color:#4a535c!important;
    background:#272f37!important;
    transform:translateX(1px)!important;
  }

  /* Open accordion / active destination gets one stronger hierarchy step. */
  .po-global-home.is-active,
  .po-global-become-group.is-open > .po-global-become-toggle,
  .po-global-learning-group.is-open > .po-global-learning-toggle,
  .po-global-medical-group.is-open > .po-global-medical-toggle,
  .po-global-career-group.is-open > .po-global-career-toggle,
  .po-global-news-group.is-open > .po-global-news-toggle,
  .po-global-resource-group.is-open > .po-global-resource-toggle,
  .po-global-catalog-group.is-open > .po-global-catalog-item,
  .po-global-catalog-item.is-active,
  .po-global-mypage-item.is-active{
    border-color:#5d646b!important;
    background:#353c43!important;
    box-shadow:inset 3px 0 0 #d2a14d!important;
  }

  /* Number/code/icon cells stay compact and consistent. */
  .po-global-left-list
  :is(
    .po-global-become-toggle,
    .po-global-learning-toggle,
    .po-global-medical-toggle,
    .po-global-career-toggle,
    .po-global-news-toggle,
    .po-global-resource-toggle,
    .po-global-catalog-item,
    .po-global-mypage-item
  ) > span{
    border-color:#59616a!important;
    background:rgba(255,255,255,.018)!important;
  }

  .po-global-left-list
  :is(
    .po-global-become-group.is-open > .po-global-become-toggle,
    .po-global-learning-group.is-open > .po-global-learning-toggle,
    .po-global-medical-group.is-open > .po-global-medical-toggle,
    .po-global-career-group.is-open > .po-global-career-toggle,
    .po-global-news-group.is-open > .po-global-news-toggle,
    .po-global-resource-group.is-open > .po-global-resource-toggle,
    .po-global-catalog-group.is-open > .po-global-catalog-item,
    .po-global-catalog-item.is-active
  ) > span{
    border-color:#7a6948!important;
    color:#d8a348!important;
    -webkit-text-fill-color:#d8a348!important;
  }

  /* Home icon follows the same hierarchy without adding another heavy box. */
  .po-global-home .po-home-plane{
    color:#d8a348!important;
    -webkit-text-fill-color:#d8a348!important;
  }

  /* All expanded child menus return to the darkest layer. */
  .po-global-left-list [class*="submenu"]{
    margin-left:0!important;
    padding-left:14px!important;
    border-left:1px solid #333a41!important;
    background:#11171d!important;
  }

  .po-global-left-list
  :is(
    .po-global-become-group.is-open,
    .po-global-learning-group.is-open,
    .po-global-medical-group.is-open,
    .po-global-career-group.is-open,
    .po-global-news-group.is-open,
    .po-global-resource-group.is-open,
    .po-global-catalog-group.is-open
  ) > [class*="submenu"]{
    padding-top:5px!important;
    padding-bottom:5px!important;
  }

  /* Child rows remain flat and subordinate to the parent. */
  .po-global-left-list [class*="submenu"] > :is(button,a){
    min-height:40px!important;
    padding:6px 8px!important;
    border:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .po-global-left-list [class*="submenu"] > :is(button,a):last-child{
    border-bottom:0!important;
  }

  .po-global-left-list [class*="submenu"] > :is(button,a):hover,
  .po-global-left-list [class*="submenu"] > :is(button,a).is-active{
    background:rgba(255,255,255,.045)!important;
    transform:translateX(2px)!important;
  }

  /* Section labels stay informational and do not compete with buttons. */
  .po-global-section-label{
    margin:11px 5px 3px!important;
    color:#89939b!important;
    font-size:8px!important;
    letter-spacing:.16em!important;
  }

  .po-global-left-list > .po-global-section-label:first-child{
    margin-top:3px!important;
  }
}


/* =========================================================
V231 / v4.22 — MOBILE TOP: NO HEADER + FLOATING MAIN MENU
The smartphone TOP page now follows the lesson-page architecture:
no fixed site header; one compact PILOT ONLINE menu button at bottom-right.
Desktop header remains unchanged.
========================================================= */

/* Standalone floating menu control is mobile-only. */
.po-top-mobile-menu-float{
  display:none;
}

@media(max-width:900px){

  /* Remove the smartphone site header completely. */
  .po-header{
    display:none!important;
  }

  /* Do not reserve visual space for the deleted header. */
  .po-mobile{
    padding-top:0!important;
  }

  /* Main-menu floating button, aligned with the lesson-page pattern. */
  .po-top-mobile-menu-float{
    appearance:none!important;
    -webkit-appearance:none!important;
    position:fixed!important;
    right:14px!important;
    bottom:calc(18px + env(safe-area-inset-bottom, 0px))!important;
    z-index:1190!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    min-width:0!important;
    height:42px!important;
    margin:0!important;
    padding:0 15px!important;
    border:1px solid #3d454d!important;
    border-radius:999px!important;
    background:#171c21!important;
    color:#fff!important;
    box-shadow:0 8px 24px rgba(0,0,0,.22)!important;
    cursor:pointer!important;
    -webkit-tap-highlight-color:transparent!important;
    transition:
      background-color .18s ease,
      border-color .18s ease,
      transform .18s ease,
      opacity .18s ease!important;
  }

  .po-top-mobile-menu-float:hover,
  .po-top-mobile-menu-float[aria-expanded="true"]{
    border-color:#59626b!important;
    background:#252c33!important;
  }

  .po-top-mobile-menu-float:active{
    transform:translateY(1px)!important;
  }

  .po-top-mobile-menu-float:focus,
  .po-top-mobile-menu-float:focus-visible{
    outline:none!important;
  }

  .po-top-mobile-menu-float strong{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:10px!important;
    font-weight:950!important;
    line-height:1!important;
    letter-spacing:.08em!important;
    white-space:nowrap!important;
  }

  .po-top-mobile-menu-float-icon{
    position:relative!important;
    display:block!important;
    width:15px!important;
    height:11px!important;
    flex:0 0 15px!important;
  }

  .po-top-mobile-menu-float-icon::before,
  .po-top-mobile-menu-float-icon::after,
  .po-top-mobile-menu-float-icon span{
    content:""!important;
    position:absolute!important;
    left:0!important;
    width:15px!important;
    height:1.5px!important;
    border-radius:999px!important;
    background:#d3ab62!important;
  }

  .po-top-mobile-menu-float-icon::before{top:0!important;}
  .po-top-mobile-menu-float-icon span{top:4.7px!important;}
  .po-top-mobile-menu-float-icon::after{top:9.4px!important;}

  /* While the drawer is open, keep the launcher unobtrusive behind it. */
  body.po-mobile-menu-open .po-top-mobile-menu-float{
    opacity:0!important;
    pointer-events:none!important;
  }
}

@media(min-width:901px){
  .po-top-mobile-menu-float{
    display:none!important;
  }
}


/* =========================================================
V232 / v4.23 — MOBILE TOP HERO READABILITY BOOST
- Conversation bubbles get stronger contrast against the hero image
- "進路を知る。学ぶ。空へ進む。" becomes larger / darker / clearer
Smartphone TOP only.
========================================================= */
@media(max-width:900px){

  /* Hero subtitle under the typing line */
  .po-mobile-hero-content>p{
    margin-top:12px!important;
    color:#23313a!important;
    -webkit-text-fill-color:#23313a!important;
    font-size:14px!important;
    font-weight:800!important;
    line-height:1.5!important;
    letter-spacing:.02em!important;
    text-shadow:
      0 1px 0 rgba(255,255,255,.92),
      0 4px 14px rgba(255,255,255,.82)!important;
  }

  /* Opening dialogue bubbles: less transparent + slightly stronger borders/shadow */
  .po-mobile-hero-dialogue .po-mobile-talk-bubble{
    padding:10px 11px!important;
    border:1px solid rgba(57,66,74,.28)!important;
    border-radius:8px!important;
    background:rgba(250,249,246,.94)!important;
    box-shadow:
      0 5px 16px rgba(0,0,0,.10),
      0 1px 0 rgba(255,255,255,.45) inset!important;
    backdrop-filter:blur(1.5px)!important;
    -webkit-backdrop-filter:blur(1.5px)!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk.captain .po-mobile-talk-bubble{
    border-color:rgba(111,94,58,.30)!important;
    background:rgba(244,235,214,.96)!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble:before{
    opacity:1!important;
    filter:drop-shadow(0 1px 1px rgba(0,0,0,.08))!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble p{
    color:#18232b!important;
    -webkit-text-fill-color:#18232b!important;
    font-size:12.4px!important;
    font-weight:700!important;
    line-height:1.58!important;
    letter-spacing:.01em!important;
    text-shadow:none!important;
  }

  /* Avatar labels can also be a touch clearer against the image. */
  .po-mobile-hero-dialogue .po-mobile-talk-avatar small{
    color:#344048!important;
    -webkit-text-fill-color:#344048!important;
    font-size:8px!important;
    font-weight:800!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-hero-content>p{
    font-size:13px!important;
    line-height:1.45!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble{
    padding:9px 10px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble p{
    font-size:11.4px!important;
    line-height:1.5!important;
  }
}


/* =========================================================
V233 / v4.24 — MOBILE HERO RECOMPOSE + LESSON MENU CLONE
- Dialogue moves to the top of the hero
- Typewriter/subtitle stay centered
- Lower aircraft remains unobstructed
- TOP main menu visually matches lesson-page PILOT ONLINE menu
========================================================= */
@media(max-width:900px){

  /* ---------- HERO COMPOSITION ---------- */
  .po-mobile-start{
    padding:0!important;
  }

  .po-mobile-hero{
    min-height:100svh!important;
  }

  .po-mobile-hero-dialogue{
    top:calc(18px + env(safe-area-inset-top, 0px))!important;
    bottom:auto!important;
    left:16px!important;
    right:16px!important;
    width:auto!important;
    max-width:520px!important;
    margin:0 auto!important;
    transform:none!important;
  }

  .po-mobile-hero-dialogue .po-mobile-conversation{
    gap:8px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble{
    padding:9px 10px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble p{
    font-size:11.7px!important;
    line-height:1.5!important;
  }

  .po-mobile-hero-content{
    top:43%!important;
    left:16px!important;
    right:16px!important;
    transform:translateY(-50%)!important;
  }

  .po-mobile-hero-content>p{
    margin-top:12px!important;
  }

  .po-mobile-hero-scroll{
    bottom:calc(12px + env(safe-area-inset-bottom, 0px))!important;
  }

  .po-mobile-hero-scroll span{
    font-size:8px!important;
    letter-spacing:.16em!important;
  }

  /* ---------- FLOATING PILOT ONLINE BUTTON: lesson-page copy ---------- */
  .po-top-mobile-menu-float.po-lms-floating-site-menu{
    position:fixed!important;
    right:max(14px,env(safe-area-inset-right))!important;
    bottom:calc(18px + env(safe-area-inset-bottom))!important;
    z-index:2147482000!important;
    display:flex!important;
    min-width:136px!important;
    min-height:46px!important;
    width:auto!important;
    height:auto!important;
    padding:0 16px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px!important;
    border:1px solid rgba(255,255,255,.22)!important;
    border-radius:999px!important;
    background:rgba(23,28,33,.96)!important;
    box-shadow:0 10px 30px rgba(0,0,0,.23)!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font:900 9px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
    letter-spacing:.09em!important;
    text-decoration:none!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
    cursor:pointer!important;
    appearance:none!important;
    -webkit-appearance:none!important;
    touch-action:manipulation!important;
  }

  .po-top-mobile-menu-float.po-lms-floating-site-menu strong{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font:inherit!important;
    letter-spacing:inherit!important;
  }

  .po-top-mobile-menu-float.po-lms-floating-site-menu .po-top-mobile-menu-float-icon{
    display:none!important;
  }

  .po-top-mobile-menu-float.po-lms-floating-site-menu::before{
    content:""!important;
    width:15px!important;
    height:11px!important;
    flex:0 0 15px!important;
    background:
      linear-gradient(#fff,#fff) 0 0/15px 1.5px no-repeat,
      linear-gradient(#fff,#fff) 0 4.5px/15px 1.5px no-repeat,
      linear-gradient(#fff,#fff) 0 9px/15px 1.5px no-repeat!important;
  }

  .po-top-mobile-menu-float.po-lms-floating-site-menu:active{
    transform:translateY(1px)!important;
  }

  body.po-lms-local-menu-open .po-top-mobile-menu-float{
    display:none!important;
  }

  /* ---------- PANEL / DRAWER: lesson-page copy ---------- */
  body.po-lms-local-menu-open{
    overflow:hidden!important;
  }

  .po-lms-local-menu-panel{
    position:fixed!important;
    inset:0!important;
    z-index:2147483200!important;
    display:block!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
    transition:opacity .18s ease,visibility .18s ease!important;
  }

  .po-lms-local-menu-panel.is-open{
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }

  .po-lms-local-menu-backdrop{
    position:absolute!important;
    inset:0!important;
    background:rgba(15,18,22,.46)!important;
    backdrop-filter:blur(4px)!important;
    -webkit-backdrop-filter:blur(4px)!important;
  }

  .po-lms-local-menu-drawer{
    position:absolute!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    width:min(88vw,390px)!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    border-left:1px solid #30363d!important;
    background:#171c21!important;
    color:#fff!important;
    box-shadow:-20px 0 52px rgba(0,0,0,.22)!important;
    transform:translateX(102%)!important;
    transition:transform .28s cubic-bezier(.22,.61,.36,1)!important;
  }

  .po-lms-local-menu-panel.is-open .po-lms-local-menu-drawer{
    transform:none!important;
  }

  .po-lms-local-menu-head{
    flex:0 0 54px!important;
    min-height:54px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    padding:0 10px 0 14px!important;
    border-bottom:1px solid rgba(255,255,255,.12)!important;
  }

  .po-lms-local-menu-brand{
    display:flex!important;
    align-items:center!important;
    align-self:stretch!important;
    min-width:0!important;
    flex:1 1 auto!important;
    margin:0!important;
    padding:0!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-family:inherit!important;
    font-size:16px!important;
    font-weight:950!important;
    line-height:1!important;
    letter-spacing:.07em!important;
    text-decoration:none!important;
  }

  .po-lms-local-menu-brand::after{
    content:"→"!important;
    margin-left:9px!important;
    color:#c9a25d!important;
    -webkit-text-fill-color:#c9a25d!important;
    font-size:13px!important;
    font-weight:700!important;
    letter-spacing:0!important;
  }

  .po-lms-local-menu-close{
    appearance:none!important;
    -webkit-appearance:none!important;
    flex:0 0 34px!important;
    width:34px!important;
    height:34px!important;
    padding:0!important;
    border:1px solid rgba(255,255,255,.18)!important;
    background:transparent!important;
    color:#fff!important;
    font-size:22px!important;
    font-weight:300!important;
    line-height:1!important;
  }

  /* Permanent minimal keyword search. */
  .po-lms-local-search,
  .po-lms-local-search.is-open{
    display:block!important;
    flex:0 0 auto!important;
    padding:10px 10px 7px!important;
    border-bottom:0!important;
    background:#171c21!important;
  }

  .po-lms-local-search-form,
  .po-lms-local-search-form:focus,
  .po-lms-local-search-form:focus-within{
    display:grid!important;
    grid-template-columns:25px minmax(0,1fr)!important;
    gap:8px!important;
    align-items:center!important;
    width:100%!important;
    min-height:44px!important;
    margin:0!important;
    padding:0 8px!important;
    outline:none!important;
    border-top:0!important;
    border-right:0!important;
    border-left:0!important;
    border-bottom:1px solid #4a5158!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    -webkit-tap-highlight-color:transparent!important;
  }

  .po-lms-local-search-form:focus-within{
    border-bottom-color:#c9a25d!important;
  }

  .po-lms-local-search-form>span{
    color:#c9a25d!important;
    -webkit-text-fill-color:#c9a25d!important;
    font-size:18px!important;
  }

  .po-lms-local-search-form input,
  .po-lms-local-search-form input:focus,
  .po-lms-local-search-form input:focus-visible,
  .po-lms-local-search-form input:active{
    appearance:none!important;
    -webkit-appearance:none!important;
    width:100%!important;
    min-width:0!important;
    height:43px!important;
    margin:0!important;
    padding:0!important;
    outline:none!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:transparent!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:16px!important;
    font-weight:750!important;
    line-height:1.2!important;
    -webkit-tap-highlight-color:transparent!important;
  }

  .po-lms-local-search-form input::placeholder{
    color:#b7bec3!important;
    -webkit-text-fill-color:#b7bec3!important;
    opacity:1!important;
  }

  .po-lms-local-search-results{
    display:none!important;
    max-height:34dvh!important;
    margin:0!important;
    padding:0!important;
    overflow-y:auto!important;
    background:transparent!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .po-lms-local-search-results.is-visible{
    display:block!important;
    padding-top:7px!important;
  }

  .po-lms-local-search-state{
    padding:8px 7px 5px!important;
    color:#aeb7bd!important;
  }

  .po-lms-local-search-state strong{
    color:#aeb7bd!important;
    font-size:10px!important;
    font-weight:750!important;
    line-height:1.4!important;
  }

  .po-lms-local-search-summary{
    display:flex!important;
    justify-content:space-between!important;
    gap:10px!important;
    padding:6px 6px 5px!important;
    color:#fff!important;
  }

  .po-lms-local-search-summary strong{
    min-width:0!important;
    color:#fff!important;
    font-size:10.5px!important;
    font-weight:900!important;
  }

  .po-lms-local-search-summary span{
    flex:0 0 auto!important;
    color:#c9a25d!important;
    font-size:7px!important;
    font-weight:900!important;
    letter-spacing:.08em!important;
  }

  .po-lms-local-search-list{
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
  }

  .po-lms-local-search-result{
    position:relative!important;
    display:block!important;
    padding:10px 30px 10px 7px!important;
    border:0!important;
    border-top:1px solid rgba(255,255,255,.09)!important;
    background:transparent!important;
    color:#fff!important;
    text-decoration:none!important;
  }

  .po-lms-local-search-result:last-child{
    border-bottom:1px solid rgba(255,255,255,.09)!important;
  }

  .po-lms-local-search-result small{
    display:block!important;
    margin-bottom:4px!important;
    color:#c9a25d!important;
    font-size:7px!important;
    font-weight:950!important;
    letter-spacing:.10em!important;
  }

  .po-lms-local-search-result strong{
    display:block!important;
    color:#fff!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:1.35!important;
  }

  .po-lms-local-search-result em{
    display:block!important;
    margin-top:4px!important;
    color:#aeb7bd!important;
    font-size:8px!important;
    font-style:normal!important;
    font-weight:700!important;
  }

  .po-lms-local-search-result b{
    position:absolute!important;
    top:50%!important;
    right:11px!important;
    transform:translateY(-50%)!important;
    color:#c9a25d!important;
    font-size:15px!important;
  }

  /* MY PAGE standalone row, same as lesson menu. */
  .po-lms-local-menu-actions{
    flex:0 0 auto!important;
    display:block!important;
    padding:2px 10px 7px!important;
    border-bottom:1px solid rgba(255,255,255,.10)!important;
    background:#171c21!important;
  }

  .po-lms-local-menu-action.po-lms-local-menu-mypage{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:flex!important;
    width:100%!important;
    min-height:42px!important;
    margin:0!important;
    padding:0 8px!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-family:inherit!important;
    text-decoration:none!important;
  }

  .po-lms-local-menu-action.po-lms-local-menu-mypage span{
    display:grid!important;
    width:25px!important;
    height:25px!important;
    place-items:center!important;
    color:#c9a25d!important;
    -webkit-text-fill-color:#c9a25d!important;
    font-size:15px!important;
  }

  .po-lms-local-menu-action.po-lms-local-menu-mypage strong{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.08em!important;
  }

  /* Navigation list. */
  .po-lms-local-menu-nav{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    padding:4px 10px 24px!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .po-lms-local-menu-nav .po-global-section-label{
    margin:9px 8px 5px!important;
    padding:0!important;
    color:#808b94!important;
    font-size:7.5px!important;
    font-weight:950!important;
    letter-spacing:.15em!important;
  }

  .po-lms-local-menu-nav
  :is(
    .po-global-become-group,
    .po-global-learning-group,
    .po-global-medical-group,
    .po-global-career-group,
    .po-global-news-group,
    .po-global-resource-group,
    .po-global-catalog-group
  ){
    margin:0 0 7px!important;
  }

  .po-lms-local-menu-nav
  :is(
    .po-global-become-toggle,
    .po-global-learning-toggle,
    .po-global-medical-toggle,
    .po-global-career-toggle,
    .po-global-news-toggle,
    .po-global-resource-toggle,
    .po-global-catalog-item
  ){
    appearance:none!important;
    -webkit-appearance:none!important;
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr) 28px!important;
    gap:10px!important;
    align-items:center!important;
    width:100%!important;
    min-height:50px!important;
    margin:0!important;
    padding:7px 8px!important;
    border:1px solid #3a424a!important;
    border-radius:0!important;
    background:#20272e!important;
    color:#fff!important;
    text-align:left!important;
    font-family:inherit!important;
    text-decoration:none!important;
    cursor:pointer!important;
    box-shadow:none!important;
    transition:
      background-color .22s ease,
      border-color .22s ease,
      box-shadow .22s ease!important;
  }

  .po-lms-local-menu-nav
  :is(
    .po-global-become-toggle,
    .po-global-learning-toggle,
    .po-global-medical-toggle,
    .po-global-career-toggle,
    .po-global-news-toggle,
    .po-global-resource-toggle,
    .po-global-catalog-item
  ):hover{
    border-color:#4a535c!important;
    background:#272f37!important;
  }

  .po-lms-local-menu-nav .is-open >
  :is(
    .po-global-become-toggle,
    .po-global-learning-toggle,
    .po-global-medical-toggle,
    .po-global-career-toggle,
    .po-global-news-toggle,
    .po-global-resource-toggle,
    .po-global-catalog-item
  ){
    border-color:#5d646b!important;
    background:#353c43!important;
    box-shadow:inset 3px 0 0 #d2a14d!important;
  }

  .po-lms-local-menu-nav
  :is(
    .po-global-become-toggle,
    .po-global-learning-toggle,
    .po-global-medical-toggle,
    .po-global-career-toggle,
    .po-global-news-toggle,
    .po-global-resource-toggle,
    .po-global-catalog-item
  ) > span{
    display:grid!important;
    width:32px!important;
    height:32px!important;
    place-items:center!important;
    border:1px solid #59616a!important;
    background:rgba(255,255,255,.018)!important;
    color:#c9a25d!important;
    -webkit-text-fill-color:#c9a25d!important;
    font-size:8px!important;
    font-weight:950!important;
  }

  .po-lms-local-menu-nav .is-open >
  :is(
    .po-global-become-toggle,
    .po-global-learning-toggle,
    .po-global-medical-toggle,
    .po-global-career-toggle,
    .po-global-news-toggle,
    .po-global-resource-toggle,
    .po-global-catalog-item
  ) > span{
    border-color:#7a6948!important;
    color:#d8a348!important;
    -webkit-text-fill-color:#d8a348!important;
  }

  .po-lms-local-menu-nav [class*="-toggle"]>strong,
  .po-lms-local-menu-nav .po-global-catalog-item>strong{
    min-width:0!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:13.5px!important;
    font-weight:900!important;
    line-height:1.35!important;
  }

  .po-lms-local-menu-nav [class*="-chevron"],
  .po-lms-local-menu-nav .po-global-catalog-chevron{
    position:relative!important;
    display:grid!important;
    width:27px!important;
    height:27px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.16)!important;
    color:#cfd4d8!important;
    transition:
      border-color .18s ease,
      background-color .18s ease,
      transform .22s ease!important;
  }

  .po-lms-local-menu-nav [class*="-chevron"]::before,
  .po-lms-local-menu-nav .po-global-catalog-chevron::before{
    content:"+"!important;
    font-size:16px!important;
    font-weight:500!important;
  }

  .po-lms-local-menu-nav .is-open > [class*="-toggle"] [class*="-chevron"]::before,
  .po-lms-local-menu-nav .is-open > .po-global-catalog-item .po-global-catalog-chevron::before{
    content:"−"!important;
  }

  .po-lms-local-menu-nav [class*="submenu"]{
    max-height:0!important;
    margin:0!important;
    padding:0 0 0 14px!important;
    overflow:hidden!important;
    border-left:1px solid transparent!important;
    background:#11171d!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-5px)!important;
    transition:
      max-height .34s cubic-bezier(.22,.8,.22,1),
      opacity .22s ease,
      transform .30s cubic-bezier(.22,.8,.22,1),
      padding .30s ease,
      border-color .20s ease,
      visibility 0s linear .34s!important;
  }

  .po-lms-local-menu-nav .is-open > [class*="submenu"]{
    max-height:1400px!important;
    margin-left:0!important;
    padding:4px 0 4px 14px!important;
    border-left-color:#333a41!important;
    background:#11171d!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
    transition:
      max-height .34s cubic-bezier(.22,.8,.22,1),
      opacity .24s ease,
      transform .30s cubic-bezier(.22,.8,.22,1),
      padding .30s ease,
      border-color .20s ease,
      visibility 0s linear 0s!important;
  }

  .po-lms-local-menu-nav [class*="submenu"] button,
  .po-lms-local-menu-nav [class*="submenu"] a{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) 20px!important;
    gap:8px!important;
    align-items:center!important;
    width:100%!important;
    min-height:43px!important;
    padding:7px 8px!important;
    border:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
    background:transparent!important;
    color:#fff!important;
    text-align:left!important;
    text-decoration:none!important;
    font-family:inherit!important;
    box-shadow:none!important;
  }

  .po-lms-local-menu-nav [class*="submenu"] button:last-child,
  .po-lms-local-menu-nav [class*="submenu"] a:last-child{
    border-bottom:0!important;
  }

  .po-lms-local-menu-nav [class*="submenu"] small{
    color:#c9a25d!important;
    font-size:8.5px!important;
    font-weight:950!important;
    line-height:1.2!important;
    letter-spacing:.06em!important;
  }

  .po-lms-local-menu-nav [class*="submenu"] strong{
    min-width:0!important;
    color:#dfe4e7!important;
    -webkit-text-fill-color:#dfe4e7!important;
    font-size:12.5px!important;
    font-weight:850!important;
    line-height:1.42!important;
  }

  .po-lms-local-menu-nav [class*="submenu"] b{
    color:#8f999f!important;
    font-size:12px!important;
    font-weight:500!important;
  }

  .po-lms-local-menu-nav .po-global-account-label,
  .po-lms-local-menu-nav .po-global-mypage-item,
  .po-lms-local-menu-nav > .po-global-home{
    display:none!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-hero-dialogue{
    top:calc(12px + env(safe-area-inset-top, 0px))!important;
    bottom:auto!important;
  }

  .po-mobile-hero-content{
    top:44%!important;
  }
}


/* =========================================================
V234 / v4.25 — MOBILE HERO ARROW-ONLY SCROLL HINT
Remove the tiny START HERE text and use a cleaner animated arrow cue.
========================================================= */
@media(max-width:900px){

  .po-mobile-hero-scroll.po-mobile-hero-arrow-only{
    bottom:calc(16px + env(safe-area-inset-bottom, 0px))!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    gap:0!important;
    pointer-events:none!important;
  }

  .po-mobile-hero-scroll.po-mobile-hero-arrow-only span{
    display:none!important;
  }

  .po-mobile-hero-scroll.po-mobile-hero-arrow-only b{
    display:inline-grid!important;
    place-items:center!important;
    width:34px!important;
    height:34px!important;
    border-radius:999px!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:18px!important;
    font-weight:700!important;
    line-height:1!important;
    background:rgba(20,26,31,.28)!important;
    border:1px solid rgba(255,255,255,.20)!important;
    box-shadow:
      0 8px 22px rgba(0,0,0,.18),
      0 0 0 0 rgba(255,255,255,.10)!important;
    backdrop-filter:blur(6px)!important;
    -webkit-backdrop-filter:blur(6px)!important;
    animation:poMobileHeroArrowFloat 1.8s ease-in-out infinite,
              poMobileHeroArrowPulse 1.8s ease-in-out infinite!important;
  }
}

@keyframes poMobileHeroArrowFloat{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(5px);
  }
}

@keyframes poMobileHeroArrowPulse{
  0%,100%{
    box-shadow:
      0 8px 22px rgba(0,0,0,.18),
      0 0 0 0 rgba(255,255,255,.10);
  }
  55%{
    box-shadow:
      0 8px 22px rgba(0,0,0,.18),
      0 0 0 9px rgba(255,255,255,0);
  }
}


/* =========================================================
V235 / v4.26 — MOBILE HERO TWO-ROUND CONVERSATION
Two dialogue rounds on the TOP smartphone hero:
- upper-middle pair
- lower-middle pair
The center headline remains between them.
========================================================= */
@media(max-width:900px){

  .po-mobile-hero-content{
    top:46%!important;
    left:16px!important;
    right:16px!important;
    transform:translateY(-50%)!important;
  }

  .po-mobile-hero-dialogue{
    left:16px!important;
    right:16px!important;
    width:auto!important;
    max-width:520px!important;
    margin:0 auto!important;
    transform:translateY(-50%)!important;
  }

  .po-mobile-hero-dialogue.po-mobile-hero-dialogue-top{
    top:26%!important;
    bottom:auto!important;
  }

  .po-mobile-hero-dialogue.po-mobile-hero-dialogue-bottom{
    top:67%!important;
    bottom:auto!important;
  }

  .po-mobile-hero-dialogue .po-mobile-conversation{
    gap:8px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble{
    padding:9px 10px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble p{
    font-size:11.6px!important;
    line-height:1.5!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-hero-content{
    top:46%!important;
  }

  .po-mobile-hero-dialogue.po-mobile-hero-dialogue-top{
    top:24%!important;
  }

  .po-mobile-hero-dialogue.po-mobile-hero-dialogue-bottom{
    top:68%!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble{
    padding:8px 9px!important;
  }

  .po-mobile-hero-dialogue .po-mobile-talk-bubble p{
    font-size:11.1px!important;
    line-height:1.48!important;
  }
}


/* =========================================================
V236 / v4.27 — MOBILE HERO CLEANUP
Undo the visually busy two-round hero.
One concise conversation, stronger visual hierarchy:
- trainee = light bubble
- captain = dark navy bubble
- headline remains the visual center
- aircraft remains readable below
========================================================= */
@media(max-width:900px){

  /* Hide any stale v4.26 lower dialogue if cached markup survives. */
  .po-mobile-hero-dialogue-bottom{
    display:none!important;
  }

  .po-mobile-hero-content{
    top:49%!important;
    left:16px!important;
    right:16px!important;
    transform:translateY(-50%)!important;
  }

  .po-mobile-hero-dialogue.po-mobile-hero-dialogue-single{
    top:25%!important;
    bottom:auto!important;
    left:18px!important;
    right:18px!important;
    width:auto!important;
    max-width:500px!important;
    margin:0 auto!important;
    transform:translateY(-50%)!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-conversation{
    gap:8px!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-talk,
  .po-mobile-hero-dialogue-single .po-mobile-talk.captain{
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:8px!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-talk.captain{
    grid-template-columns:minmax(0,1fr) 42px!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-talk-bubble{
    padding:10px 12px!important;
    border:1px solid rgba(42,52,59,.24)!important;
    border-radius:9px!important;
    background:rgba(250,249,246,.96)!important;
    box-shadow:0 7px 20px rgba(0,0,0,.10)!important;
    backdrop-filter:blur(2px)!important;
    -webkit-backdrop-filter:blur(2px)!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-talk-bubble p{
    color:#172129!important;
    -webkit-text-fill-color:#172129!important;
    font-size:12.1px!important;
    font-weight:750!important;
    line-height:1.52!important;
  }

  /* Captain bubble gets a strong visual identity instead of another pale box. */
  .po-mobile-hero-dialogue-single .po-mobile-talk.captain .po-mobile-talk-bubble{
    grid-column:1!important;
    grid-row:1!important;
    border-color:rgba(255,255,255,.14)!important;
    background:rgba(18,32,44,.94)!important;
    box-shadow:0 8px 22px rgba(0,0,0,.16)!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-talk.captain .po-mobile-talk-bubble p{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-talk.captain .po-mobile-talk-bubble:before{
    background:rgba(18,32,44,.94)!important;
    border-color:rgba(255,255,255,.14)!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-talk-avatar small{
    color:#2f3b43!important;
    -webkit-text-fill-color:#2f3b43!important;
    font-size:8px!important;
    font-weight:850!important;
  }

  /* Keep the core message dominant. */
  .po-mobile-hero-type{
    font-size:clamp(31px,9vw,43px)!important;
  }

  .po-mobile-hero-content>p{
    margin-top:11px!important;
    font-size:13.5px!important;
    font-weight:850!important;
    letter-spacing:.015em!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-hero-dialogue.po-mobile-hero-dialogue-single{
    top:23%!important;
  }

  .po-mobile-hero-content{
    top:49%!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-talk-bubble{
    padding:8px 10px!important;
  }

  .po-mobile-hero-dialogue-single .po-mobile-talk-bubble p{
    font-size:11.3px!important;
  }
}


/* =========================================================
V237 / v4.28 — MOBILE TOP HERO SPLIT-LAYOUT
- The top image no longer owns the full first view.
- Lower portion of the first screen becomes the beginning of the next section.
- The hero image fades into the paper section with a gradient.
- Conversation moves to the beginning of the ROUTES section.
- Captain bubble returns to the original light background.
========================================================= */
@media(max-width:900px){

  /* If old hero conversation markup is cached anywhere, hide it. */
  .po-mobile-hero-dialogue,
  .po-mobile-hero-dialogue-single{
    display:none!important;
  }

  /* Upper visual hero occupies only the upper part of the first screen. */
  .po-mobile-start{
    display:block!important;
    min-height:auto!important;
    padding:0!important;
    background:transparent!important;
    overflow:visible!important;
  }

  .po-mobile-hero{
    position:relative!important;
    min-height:70svh!important;
    padding:calc(26px + env(safe-area-inset-top, 0px)) 18px 78px!important;
    justify-content:flex-start!important;
    overflow:hidden!important;
  }

  /* Stronger image-to-section transition. */
  .po-mobile-hero::after{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    height:34%!important;
    background:linear-gradient(
      to bottom,
      rgba(246,243,236,0) 0%,
      rgba(246,243,236,.34) 32%,
      rgba(246,243,236,.78) 66%,
      rgba(246,243,236,1) 100%
    )!important;
    pointer-events:none!important;
  }

  .po-mobile-hero-content{
    position:relative!important;
    z-index:1!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    max-width:520px!important;
    margin:0 auto!important;
    transform:none!important;
    padding-top:16px!important;
  }

  .po-mobile-hero-type{
    font-size:clamp(31px,9vw,44px)!important;
  }

  .po-mobile-hero-content>p{
    margin-top:12px!important;
    color:#23313a!important;
    -webkit-text-fill-color:#23313a!important;
    font-size:13.8px!important;
    font-weight:850!important;
    line-height:1.5!important;
    letter-spacing:.02em!important;
    text-shadow:
      0 1px 0 rgba(255,255,255,.92),
      0 4px 14px rgba(255,255,255,.82)!important;
  }

  /* Start of next HERO/section becomes visible in the first view. */
  .po-mobile-become{
    position:relative!important;
    margin-top:-46px!important;
    padding:34px 18px 64px!important;
    background:var(--po-paper)!important;
    border-top-left-radius:28px!important;
    border-top-right-radius:28px!important;
    box-shadow:0 -1px 0 rgba(23,27,32,.06)!important;
    z-index:2!important;
  }

  .po-mobile-become .po-mobile-inner{
    position:relative!important;
    z-index:1!important;
  }

  /* Conversation now sits near the start of the next section. */
  .po-mobile-become-intro{
    margin:0 0 18px!important;
  }

  .po-mobile-become-intro .po-mobile-conversation{
    display:grid!important;
    gap:10px!important;
  }

  .po-mobile-become-intro .po-mobile-talk{
    display:grid!important;
    grid-template-columns:46px minmax(0,1fr)!important;
    gap:9px!important;
    align-items:start!important;
  }

  .po-mobile-become-intro .po-mobile-talk.captain{
    grid-template-columns:minmax(0,1fr) 46px!important;
  }

  .po-mobile-become-intro .po-mobile-talk-avatar{
    width:46px!important;
  }

  .po-mobile-become-intro .po-mobile-talk-avatar img{
    width:40px!important;
    height:40px!important;
  }

  .po-mobile-become-intro .po-mobile-talk-avatar small{
    width:46px!important;
    color:#4c565e!important;
    -webkit-text-fill-color:#4c565e!important;
  }

  .po-mobile-become-intro .po-mobile-talk.captain .po-mobile-talk-avatar{
    grid-column:2!important;
    grid-row:1!important;
  }

  .po-mobile-become-intro .po-mobile-talk-bubble{
    padding:10px 12px!important;
    border:1px solid rgba(57,66,74,.22)!important;
    border-radius:9px!important;
    background:rgba(250,249,246,.96)!important;
    box-shadow:0 6px 18px rgba(0,0,0,.08)!important;
  }

  .po-mobile-become-intro .po-mobile-talk.captain .po-mobile-talk-bubble{
    grid-column:1!important;
    grid-row:1!important;
    border-color:#e0d3b7!important;
    background:#efe5cf!important;
  }

  .po-mobile-become-intro .po-mobile-talk-bubble p{
    margin:0!important;
    color:#162029!important;
    -webkit-text-fill-color:#162029!important;
    font-size:12px!important;
    font-weight:740!important;
    line-height:1.58!important;
  }

  /* Pull section heading closer to the intro so both fit in the first screen. */
  .po-mobile-become .po-mobile-kicker{
    margin-top:0!important;
  }

  .po-mobile-become .po-mobile-title{
    font-size:clamp(25px,7.8vw,33px)!important;
  }

  .po-mobile-become .po-mobile-copy{
    margin-top:12px!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-hero{
    min-height:67svh!important;
    padding-top:calc(18px + env(safe-area-inset-top, 0px))!important;
    padding-bottom:70px!important;
  }

  .po-mobile-become{
    margin-top:-40px!important;
    padding-top:30px!important;
  }

  .po-mobile-become-intro .po-mobile-talk-bubble{
    padding:9px 10px!important;
  }

  .po-mobile-become-intro .po-mobile-talk-bubble p{
    font-size:11.4px!important;
    line-height:1.5!important;
  }
}


/* =========================================================
V238 / v4.29 — RESTORE MOBILE AIRCRAFT HERO
v4.28 made .po-mobile-start transparent, which also removed the
aircraft background inherited from the older full-screen hero.
Put the aircraft directly on the upper HERO instead.
========================================================= */
@media(max-width:900px){

  /* The outer section can stay transparent because the actual image now
     belongs to the upper hero panel itself. */
  .po-mobile-start{
    background:transparent!important;
  }

  .po-mobile-hero{
    position:relative!important;
    min-height:70svh!important;
    padding:0 18px 78px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    isolation:isolate!important;

    background-color:#dcecf4!important;
    background-image:
      linear-gradient(
        180deg,
        rgba(245,248,249,.14) 0%,
        rgba(245,248,249,.08) 48%,
        rgba(243,241,235,.16) 68%,
        rgba(243,241,235,.96) 100%
      ),
      url('/wp-content/plugins/pilot-lms-core/assets/media/mobile-aircraft-hero-v195.webp')!important;
    background-repeat:no-repeat!important;
    background-size:cover!important;
    background-position:center 52%!important;
  }

  /* Keep the plane visually around the middle instead of pushing the
     background upward/downward with inherited positioning. */
  .po-mobile-hero::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    background:linear-gradient(
      180deg,
      rgba(255,255,255,.10) 0%,
      rgba(255,255,255,0) 35%,
      rgba(255,255,255,0) 62%,
      rgba(246,243,236,.24) 78%,
      rgba(246,243,236,.86) 100%
    )!important;
    pointer-events:none!important;
  }

  /* The v4.28 paper transition remains, but softer so it does not wash
     the aircraft out of the hero. */
  .po-mobile-hero::after{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    height:24%!important;
    z-index:1!important;
    background:linear-gradient(
      to bottom,
      rgba(246,243,236,0) 0%,
      rgba(246,243,236,.26) 30%,
      rgba(246,243,236,.70) 70%,
      rgba(246,243,236,1) 100%
    )!important;
    pointer-events:none!important;
  }

  /* Return the main message to the visual center of the upper hero. */
  .po-mobile-hero-content{
    position:absolute!important;
    z-index:2!important;
    top:47%!important;
    left:18px!important;
    right:18px!important;
    width:auto!important;
    max-width:540px!important;
    margin:0 auto!important;
    padding:0!important;
    transform:translateY(-50%)!important;
    text-align:center!important;
  }

  .po-mobile-hero-type{
    color:#14202a!important;
    -webkit-text-fill-color:#14202a!important;
    text-shadow:
      0 1px 2px rgba(255,255,255,.92),
      0 5px 20px rgba(255,255,255,.76)!important;
  }

  .po-mobile-hero-content>p{
    margin-top:12px!important;
    color:#26343d!important;
    -webkit-text-fill-color:#26343d!important;
    font-size:13.8px!important;
    font-weight:850!important;
    line-height:1.5!important;
    letter-spacing:.02em!important;
    text-shadow:
      0 1px 1px rgba(255,255,255,.95),
      0 4px 14px rgba(255,255,255,.82)!important;
  }

  .po-mobile-hero-scroll{
    z-index:3!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-hero{
    min-height:67svh!important;
    background-position:center 52%!important;
  }

  .po-mobile-hero-content{
    top:46%!important;
  }
}


/* =========================================================
V239 / v4.30 — REMOVE MOBILE HERO SCROLL ARROW
The next section is already visible in the first screen, so the
downward scroll cue is redundant.
========================================================= */
@media(max-width:900px){
  .po-mobile-hero-scroll,
  .po-mobile-hero-arrow-only{
    display:none!important;
  }
}


/* =========================================================
V240 / v4.31 — TRUE HERO-TO-PAPER GRADIENT
The aircraft image itself now fades gradually into the paper background.
No hard section edge, line, radius, or sudden jump to a flat color.
========================================================= */
@media(max-width:900px){

  /* Paper is the actual base layer. The aircraft is drawn separately
     and fades out into this exact same paper color. */
  .po-mobile-hero{
    background:var(--po-paper)!important;
    isolation:isolate!important;
  }

  /* Aircraft image layer with a long alpha fade toward the bottom. */
  .po-mobile-hero::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    pointer-events:none!important;

    background-image:
      linear-gradient(
        180deg,
        rgba(245,248,249,.12) 0%,
        rgba(245,248,249,.04) 48%,
        rgba(243,241,235,.05) 64%,
        rgba(243,241,235,.16) 78%,
        rgba(243,241,235,.34) 100%
      ),
      url('/wp-content/plugins/pilot-lms-core/assets/media/mobile-aircraft-hero-v195.webp')!important;
    background-repeat:no-repeat!important;
    background-size:cover!important;
    background-position:center 52%!important;

    -webkit-mask-image:linear-gradient(
      to bottom,
      #000 0%,
      #000 54%,
      rgba(0,0,0,.96) 62%,
      rgba(0,0,0,.82) 70%,
      rgba(0,0,0,.58) 79%,
      rgba(0,0,0,.32) 88%,
      rgba(0,0,0,.12) 95%,
      transparent 100%
    )!important;
    mask-image:linear-gradient(
      to bottom,
      #000 0%,
      #000 54%,
      rgba(0,0,0,.96) 62%,
      rgba(0,0,0,.82) 70%,
      rgba(0,0,0,.58) 79%,
      rgba(0,0,0,.32) 88%,
      rgba(0,0,0,.12) 95%,
      transparent 100%
    )!important;
  }

  /* Old opaque fade overlay is no longer needed. */
  .po-mobile-hero::after{
    display:none!important;
    content:none!important;
  }

  /* No artificial visual boundary between HERO and ROUTES. */
  .po-mobile-become{
    margin-top:-28px!important;
    padding-top:30px!important;
    background:var(--po-paper)!important;
    border-top:0!important;
    border-top-left-radius:0!important;
    border-top-right-radius:0!important;
    box-shadow:none!important;
  }

  .po-mobile-start + .po-mobile-become,
  .po-mobile-section + .po-mobile-section.po-mobile-become{
    border-top:0!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-become{
    margin-top:-24px!important;
    padding-top:28px!important;
  }
}


/* =========================================================
V241 / v4.32 — DEEPER CONTINUOUS HERO FADE
The image fade needs to continue farther down instead of feeling like a sudden
switch to a flat color. Extend the fade deeper — roughly to the speech-bubble zone.
Also soften the first part of the lower section so the two surfaces visually merge.
========================================================= */
@media(max-width:900px){

  /* Keep the hero itself slightly taller so the image can fade longer. */
  .po-mobile-hero{
    min-height:74svh!important;
  }

  /* Let the aircraft image remain visible farther down, then fade gradually. */
  .po-mobile-hero::before{
    background-image:
      linear-gradient(
        180deg,
        rgba(245,248,249,.10) 0%,
        rgba(245,248,249,.04) 42%,
        rgba(243,241,235,.03) 58%,
        rgba(243,241,235,.08) 72%,
        rgba(243,241,235,.18) 84%,
        rgba(243,241,235,.30) 100%
      ),
      url('/wp-content/plugins/pilot-lms-core/assets/media/mobile-aircraft-hero-v195.webp')!important;
    background-repeat:no-repeat!important;
    background-size:cover!important;
    background-position:center 52%!important;

    -webkit-mask-image:linear-gradient(
      to bottom,
      #000 0%,
      #000 56%,
      rgba(0,0,0,.985) 62%,
      rgba(0,0,0,.94) 68%,
      rgba(0,0,0,.82) 74%,
      rgba(0,0,0,.66) 80%,
      rgba(0,0,0,.48) 86%,
      rgba(0,0,0,.30) 91%,
      rgba(0,0,0,.16) 95%,
      rgba(0,0,0,.08) 97%,
      transparent 100%
    )!important;
    mask-image:linear-gradient(
      to bottom,
      #000 0%,
      #000 56%,
      rgba(0,0,0,.985) 62%,
      rgba(0,0,0,.94) 68%,
      rgba(0,0,0,.82) 74%,
      rgba(0,0,0,.66) 80%,
      rgba(0,0,0,.48) 86%,
      rgba(0,0,0,.30) 91%,
      rgba(0,0,0,.16) 95%,
      rgba(0,0,0,.08) 97%,
      transparent 100%
    )!important;
  }

  /* Pull the lower section up farther so the blend happens around the intro area,
     not at a visible boundary. */
  .po-mobile-become{
    margin-top:-44px!important;
    padding-top:38px!important;
    position:relative!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  /* Instead of a hard section color, give the beginning of the lower section its own
     top-to-bottom paper gradient so it keeps blending under the fading aircraft. */
  .po-mobile-become::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    pointer-events:none!important;
    background:linear-gradient(
      to bottom,
      rgba(243,241,235,.28) 0%,
      rgba(243,241,235,.58) 14%,
      rgba(243,241,235,.84) 28%,
      rgba(243,241,235,.96) 42%,
      var(--po-paper) 64%,
      var(--po-paper) 100%
    )!important;
  }

  .po-mobile-become .po-mobile-inner{
    position:relative!important;
    z-index:1!important;
  }

  /* Keep the central message truly centered within the visual hero. */
  .po-mobile-hero-content{
    top:46.5%!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-hero{
    min-height:71svh!important;
  }

  .po-mobile-become{
    margin-top:-38px!important;
    padding-top:34px!important;
  }

  .po-mobile-hero-content{
    top:45.5%!important;
  }
}


/* =========================================================
V242 / v4.34 — MOBILE TOP LONG-FORM GUIDED FLOW
From ROUTES downward:
- denser smartphone-first editorial flow
- one-line section titles
- compact dialogue transitions with minimal vertical dead space
- compact route selector
- direct course cards
- detail window no longer depends on the removed mobile site header
========================================================= */
@media(max-width:900px){

  /* -----------------------------------------
     1. One continuous paper flow
  ----------------------------------------- */
  #po-mobile-flow{
    background:var(--po-paper)!important;
  }

  #po-mobile-flow > .po-mobile-flow-section,
  #po-mobile-flow > .po-mobile-story-dialogue{
    border:0!important;
    box-shadow:none!important;
  }

  #po-mobile-flow > .po-mobile-flow-section{
    padding:26px 16px!important;
    background:var(--po-paper)!important;
    color:var(--po-ink)!important;
  }

  #po-mobile-flow > .po-mobile-flow-section + .po-mobile-flow-section{
    padding-top:20px!important;
  }

  /* Keep the first ROUTES section blended into the image fade. */
  #po-mobile-flow > .po-mobile-become{
    padding-top:36px!important;
    padding-bottom:24px!important;
  }

  #po-mobile-flow > .po-mobile-become::before{
    /* Continue the v4.32 paper blend, then become fully paper. */
    background:linear-gradient(
      to bottom,
      rgba(243,241,235,.18) 0%,
      rgba(243,241,235,.45) 12%,
      rgba(243,241,235,.72) 26%,
      rgba(243,241,235,.90) 42%,
      var(--po-paper) 64%,
      var(--po-paper) 100%
    )!important;
  }

  /* -----------------------------------------
     2. Dense headings: one-line by default
  ----------------------------------------- */
  #po-mobile-flow .po-mobile-flow-section .po-mobile-kicker{
    margin:0 0 5px!important;
    font-size:7.5px!important;
    line-height:1.2!important;
    letter-spacing:.14em!important;
  }

  #po-mobile-flow .po-mobile-flow-section .po-mobile-title{
    max-width:none!important;
    margin:0!important;
    color:var(--po-ink)!important;
    -webkit-text-fill-color:var(--po-ink)!important;
    font-size:clamp(20px,6vw,25px)!important;
    font-weight:950!important;
    line-height:1.08!important;
    letter-spacing:-.055em!important;
    white-space:nowrap!important;
    overflow:visible!important;
    overflow-wrap:normal!important;
    word-break:keep-all!important;
  }

  #po-mobile-flow .po-mobile-flow-section .po-mobile-copy{
    margin:8px 0 0!important;
    color:#625d55!important;
    -webkit-text-fill-color:#625d55!important;
    font-size:11.5px!important;
    line-height:1.55!important;
  }

  /* -----------------------------------------
     3. Conversation = connective tissue
     No giant standalone whitespace.
  ----------------------------------------- */
  #po-mobile-flow .po-mobile-flow-dialogue{
    padding:8px 16px!important;
    background:var(--po-paper)!important;
    color:var(--po-ink)!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-inner{
    max-width:640px!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-conversation,
  #po-mobile-flow .po-mobile-dialogue-compact .po-mobile-conversation{
    display:grid!important;
    gap:7px!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-talk,
  #po-mobile-flow .po-mobile-dialogue-compact .po-mobile-talk{
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:7px!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-talk.captain,
  #po-mobile-flow .po-mobile-dialogue-compact .po-mobile-talk.captain{
    grid-template-columns:minmax(0,1fr) 42px!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-talk-avatar,
  #po-mobile-flow .po-mobile-dialogue-compact .po-mobile-talk-avatar{
    width:42px!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-talk-avatar img,
  #po-mobile-flow .po-mobile-dialogue-compact .po-mobile-talk-avatar img{
    width:36px!important;
    height:36px!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-talk-avatar small,
  #po-mobile-flow .po-mobile-dialogue-compact .po-mobile-talk-avatar small{
    width:42px!important;
    margin-top:3px!important;
    font-size:7px!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-talk-bubble,
  #po-mobile-flow .po-mobile-dialogue-compact .po-mobile-talk-bubble{
    padding:8px 10px!important;
    border-radius:8px!important;
    border:1px solid #d7d1c7!important;
    background:#ebe8e1!important;
    box-shadow:none!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-talk.captain .po-mobile-talk-bubble,
  #po-mobile-flow .po-mobile-dialogue-compact .po-mobile-talk.captain .po-mobile-talk-bubble{
    background:#efe5cf!important;
    border-color:#dfd2b5!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue .po-mobile-talk-bubble p,
  #po-mobile-flow .po-mobile-dialogue-compact .po-mobile-talk-bubble p{
    margin:0!important;
    color:var(--po-ink)!important;
    -webkit-text-fill-color:var(--po-ink)!important;
    font-size:11.3px!important;
    font-weight:650!important;
    line-height:1.48!important;
  }

  #po-mobile-flow .po-mobile-become-intro{
    margin:0 0 18px!important;
  }

  /* -----------------------------------------
     4. Route selector: compact mobile rows
  ----------------------------------------- */
  .po-mobile-route-list{
    display:grid!important;
    gap:0!important;
    margin-top:14px!important;
    border-top:1px solid #d8d2c8!important;
  }

  .po-mobile-route-row{
    display:grid!important;
    grid-template-columns:31px minmax(0,1fr) 22px!important;
    gap:9px!important;
    align-items:center!important;
    min-height:62px!important;
    padding:8px 2px!important;
    border:0!important;
    border-bottom:1px solid #d8d2c8!important;
    background:transparent!important;
    color:var(--po-ink)!important;
    text-decoration:none!important;
  }

  .po-mobile-route-index{
    display:grid!important;
    place-items:center!important;
    width:28px!important;
    height:28px!important;
    border:1px solid #cbbd9f!important;
    border-radius:50%!important;
    color:#8d6b31!important;
    font-size:8px!important;
    font-weight:950!important;
  }

  .po-mobile-route-row>div{
    min-width:0!important;
  }

  .po-mobile-route-row small{
    display:block!important;
    margin:0 0 2px!important;
    color:#9a7838!important;
    font-size:6.5px!important;
    font-weight:950!important;
    letter-spacing:.09em!important;
    white-space:nowrap!important;
  }

  .po-mobile-route-row strong{
    display:inline!important;
    margin:0!important;
    color:var(--po-ink)!important;
    font-size:14px!important;
    font-weight:950!important;
    line-height:1.15!important;
  }

  .po-mobile-route-row em{
    display:block!important;
    margin-top:2px!important;
    color:#6d685f!important;
    font-size:9px!important;
    font-style:normal!important;
    line-height:1.35!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .po-mobile-route-row>b{
    color:#9b7938!important;
    font-size:16px!important;
    font-weight:700!important;
    text-align:right!important;
  }

  /* -----------------------------------------
     5. Medical cards: dense 2-column matrix
  ----------------------------------------- */
  .po-mobile-topic-grid-compact{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    margin-top:14px!important;
  }

  .po-mobile-topic-grid-compact>a{
    min-width:0!important;
    min-height:76px!important;
    padding:10px!important;
    border:1px solid #d8d2c8!important;
    background:#f9f7f2!important;
  }

  .po-mobile-topic-grid-compact small{
    font-size:6.5px!important;
  }

  .po-mobile-topic-grid-compact strong{
    display:block!important;
    margin:3px 0!important;
    font-size:12px!important;
    line-height:1.2!important;
  }

  .po-mobile-topic-grid-compact span{
    font-size:8.5px!important;
    line-height:1.3!important;
  }

  /* -----------------------------------------
     6. Learning roadmap: thin information rows
  ----------------------------------------- */
  .po-mobile-roadmap-compact{
    display:grid!important;
    gap:0!important;
    margin-top:13px!important;
    border-top:1px solid #d8d2c8!important;
  }

  .po-mobile-roadmap-compact>div{
    display:grid!important;
    grid-template-columns:26px 62px minmax(0,1fr)!important;
    gap:7px!important;
    align-items:center!important;
    min-height:43px!important;
    padding:6px 1px!important;
    border:0!important;
    border-bottom:1px solid #d8d2c8!important;
    background:transparent!important;
  }

  .po-mobile-roadmap-compact small{
    margin:0!important;
    color:#9a7838!important;
    font-size:7px!important;
    font-weight:950!important;
  }

  .po-mobile-roadmap-compact strong{
    margin:0!important;
    font-size:12px!important;
    line-height:1.2!important;
  }

  .po-mobile-roadmap-compact p{
    margin:0!important;
    color:#6a655d!important;
    font-size:9px!important;
    line-height:1.35!important;
  }

  /* -----------------------------------------
     7. Course introduction: direct open cards
  ----------------------------------------- */
  .po-mobile-course-library{
    background:#f0ece4!important;
  }

  .po-mobile-course-grid{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    margin-top:14px!important;
  }

  .po-mobile-course-grid>a{
    position:relative!important;
    min-width:0!important;
    min-height:94px!important;
    padding:11px 26px 10px 11px!important;
    border:1px solid #d2cabd!important;
    background:#fbfaf7!important;
    color:var(--po-ink)!important;
    text-decoration:none!important;
  }

  .po-mobile-course-grid small{
    display:block!important;
    color:#9a7838!important;
    font-size:7px!important;
    font-weight:950!important;
    letter-spacing:.09em!important;
  }

  .po-mobile-course-grid strong{
    display:block!important;
    margin:5px 0 3px!important;
    font-size:13px!important;
    line-height:1.18!important;
  }

  .po-mobile-course-grid span{
    display:block!important;
    color:#6b665e!important;
    font-size:8.5px!important;
    line-height:1.3!important;
  }

  .po-mobile-course-grid b{
    position:absolute!important;
    top:50%!important;
    right:9px!important;
    color:#9a7838!important;
    font-size:14px!important;
    transform:translateY(-50%)!important;
  }

  .po-mobile-mini-library{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    margin-top:7px!important;
  }

  .po-mobile-mini-library>a{
    display:grid!important;
    grid-template-columns:43px minmax(0,1fr) 14px!important;
    gap:6px!important;
    align-items:center!important;
    min-height:45px!important;
    padding:7px 8px!important;
    border:1px solid #d2cabd!important;
    background:#f7f4ed!important;
    color:var(--po-ink)!important;
    text-decoration:none!important;
  }

  .po-mobile-mini-library small{
    color:#9a7838!important;
    font-size:6.5px!important;
    font-weight:950!important;
  }

  .po-mobile-mini-library strong{
    font-size:10px!important;
    line-height:1.2!important;
  }

  .po-mobile-mini-library b{
    color:#9a7838!important;
    font-size:12px!important;
  }

  .po-mobile-search-hint-compact{
    margin-top:9px!important;
    padding:10px 11px!important;
    border:1px dashed #c7b998!important;
    background:rgba(255,255,255,.38)!important;
  }

  .po-mobile-search-hint-compact small{
    font-size:6.5px!important;
  }

  .po-mobile-search-hint-compact strong{
    display:block!important;
    margin:3px 0!important;
    font-size:10px!important;
  }

  .po-mobile-search-hint-compact p{
    margin:0!important;
    font-size:8.5px!important;
    line-height:1.35!important;
  }

  /* -----------------------------------------
     8. Career, news, safety, resources = compact
  ----------------------------------------- */
  .po-mobile-career-card-compact{
    min-height:255px!important;
    margin-top:13px!important;
  }

  .po-mobile-career-card-compact .po-mobile-career-content{
    padding:15px!important;
  }

  .po-mobile-career-card-compact .po-mobile-career-content h3{
    margin:5px 0 3px!important;
    font-size:22px!important;
    line-height:1.08!important;
  }

  .po-mobile-career-card-compact .po-mobile-career-content p{
    font-size:9px!important;
  }

  .po-mobile-simple-news-compact{
    margin-top:12px!important;
  }

  .po-mobile-simple-news-compact>a{
    min-height:58px!important;
    padding:9px 5px!important;
  }

  .po-mobile-simple-news-compact small{
    font-size:6.5px!important;
  }

  .po-mobile-simple-news-compact strong{
    margin-top:3px!important;
    font-size:11px!important;
    line-height:1.32!important;
  }

  .po-mobile-accident-list-compact,
  .po-mobile-resource-list-compact{
    margin-top:12px!important;
  }

  .po-mobile-accident-list-compact>div,
  .po-mobile-resource-list-compact>div{
    min-height:48px!important;
    padding:8px 10px!important;
  }

  .po-mobile-accident-list-compact small{
    font-size:6.5px!important;
  }

  .po-mobile-accident-list-compact strong,
  .po-mobile-resource-list-compact strong{
    font-size:11px!important;
  }

  .po-mobile-accident-list-compact span,
  .po-mobile-resource-list-compact span{
    font-size:8.5px!important;
  }

  .po-mobile-text-link{
    margin-top:11px!important;
    font-size:9px!important;
  }

  /* -----------------------------------------
     9. Mobile detail/window fix for headerless TOP
     Detail sheet has its own small utility bar.
  ----------------------------------------- */
  .po-mobile-detail-sheet{
    inset:0!important;
    z-index:2147480000!important;
    background:var(--po-paper)!important;
  }

  .po-mobile-detail-bar{
    position:sticky!important;
    top:0!important;
    z-index:5!important;
    display:grid!important;
    grid-template-columns:46px minmax(0,1fr) 46px!important;
    flex:0 0 48px!important;
    min-height:48px!important;
    border:0!important;
    border-bottom:1px solid rgba(255,255,255,.10)!important;
    background:#121920!important;
    box-shadow:0 4px 16px rgba(0,0,0,.12)!important;
  }

  .po-mobile-detail-bar strong{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:11px!important;
    font-weight:900!important;
    letter-spacing:.02em!important;
  }

  .po-mobile-detail-back,
  .po-mobile-detail-close{
    width:46px!important;
    height:48px!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:20px!important;
  }

  .po-mobile-detail-content{
    flex:1 1 auto!important;
    min-height:0!important;
    padding-top:0!important;
    background:var(--po-paper)!important;
  }

  /* No removed site header means no 50px artificial top offset. */
  body.po-mobile-detail-open{
    padding-top:0!important;
  }

  body.po-mobile-detail-open .po-top-mobile-menu-float,
  body.po-mobile-detail-open .po-lms-floating-site-menu{
    display:none!important;
  }
}

@media(max-width:380px){
  #po-mobile-flow .po-mobile-flow-section .po-mobile-title{
    font-size:19px!important;
  }

  #po-mobile-flow > .po-mobile-flow-section{
    padding-left:14px!important;
    padding-right:14px!important;
  }

  #po-mobile-flow .po-mobile-flow-dialogue{
    padding-left:14px!important;
    padding-right:14px!important;
  }

  .po-mobile-course-grid>a{
    min-height:88px!important;
    padding-left:9px!important;
  }
}


/* =========================================================
V243 / v4.35 — CROSS-SECTION HERO GRADIENT + CAREER GALLERY
1. The aircraft fade is drawn on the entire mobile flow, not inside
   the HERO box, so it can continue behind the first conversation.
2. Career Stories becomes a one-person gallery with left/right controls.
========================================================= */
@media(max-width:900px){

  /* -----------------------------------------
     TRUE CROSS-SECTION GRADIENT
     The old HERO pseudo-element was clipped at the HERO boundary.
     Draw the visual layer on the entire mobile flow instead.
  ----------------------------------------- */
  #po-mobile-flow{
    position:relative!important;
    isolation:isolate!important;
    background:var(--po-paper)!important;
  }

  #po-mobile-flow::before{
    content:""!important;
    position:absolute!important;
    z-index:0!important;
    top:0!important;
    left:0!important;
    width:100%!important;
    height:98svh!important;
    pointer-events:none!important;

    background-image:
      linear-gradient(
        180deg,
        rgba(245,248,249,.08) 0%,
        rgba(245,248,249,.02) 44%,
        rgba(243,241,235,.04) 61%,
        rgba(243,241,235,.12) 74%,
        rgba(243,241,235,.24) 85%,
        rgba(243,241,235,.38) 100%
      ),
      url('/wp-content/plugins/pilot-lms-core/assets/media/mobile-aircraft-hero-v195.webp')!important;
    background-repeat:no-repeat!important;
    background-size:cover!important;
    background-position:center 44%!important;

    -webkit-mask-image:linear-gradient(
      to bottom,
      #000 0%,
      #000 55%,
      rgba(0,0,0,.98) 63%,
      rgba(0,0,0,.90) 70%,
      rgba(0,0,0,.76) 77%,
      rgba(0,0,0,.58) 84%,
      rgba(0,0,0,.38) 90%,
      rgba(0,0,0,.20) 95%,
      rgba(0,0,0,.08) 98%,
      transparent 100%
    )!important;
    mask-image:linear-gradient(
      to bottom,
      #000 0%,
      #000 55%,
      rgba(0,0,0,.98) 63%,
      rgba(0,0,0,.90) 70%,
      rgba(0,0,0,.76) 77%,
      rgba(0,0,0,.58) 84%,
      rgba(0,0,0,.38) 90%,
      rgba(0,0,0,.20) 95%,
      rgba(0,0,0,.08) 98%,
      transparent 100%
    )!important;
  }

  #po-mobile-flow > *{
    position:relative!important;
    z-index:1!important;
  }

  /* Disable the older image/fade layers so there is only one transition. */
  .po-mobile-hero{
    background:transparent!important;
  }

  .po-mobile-hero::before,
  .po-mobile-hero::after{
    display:none!important;
    content:none!important;
  }

  /* HERO and the beginning of ROUTES stay transparent over the shared
     image layer. The fade therefore reaches the first speech bubbles. */
  #po-mobile-flow > .po-mobile-start,
  #po-mobile-flow > .po-mobile-become{
    background:transparent!important;
  }

  #po-mobile-flow > .po-mobile-become::before{
    display:none!important;
    content:none!important;
  }

  #po-mobile-flow > .po-mobile-become{
    margin-top:-44px!important;
  }

  /* A little more room under the first dialogue before the fully solid
     paper portions of ROUTES take over naturally. */
  #po-mobile-flow .po-mobile-become-intro{
    margin-bottom:22px!important;
  }

  /* -----------------------------------------
     CAREER STORIES — ONE PERSON / ONE SLIDE
  ----------------------------------------- */
  .po-mobile-career-gallery{
    position:relative!important;
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr) 34px!important;
    grid-template-rows:auto 18px!important;
    gap:7px!important;
    align-items:center!important;
    margin-top:14px!important;
  }

  .po-mobile-career-viewport{
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    overflow:hidden!important;
    touch-action:pan-y!important;
  }

  .po-mobile-career-track{
    display:flex!important;
    width:100%!important;
    transform:translate3d(0,0,0);
    transition:transform .30s cubic-bezier(.22,.61,.36,1)!important;
    will-change:transform!important;
  }

  .po-mobile-career-person{
    position:relative!important;
    display:grid!important;
    flex:0 0 100%!important;
    width:100%!important;
    min-width:100%!important;
    grid-template-columns:92px minmax(0,1fr)!important;
    min-height:124px!important;
    padding:0!important;
    overflow:hidden!important;
    border:1px solid #d6cfc2!important;
    border-radius:10px!important;
    background:#fbfaf7!important;
    color:var(--po-ink)!important;
    text-align:left!important;
    text-decoration:none!important;
    appearance:none!important;
  }

  button.po-mobile-career-person{
    cursor:pointer!important;
  }

  .po-mobile-career-person-visual{
    position:relative!important;
    min-height:124px!important;
    overflow:hidden!important;
    background:#d9d5cd!important;
  }

  .po-mobile-career-person-visual img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:124px!important;
    object-fit:cover!important;
  }

  .po-mobile-career-person-visual.is-placeholder{
    display:grid!important;
    place-items:end start!important;
    padding:9px!important;
    background:
      linear-gradient(145deg,#1b2731 0%,#2f3b43 58%,#d9c9a5 100%)!important;
  }

  .po-mobile-career-person-visual.is-placeholder span{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:7px!important;
    font-weight:950!important;
    line-height:1.25!important;
    letter-spacing:.06em!important;
  }

  .po-mobile-career-person-copy{
    display:flex!important;
    min-width:0!important;
    padding:12px 11px!important;
    flex-direction:column!important;
    justify-content:center!important;
  }

  .po-mobile-career-person-copy small{
    color:#9a7838!important;
    -webkit-text-fill-color:#9a7838!important;
    font-size:6.5px!important;
    font-weight:950!important;
    letter-spacing:.09em!important;
  }

  .po-mobile-career-person-copy strong{
    display:block!important;
    margin:4px 0!important;
    color:var(--po-ink)!important;
    -webkit-text-fill-color:var(--po-ink)!important;
    font-size:15px!important;
    font-weight:950!important;
    line-height:1.16!important;
  }

  .po-mobile-career-person-copy p{
    margin:0!important;
    color:#68635b!important;
    -webkit-text-fill-color:#68635b!important;
    font-size:9px!important;
    line-height:1.4!important;
  }

  .po-mobile-career-person-copy span{
    display:block!important;
    margin-top:8px!important;
    color:#8d6b31!important;
    -webkit-text-fill-color:#8d6b31!important;
    font-size:7.5px!important;
    font-weight:900!important;
  }

  .po-mobile-career-nav{
    display:grid!important;
    place-items:center!important;
    width:32px!important;
    height:42px!important;
    padding:0!important;
    border:1px solid #d2cabd!important;
    border-radius:8px!important;
    background:#f6f2ea!important;
    color:#26313a!important;
    -webkit-text-fill-color:#26313a!important;
    font-size:16px!important;
    font-weight:800!important;
  }

  .po-mobile-career-nav.is-prev{
    grid-column:1!important;
    grid-row:1!important;
  }

  .po-mobile-career-nav.is-next{
    grid-column:3!important;
    grid-row:1!important;
  }

  .po-mobile-career-nav:disabled{
    opacity:.35!important;
  }

  .po-mobile-career-counter{
    grid-column:1 / -1!important;
    grid-row:2!important;
    color:#827b70!important;
    font-size:7px!important;
    font-weight:900!important;
    letter-spacing:.12em!important;
    text-align:center!important;
  }

  /* Remove any old cockpit-style mobile career card remnants. */
  .po-mobile-career-card,
  .po-mobile-career-card-compact{
    display:none!important;
  }
}

@media(max-width:380px), (max-height:700px){
  #po-mobile-flow::before{
    height:96svh!important;
    background-position:center 43%!important;
  }

  .po-mobile-career-gallery{
    grid-template-columns:30px minmax(0,1fr) 30px!important;
    gap:5px!important;
  }

  .po-mobile-career-nav{
    width:29px!important;
    height:40px!important;
  }

  .po-mobile-career-person{
    grid-template-columns:84px minmax(0,1fr)!important;
  }
}


/* =========================================================
V244 / v4.36 — MOBILE LANDING MESSAGE TRUE VIEWPORT CENTER
The upper HERO is intentionally shorter than 100svh so the next section
can peek into the first screen. Centering inside that HERO therefore makes
the headline look too high. Position it against the initial viewport instead.
========================================================= */
@media(max-width:900px){
  .po-mobile-hero-content{
    top:50svh!important;
    transform:translateY(-50%)!important;
  }
}

@media(max-width:380px), (max-height:700px){
  .po-mobile-hero-content{
    top:50svh!important;
  }
}


/* =========================================================
V246 / v4.38 — MOBILE MULTI-CATEGORY COURSE SWITCHER
Keep the current compact course-card design, but allow FAA / JCAB /
TCCA / JET / RADIO / ICAO to switch inside the same scroll section.
========================================================= */
@media(max-width:900px){

  .po-mobile-course-switcher{
    display:flex!important;
    width:calc(100% + 32px)!important;
    margin:14px -16px 0!important;
    padding:0 16px 7px!important;
    gap:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-x:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    scroll-snap-type:x proximity!important;
    border-bottom:1px solid #d4cdbf!important;
  }

  .po-mobile-course-switcher::-webkit-scrollbar{
    display:none!important;
  }

  .po-mobile-course-switcher button{
    position:relative!important;
    flex:0 0 auto!important;
    min-width:auto!important;
    height:34px!important;
    padding:0 13px!important;
    border:0!important;
    border-right:1px solid #d7d0c3!important;
    border-radius:0!important;
    background:transparent!important;
    color:#716c63!important;
    -webkit-text-fill-color:#716c63!important;
    font-size:8.5px!important;
    font-weight:950!important;
    line-height:34px!important;
    letter-spacing:.06em!important;
    scroll-snap-align:center!important;
  }

  .po-mobile-course-switcher button:first-child{
    border-left:1px solid #d7d0c3!important;
  }

  .po-mobile-course-switcher button::after{
    content:""!important;
    position:absolute!important;
    left:10px!important;
    right:10px!important;
    bottom:-8px!important;
    height:2px!important;
    background:transparent!important;
  }

  .po-mobile-course-switcher button.is-active{
    color:#172129!important;
    -webkit-text-fill-color:#172129!important;
    background:#f8f5ef!important;
  }

  .po-mobile-course-switcher button.is-active::after{
    background:#b68a43!important;
  }

  .po-mobile-course-panels{
    margin-top:0!important;
  }

  .po-mobile-course-panel{
    display:none!important;
  }

  .po-mobile-course-panel.is-active{
    display:block!important;
    animation:poMobileCoursePanelIn .18s ease-out!important;
  }

  @keyframes poMobileCoursePanelIn{
    from{opacity:.30;transform:translateY(3px)}
    to{opacity:1;transform:none}
  }

  .po-mobile-course-panel-head{
    display:flex!important;
    min-height:31px!important;
    margin:0!important;
    padding:8px 1px 5px!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    border-bottom:1px solid rgba(150,140,124,.20)!important;
  }

  .po-mobile-course-panel-head small{
    color:#9a7838!important;
    -webkit-text-fill-color:#9a7838!important;
    font-size:6.5px!important;
    font-weight:950!important;
    letter-spacing:.11em!important;
    white-space:nowrap!important;
  }

  .po-mobile-course-panel-head span{
    min-width:0!important;
    color:#777168!important;
    -webkit-text-fill-color:#777168!important;
    font-size:7.5px!important;
    font-weight:800!important;
    line-height:1.2!important;
    text-align:right!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .po-mobile-course-panel .po-mobile-course-grid{
    margin-top:7px!important;
  }

  /* Keep long labels from increasing card height. */
  .po-mobile-course-panel .po-mobile-course-grid strong{
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

@media(max-width:380px){
  .po-mobile-course-switcher{
    width:calc(100% + 28px)!important;
    margin-left:-14px!important;
    margin-right:-14px!important;
    padding-left:14px!important;
    padding-right:14px!important;
  }

  .po-mobile-course-switcher button{
    padding-left:11px!important;
    padding-right:11px!important;
  }
}


/* =========================================================
V250 / v4.44 — TOP DESKTOP MOBILE-DRAWER BASE HIDE
Root cause isolated from the user's working v3.8.1 build:
the old .po-explore-panel had a global hidden base state, while the newer
.po-lms-local-menu-panel only had styles inside max-width:900px.
On desktop it therefore fell into normal document flow at the bottom.

Important: this fixes ONLY that missing base state.
It does NOT copy v3.8.1 desktop frame/gutter sizing, so current desktop
width and all current smartphone design remain unchanged.
========================================================= */

/* Mobile drawer must never participate in desktop document flow. */
.po-lms-local-menu-panel{
  display:none;
}

/* Smartphone keeps the current v4.x drawer exactly as-is. */
@media(max-width:900px){
  .po-lms-local-menu-panel{
    display:block!important;
  }
}

/* Explicit desktop guard for cached CSS/order edge cases. */
@media(min-width:901px){
  #po-explore-panel.po-lms-local-menu-panel{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
    position:fixed!important;
    inset:0!important;
    width:0!important;
    height:0!important;
    overflow:hidden!important;
  }
}


/* =========================================================
V252 / v4.47 — MOBILE INTRO DIALOGUE TRANSPARENCY GRADIENT
The first conversation should visually belong to the aircraft fade:
upper bubbles remain translucent so the image is visible through them;
lower bubbles gradually become more solid as the background itself fades
into the paper section.
========================================================= */
@media(max-width:900px){

  /* Preserve strong readability while allowing the aircraft to show through. */
  #po-mobile-flow .po-mobile-become-intro .po-mobile-talk-bubble{
    border-color:rgba(205,198,187,.72)!important;
    box-shadow:0 4px 14px rgba(30,35,38,.08)!important;
    backdrop-filter:blur(4px)!important;
    -webkit-backdrop-filter:blur(4px)!important;
  }

  #po-mobile-flow .po-mobile-become-intro .po-mobile-talk-bubble p{
    color:#172129!important;
    -webkit-text-fill-color:#172129!important;
    text-shadow:0 1px 0 rgba(255,255,255,.42)!important;
  }

  /* 1st exchange: most transparent, image clearly visible behind it. */
  #po-mobile-flow .po-mobile-become-intro .po-mobile-talk:nth-child(1) .po-mobile-talk-bubble{
    background:rgba(235,232,225,.68)!important;
  }

  #po-mobile-flow .po-mobile-become-intro .po-mobile-talk:nth-child(2) .po-mobile-talk-bubble{
    background:rgba(239,229,207,.72)!important;
    border-color:rgba(214,198,163,.76)!important;
  }

  /* 2nd exchange: more solid as the page reaches the paper area. */
  #po-mobile-flow .po-mobile-become-intro .po-mobile-talk:nth-child(3) .po-mobile-talk-bubble{
    background:rgba(235,232,225,.86)!important;
  }

  #po-mobile-flow .po-mobile-become-intro .po-mobile-talk:nth-child(4) .po-mobile-talk-bubble{
    background:rgba(239,229,207,.92)!important;
    border-color:rgba(214,198,163,.90)!important;
  }
}

@media(max-width:380px){
  #po-mobile-flow .po-mobile-become-intro .po-mobile-talk-bubble{
    backdrop-filter:blur(3px)!important;
    -webkit-backdrop-filter:blur(3px)!important;
  }
}


/* =========================================================
V253 / v4.48 — MOBILE MAIN MENU HEADER: PILOT ONLINE + MY PAGE + CLOSE
Move MY PAGE into the top header row to remove one full menu row.
========================================================= */
@media(max-width:900px){

  .po-lms-local-menu-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto 34px!important;
    gap:7px!important;
    align-items:center!important;
    padding:0 10px 0 14px!important;
  }

  .po-lms-local-menu-brand{
    min-width:0!important;
    overflow:hidden!important;
    white-space:nowrap!important;
  }

  .po-lms-local-menu-head-mypage{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:inline-flex!important;
    min-width:0!important;
    height:34px!important;
    padding:0 9px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:8px!important;
    background:rgba(255,255,255,.045)!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    text-decoration:none!important;
    white-space:nowrap!important;
  }

  .po-lms-local-menu-head-mypage span{
    display:grid!important;
    place-items:center!important;
    width:15px!important;
    height:15px!important;
    color:#c9a25d!important;
    -webkit-text-fill-color:#c9a25d!important;
    font-size:11px!important;
    line-height:1!important;
  }

  .po-lms-local-menu-head-mypage strong{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:8.5px!important;
    font-weight:950!important;
    line-height:1!important;
    letter-spacing:.06em!important;
  }

  /* Old standalone row must never reserve space if cached markup survives. */
  .po-lms-local-menu-actions{
    display:none!important;
    height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;
  }

  .po-lms-local-menu-nav{
    padding-top:4px!important;
  }
}

@media(max-width:360px){
  .po-lms-local-menu-head{
    grid-template-columns:minmax(0,1fr) auto 32px!important;
    gap:5px!important;
    padding-left:11px!important;
    padding-right:8px!important;
  }

  .po-lms-local-menu-brand{
    font-size:14px!important;
    letter-spacing:.045em!important;
  }

  .po-lms-local-menu-brand::after{
    margin-left:6px!important;
  }

  .po-lms-local-menu-head-mypage{
    height:32px!important;
    padding:0 7px!important;
  }

  .po-lms-local-menu-head-mypage strong{
    font-size:8px!important;
  }
}


/* =========================================================
V254 / v4.49 — COURSE AVAILABILITY + REAL GUIDE URL SUPPORT
Planned courses stay explorable, but no longer look identical to live courses.
========================================================= */

/* Main/sidebar menu: compact status replaces the normal arrow. */
.po-global-course-submenu button.is-planned,
.po-global-catalog-group button.is-planned{
  opacity:.72;
}

.po-menu-course-status{
  min-width:31px!important;
  color:#9f8352!important;
  font-size:6px!important;
  font-weight:950!important;
  letter-spacing:.08em!important;
  text-align:right!important;
}

/* The cloned smartphone main menu inherits the same planned markup. */
@media(max-width:900px){
  .po-lms-local-menu-nav button.is-planned{
    opacity:.72!important;
  }

  .po-lms-local-menu-nav .po-menu-course-status{
    color:#c8a66c!important;
    -webkit-text-fill-color:#c8a66c!important;
    font-size:6px!important;
  }

  /* Course cards in the long-form smartphone TOP remain tappable:
     tapping still opens the plan/detail window, but status is explicit. */
  .po-mobile-course-grid>a.is-planned{
    background:#f4f1ea!important;
    border-style:dashed!important;
  }

  .po-mobile-course-grid>a.is-planned strong{
    opacity:.82!important;
  }

  .po-mobile-course-status{
    position:absolute!important;
    top:9px!important;
    right:8px!important;
    transform:none!important;
    color:#9a7838!important;
    -webkit-text-fill-color:#9a7838!important;
    font-size:6px!important;
    font-weight:950!important;
    letter-spacing:.08em!important;
  }
}


/* =========================================================
V255 / v4.50 — DESKTOP LEARNING WINDOW COURSE LINKS
All course panels now open the current inline course Window.
========================================================= */
.po-guided-third-stage .po-course-link.is-planned{
  opacity:.64!important;
}

.po-guided-third-stage .po-course-link.is-planned em{
  float:right!important;
  color:#9d7b42!important;
  font-size:7px!important;
  font-style:normal!important;
  font-weight:950!important;
  letter-spacing:.08em!important;
}
