/* Calculator styles are scoped so this plugin also works with another theme. */
.ywn-fit-tool {
  --ywn-ink: #183c30;
  --ywn-body: #46534b;
  --ywn-muted: #68746b;
  --ywn-line: #dcded4;
  --ywn-sage: #e6ebdf;
  --ywn-white: #fffefa;
  --ywn-serif: Georgia, 'Times New Roman', serif;
  --ywn-sans: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  min-width: 0;
  color: var(--ywn-body);
  font: 16px/1.65 var(--ywn-sans);
}
.ywn-fit-tool *, .ywn-fit-tool *::before, .ywn-fit-tool *::after { box-sizing: border-box; }
.ywn-fit-tool p, .ywn-fit-tool h2, .ywn-fit-tool h3 { margin: 0; }
.ywn-fit-tool p + p { margin-top: 1em; }
.ywn-fit-tool a { color: inherit; text-underline-offset: .22em; }
.ywn-fit-tool button, .ywn-fit-tool input, .ywn-fit-tool select { font: inherit; -webkit-tap-highlight-color: transparent; }
.ywn-fit-tool button, .ywn-fit-tool a { touch-action: manipulation; }
.ywn-fit-tool button { cursor: pointer; }
.ywn-fit-tool :focus-visible { outline: 3px solid #96733d; outline-offset: 5px; }
.ywn-fit-tool .fit-form { margin: 0; background: var(--ywn-white); border: 1px solid var(--ywn-line); padding: 30px; }
.ywn-fit-tool .form-top { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding-bottom: 24px; border-bottom: 1px solid var(--ywn-line); margin-bottom: 26px; }
.ywn-fit-tool label { font-size: 12px; color: var(--ywn-ink); font-weight: 550; display: block; margin: 0; }
.ywn-fit-tool label small { display: block; font-size: 11px; color: var(--ywn-muted); font-weight: 400; margin: 5px 0 8px; line-height: 1.5; }
.ywn-fit-tool input, .ywn-fit-tool select { display: block; width: 100%; min-height: 45px; height: auto; border: 1px solid #bac3b3; background: var(--ywn-white); color: var(--ywn-ink); border-radius: 0; padding: 9px 11px; box-shadow: none; }
.ywn-fit-tool select { margin-top: 8px; }
.ywn-fit-tool .fit-form fieldset { border: 0; padding: 0; margin: 0 0 27px; min-width: 0; }
.ywn-fit-tool .fit-form legend { float: none; width: auto; font-family: var(--ywn-serif); font-size: 24px; color: var(--ywn-ink); margin-bottom: 14px; padding: 0; }
.ywn-fit-tool .fit-form legend span { font-family: var(--ywn-sans); font-size: 10px; letter-spacing: .02em; color: var(--ywn-muted); margin-left: 6px; }
.ywn-fit-tool .form-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.ywn-fit-tool .form-help { font-size: 11px; line-height: 1.7; color: var(--ywn-muted); margin-top: 10px; }
.ywn-fit-tool .form-actions { display: flex; align-items: center; gap: 20px; margin-top: 25px; flex-wrap: wrap; }
.ywn-fit-tool .button { display: inline-flex; align-items: center; justify-content: center; gap: 25px; min-height: 49px; padding: 12px 21px; background: var(--ywn-ink); color: var(--ywn-white); text-decoration: none; border: 1px solid var(--ywn-ink); border-radius: 0; font-size: 13px; font-weight: 550; line-height: 1.5; box-shadow: none; }
.ywn-fit-tool .button:hover { background: #285140; color: white; }
.ywn-fit-tool .plain-button { background: none; border: 0; border-bottom: 1px solid #9ca98e; border-radius: 0; box-shadow: none; color: var(--ywn-ink); padding: 3px 0; font-size: 12px; line-height: 1.65; min-height: 0; }
.ywn-fit-tool .fit-result { margin-top: 26px; padding: 24px; background: var(--ywn-sage); border: 1px solid #bac7ab; }
.ywn-fit-tool .fit-result:empty, .ywn-fit-tool .fit-result[hidden] { display: none; }
.ywn-fit-tool [hidden] { display: none !important; }
.ywn-fit-tool .fit-result h2, .ywn-fit-tool .fit-result h3 { font-family: var(--ywn-serif); font-size: 27px; font-weight: 400; line-height: 1.2; letter-spacing: -.02em; color: var(--ywn-ink); margin-bottom: 13px; }
.ywn-fit-tool .fit-result p, .ywn-fit-tool .fit-result li { font-size: 13px; line-height: 1.8; }
.ywn-fit-tool .fit-result ul { padding-left: 18px; }
.ywn-fit-tool .fit-result .eyebrow { color: var(--ywn-ink); display: flex; align-items: center; gap: 10px; letter-spacing: .15em; text-transform: uppercase; font-weight: 650; font-size: 9px; margin-bottom: 13px; }
.ywn-fit-tool .fit-result .eyebrow::before { content: ''; width: 22px; height: 1px; background: currentColor; }
.ywn-fit-tool .fit-axis-results { margin: 20px 0; }
.ywn-fit-tool .fit-axis { display: grid; grid-template-columns: 62px 1fr; gap: 12px; border-top: 1px solid #bbc7ae; padding: 11px 0; font-size: 12px; }
.ywn-fit-tool .fit-axis dt { font-weight: 600; color: var(--ywn-ink); }
.ywn-fit-tool .fit-axis dd { margin: 0; line-height: 1.7; }
.ywn-fit-tool .fit-axis--interference dd { color: #843e22; }
.ywn-fit-tool .fit-axis--unknown dd { color: var(--ywn-muted); }
.ywn-fit-tool .fit-explanation { margin-bottom: 14px; }
.ywn-fit-tool .fit-result .small { font-size: 11px; }
.ywn-fit-tool .muted { color: var(--ywn-muted); }
.ywn-fit-tool .fit-result[data-status="interference"], .ywn-fit-tool .fit-result[data-status="invalid"] { background: #f1e7da; border-color: #c8ae91; }
.ywn-fit-tool .fit-result[data-status="borderline"] { background: #f0ecda; border-color: #c6bc91; }
.ywn-fit-tool input[aria-invalid="true"] { border-color: #914a2d; outline: 1px solid #914a2d; }
.ywn-fit-tool .private-note { font-size: 11px; color: var(--ywn-muted); margin-top: 20px; }
.ywn-fit-tool .fit-form .fit-controls { margin: 0; }
.ywn-fit-tool .fit-controls:disabled { opacity: .6; }
.ywn-fit-tool .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.ywn-fit-editor { background: #e6ebdf; border: 1px solid #bac7ab; color: #183c30; padding: 24px; font: 14px/1.7 -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.ywn-fit-editor p { margin: 12px 0; }
.ywn-fit-editor strong { font-size: 19px; }
.ywn-fit-editor small { display: block; color: #46534b; }
@media (max-width: 1020px) { .ywn-fit-tool .fit-form { padding: 24px; } }
@media (max-width: 560px) {
  .ywn-fit-tool .fit-form { padding: 23px 19px; }
  .ywn-fit-tool .form-top, .ywn-fit-tool .form-pair { gap: 13px; }
  .ywn-fit-tool label { font-size: 11px; }
  .ywn-fit-tool label small { font-size: 10px; min-height: 30px; }
  .ywn-fit-tool input, .ywn-fit-tool select { font-size: 16px; }
  .ywn-fit-tool .fit-form legend { font-size: 23px; }
  .ywn-fit-tool .form-actions { gap: 17px; }
  .ywn-fit-tool .button { font-size: 12px; min-height: 48px; }
}
