/* ===================================================================
   BODY TYPE CALCULATOR — scoped under .btc- to avoid theme conflicts
   Vanilla CSS. No external fonts/libraries loaded — system stack only
   for maximum WordPress performance.
=================================================================== */
.btc-root{
  --btc-bg:#F3F6F5;
  --btc-surface:#FFFFFF;
  --btc-ink:#182422;
  --btc-muted:#5E6D69;
  --btc-primary:#0E9A7E;
  --btc-primary-dark:#0A7562;
  --btc-primary-soft:#E1F5EF;
  --btc-accent:#FF7A59;
  --btc-accent-dark:#E85F3D;
  --btc-border:#E1E8E5;
  --btc-danger:#D6604D;
  --btc-good:#0E9A7E;
  --btc-radius:16px;
  --btc-font: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --btc-font-heading: var(--btc-font);
  /* Admin-controlled scales — set from Body Types > Appearance.
     --btc-scale switches automatically between desktop/mobile below. */
  --btc-scale-desktop: 1;
  --btc-scale-mobile: 1;
  --btc-scale: var(--btc-scale-desktop, 1);
  --btc-space: 1;
  /* Per-element typography overrides — set from Body Types > Appearance >
     Typography. Each has a sensible default via the var() fallback, so
     nothing breaks until the admin explicitly sets a value. */
  --btc-size-h1: 26px; --btc-weight-h1: 800;
  --btc-size-sub: 14.5px; --btc-weight-sub: 400;
  --btc-size-steptitle: 18px; --btc-weight-steptitle: 700;
  --btc-size-stephint: 13.5px; --btc-weight-stephint: 400;
  --btc-size-resulttitle: 30px; --btc-weight-resulttitle: 800;
  --btc-size-body: 13.5px; --btc-weight-body: 400;
  font-family:var(--btc-font);
  color:var(--btc-ink);
  background:var(--btc-bg);
  padding:32px 16px 64px;
  box-sizing:border-box;
}
.btc-root *{box-sizing:border-box;}
.btc-wrap{max-width:640px;margin:0 auto;}
@media (max-width:480px){ .btc-root{ --btc-scale: var(--btc-scale-mobile, 1); } }

/* Eyebrow / label style */
.btc-eyebrow{
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:calc(11px * var(--btc-scale,1));
  font-weight:700;
  color:var(--btc-primary);
  margin:0 0 4px;
}
.btc-h1{font-family:var(--btc-font-heading);font-size:calc(var(--btc-size-h1) * var(--btc-scale,1));font-weight:var(--btc-weight-h1);letter-spacing:-.01em;margin:0 0 calc(4px * var(--btc-space,1));line-height:1.15;}
.btc-sub{color:var(--btc-muted);font-size:calc(var(--btc-size-sub) * var(--btc-scale,1));font-weight:var(--btc-weight-sub);line-height:1.45;margin:0 0 calc(8px * var(--btc-space,1));}

/* Progress rail */
.btc-progress{display:flex;align-items:center;gap:6px;margin-bottom:calc(10px * var(--btc-space,1));}
.btc-progress-seg{flex:1;height:4px;border-radius:99px;background:var(--btc-border);overflow:hidden;}
.btc-progress-seg i{display:block;height:100%;width:0%;background:var(--btc-primary);transition:width .35s ease;}
.btc-progress-label{font-size:calc(12px * var(--btc-scale,1));color:var(--btc-muted);white-space:nowrap;font-weight:600;}

/* Card */
.btc-card{
  background:var(--btc-surface);
  border:1px solid var(--btc-border);
  border-radius:var(--btc-radius);
  padding:28px 24px;
  box-shadow:0 1px 2px rgba(14,154,126,.04), 0 12px 32px rgba(14,154,126,.08);
}
.btc-step{display:none;animation:btcFade .35s ease;}
.btc-step.active{display:block;}
@keyframes btcFade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}
@media (prefers-reduced-motion:reduce){.btc-step{animation:none;}}

.btc-step-title{font-family:var(--btc-font-heading);font-size:calc(var(--btc-size-steptitle) * var(--btc-scale,1));font-weight:var(--btc-weight-steptitle);margin:0 0 3px;}
.btc-step-hint{font-size:calc(var(--btc-size-stephint) * var(--btc-scale,1));font-weight:var(--btc-weight-stephint);color:var(--btc-muted);margin:0 0 calc(8px * var(--btc-space,1));}

/* Choice pills (gender / unit) */
.btc-pillrow{display:flex;gap:10px;margin-bottom:calc(16px * var(--btc-space,1));}
.btc-pill{
  flex:1;padding:14px 10px;border:1.5px solid var(--btc-border);border-radius:12px;
  background:var(--btc-surface);font-weight:700;font-size:calc(14px * var(--btc-scale,1));color:var(--btc-muted);
  cursor:pointer;text-align:center;transition:.15s;-webkit-tap-highlight-color:transparent;
}
.btc-pill:hover{border-color:var(--btc-primary);color:var(--btc-primary-dark);}
.btc-pill.selected{border-color:var(--btc-primary);background:linear-gradient(135deg,var(--btc-primary-soft),#fff);color:var(--btc-primary-dark);box-shadow:0 2px 8px rgba(14,154,126,.15);}

/* Field group */
.btc-field{margin-bottom:calc(16px * var(--btc-space,1));}
.btc-field-head{display:flex;align-items:center;gap:6px;margin-bottom:10px;}
.btc-field-label{font-weight:700;font-size:calc(14.5px * var(--btc-scale,1));}
.btc-info-btn{
  width:18px;height:18px;border-radius:50%;border:1.5px solid var(--btc-border);
  background:none;color:var(--btc-muted);font-size:calc(11px * var(--btc-scale,1));font-weight:800;line-height:1;
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
}
.btc-info-btn:hover, .btc-info-btn[aria-expanded="true"]{border-color:var(--btc-primary);color:var(--btc-primary);}
.btc-info-panel{
  display:none;background:var(--btc-primary-soft);border:1px solid var(--btc-border);
  border-radius:10px;padding:12px 14px;font-size:calc(12.5px * var(--btc-scale,1));color:var(--btc-primary-dark);
  line-height:1.5;margin-top:8px;
}
.btc-info-panel.open{display:block;}

.btc-input-row{display:flex;align-items:center;gap:12px;}
.btc-slider{flex:1;-webkit-appearance:none;appearance:none;height:6px;border-radius:99px;background:var(--btc-border);outline:none;}
.btc-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--btc-primary);border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25);cursor:grab;}
.btc-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--btc-primary);border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25);cursor:grab;}
.btc-num{
  width:78px;padding:9px 8px;border:1.5px solid var(--btc-border);border-radius:9px;
  font-size:calc(14.5px * var(--btc-scale,1));font-weight:700;text-align:center;color:var(--btc-ink);font-family:var(--btc-font);
}
.btc-num:focus, .btc-slider:focus{outline:2px solid var(--btc-primary);outline-offset:2px;}

/* Optional toggle row */
.btc-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:var(--btc-bg);border:1px solid var(--btc-border);border-radius:10px;margin-bottom:16px;}
.btc-toggle-label{font-size:calc(13.5px * var(--btc-scale,1));font-weight:600;}
.btc-switch{position:relative;width:40px;height:22px;flex-shrink:0;}
.btc-switch input{opacity:0;width:0;height:0;}
.btc-switch-track{position:absolute;inset:0;background:var(--btc-border);border-radius:99px;transition:.2s;cursor:pointer;}
.btc-switch-track:before{content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;}
.btc-switch input:checked + .btc-switch-track{background:var(--btc-primary);}
.btc-switch input:checked + .btc-switch-track:before{transform:translateX(18px);}
.btc-optional-field{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.btc-optional-field.open{max-height:140px;}

/* Live proportion preview bars */
.btc-livebars{margin-top:6px;margin-bottom:24px;padding:16px;background:var(--btc-bg);border:1px solid var(--btc-border);border-radius:12px;}
.btc-livebar-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.btc-livebar-row:last-child{margin-bottom:0;}
.btc-livebar-label{width:64px;font-size:calc(11px * var(--btc-scale,1));font-weight:700;color:var(--btc-muted);text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;}
.btc-livebar-track{flex:1;height:10px;background:#fff;border:1px solid var(--btc-border);border-radius:99px;overflow:hidden;}
.btc-livebar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--btc-primary),var(--btc-accent));transition:width .25s ease;}

/* Nav buttons */
.btc-nav{display:flex;gap:10px;margin-top:8px;}
.btc-btn{
  flex:1;padding:14px 18px;border-radius:11px;font-weight:700;font-size:calc(14.5px * var(--btc-scale,1));
  border:1.5px solid transparent;cursor:pointer;font-family:var(--btc-font);
  transition:transform .12s ease, box-shadow .12s ease, background .15s ease, border-color .15s ease;
  -webkit-tap-highlight-color:transparent;
}
.btc-btn-primary{
  background:linear-gradient(135deg,var(--btc-primary),var(--btc-primary-dark));
  color:#fff;box-shadow:0 2px 8px rgba(14,154,126,.28);
}
.btc-btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(14,154,126,.34);}
.btc-btn-primary:active{transform:translateY(0);box-shadow:0 2px 6px rgba(14,154,126,.28);}
.btc-btn-ghost{background:var(--btc-surface);border-color:var(--btc-border);color:var(--btc-muted);}
.btc-btn-ghost:hover{border-color:var(--btc-primary);color:var(--btc-primary-dark);background:var(--btc-primary-soft);}
.btc-btn-accent{
  background:linear-gradient(135deg,var(--btc-accent),var(--btc-accent-dark));
  color:#fff;box-shadow:0 2px 8px rgba(255,122,89,.3);
}
.btc-btn-accent:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(255,122,89,.36);}
.btc-btn:disabled{opacity:.45;cursor:not-allowed;transform:none !important;box-shadow:none !important;}
.btc-btn-icon{margin-right:6px;font-size:calc(14px * var(--btc-scale,1));}

/* Review summary */
.btc-review{background:var(--btc-bg);border:1px solid var(--btc-border);border-radius:10px;padding:14px 16px;margin-bottom:20px;}
.btc-review-row{display:flex;justify-content:space-between;font-size:calc(13.5px * var(--btc-scale,1));padding:5px 0;border-bottom:1px dashed var(--btc-border);}
.btc-review-row:last-child{border-bottom:none;}
.btc-review-row span:first-child{color:var(--btc-muted);}
.btc-review-row span:last-child{font-weight:700;}

/* ===== RESULTS ===== */
.btc-result{display:none;}
.btc-result.active{display:block;animation:btcFade .4s ease;}
.btc-result-head{text-align:center;padding:2px 0 calc(6px * var(--btc-space,1));}
.btc-result-tag{display:inline-block;background:var(--btc-primary-soft);color:var(--btc-primary-dark);font-size:calc(11px * var(--btc-scale,1));font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:99px;margin-bottom:calc(4px * var(--btc-space,1));}
.btc-result-title{font-family:var(--btc-font-heading);font-size:calc(var(--btc-size-resulttitle) * var(--btc-scale,1));font-weight:var(--btc-weight-resulttitle);margin:0 0 2px;letter-spacing:-.01em;}
.btc-result-desc{font-size:calc(14.5px * var(--btc-scale,1));color:var(--btc-muted);max-width:460px;margin:0 auto;line-height:1.45;}

.btc-chart-wrap{display:flex;justify-content:center;margin:calc(6px * var(--btc-space,1)) 0;}
.btc-chart-caption{text-align:center;font-size:calc(11.5px * var(--btc-scale,1));color:var(--btc-muted);margin-top:3px;margin-bottom:calc(6px * var(--btc-space,1));}

.btc-ratio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:calc(13px * var(--btc-space,1));}
.btc-ratio-card{background:var(--btc-bg);border:1px solid var(--btc-border);border-radius:11px;padding:14px 10px;text-align:center;}
.btc-ratio-val{font-size:calc(20px * var(--btc-scale,1));font-weight:800;color:var(--btc-primary-dark);}
.btc-ratio-label{font-size:calc(10.5px * var(--btc-scale,1));color:var(--btc-muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700;margin-top:3px;}

.btc-section-title{font-family:var(--btc-font-heading);font-size:calc(14px * var(--btc-scale,1));font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--btc-ink);margin:calc(13px * var(--btc-space,1)) 0 calc(6px * var(--btc-space,1));display:flex;align-items:center;gap:8px;}
.btc-section-title:before{content:"";width:16px;height:2px;background:var(--btc-primary);display:inline-block;}

.btc-why{background:var(--btc-primary-soft);border-radius:11px;padding:16px 18px;font-size:calc(var(--btc-size-body) * var(--btc-scale,1));font-weight:var(--btc-weight-body);line-height:1.6;color:var(--btc-primary-dark);margin-bottom:8px;}

.btc-dolist{list-style:none;margin:0;padding:0;}
.btc-dolist li{display:flex;gap:10px;font-size:calc(13.5px * var(--btc-scale,1));line-height:1.5;padding:8px 0;border-bottom:1px solid var(--btc-border);}
.btc-dolist li:last-child{border-bottom:none;}
.btc-dolist.good li:before{content:"✓";color:var(--btc-good);font-weight:900;flex-shrink:0;}
.btc-dolist.bad li:before{content:"✕";color:var(--btc-danger);font-weight:900;flex-shrink:0;}

.btc-two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
@media (max-width:520px){.btc-two-col{grid-template-columns:1fr;gap:6px;}.btc-ratio-grid{grid-template-columns:1fr 1fr 1fr;}}

.btc-disclaimer{font-size:calc(11.5px * var(--btc-scale,1));color:var(--btc-muted);background:var(--btc-bg);border:1px solid var(--btc-border);border-radius:10px;padding:12px 14px;margin:calc(12px * var(--btc-space,1)) 0;line-height:1.5;}

.btc-share-row{display:flex;gap:10px;margin:calc(10px * var(--btc-space,1)) 0 6px;}

/* Dynamic "Learn more about your result" box — title + description, whole box is a link */
.btc-learnmore{margin-top:calc(14px * var(--btc-space,1));}
.btc-learnmore-link{display:block;padding:16px 18px;background:linear-gradient(135deg,var(--btc-primary-soft),#fff);border:1.5px solid var(--btc-primary);border-radius:12px;text-decoration:none;transition:.15s;}
.btc-learnmore-link:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(14,154,126,.16);}
.btc-learnmore-eyebrow{font-size:calc(10.5px * var(--btc-scale,1));font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--btc-primary-dark);margin-bottom:4px;}
.btc-learnmore-title{font-family:var(--btc-font-heading);font-size:calc(15.5px * var(--btc-scale,1));font-weight:800;color:var(--btc-ink);margin-bottom:3px;}
.btc-learnmore-desc{font-size:calc(12.5px * var(--btc-scale,1));color:var(--btc-muted);line-height:1.5;}

.btc-restart{text-align:center;margin-top:calc(10px * var(--btc-space,1));}
.btc-restart button{background:none;border:none;color:var(--btc-muted);font-size:calc(12.5px * var(--btc-scale,1));text-decoration:underline;cursor:pointer;font-family:var(--btc-font);}

/* Celebrity / style reference chips */
.btc-celebs-wrap{margin-top:8px;}
.btc-celebs-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.btc-celeb-chip{background:var(--btc-bg);border:1px solid var(--btc-border);border-radius:99px;padding:6px 14px;font-size:calc(12.5px * var(--btc-scale,1));font-weight:600;color:var(--btc-ink);}
.btc-celebs-note{font-size:calc(11px * var(--btc-scale,1));color:var(--btc-muted);margin-top:6px;font-style:italic;}

.btc-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--btc-ink);color:#fff;padding:10px 18px;border-radius:99px;font-size:calc(13px * var(--btc-scale,1));font-weight:600;opacity:0;pointer-events:none;transition:.25s;z-index:999;}
.btc-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* "Explore more" related links grid — 3 columns desktop, 2 columns mobile.
   Content is fully admin-controlled from Dashboard > Body Types > Related Links. */
.btc-explore{margin-top:calc(14px * var(--btc-space,1));}
.btc-explore-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px;}
.btc-explore-card{display:block;padding:14px 14px;background:var(--btc-bg);border:1px solid var(--btc-border);border-radius:11px;text-decoration:none;transition:.15s;}
.btc-explore-card:hover{border-color:var(--btc-primary);transform:translateY(-1px);box-shadow:0 4px 12px rgba(14,154,126,.14);background:var(--btc-primary-soft);}
.btc-explore-title{font-family:var(--btc-font-heading);font-size:calc(12.5px * var(--btc-scale,1));font-weight:800;color:var(--btc-ink);line-height:1.35;}
.btc-explore-desc{font-size:calc(11px * var(--btc-scale,1));color:var(--btc-muted);margin-top:3px;line-height:1.4;}

/* ===================================================================
   MOBILE RESPONSIVE — buttons/text scale down on small screens so
   nothing looks oversized on phones.
=================================================================== */
@media (max-width:480px){
  .btc-root{padding:20px 12px 48px;}
  .btc-card{padding:20px 16px;}
  .btc-h1{font-size:calc(21px * var(--btc-scale,1));}
  .btc-sub{font-size:calc(13.5px * var(--btc-scale,1));margin-bottom:22px;}
  .btc-step-title{font-size:calc(16.5px * var(--btc-scale,1));}
  .btc-pill{padding:10px 4px;font-size:calc(11.5px * var(--btc-scale,1));}
  .btc-btn{padding:12px 14px;font-size:calc(13.5px * var(--btc-scale,1));border-radius:10px;}
  .btc-nav{gap:8px;}
  .btc-result-title{font-size:calc(23px * var(--btc-scale,1));}
  .btc-result-desc{font-size:calc(13.5px * var(--btc-scale,1));}
  .btc-ratio-grid{gap:8px;}
  .btc-ratio-card{padding:11px 6px;}
  .btc-ratio-val{font-size:calc(17px * var(--btc-scale,1));}
  .btc-share-row{flex-direction:column;gap:10px;margin:18px 0 4px;}
  .btc-share-row .btc-btn{width:100%;}
  .btc-num{width:64px;padding:8px 6px;font-size:calc(13.5px * var(--btc-scale,1));}
  .btc-explore-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:360px){
  .btc-pillrow{gap:5px;}
  .btc-pill{font-size:calc(10.5px * var(--btc-scale,1));padding:9px 3px;}
  .btc-btn{font-size:calc(12.5px * var(--btc-scale,1));padding:11px 10px;}
}