/* Shared visual rhythm: generous hero space and display-scale content titles. */
:root{--display-title:clamp(3.6rem,4.8vw,6rem);--content-title:clamp(2rem,2.45vw,2.9rem)}

/* Home: the background image has room to breathe above and below the title. */
.hero{min-height:clamp(50rem,88svh,70rem);padding:clamp(9.5rem,15vw,16rem) clamp(1.5rem,9vw,9.4rem);background-position:center 45%}
.hero-copy{max-width:min(53rem,72vw)}
.hero h1{max-width:100%;font-size:var(--display-title);line-height:1.16;text-wrap:balance}
.hero-text{max-width:42rem;margin:clamp(1.7rem,3vw,2.8rem) 0 clamp(2.2rem,4vw,3.8rem);font-size:clamp(1.15rem,1.55vw,1.55rem);line-height:1.8}
.hero-actions{gap:clamp(.75rem,1.2vw,1.15rem)}
.hero-meta{margin-top:clamp(2rem,4vw,3.7rem)}
/* Floating Tibetan characters are a deliberate part of the hero artwork. */
@keyframes tibetan-letter-drift{0%{opacity:.28;transform:translate3d(-7px,5px,0) rotate(-5deg) scale(2)}40%{opacity:.72;transform:scale(2)}72%{opacity:.42;transform:translate3d(15px,-10px,0) rotate(4deg) scale(2)}100%{opacity:.58;transform:translate3d(-3px,16px,0) rotate(-2deg) scale(2)}}

/* Editorial labels remain legible without competing with the hero headline. */
.hero .eyebrow{font-size:clamp(2.8rem,3vw,4.5rem)}
.library-note{font-size:clamp(1.8rem,2.1vw,3.2rem);line-height:1.5}
.library-note .ornament{font-size:clamp(2.6rem,3vw,4.5rem)}

/* Only the three marked supporting captions are enlarged for readability. */
.hero-text{font-size:clamp(1.84rem,2.48vw,2.48rem)}
.today-card .card-top{font-size:clamp(1.7rem,1.75vw,2.72rem)}
.today-card p{font-size:clamp(1.44rem,1.53vw,2.3rem)}
.today-card small{font-size:clamp(1.7rem,1.75vw,2.72rem)}
.today-card .sun{font-size:clamp(2rem,2.2vw,3.52rem)}
.journey-heading>p:last-child{font-size:clamp(1.25rem,1.07vw,1.6rem);line-height:1.6}

/* The marked brand text is enlarged without changing the rest of the header. */
.brand{font-size:clamp(3rem,3.35vw,4rem)}

/* Home page titles and text buttons use a restrained display scale. */
.hero h1{font-size:clamp(3.6rem,4vw,6rem);line-height:1.18}
.journey-heading h2{font-size:clamp(2.6rem,4.03vw,6.63rem);line-height:1.3}
.section-heading h2{font-size:clamp(2.6rem,2.71vw,4.42rem);line-height:1.32}
.ai-card strong{font-size:clamp(1.44rem,1.55vw,2.35rem);line-height:1.38}
.path-list h3{font-size:clamp(1.625rem,1.73vw,2.6rem);line-height:1.38}
.published-card h4{font-size:clamp(1.44rem,1.55vw,2.35rem);line-height:1.38}
.button,.text-link,.content-detail-button,.admin-entry,.account-logout,.header-logout{font-size:clamp(1.125rem,.9vw,1.25rem);line-height:1.4}
.button{min-height:clamp(3.25rem,3vw,3.5rem);padding:clamp(.55rem,.7vw,.75rem) clamp(1rem,1.1vw,1.35rem)}

/* Centre the illustrated pathways and make their copy comfortably readable. */
.journey-card{min-height:clamp(37rem,42vw,48rem);align-items:center;padding:clamp(2.5rem,3.2vw,4.25rem);text-align:center}
.journey-number{align-self:center;font-size:clamp(2rem,2.5vw,3.4rem)}
.journey-symbol{margin:clamp(2.4rem,4vw,5rem) 0 clamp(3rem,5vw,6rem)}
.journey-card div{margin:0;padding:0;display:grid;justify-items:center;gap:clamp(1.1rem,1.8vw,2.1rem)}
.journey-card h3{margin:0;font-size:clamp(2.5rem,2.4vw,3.5rem);line-height:1.34}
.journey-card p{font-size:clamp(1.55rem,1.85vw,2.7rem);line-height:1.65}
.journey-card small{margin-top:0;font-size:clamp(1.35rem,1.55vw,2.25rem);line-height:1.68}
.journey-card b{right:50%;bottom:clamp(1.8rem,2.5vw,3rem);transform:translateX(50%)}
.journey-card:hover b{transform:translate(50%,-3px)}

/* Resource cards use the same centred visual rhythm and a little more height. */
.library .resource{min-height:clamp(18rem,20vw,25rem);grid-template-columns:1fr;justify-items:center;align-items:center;padding:clamp(2rem,2.7vw,3.4rem);text-align:center}
.library .resource>*{justify-self:center}
.library .resource>span:nth-child(2){width:fit-content}
.library .resource>span:nth-child(2){align-self:center;display:grid;justify-items:center;gap:clamp(.7rem,1vw,1.2rem)}
.library .resource-icon{width:clamp(4rem,4.5vw,5.75rem);height:clamp(4rem,4.5vw,5.75rem);font-size:clamp(1.8rem,2vw,2.65rem)}
.library .resource strong{margin:0;font-size:clamp(2.5rem,2.4vw,3.5rem);line-height:1.35}
.library .resource small{min-height:0;font-size:clamp(1.55rem,1.65vw,2.45rem);line-height:1.5}
.library .resource>b{justify-self:center;width:clamp(3rem,3.4vw,4.25rem);height:clamp(3rem,3.4vw,4.25rem);font-size:clamp(1.65rem,1.8vw,2.3rem)}

/* Final home card-title scale, placed after the card base rules. */
.journey-card{min-height:clamp(45rem,52vw,62rem)}
.journey-card h3{font-size:clamp(2.5rem,2.4vw,3.5rem);line-height:1.32}
.library .resource{min-height:clamp(24rem,27vw,33rem)}
.library .resource strong{font-size:clamp(2.5rem,2.4vw,3.5rem);line-height:1.3}

/* Reading-settings panel: the marked controls use a high-legibility scale. */
.settings-dialog{width:min(96vw,1050px)}
.settings-form .settings-grid>label,.settings-form .settings-section-toggle,.settings-form .weekly-quote{font-size:clamp(1.55rem,1.72vw,2.15rem)}
.settings-form input:not([type="radio"]),.settings-form textarea{height:clamp(3.8rem,4.3vw,5.1rem);font-size:clamp(1.4rem,1.55vw,1.95rem)}
.settings-form textarea{height:auto;min-height:clamp(8rem,10vw,12rem)}
.settings-form .avatar-field span{height:clamp(3.8rem,4.3vw,5.1rem);font-size:clamp(1.4rem,1.55vw,1.95rem)}
.settings-form .font-options span{min-height:clamp(8.4rem,10vw,12rem);font-size:clamp(1.4rem,1.55vw,1.95rem)}
.settings-form .settings-section-toggle{min-height:clamp(4.5rem,5.2vw,6.1rem);padding:clamp(.8rem,1vw,1.2rem) clamp(1rem,1.4vw,1.6rem)}
.settings-form .section-title{min-height:clamp(2.4rem,2.7vw,3.2rem)}
.settings-form .toggle-icon{width:clamp(2.5rem,2.9vw,3.45rem);height:clamp(2.5rem,2.9vw,3.45rem);flex-basis:clamp(2.5rem,2.9vw,3.45rem)}
.settings-form .toggle-icon::before{border-top-width:clamp(.5rem,.55vw,.65rem);border-bottom-width:clamp(.5rem,.55vw,.65rem);border-left-width:clamp(.75rem,.85vw,1rem)}
.settings-form .settings-section-panel{padding:clamp(1rem,1.4vw,1.7rem)}
.settings-form .reading-controls label,.settings-form .control-label,.settings-form .reading-controls output{font-size:clamp(1.35rem,1.48vw,1.85rem)}
.settings-form .control-status{min-height:clamp(3rem,3.3vw,4rem)}
.settings-form .standard-reset{min-height:clamp(2.5rem,2.75vw,3.25rem);padding:clamp(.3rem,.45vw,.55rem) clamp(.6rem,.75vw,.9rem);font-size:clamp(1.05rem,1.15vw,1.4rem)}
.settings-form .font-size-control{padding:clamp(.8rem,1vw,1.2rem)}
.settings-form .range-with-buttons{grid-template-columns:clamp(3rem,3.4vw,4rem) 1fr clamp(3rem,3.4vw,4rem);gap:clamp(.5rem,.65vw,.8rem);margin-top:clamp(.8rem,1vw,1.2rem)}
.settings-form .range-with-buttons button{width:clamp(3rem,3.4vw,4rem);height:clamp(3rem,3.4vw,4rem);font-size:clamp(1.7rem,1.9vw,2.3rem)}
.settings-form .type-preview{min-height:clamp(8.5rem,10vw,12.5rem);padding:clamp(1rem,1.2vw,1.5rem);font-size:clamp(1.5rem,1.65vw,2.05rem)}
.settings-form .theme-controls .swatches label{min-height:clamp(4.6rem,5.2vw,6.2rem);padding:clamp(.6rem,.8vw,1rem);font-size:clamp(1.25rem,1.38vw,1.75rem)}
.settings-form .theme-controls .swatches label::before{width:clamp(2rem,2.25vw,2.7rem);height:clamp(2rem,2.25vw,2.7rem);flex-basis:clamp(2rem,2.25vw,2.7rem)}
.settings-form .submit{min-height:clamp(4.8rem,5.5vw,6.7rem);font-size:clamp(1.5rem,1.65vw,2.1rem)}

/* Category pages: separate the title from surrounding controls and promote work titles. */
.category-hero{min-height:clamp(23rem,40vw,36rem);align-items:center;padding:clamp(4.5rem,8vw,8.5rem) 0 clamp(3.5rem,6vw,6.5rem);background:radial-gradient(circle at 82% 18%,rgba(213,164,65,.16),transparent 28rem)}
.category-hero h1{max-width:min(100%,18ch);margin-bottom:clamp(1rem,2vw,1.8rem);font-size:clamp(3.9rem,5.4vw,6.4rem);line-height:1.12;text-wrap:balance}
.category-hero p{font-size:clamp(1rem,1.2vw,1.2rem)}
.category-tabs{padding:clamp(1.7rem,3vw,2.8rem) 0}
.content-copy{gap:clamp(.7rem,1vw,1.1rem);padding:clamp(1.35rem,1.8vw,2rem)}
.content-copy h2{font-size:var(--content-title);line-height:1.18;letter-spacing:-.015em;text-wrap:balance}
.content-copy p{font-size:clamp(1rem,1.15vw,1.2rem);line-height:1.7}
.content-meta{font-size:clamp(.78rem,.85vw,.94rem)}

/* Admin content names use the same readable scale without disturbing controls. */
.managed-content-item{padding:clamp(.9rem,1.3vw,1.35rem)}
.content-details h3{font-size:clamp(1.45rem,1.8vw,2.35rem);line-height:1.22}

@media(max-width:700px){
  .hero{min-height:clamp(50rem,112svh,62rem);padding:clamp(7rem,22vw,9.5rem) clamp(1.25rem,7vw,2.25rem);background-position:58% center}
  .hero-copy{max-width:100%}
  .hero h1{font-size:clamp(3.4rem,12vw,4.9rem)}
  .hero .eyebrow{font-size:clamp(2.1rem,8vw,3.25rem)}
  .hero h1{font-size:clamp(3.47rem,15.6vw,4.98rem)}
  .journey-heading h2,.section-heading h2{font-size:clamp(2.17rem,9.4vw,3.4rem)}
  .journey-card{min-height:clamp(43rem,165vw,55rem)}
  .journey-card h3{font-size:clamp(2.6rem,11.6vw,3.9rem)}
  .library .resource{min-height:clamp(23rem,104vw,30rem)}
  .library .resource strong{font-size:clamp(2.6rem,10.8vw,3.68rem)}
  .ai-card strong,.path-list h3,.published-card h4{font-size:clamp(1.44rem,5.8vw,2.1rem)}
  .button,.text-link,.content-detail-button,.admin-entry,.account-logout,.header-logout{font-size:clamp(1.12rem,4.77vw,1.59rem)}
  .button{min-height:clamp(3rem,12.3vw,3.98rem)}
  .hero-text{font-size:clamp(1.5rem,6.3vw,2rem)}
  .today-card .card-top,.today-card small{font-size:clamp(1.3rem,5.3vw,1.7rem)}
  .today-card p{font-size:clamp(1.4rem,5.8vw,1.8rem)}
  .journey-heading>p:last-child{font-size:clamp(1.2rem,5vw,1.6rem)}
  .brand{font-size:clamp(2rem,8vw,3rem)}
  .library-note{font-size:clamp(1.2rem,5vw,1.75rem)}
  .journey-card{min-height:clamp(33rem,130vw,42rem);padding:clamp(2rem,8vw,3rem)}
  .journey-symbol{margin:clamp(2rem,9vw,3rem) 0 clamp(2.2rem,10vw,3.5rem)}
  .journey-card h3{font-size:clamp(2rem,9vw,3rem)}
  .journey-card p{font-size:clamp(1.35rem,6vw,2rem)}
  .journey-card small{font-size:clamp(1.15rem,5.2vw,1.7rem)}
  .library .resource{min-height:clamp(17rem,78vw,23rem)}
  .library .resource strong{font-size:clamp(2rem,8vw,2.85rem)}
  .library .resource small{font-size:clamp(1.3rem,5.5vw,1.85rem)}
  .category-hero{min-height:auto;padding:clamp(3.5rem,15vw,5.5rem) 0 clamp(2.8rem,10vw,4.2rem)}
  .category-hero h1{font-size:clamp(3.3rem,12vw,5rem)}
  .content-copy h2{font-size:clamp(2rem,9.5vw,3.1rem)}
  .settings-dialog{width:min(96vw,760px)}
  .settings-form .settings-grid>label,.settings-form .settings-section-toggle,.settings-form .weekly-quote{font-size:clamp(1.25rem,5.2vw,1.7rem)}
  .settings-form input:not([type="radio"]),.settings-form textarea,.settings-form .avatar-field span{font-size:clamp(1.15rem,4.8vw,1.55rem)}
  .settings-form .font-options span{font-size:clamp(1.15rem,4.8vw,1.55rem)}
  .settings-form .reading-controls label,.settings-form .control-label,.settings-form .reading-controls output{font-size:clamp(1.15rem,4.8vw,1.55rem)}
  .settings-form .standard-reset{font-size:clamp(.95rem,4vw,1.25rem)}
  .settings-form .theme-controls .swatches label{font-size:clamp(1.1rem,4.6vw,1.45rem)}
  .settings-form .submit{font-size:clamp(1.25rem,5.2vw,1.7rem)}
}

@media(max-width:700px){
  .journey-card h3{font-size:clamp(2.6rem,11.6vw,3.9rem)}
  .library .resource strong{font-size:clamp(2.6rem,10.8vw,3.68rem)}
}

/* Home header only: give the navigation a calmer vertical rhythm and readable type. */
@media(min-width:1201px){
  .site-header{height:auto;min-height:clamp(8.5rem,9vw,10.5rem);padding-block:clamp(1.1rem,1.45vw,1.7rem)}
  .site-header .brand{flex:0 1 auto;font-size:clamp(3.8rem,4vw,4.8rem);line-height:1.15;white-space:nowrap}
  .site-header nav{gap:clamp(1.1rem,1.15vw,1.55rem);font-size:clamp(1.6rem,1.35vw,2rem);line-height:1.4;white-space:nowrap}
  .site-header nav a{white-space:nowrap}
  .site-header .appearance-label,.site-header .language-label{font-size:clamp(1.6rem,1.55vw,2.1rem)}
  .site-header .appearance-switcher select,.site-header .language-switcher select{height:clamp(4.2rem,4vw,5rem);min-width:clamp(8.6rem,7.5vw,10.5rem);border-radius:999px;font-size:clamp(1.55rem,1.45vw,1.95rem)}
  .site-header .profile{width:clamp(5rem,4.5vw,6rem);height:clamp(5rem,4.5vw,6rem);font-size:clamp(1.55rem,1.45vw,1.95rem)}
  .site-header .profile-monogram{width:clamp(4.2rem,3.7vw,5rem);min-height:clamp(3.3rem,3vw,4rem);font-size:clamp(1.55rem,1.45vw,1.95rem)}
  .site-header .profile-name{max-width:clamp(14rem,14vw,20rem);min-height:clamp(5rem,4.5vw,6rem);font-size:clamp(1.65rem,1.55vw,2.1rem)}
  .site-header .header-logout{min-height:clamp(4.2rem,4vw,5rem);padding-inline:clamp(1.2rem,1.3vw,1.8rem);font-size:clamp(1.55rem,1.45vw,1.95rem)}
}

@media(min-width:801px) and (max-width:1200px){
  .site-header{height:auto;min-height:clamp(7rem,10vw,8.5rem);padding-block:clamp(.75rem,1.2vw,1.1rem)}
  .site-header .brand{font-size:clamp(2.8rem,3.4vw,3.8rem);line-height:1.15}
  .site-header nav{gap:clamp(1.1rem,1.45vw,1.8rem);font-size:clamp(1.2rem,1.6vw,1.55rem);line-height:1.4}
  .site-header .appearance-label,.site-header .language-label{font-size:clamp(1.05rem,1.3vw,1.3rem)}
  .site-header .appearance-switcher select,.site-header .language-switcher select{height:clamp(2.8rem,3.2vw,3.35rem);font-size:clamp(1rem,1.15vw,1.2rem)}
}

@media(max-width:800px){
  .site-header{height:auto;min-height:clamp(6.75rem,18vw,8rem);padding-block:clamp(.7rem,2vw,1rem);flex-wrap:wrap;align-content:center}
  .site-header .brand{flex:0 0 auto;font-size:clamp(1.7rem,5.5vw,2.3rem);line-height:1.15;white-space:nowrap}
  .site-header .appearance-switcher select,.site-header .language-switcher select{height:clamp(2.6rem,8vw,3rem);font-size:clamp(.95rem,3.2vw,1.2rem)}
  .site-header .profile{width:clamp(2.9rem,9vw,3.5rem);height:clamp(2.9rem,9vw,3.5rem)}
  .site-header .profile-monogram{width:clamp(2.5rem,7.5vw,3.1rem);min-height:clamp(2.05rem,6.5vw,2.6rem);font-size:clamp(.95rem,3.1vw,1.15rem)}
}

/* Keep the public header within the viewport at every desktop width. */
@media(min-width:1201px){
  .site-header{gap:clamp(.75rem,1.2vw,1.5rem);padding-inline:clamp(1.5rem,3vw,4.25rem)}
  /* Tibetan stacks need their full glyph height and width; never ellipsize the site name. */
  .site-header .brand{flex:0 0 auto;font-size:clamp(2rem,2.25vw,3.1rem);max-width:none;overflow:visible;text-overflow:clip;white-space:nowrap}
  .site-header nav{min-width:0;gap:clamp(.65rem,.8vw,1.05rem);font-size:clamp(1rem,.92vw,1.35rem);overflow-x:auto;scrollbar-width:none}
  .site-header nav::-webkit-scrollbar{display:none}
  .site-header .header-actions{flex:0 0 auto;gap:clamp(.4rem,.55vw,.7rem)}
  .site-header .appearance-label,.site-header .language-label{font-size:clamp(.9rem,.88vw,1.15rem)}
  .site-header .appearance-switcher select,.site-header .language-switcher select{min-width:0;width:clamp(5.6rem,5.5vw,7.4rem);height:clamp(2.75rem,2.7vw,3.4rem);font-size:clamp(.88rem,.85vw,1.1rem)}
  .site-header .profile{width:clamp(3.3rem,3vw,4.4rem);height:clamp(3.3rem,3vw,4.4rem)}
  .site-header .profile-monogram{width:clamp(2.8rem,2.5vw,3.7rem);min-height:clamp(2.2rem,2vw,3rem);font-size:clamp(.95rem,.9vw,1.15rem)}
  .site-header .profile-name{max-width:clamp(5rem,6vw,8rem);min-height:clamp(3.3rem,3vw,4.4rem);font-size:clamp(.95rem,.9vw,1.15rem)}
  .site-header .header-logout{min-height:clamp(2.75rem,2.7vw,3.4rem);padding-inline:clamp(.75rem,.9vw,1rem);font-size:clamp(.9rem,.86vw,1.1rem)}
}

@media(max-width:700px){
  .site-header{justify-content:center;padding-inline:1rem}
  .site-header .brand{max-width:100%;font-size:clamp(1.65rem,7.2vw,2.15rem)}
  .site-header .header-actions{width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:center;gap:.45rem}
  .site-header .appearance-switcher,.site-header .language-switcher{min-width:0}
  .site-header .appearance-switcher select,.site-header .language-switcher select{width:100%;max-width:none}
  .site-header .profile-identity{justify-self:end;gap:.35rem}
  .site-header .profile-name,.site-header .header-logout{display:none}
  .site-header .profile{width:2.7rem;height:2.7rem}
}