/* Family playground design system — subpages and AI surfaces */
:root {
  --park-ink:#292044;
  --park-muted:#726a7e;
  --park-cream:#fffaf0;
  --park-paper:#fffef9;
  --park-ground:#e3eca2;
  --park-yellow:#ffbd24;
  --park-orange:#f47b42;
  --park-coral:#f16342;
  --park-green:#82ad35;
  --park-blue:#66a9e8;
  --park-purple:#7357df;
  --park-line:#dfd5c5;
  --park-shadow:0 5px 0 rgba(93,76,53,.10),0 18px 42px rgba(92,73,49,.10);
  --park-font:'Xiaolai','Noto Sans SC','PingFang SC',sans-serif;
}

/* The centre of the home header is the primary product navigation. */
.map-home .home-nav { gap:clamp(1.25rem,2.1vw,2.45rem); }
.map-home .home-nav-link { white-space:nowrap; }
.map-home .topbar-brand,
.subpage-header .topbar-brand,
.map-home .topbar-titles,
.subpage-header .topbar-titles { min-width:0; }
.map-home .topbar-title,
.subpage-header .topbar-title,
.subpage-header .topbar-subtitle { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.site-nav-more { position:relative; display:none; height:72px; align-items:center; }
.site-nav-more-trigger {
  border:0;
  background:transparent;
  cursor:pointer;
}
.site-nav-more-trigger svg path { fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.site-nav-more-panel {
  position:absolute;
  z-index:130;
  top:62px;
  right:0;
  display:none;
  min-width:150px;
  padding:7px;
  border:1.5px solid #dfd5c5;
  border-radius:14px;
  background:#fffdf7;
  box-shadow:0 6px 0 rgba(91,70,43,.08),0 18px 36px rgba(69,52,31,.14);
}
.site-nav-more.is-open .site-nav-more-panel { display:grid; gap:3px; }
.site-nav-more-panel a {
  display:flex;
  min-height:42px;
  align-items:center;
  gap:10px;
  padding:0 11px;
  border-radius:10px;
  color:#3b3850;
  font-weight:800;
  text-decoration:none;
  white-space:nowrap;
}
.site-nav-more-panel a:hover,.site-nav-more-panel a.is-active { color:#302949; background:#fff1c9; }
.site-nav-more-panel svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }

.subpage-header .topbar-inner {
  display:grid !important;
  grid-template-columns:minmax(190px,1fr) auto minmax(190px,1fr) !important;
  align-items:center !important;
}
.subpage-header .shared-site-nav {
  display:flex;
  height:72px;
  align-items:center;
  justify-self:center;
  gap:clamp(1.25rem,2.1vw,2.45rem);
}
.subpage-header .shared-site-nav .home-nav-link { white-space:nowrap; }
.subpage-header .topbar-right { justify-self:end; }

@media (min-width:701px) {
  /* The shared nav already contains Home; keep the compact back control only
     on phones, where the centre navigation is intentionally hidden. */
  .subpage-header .topbar-right .subpage-back { display:none !important; }
}

@media (min-width:1101px) and (max-width:1300px) {
  .shared-site-nav .home-nav-link:nth-child(4) { display:inline-flex; }
  .shared-site-nav { gap:1.15rem !important; }
}

@media (min-width:701px) and (max-width:1100px) {
  .shared-site-nav > .home-nav-link:nth-child(n+3) { display:none; }
  .shared-site-nav .site-nav-more { display:flex; }
  .shared-site-nav .site-nav-more .site-nav-more-trigger { display:inline-flex; }
  .shared-site-nav .site-nav-more-panel a[data-nav-index='0'],
  .shared-site-nav .site-nav-more-panel a[data-nav-index='1'] { display:none; }
  .shared-site-nav { gap:.8rem !important; }
  .subpage-header .topbar-inner { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important; }
}

/* Compact tablet header for the narrow band just above the phone layout. */
@media (min-width:701px) and (max-width:850px) {
  .home-body.map-home .topbar-inner {
    grid-template-columns:minmax(140px,1fr) auto minmax(190px,1fr) !important;
    padding-inline:16px !important;
  }
  .home-body.map-home .topbar-logo { width:44px !important; height:44px !important; flex-basis:44px !important; border-radius:12px !important; }
  .home-body.map-home .topbar-logo .brand-house { width:31px !important; height:31px !important; }
  .home-body.map-home .topbar-brand { gap:.6rem !important; }
  .home-body.map-home .topbar-title { font-size:1.38rem !important; white-space:nowrap; }
  .home-body.map-home .shared-site-nav { gap:.65rem !important; }
  .home-body.map-home .home-nav-link { gap:.38rem; font-size:.92rem; }
  .home-body.map-home .home-nav-link svg { width:22px; height:22px; }
  .home-body.map-home .topbar-right { gap:.35rem !important; }
  .home-body.map-home .topbar-weather { min-width:36px !important; width:36px; }
  .home-body.map-home .topbar-weather-icon { width:32px; height:32px; font-size:1.5rem; }
  .home-body.map-home .topbar-weather-temp { display:none; }
  .home-body.map-home .topbar .topbar-clock { min-width:48px !important; font-size:.98rem !important; }
  .home-body.map-home .topbar .auth-actions .btn.btn-ghost,
  [data-theme='dark'] .home-body.map-home .topbar .auth-actions .btn.btn-ghost {
    min-width:96px !important;
    min-height:44px !important;
    padding:0 .7rem !important;
    font-size:.9rem !important;
  }
}

.subpage-body [hidden],
.home-body .ai-chat[hidden],
.home-body .ai-attachment-preview[hidden] { display:none !important; }

body.subpage-body,
[data-theme='dark'] body.subpage-body {
  min-height:100vh;
  color:var(--park-ink) !important;
  background:
    radial-gradient(circle at 8% 18%,rgba(255,255,255,.92) 0 42px,transparent 44px),
    radial-gradient(circle at 13% 18%,rgba(255,255,255,.75) 0 28px,transparent 30px),
    radial-gradient(circle at 91% 12%,rgba(255,190,38,.28) 0 90px,transparent 92px),
    linear-gradient(180deg,#fffaf0 0,#f9f3dc 55%,var(--park-ground) 100%) !important;
  background-attachment:fixed !important;
}

body.subpage-body::before {
  position:fixed;
  z-index:0;
  inset:auto 0 0;
  height:220px;
  opacity:.34;
  background:
    radial-gradient(ellipse at 5% 110%,#6fa535 0 32%,transparent 33%),
    radial-gradient(ellipse at 33% 118%,#a8c64d 0 38%,transparent 39%),
    radial-gradient(ellipse at 70% 120%,#8eb83d 0 40%,transparent 41%),
    radial-gradient(ellipse at 102% 110%,#4c9851 0 34%,transparent 35%) !important;
  pointer-events:none;
}

body.subpage-body::after {
  content:'✦';
  position:fixed;
  z-index:0;
  right:4vw;
  bottom:38px;
  color:rgba(255,255,255,.58);
  font-size:4rem;
  pointer-events:none;
}

.subpage-body > main,
.subpage-body > header { position:relative; z-index:1; }

.subpage-header,
.ai-page-body .subpage-header,
[data-theme='dark'] .subpage-header {
  position:sticky !important;
  z-index:100 !important;
  top:0;
  isolation:isolate;
  min-height:72px !important;
  border:0 !important;
  background:#fffdf5 !important;
  box-shadow:0 3px 16px rgba(80,65,38,.08) !important;
  backdrop-filter:blur(16px) saturate(1.15);
}

.subpage-header .topbar-inner {
  width:100% !important;
  max-width:none !important;
  min-height:72px !important;
  margin:auto;
  padding:0 28px !important;
}

.subpage-header .topbar-brand { gap:12px !important; }
.subpage-header .subpage-home-mark,
.bakery-body .subpage-header .subpage-home-mark {
  display:grid !important;
  width:52px !important;
  height:52px !important;
  flex:0 0 52px !important;
  place-items:center;
  border:0 !important;
  border-radius:14px !important;
  color:#fff !important;
  background:linear-gradient(145deg,#ffd45b,#f7b52a) !important;
  box-shadow:0 3px 8px rgba(192,132,25,.16) !important;
}
.subpage-header .subpage-home-mark .brand-house { width:36px !important; height:36px !important; }
.subpage-header .topbar-title {
  color:var(--park-ink) !important;
  font-family:var(--park-font) !important;
  font-size:1.42rem !important;
  font-weight:400 !important;
  line-height:1.12 !important;
  letter-spacing:0 !important;
}
.subpage-header .topbar-subtitle {
  display:block !important;
  margin-top:3px !important;
  color:var(--park-muted) !important;
  font-size:.72rem !important;
  font-weight:600 !important;
}
.subpage-header .subpage-back::before { content:'←'; margin-right:5px; font-size:1.05rem; }
.subpage-header .subpage-back,
.subpage-header .btn {
  min-height:40px !important;
  border:1.5px solid #dfd4c1 !important;
  border-radius:12px !important;
  color:#514467 !important;
  background:#fffdf7 !important;
  box-shadow:0 3px 0 rgba(99,78,47,.09) !important;
}
.subpage-header .btn-primary {
  color:#fff !important;
  border-color:#5d45bd !important;
  background:linear-gradient(145deg,#8266ec,#6649d2) !important;
  box-shadow:0 3px 0 #49319f !important;
}

.subpage-body:not(.ai-page-body) > main.container {
  width:min(100% - 40px,1180px) !important;
  margin:0 auto !important;
  padding:52px 0 96px !important;
}

.menu-hero,.messages-hero,.bakery-hero,.account-hero {
  min-height:124px;
  margin:0 0 28px !important;
  padding:22px 112px 22px 28px !important;
  border:1.5px solid rgba(193,153,89,.36);
  border-radius:20px;
  background:rgba(255,253,245,.78);
  box-shadow:0 4px 0 rgba(121,91,43,.07);
}
.menu-hero::after,.messages-hero::after,.bakery-hero::after,.account-hero::after {
  top:50% !important;
  right:28px !important;
  width:64px !important;
  height:64px !important;
  border:2px solid rgba(255,255,255,.85) !important;
  border-radius:18px !important;
  box-shadow:0 4px 0 rgba(95,73,40,.12) !important;
  transform:translateY(-50%) rotate(4deg) !important;
}
.menu-hero-title,.messages-display,.bakery-brand,.account-hero h2,
.edit-section-title,.series-title,.lesson-title {
  color:var(--park-ink) !important;
  font-family:var(--park-font) !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
}
.menu-hero-title,.messages-display,.bakery-brand,.account-hero h2 { font-size:clamp(2rem,4vw,3rem) !important; }
.menu-hero-desc,.messages-unread,.bakery-hero-title,.bakery-hero-desc,.account-hero p { color:var(--park-muted) !important; }

.edit-card,.messages-card,.account-card,.meal-panel,.recipe-block,
.menu-gate,.bakery-gate,.account-gate,.ai-page-gate,
[data-theme='dark'] .edit-card,[data-theme='dark'] .messages-card,[data-theme='dark'] .account-card {
  position:relative;
  overflow:hidden;
  border:1.5px solid var(--park-line) !important;
  border-radius:18px !important;
  color:var(--park-ink) !important;
  background:rgba(255,254,249,.94) !important;
  box-shadow:var(--park-shadow) !important;
}
.edit-card::before,.messages-card::before,.account-card::before,.meal-panel::before {
  content:'';
  position:absolute;
  inset:0 0 auto;
  height:5px;
  background:linear-gradient(90deg,var(--park-yellow),var(--park-orange),var(--park-green),var(--park-blue));
}
.account-grid { gap:22px !important; }
.account-card { padding:28px !important; }
.account-card-icon,.account-avatar {
  border-radius:14px !important;
  color:#fff !important;
  background:linear-gradient(145deg,var(--park-orange),var(--park-coral)) !important;
  box-shadow:0 3px 0 #b94a2d !important;
}
.account-card:nth-child(2) .account-card-icon { background:linear-gradient(145deg,var(--park-blue),#4c83d1) !important; box-shadow:0 3px 0 #3567aa !important; }

.edit-page .scene { opacity:.38 !important; }
.edit-page .edit-card { padding:26px !important; }
.edit-toolbar { margin-top:30px !important; }
.category-editor,.link-editor,.dish-item,.meal-summary-item,.slot-row {
  border:1.5px solid var(--park-line) !important;
  border-radius:15px !important;
  background:#fffdf7 !important;
  box-shadow:0 3px 0 rgba(91,70,43,.07) !important;
}

.meal-tabs { gap:10px !important; }
.meal-tab,.dish-cat-btn,.bakery-filter,.recipe-tab {
  border:1.5px solid var(--park-line) !important;
  border-radius:12px !important;
  color:#5d526c !important;
  background:#fffdf7 !important;
  box-shadow:0 3px 0 rgba(92,72,45,.07) !important;
}
.meal-tab.is-active,.dish-cat-btn.is-active,.bakery-filter.is-active,.recipe-tab.is-active {
  color:#fff !important;
  border-color:#684dcf !important;
  background:linear-gradient(145deg,#8368e9,#684dcf) !important;
  box-shadow:0 3px 0 #4c35a7 !important;
}
.dish-card,.series-card,.lesson-card,.message-item {
  border:1.5px solid var(--park-line) !important;
  border-radius:16px !important;
  background:#fffdf8 !important;
  box-shadow:0 4px 0 rgba(91,70,43,.08) !important;
}
.dish-card:nth-child(4n+1),.series-card:nth-child(4n+1) { background:#fff8dd !important; }
.dish-card:nth-child(4n+2),.series-card:nth-child(4n+2) { background:#eef8df !important; }
.dish-card:nth-child(4n+3),.series-card:nth-child(4n+3) { background:#eaf5ff !important; }
.dish-card:nth-child(4n+4),.series-card:nth-child(4n+4) { background:#fff0e8 !important; }
.dish-card:hover,.series-card:hover,.lesson-card:hover,.message-item:hover { transform:translateY(-3px) rotate(-.25deg) !important; box-shadow:0 7px 0 rgba(91,70,43,.10) !important; }

.bakery-toolbar,.bakery-search-results,.series-header,.lesson-stage {
  border-color:var(--park-line) !important;
  border-radius:18px !important;
  background:rgba(255,254,249,.92) !important;
  box-shadow:var(--park-shadow) !important;
}
.bakery-search { border-radius:14px !important; }
.series-cover,.lesson-thumb { border-radius:13px !important; }

input,select,textarea,.field input,.field select,.bakery-search input,
[data-theme='dark'] input,[data-theme='dark'] select,[data-theme='dark'] textarea {
  border:1.5px solid #dcd1c0 !important;
  border-radius:12px !important;
  color:var(--park-ink) !important;
  background:#fffefb !important;
  box-shadow:inset 0 1px 0 rgba(87,66,41,.03) !important;
}
input:focus,select:focus,textarea:focus,.field input:focus,.field select:focus {
  border-color:var(--park-purple) !important;
  box-shadow:0 0 0 4px rgba(115,87,223,.13) !important;
  transform:none !important;
}
.btn { border-radius:12px !important; }
.btn-primary { background:linear-gradient(145deg,#8266ea,#664ad0) !important; box-shadow:0 4px 0 #4d36a7 !important; }
.btn-secondary,.btn-ghost { background:#fffdf7 !important; box-shadow:0 3px 0 rgba(91,70,43,.08) !important; }

/* AI floating window */
.home-body .ai-float {
  position:fixed !important;
  z-index:80 !important;
  inset:0 !important;
  width:100vw;
  height:100dvh;
  pointer-events:none;
}
.home-body .ai-float-launcher {
  position:absolute !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:26px !important;
  right:28px !important;
  bottom:28px !important;
  width:230px !important;
  height:96px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  color:#fff !important;
  background:transparent !important;
  box-shadow:none !important;
  opacity:1;
  transform-origin:right bottom;
  transition:transform .3s cubic-bezier(.2,.85,.25,1),opacity .22s ease,filter .3s ease !important;
  pointer-events:auto;
}
.home-body .ai-float-launcher[hidden] { display:none !important; }
.home-body .ai-float-launcher.is-leaving,
.home-body .ai-float-launcher.is-leaving:hover,
.home-body .ai-float-launcher.is-returning,
.home-body .ai-float-launcher.is-returning:hover { opacity:0; transform:scale(.72) !important; filter:blur(1px); pointer-events:none; }
.home-body .ai-float-launcher::before {
  content:none;
}
.home-body .ai-float-launcher::after {
  content:'';
  position:absolute;
  z-index:0;
  inset:auto;
  top:0;
  left:-18px;
  width:266px;
  height:96px;
  padding:0;
  border:0;
  border-radius:0;
  border-image:none;
  background:transparent url('/images/ai-bubble-9slice-v2.png') center / 100% 100% no-repeat !important;
  box-shadow:none !important;
  opacity:1 !important;
  transform:none !important;
  filter:none;
  pointer-events:none;
}
.home-body .ai-float-launcher:hover { transform:translateY(-4px) rotate(-1deg) !important; box-shadow:none !important; }
.home-body .ai-float-launcher-icon {
  position:relative;
  z-index:1;
  display:grid !important;
  width:68px !important;
  height:68px !important;
  flex:0 0 68px !important;
  place-items:center;
  border-radius:50% !important;
  background:transparent !important;
  transform:translate(-4px,-7px);
}
.home-body .ai-float-logo { width:64px !important; height:64px !important; filter:drop-shadow(0 3px 2px rgba(45,28,105,.24)); }
.home-body .ai-float-stars { position:absolute; z-index:2; inset:0; pointer-events:none; }
.home-body .ai-float-stars i,.home-body .ai-float-stars b { position:absolute; display:block; color:#fff; font-style:normal; font-weight:400; line-height:1; }
.home-body .ai-float-stars i { top:11px; left:88px; font-size:1.55rem; }
.home-body .ai-float-stars b { top:34px; left:85px; font-size:.88rem; }
.home-body .ai-float-launcher-text { position:relative !important; z-index:1; display:inline !important; width:auto !important; height:auto !important; padding:0 !important; overflow:visible !important; clip:auto !important; font-family:var(--park-font); font-size:1.75rem !important; font-weight:400 !important; line-height:1.05 !important; letter-spacing:.02em; white-space:nowrap; transform:translate(-4px,-7px); }

.home-body .ai-chat {
  position:absolute !important;
  right:24px !important;
  bottom:24px !important;
  display:flex !important;
  width:min(430px,calc(100vw - 32px)) !important;
  height:min(560px,calc(100dvh - 48px)) !important;
  flex-direction:column;
  overflow:hidden;
  border:1.5px solid #ddd4e7 !important;
  border-radius:20px !important;
  color:var(--park-ink) !important;
  background:#fffdf8 !important;
  box-shadow:0 5px 0 rgba(78,55,151,.09),0 22px 52px rgba(57,38,112,.2) !important;
  transform:translate(48px,72px) scale(.68) !important;
  transform-origin:right bottom !important;
  opacity:0 !important;
  transition:transform .32s cubic-bezier(.18,.9,.24,1),opacity .22s ease,border-radius .32s ease !important;
  pointer-events:auto;
}
.home-body .ai-chat.is-open { border-radius:22px !important; opacity:1 !important; transform:translate(0,0) scale(1) !important; }
.home-body .ai-chat-header {
  min-height:72px;
  padding:12px 14px !important;
  flex:0 0 auto;
  gap:10px !important;
  border-bottom:1px solid #e5dccf !important;
  background:linear-gradient(135deg,#fff8e8,#f7f2ff) !important;
}
.home-body .ai-chat-mark { width:46px !important; height:46px !important; flex-basis:46px !important; border-radius:14px !important; }
.home-body .ai-chat-header > div { min-width:0; flex:1 1 auto; }
.home-body .ai-chat-header h2 { font-size:1.08rem !important; }
.home-body .ai-chat-header p { margin-top:2px !important; overflow:hidden; color:#7d746d !important; font-size:.72rem !important; line-height:1.35 !important; text-overflow:ellipsis; white-space:nowrap; }
.ai-chat-mark,.ai-starter-mark,.ai-message-avatar {
  color:#fff !important;
  background:linear-gradient(145deg,#8667ed,#6849d4) !important;
}
.ai-chat-mark img,.ai-starter-mark img,.ai-message-avatar img { display:block; width:78%; height:78%; object-fit:contain; }
.ai-message-avatar img { width:88%; height:88%; }
.ai-chat-header h2,.ai-starter h2 { font-family:var(--park-font) !important; font-weight:400 !important; }
.ai-chat-clear,.ai-chat-close,.ai-chat-expand {
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  min-height:38px !important;
  flex-basis:38px !important;
  border:1px solid rgba(101,78,138,.12) !important;
  border-radius:11px !important;
  color:#685d76 !important;
  background:rgba(255,255,255,.72) !important;
}
.home-body .ai-chat-messages { min-height:0 !important; max-height:none !important; padding:16px !important; flex:1 1 auto; background:linear-gradient(180deg,#fffdf8,#fffbf2) !important; }
.ai-message-content {
  border:1px solid #e1d7c9 !important;
  border-radius:16px 16px 16px 5px !important;
  color:#3b3149 !important;
  background:#fffef9 !important;
  box-shadow:0 3px 0 rgba(91,70,43,.06) !important;
}
.ai-message-user .ai-message-content {
  border-color:#6548c9 !important;
  border-radius:16px 16px 5px 16px !important;
  color:#fff !important;
  background:linear-gradient(145deg,#8062e8,#674bd0) !important;
}
.home-body .ai-chat-tools { min-height:42px; margin:0 16px 8px !important; flex:0 0 auto; border-color:#e0d5c6 !important; }
.ai-tool-button,.ai-model-select-label select { border-radius:11px !important; background:#fffdf8 !important; }
.home-body .ai-tool-button { min-height:38px !important; padding:.4rem .65rem !important; }
.home-body .ai-model-select-label select { min-height:38px !important; }
.home-body .ai-chat-form {
  min-height:62px;
  margin:0 16px !important;
  padding:7px 8px 7px 12px !important;
  flex:0 0 auto;
  border:1.5px solid #d9cebf !important;
  border-radius:16px !important;
  background:#fffefb !important;
  box-shadow:0 4px 0 rgba(91,70,43,.07) !important;
}
.home-body .ai-chat-form textarea { min-height:44px !important; border:0 !important; box-shadow:none !important; background:transparent !important; }
.home-body .ai-chat-form button[type='submit'] { width:46px !important; height:46px !important; min-width:46px !important; min-height:46px !important; border-radius:13px !important; background:linear-gradient(145deg,var(--park-orange),var(--park-coral)) !important; box-shadow:0 3px 0 #b4472d !important; }
.home-body .ai-chat-note { margin:8px 16px 12px !important; flex:0 0 auto; }

/* The illustrated AI panel intentionally stays warm and light in either
   system theme; prevent legacy dark-theme text tokens from turning pale. */
[data-theme='dark'] .home-body .ai-chat-header h2,
[data-theme='dark'] .home-body .ai-chat-header p,
[data-theme='dark'] .home-body .ai-chat-tools,
[data-theme='dark'] .home-body .ai-tool-button,
[data-theme='dark'] .home-body .ai-model-select-label,
[data-theme='dark'] .home-body .ai-model-select-label select,
[data-theme='dark'] .home-body .ai-search-toggle,
[data-theme='dark'] .home-body .ai-chat-form textarea,
[data-theme='dark'] .home-body .ai-chat-note {
  color:var(--park-ink) !important;
}
[data-theme='dark'] .home-body .ai-chat-header p,
[data-theme='dark'] .home-body .ai-chat-note { color:#7d746d !important; }
[data-theme='dark'] .home-body .ai-model-select-label select,
[data-theme='dark'] .home-body .ai-tool-button {
  border-color:#ddd1c1 !important;
  background:#fffdf8 !important;
}
[data-theme='dark'] .home-body .ai-search-toggle-track { background:#ddd9d1 !important; }

/* AI full page */
.ai-page-main {
  width:min(100% - 40px,1180px) !important;
  height:calc(100dvh - 72px) !important;
  margin:0 auto !important;
  padding:28px 0 34px !important;
}
.ai-page-chat {
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  border:1.5px solid #d8ccba !important;
  border-radius:20px !important;
  background:rgba(255,253,245,.94) !important;
  box-shadow:var(--park-shadow) !important;
}
.ai-page-chat::before {
  content:'家庭 AI 乐园';
  position:absolute;
  z-index:2;
  top:18px;
  left:24px;
  color:var(--park-ink);
  font-family:var(--park-font);
  font-size:1.3rem;
}
.ai-page-chat .ai-chat-messages { width:min(880px,100%) !important; padding-top:62px !important; }
.ai-page-chat .ai-chat-tools,.ai-page-chat .ai-chat-form,.ai-page-chat .ai-chat-note { width:min(820px,calc(100% - 36px)) !important; }
.ai-page-chat .ai-chat-tools {
  border:1.5px solid #ddd1c1 !important;
  border-bottom:0 !important;
  border-radius:16px 16px 0 0 !important;
  background:#fffef9 !important;
}
.ai-page-chat .ai-chat-form {
  border:1.5px solid #ddd1c1 !important;
  border-top:0 !important;
  border-radius:0 0 16px 16px !important;
  background:#fffef9 !important;
}
.ai-starter { max-width:650px !important; }
.ai-starter-mark { width:70px !important; height:70px !important; border-radius:22px !important; font-size:2rem !important; }
.ai-starter-prompts button { border-radius:14px !important; }

@media (max-width:700px) {
  .home-body.map-home .topbar-brand { order:1; }
  .home-body.map-home .topbar-right { display:contents !important; }
  .home-body.map-home .topbar-weather { order:2; }
  .home-body.map-home .topbar-clock { order:3; }
  .home-body.map-home .shared-site-nav { order:4; }
  .home-body.map-home .auth-actions { order:5; }
  .subpage-header .topbar-inner {
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:0 !important;
  }
  .subpage-header .shared-site-nav { margin-left:auto; }
  .subpage-header .topbar-right { margin-left:16px; }
  .shared-site-nav {
    display:flex !important;
    height:64px !important;
    flex:0 0 auto;
    align-items:center;
    gap:0 !important;
  }
  .shared-site-nav > .home-nav-link { display:none !important; }
  .shared-site-nav .site-nav-more { display:flex !important; height:64px; }
  .shared-site-nav .site-nav-more-trigger {
    display:inline-flex !important;
    min-width:42px;
    min-height:40px;
    justify-content:center;
    padding:0 8px;
    border:1px solid rgba(93,75,61,.13);
    border-radius:12px;
    background:rgba(255,255,255,.65);
  }
  .shared-site-nav .site-nav-more-trigger svg { width:23px; height:23px; }
  .shared-site-nav .site-nav-more-trigger span { display:none; }
  .shared-site-nav .site-nav-more-trigger::after { display:none; }
  .shared-site-nav .site-nav-more-panel { top:57px; right:-34px; min-width:164px; }
  .subpage-header .topbar-right .subpage-back { display:none !important; }
  /* Keep the illustrated home hero in one real column on phones.  The map
     theme's desktop two-column rule has higher specificity (and !important),
     which otherwise collapses the copy column to 0px in dark mode. */
  .home-body.map-home .site-hero,
  [data-theme='dark'] .home-body.map-home .site-hero {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-areas:none !important;
    width:100% !important;
  }
  .home-body.map-home .hero-copy,
  .home-body.map-home .today-panel,
  [data-theme='dark'] .home-body.map-home .hero-copy,
  [data-theme='dark'] .home-body.map-home .today-panel {
    grid-column:1 !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    justify-self:stretch !important;
  }
  .home-body.map-home .site-hero-title,
  .home-body.map-home .site-hero-sub,
  [data-theme='dark'] .home-body.map-home .site-hero-title,
  [data-theme='dark'] .home-body.map-home .site-hero-sub {
    width:100% !important;
    max-width:none !important;
    writing-mode:horizontal-tb !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
  }
  .home-body.map-home .topbar-brand { min-width:0 !important; flex:1 1 auto !important; }
  .home-body.map-home .topbar-title { min-width:4.5em; }
  .home-body.map-home .topbar-right { flex:0 0 auto !important; gap:.35rem !important; }
  .home-body.map-home .topbar-clock { min-width:42px !important; }
  .home-body.map-home .auth-actions .btn { min-width:62px !important; padding-inline:.55rem !important; }
  .subpage-header,.ai-page-body .subpage-header,.subpage-header .topbar-inner { min-height:64px !important; height:64px !important; }
  .subpage-header .topbar-inner { width:calc(100% - 24px) !important; padding-inline:4px !important; }
  .subpage-header .subpage-home-mark,.bakery-body .subpage-header .subpage-home-mark { width:38px !important; height:38px !important; flex-basis:38px !important; border-radius:11px !important; }
  .subpage-header .subpage-home-mark .brand-house { width:29px !important; height:29px !important; }
  .subpage-header .topbar-title { font-size:1.15rem !important; }
  .subpage-header .topbar-subtitle { display:none !important; }
  .subpage-header .subpage-back {
    width:auto !important;
    min-width:72px !important;
    padding:0 11px !important;
    font-size:.9rem !important;
    white-space:nowrap;
  }
  .subpage-header .subpage-back::before { margin-right:4px; font-size:1rem; }
  .subpage-body:not(.ai-page-body) > main.container { width:calc(100% - 24px) !important; padding:30px 0 72px !important; }
  .menu-hero,.messages-hero,.bakery-hero,.account-hero { min-height:108px; padding:18px 74px 18px 18px !important; border-radius:16px; }
  .menu-hero::after,.messages-hero::after,.bakery-hero::after,.account-hero::after { right:14px !important; width:48px !important; height:48px !important; border-radius:14px !important; font-size:1.4rem !important; }
  .menu-hero-title,.messages-display,.bakery-brand,.account-hero h2 { font-size:2rem !important; }
  .edit-card,.messages-card,.account-card,.meal-panel,.recipe-block { border-radius:15px !important; }
  .account-card,.edit-page .edit-card { padding:20px !important; }
  .home-body .ai-chat { right:8px !important; bottom:8px !important; width:calc(100vw - 16px) !important; height:calc(100dvh - 28px) !important; border-radius:18px !important; }
  .home-body .ai-float-launcher { right:14px !important; bottom:16px !important; width:170px !important; height:70px !important; padding:0 !important; gap:17px !important; }
  .home-body .ai-float-launcher::after { display:block !important; inset:auto; top:0; left:-12px; width:194px; height:70px; }
  .home-body .ai-float-launcher-icon { width:50px !important; height:50px !important; flex-basis:50px !important; }
  .home-body .ai-float-launcher-icon { transform:translate(-3px,-5px); }
  .home-body .ai-float-logo { width:48px !important; height:48px !important; }
  .home-body .ai-float-stars i { top:8px; left:64px; font-size:1.08rem; }
  .home-body .ai-float-stars b { top:24px; left:62px; font-size:.62rem; }
  .home-body .ai-float-launcher-text { padding:0 !important; font-size:1.22rem !important; transform:translate(-3px,-5px); }
  .ai-page-main { width:100% !important; height:calc(100dvh - 64px) !important; padding:0 !important; }
  .ai-page-chat { border-width:0 !important; border-radius:0 !important; box-shadow:none !important; }
  .ai-page-chat::before { top:14px; left:16px; font-size:1.08rem; }
  .ai-page-chat .ai-chat-messages { padding-top:54px !important; }
}

@media (prefers-reduced-motion:no-preference) {
  .subpage-header .subpage-home-mark:hover { transform:translateY(-2px) rotate(-4deg) !important; }
  .dish-card,.series-card,.lesson-card,.message-item,.btn { transition:transform .18s ease,box-shadow .18s ease !important; }
}

@media (prefers-reduced-motion:reduce) {
  .home-body .ai-float-launcher,.home-body .ai-chat { transition:none !important; }
}

/* Full-page AI workbench */
.ai-page-chat::before { content:none !important; }
.ai-page-chat {
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.ai-page-chat > .ai-chat-header {
  display:none !important;
}
.ai-page-chat > .ai-chat-header > .ai-chat-mark {
  display:grid !important; width:50px !important; height:50px !important; flex:0 0 50px;
  border:3px solid #fff !important; border-radius:17px !important;
  background:linear-gradient(145deg,#8a62f4,#6842dd) !important;
  box-shadow:0 5px 0 rgba(92,72,148,.14) !important;
}
.ai-page-chat > .ai-chat-header > div { display:block !important; }
.ai-page-chat > .ai-chat-header h2 { color:var(--park-ink) !important; font-size:1.28rem !important; }
.ai-page-chat > .ai-chat-header p { margin-top:2px !important; color:#81766b !important; font-size:.78rem !important; }
.ai-page-chat > .ai-chat-header .ai-chat-clear {
  position:static !important; display:grid; width:42px; height:42px; margin-left:auto;
  border:1.5px solid rgba(104,78,137,.12) !important; border-radius:13px !important;
  place-items:center; background:rgba(255,255,255,.68) !important;
}
.ai-page-chat:has(.ai-starter) > .ai-chat-header .ai-chat-clear { display:none !important; }
.ai-page-chat .ai-chat-messages {
  width:min(900px,calc(100% - 56px)) !important;
  box-sizing:border-box;
  padding:24px 0 18px !important;
}
.ai-page-chat .ai-chat-messages:has(.ai-starter) { display:grid; align-items:center; }
.ai-page-chat .ai-starter {
  position:relative; display:grid;
  grid-template-columns:190px minmax(0,1fr);
  grid-template-areas:"robot title" "robot copy" "robot prompts";
  width:min(900px,100%) !important; max-width:none !important; margin:auto !important;
  min-height:330px; padding:44px 42px !important; overflow:hidden;
  border:2px solid #e4d6bf; border-radius:24px; text-align:left !important;
  background:radial-gradient(circle at 8% 18%,rgba(255,255,255,.9) 0 35px,transparent 36px),linear-gradient(125deg,#fff3c8 0 31%,#fffaf0 31% 69%,#eef5d1 100%);
  box-shadow:0 8px 0 rgba(126,104,72,.1),0 24px 55px rgba(91,73,51,.08);
}
.ai-page-chat .ai-starter::after { content:'✦'; position:absolute; top:18px; right:24px; color:#ffb71b; font-size:1.6rem; transform:rotate(12deg); }
.ai-page-chat .ai-starter-mark {
  grid-area:robot; align-self:center; width:132px !important; height:132px !important; margin:0 !important;
  border:5px solid #fff !important; border-radius:42px !important;
  background:linear-gradient(145deg,#8d68ff,#6741dc) !important;
  box-shadow:0 9px 0 rgba(97,70,164,.16),0 18px 32px rgba(84,59,148,.13) !important;
}
.ai-page-chat .ai-starter h2 { grid-area:title; align-self:end; margin:0 !important; color:#30254d !important; font-size:clamp(1.8rem,3.2vw,2.45rem) !important; line-height:1.15; }
.ai-page-chat .ai-starter > p { grid-area:copy; margin:7px 0 20px !important; color:#766b63 !important; font-size:.92rem !important; }
.ai-page-chat .ai-starter-prompts { grid-area:prompts; display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; }
.ai-page-chat .ai-starter-prompts button {
  display:flex !important;
  align-items:center;
  height:52px;
  min-height:52px;
  padding:0 14px !important;
  border:1.5px solid rgba(96,72,52,.12) !important;
  border-radius:13px !important;
  text-align:left;
  line-height:1.2 !important;
  box-shadow:0 3px 0 rgba(98,75,56,.07) !important;
}
.ai-page-chat .ai-starter-prompts button::before { margin-right:8px; font-size:1rem; }
.ai-page-chat .ai-starter-prompts button:nth-child(1)::before { content:'📈'; }
.ai-page-chat .ai-starter-prompts button:nth-child(2)::before { content:'🧁'; }
.ai-page-chat .ai-starter-prompts button:nth-child(3)::before { content:'🍲'; }
.ai-page-chat .ai-starter-prompts button:nth-child(4)::before { content:'🧭'; }
.ai-page-chat .ai-starter-prompts button:nth-child(4) { background:color-mix(in srgb,var(--kid-green) 15%,var(--kid-paper)) !important; }
.ai-page-chat .ai-chat-tools,
.ai-page-chat .ai-chat-form,
.ai-page-chat .ai-chat-note,
.ai-page-chat .ai-attachment-preview {
  width:min(900px,calc(100% - 56px)) !important;
}
.ai-page-chat .ai-chat-tools { min-height:58px; padding:8px 12px !important; }
.ai-page-chat .ai-chat-tools-left { align-items:stretch; height:40px; }
.ai-page-chat .ai-tool-button,
.ai-page-chat .ai-model-select-label,
.ai-page-chat .ai-model-select-label select,
.ai-page-chat .ai-search-toggle {
  height:40px !important;
  min-height:40px !important;
  box-sizing:border-box;
}
.ai-page-chat .ai-tool-button { padding:0 12px !important; }
.ai-page-chat .ai-model-select-label select { padding-top:0 !important; padding-bottom:0 !important; }
.ai-page-chat .ai-search-toggle {
  min-width:112px;
  padding:0 12px;
  border:1px solid rgba(74,58,45,.1);
  border-radius:11px;
  justify-content:center;
  background:#fffdf8;
}
.ai-page-chat .ai-chat-form { padding:6px 10px 10px !important; }

@media (max-width:700px) {
  .ai-page-chat .ai-chat-messages { width:calc(100% - 24px) !important; padding:14px 0 10px !important; }
  .ai-page-chat .ai-starter { grid-template-columns:74px minmax(0,1fr); grid-template-areas:"robot title" "copy copy" "prompts prompts"; padding:20px 18px !important; border-radius:18px; }
  .ai-page-chat .ai-starter { min-height:0; }
  .ai-page-chat .ai-starter-mark { width:60px !important; height:60px !important; border-width:3px !important; border-radius:19px !important; }
  .ai-page-chat .ai-starter h2 { align-self:center; font-size:1.55rem !important; }
  .ai-page-chat .ai-starter > p { margin:14px 0 !important; font-size:.8rem !important; }
  .ai-page-chat .ai-starter-prompts { gap:7px !important; }
  .ai-page-chat .ai-starter-prompts button { height:46px; min-height:46px; padding:0 9px !important; font-size:.72rem !important; }
  .ai-page-chat .ai-chat-tools,
  .ai-page-chat .ai-chat-form,
  .ai-page-chat .ai-chat-note,
  .ai-page-chat .ai-attachment-preview { width:calc(100% - 24px) !important; }
  .ai-page-chat .ai-search-toggle { min-width:auto; padding:0 9px; }
}

/* Bakery classroom — playful course catalogue and lesson hierarchy */
.bakery-body.subpage-body {
  background:
    radial-gradient(circle at 8% 18%,rgba(255,255,255,.72) 0 54px,transparent 56px),
    radial-gradient(circle at 91% 15%,rgba(255,194,76,.22) 0 112px,transparent 114px),
    linear-gradient(180deg,#fff9e9 0%,#fff5dc 55%,#e7efa9 100%) !important;
  background-attachment:fixed !important;
  background-position:center top !important;
  background-size:cover !important;
}
.bakery-body.subpage-body::before,.bakery-body.subpage-body::after { position:fixed !important; }
.bakery-body .bakery-page { width:min(100% - 40px,1180px) !important; padding:42px 0 90px !important; }
.bakery-body .bakery-hero {
  position:relative;
  width:100% !important;
  max-width:none !important;
  min-height:238px;
  padding:36px 340px 34px 42px !important;
  overflow:hidden;
  border:2px solid #e6ae57 !important;
  border-radius:26px !important;
  background:
    radial-gradient(circle at 76% 18%,rgba(255,255,255,.72) 0 75px,transparent 76px),
    linear-gradient(135deg,#fff3bd 0%,#ffe0a7 58%,#ffc990 100%) !important;
  box-shadow:0 7px 0 rgba(183,112,42,.14),0 20px 44px rgba(159,102,37,.12) !important;
}
.bakery-body .bakery-hero::before {
  position:absolute;
  right:44px;
  bottom:-54px;
  width:230px;
  height:230px;
  border:3px solid rgba(255,255,255,.72);
  border-radius:50%;
  background:rgba(255,250,222,.55);
  content:'';
}
.bakery-body .bakery-hero::after {
  position:absolute !important;
  z-index:1;
  top:50% !important;
  right:96px !important;
  width:auto !important;
  height:auto !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  content:'🧁' !important;
  font-size:6.5rem !important;
  filter:drop-shadow(0 10px 0 rgba(145,83,33,.13));
  transform:translateY(-50%) rotate(4deg) !important;
}
.bakery-kicker { margin:0 0 9px; color:#b25732; font-size:.88rem; font-weight:900; letter-spacing:.08em; }
.bakery-body .bakery-brand { max-width:650px; margin:0 !important; color:#34254d !important; font-size:clamp(2.4rem,4.3vw,4rem) !important; line-height:1.08 !important; }
.bakery-body .bakery-brand span { display:block; }
.bakery-body .bakery-hero-title { margin-top:14px !important; color:#5e4c54 !important; font-size:1.08rem !important; font-weight:800 !important; }
.bakery-body .bakery-hero-desc { display:inline-flex; margin-top:12px !important; padding:7px 12px; border-radius:999px; color:#81563f !important; background:rgba(255,255,255,.58); font-size:.82rem !important; font-weight:800; }
.bakery-hero-treats { position:absolute; z-index:2; right:28px; bottom:18px; display:flex; align-items:flex-end; gap:9px; }
.bakery-hero-treats span { display:grid; width:48px; height:48px; place-items:center; border:2px solid rgba(255,255,255,.78); border-radius:15px; background:rgba(255,250,226,.82); font-size:1.7rem; box-shadow:0 4px 0 rgba(138,82,32,.12); transform:rotate(-5deg); }
.bakery-hero-treats span:nth-child(2) { transform:translateY(-8px) rotate(4deg); }
.bakery-hero-treats span:nth-child(3) { transform:rotate(7deg); }
.bakery-body .bakery-toolbar {
  position:relative;
  z-index:3;
  display:block;
  width:100%;
  margin:28px 0 38px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.bakery-body .bakery-toolbar::before { display:none; content:none; }
.bakery-body .bakery-search {
  min-height:60px;
  padding:0 18px !important;
  border:1.5px solid #ddc69f !important;
  border-radius:14px !important;
  background:rgba(255,254,248,.9) !important;
  box-shadow:0 4px 0 rgba(112,82,45,.08) !important;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.bakery-body .bakery-search:focus-within { border-color:#d8914d !important; background:#fffef9 !important; box-shadow:0 4px 0 rgba(112,82,45,.08),0 0 0 4px rgba(216,145,77,.11) !important; }
.bakery-body .bakery-search svg { display:block; width:22px; height:22px; flex:0 0 22px; color:#b0714d; }
.bakery-body .bakery-search input { min-height:56px !important; border:0 !important; color:#3a3047 !important; background:transparent !important; box-shadow:none !important; font-size:1rem !important; }
.bakery-series-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin:0 4px 18px; }
.bakery-series-intro p { margin:0 0 3px; color:#d26b3e; font-size:.78rem; font-weight:900; letter-spacing:.12em; }
.bakery-series-intro h3 { margin:0; color:#302644; font-family:var(--park-font); font-size:1.75rem; font-weight:400; }
.bakery-series-intro > span { padding-bottom:5px; color:#817486; font-size:.82rem; font-weight:700; }
.bakery-body .series-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:22px !important; }
.bakery-body .series-card {
  position:relative;
  display:grid;
  grid-template-columns:44% minmax(0,1fr);
  min-height:236px;
  min-width:0;
  overflow:hidden;
  border:2px solid #e6c778 !important;
  border-radius:20px !important;
  background:#fff8d8 !important;
  box-shadow:0 6px 0 #dec46e,0 14px 30px rgba(97,72,38,.09) !important;
}
.bakery-body .series-card::before {
  position:absolute;
  z-index:3;
  top:12px;
  left:12px;
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  border:2px solid rgba(255,255,255,.82);
  border-radius:11px;
  color:#fff;
  background:rgba(53,42,48,.72);
  box-shadow:0 3px 0 rgba(46,30,28,.16);
  content:'01';
  font-size:.7rem;
  font-weight:900;
}
.bakery-body .series-card:nth-child(2)::before { content:'02'; }
.bakery-body .series-card:nth-child(3)::before { content:'03'; }
.bakery-body .series-card:nth-child(4)::before { content:'04'; }
.bakery-body .series-card:nth-child(2) { border-color:#afd078 !important; background:#f1f9d9 !important; box-shadow:0 6px 0 #a7c969,0 14px 30px rgba(73,105,40,.09) !important; }
.bakery-body .series-card:nth-child(3) { border-color:#8fc7e9 !important; background:#eaf6ff !important; box-shadow:0 6px 0 #82bade,0 14px 30px rgba(49,96,128,.09) !important; }
.bakery-body .series-card:nth-child(4) { border-color:#efaa8e !important; background:#fff0e8 !important; box-shadow:0 6px 0 #e69b7d,0 14px 30px rgba(130,67,46,.09) !important; }
.bakery-body .series-card-cover { width:100%; height:100%; aspect-ratio:auto; min-height:0 !important; border-radius:0 !important; background-position:center; transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .25s ease; }
.bakery-body .series-card:hover { transform:translateY(-6px) rotate(-.5deg) !important; }
.bakery-body .series-card:hover .series-card-cover { transform:scale(1.045); filter:saturate(1.08); }
.bakery-body .series-card-body { position:relative; display:flex; min-width:0; min-height:0; flex-direction:column; justify-content:center; padding:22px 22px 20px !important; text-align:left; }
.bakery-body .series-card-kind { display:inline-flex; margin:0 0 8px !important; padding:4px 8px; border-radius:999px; color:#b45a36 !important; background:rgba(255,255,255,.65); font-size:.7rem !important; font-weight:900 !important; }
.bakery-body .series-card-title { color:#342b43 !important; font-family:var(--park-font) !important; font-size:1.72rem !important; font-weight:400 !important; }
.bakery-body .series-card-desc { min-height:42px; margin-top:8px !important; color:#746975 !important; font-size:.86rem !important; line-height:1.6 !important; }
.bakery-body .series-card-meta { margin-top:12px !important; color:#8e6d55 !important; font-size:.76rem !important; font-weight:800; }
.bakery-body .series-card-meta::after { float:right; color:#d36b3f; content:'进入教室  →'; }
.bakery-body .bakery-page:has(#view-series:not([hidden])) { padding-top:22px !important; }
.bakery-body .bakery-crumb { display:inline-flex; margin:0 0 12px !important; padding:6px 10px; border:1px solid #e5d3b5; border-radius:12px; background:rgba(255,255,255,.72); font-size:.78rem; }
.bakery-body .series-header { min-height:0 !important; margin-bottom:18px !important; padding:18px 22px !important; align-items:center !important; border:1.5px solid #b9cf79 !important; border-radius:17px !important; background:linear-gradient(135deg,#f7fbdc,#eef6c6) !important; box-shadow:0 4px 0 rgba(112,145,47,.13) !important; }
.bakery-body .series-header .series-kind { margin-bottom:2px !important; font-size:.72rem !important; }
.bakery-body .series-header .series-title { font-size:2rem !important; line-height:1.08 !important; }
.bakery-body .series-header .series-desc { margin-top:5px !important; font-size:.82rem !important; }
.bakery-body .lesson-grid { grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:16px !important; margin-top:0; }
.bakery-body .lesson-card { padding:8px !important; border:1.5px solid #e3d5bf !important; border-radius:15px !important; background:#fffdf7 !important; box-shadow:0 4px 0 rgba(93,70,43,.08) !important; }
.bakery-body .lesson-card-cover { aspect-ratio:16/10 !important; overflow:hidden; border-radius:10px !important; box-shadow:none !important; }
.bakery-body .lesson-card-body { padding:9px 3px 2px !important; }
.bakery-body .lesson-card-title { min-height:2.6em; display:-webkit-box; overflow:hidden; font-size:.86rem !important; line-height:1.3 !important; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.bakery-body .lesson-card-badges { top:.55rem; right:.55rem; left:.55rem; }
.bakery-body .lesson-card-badge,.bakery-body .lesson-status-badge { padding:.28rem .46rem !important; font-size:.62rem !important; }
.bakery-body .lesson-stage,.bakery-body .recipe-section { border:1.5px solid #dfd1ba !important; border-radius:22px !important; background:rgba(255,254,249,.96) !important; box-shadow:0 7px 0 rgba(92,70,43,.08),0 22px 44px rgba(86,63,35,.08) !important; }
.bakery-body #view-lesson { width:100%; max-width:1080px !important; }
.bakery-body .bakery-page:has(#view-lesson:not([hidden])) { padding-top:22px !important; }
.bakery-body .lesson-stage {
  display:grid !important;
  grid-template-columns:minmax(0,1.7fr) minmax(270px,.72fr) !important;
  grid-template-areas:none !important;
  gap:18px !important;
  padding:18px !important;
  align-items:stretch !important;
  background:linear-gradient(135deg,#fffdf7,#fff7e7) !important;
}
.bakery-body .lesson-stage .player-shell { grid-area:auto !important; align-self:center; border:3px solid #392f43 !important; border-radius:16px !important; background:#16121c !important; box-shadow:0 7px 0 rgba(42,31,48,.2),0 18px 36px rgba(27,21,32,.18) !important; }
.bakery-body .lesson-video { width:100%; height:100%; object-fit:contain; background:#16121c; }
.bakery-body .lesson-sidebar { display:flex; min-width:0; flex-direction:column; padding:22px; border:1.5px solid #e3bd70; border-radius:17px; background:linear-gradient(155deg,#fff2c4,#ffe0aa); box-shadow:0 4px 0 rgba(164,103,39,.12); }
.bakery-body .lesson-stage .lesson-header { grid-area:auto !important; padding:0 !important; }
.bakery-body .lesson-stage .lesson-number { margin-bottom:14px !important; color:#a85332 !important; background:rgba(255,255,255,.65) !important; }
.bakery-body .lesson-stage .lesson-title { color:#322741 !important; font-size:clamp(1.85rem,2.7vw,2.55rem) !important; line-height:1.12 !important; }
.bakery-body .lesson-intro { color:#75605b !important; line-height:1.65; }
.bakery-body .lesson-stage .lesson-nav { grid-area:auto !important; display:grid !important; width:100% !important; margin-top:auto !important; padding-top:22px; align-self:stretch !important; }
.bakery-body .lesson-stage .lesson-nav .btn-primary { background:linear-gradient(145deg,#ef8050,#dd5f39) !important; box-shadow:0 4px 0 #aa4329 !important; }
.bakery-body .lesson-stage .lesson-nav .btn-ghost { border-color:rgba(138,91,49,.18) !important; background:rgba(255,255,255,.6) !important; }
.bakery-body .recipe-section { width:100%; max-width:none !important; margin-top:28px !important; padding:26px !important; }
.bakery-body .recipe-section-header { padding-bottom:18px; border-bottom:1px solid #eadfcd; }
.bakery-body .recipe-section .recipe-text { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.bakery-body .recipe-section .recipe-text-head { grid-column:1/-1; margin-bottom:0 !important; }
.bakery-body .recipe-section .recipe-block { margin:0 !important; padding:20px !important; border:1px solid #e6d8c4 !important; background:#fffdf8 !important; }

@media (max-width:1000px) {
  .bakery-body .series-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .bakery-body .lesson-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:850px) and (min-width:701px) {
  .bakery-body .series-grid { grid-template-columns:1fr !important; }
}
@media (max-width:700px) {
  .bakery-body .bakery-page { width:calc(100% - 24px) !important; padding:22px 0 68px !important; }
  .bakery-body .bakery-hero { min-height:220px; padding:24px 24px 90px !important; border-radius:20px !important; }
  .bakery-body .bakery-hero::before { right:-34px; bottom:-80px; width:190px; height:190px; }
  .bakery-body .bakery-hero::after { top:auto !important; right:42px !important; bottom:12px !important; font-size:4.25rem !important; transform:rotate(4deg) !important; }
  .bakery-body .bakery-brand { font-size:2.35rem !important; }
  .bakery-body .bakery-hero-title { max-width:90%; font-size:.92rem !important; }
  .bakery-hero-treats { right:12px; bottom:11px; gap:5px; }
  .bakery-hero-treats span { width:35px; height:35px; border-radius:11px; font-size:1.15rem; }
  .bakery-body .bakery-toolbar { width:100%; margin:20px 0 28px !important; padding:0 !important; }
  .bakery-body .bakery-search { min-height:52px; padding:0 14px !important; border-radius:12px !important; }
  .bakery-body .bakery-search svg { width:20px; height:20px; }
  .bakery-body .bakery-search input { min-height:50px !important; font-size:.9rem !important; }
  .bakery-series-intro { align-items:flex-start; margin-inline:2px; }
  .bakery-series-intro h3 { font-size:1.45rem; }
  .bakery-series-intro > span { display:none; }
  .bakery-body .series-grid { grid-template-columns:1fr !important; gap:16px !important; }
  .bakery-body .lesson-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; }
  .bakery-body .series-card { display:grid; grid-template-columns:40% 1fr; min-height:178px; }
  .bakery-body .series-card-cover { height:100%; aspect-ratio:auto; }
  .bakery-body .series-card-body { min-height:0; padding:15px !important; }
  .bakery-body .series-card-title { font-size:1.28rem !important; }
  .bakery-body .series-card-desc { min-height:0; }
  .bakery-body .series-card-meta::after { display:none; }
  .bakery-body .bakery-page:has(#view-series:not([hidden])) { padding-top:14px !important; }
  .bakery-body .series-header { padding:14px 16px !important; border-radius:14px !important; }
  .bakery-body .series-header .series-title { font-size:1.55rem !important; }
  .bakery-body .series-header .series-desc { max-width:240px; font-size:.76rem !important; }
  .bakery-body .series-count { padding:.24rem .5rem !important; font-size:.68rem !important; }
  .bakery-body .lesson-card { padding:6px !important; border-radius:12px !important; }
  .bakery-body .lesson-card-title { font-size:.76rem !important; }
  .bakery-body .lesson-card-badge,.bakery-body .lesson-status-badge { padding:.24rem .38rem !important; font-size:.55rem !important; }
  .bakery-body .bakery-page:has(#view-lesson:not([hidden])) { padding-top:14px !important; }
  .bakery-body .lesson-stage { display:flex !important; gap:12px !important; padding:10px !important; flex-direction:column; border-radius:17px !important; }
  .bakery-body .lesson-stage .player-shell { width:100%; border-width:2px !important; border-radius:12px !important; }
  .bakery-body .lesson-sidebar { padding:16px; border-radius:14px; }
  .bakery-body .lesson-stage .lesson-number { margin-bottom:9px !important; }
  .bakery-body .lesson-stage .lesson-title { font-size:1.65rem !important; }
  .bakery-body .lesson-intro { display:block !important; margin-top:8px; font-size:.78rem; }
  .bakery-body .lesson-stage .lesson-nav { width:100% !important; padding-top:15px; }
  .bakery-body .recipe-section { padding:16px !important; border-radius:17px !important; }
  .bakery-body .recipe-section .recipe-text { grid-template-columns:1fr; gap:12px; }
  .bakery-body .recipe-section .recipe-text-head { grid-column:1; }
}

/* Family inbox — follows the bakery page's playful, spacious hierarchy. */
.messages-body.subpage-body {
  background:
    radial-gradient(circle at 8% 18%,rgba(255,255,255,.76) 0 54px,transparent 56px),
    radial-gradient(circle at 91% 15%,rgba(118,174,235,.19) 0 112px,transparent 114px),
    linear-gradient(180deg,#f8f7ff 0%,#f4f2ff 55%,#dcebad 100%) !important;
  background-attachment:fixed !important;
}
.messages-body.subpage-body::before,.messages-body.subpage-body::after { position:fixed !important; }
.messages-body .messages-page { width:min(100% - 40px,1180px) !important; max-width:1180px !important; padding:42px 0 90px !important; }
.messages-body .messages-hero {
  position:relative;
  width:100% !important;
  max-width:none !important;
  min-height:176px;
  margin:0 0 30px !important;
  padding:30px 210px 28px 34px !important;
  overflow:hidden;
  text-align:left !important;
  border:1.5px solid #c9c4e3 !important;
  border-radius:22px !important;
  background:
    radial-gradient(circle at 91% 16%,rgba(255,255,255,.7) 0 55px,transparent 56px),
    linear-gradient(135deg,#fffdf8 0%,#f5f1ff 62%,#e7ecff 100%) !important;
  box-shadow:0 5px 0 rgba(91,82,133,.09),0 16px 36px rgba(76,70,112,.08) !important;
}
.messages-body .messages-hero::before {
  position:absolute;
  top:26px;
  right:32px;
  bottom:auto;
  width:116px;
  height:116px;
  border:1.5px solid rgba(111,100,172,.13);
  border-radius:28px;
  background:rgba(255,255,255,.5);
  content:'';
  transform:rotate(5deg);
}
.messages-body .messages-hero::after {
  position:absolute !important;
  z-index:1;
  top:50% !important;
  right:61px !important;
  width:auto !important;
  height:auto !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  content:'✉️' !important;
  font-size:3.8rem !important;
  filter:drop-shadow(0 6px 0 rgba(74,72,145,.10));
  transform:translateY(-50%) rotate(-4deg) !important;
}
.messages-kicker { margin:0 0 7px; color:#7568ad; font-size:.78rem; font-weight:900; letter-spacing:.12em; }
.messages-body .messages-display { margin:0 !important; color:#302943 !important; font-size:clamp(2.15rem,3.3vw,3.15rem) !important; line-height:1.08 !important; white-space:nowrap; }
.messages-hero-desc { margin:10px 0 0; color:#746e80; font-size:.92rem; font-weight:700; }
.messages-body .messages-unread { display:inline-flex; margin:13px 0 0 !important; padding:5px 10px; border:1px solid rgba(101,88,181,.1); border-radius:999px; color:#5e529c !important; background:rgba(255,255,255,.72); font-size:.76rem !important; font-weight:900; }
.messages-list-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin:0 4px 18px; }
.messages-list-intro p { margin:0 0 3px; color:#675bbb; font-size:.78rem; font-weight:900; letter-spacing:.12em; }
.messages-list-intro h3 { margin:0; color:#302644; font-family:var(--park-font); font-size:1.75rem; font-weight:400; }
.messages-list-intro > span { padding-bottom:5px; color:#817486; font-size:.82rem; font-weight:700; }
.messages-body .messages-card { overflow:hidden; padding:0 !important; border:1.5px solid #d6d1e8 !important; border-radius:22px !important; background:rgba(255,255,255,.82) !important; box-shadow:0 5px 0 rgba(80,70,130,.07),0 18px 38px rgba(66,58,112,.07) !important; }
.messages-body .messages-card::before { display:none !important; content:none !important; }
.messages-body .messages-list { display:block; border-radius:0 !important; box-shadow:none !important; }
.messages-body .message-item { min-height:96px; padding:18px 20px !important; border:0 !important; border-bottom:1px solid #e5e1ed !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; }
.messages-body .messages-list .message-item:last-child { border-bottom:0 !important; }
.messages-body .message-item.is-unread { background:#f5f2ff !important; box-shadow:inset 4px 0 0 #7665c5 !important; }
.messages-body .message-item:hover { transform:translateY(-2px) !important; border-color:#b9b1d8 !important; background:#fff !important; box-shadow:0 7px 18px rgba(74,64,119,.08) !important; }
.messages-body .message-kind { display:inline-flex; padding:2px 7px; border-radius:999px; color:#6558a6 !important; background:#ece8fa; font-size:.7rem; font-weight:900; }
.messages-body .message-time { color:#938da0; font-size:.76rem; }
.messages-body .message-title { color:#342d48; font-size:1.02rem; }
.messages-body .message-body { margin-top:4px; color:#756e80; }
.messages-body .message-dot { background:#c9c2dc !important; }
.messages-body .message-item.is-unread .message-dot { background:#7665c5 !important; box-shadow:0 0 0 4px rgba(118,101,197,.11); }
.messages-body .messages-empty { margin:0; padding:60px 20px !important; border-radius:15px; color:#746d82; background:#faf8ff; }

@media (max-width:700px) {
  .messages-body .messages-page { width:calc(100% - 24px) !important; padding:22px 0 68px !important; }
  .messages-body .messages-hero { min-height:166px; padding:24px 92px 22px 22px !important; border-radius:18px !important; }
  .messages-body .messages-hero::before { top:34px; right:17px; width:66px; height:66px; border-radius:18px; }
  .messages-body .messages-hero::after { top:67px !important; right:30px !important; bottom:auto !important; font-size:2.25rem !important; transform:rotate(-4deg) !important; }
  .messages-body .messages-display { font-size:2rem !important; }
  .messages-hero-desc { max-width:90%; font-size:.9rem; }
  .messages-list-intro { align-items:flex-start; margin-inline:2px; }
  .messages-list-intro h3 { font-size:1.45rem; }
  .messages-list-intro > span { display:none; }
  .messages-body .messages-card { padding:0 !important; border-radius:17px !important; }
  .messages-body .message-item { min-height:86px; padding:15px 14px !important; border-radius:0 !important; }
}

/* Family menu — compact meal planning with a warm dining-room palette. */
.menu-body.subpage-body {
  background:
    radial-gradient(circle at 8% 18%,rgba(255,255,255,.76) 0 54px,transparent 56px),
    radial-gradient(circle at 91% 15%,rgba(255,190,65,.2) 0 112px,transparent 114px),
    linear-gradient(180deg,#fffaf0 0%,#fbf5e5 55%,#e3ecab 100%) !important;
  background-attachment:fixed !important;
}
.menu-body.subpage-body::before,.menu-body.subpage-body::after { position:fixed !important; }
.menu-body .menu-page { width:min(100% - 40px,1180px) !important; max-width:1180px !important; padding:42px 0 96px !important; }
.menu-body .menu-hero {
  position:relative;
  width:100% !important;
  max-width:none !important;
  min-height:176px;
  margin:0 0 26px !important;
  padding:30px 210px 28px 34px !important;
  overflow:hidden;
  text-align:left !important;
  border:1.5px solid #e6d0a2 !important;
  border-radius:22px !important;
  background:
    radial-gradient(circle at 91% 16%,rgba(255,255,255,.68) 0 55px,transparent 56px),
    linear-gradient(135deg,#fffdf7 0%,#fff3d2 62%,#ffe1ae 100%) !important;
  box-shadow:0 5px 0 rgba(134,94,42,.08),0 16px 36px rgba(104,76,40,.08) !important;
}
.menu-body .menu-hero::before {
  position:absolute;
  top:26px;
  right:32px;
  width:116px;
  height:116px;
  border:1.5px solid rgba(178,115,38,.14);
  border-radius:28px;
  background:rgba(255,255,255,.5);
  content:'';
  transform:rotate(5deg);
}
.menu-body .menu-hero::after {
  position:absolute !important;
  z-index:1;
  top:50% !important;
  right:61px !important;
  width:auto !important;
  height:auto !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  content:'🍱' !important;
  font-size:3.8rem !important;
  filter:drop-shadow(0 6px 0 rgba(145,92,31,.1));
  transform:translateY(-50%) rotate(-4deg) !important;
}
.menu-kicker { margin:0 0 7px; color:#ad6c29; font-size:.78rem; font-weight:900; letter-spacing:.12em; }
.menu-body .menu-hero-title { margin:0 !important; color:#352b3e !important; font-size:clamp(2.15rem,3.3vw,3.15rem) !important; line-height:1.08 !important; white-space:nowrap; }
.menu-body .menu-hero-desc { margin:10px 0 0 !important; color:#796b61 !important; font-size:.92rem !important; font-weight:700; }
.menu-body .meal-tabs { display:inline-flex; margin:0 0 18px !important; padding:5px !important; gap:5px !important; border:1px solid #dfd2bc; border-radius:14px; background:rgba(255,255,255,.7); box-shadow:0 3px 0 rgba(103,76,44,.06); }
.menu-body .meal-tab { min-width:78px; min-height:42px; border:0 !important; border-radius:10px !important; color:#74685e !important; background:transparent !important; box-shadow:none !important; }
.menu-body .meal-tab.is-active { color:#fff !important; background:linear-gradient(145deg,#ef9a45,#df7637) !important; box-shadow:0 3px 0 #b75b2a !important; }
.menu-body .meal-panel,.menu-body #order-section,.menu-body #slot-manage-section {
  border:1.5px solid #e1d5c2 !important;
  border-radius:20px !important;
  background:rgba(255,254,249,.93) !important;
  box-shadow:0 5px 0 rgba(102,77,45,.07),0 18px 38px rgba(82,62,39,.07) !important;
}
.menu-body .meal-panel::before,.menu-body #order-section::before,.menu-body #slot-manage-section::before { display:none !important; content:none !important; }
.menu-body .meal-panel { margin-bottom:20px !important; padding:24px 26px !important; }
.menu-body #order-section { padding:26px !important; }
.menu-body #slot-manage-section { margin-top:20px !important; padding:26px !important; }
.menu-body .edit-toolbar { margin:0 0 20px !important; }
.menu-body .edit-section-title { color:#382e42 !important; font-size:1.55rem !important; }
.menu-body .menu-hint { color:#8b7d70; }
.menu-body .dish-cat-nav { padding:8px !important; border:1px solid #e6dccb; border-radius:14px !important; background:#f9f5ec !important; }
.menu-body .dish-cat-link { border-radius:10px !important; color:#776c61 !important; }
.menu-body .dish-cat-link.is-active { border-color:#e5c89d !important; color:#9f562b !important; background:#fff !important; box-shadow:0 2px 0 rgba(117,79,41,.08); }
.menu-body .dish-cat-heading { color:#4a3d45; font-family:var(--park-font); font-weight:400; }
.menu-body .dish-tile { border:1px solid #e6dccd !important; border-radius:14px !important; background:#fffdf8 !important; box-shadow:0 3px 0 rgba(102,77,45,.06) !important; }
.menu-body .dish-tile:hover:not(:disabled) { border-color:#d9b986 !important; background:#fffaf0 !important; box-shadow:0 6px 14px rgba(100,72,39,.08) !important; }
.menu-body .dish-tile.is-picked { border-color:#e39a54 !important; background:#fff0d7 !important; box-shadow:inset 0 0 0 1px rgba(227,154,84,.2),0 3px 0 rgba(160,93,40,.09) !important; }
.menu-body .dish-remove-btn {
  top:7px;
  right:7px;
  display:grid;
  width:27px !important;
  height:27px !important;
  min-width:27px !important;
  min-height:27px !important;
  padding:0 !important;
  place-items:center;
  border:1px solid rgba(121,91,67,.16) !important;
  border-radius:50% !important;
  color:#9b8173 !important;
  background:rgba(255,253,248,.88) !important;
  box-shadow:0 2px 5px rgba(78,57,39,.07);
  font-size:1.05rem !important;
  font-weight:500 !important;
  line-height:1 !important;
  opacity:.52;
  transition:opacity .18s ease,color .18s ease,background .18s ease,border-color .18s ease,transform .18s ease;
}
.menu-body .dish-tile-wrap:hover .dish-remove-btn,.menu-body .dish-remove-btn:focus-visible { opacity:1; }
.menu-body .dish-remove-btn:hover { border-color:#e4aaa0 !important; color:#b84f42 !important; background:#fff2ef !important; transform:scale(1.06); }
.menu-body .dish-cart-tag { color:#a95b2d !important; background:#fff8ec !important; }
.menu-body .btn-primary { border-color:#d97837 !important; background:linear-gradient(145deg,#ef9343,#dc7135) !important; box-shadow:0 3px 0 #ad5529 !important; }
.menu-body .order-cart-bar { border-color:#e0d4bf !important; background:rgba(255,253,247,.96) !important; }
.menu-body .order-cart-bar .btn-primary { background:linear-gradient(145deg,#ef9343,#dc7135) !important; box-shadow:0 3px 0 #ad5529 !important; }

@media (max-width:700px) {
  .menu-body .menu-page { width:calc(100% - 24px) !important; padding:22px 0 78px !important; }
  .menu-body .menu-hero { min-height:166px; padding:24px 92px 22px 22px !important; border-radius:18px !important; }
  .menu-body .menu-hero::before { top:34px; right:17px; width:66px; height:66px; border-radius:18px; }
  .menu-body .menu-hero::after { top:67px !important; right:30px !important; font-size:2.25rem !important; }
  .menu-body .menu-hero-title { font-size:2rem !important; }
  .menu-body .meal-tabs { display:flex; width:100%; }
  .menu-body .meal-tab { min-width:0; flex:1; }
  .menu-body .meal-panel,.menu-body #order-section { padding:18px !important; border-radius:17px !important; }
  .menu-body #slot-manage-section { margin-top:16px !important; padding:18px !important; }
  .menu-body .dish-remove-btn { opacity:.75; }
}
