#chipak-sample-kit {
      --cp-paper: var(--chipak-ui-surface, #fff);
      --cp-text: var(--chipak-ui-text, #172c47);
      --cp-muted: var(--chipak-ui-muted, #566780);
      --cp-line: var(--chipak-ui-border, #dce5ef);
      --cp-soft: var(--chipak-ui-surface-soft, #f5f8fc);
      --cp-blue: var(--chipak-ui-brand, #1756c9);
      --cp-blue-soft: color-mix(in srgb, var(--chipak-ui-brand, #1756c9) 6%, white);
      --cp-button: var(--chipak-ui-brand, #1756c9);
      --cp-button-text: #ffffff;
      --cp-note: #fff8e8;
      --cp-note-text: #72511b;
      --cp-green: #21734f;
      --cp-green-soft: #eff9f3;
      --cp-error: #b32936;
      --cp-shadow: #162f5212;
      font: 400 14px/1.85 var(--chipak-ui-font, inherit);
      color: var(--cp-text);
      padding: 18px 12px;
      box-sizing: border-box;
    }
    #chipak-sample-kit * { box-sizing: border-box; }
    #chipak-sample-kit [hidden] { display: none !important; }
    #chipak-sample-kit button, #chipak-sample-kit input, #chipak-sample-kit textarea { font: inherit; }
    #chipak-sample-kit button { font-weight: 500; }
    #chipak-sample-kit .cp-window { max-width: 660px; margin: 0 auto; background: var(--cp-paper); border: 1px solid var(--cp-line); border-radius: 22px; box-shadow: 0 12px 36px var(--cp-shadow); overflow: hidden; }
    #chipak-sample-kit .cp-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 24px; border-bottom: 1px solid var(--cp-line); }
    #chipak-sample-kit .cp-brandline { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
    #chipak-sample-kit .cp-logo { color: var(--cp-blue); font: 500 23px/1.1 Arial, sans-serif; letter-spacing: -.7px; }
    #chipak-sample-kit .cp-top-label { font-size: 13px; color: var(--cp-muted); }
    #chipak-sample-kit .cp-icon-button { display: grid; place-items: center; border: 1px solid var(--cp-line); background: var(--cp-paper); color: var(--cp-muted); width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0; }
    #chipak-sample-kit .cp-steps { display: flex; align-items: center; gap: 12px; padding: 16px 24px 0; }
    #chipak-sample-kit .cp-step { display: flex; align-items: center; gap: 7px; color: var(--cp-muted); white-space: nowrap; font-size: 13px; }
    #chipak-sample-kit .cp-step-number { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--cp-soft); color: var(--cp-muted); }
    #chipak-sample-kit .cp-step[aria-current="step"] { color: var(--cp-blue); }
    #chipak-sample-kit .cp-step[aria-current="step"] .cp-step-number { color: var(--cp-button-text); background: var(--cp-button); }
    #chipak-sample-kit .cp-step-divider { flex: 1; height: 1px; background: var(--cp-line); min-width: 12px; }
    #chipak-sample-kit .cp-content { padding: 22px 24px 24px; }
    #chipak-sample-kit .cp-eyebrow { color: var(--cp-muted); font-size: 12px; margin: 0 0 8px; }
    #chipak-sample-kit h2 { font-size: 21px; font-weight: 500; line-height: 1.7; margin: 0; color: var(--cp-text); }
    #chipak-sample-kit .cp-hero-line { margin: 4px 0 12px; color: var(--cp-blue); font-size: 17px; font-weight: 500; line-height: 1.8; }
    #chipak-sample-kit .cp-intro { color: var(--cp-muted); margin: 0 0 20px; font-size: 13px; line-height: 1.95; }
    #chipak-sample-kit .cp-context { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 12px; background: var(--cp-soft); margin-bottom: 20px; }
    #chipak-sample-kit .cp-context i, #chipak-sample-kit .cp-context svg { color: var(--cp-blue); margin-top: 5px; flex-shrink: 0; width: 18px; height: 18px; }
    #chipak-sample-kit .cp-context small { color: var(--cp-muted); display: block; font-size: 12px; }
    #chipak-sample-kit .cp-context strong { font-weight: 500; font-size: 13px; }
    #chipak-sample-kit .cp-context-copy { min-width: 0; flex: 1; }
    #chipak-sample-kit .cp-material-line { margin: 7px 0 0; color: var(--cp-text); font-size: 13px; overflow-wrap: anywhere; }
    #chipak-sample-kit .cp-context .cp-context-help { margin-top: 6px; }
    #chipak-sample-kit h3 { font-size: 15px; font-weight: 500; line-height: 1.8; margin: 0 0 4px; }
    #chipak-sample-kit .cp-section-label { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; justify-content: space-between; margin-bottom: 11px; }
    #chipak-sample-kit .cp-section-label span { color: var(--cp-muted); font-size: 12px; }
    #chipak-sample-kit .cp-choice { display: block; border: 1px solid var(--cp-line); border-radius: 14px; padding: 14px; margin-bottom: 10px; background: var(--cp-paper); }
    #chipak-sample-kit .cp-choice:has(input:checked) { border-color: var(--cp-blue); background: var(--cp-blue-soft); }
    #chipak-sample-kit .cp-choice-head { display: flex; align-items: center; gap: 10px; }
    #chipak-sample-kit .cp-choice input[type="checkbox"] { width: 20px; height: 20px; margin: 0; accent-color: var(--cp-button); flex-shrink: 0; }
    #chipak-sample-kit .cp-choice-title { font-size: 15px; font-weight: 500; }
    #chipak-sample-kit .cp-choice p { margin: 8px 30px 0 0; font-size: 13px; color: var(--cp-muted); }
    #chipak-sample-kit .cp-choice .cp-caution { color: var(--cp-text); font-size: 12px; }
    #chipak-sample-kit .cp-technical { margin: 12px 0 16px; border-radius: 11px; background: var(--cp-note); color: var(--cp-note-text); padding: 10px 12px; font-size: 12px; }
    #chipak-sample-kit .cp-technical strong { font-weight: 500; }
    #chipak-sample-kit .cp-technical p { margin: 4px 0 0; }
    #chipak-sample-kit .cp-selection-note { margin: 12px 0 16px; font-size: 13px; color: var(--cp-blue); }
    #chipak-sample-kit .cp-dimensions { border-top: 1px solid var(--cp-line); padding-top: 16px; margin-top: 16px; }
    #chipak-sample-kit .cp-dim-label { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
    #chipak-sample-kit .cp-dim-label span { color: var(--cp-muted); font-size: 12px; }
    #chipak-sample-kit .cp-dim-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
    #chipak-sample-kit .cp-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; font-size: 13px; }
    #chipak-sample-kit .cp-field input, #chipak-sample-kit .cp-field textarea { width: 100%; min-width: 0; padding: 10px 12px; background: var(--cp-paper); color: var(--cp-text); border: 1px solid var(--cp-line); border-radius: 10px; min-height: 45px; font-size: 16px; font-weight: 400; }
    #chipak-sample-kit .cp-field input::placeholder, #chipak-sample-kit .cp-field textarea::placeholder { color: var(--cp-muted); opacity: .85; font-size: 13px; }
    #chipak-sample-kit .cp-field textarea { min-height: 85px; resize: vertical; }
    #chipak-sample-kit .cp-field [aria-invalid="true"] { border-color: var(--cp-error); }
    #chipak-sample-kit .cp-required { color: var(--cp-blue); }
    #chipak-sample-kit .cp-field small { color: var(--cp-muted); font-size: 12px; }
    #chipak-sample-kit .cp-help { margin: 7px 0 0; font-size: 12px; color: var(--cp-muted); }
    #chipak-sample-kit .cp-free { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--cp-green-soft); color: var(--cp-green); border-radius: 12px; padding: 12px 14px; margin-top: 20px; }
    #chipak-sample-kit .cp-free small { display: block; font-size: 12px; }
    #chipak-sample-kit .cp-free strong { font-weight: 500; white-space: nowrap; font-size: 16px; }
    #chipak-sample-kit .cp-free > span { font-size: 13px; }
    #chipak-sample-kit .cp-notes-field { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--cp-line); }
    #chipak-sample-kit .cp-notes-field textarea { min-height: 108px; }
    #chipak-sample-kit .cp-shipping { margin-top: 9px; padding: 12px 14px; border: 1px solid var(--cp-line); border-radius: 12px; }
    #chipak-sample-kit .cp-shipping-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 13px; }
    #chipak-sample-kit .cp-shipping strong { font-weight: 500; color: var(--cp-blue); }
    #chipak-sample-kit .cp-shipping p { margin: 3px 0 0; font-size: 12px; color: var(--cp-muted); }
    #chipak-sample-kit .cp-summary-notes { margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--cp-line); font-size: 12px; }
    #chipak-sample-kit .cp-summary-notes p { margin: 3px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
    #chipak-sample-kit .cp-footer { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
    #chipak-sample-kit .cp-primary, #chipak-sample-kit .cp-secondary { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 16px; min-height: 46px; border-radius: 11px; line-height: 1.8; }
    #chipak-sample-kit .cp-primary { background: var(--cp-button); color: var(--cp-button-text); border: 1px solid var(--cp-button); flex: 1; }
    #chipak-sample-kit .cp-primary:disabled { opacity: .45; cursor: not-allowed; }
    #chipak-sample-kit .cp-primary:hover:not(:disabled) { filter: brightness(.96); }
    #chipak-sample-kit .cp-secondary { background: var(--cp-paper); color: var(--cp-muted); border: 1px solid var(--cp-line); }
    #chipak-sample-kit .cp-primary svg { width: 17px; height: 17px; }
    #chipak-sample-kit .cp-error { color: var(--cp-error); font-size: 13px; margin: 10px 0 0; }
    #chipak-sample-kit .cp-order-summary { background: var(--cp-soft); border-radius: 12px; padding: 13px 14px; margin: 16px 0 20px; }
    #chipak-sample-kit .cp-order-summary-title { font-size: 13px; font-weight: 500; margin-bottom: 8px; }
    #chipak-sample-kit .cp-tags { display: flex; flex-wrap: wrap; gap: 7px; }
    #chipak-sample-kit .cp-tag { background: var(--cp-paper); color: var(--cp-blue); border: 1px solid var(--cp-line); border-radius: 7px; padding: 3px 8px; font-size: 12px; }
    #chipak-sample-kit .cp-summary-dim { color: var(--cp-muted); font-size: 12px; margin-top: 8px; }
    #chipak-sample-kit .cp-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    #chipak-sample-kit .cp-wide { grid-column: 1 / -1; }
    #chipak-sample-kit .cp-form-note { font-size: 12px; color: var(--cp-muted); margin: 8px 0 0; }
    #chipak-sample-kit .cp-demo-note { text-align: center; color: var(--cp-muted); font-size: 12px; margin: 12px auto 0; max-width: 660px; }
    #chipak-sample-kit .cp-complete { padding: 28px 24px; }
    #chipak-sample-kit .cp-complete-icon { display: grid; place-items: center; width: 52px; height: 52px; background: var(--cp-green-soft); color: var(--cp-green); border-radius: 16px; margin-bottom: 14px; }
    #chipak-sample-kit .cp-complete-icon svg { width: 24px; height: 24px; }
    #chipak-sample-kit .cp-complete p { color: var(--cp-muted); margin: 8px 0 18px; }
    #chipak-sample-kit .cp-closed { max-width: 660px; padding: 24px; text-align: center; margin: auto; }
    #chipak-sample-kit .cp-closed .cp-primary { width: auto; }
    @media (max-width: 500px) {
      #chipak-sample-kit { padding: 8px 3px; }
      #chipak-sample-kit .cp-window { border-radius: 16px; }
      #chipak-sample-kit .cp-top { padding: 13px 16px; }
      #chipak-sample-kit .cp-steps { padding: 14px 16px 0; gap: 8px; }
      #chipak-sample-kit .cp-content { padding: 18px 16px; }
      #chipak-sample-kit h2 { font-size: 18px; }
      #chipak-sample-kit .cp-hero-line { font-size: 16px; }
      #chipak-sample-kit .cp-choice { padding: 12px; }
      #chipak-sample-kit .cp-choice-title { font-size: 14px; }
      #chipak-sample-kit .cp-choice p { margin-right: 0; }
      #chipak-sample-kit .cp-form-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
      #chipak-sample-kit .cp-footer-submit { flex-wrap: wrap; }
      #chipak-sample-kit .cp-footer-submit .cp-primary { flex-basis: 100%; order: -1; }
      #chipak-sample-kit .cp-footer-submit .cp-secondary { width: 100%; }
      #chipak-sample-kit .cp-top-label { font-size: 12px; }
      #chipak-sample-kit .cp-free { gap: 8px; padding: 11px 12px; }
      #chipak-sample-kit .cp-free strong { font-size: 14px; }
    }
    @media (pointer: coarse) { #chipak-sample-kit .cp-icon-button { width: 44px; height: 44px; } }
  
.chipak-kit-modal{padding:0;border:0;background:transparent;max-width:700px;width:calc(100% - 24px);max-height:92dvh;overflow:auto;color:inherit}.chipak-kit-modal::backdrop{background:rgb(15 23 42 / .55)}
.chipak-kit-open{overflow:hidden}.chipak-kit-modal:not([open]){display:none}
#chipak-sample-kit{padding:0}#chipak-sample-kit .cp-window{max-width:none}#chipak-sample-kit .cp-top{position:sticky;top:0;z-index:2;background:var(--cp-paper)}
#chipak-sample-kit .cp-context p{margin-bottom:0}#chipak-sample-kit .cp-stock{margin:10px 0 0;padding:9px 12px;border-radius:9px;background:var(--cp-green-soft);color:var(--cp-green);font-size:13px}
#chipak-sample-kit .cp-load-error{padding:16px;color:var(--cp-error)}#chipak-sample-kit :focus-visible{outline:2px solid var(--chipak-ui-accent, #1756c9);outline-offset:3px}
.chipak-kit-landing{max-width:800px;margin:24px auto;line-height:2;font-family:var(--chipak-ui-font, inherit)}
@media(max-width:500px){.chipak-kit-modal{width:calc(100% - 12px);max-height:95dvh}#chipak-sample-kit{padding:0}}
.chipak-kit-fallback-actions { grid-template-columns:minmax(0,1fr)!important; }