/* Gantry app windows (Modern template, dark) in HTML/CSS. Generated by design/app_ui.py — edit there.
   Every size is in macOS points × --s, so the same window works on the page and inside the MacBook. */
.gi-sprite{position:absolute;width:0;height:0;overflow:hidden}
.gw{--s:1px;--gw-bg:#141416;--gw-card:#1c1c1e;--gw-edge:#3a3a3c;--gw-strip:#212123;--gw-chip:#2c2c2e;--gw-text:#f2f2f4;--gw-dim:#a1a1a6;--gw-mute:#6e6e73;
 position:relative;color:var(--gw-text);font:400 calc(13 * var(--s))/1.25 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,sans-serif;letter-spacing:0;text-align:left;-webkit-font-smoothing:antialiased}
.gw *{box-sizing:border-box}
.gw p{margin:0}
.gw .gi{width:1em;height:1em;flex-shrink:0;color:var(--gw-dim)}

/* Window: traffic lights over the rail, rail, main column. */
.gw-window{display:grid;grid-template-columns:calc(54 * var(--s)) minmax(0,1fr);background:var(--gw-bg);border:1px solid rgba(255,255,255,.14);border-radius:calc(12 * var(--s));overflow:hidden}
.gw-lights{position:absolute;top:calc(13 * var(--s));left:calc(13 * var(--s));display:flex;gap:calc(8 * var(--s))}
.gw-lights i{width:calc(12 * var(--s));height:calc(12 * var(--s));border-radius:50%;background:#ff5f57;box-shadow:inset 0 0 0 calc(.5 * var(--s)) rgba(0,0,0,.2)}
.gw-lights i:nth-child(2){background:#febc2e}.gw-lights i:nth-child(3){background:#28c840}
.gw-rail{display:flex;flex-direction:column;align-items:center;gap:calc(6 * var(--s));padding:calc(44 * var(--s)) 0 calc(12 * var(--s));background:#121214;border-right:1px solid #262628}
.gw-rail-btn{display:grid;place-items:center;width:calc(36 * var(--s));height:calc(36 * var(--s));border-radius:calc(9 * var(--s));font-size:calc(19 * var(--s))}
.gw-rail-btn.is-on{background:#2a2a2d}.gw-rail-btn.is-on .gi{color:#ececee}
.gw-main{min-width:0;padding:calc(32 * var(--s)) calc(10 * var(--s)) calc(10 * var(--s))}
.gw-head{display:flex;align-items:center;gap:calc(8 * var(--s));height:calc(32 * var(--s));padding:0 calc(12 * var(--s));border:1px solid var(--gw-edge);border-radius:calc(10 * var(--s));background:#19191b}
.gw-head img{width:auto;height:calc(11 * var(--s))}
.gw-summary{font-size:calc(11 * var(--s));color:var(--gw-dim);white-space:nowrap}
.gw-head-tools{display:flex;align-items:center;gap:calc(16 * var(--s));margin-left:auto;font-size:calc(13 * var(--s))}
.gw-sep{width:1px;height:calc(14 * var(--s));background:#3a3a3c}
.gw-grid{display:grid;grid-template-columns:repeat(var(--cols,2),minmax(0,1fr));gap:calc(12 * var(--s));margin-top:calc(12 * var(--s))}
.gw-foot{margin-top:calc(14 * var(--s)) !important;font-size:calc(10 * var(--s));color:var(--gw-mute);text-align:center}

/* Printer card. */
.gw-card{min-width:0;padding:calc(10 * var(--s)) calc(10 * var(--s)) calc(10 * var(--s));border:1px solid var(--gw-edge);border-radius:calc(12 * var(--s));background:var(--gw-card)}
.gw-card-head{display:flex;align-items:center;gap:calc(6 * var(--s));height:calc(22 * var(--s))}
.gw-card-icon{font-size:calc(13 * var(--s))}.gw-card-icon.gi{color:#d6d6d8}
.gw-name{font-size:calc(14 * var(--s));font-weight:700}
.gw-chip{padding:calc(1 * var(--s)) calc(5 * var(--s));border-radius:calc(4 * var(--s));background:var(--gw-chip);font-size:calc(9 * var(--s));font-weight:500;letter-spacing:.04em;color:var(--gw-dim)}
.gw-state{display:inline-flex;align-items:center;gap:calc(4 * var(--s));font-size:calc(10 * var(--s));font-weight:600}
.gw-state i{width:calc(6 * var(--s));height:calc(6 * var(--s));border-radius:50%;background:#e5e5e7}
.gw-tools{display:flex;gap:calc(4 * var(--s));margin-left:auto}
.gw-btn{display:grid;place-items:center;width:calc(19 * var(--s));height:calc(19 * var(--s));border-radius:calc(5 * var(--s));background:#2a2a2d;font-size:calc(11 * var(--s))}
.gw-btn-skip{background:#3a2b20}.gw-btn-skip .gi{color:#f0a467}
.gw-job{display:flex;justify-content:space-between;align-items:baseline;gap:calc(8 * var(--s));margin-top:calc(8 * var(--s))}
.gw-job span{overflow:hidden;font-size:calc(11 * var(--s));font-weight:600;white-space:nowrap;text-overflow:ellipsis}
.gw-job strong{font-size:calc(21 * var(--s));font-weight:600;letter-spacing:-.02em;color:#e6e6e8}
.gw-bar{height:calc(4 * var(--s));margin-top:calc(6 * var(--s));border-radius:calc(2 * var(--s));background:#3a3a3c;overflow:hidden}
.gw-bar i{display:block;height:100%;border-radius:calc(2 * var(--s));background:#e8e8ea}
.gw-meta{display:flex;justify-content:space-between;margin-top:calc(6 * var(--s));font-size:calc(10 * var(--s));font-weight:600;color:#cfcfd2}
.gw-meta span{display:inline-flex;align-items:center;gap:calc(4 * var(--s))}
.gw-meta .gi{font-size:calc(10 * var(--s));color:var(--gw-mute)}
.gw-temps{display:flex;gap:calc(22 * var(--s));height:calc(27 * var(--s));align-items:center;margin-top:calc(8 * var(--s));padding:0 calc(6 * var(--s));border-top:1px solid rgba(255,255,255,.07);border-radius:0 0 calc(6 * var(--s)) calc(6 * var(--s));background:var(--gw-strip)}
.gw-temps span{display:inline-flex;align-items:baseline;gap:calc(3 * var(--s))}
.gw-temps .gi{align-self:center;font-size:calc(11 * var(--s))}
.gw-temps b{font-size:calc(14 * var(--s));font-weight:700}
.gw-temps small{font-size:calc(9 * var(--s));color:var(--gw-dim)}
.gw-temps .is-cold b{color:var(--gw-mute)}
.gw-ams{margin-top:calc(8 * var(--s));padding-top:calc(7 * var(--s));border-top:1px solid rgba(255,255,255,.07)}
.gw-ams-head{display:flex;align-items:center;gap:calc(4 * var(--s));font-size:calc(10 * var(--s));font-weight:600;color:#d6d6d8}
.gw-ams-head b{font-weight:700;color:var(--gw-text)}
.gw-ams-head i{font-style:normal;color:var(--gw-mute)}
.gw-ams-head .gi{font-size:calc(10 * var(--s))}
.gw-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(8 * var(--s));margin-top:calc(5 * var(--s))}
.gw-slot{position:relative;min-width:0}
.gw-slot-name{font-size:calc(10 * var(--s));font-weight:700;white-space:nowrap}
.gw-slot-name small{font-size:calc(9 * var(--s));font-weight:500;color:var(--gw-dim)}
.gw-play{position:absolute;top:calc(1 * var(--s));left:calc(-9 * var(--s));font-size:calc(7 * var(--s));font-style:normal;color:#3ddc84}
.gw-slot-bar{display:block;height:calc(6 * var(--s));margin-top:calc(3 * var(--s));border-radius:calc(2 * var(--s));background:linear-gradient(90deg,var(--c) var(--l),#3a3a3c var(--l))}
.gw-slot-foot{display:flex;justify-content:space-between;margin-top:calc(3 * var(--s)) !important;font-size:calc(10 * var(--s))}
.gw-slot-foot b{font-weight:700}
.gw-slot-foot span{color:var(--gw-dim)}
.gw-card.is-idle .gw-job span{color:#d6d6d8}
.gw-card.is-idle .gw-job strong{color:#d0d0d2}
.gw-card.is-idle .gw-meta{color:var(--gw-mute)}

/* Menu bar popover. */
.gw-popover{padding:calc(8 * var(--s));border:1px solid rgba(255,255,255,.14);border-radius:calc(12 * var(--s));background:var(--gw-bg)}

/* Side panel with cameras. */
.gw-side{display:grid;gap:calc(5 * var(--s));width:100%;padding:calc(12 * var(--s)) calc(10 * var(--s)) calc(10 * var(--s));border:1px solid rgba(255,255,255,.14);border-radius:calc(14 * var(--s));background:rgba(14,14,16,.94)}
.gw-side-pin{justify-self:end;font-size:calc(12 * var(--s));margin-bottom:calc(2 * var(--s))}
.gw-side-row{display:flex;align-items:center;gap:calc(6 * var(--s));font-size:calc(11 * var(--s))}
.gw-side-row b{font-size:calc(12 * var(--s));font-weight:700}
.gw-side-row span{margin-left:auto;color:#cfcfd2;font-variant-numeric:tabular-nums}
.gw-side-row.is-idle span{color:var(--gw-mute)}
.gw-ring{width:calc(13 * var(--s));height:calc(13 * var(--s));fill:none;stroke:#3a3a3c;stroke-width:2.4}
.gw-ring .gw-ring-on{stroke:#ff7a45;stroke-linecap:round}
.gw-cam{position:relative;aspect-ratio:16/10;margin:calc(1 * var(--s)) 0 calc(7 * var(--s));border-radius:calc(8 * var(--s));overflow:hidden;background:#000}
.gw-cam img{width:100%;height:100%;object-fit:cover}
.gw-live{position:absolute;top:calc(5 * var(--s));left:calc(5 * var(--s));padding:calc(1 * var(--s)) calc(4 * var(--s));border-radius:calc(3 * var(--s));background:rgba(0,0,0,.6);font-size:calc(7 * var(--s));font-weight:700;letter-spacing:.08em;color:#ff6b5a}

/* Printer details stack. */
.gw-details{display:grid;gap:calc(9 * var(--s));padding:calc(10 * var(--s));background:#161618}
.gw-panel{padding:calc(12 * var(--s));border:1px solid var(--gw-edge);border-radius:calc(12 * var(--s));background:var(--gw-card)}
.gw-backbar{padding:calc(6 * var(--s))}
.gw-back{display:inline-flex;align-items:center;gap:calc(6 * var(--s));padding:calc(5 * var(--s)) calc(10 * var(--s)) calc(5 * var(--s)) calc(6 * var(--s));border-radius:calc(6 * var(--s));background:#2a2a2d;font-size:calc(12 * var(--s))}
.gw-back .gi{font-size:calc(12 * var(--s));color:var(--gw-text)}
.gw-name-lg{font-size:calc(17 * var(--s))}
.gw-state-lg{font-size:calc(11 * var(--s))}
.gw-reorder{margin-left:auto;font-size:calc(12 * var(--s))}
.gw-job-lg span{font-size:calc(12 * var(--s));color:#d6d6d8}
.gw-job-lg strong{font-size:calc(26 * var(--s));color:var(--gw-text)}
.gw-bar-lg{height:calc(5 * var(--s))}
.gw-stage{position:relative;display:flex;justify-content:space-between;align-items:center;margin:calc(11 * var(--s)) calc(4 * var(--s)) 0;height:calc(10 * var(--s))}
.gw-stage::before{content:"";position:absolute;left:0;right:0;top:50%;height:calc(2 * var(--s));background:#3a3a3c}
.gw-stage::after{content:"";position:absolute;left:0;width:66%;top:50%;height:calc(2 * var(--s));background:#e8e8ea}
.gw-stage i{position:relative;z-index:1;width:calc(5 * var(--s));height:calc(5 * var(--s));border-radius:50%;background:#4a4a4c}
.gw-stage i.on{background:#e8e8ea}
.gw-stage i.now{width:calc(12 * var(--s));height:calc(12 * var(--s));border:calc(3 * var(--s)) solid #e8e8ea;background:#2a2a2d;box-shadow:0 0 0 calc(3 * var(--s)) rgba(255,255,255,.12)}
.gw-stage-labels{display:flex;justify-content:space-between;margin-top:calc(6 * var(--s)) !important;font-size:calc(8 * var(--s));color:var(--gw-dim)}
.gw-stage-labels b{color:var(--gw-text);font-weight:600}
.gw-stage-foot{display:flex;justify-content:space-between;margin-top:calc(6 * var(--s));font-size:calc(12 * var(--s));font-weight:500}
.gw-panel-title{display:flex;align-items:center;font-size:calc(10 * var(--s));font-weight:700;letter-spacing:.02em;color:#d6d6d8}
.gw-chart{height:calc(58 * var(--s));margin-top:calc(8 * var(--s));padding:calc(6 * var(--s));border-radius:calc(8 * var(--s));background:#19191b}
.gw-spark{width:100%;height:100%}
.gw-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(8 * var(--s));margin-top:calc(8 * var(--s))}
.gw-tchip{padding:calc(7 * var(--s)) calc(9 * var(--s));border:1px solid #3a3a3c;border-radius:calc(9 * var(--s));background:#262220}
.gw-tchip small{display:flex;align-items:center;gap:calc(4 * var(--s));font-size:calc(8 * var(--s));font-weight:700;color:#d6d6d8}
.gw-tchip small i{width:calc(5 * var(--s));height:calc(5 * var(--s));border-radius:50%;background:#ff8a61}
.gw-tchip b{display:block;margin-top:calc(3 * var(--s));font-size:calc(14 * var(--s));font-weight:600;text-align:center}
.gw-tchip.t-bed{background:#27241d}.gw-tchip.t-bed small i{background:#efbd5f}
.gw-tchip.t-chamber{background:#22222a}.gw-tchip.t-chamber small i{background:#bba5ef}
.gw-details .gw-ams-head{margin-top:calc(8 * var(--s))}

/* Skip object dialog. */
.gw-skip{padding:calc(18 * var(--s)) calc(18 * var(--s)) calc(16 * var(--s));border:1px solid rgba(255,255,255,.14);border-radius:calc(14 * var(--s));background:#1a1a1c}
.gw-skip-close{position:absolute;top:calc(12 * var(--s));right:calc(14 * var(--s));font-size:calc(13 * var(--s))}
.gw-skip-close .gi{color:var(--gw-text)}
.gw-skip-title{display:flex;align-items:center;gap:calc(12 * var(--s))}
.gw-skip-title b{font-size:calc(20 * var(--s));font-weight:700}
.gw-skip-lead{margin-top:calc(8 * var(--s)) !important;font-size:calc(11 * var(--s));line-height:1.35;color:#d6d6d8}
.gw-plate{display:block;width:100%;height:auto;margin-top:calc(12 * var(--s));padding:calc(10 * var(--s));border-radius:calc(8 * var(--s));background:#222224}
.gw-plate .o-wait{fill:#47352a;stroke:#f09a3e;stroke-width:3}
.gw-plate .o-now{fill:#244330;stroke:#3ddc6b;stroke-width:3}
.gw-plate .o-skip{fill:#6e2b2c;stroke:#ff4b4b;stroke-width:5}
.gw-skip-list{display:grid;gap:calc(5 * var(--s));margin:calc(12 * var(--s)) 0 0;padding:0;list-style:none;font-size:calc(12 * var(--s))}
.gw-skip-list li{display:flex;align-items:center;gap:calc(7 * var(--s))}
.gw-skip-list small{font-size:calc(11 * var(--s));color:var(--gw-dim)}
.gw-check{display:grid;place-items:center;width:calc(14 * var(--s));height:calc(14 * var(--s));border-radius:calc(4 * var(--s));background:#2c2c2e;font-size:calc(10 * var(--s))}
.gw-check .gi{color:var(--gw-text)}
.gw-skip-foot{display:flex;justify-content:space-between;align-items:center;margin-top:calc(12 * var(--s));font-size:calc(11 * var(--s))}
.gw-skip-btn{padding:calc(5 * var(--s)) calc(11 * var(--s));border-radius:calc(6 * var(--s));background:#2c2c2e;font-size:calc(12 * var(--s));font-weight:500}
