/* Shared semantic marker: the primary tool heading lives inside the tool/app root.
   Module-specific CSS remains authoritative for visual styling. */
.pxl-tool-heading-slot{min-width:0}

.pxl-sdk-tool{
  width:100%;max-width:900px;padding:22px;
  border:1px solid var(--pxl-border,#273142);border-radius:var(--pxl-radius-lg,16px);
  background:var(--pxl-tool-card,var(--pxl-surface,#111821));color:var(--pxl-text,#dfe5eb);
  font-family:var(--pxl-font,inherit);box-sizing:border-box
}
.pxl-sdk-tool,.pxl-sdk-tool *{box-sizing:border-box}
.pxl-sdk-tool__header{margin:0 0 20px}
.pxl-sdk-tool__title{margin:0 0 7px;color:var(--pxl-text-strong,#e8edf2);font-size:var(--pxl-font-size-xl,1.55rem);line-height:1.2;font-weight:var(--pxl-weight-bold,700);letter-spacing:var(--pxl-letter-heading,-.012em)}
.pxl-sdk-tool__description{max-width:720px;margin:0;color:var(--pxl-text-soft,var(--pxl-muted,#8e99a6));font-size:var(--pxl-font-size-sm,.94rem);line-height:var(--pxl-line-height-body,1.55)}
.pxl-sdk-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.pxl-sdk-field{min-width:0}
.pxl-sdk-field label{display:block;margin:0 0 7px;color:var(--pxl-text-strong,#e8edf2);font-size:var(--pxl-font-size-base,.95rem);font-weight:var(--pxl-weight-semibold,600);line-height:1.35}
.pxl-sdk-unit{color:var(--pxl-muted,#8e99a6);font-weight:var(--pxl-weight-regular,400)}
.pxl-sdk-inputWrap{position:relative;display:block}
.pxl-sdk-field input:not([type=checkbox]):not([type=range]),.pxl-sdk-field select{
  display:block;width:100%;min-height:48px;padding:0 14px;
  border:1px solid var(--pxl-border,#30363d);border-radius:var(--pxl-radius-md,10px);
  outline:0;background:var(--pxl-input-bg,var(--pxl-surface-2,#0d1117));color:var(--pxl-text-input,var(--pxl-text,#dfe5eb));
  font:inherit;font-size:var(--pxl-font-size-md,1rem);line-height:1;box-shadow:none;transition:border-color .12s ease,box-shadow .12s ease
}
.pxl-sdk-inputWrap input:not([type=checkbox]):not([type=range]){padding-right:62px}
.pxl-sdk-inputUnit{position:absolute;right:14px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--pxl-muted,#8e99a6);font-size:var(--pxl-font-size-sm,.86rem);font-weight:var(--pxl-weight-medium,500)}
.pxl-sdk-field input:not([type=checkbox]):not([type=range]):hover,.pxl-sdk-field select:hover{border-color:var(--pxl-hover-border,var(--pxl-border,#30363d))}
.pxl-sdk-field input:not([type=checkbox]):not([type=range]):focus,.pxl-sdk-field select:focus{border-color:var(--pxl-primary,#2f81f7);box-shadow:0 0 0 3px var(--pxl-primary-ring,rgba(47,129,247,.16))}
.pxl-sdk-help{margin:7px 0 0;color:var(--pxl-muted,#8e99a6);font-size:var(--pxl-font-size-sm,.84rem);line-height:1.45}
.pxl-sdk-actions{display:flex;align-items:center;gap:12px;margin-top:20px}
.pxl-sdk-calculate{
  appearance:none;display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;
  border:1px solid var(--pxl-primary,#2f81f7);border-radius:var(--pxl-radius-md,10px);
  background:var(--pxl-primary,#2f81f7);color:var(--pxl-on-primary,#fff)!important;text-decoration:none!important;
  font:inherit;font-size:var(--pxl-font-size-base,.91rem);font-weight:var(--pxl-weight-bold,700);line-height:1;letter-spacing:.01em;cursor:pointer;box-shadow:none;transition:none
}
.pxl-sdk-calculate:hover,.pxl-sdk-calculate:focus,.pxl-sdk-calculate:visited{background:var(--pxl-primary-hover,var(--pxl-primary,#2f81f7));border-color:var(--pxl-primary-hover,var(--pxl-primary,#2f81f7));color:var(--pxl-on-primary,#fff)!important}
.pxl-sdk-calculate:focus-visible{outline:3px solid var(--pxl-primary-ring,rgba(47,129,247,.18));outline-offset:2px}
.pxl-sdk-calculate:disabled{opacity:.58;cursor:wait}
.pxl-sdk-busy{color:var(--pxl-muted,#8e99a6);font-size:var(--pxl-font-size-sm,.88rem)}
.pxl-sdk-errors{margin-top:12px;padding:10px 12px;border:1px solid var(--pxl-danger-border,currentColor);border-radius:var(--pxl-radius-sm,8px);background:var(--pxl-danger-bg,transparent);color:var(--pxl-danger-text,var(--pxl-danger,#ef4444));font-size:var(--pxl-font-size-sm,.88rem);line-height:1.45}
.pxl-sdk-results{margin-top:20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.pxl-sdk-result{border:1px solid var(--pxl-border,#273142);border-radius:var(--pxl-radius-md,12px);padding:15px;background:var(--pxl-tool-card-soft,var(--pxl-surface-2,#151c25))}
.pxl-sdk-result__label{display:block;margin-bottom:5px;color:var(--pxl-muted,#8e99a6);font-size:var(--pxl-font-size-sm,.82rem);font-weight:var(--pxl-weight-semibold,600);line-height:1.35}
.pxl-sdk-result__value{display:block;color:var(--pxl-text-strong,#e8edf2);font-size:var(--pxl-font-size-2xl,1.35rem);font-weight:var(--pxl-weight-bold,700);line-height:1.15;letter-spacing:-.015em}
.pxl-sdk-result__value small{font-size:var(--pxl-font-size-sm,.72em);font-weight:var(--pxl-weight-medium,500);color:var(--pxl-muted,#8e99a6)}
.pxl-sdk-result--hero{grid-column:1/-1;padding:17px 18px;background:var(--pxl-neutral-bg,var(--pxl-tool-card-soft,var(--pxl-surface-2,#151c25)));border-color:var(--pxl-neutral-border,var(--pxl-border,#273142))}
.pxl-sdk-result--hero .pxl-sdk-result__label{margin-bottom:6px;color:var(--pxl-text-soft,var(--pxl-muted,#8e99a6))}
.pxl-sdk-result--hero .pxl-sdk-result__value{font-size:var(--pxl-font-size-3xl,2.15rem)}
.pxl-sdk-result--recommendations{grid-column:1/-1;padding:17px}
.pxl-sdk-result__heading{margin:0 0 14px;color:var(--pxl-text-strong,#e8edf2);font-size:var(--pxl-font-size-lg,1.05rem);font-weight:var(--pxl-weight-bold,700)}
.pxl-sdk-recommendation{padding:14px 0;border-top:1px solid var(--pxl-divider,var(--pxl-border,#273142))}
.pxl-sdk-recommendation:first-of-type{padding-top:0;border-top:0}.pxl-sdk-recommendation:last-child{padding-bottom:0}
.pxl-sdk-recommendation header{margin-bottom:10px}.pxl-sdk-recommendation h4{margin:0 0 3px;color:var(--pxl-text-strong,#e8edf2);font-size:var(--pxl-font-size-base,.95rem);font-weight:var(--pxl-weight-semibold,600)}
.pxl-sdk-recommendation--exact h4:before{content:'↔';color:var(--pxl-primary,#5aa9ff);margin-right:7px}.pxl-sdk-recommendation--shorter h4:before{content:'↑';color:var(--pxl-success,#44c47d);margin-right:7px}.pxl-sdk-recommendation--longer h4:before{content:'↓';color:var(--pxl-warning,#f4a340);margin-right:7px}
.pxl-sdk-recommendation header p,.pxl-sdk-recommendation__empty{margin:0;color:var(--pxl-muted,#8e99a6);font-size:var(--pxl-font-size-sm,.84rem);line-height:1.45}
.pxl-sdk-pairs{display:grid;grid-template-columns:repeat(auto-fit,minmax(126px,1fr));gap:8px}
.pxl-sdk-pair{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;padding:10px 11px;border:1px solid var(--pxl-border,#273142);border-radius:var(--pxl-radius-sm,10px);background:var(--pxl-subtle-bg,var(--pxl-tool-card-soft,var(--pxl-surface-2,#151c25)))}
.pxl-sdk-pair__teeth{color:var(--pxl-text-strong,#e8edf2);font-size:var(--pxl-font-size-lg,1.04rem)}.pxl-sdk-pair__ratio{color:var(--pxl-text-soft,var(--pxl-muted,#8e99a6));font-size:var(--pxl-font-size-sm,.84rem)}
.pxl-sdk-pair__badge{display:inline-flex;margin:3px 0 1px;padding:3px 7px;border-radius:var(--pxl-radius-pill,999px);background:var(--pxl-selected-bg,transparent);border:1px solid var(--pxl-selected-border,var(--pxl-border,#273142));color:var(--pxl-selected-text,var(--pxl-primary,#5aa9ff));font-size:var(--pxl-font-size-xs,.66rem);font-weight:var(--pxl-weight-bold,700);line-height:1.25}
.pxl-sdk-pair__note{color:var(--pxl-muted,#8e99a6);font-size:var(--pxl-font-size-xs,.76rem);line-height:1.3}.pxl-sdk-pair--exact{border-color:color-mix(in srgb,var(--pxl-primary,#5aa9ff) 34%,var(--pxl-border,#273142))}.pxl-sdk-pair--shorter{border-color:color-mix(in srgb,var(--pxl-success,#44c47d) 30%,var(--pxl-border,#273142))}.pxl-sdk-pair--longer{border-color:color-mix(in srgb,var(--pxl-warning,#f4a340) 30%,var(--pxl-border,#273142))}
@media(max-width:680px){.pxl-sdk-tool{padding:16px}.pxl-sdk-fields,.pxl-sdk-results{grid-template-columns:1fr}.pxl-sdk-actions{margin-top:17px}.pxl-sdk-calculate{width:100%}.pxl-sdk-result--recommendations{padding:14px}.pxl-sdk-pairs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:390px){.pxl-sdk-pairs{grid-template-columns:1fr}}

/* Tool SDK 2.6: generic grouped input composition. Values/colors remain Theme-owned. */
.pxl-sdk-fieldGroups{display:grid;gap:16px}
.pxl-sdk-fieldGroup{min-width:0;padding:16px;border:1px solid var(--pxl-border,#273142);border-radius:var(--pxl-radius-md,12px);background:var(--pxl-subtle-bg,var(--pxl-surface-2,#151c25))}
.pxl-sdk-fieldGroup__header{margin:0 0 14px}
.pxl-sdk-fieldGroup__title{margin:0;color:var(--pxl-text-strong,#e8edf2);font-size:var(--pxl-font-size-lg,1.03rem);font-weight:var(--pxl-weight-bold,700);line-height:1.3}
.pxl-sdk-fieldGroup__description{max-width:720px;margin:5px 0 0;color:var(--pxl-text-soft,var(--pxl-muted,#8e99a6));font-size:var(--pxl-font-size-sm,.84rem);line-height:1.5}
.pxl-sdk-fieldGroup .pxl-sdk-fields{gap:14px 18px}
@media(max-width:680px){.pxl-sdk-fieldGroup{padding:14px}.pxl-sdk-fieldGroups{gap:12px}}