/* Fluid layout: phone-first at 1080 x 2160 portrait, expanding naturally on desktop. */
:root{--page-gutter:clamp(1rem,4vw,4.5rem);--section-gap:clamp(1.25rem,4vw,3.5rem);--radius-fluid:clamp(.9rem,2vw,1.75rem)}
html{-webkit-text-size-adjust:100%}body{min-width:20rem;overflow-x:hidden}main{width:min(100%,96rem);padding:clamp(1.25rem,4vw,3rem) var(--page-gutter) clamp(5.5rem,8vw,7rem)}
.topbar{width:100%;height:auto;min-height:clamp(4.25rem,7vw,5.4rem);padding:.75rem var(--page-gutter);gap:clamp(.75rem,3vw,3rem)}
.topbar nav{min-width:0;overflow-x:auto;scrollbar-width:none}.topbar nav::-webkit-scrollbar{display:none}.nav-button{white-space:nowrap;min-height:2.75rem;padding:.65rem clamp(.7rem,1.2vw,1rem)}
.hero{min-height:min(42rem,70vh);padding:clamp(1.5rem,5vw,4rem);gap:clamp(1.5rem,6vw,6rem);border-radius:var(--radius-fluid)}.hero h1,.page-title h1{font-size:clamp(2.65rem,6vw,5.2rem)}.hero-copy{font-size:clamp(1rem,1.5vw,1.2rem)}
.coach-card{padding:clamp(1.25rem,3vw,2rem)}.coach-quote{font-size:clamp(1.45rem,2.3vw,2rem)}.metrics{grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr))}.today-grid{grid-template-columns:minmax(0,1.45fr) minmax(17rem,.7fr)}
.panel,.metric,.calendar-card,.checkin-card,.memory-composer,.child-note{border-radius:var(--radius-fluid)}.task-row{grid-template-columns:clamp(3rem,7vw,4rem) minmax(0,1fr) auto}.guidance-grid,.theme-studio{gap:clamp(1.25rem,4vw,3rem)}
.story-layout{grid-template-columns:minmax(17rem,23rem) minmax(0,1fr)}.moments-feed{column-width:min(100%,22rem);columns:auto}.moment-media{width:100%;height:auto;max-height:none;object-fit:contain}.comment-form input{font-size:1rem}.comment-form button,.heart-button,.status-button,.theme-choice{min-height:2.75rem}
.calendar{grid-template-columns:repeat(7,minmax(clamp(10rem,14vw,13rem),1fr));scroll-snap-type:x proximity}.day{min-width:0;scroll-snap-align:start}.emoji-picker{width:min(92vw,24rem);height:min(28rem,62vh)}.emoji-scroll{height:calc(100% - 3.6rem)}
@media(max-width:64rem){.today-grid,.guidance-grid,.story-layout,.theme-studio{grid-template-columns:1fr}.memory-composer{position:static}.moments-feed{columns:2}.calendar{grid-template-columns:repeat(7,minmax(15.5rem,1fr))}}
.emoji-picker{position:relative!important;inset:auto!important;transform:none!important;z-index:10001!important;width:min(92vw,32rem)!important;height:min(78vh,34rem)!important}.emoji-picker .emoji-scroll{height:calc(100% - 3.6rem)}
@media(max-width:42rem){
  :root{--page-gutter:clamp(.9rem,4vw,1.35rem)}
  body{padding-bottom:4.8rem}.topbar{position:sticky;display:grid;grid-template-columns:1fr auto;z-index:50}.brand{min-width:0}.brand-mark{width:2.65rem;height:2.65rem}.profile-switch{justify-self:end}.topbar nav{position:fixed;z-index:60;left:0;right:0;bottom:0;order:initial;width:100%;display:flex;justify-content:flex-start;gap:.25rem;padding:.45rem max(.5rem,env(safe-area-inset-right)) calc(.45rem + env(safe-area-inset-bottom)) max(.5rem,env(safe-area-inset-left));background:rgba(255,253,248,.97);border-top:1px solid var(--line);box-shadow:0 -10px 28px rgba(42,33,24,.1);backdrop-filter:blur(16px)}
  .nav-button{flex:1 0 auto;min-width:4.6rem;min-height:3.15rem;padding:.45rem .6rem;font-size:.72rem}.hero{min-height:auto;grid-template-columns:1fr;padding:clamp(1.4rem,6vw,2rem);overflow:visible}.hero:after{width:45vw;height:45vw;right:-25vw;top:-20vw}.hero-actions{display:grid;grid-template-columns:1fr}.hero-actions button{width:100%;min-height:3rem}.coach-card{transform:none;box-shadow:.45rem .55rem 0 #173f48}.section-heading,.panel-head{align-items:flex-start}.section-heading{margin:var(--section-gap) 0 1rem}.section-heading h2{font-size:clamp(1.8rem,8vw,2.4rem)}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.metric{padding:1rem}.metric strong{font-size:clamp(1.8rem,9vw,2.5rem)}.today-grid{grid-template-columns:1fr}.panel{padding:1.1rem}.task-row{grid-template-columns:3.25rem minmax(0,1fr);gap:.7rem}.task-row .child-chip{grid-column:2;justify-self:start}.page-title{margin:.5rem 0 1.5rem}.page-title h1{font-size:clamp(2.45rem,12vw,3.5rem)}.week-nav{width:100%;justify-content:space-between}.legend{gap:.65rem 1rem}
  .calendar{grid-template-columns:repeat(7,calc(100vw - 2 * var(--page-gutter)));gap:.75rem}.day{min-width:calc(100vw - 2 * var(--page-gutter))}.calendar-card{padding:1rem}.status-button{font-size:.72rem;padding:.55rem}.guidance-cards{grid-template-columns:1fr}.rule-board{padding:1.5rem;transform:none;box-shadow:.4rem .5rem 0 #b8863a}.phase-line{overflow-x:auto}.phase{min-width:9rem}.checkin-card{padding:1.25rem}.scale{gap:.35rem}.scale span{padding:.75rem .25rem}
  .child-growth.visible{grid-template-columns:minmax(0,1fr);width:100%;max-width:100%;padding:1.25rem;overflow:hidden}.child-growth.visible>div{min-width:0;max-width:100%}.game-hud{grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.game-hud>div{min-width:0;padding:.65rem;text-align:center}.game-hud span{overflow-wrap:anywhere}.game-hud strong{display:block;font-size:1.05rem;overflow-wrap:anywhere}.badge-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;max-width:100%;overflow:visible;scroll-snap-type:none}.badge-card{min-width:0;width:100%;scroll-snap-align:none}.growth-message{min-width:0;overflow-wrap:anywhere}.story-title{padding:1.5rem}.story-symbol{font-size:4.5rem}.moments-feed{columns:1}.moment-card{margin-bottom:1rem}.moment-body{padding:1rem}.comment-form{display:grid;grid-template-columns:auto minmax(0,1fr) auto}.emoji-picker{position:fixed;left:4vw;right:4vw;bottom:5.4rem;width:92vw;height:min(31rem,68dvh)}.emoji-scroll section>div{grid-template-columns:repeat(7,1fr)}.theme-controls article{width:100%}.theme-options{display:grid;grid-template-columns:repeat(3,1fr);width:100%}.theme-choice{width:100%;padding:.55rem .35rem}.memory-composer,.child-note{padding:1.25rem}
}
@media(max-width:24rem){.badge-strip{grid-template-columns:1fr}.game-hud{grid-template-columns:1fr}.game-hud>div{display:grid;grid-template-columns:1fr auto;align-items:center;text-align:left}}
@media(min-width:100rem){main{width:min(92%,110rem)}.calendar{grid-template-columns:repeat(7,1fr)}}
@media(orientation:landscape) and (max-height:40rem) and (pointer:coarse){.hero{min-height:auto;grid-template-columns:1.2fr .8fr}.topbar nav{padding-bottom:max(.35rem,env(safe-area-inset-bottom))}.calendar{grid-template-columns:repeat(7,42vw)}.day{min-width:42vw}}
