.kph-tool{
      --kph-ink:#111418;--kph-line:#d8dde3;--kph-bg:#f6f7f9;--kph-accent:#14315c;
      --kph-accent-soft:#e8edf5;--kph-muted:#5a6673;
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
      color:var(--kph-ink);max-width:1140px;margin:0 auto;-webkit-font-smoothing:antialiased;
    }
    .kph-tool *{box-sizing:border-box;}
    .kph-grid{display:grid;grid-template-columns:1fr 400px;gap:28px;align-items:start;}
    @media (max-width:960px){.kph-grid{grid-template-columns:1fr;}}

    .kph-preview-wrap{background:var(--kph-bg);border:1px solid var(--kph-line);border-radius:10px;padding:26px 22px;position:sticky;top:20px;}
    @media (max-width:960px){.kph-preview-wrap{position:static;}}
    .kph-preview-wrap svg{width:100%;height:auto;display:block;}
    .kph-preview-note{margin-top:14px;font-size:12px;color:var(--kph-muted);text-align:center;line-height:1.5;}

    .kph-panel{border:1px solid var(--kph-line);border-radius:10px;overflow:hidden;}
    .kph-step{border-bottom:1px solid var(--kph-line);padding:18px 20px;}
    .kph-step:last-child{border-bottom:0;}
    .kph-step h3{margin:0 0 12px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--kph-accent);font-weight:700;}
    .kph-label{display:block;font-size:13px;font-weight:600;margin:0 0 6px;}
    .kph-hint{font-size:12px;color:var(--kph-muted);margin:6px 0 0;line-height:1.45;}

    .kph-tool input[type=text],.kph-tool select{
      width:100%;padding:10px 12px;border:1px solid var(--kph-line);border-radius:6px;
      font-size:14px;font-family:inherit;background-color:#fff;color:var(--kph-ink);
    }
    .kph-tool select,
    .kph-tool .kph-slot select,
    .kph-tool .kph-step select{
      appearance:none !important;-webkit-appearance:none !important;-moz-appearance:none !important;
      padding-right:38px !important;cursor:pointer;
      background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235a6673' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
      background-repeat:no-repeat !important;
      background-position:right 12px center !important;
      background-size:14px 14px !important;
    }
    .kph-tool select::-ms-expand{display:none;}
    .kph-tool select:hover{border-color:var(--kph-accent);}
    .kph-tool input[type=range]{width:100%;}
    .kph-field + .kph-field{margin-top:14px;}
    .kph-counter{font-size:11px;color:var(--kph-muted);text-align:right;margin-top:4px;}

    .kph-layouts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
    .kph-layout{border:1px solid var(--kph-line);border-radius:8px;background:#fff;cursor:pointer;padding:10px 6px 8px;font-family:inherit;font-size:11px;color:var(--kph-muted);text-align:center;}
    .kph-layout[aria-pressed="true"]{border-color:var(--kph-accent);background:var(--kph-accent);color:#fff;font-weight:700;}
    .kph-layout[aria-pressed="true"] rect:first-child{fill:#2c4a75;}
    .kph-layout[aria-pressed="true"] rect{fill:#ffffff;}
    .kph-layout svg{width:100%;height:24px;display:block;margin-bottom:6px;}

    .kph-slot{border:1px solid var(--kph-line);border-radius:8px;padding:14px;background:#fff;}
    .kph-slot + .kph-slot{margin-top:10px;}
    .kph-slot--active{border-color:var(--kph-accent);box-shadow:0 0 0 3px var(--kph-accent-soft);}
    .kph-tool .kph-hit{cursor:pointer;}
    .kph-tool .kph-hit:hover{fill:rgba(122,162,255,.28);}
    .kph-slot-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
    .kph-slot-head strong{font-size:13px;}

    .kph-seg{display:flex;border:1px solid var(--kph-line);border-radius:6px;overflow:hidden;}
    .kph-seg button{flex:1;padding:8px 4px;border:0;background:#fff;cursor:pointer;font-size:12px;font-family:inherit;color:var(--kph-muted);border-right:1px solid var(--kph-line);white-space:nowrap;}
    .kph-seg button:last-child{border-right:0;}
    .kph-seg button[aria-pressed="true"]{background:var(--kph-accent);color:#fff;font-weight:700;}
    .kph-seg button[aria-pressed="true"]:hover{background:#0e2444;}
    .kph-seg button:hover:not([aria-pressed]){background:var(--kph-bg);color:var(--kph-ink);}
    .kph-seg--sm{max-width:170px;}
    .kph-stijl{max-width:150px;}
    .kph-stijl button:first-child{font-weight:700;}
    .kph-stijl button:last-child{font-style:italic;}

    .kph-swatches{display:flex;flex-wrap:wrap;gap:7px;}
    .kph-swatch{width:34px;height:34px;border-radius:7px;border:1px solid #c9ced6;cursor:pointer;padding:0;background-clip:padding-box;}
    .kph-swatch[aria-pressed="true"]{box-shadow:0 0 0 2px #fff inset,0 0 0 3px var(--kph-accent);}
    .kph-swatch:focus-visible{outline:2px solid var(--kph-accent);outline-offset:2px;}
    .kph-swatch--none{background:#fff;position:relative;overflow:hidden;}
    .kph-swatch--none::after{content:'';position:absolute;left:-4px;top:15px;width:44px;height:2px;background:#d0424f;transform:rotate(-45deg);}
    .kph-swatch--eigen{background:conic-gradient(#e2001a,#f2c200,#00a03c,#0057b8,#e2001a);}
    .kph-pms{margin-top:8px;}

    .kph-file{display:flex;align-items:center;gap:10px;border:1px dashed var(--kph-line);border-radius:6px;padding:10px;background:#fff;}
    .kph-file input[type=file]{flex:1;min-width:0;font-size:11px;}
    .kph-file img{max-height:32px;max-width:80px;object-fit:contain;}
    .kph-file button{border:0;background:none;color:var(--kph-accent);font-size:12px;cursor:pointer;text-decoration:underline;padding:0;font-family:inherit;}

    .kph-tiers{width:100%;border-collapse:collapse;font-size:13px;}
    .kph-tiers th{text-align:left;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--kph-muted);font-weight:600;padding:0 8px 6px;border-bottom:1px solid var(--kph-line);}
    .kph-tiers th:nth-child(n+2),.kph-tiers td:nth-child(n+2){text-align:right;}
    .kph-tiers td{padding:9px 8px;border-bottom:1px solid var(--kph-line);}
    .kph-tiers tr:last-child td{border-bottom:0;}
    .kph-tiers tbody tr{cursor:pointer;}
    .kph-tiers tbody tr:hover{background:var(--kph-bg);}
    .kph-tiers tbody tr[aria-selected="true"]{background:var(--kph-accent-soft);}
    .kph-tiers tbody tr[aria-selected="true"] td{font-weight:700;color:var(--kph-accent);}
    .kph-tier-save{font-size:11px;font-weight:600;color:#0a7a3d;margin-left:6px;}
    .kph-kleurtabel tbody tr{cursor:default;}
    .kph-kleurtabel tbody tr:hover{background:transparent;}
    .kph-kleurtabel tbody tr:not([aria-selected="true"]) td{color:var(--kph-muted);}

    .kph-price{background:var(--kph-accent-soft);padding:18px 20px;}
    .kph-spoed{display:flex;align-items:center;gap:9px;margin-top:12px;padding:11px 12px;background:#fff;
      border:1px solid var(--kph-line);border-radius:6px;font-size:13px;cursor:pointer;}
    .kph-spoed input{width:17px;height:17px;accent-color:var(--kph-accent);cursor:pointer;}
    .kph-price-line{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px;color:var(--kph-muted);}
    .kph-price-total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid #c9d5e6;margin-top:10px;padding-top:10px;}
    .kph-price-total strong{font-size:24px;color:var(--kph-accent);}
    .kph-cta{width:100%;margin-top:14px;padding:14px;border:0;border-radius:6px;background:var(--kph-accent);color:#fff;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;}
    .kph-cta:disabled{background:#9aa6b4;cursor:not-allowed;}
    .kph-cta:hover:not(:disabled){background:#0e2444;}
    .kph-secondary{width:100%;margin-top:8px;padding:11px;border:1px solid var(--kph-line);border-radius:6px;background:#fff;font-size:13px;cursor:pointer;font-family:inherit;color:var(--kph-ink);}
    .kph-out{margin-top:12px;font-size:11px;background:#0e1116;color:#9ad1a5;padding:12px;border-radius:6px;white-space:pre-wrap;word-break:break-all;display:none;line-height:1.5;}
    .kph-warn{margin-top:10px;font-size:12px;color:#8a5400;background:#fff6e5;border:1px solid #f0d9a8;border-radius:6px;padding:9px 11px;display:none;}