@font-face{font-family:"Barlow";src:url("fonts/Barlow-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow";src:url("fonts/Barlow-Black.ttf") format("truetype");font-weight:900;font-style:normal;font-display:swap}
#viewport{position:relative;height:clamp(360px,70vh,780px);overflow:hidden}
#three{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
#three canvas{display:block;width:100%!important;height:100%!important;max-width:100%}
#lineText{
  font-family:"Barlow",Arial,sans-serif;
  font-weight:700;
  font-size:26px;
  letter-spacing:.04em;
  width:100%;
  padding:12px 14px;
  margin-top:6px;
}
#lineText.font-black{font-weight:900}
.toggle-row{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0}
.toggle-row label{
  display:flex;align-items:center;gap:8px;
  padding:8px 12px;border:1px solid #b8cfc0;border-radius:8px;
  cursor:pointer;font-weight:600;background:#f4faf6;
}
.toggle-row input{accent-color:#193f2d;width:16px;height:16px}
.examples{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.examples button{width:auto;padding:8px 12px;font-size:14px}
.preview-hole{fill:#dce8d9;stroke:#193f2d;stroke-width:.35}
#empty p{margin:0 0 10px}
.stl-note{margin-top:8px}
#checkLayers{width:100%;margin-top:10px}
#batchText{
  font-family:"Barlow",Arial,sans-serif;
  font-weight:700;
  font-size:20px;
  letter-spacing:.04em;
  width:100%;
  padding:12px 14px;
  margin-top:6px;
  min-height:120px;
  resize:vertical;
}
#batchText.font-black{font-weight:900}
.mode-tabs label{font-weight:700}
#downloadPlate,#downloadZip{width:100%;margin-top:10px}
#downloadZip{margin-top:0}
.check-label{display:flex;align-items:flex-start;gap:10px;font-size:14px;font-weight:600;margin:10px 0 4px;cursor:pointer}
.check-label input{width:18px;height:18px;margin-top:2px;accent-color:#193f2d}