:root{
  --border:#e6e6e6;
  --text:#111;
  --muted:#666;
  --bg:#fff;
  --chip:#f4f4f4;
  --green:#39d15a;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial, Helvetica, sans-serif;background:#f6f6f6;color:var(--text)}
.page{max-width:920px;margin:16px auto;background:var(--bg);border:1px solid var(--border);border-radius:16px;box-shadow:0 6px 24px rgba(0,0,0,.06);padding:16px 16px 96px}
.header h1{margin:4px 0 6px;font-size:20px}
.sub{margin:0 0 10px;color:var(--muted);font-size:13px}
.box{border:1px solid var(--border);border-radius:14px;padding:12px;margin:10px 0}
.row{display:flex;gap:12px;align-items:flex-end}
.row.two .field{flex:1}
.row.three .field{flex:1}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field span{font-size:12px;color:#333}
.field input,.field select{border:1px solid var(--border);border-radius:12px;padding:10px 12px;font-size:14px;width:100%}
.field.inline{align-items:flex-start}
.checks{display:flex;gap:12px;flex-wrap:wrap;border:1px solid var(--border);border-radius:12px;padding:10px 12px;width:100%}
.checks label{font-size:14px}
.carHeader{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.carHeader h2{margin:0;font-size:16px}
.hint{margin:0;color:var(--muted);font-size:12px}
.carStage{position:relative;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#fff;min-height:260px}
.carImg{width:100%;height:auto;display:block}
.overlay{position:absolute;inset:0;width:100%;height:100%}
.part{
  fill: rgba(0,0,0,0);
  stroke: none;
  cursor: pointer;
  pointer-events: all;
}
.part.selected{
  fill: rgba(57,209,90,0.65);
}
.selected{margin-top:10px}
.selectedTitle{font-weight:700;font-size:13px;margin-bottom:6px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{background:var(--chip);border:1px solid var(--border);border-radius:999px;padding:6px 10px;font-size:12px}
.actions{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--border);padding:10px 12px;display:flex;gap:10px;justify-content:space-between}
.actions button{border-radius:12px;padding:12px 12px;border:1px solid var(--border);font-size:14px;flex:1}
.save{background:var(--green);border-color:var(--green);color:#000;font-weight:700}
.save:disabled{background:#e5e5e5;border-color:#cfcfcf;color:#777;opacity:.75;cursor:not-allowed}
.primary{background:#fff}
.primary:disabled{background:#e5e5e5;border-color:#cfcfcf;color:#777;opacity:.75;cursor:not-allowed}
.ghost{background:#fff}
.foot{margin-top:10px;color:var(--muted)}

@media (max-width: 640px){
  body{background:#fff}
  .page{max-width:100%;margin:0;border:none;border-radius:0;box-shadow:none;padding:14px 12px 110px}
  .row{flex-direction:column;align-items:stretch}
}

@media print{
  @page{size:A4;margin:10mm}
  .actions,.foot{display:none !important}
  body{background:#fff}
  .page{box-shadow:none;border:none;margin:0;padding:0}
}

/* SVG araç sahnesi */
.carStage{position:relative}
.carSvg{width:100%;height:auto;display:block}
.carSvg .part{fill: rgba(0,0,0,0); stroke: none; cursor:pointer; pointer-events: all;}
.carSvg .part.selected{fill: rgba(57,209,90,0.65);}