/* t1025u/t1026u — Thymeline: warm editorial food magazine */
:root{
  --bg:#F3EBE0; --paper:#FFF8F0; --ink:#1A1714; --muted:#6B5E52; --accent:#9C4B2F;
  --line:rgba(26,23,20,.12); --on-accent:#FFF8F0;
  --display:"Bodoni Moda",Georgia,"Times New Roman",serif;
  --sans:"Nunito Sans",system-ui,sans-serif;
  --radius:6px 22px 18px 22px; --radius-sm:4px 14px 12px 14px;
  --photo-radius:4px 28px 22px 28px; --shadow:0 18px 40px rgba(60,40,20,.12);
  --thy-pill-h:58px;
}
html,body,.phone{background:var(--bg)!important;color:var(--ink);font-family:var(--sans)}
.serif,h1,h2,.huge-num,.hero h1,.detail-hero h2{font-family:var(--display)!important;font-weight:600;letter-spacing:-.02em}
.screen{background:
  radial-gradient(90% 50% at 100% 0%, rgba(156,75,47,.08), transparent 55%),
  linear-gradient(180deg, #F7F0E6 0%, var(--bg) 40%)!important}
.mesh-bg{background:
  radial-gradient(80% 60% at 0% 0%, rgba(196,140,80,.14), transparent 50%),
  radial-gradient(70% 50% at 100% 20%, rgba(156,75,47,.10), transparent 45%),
  var(--bg)!important}

/* Asymmetric magazine cards — NOT same as pulse */
.rcard,.wcard{
  border-radius:var(--photo-radius)!important;
  box-shadow:var(--shadow)!important;
  border:1px solid rgba(26,23,20,.08)!important;
  background:var(--paper)!important;
}
.rcard:nth-child(odd){border-radius:22px 6px 28px 14px!important}
.rcard:nth-child(even){border-radius:6px 26px 12px 28px!important}
.h-scroll{gap:18px; padding:4px 18px 8px; scroll-padding:18px}
.h-scroll > .rcard{flex:0 0 82%!important; transform:rotate(-0.4deg)}
.h-scroll > .rcard:nth-child(even){transform:rotate(0.5deg)}

/* Editorial headers */
.topbar,.mast,.screen > .pad:first-child h1{
  font-family:var(--display)!important;
}
.large-title{font-family:var(--display);font-size:clamp(34px,9vw,44px);line-height:1.05;margin:8px 18px 6px;letter-spacing:-.03em;
  transition:font-size .28s cubic-bezier(.22,1,.36,1), opacity .2s}
.large-title.is-compact{font-size:22px; opacity:.92}
.sticky-chips{position:sticky; top:calc(var(--safe-t) + 4px); z-index:12; display:flex; gap:8px; padding:6px 16px; overflow:auto;
  scrollbar-width:none; background:linear-gradient(180deg, color-mix(in srgb,var(--bg) 92%,transparent), transparent)}
.sticky-chips::-webkit-scrollbar{display:none}
.sticky-chips .chip{background:var(--paper); border:1px solid var(--line); border-radius:999px; padding:8px 14px; font-weight:700; font-size:13px; color:var(--ink); white-space:nowrap}
.sticky-chips .chip.on{background:var(--ink); color:var(--paper)}

/* Herb flip specimen */
.flip-tile,.herb-row.specimen{border-radius:4px 20px!important; background:var(--paper); border:1px dashed rgba(156,75,47,.28)}

/* Grocery paper checklist */
#s-grocery .swipe-front,#groceryList .swipe-front{
  background:repeating-linear-gradient(0deg, transparent, transparent 27px, rgba(156,75,47,.10) 28px);
  background-color:#FFFDF8; border-radius:4px; border:1px solid rgba(26,23,20,.1);
  box-shadow:2px 3px 0 rgba(26,23,20,.06); font-family:var(--display);
}

/* —— Floating frosted pill nav (t1026u) —— */
.phone.thy-skin .tabs{
  padding:0 22px calc(14px + var(--safe-b))!important; transition:transform .38s cubic-bezier(.22,1.2,.36,1), opacity .28s;
}
.phone.thy-skin .tabs.is-hidden{transform:translate3d(0,120%,0); opacity:0; pointer-events:none}
.phone.thy-skin .tabs nav{
  position:relative!important;
  display:flex!important; gap:4px; align-items:center;
  min-height:var(--thy-pill-h)!important; padding:6px 8px!important;
  border-radius:999px!important;
  background:rgba(255,248,240,.72)!important;
  border:1px solid rgba(255,255,255,.55)!important;
  box-shadow:0 12px 40px rgba(60,40,20,.18), inset 0 1px 0 rgba(255,255,255,.65)!important;
  backdrop-filter:blur(16px) saturate(1.2)!important; -webkit-backdrop-filter:blur(16px) saturate(1.2)!important;
  overflow:hidden;
}
.phone.thy-skin .tabs nav .nav-liquid{
  position:absolute; top:6px; bottom:6px; left:0; width:72px; border-radius:999px;
  background:linear-gradient(135deg, color-mix(in srgb,var(--accent) 88%,#fff), var(--accent));
  box-shadow:0 6px 18px color-mix(in srgb,var(--accent) 40%, transparent);
  transition:none; z-index:0; pointer-events:none;
}
.phone.thy-skin .tabs nav button{
  position:relative; z-index:1; flex:1 1 0; min-width:0; min-height:46px!important;
  border-radius:999px!important; color:var(--muted)!important; background:transparent!important;
  font-family:var(--sans)!important; font-size:11px!important; font-weight:800!important;
  letter-spacing:.02em; transition:color .2s, flex .35s cubic-bezier(.22,1.2,.36,1), padding .25s;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
}
.phone.thy-skin .tabs nav button .ico{font-size:16px; line-height:1}
.phone.thy-skin .tabs nav button .lab{font-size:10px; max-width:0; opacity:0; overflow:hidden; transition:max-width .3s, opacity .25s}
.phone.thy-skin .tabs nav button.on{color:#FFF8F0!important; flex:1.55 1 0}
.phone.thy-skin .tabs nav button.on .lab{max-width:64px; opacity:1}
/* slim editorial scrubber */
.thy-scrub{
  position:fixed; right:6px; top:35%; bottom:35%; width:3px; z-index:35; border-radius:999px;
  background:rgba(26,23,20,.08); pointer-events:none;
}
.thy-scrub i{position:absolute; left:-2px; width:7px; height:28px; border-radius:999px; background:var(--accent);
  transition:top .15s linear}

@media (prefers-reduced-motion: reduce){
  .phone.thy-skin .tabs,.phone.thy-skin .tabs nav .nav-liquid,.large-title{transition:none!important}
  .phone.thy-skin .tabs nav{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(255,248,240,.94)!important}
}

/* t1027u aa */
.phone.thy-skin .sticky-chips .chip{color:#1A1714!important; background:#FFF8F0!important}
.phone.thy-skin .sticky-chips .chip.on{color:#FFF8F0!important; background:#1A1714!important}
.phone.thy-skin .tabs nav button{color:#6B5E52!important}
.phone.thy-skin .tabs nav button.on{color:#FFF8F0!important}
.phone.thy-skin .large-title{color:#1A1714!important}
.phone.thy-skin .v6-strip, .phone.thy-skin .screen{padding-bottom:calc(96px + var(--safe-b))!important}

/* t1027u aa nav solid fill (auditor + real contrast) */
.phone.thy-skin .tabs nav button.on{background:var(--accent)!important; color:#FFF8F0!important}
.phone.thy-skin .tabs nav button.on .lab,.phone.thy-skin .tabs nav button.on .ico{color:#FFF8F0!important}

/* t1033u: collapse-aware labels (don't fight --nav-collapse) */
.phone.thy-skin .tabs nav button .lab,
.phone.thy-skin .tabs nav button.on .lab{
  max-width: calc((1 - var(--nav-collapse,0)) * 64px) !important;
  opacity: calc(1 - var(--nav-collapse,0)) !important;
  overflow: hidden;
}
.phone.thy-skin .tabs nav button.on .lab{ opacity: calc(1 - var(--nav-collapse,0)) !important; }