#spt{--teal:#1c8ea3;--teal-d:#12707f;--teal-50:#ecf8fb;--deep:#0a444e;--ink:#123138;--muted:#5a6e74;--line:#dcebee;--bg:#f1f8f9;--gold:#f5a623;--gold-d:#9a6500;
  font-family:'Inter',system-ui,sans-serif;color:var(--ink);display:block;width:min(1400px,96vw);position:relative;left:50%;transform:translateX(-50%);padding:4px 0 40px}
#spt *{box-sizing:border-box}
.spt-block{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px;margin-bottom:16px;box-shadow:0 8px 26px rgba(12,91,102,.05)}
.spt-h{display:flex;align-items:center;gap:11px;font-family:'Fraunces',Georgia,serif;font-size:19px;color:var(--deep);margin-bottom:16px;font-weight:600}
.spt-h small{font-family:'Inter',sans-serif;font-weight:400;font-size:12.5px;color:var(--muted)}
.spt-n{width:30px;height:30px;border-radius:50%;background:var(--teal);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;flex:none;font-family:'Fraunces',serif}
.spt-code{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:26px;border-radius:7px;background:var(--teal-50);color:var(--teal-d);font-weight:800;font-size:12px;letter-spacing:.3px;padding:0 6px}
.spt-code.ghs{background:#fff3df;color:var(--gold-d)}
/* afdelingen */
.spt-afds{display:flex;flex-wrap:wrap;gap:12px}
.spt-afd{display:flex;align-items:center;gap:9px;border:1px solid #eef1f4;border-radius:12px;padding:9px 12px;background:#fff;flex-wrap:wrap}
.spt-afd.mk{border-color:#f2dca8;background:#fffdf7}
.spt-aname{border:1px solid #c4cedd;border-radius:8px;height:34px;padding:0 9px;font-size:14px;font-family:inherit;width:150px;color:var(--ink)}
.spt-keys{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--muted)}
.spt-akeys{width:52px;height:34px;border:1px solid #c4cedd;border-radius:8px;text-align:center;font-size:14px;font-family:inherit}
.spt-mk{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:4px;cursor:pointer}
.spt-masterbadge{font-size:11px;font-weight:800;color:var(--gold-d);background:#fff3df;border-radius:999px;padding:4px 9px}
.spt-del2{background:none;border:0;color:#c05a5a;font-size:18px;cursor:pointer;line-height:1;padding:0 2px}
/* tabel */
.spt-tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:12px}
.spt-table{border-collapse:collapse;width:100%;font-size:13.5px;min-width:600px}
.spt-table th,.spt-table td{border-bottom:1px solid #eef1f4;border-right:1px solid #f2f5f7;padding:4px 6px;text-align:center;vertical-align:middle}
.spt-table thead th{background:#f6fafb;color:var(--muted);font-weight:600;font-size:12px;padding:8px 6px;position:sticky;top:0;z-index:1}
.spt-table thead th small{font-weight:400;font-size:10.5px}
.spt-table tbody tr:nth-child(even){background:#f8fbfc}
.spt-table td.c-nr{color:var(--muted);font-size:12px;width:34px}
.spt-table th.c-name,.spt-table td.c-name{text-align:left;min-width:150px}
.spt-cname,.spt-cmaat{border:1px solid #d6dee7;border-radius:7px;height:32px;padding:0 8px;font-size:13.5px;font-family:inherit;width:100%;background:#fff;color:var(--ink)}
.spt-cmaat{width:82px;text-align:center}
.spt-cmaat.bad{border-color:#e2a0a0;background:#fdf2f2;color:#b23a3a}
.spt-cname:focus,.spt-cmaat:focus,.spt-aname:focus,.spt-akeys:focus{outline:2px solid #bfe6ee;border-color:var(--teal)}
.spt-ckleur{height:32px;border:1px solid #d6dee7;border-radius:7px;font-size:13px;font-family:inherit;background:#fff;padding:0 4px}
.spt-cknop{width:18px;height:18px;accent-color:var(--teal-d);cursor:pointer}
.c-maat{width:92px}.c-knop{width:56px}.c-kleur{width:96px}.c-acc{width:44px}.c-del{width:36px}
/* toegang-kruisje */
.spt-x{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:6px;border:1.5px solid #d9e2e8;background:#fff;color:var(--teal-d);font-weight:800;font-size:16px;cursor:pointer;line-height:1;transition:.1s}
.spt-x:hover{border-color:var(--teal);background:var(--teal-50)}
.spt-x.on{background:var(--teal-d);border-color:var(--teal-d);color:#fff}
.spt-x:focus{outline:none;box-shadow:0 0 0 3px #bfe6ee;border-color:var(--teal)}
.spt-x.fixed{background:#fff3df;border-color:#f2dca8;color:var(--gold-d);cursor:not-allowed}
.spt-del{background:none;border:0;color:#c98a8a;font-size:17px;cursor:pointer;line-height:1}
.spt-del:hover{color:#c05a5a}
/* toevoeg-knoppen */
.spt-add{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1.5px dashed #b9c4d4;color:var(--teal-d);border-radius:10px;padding:9px 16px;font-size:13.5px;font-weight:700;cursor:pointer;font-family:inherit}
.spt-add:hover{background:var(--teal-50);border-color:var(--teal)}
.spt-add-afd{align-self:center}
.spt-addrow{display:flex;gap:10px;margin-top:12px}
/* overzicht */
.spt-sum{display:flex;gap:26px;flex-wrap:wrap;margin-bottom:16px}
.spt-sc{background:var(--bg);border-radius:12px;padding:12px 18px;min-width:120px}
.spt-sc b{font-family:'Fraunces',serif;font-size:24px;color:var(--deep);display:block;line-height:1}
.spt-sc span{font-size:12px;color:var(--muted)}
.spt-series{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.spt-serie{border:2px solid var(--line);border-radius:12px;padding:12px 20px;font-weight:700;color:var(--deep);cursor:pointer;font-size:15px}
.spt-serie.on{border-color:var(--teal);background:var(--teal-50)}
.spt-serie input{margin-right:7px}
.spt-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:16px}
.spt-price small{display:block;font-size:12px;color:var(--muted)}
.spt-price b{font-family:'Fraunces',serif;font-size:28px;color:var(--deep)}
.spt-buy{background:var(--teal);color:#fff;border:0;border-radius:12px;padding:14px 32px;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 12px 26px rgba(28,142,163,.3)}
.spt-buy:hover{background:var(--teal-d)}
.spt-note{font-size:12.5px;color:var(--muted);margin:12px 0 0}
@media(max-width:640px){.spt-afd{width:100%}.spt-aname{flex:1}}