:root{
  --care-card-accent:#90ab94;
  --care-card-accent-2:#d8c4a1;
  --care-card-paper:#fffdf8;
  --care-card-wash:#eef4ed;
  --care-card-wash-2:#f7f1e8;
  --care-card-ink:#231f1c;
  --care-card-soft:#5a4c3f;
}
/* site-wide Care share studio */
.careShareDock{
  position:fixed; right:16px; bottom:16px; z-index:70; display:flex; gap:10px; align-items:center; flex-wrap:wrap; justify-content:flex-end;
}
.careSharePill{
  display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:999px; border:1px solid rgba(58,53,46,.18);
  background:linear-gradient(135deg, var(--care-card-ink), #3a3029); color:#fff; text-decoration:none; font-weight:800; box-shadow:0 14px 40px rgba(24,19,13,.14);
}
button.careSharePill{ cursor:pointer; }
.careSharePill.secondary{ background:rgba(255,255,255,.96); font-weight:700; color:#2d2925; }
.careShareGlyph{ font-size:16px; line-height:1; color:var(--care-card-accent-2); }
.careShareOverlay.hidden{ display:none !important; }
.careShareOverlay{ position:fixed; inset:0; z-index:90; }
.careShareBackdrop{ position:absolute; inset:0; background:rgba(33,26,18,.45); backdrop-filter:blur(6px); }
.careSharePanel{
  position:relative; width:min(1080px, calc(100vw - 24px)); max-height:calc(100vh - 28px); overflow:auto; margin:14px auto;
  border-radius:30px; border:1px solid rgba(58,53,46,.12); background:linear-gradient(180deg, rgba(255,252,247,.99), rgba(247,240,230,.99));
  box-shadow:0 28px 80px rgba(16,12,9,.22); padding:22px;
}
.careShareClose{
  position:absolute; top:14px; right:14px; width:42px; height:42px; border:none; border-radius:999px; cursor:pointer;
  background:rgba(58,53,46,.08); color:#2d2925; font-size:24px;
}
.careShareGrid{ display:grid; grid-template-columns:minmax(0, 420px) minmax(0, 1fr); gap:24px; align-items:start; }
.careShareLead{ margin-top:0; color:var(--muted); line-height:1.55; }
.careSharePreview{
  min-height:clamp(430px,65vh,540px); border-radius:28px; border:3px solid #231f1c; background:linear-gradient(180deg, var(--care-card-wash), var(--care-card-paper));
  padding:26px; display:flex; flex-direction:column; gap:16px; position:relative; overflow:hidden;
  box-shadow: inset 0 0 0 1px rgba(35,31,28,.06);
}
.careSharePreview::before{ content:""; position:absolute; left:18px; right:18px; top:16px; height:10px; border-radius:999px; background:linear-gradient(90deg, var(--care-card-accent), var(--care-card-accent-2)); }
.careSharePreview::after{ content:"Discover Bunnies • little card"; position:absolute; top:34px; right:24px; padding:8px 12px; border-radius:999px; background:rgba(255,255,255,.74); border:1px solid rgba(35,31,28,.10); font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#6e5f4f; }
.careSharePreviewInk{ position:absolute; inset:0; pointer-events:none; }
.careSharePreviewInk::before,
.careSharePreviewInk::after{
  content:""; position:absolute; border:2px solid rgba(35,31,28,.18); border-radius:999px; transform:rotate(-10deg);
}
.careSharePreviewInk::before{ width:160px; height:70px; right:36px; top:42px; }
.careSharePreviewInk::after{ width:98px; height:44px; right:56px; top:58px; }
.careShareBadge{
  position:relative; z-index:1; display:inline-flex; align-items:center; gap:8px; width:max-content; max-width:calc(100% - 190px); flex-wrap:wrap; margin-top:42px;
  border:1px solid rgba(35,31,28,.18); background:rgba(255,255,255,.78); border-radius:999px; padding:8px 12px;
  font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#5a4c3f;
}
.careShareTitle{ position:relative; z-index:1; margin:4px 0 0; font-size:clamp(1.8rem, 3vw, 2.4rem); line-height:1.08; color:#211d19; }
.careShareBody{ position:relative; z-index:1; margin:0; color:#54473a; line-height:1.55; font-size:1rem; }
.careShareBulletList{ position:relative; z-index:1; display:grid; gap:10px; align-content:start; }
.careShareBullet{
  display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border-radius:18px; border:1px solid rgba(35,31,28,.10); background:rgba(255,255,255,.64);
  color:#3f352d; line-height:1.45;
}
.careShareBulletDot{ width:10px; height:10px; border-radius:999px; background:linear-gradient(180deg, var(--care-card-accent), var(--care-card-ink)); flex:0 0 auto; margin-top:6px; }
.careShareFooter{
  position:relative; z-index:1; margin-top:auto; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:flex-end; row-gap:8px;
  border-top:1px dashed rgba(35,31,28,.20); padding-top:14px; color:#625446; font-size:13px;
}
.careShareFooter strong{ display:block; color:#241f1b; font-size:15px; }
.careShareMeta{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--care-card-soft); font-weight:800; }
.careShareActionGrid{ display:grid; gap:12px; }
.careShareActionRow{ display:flex; gap:10px; flex-wrap:wrap; }
.careShareAction{
  border:none; cursor:pointer; border-radius:16px; padding:12px 16px; font-weight:800; background:linear-gradient(135deg, var(--care-card-ink), #3a3029); color:#fffaf0;
}
.careShareAction.alt{ background:rgba(255,255,255,.88); color:#2c2723; border:1px solid rgba(35,31,28,.14); }
.careShareStatus{ min-height:22px; color:var(--care-card-soft); font-size:14px; font-weight:700; }
.careSharePhoneNote{ margin:-4px 0 0; color:#66584b; font-size:.95rem; line-height:1.55; }
.careShareHintCard,.careShareMiniHubCard,.littleCardCard{
  border:1px solid rgba(58,53,46,.12); border-radius:22px; background:linear-gradient(180deg, var(--care-card-wash-2), #fffdf9); padding:18px;
}
.careShareHintCard h3,.careShareMiniHubCard h3,.littleCardCard h2{ margin-top:0; }
.careShareHintList{ display:grid; gap:10px; color:#53483d; }
.careShareMiniHubGrid,.littleCardGrid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:12px; }
.careMiniTile,.littleCardTile{
  display:grid; gap:10px; padding:14px; border-radius:18px; border:1px solid rgba(35,31,28,.10); background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(247,240,230,.94));
}
.careMiniTileMeta,.littleCardMeta{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:#7d6a57; font-weight:800; }
.careMiniTile h4,.littleCardTile h3{ margin:0; font-size:1.02rem; }
.careMiniTile p,.littleCardTile p{ margin:0; color:#574b3f; line-height:1.5; }
.careMiniTileActions,.littleCardActions{ display:flex; gap:8px; flex-wrap:wrap; }
.careMiniTileActions a,.littleCardActions a{
  text-decoration:none; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; padding:9px 12px; font-weight:700; border:1px solid rgba(35,31,28,.14); color:#2b2723; background:rgba(255,255,255,.78);
}
.miniHubShell{ width:min(100% - 28px, 1120px); }
.miniHubHero{ grid-template-columns:minmax(0,1.1fr) minmax(290px,.9fr); }
.littleCardHeroCard{
  min-height:100%; border-radius:28px; border:3px solid #231f1c; background:linear-gradient(180deg, #fffdf8, #f6efe4); padding:22px; position:relative; overflow:hidden;
}
.littleCardHeroCard::before{ content:""; position:absolute; left:18px; right:18px; top:16px; height:10px; border-radius:999px; background:linear-gradient(90deg, var(--care-card-accent), var(--care-card-accent-2)); }
.littleCardHeroCard::after{ content:"Discover Bunnies • care card"; position:absolute; top:34px; right:24px; padding:8px 12px; border-radius:999px; background:rgba(255,255,255,.74); border:1px solid rgba(35,31,28,.10); font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#6e5f4f; }
.littleCardHeroMeta{ position:relative; z-index:1; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:#6e5f4f; font-weight:800; margin-top:38px; }
.littleCardHeroTitle{ position:relative; z-index:1; margin:12px 0 10px; font-size:2rem; line-height:1.05; }
.littleCardHeroText{ position:relative; z-index:1; margin:0; color:#4e4338; line-height:1.55; }
.littleCardBulletList{ position:relative; z-index:1; display:grid; gap:10px; margin-top:16px; }
.littleCardBullet{ display:flex; gap:10px; padding:12px 14px; border-radius:18px; border:1px solid rgba(35,31,28,.10); background:rgba(255,255,255,.64); color:#3d342d; }
.littleCardBullet::before{ content:""; width:10px; height:10px; border-radius:999px; background:linear-gradient(180deg, var(--care-card-accent), var(--care-card-ink)); flex:0 0 auto; margin-top:6px; }
.littleCardSourceRow{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
.littleCardSourceRow a{ text-decoration:none; }
.littleCardTagRow{ display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.littleCardTag{ border:1px solid rgba(35,31,28,.14); border-radius:999px; padding:7px 10px; background:rgba(255,255,255,.7); color:#4b4036; font-size:12px; font-weight:700; }
@media (max-width: 900px){
  .careShareGrid,.miniHubHero{ grid-template-columns:1fr; }
  .careSharePreview{ min-height:500px; }
  .careShareActionRow{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 640px){
  .careShareOverlay{ display:grid; align-items:end; }
  .careShareDock{ left:12px; right:12px; bottom:12px; padding-bottom:max(0px,env(safe-area-inset-bottom)); }
  .careSharePill{ flex:1 1 auto; justify-content:center; min-height:48px; }
  .careSharePanel{ width:100vw; max-height:100dvh; margin:0; padding:18px 16px calc(20px + env(safe-area-inset-bottom)); border-radius:24px 24px 0 0; }
  .careShareActionRow{ grid-template-columns:1fr; position:sticky; top:-2px; z-index:2; padding-top:8px; background:linear-gradient(180deg, rgba(255,252,247,.99) 78%, rgba(247,240,230,.72)); }
  .careShareAction{ min-height:48px; justify-content:center; }
  .careSharePreview{ min-height:clamp(340px,50svh,460px); padding:24px 20px 20px; }
  .careSharePreview::after,.littleCardHeroCard::after{ position:static; display:inline-flex; margin:12px 0 0; }
  .careShareFooter{ flex-direction:column; align-items:flex-start; }
  .careShareClose{ top:10px; right:10px; width:46px; height:46px; }
}
@media print{
  .careShareDock,.careShareOverlay{ display:none !important; }
}

.careSharePreview .fieldSymbolPlate{position:relative;z-index:1;max-width:230px;margin-top:8px}
.careShareDock .careSharePill{min-height:46px}


/* breakpoint sanity pass 1098 */
@media (max-width: 900px){
  .careShareHintCard,.careShareMiniHubCard,.littleCardCard{padding:16px}
}
@media (max-width: 640px){
  .careShareBadge{max-width:100%;margin-top:34px}
  .careShareTitle{font-size:clamp(1.55rem, 8vw, 2rem)}
  .careShareBody{font-size:.96rem}
  .careShareBullet{padding:11px 12px}
  .careShareMiniHubGrid,.littleCardGrid{grid-template-columns:1fr}
  .careMiniTileActions a,.littleCardActions a{width:100%;justify-content:center}
}
