/*
 * SPRIG v1 — Forest & Apricot
 * All v3 interaction, recipe, and analytics behavior is preserved.
 * This intentionally layers on top of the legacy styles for easy future theming.
 */
:root {
  --canvas:#F8F7F1;
  --white:#FFFEFA;
  --ink:#18392C;
  --ink-2:#315745;
  --muted:#75897B;
  --line:#E1E6DD;
  --dark:#173F30;
  --dark-2:#102E24;
  --deep:#173F30;
  --moss:#57866A;
  --sage:#BFD0B5;
  --leaf:#6B9876;
  --orange:#D98C58;
  --papaya:#F0B382;
  --peach:#FCE3CE;
  --butter:#FFF3E3;
  --mint:#E7EFE4;
  --soil:#A6724D;
  --rose:#C98556;
  --cream:#FFF4E7;
  --shadow:0 12px 45px rgba(20,55,39,.06);
}
html {scrollbar-color:#C8D5C8 #F8F7F1;}
body {background:var(--canvas);color:var(--ink)}
::selection {background:#F0BF98;color:#133C2D}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline:3px solid #E6A36E;outline-offset:3px;
}
a,button {-webkit-tap-highlight-color:transparent}
/* An instantly recognizable dark-green home for the community. */
.sidebar {
  background:radial-gradient(ellipse at -50% -20%,#33694A 0%,transparent 52%),
             linear-gradient(165deg,#1A4534 0%,#123729 63%,#0D2D22 100%);
  border-right:1px solid #2C5540;
  color:#E7F0E5;
  box-shadow:6px 0 30px rgba(19,48,36,.07);
}
.sidebar .brand {
  color:#FFFAED;
  font-family:var(--serif);
  font-size:25px;
  font-weight:600;
  letter-spacing:-.066em;
  gap:8px;
  white-space:nowrap;
  padding-left:9px;
  padding-right:0;
  transition:transform .32s var(--ease-spring);
}
.sidebar .brand:hover {transform:translateX(2px)}
.brand-icon {
  background:#F8CDA9;
  color:#204B37;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 3px 12px rgba(3,30,18,.11);
  border-radius:12px;
}
.brand-word {white-space:nowrap;line-height:1}
.brand-period {color:#F3B888}
.sidebar-tagline {
  color:#B9D0B7;
  margin-left:52px;
  margin-bottom:43px;
  font-size:10px;
  letter-spacing:.026em;
}
.sidebar-tagline span {color:#F0B784!important}
.sidebar .nav-label {color:#7FA88F;font-size:9px;letter-spacing:.18em}
.sidebar .navbutton {
  color:#BDCEBD;
  border:1px solid transparent;
  font-weight:600;
  letter-spacing:.008em;
  transition:background .2s ease,color .2s ease,transform .23s var(--ease-spring),border-color .2s ease;
}
.sidebar .navbutton:hover {color:#FFFAEA;background:#28543F;transform:translateX(2px)}
.sidebar .navbutton.active {
  color:#183E2D;
  background:#F6C8A1;
  border-color:#FFDBC0;
  box-shadow:0 5px 14px rgba(5,29,17,.15);
}
.sidebar .navbutton.active .icon,.sidebar .navbutton.active svg {color:#1D4B35}
.sidebar .navbutton .count {background:#F5C398;color:#173C2D}
.sidebar .sidebar-note,
.sidebar-note {
  background:linear-gradient(145deg,#FCE3C9,#F3C69D)!important;
  color:#1B4332;
  border:1px solid #F8D9BA!important;
  box-shadow:0 12px 30px rgba(0,22,10,.12);
  border-radius:17px;
}
.sidebar-note h4,.sidebar-note h4.serif {color:#173D2C!important}
.sidebar-note p {color:#6C6957!important}
.sidebar-note .leaf {
  color:#2A6847!important;
  background:#FFF5E8!important;
  border-radius:12px;
}
.sidebar-note .text-link,.sidebar-note button {color:#255D40!important}
.sidebar .profile.account-trigger {
  border-top:1px solid rgba(230,246,220,.2);
  color:#FCF8E9;
  border-radius:11px;
}
.sidebar .profile.account-trigger:hover {background:rgba(255,255,255,.085)}
.sidebar .profile-text strong {color:#F8F5E9}
.sidebar .profile-text small {color:#B0C8B5}
.sidebar .profile .spark {color:#F4C499}
/* Calm cream canvas; small orange editorial gestures. */
.topbar {background:rgba(248,247,241,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid #E6EADF}
.crumb {color:#8B9B8D}
.crumb strong {color:#254D37}
.topbar .search {background:#FFFEFA;border:1px solid #E0E8DC;border-radius:12px;box-shadow:0 2px 9px rgba(18,60,39,.025)}
.topbar .search:focus-within {border-color:#E7AD83;box-shadow:0 0 0 4px #F5D8BF66}
.keycap {background:#FBF2E8;border-color:#F1E2D6;color:#A87857}
.icon-btn {border-color:#E0E7DC;color:#416F53}
.icon-btn:hover {background:#FFF0E0;border-color:#E9C7AA;color:#24513A}
.btn {transition:transform .27s var(--ease-spring),box-shadow .25s ease,background .23s ease,border-color .23s ease}
.btn.primary {background:#1B4B35;color:#FFFDF6;border-color:#1B4B35;box-shadow:0 5px 13px rgba(21,63,44,.11)}
.btn.primary:hover {background:#265C42;border-color:#265C42;box-shadow:0 9px 20px rgba(22,68,43,.17)}
.btn.light {background:#FFFDF9;color:#315943;border:1px solid #E2E9DF}
.btn.light:hover {background:#FFF1E5;border-color:#F0D2B7}
.btn.soft {background:#FCEBD9;color:#77543E;border-color:#F4D9C0}
.btn.soft:hover {background:#F9DEBF}
.page {color:var(--ink)}
.serif,h1,h2,h3 {color:var(--ink)}
.page h1 em,.page h2 em {color:#C17D50}
.tinycaps {color:#8C9E88}
.page .eyebrow {color:#BFD6B9}
/* The home hero is an intentional showcase of both signature colors. */
.hero {
  background:radial-gradient(ellipse at 95% 15%,rgba(231,166,114,.19),transparent 36%),
             radial-gradient(ellipse at 14% 108%,rgba(69,132,91,.32),transparent 49%),
             linear-gradient(115deg,#153D2E,#21563D);
  border:1px solid #285744;
  border-radius:23px;
  box-shadow:0 18px 42px rgba(21,69,41,.13);
}
.hero:before {
  content:"";position:absolute;right:17%;top:-50%;width:340px;height:340px;
  border:1px solid rgba(255,222,189,.18);border-radius:50%;pointer-events:none;
}
.hero-copy {position:relative;z-index:2}
.hero-copy .eyebrow {color:#F7CCA6!important;letter-spacing:.16em;font-weight:800}
.hero-copy .dot {background:#F5C195;box-shadow:0 0 0 5px rgba(243,180,135,.12)}
.hero h1 {color:#FFF9ED;letter-spacing:-.066em}
.hero h1 em {color:#F4C19A}
.hero-copy p {color:#D0DFD1;max-width:430px}
.hero-actions .btn.primary {background:#F5BF91;color:#1D4632;border-color:#F5BF91;box-shadow:0 8px 22px rgba(9,37,22,.15)}
.hero-actions .btn.primary:hover {background:#FFD2AD;border-color:#FFD2AD;transform:translateY(-3px)}
.hero-actions .btn.light {background:rgba(255,255,255,.08);color:#F9F4E9;border-color:rgba(244,249,235,.31);box-shadow:none}
.hero-actions .btn.light:hover {background:rgba(255,255,255,.17)}
.hero-art:before {
  content:"";position:absolute;z-index:0;width:375px;height:375px;border-radius:50%;
  background:radial-gradient(circle,#E3A2772C 10%,#F6CCAA10 55%,transparent 73%);
  border:1px solid rgba(245,209,179,.14);pointer-events:none;
}
.hero-art img {border-color:#FFF0DB33;box-shadow:0 30px 75px rgba(5,22,13,.48)}
.float-stars {color:#F8C08F;font-size:70px;filter:drop-shadow(0 5px 9px #16382766)}
.floating-note {background:#FFF1DD;color:#2A5B40;border:1px solid #FFE0BC;box-shadow:0 12px 35px #04201644;border-radius:12px}
.branch-bubble {color:#C77C48}
/* Count blocks and recipe cards: tactile, warm and intentionally less dashboardy. */
.stat {background:#FFFEFB;border-color:#E8EAE2;border-radius:15px;box-shadow:0 5px 17px rgba(30,61,38,.025)}
.stat-icon {background:#FAE9D6;color:#8F5938;border-radius:13px}
.stat strong {color:#1A4733}
.stat p {color:#718575}
.pulse {background:linear-gradient(115deg,#FDEAD8 0%,#FCF4E9 42%,#F0F2E7 100%);border:1px solid #F2DCC8;border-radius:20px}
.pulse-head .tinycaps {color:#B27B53!important}
.pulse-head h2 {color:#1F4834}
.pulse-head p {color:#877F6B}
.pulse-card {border:1px solid #F0DFCC;border-radius:12px;box-shadow:0 3px 12px rgba(47,45,23,.025)}
.pulse-card:hover {border-color:#E6BB96;box-shadow:0 10px 23px rgba(70,64,26,.1)}
.pulse-card strong,.pulse-card span:not(.avatar) {color:#286247}
.chip {border-color:#E3E9DF;background:#FFFEFA;color:#54745B;transition:all .2s ease}
.chip:hover {background:#FFF1E1;border-color:#F1D2B6;transform:translateY(-1px)}
.chip.selected,.chip.active,.filter-chip.active {background:#1D5138!important;border-color:#1D5138!important;color:#FFF8E9!important}
.recipe-card {background:#FFFEFC;border:1px solid #E8EBE2;border-radius:18px;box-shadow:0 8px 26px rgba(31,66,47,.048)}
.recipe-card:hover {transform:translateY(-6px)!important;box-shadow:0 20px 42px rgba(35,58,37,.13)!important;border-color:#EFCAAA}
.recipe-card .card-image {overflow:hidden;background:#F0EBDF}
.recipe-card .card-image img {transition:transform .6s var(--ease-spring),filter .5s ease}
.recipe-card:hover .card-image img {transform:scale(1.055)}
.recipe-card .badge,.recipe-card .card-badge {color:#2E6241}
.recipe-card h3,.recipe-card .serif {color:#204933}
.recipe-card .heart-btn:hover {background:#FFEBD7}
.feature-strip {background:linear-gradient(110deg,#EAF1E6,#FBF1E5)!important;border:1px solid #E7EBDD;border-radius:20px}
.feature-strip .feature-copy .tinycaps {color:#B67A4E!important}
.feature-strip .feature-copy .text-link {color:#256646!important}
.feature-strip .feature-copy p {color:#7A8E79!important}
/* The exploration, tree, and DNA screens remain distinctly Sprig. */
.community-head {background:linear-gradient(113deg,#FDF0E1,#F7E4D0 56%,#E7EDE1);border-color:#EAD8C1;border-radius:22px}
.community-head:after {color:#E9AB79!important;opacity:.23}
.community-head .tinycaps {color:#AD744C}
.people-summary {background:linear-gradient(125deg,#EDF3E9,#FBEDD9);border-color:#E1E9D9}
.cook-tile,.activity-card,.feed-card {border-radius:16px}
.cook-tile:hover {border-color:#F0C3A0;transform:translateY(-3px)}
.profile-backdrop {background:radial-gradient(ellipse at 70% 120%,#CF966A66,transparent 50%),linear-gradient(120deg,#1A4835,#568462)!important}
.lab-cover {background:radial-gradient(circle at 83% 5%,#F4C69D99,transparent 36%),linear-gradient(115deg,#FFF3E6,#F0EDDC 60%,#E4EEE0);border:1px solid #EFDDC9;border-radius:23px}
.lab-cover .tinycaps {color:#AD774E}
.lab-cover h1 {color:#1C4834}
.lab-cover h1 em {color:#C98150}
.lab-cover p {color:#6D806E}
.lab-cover-art {filter:drop-shadow(0 10px 30px rgba(79,99,58,.08))}
.lab-version {transition:background .2s ease,border-color .2s ease,transform .25s var(--ease-spring)}
.lab-version:hover {background:#FFF5E9;transform:translateX(3px)}
.lab-version.active,.lab-version.selected {background:#FFF0DE;border-color:#E7BC9D}
.lab-dot {fill:#48765A;stroke:#F9F5EB}
.lab-dot.selected,.lab-dot.active {fill:#E89E69;stroke:#FFE7CF}
.lab-link {stroke:#9ABC9C}
.lab-gridline {stroke:#E1E9DF}
.lab-stats>*,.lab-panel,.lab-insight {border-radius:17px}
.insight-hero {background:radial-gradient(circle at 90% 5%,#BA805833,transparent 49%),linear-gradient(130deg,#183F30,#2D5B42);border:1px solid #38664D;box-shadow:0 18px 42px rgba(27,63,40,.10)}
.insight-hero .tinycaps {color:#F0C39E}
.insight-hero h2,.insight-hero h2 em {color:#FFF7E9}
.insight-hero h2 em {color:#F1BE96}
.dna-donut.is-large {--ring:#F2B884}
.dna-donut:not(.is-large) {--ring:#5D9B73}
.dna-ring-bg {stroke:#A9C3A84A}
.insight-panel {background:#FFFEFB;border-color:#E7EAE1}
.insight-panel-label {color:#9C7A60}
.dna-track {background:#EAF1E8}
.dna-track i {background:linear-gradient(90deg,#356F4D,#8BB58A)!important}
.time-difference {background:#FCEDDE;border-color:#F6DFC7}
.family-stat-grid strong {color:#21553A}
.dna-footnote {background:#FFF5E8;border:1px solid #F4E1CA;color:#756B58;border-radius:12px}
.lab-lineage-cta {background:linear-gradient(100deg,#ECF3E7,#FFF0E0);border:1px solid #E9E5D6;border-radius:16px}
.map-toolbar {background:#F3F1E5;border-color:#E5EADD}
.map-live {background:#E6A472;box-shadow:0 0 0 4px #FCE7D5}
.map-tool-btn {background:#FFFEFB;border-color:#DFE9DD;color:#3A674A}
.map-tool-btn:hover {background:#FDECD9}
.flavor-map .tree-board {background-color:#FCFCF8;background-image:radial-gradient(#D8E5D6 1.1px,transparent 1.1px);border-color:#E4EBDF}
.flavor-map .tree-card {border-color:#E2E9E0;background:#FFFEFC}
.flavor-map .tree-card:hover {border-color:#E6B98F;box-shadow:0 13px 27px #26553921}
.flavor-map .tree-card.selected,.flavor-map .tree-card.active {border-color:#DDA277;box-shadow:0 0 0 3px #FBE6D2,0 15px 33px #39583724}
.tree-lines path {stroke:#B5CEB5}
.tree-lines path.highlight {stroke:#DF9E6C}
.branch-spotlight,.branch-context {border-radius:18px}
.map-diff-tag {background:#FBE6D4;color:#9C6946}
.footer {color:#89A091;border-top-color:#E6EADF}
/* The modals follow the same editorial palette. */
.modal {background:#FFFEFA;border-radius:24px;box-shadow:0 25px 80px #092C1C35}
.modal .tinycaps {color:#C38A60}
.modal .btn.primary {background:#1E5037}
.account-choice.current {border-color:#E9B990;background:#FFF2E6}
.account-choice:hover {border-color:#E7B990}
.toast {background:#194531;color:#FFF9EC;border:1px solid #3B6E50;box-shadow:0 13px 36px #153A2850}
/* Consistent micro-motion, without breaking OS reduce-motion preferences. */
@media(prefers-reduced-motion:no-preference){
  .hero-art img {animation:recipe-float 8s ease-in-out infinite alternate}
  .float-stars {animation:star-turn 14s linear infinite}
  .stat,.pulse,.insight-panel {transition:box-shadow .3s ease,transform .4s var(--ease-spring)}
  .stat:hover {transform:translateY(-2px);box-shadow:0 11px 27px #244C3112}
  @keyframes recipe-float {from{transform:rotate(7deg) translateY(1px)}to{transform:rotate(11deg) translateY(-8px)}}
  @keyframes star-turn {from{transform:rotate(-4deg)}to{transform:rotate(28deg)}}
}
@media(prefers-reduced-motion:reduce){
  .hero-art img,.float-stars {animation:none!important}
}
/* Compact navigation has the same personality as desktop. */
.mobile-brand {color:#234C36;font-size:23px;letter-spacing:-.072em;white-space:nowrap}
.mobile-brand .brand-period {color:#D58F5D}
.mobile-brand .brand-icon {width:30px;height:30px;flex-basis:30px}
.mobile-bottom-nav {background:#FFFEFA;border-top-color:#E4E9DE;box-shadow:0 -10px 32px #19422D13}
.mobile-bottom-nav button {color:#728F79}
.mobile-bottom-nav button.active {background:#FCE7D2;color:#28553D}
@media(max-width:1160px){
  .sidebar .brand {font-size:23px;gap:6px;padding-left:6px}
  .sidebar .brand-icon {width:30px;height:30px;flex-basis:30px}
  .sidebar-tagline {margin-left:42px}
}
@media(max-width:900px){
  .sidebar .brand {font-size:24px}
  .topbar {backdrop-filter:none}
}
@media(max-width:700px){
  .hero {border-radius:20px}
  .hero-copy .eyebrow {font-size:9px;letter-spacing:.13em}
  .hero-copy h1 {letter-spacing:-.052em}
  .hero-art:before {width:280px;height:280px}
  .hero-art img {border-width:7px}
  .mobile-brand {font-size:22px;gap:5px}
  .mobile-brand .brand-icon {width:27px;height:27px;flex-basis:27px;border-radius:9px}
  .pulse {border-radius:17px}
  .lab-cover {border-radius:19px}
  .sidebar .navbutton {font-size:13px}
}

/* Keep large Flavor Lab families approachable without expanding the page forever. */
.lab-list-summary {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin:0 0 12px;color:#68816d;font-size:12px}
.lab-pinned {border:1px solid #b7cdb1;border-radius:15px;padding:12px 0 0;margin-bottom:12px;background:#f4f8ee;overflow:hidden}
.lab-pinned>.tinycaps {padding:0 15px 10px;font-size:9px;color:#57795c}
.lab-pinned .lab-version {border:0}
.lab-filter-note {padding:12px 15px;background:#f7f3e9;border-radius:10px;font-size:12px;color:#7a6b47}
.lab-pagination {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}
.lab-pagination>span {font-size:12px;color:#6c826f;text-align:center}
.lab-pagination .btn:disabled {opacity:.4;cursor:default;transform:none;box-shadow:none}
.lab-chart-footer {flex-wrap:wrap}
@media(max-width:380px){.lab-pagination {gap:5px}.lab-pagination .btn {padding:9px;font-size:10px}.lab-pagination>span {font-size:10px}}

/* Encourage credited variations without blocking independent recipes. */
.editor-similar{margin:22px 0 28px;padding:21px 23px;border:1px solid #d7e3cb;background:#f1f5e9;border-radius:14px}
.similar-heading h2{font-size:25px;line-height:1.2;letter-spacing:-.025em;margin:0 0 8px;color:#365d3d}
.similar-heading p,.similar-status{font-size:12px;line-height:1.65;color:#748368;margin:0 0 12px}
.similar-status{color:#5a7956;margin:10px 0}
.similar-limit{font-size:10px!important;line-height:1.6;color:#87917b;margin:12px 0 0!important}
.similar-list{display:grid;gap:8px}
.similar-item{display:flex;align-items:center;gap:11px;padding:12px;background:#fffef9;border:1px solid #e0e6d6;border-radius:10px;min-width:0}
.similar-item>img{width:44px;height:44px;object-fit:cover;border-radius:8px;flex:none}
.similar-item>div{flex:1;min-width:0}
.similar-item strong{font-family:var(--serif);font-size:18px;font-weight:500;color:#3f6443;display:block;overflow-wrap:anywhere}
.similar-item small,.similar-review-list small{display:block;font-size:10px;line-height:1.6;color:#8c987f;margin-top:4px;overflow-wrap:anywhere}
.similar-item>.btn{flex:none;min-height:36px;font-size:10px;padding:9px}
.similarity-dialog>p{font-size:12px;line-height:1.7}
.similar-preview-content{font-size:12px;line-height:1.8;border-top:1px solid #e1e8d8;padding-top:9px;margin-top:15px}
.similar-preview-content h3{font-family:var(--serif);font-size:23px;margin:16px 0 8px}
.similar-preview-content li{margin-bottom:8px;overflow-wrap:anywhere}
.similar-credit{color:#6c8d6a}
.similar-review-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-top:20px}
.similar-review-list{display:grid;gap:10px;margin:18px 0}
.similar-review-list>div{background:#f5f7ee;border:1px solid #e2e8d8;border-radius:10px;padding:15px}
.similar-review-list strong{font-family:var(--serif);font-size:22px;font-weight:500;overflow-wrap:anywhere}
.similar-review-list .btn{margin-top:11px}
@media(max-width:700px){
 .editor-similar{padding:17px 15px}.similar-heading h2{font-size:23px}
 .similar-item{flex-wrap:wrap;gap:9px}.similar-item>div{flex-basis:calc(100% - 54px)}
 .similar-item>.btn{flex:1;justify-content:center;font-size:10px;white-space:normal}
 .similar-review-actions>.btn{flex:1;justify-content:center;font-size:11px}
}

/* Readable supporting copy keeps the cream, forest and apricot hierarchy clear. */
:root {--muted:#5F735F}
body .page :is(.card-overline,.card-overline span,.card-content p,.avatarline,.author-link,
.recipe-description,.recipe-subtitle,.author-row,.quickstats span,.panel-sub,.hint,.ingredient-item,
.recipe-time-note,.discover-results-count,.discover-demo-note,.discover-results-head .sub,
.discover-intro .tinycaps,.discover-intro p,.discover-explorer-link p,.discover-sort>label,
.cooks-scope-note,.cooks-heading p,.cooks-sort-label,.cooks-filter-row>label,.cook-stats,
.cook-joined,.cook-trending,.cook-no-recipes,.cook-person small,.profile-bio,
.similar-limit,.similar-heading p,.similar-status,.similar-item small,.similar-review-list small,
.field label,.editor-intro,.preview-body>p,.preview-diff small,.footer) {color:#5D705D}
body .page.cooks-directory :is(.cook-specialties,.cook-tile>p) {color:#5D705D}
body .page :is(.discover-intro .text-link,.text-link,.cook-person strong) {color:#3F694A}
body .page :is(.cook-origin.is-example,.cook-interests>span) {color:#785B38}
body .page .cook-origin:not(.is-example) {color:#3E6546}
body .page :is(.card-overline span,.discover-page .card-overline>span:last-child) {font-size:10px}
body .page :is(.similar-limit,.discover-demo-note,.cook-origin,.cook-joined,.cook-trending) {font-size:11px}
body .page .lab-axis {fill:#5D705D}
body :is(button,a,input,textarea,select,[tabindex]):focus-visible {outline:3px solid #315E42!important;outline-offset:3px}
body .sidebar :is(button,a,[tabindex]):focus-visible {outline-color:#F6C8A1!important}
@media(max-width:700px){
  body :is(.save-circle,.cooks-scopes .chip,.discover-categories .chip,.cook-top>.btn,
  .recipe-support-actions .btn,.similar-item>.btn,.similar-review-actions>.btn) {min-height:44px}
  body .save-circle {min-width:44px}
  body .discover-intro-links .text-link {min-height:44px}
  body :is(.page input[type="text"],.page input[type="search"],.page input[type="number"],.page textarea,.topbar input) {font-size:16px}
}
body :is(.page input,.page textarea,.topbar input)::placeholder {color:#657663;opacity:1}
body .page .similar-limit {font-size:11px!important}