:root{--bg:#eef1f4;--paper:#ffffff;--ink:#142033;--muted:#566377;--line:#d3dae3;--accent:#c2561b;--accent2:#1d6b7a;--tag:#e4ebf2;--warn:#9a6a00;--bad:#a33333;
--display:"Archivo Narrow","Arial Narrow",Arial,sans-serif;--body:"Source Sans 3","Segoe UI",Arial,sans-serif;--mono:"IBM Plex Mono",Consolas,monospace;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#11161d;--paper:#1a212b;--ink:#e6ebf2;--muted:#9aa7b8;--line:#2d3745;--accent:#ee8a4f;--accent2:#58b3c3;--tag:#242e3b;--warn:#e1b04a;--bad:#e88888;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.45;padding-inline:16px;padding-block:20px}
h1{font-family:var(--display);font-size:clamp(32px,5vw,48px);line-height:1;margin:0 0 6px}
h2{font-family:var(--display);font-size:24px;margin:0}
h4{font-family:var(--display);font-size:18px;margin:18px 0 6px}
.top{max-width:1500px;margin:0 auto 16px;display:flex;flex-wrap:wrap;gap:14px 24px;justify-content:space-between;align-items:flex-end}
.lede{margin:0;color:var(--muted);max-width:70ch}
.actions{display:flex;flex-wrap:wrap;gap:8px}
button,.btn{font:inherit;border:1px solid var(--line);background:var(--paper);color:var(--ink);padding:8px 14px;border-radius:8px;cursor:pointer;display:inline-block}
button:hover,.btn:hover{border-color:var(--accent)}
button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
button.mini{padding:3px 9px;font-size:13px}
button.danger{color:var(--bad)}
.layout{max-width:1500px;margin:0 auto;display:grid;grid-template-columns:minmax(330px,430px) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:980px){.layout{grid-template-columns:minmax(0,1fr)}}
section,.card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px;min-width:0}
.controls{display:flex;flex-direction:column;gap:16px;min-width:0}
.card{margin-top:10px;background:var(--bg)}
.row{display:flex;gap:8px;align-items:center}.between{justify-content:space-between;flex-wrap:wrap}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:8px}
@media (max-width:520px){.grid3,.grid2{grid-template-columns:1fr 1fr}}
.f{display:flex;flex-direction:column;gap:2px;font-size:13px;min-width:0;position:relative}
.f span{color:var(--muted);font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.f em{position:absolute;right:8px;bottom:7px;font-style:normal;color:var(--muted);font-size:12px;pointer-events:none}
input[type=number],input[type=text],input[type=search],select{font:inherit;width:100%;padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--ink);min-width:0}
.chk{display:flex;flex-direction:row;align-items:center;gap:6px;font-size:14px}
.chk span{text-transform:none;font-family:var(--body);font-size:14px;color:var(--ink)}
details{margin-top:8px}summary{cursor:pointer;color:var(--muted);font-size:13px}
.note{color:var(--muted);font-size:14px;margin:6px 0}.status{margin:4px 0 10px}
.warn,.warns{color:var(--warn)}.warns{padding-left:20px;margin:10px 0}
.search .results{position:absolute;top:100%;left:0;right:0;z-index:20;margin:2px 0 0;padding:0;list-style:none;background:var(--paper);border:1px solid var(--accent);border-radius:8px;max-height:300px;overflow:auto;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.results li{padding:6px 10px;border-bottom:1px solid var(--line);cursor:pointer;display:flex;flex-direction:column}.results li:hover{background:var(--tag)}
.results small{color:var(--muted)}.results .none{cursor:default;color:var(--muted)}
.tabs{display:flex;gap:6px;flex-wrap:wrap}.tab.on{background:var(--accent2);border-color:var(--accent2);color:#fff}
.viewbar{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:6px 0}
.vis{display:flex;gap:4px 14px;flex-wrap:wrap;margin-bottom:8px}
.viewer{height:min(70vh,640px);min-height:340px;border:1px solid var(--line);border-radius:10px;background:var(--tag);position:relative;overflow:hidden}
.viewer canvas{display:block;width:100%;height:100%}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px;margin-bottom:8px}
.stat{border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--bg)}
.stat .k{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}.stat .v{font-size:19px;font-variant-numeric:tabular-nums}.stat .s{font-size:12px;color:var(--muted)}
.chart{width:100%;height:260px;display:block;border:1px solid var(--line);border-radius:8px;background:var(--paper)}
.scroll{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:15px;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:7px 9px;border-bottom:1px solid var(--line)}th{font-family:var(--mono);font-size:12px;text-transform:uppercase;color:var(--muted);font-weight:500}td.num{text-align:right;white-space:nowrap}tr.sum td{font-weight:600}
.sheetsvg{width:100%;max-height:70vh;background:var(--paper);border:1px solid var(--line);border-radius:8px}
.sheetsvg .sheet{fill:#f4ecdd;stroke:#222;stroke-width:3}.sheetsvg .part{fill:#d8b983;stroke:#222;stroke-width:2}.sheetsvg .ptext{fill:#222;font-family:system-ui,sans-serif}
.foot{max-width:1500px;margin:16px auto 0;color:var(--muted);font-size:13px}
.sheetsvg .cut{fill:#eef1f4;stroke:#222;stroke-width:2}.sheetsvg .pocket{fill:url(#hatch);stroke:#222;stroke-width:1.5}
.sheetsvg .ptext{fill:#222;font-family:system-ui,sans-serif;paint-order:stroke;stroke:#fff;stroke-width:5px;stroke-linejoin:round}
.sheetsvg .dtext{fill:#fff;font-family:system-ui,sans-serif;paint-order:stroke;stroke:#3a2a12;stroke-width:4px;stroke-linejoin:round}
.legend{display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:var(--muted);font-size:14px;margin:6px 0}.sw{display:inline-block;width:18px;height:14px;border:1px solid #222}.sw.cut{background:#eef1f4}.sw.pocket{background:repeating-linear-gradient(45deg,#b98f58,#b98f58 3px,#6b4a22 3px,#6b4a22 5px)}
dialog{border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);padding:18px;width:min(560px,calc(100vw - 32px));max-height:85vh;overflow:auto}
dialog::backdrop{background:rgba(0,0,0,.45)}
dialog textarea{width:100%;font-family:var(--mono);font-size:12px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--ink);padding:8px;margin:6px 0}
.dlist{margin:10px 0}.drow{display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--line)}.drow small{color:var(--muted)}
dialog .row input{flex:1}
.chip{align-self:center;color:var(--muted);font-size:14px;max-width:34ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.f input.hasunit{padding-right:34px}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}.seg button{border:0;border-radius:0;padding:8px 14px;background:var(--paper)}.seg button.on{background:var(--accent2);color:#fff}
.sheetbox{height:min(72vh,680px);min-height:300px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--paper)}
.sheetbox .sheetsvg{width:100%;height:100%;max-height:none;border:0;border-radius:0;touch-action:none;cursor:grab;display:block;user-select:none}.sheetbox .sheetsvg.grab{cursor:grabbing}
.zoombar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:4px 0 6px}.zoombar small{color:var(--muted)}
.bad{color:var(--bad)}
.inwrap{position:relative}.inwrap input{width:100%}
.inwrap em{position:absolute;right:8px;top:50%;transform:translateY(-50%);bottom:auto}
.unitbtn{position:absolute;right:4px;top:50%;transform:translateY(-50%);border:0;background:transparent;padding:3px 5px;border-radius:5px;font:inherit;font-size:12px;color:var(--accent2);cursor:pointer;text-decoration:underline dotted}
.unitbtn:hover{background:var(--tag);border:0}
.chipbtn{font-size:13px;padding:3px 10px;border-radius:999px;color:var(--muted);margin:2px 0 8px}
.outbtn{font:inherit;border:1px solid var(--accent2);background:var(--paper);color:var(--accent2);border-radius:6px;padding:6px 8px;cursor:pointer;text-align:left}
dialog.shapedlg{width:min(980px,calc(100vw - 24px))}
.shapegrid{display:grid;grid-template-columns:minmax(260px,1fr) minmax(300px,1fr);gap:14px;margin:10px 0}@media (max-width:760px){.shapegrid{grid-template-columns:minmax(0,1fr)}}
.shapesvg{width:100%;aspect-ratio:1;background:var(--bg);border:1px solid var(--line);border-radius:8px;touch-action:none}
.shapesvg .grid{stroke:var(--line);stroke-width:.2}.shapesvg .gridm{stroke:var(--muted);stroke-width:.3;opacity:.6}.shapesvg .axis{stroke:var(--accent);stroke-width:.6}
.shapesvg .shapefill{fill:var(--accent2);fill-opacity:.25;stroke:var(--accent2);stroke-width:.7}.shapesvg .shapeguide{fill:none;stroke:var(--muted);stroke-width:.25;stroke-dasharray:2 2}.shapesvg .shapebad{fill:none;stroke:var(--bad);stroke-width:.8}
.shapesvg .handle{fill:var(--paper);stroke:var(--accent);stroke-width:.6;cursor:grab}.shapesvg .handle.sel{fill:var(--accent)}.shapesvg .vlabel{fill:var(--ink);pointer-events:none}
.shapetable{max-height:260px;overflow:auto}.shapetable input{width:88px;padding:4px 6px}.shapetable tr.sel td{background:var(--tag)}.shapetable td.acts{white-space:nowrap}
.shapetools{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:8px 0}.shapetools .allr{width:70px;padding:4px 6px}
.presetrow{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin:6px 0}.presetrow .pf{display:flex;flex-direction:column;font-size:12px;color:var(--muted)}.presetrow input{width:78px;padding:4px 6px}.presetrow select{width:auto}
.shapemsg{margin:4px 0;font-size:14px}.shapemsg.bad{color:var(--bad)}.shapemsg.warn{color:var(--warn)}
.unitbtn.solid{position:static;transform:none;display:inline-block}
.aboutsel{width:auto !important;padding:3px 6px}

/* frozen top bar and frozen right window (wide screens): only the driver column scrolls */
body{padding-bottom:64px}
header.top{position:sticky;top:0;z-index:30;background:var(--bg);margin-bottom:12px;padding-block:8px;transition:padding .15s}
header.top.compact h1{font-size:26px;margin:0}header.top.compact .lede{display:none}header.top.compact{padding-block:6px;align-items:center}
@media (min-width:981px){
  .layout{align-items:start}
  .views{position:sticky;top:var(--headh,70px);max-height:calc(100vh - var(--headh,70px) - 28px);overflow-y:auto;padding-bottom:72px;scroll-padding-bottom:72px}
  .views .tabs{position:sticky;top:-16px;z-index:5;background:var(--paper);padding:16px 0 8px;margin-top:-16px}
  .viewer{height:min(60vh,620px)}
}
@media (max-width:980px){.views{padding-bottom:72px}}
.cutpanel{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:6px 0 12px;background:var(--bg)}
.partlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px 12px;margin-top:6px}
.partchk{display:flex;gap:6px;align-items:center;font-size:14px;padding:2px 0}.partchk small{color:var(--muted);margin-left:auto;white-space:nowrap}.partchk.done span{text-decoration:line-through;color:var(--muted)}
.sheetsvg .pickable{cursor:pointer}.sheetsvg .pickable:hover .part{fill:#e8cf9d;stroke-width:4}
.viewbar .grow{flex:1}.vis{align-items:center}.visnote{color:var(--muted);font-size:14px;flex-basis:100%}.cutpanel .primary.mini{padding:4px 12px;font-size:14px}
button.chip{border:0;background:transparent;cursor:pointer;text-decoration:underline dotted;padding:4px 6px}#designs{max-width:640px}#designs h2{margin-bottom:6px}
.zoombar .chipbtn{margin:0}
.statusmini{color:var(--muted);font-size:13px;max-width:30ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:center}
.alertbar{margin:6px 0 10px;padding:8px 12px;border:1px solid var(--warn);border-radius:8px;color:var(--warn);background:var(--bg);font-size:14px}
.gviewer{height:min(56vh,600px);min-height:320px;border:1px solid var(--line);border-radius:10px;background:var(--tag);overflow:hidden;margin-top:6px}.gviewer canvas{display:block;width:100%;height:100%}
.row.wrap{flex-wrap:wrap}.grow{flex:1}
.viewbtns{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.viewbtn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 8px;font-size:12px;min-width:62px}.viewbtn.on{border-color:var(--accent);background:var(--tag)}.viewbtn span{color:var(--muted)}
.seg2{padding:4px 10px;font-size:14px}.seg2.on{background:var(--accent2);border-color:var(--accent2);color:#fff}

:root[data-theme="dark"]{--bg:#11161d;--paper:#1a212b;--ink:#e6ebf2;--muted:#9aa7b8;--line:#2d3745;--accent:#ee8a4f;--accent2:#58b3c3;--tag:#242e3b;--warn:#e1b04a;--bad:#e88888;color-scheme:dark}
header.top h1{cursor:pointer;user-select:none}header.top h1:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.viewrow{display:flex;gap:8px 18px;flex-wrap:wrap;align-items:center;margin:8px 0}.viewrow .viewbtns{margin:0}.viewtools{display:flex;gap:8px 14px;flex-wrap:wrap;align-items:center}
.sheetbox{height:min(82vh,940px)}
.reach{font-family:var(--body);font-size:14px;color:var(--muted);font-weight:400}
.sheetsvg .axtext{fill:var(--ink);font-family:system-ui,sans-serif;font-size:17px}
.gviewer{position:relative}.gov{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.glabel{position:absolute;transform:translate(-50%,-50%);font:600 13px system-ui,sans-serif;color:var(--ink);text-shadow:0 0 3px var(--paper),0 0 3px var(--paper);white-space:nowrap}
.glabel.ax{color:#e5484d;font-size:16px}.glabel.ay{color:#30a46c;font-size:16px}.glabel.az{color:#3e63dd;font-size:16px}.glabel.org{color:var(--ink);font-size:12px;transform:translate(-100%,-100%)}.glabel.dim{color:var(--muted)}
.gtriad{position:absolute;left:8px;bottom:8px;pointer-events:none;background:color-mix(in srgb,var(--paper) 70%,transparent);border-radius:8px}
dialog.optdlg{width:min(620px,calc(100vw - 24px))}.optdlg .seg button{padding:6px 14px}
.menuwrap{position:relative;display:inline-block}.exportmenu{position:absolute;top:100%;left:0;z-index:40;margin-top:4px;min-width:190px;background:var(--paper);border:1px solid var(--accent);border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.25);padding:4px;display:flex;flex-direction:column}
.exportmenu[hidden]{display:none}.exportmenu button{border:0;background:transparent;text-align:left;padding:8px 10px;border-radius:6px}.exportmenu button:hover{background:var(--tag)}
.sendnote{margin-top:12px;padding:0;font-size:.95em}.sendnote:not(:empty){padding:10px 12px;border-radius:8px;border:1px solid var(--line,#8886)}.sendnote.ok{border-color:#30a46c;color:#30a46c}.sendnote.bad{border-color:#e5484d;color:#e5484d}.sendnote.wait{opacity:.8}
.exportmenu small{display:block;padding:6px 12px 2px;opacity:.7;font-size:.8em}
.bigbtn{padding:11px 22px;font-size:1.05rem;font-weight:700;border-radius:10px}.exportmenu button{padding:11px 16px;font-size:1rem}
.simpanel{margin:8px 0;padding:10px 12px;border:1px solid var(--line,#8886);border-radius:10px;display:flex;flex-direction:column;gap:8px}
.simread{font-variant-numeric:tabular-nums;font-size:.9em;min-height:1.3em}
.simresults p{margin:4px 0}.simok{color:#30a46c;font-weight:600}.simbad{color:#e5484d;font-weight:600}.simwarn{color:#b87b00;font-weight:600}
.simissues{max-height:190px;overflow:auto;display:flex;flex-direction:column;gap:4px}
.simrow{text-align:left;padding:6px 10px;border-radius:8px;border:1px solid var(--line,#8886);background:transparent;color:inherit;cursor:pointer;font:inherit;font-size:.88em}
.simrow.bad b{color:#e5484d}.simrow.warn b{color:#b87b00}.simrow:hover{background:rgba(128,128,128,.14)}
/* G-code tab: one frozen row with the view buttons, the Parts / Toolpath / Sheet switches and Options, Simulate and Export */
.viewrow{position:sticky;z-index:20;top:calc(var(--headh,70px) - 8px);background:var(--paper);padding:8px 0;margin:0 0 6px;border-bottom:1px solid var(--line);gap:6px 12px;flex-wrap:wrap;align-items:center}
@media (min-width:981px){.viewrow{top:var(--tabsh,40px)}}
.viewrow .viewbtns{gap:4px;flex-wrap:nowrap}.viewrow .viewbtn{min-width:0;padding:3px 5px}.viewrow .viewbtn span{display:none}.viewrow .viewbtn svg{width:30px;height:30px}
.viewrow .viewtools{flex:1 1 auto;gap:6px 10px;flex-wrap:nowrap;justify-content:flex-start}.viewrow .viewtools>*{flex:0 0 auto}.viewrow .chk{white-space:nowrap}
.viewrow .bigbtn{padding:8px 14px;font-size:1rem}.viewrow .viewtools .mini{padding:7px 10px;white-space:nowrap}
@media (max-width:700px){.viewrow .viewtools{flex-wrap:wrap}}
.viewrow .viewbtn svg{width:26px;height:26px}.viewrow .viewbtn{padding:3px 4px}.viewrow .viewbtns{gap:3px}.simbtn.on{border-color:var(--accent);background:var(--tag);font-weight:700}
.viewrow .viewtools{justify-content:space-between}.viewrow .togs{display:flex;gap:10px;align-items:center;flex:0 0 auto}
/* G-code row: everything except Export stretches to fill the row; Export keeps its size on the right */
@media (min-width:701px){
  .viewrow{flex-wrap:nowrap;gap:10px}
  .viewrow .viewbtns{flex:1.1 1 0;min-width:0;gap:4px}
  .viewrow .viewbtn{flex:1 1 0;min-width:0;max-width:60px;padding:3px 2px;justify-content:center}
  .viewrow .viewbtn svg{width:100%;max-width:34px;height:auto;aspect-ratio:1}
  .viewrow .viewtools{flex:2 1 0;min-width:0;gap:8px;justify-content:stretch}
  .viewrow .togs{flex:1.6 1 0;justify-content:space-evenly;gap:6px}
  .viewrow .viewtools>button.mini{flex:1 1 0;padding:8px 6px;text-align:center}
  .viewrow .viewtools>.menuwrap{flex:0 0 auto;margin-left:auto}
}
.simkey{font-size:.85em;color:var(--muted)}.simkey .sw{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:4px;vertical-align:-2px}
.glabel.gnum{background:var(--accent,#c8500a);color:#fff;font-weight:800;font-size:17px;min-width:30px;height:30px;line-height:30px;text-align:center;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,.45);padding:0}
.glabel.gin,.glabel.gout{color:#fff;font-weight:700;font-size:11px;padding:1px 6px;border-radius:9px;transform:translate(-50%,-190%);white-space:nowrap;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.glabel.gin{background:#1fa64a}.glabel.gout{background:#e5484d}
.glabel.gnum,.glabel.gin,.glabel.gout{text-shadow:none}
@media (min-width:701px){.viewrow{gap:8px}.viewrow .viewtools{gap:6px}.viewrow .togs{gap:4px;flex:1.8 1 0}.viewrow .viewtools>button.mini{padding:8px 4px}.viewrow .viewbtns{flex:1 1 0}}
.simbar{position:sticky;z-index:19;top:calc(var(--headh,70px) - 8px + var(--rowh,64px));background:var(--paper);margin:0 0 6px;box-shadow:0 4px 8px -6px rgba(0,0,0,.35)}
@media (min-width:981px){.simbar{top:calc(var(--tabsh,40px) + var(--rowh,64px))}}
.simres{margin:0 0 8px}
.xopanel{margin:10px 0;padding:8px 10px;border:1px solid var(--line);border-radius:10px}.xopanel summary{cursor:pointer;font-weight:600}.xopanel h4{margin:12px 0 6px}
