/* Use the browser canvas instead of a centred phone-sized shell. */
.app{width:100%;max-width:none;margin:0;min-height:100vh;min-height:100dvh}
.bottom{left:0;transform:none;width:100%;justify-content:center;gap:8px}
.icon-rail{left:16px;top:132px;z-index:4}
@media(min-width:900px){
  header{padding-inline:clamp(28px,4vw,88px)}
  main{padding-inline:clamp(28px,4vw,88px)}
  #home{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);column-gap:40px;align-items:start}
  #home>.intro{grid-column:1;max-width:none;align-self:center}
  #home>.shortcut-grid{grid-column:2;align-self:center;margin:32px 0;grid-template-columns:repeat(2,minmax(0,1fr))}
  #home>:not(.intro):not(.shortcut-grid){grid-column:1/-1}
  .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lesson-grid,.learning-cards,.merch-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
  .bottom a{flex:0 1 180px}
  #lesson-article{max-width:none;margin:0}
  #lesson-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 36px}
  #lesson-sections .lesson-section{min-width:0;margin:20px 0}
  #lesson-sections p{max-width:78ch}
  .objectives ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
  .reference-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 48px;max-width:none;align-items:start}
  .reference-entry{min-width:0;margin:14px 0}
  .consultancy-packages{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
  .training-intro,.consultancy-intro,.technology-intro,.merch-intro,.references-intro{max-width:1000px}
  .platform-learning-links{grid-template-columns:repeat(2,minmax(0,1fr))}
  .platform-link-card{min-width:0}
}
@media(min-width:1190px){main{padding-left:100px}#home>.shortcut-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1600px){#home{column-gap:64px}.lesson-grid,.learning-cards,.merch-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}}
@media(orientation:landscape) and (max-height:600px){header{padding-block:10px}.bottom{padding-top:4px;padding-bottom:max(4px,env(safe-area-inset-bottom))}.bottom a{min-height:44px}.bottom a span{font-size:20px;line-height:24px}}
