
:root{--navy:#082a61;--blue:#0757c9;--green:#138a36;--red:#e01717;--orange:#f26a00;--ink:#0c1f4d;--muted:#65738c;--line:#d9e2ef;--bg:#f5f8fc}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC",Arial,sans-serif}button,input{font:inherit}button{touch-action:manipulation}
#app{max-width:1366px;min-height:100vh;margin:auto;background:#fff}.app-header{height:74px;padding:10px 18px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:20}.brand{display:flex;gap:12px;align-items:center}.brand-logo-wrap{width:54px;height:46px;border-radius:10px;background:#fff;display:grid;place-items:center;overflow:hidden;border:1px solid var(--line)}.brand-logo{width:100%;height:100%;object-fit:contain;padding:4px}.brand-title{font-size:20px;font-weight:900}.brand-subtitle{font-size:12px;color:var(--muted)}.header-actions{display:flex;gap:10px;align-items:center}.header-btn{border:1px solid var(--line);background:#fff;padding:10px 15px;border-radius:10px;font-weight:800}.primary-mini{background:var(--blue);color:#fff;border-color:var(--blue)}.clock{font-weight:800;min-width:245px;text-align:right;font-size:14px;font-variant-numeric:tabular-nums}
main{padding:14px}.view{display:none}.view.active{display:block}.view-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.view-title h1{margin:0}.view-title p{margin:5px 0 0;color:var(--muted)}.admin-layout{display:grid;grid-template-columns:320px 1fr;gap:14px;min-height:720px}.order-list-panel,.editor-panel{border:1px solid var(--line);border-radius:16px;background:#fff;padding:16px}.panel-title{font-size:20px;font-weight:900;margin-bottom:12px}.order-item{border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px;cursor:pointer}.order-item.active{border:2px solid var(--blue);background:#eef5ff}.order-item.current:after{content:"現場使用中";display:inline-block;margin-top:7px;background:var(--green);color:#fff;padding:3px 8px;border-radius:999px;font-size:12px}.order-item strong{display:block}.order-item span{color:var(--muted);font-size:13px}.list-actions{display:grid;gap:8px;margin-top:16px}
.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.form-grid label,.tail-row{display:flex;flex-direction:column;gap:6px;font-weight:800}.form-grid input,.production-editor input{border:1px solid var(--line);border-radius:9px;padding:12px}.highlight-field input{font-size:24px;font-weight:900;color:#123897}.production-editor{border-top:1px solid var(--line);margin-top:18px;padding-top:16px}.sub-title{font-weight:900;font-size:18px;margin-bottom:10px}.plan-row{display:flex;align-items:center;gap:9px;margin-bottom:9px}.plan-row input{width:90px}.remove-plan{border:0;background:#fff0f0;color:var(--red);padding:9px;border-radius:8px}.tail-row{flex-direction:row;align-items:center;margin-top:14px}.tail-row input{width:90px}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.primary-btn,.secondary-btn,.success-btn,.danger-btn,.warning-btn{border-radius:10px;padding:14px 20px;font-weight:900}.primary-btn{border:0;background:linear-gradient(90deg,var(--blue),#0648b9);color:#fff;font-size:20px}.primary-btn.small{font-size:16px;padding:12px 16px}.secondary-btn{border:1px solid var(--line);background:#fff;color:var(--ink)}.success-btn{border:1px solid #bfe2c8;background:#f3fbf5;color:var(--green)}.danger-btn{border:1px solid #ffc7c7;background:#fff5f5;color:var(--red)}
.empty-state{text-align:center;padding:100px}.hidden{display:none!important}.screen{display:none;min-height:700px;border:1px solid var(--line);border-radius:18px;padding:18px;position:relative;background:linear-gradient(#fff,#fbfdff)}.screen.active{display:block}.screen-title-row{display:flex;align-items:center;gap:12px}.screen-title-row h1{margin:0;font-size:24px}.step-badge{width:36px;height:36px;background:var(--navy);color:#fff;border-radius:8px;display:grid;place-items:center;font-weight:900;font-size:20px}.back-btn{border:0;background:transparent;color:var(--navy);font-size:30px}.order-number{margin-left:auto}.order-layout{display:grid;grid-template-columns:1fr 1fr 1.3fr 2fr;gap:14px;margin-top:28px}.info-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;min-height:300px;background:#fff}.card-label{background:#edf3fa;text-align:center;padding:10px;font-weight:800;font-size:13px}.customer-card{display:flex;flex-direction:column}.customer-name{font-size:54px;font-weight:900;display:grid;place-items:center;flex:1}.big-value{font-size:34px;font-weight:900;padding:26px 16px 14px}.kv{display:flex;justify-content:space-between;padding:16px;border-top:1px solid #edf1f7;font-size:17px}.production-card{display:grid;grid-template-columns:1.35fr 1fr;grid-template-rows:auto 1fr}.production-card .card-label{grid-column:1/-1}.cut-length-label{text-align:center;font-size:20px;font-weight:800;padding-top:25px}.cut-length{text-align:center;font-size:72px;font-weight:900;color:#123897;line-height:1.1}.cut-length small{font-size:26px;margin-left:7px}.plan-list{border-left:1px solid var(--line);padding:20px;display:flex;flex-direction:column;justify-content:center;gap:18px;font-size:24px;font-weight:800}.bottom-action{position:absolute;left:18px;right:18px;bottom:18px;width:calc(100% - 36px)}
.speed-panel{text-align:center;margin-top:45px}.speed-choices{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:25px}.speed-choice{width:52px;height:52px;border-radius:50%;border:2px solid #8bb2ed;background:#fff;font-size:21px}.speed-choice.selected{background:var(--green);color:#fff;border-color:var(--green)}.current-speed-card{width:300px;margin:35px auto;border:1px solid var(--line);border-radius:14px;padding:20px}.current-speed-card span{display:block;font-size:22px;font-weight:800}.current-speed-card strong{display:block;font-size:84px;color:var(--green)}
.machine-caption{text-align:center;color:var(--muted);font-weight:800;margin:18px}.machine-line,.mini-machine{display:flex;align-items:flex-end;justify-content:center}.connected-group{display:flex;gap:44px;position:relative}.connected-group:after{content:"";position:absolute;left:18px;right:18px;top:43px;height:6px;background:#2d3137;border-radius:3px}.machine-unit{width:78px;height:105px;position:relative;z-index:1;display:flex;align-items:center;justify-content:flex-end;flex-direction:column}.machine-unit:before{content:"";width:54px;height:72px;border:3px solid #23272c;border-radius:8px;background:linear-gradient(#e8e8e8,#bfc3c8);position:absolute;bottom:22px}.machine-unit:after{content:"";width:72px;height:5px;background:#282c31;position:absolute;bottom:18px}.ram{position:absolute;width:12px;height:54px;background:#58616a;border:2px solid #1c2228;bottom:30px;z-index:2}.machine-unit b{position:relative;z-index:3}.gap-line{width:70px;height:6px;background:#2d3137;margin-bottom:57px}.coil{width:82px;height:82px;border:4px solid #262a2f;border-radius:50%;background:radial-gradient(circle,#23272c 0 7px,#ececec 8px 28px,#9ca0a4 29px 36px,#d9d9d9 37px);margin-bottom:24px;position:relative}.coil:after{content:"";position:absolute;left:-10px;right:-10px;height:6px;background:#262a2f;bottom:-12px}.hydraulic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:24px 0 90px}.hyd-card{border:1px solid var(--line);border-radius:14px;padding:12px;text-align:center}.value-display,.unit0-value{border:1px solid #cbd7e8;border-radius:9px;padding:10px;font-size:26px;font-weight:900}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}.keypad button{border:0;border-radius:7px;background:#132537;color:#fff;padding:12px 6px;font-size:20px;font-weight:800}.keypad .enter{background:var(--blue)}
.rollback-pill{margin-left:auto}.operation-top{display:flex;justify-content:space-between;align-items:center}.mini-machine{transform:scale(.8);transform-origin:left center}.connected-group.compact{gap:24px}.current-speed-inline{border:1px solid var(--line);border-radius:10px;padding:10px 15px}.current-speed-inline strong{color:var(--green);font-size:30px}.operation-grid{display:grid;grid-template-columns:1fr 280px;gap:22px}.controls-432{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.control-card{text-align:center}.control-stack{height:260px;border-radius:14px;overflow:hidden;border:1px solid var(--line);display:grid;grid-template-rows:1fr .78fr 1fr}.control-stack button{border:0;font-size:40px;font-weight:900}.plus{background:var(--green);color:#fff}.neutral{background:#f4f6f8}.minus{background:var(--red);color:#fff}.press-count{display:inline-block;background:var(--green);color:#fff;border-radius:999px;padding:4px 9px}.unit0-set{border:1px solid var(--line);border-radius:14px;padding:16px;text-align:center}.operation-actions{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:14px;margin-top:18px}.warning-btn{border:1px solid #ffd5ad;background:#fff8f0;color:var(--orange)}.completed{text-align:center;padding-top:45px}.check{width:86px;height:86px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:58px;margin:auto}.completed h2{font-size:44px;color:var(--green)}.summary-grid{display:grid;grid-template-columns:repeat(2,280px);gap:28px;justify-content:center}.summary-card{border:1px solid var(--line);border-radius:14px;padding:26px}.summary-card strong{display:block;font-size:40px;margin-top:16px}.done-btn{width:420px;margin-top:40px}
.modal{position:fixed;inset:0;background:rgba(8,25,54,.48);display:grid;place-items:center;z-index:50}.modal-card{width:min(720px,92vw);background:#fff;border-radius:18px;padding:18px}.modal-header{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line)}.modal-header h2{flex:1}.issue-row{display:grid;grid-template-columns:54px 1fr auto auto;gap:14px;align-items:center;padding:20px 8px;border-bottom:1px solid var(--line)}.issue-icon{width:48px;height:48px;border-radius:12px;color:#fff;display:grid;place-items:center;font-size:24px;font-weight:900}.danger{background:var(--red)}.machine{background:var(--orange)}.other{background:var(--blue)}.issue-copy span{display:block;color:var(--muted)}.photo-btn{width:48px;height:48px;background:var(--blue);color:#fff;border-radius:10px;display:grid;place-items:center}.switch input{display:none}.switch span{display:block;width:58px;height:32px;border-radius:20px;background:#cfd5dc;position:relative}.switch span:after{content:"";width:26px;height:26px;background:#fff;border-radius:50%;position:absolute;left:3px;top:3px}.switch input:checked+span{background:var(--green)}.switch input:checked+span:after{left:29px}.text-input{border:1px solid var(--line);padding:12px;border-radius:8px}.modal-actions{display:flex;justify-content:space-between;margin-top:16px}.danger-link{border:0;background:transparent;color:var(--red);font-weight:900}
@media(max-width:900px){.admin-layout{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr 1fr}.order-layout{grid-template-columns:1fr 1fr}.production-card{grid-column:1/-1}.operation-grid{grid-template-columns:1fr}}


/* ===== V5 iPad landscape / factory touch optimization ===== */
.screen{
  min-height:calc(100vh - 108px);
  padding:22px 24px 112px;
}
.screen-title-row h1{font-size:28px}
.step-badge{width:44px;height:44px;font-size:24px}
.back-btn{min-width:58px;min-height:58px;font-size:38px;border-radius:12px}
.bottom-action{
  left:24px;
  right:24px;
  bottom:22px;
  width:calc(100% - 48px);
  min-height:82px;
  font-size:32px;
  letter-spacing:1px;
  border-radius:16px;
  box-shadow:0 8px 22px rgba(7,87,201,.2);
}
.order-layout{
  grid-template-columns:1.05fr 1fr 1.55fr 2.1fr;
  gap:16px;
  margin-top:26px;
}
.info-card{min-height:350px}
.card-label{font-size:16px;padding:13px}
.customer-name{font-size:52px;padding:16px;text-align:center}
.big-value{font-size:46px;padding:30px 18px 18px}
.kv{padding:18px;font-size:21px}
.kv strong{font-size:27px}
.coil-info-card{display:grid;grid-template-rows:auto 1.25fr 1fr 1fr}
.coil-metric{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  border-top:1px solid #edf1f7;
  padding:12px;
}
.coil-metric span{font-size:17px;color:var(--muted);font-weight:800}
.coil-metric strong{font-size:32px;color:var(--ink)}
.thickness-metric{
  background:linear-gradient(180deg,#f5f9ff,#fff);
}
.thickness-metric strong{
  font-size:46px;
  color:#123897;
}
.cut-length-label{font-size:24px;padding-top:32px}
.cut-length{font-size:86px}
.cut-length small{font-size:31px}
.plan-list{font-size:27px;gap:22px}
.speed-panel{margin-top:34px}
.speed-panel h2{font-size:34px;margin-bottom:22px}
.speed-choices{
  flex-wrap:nowrap;
  gap:14px;
  margin:22px 0 34px;
}
.speed-choice{
  width:76px;
  height:76px;
  min-width:76px;
  font-size:29px;
  border-width:3px;
  box-shadow:0 4px 10px rgba(8,42,97,.08);
}
.current-speed-card{
  width:360px;
  margin:28px auto;
  padding:20px;
}
.current-speed-card strong{font-size:92px}
.machine-wrap{margin-top:14px}
.machine-caption{font-size:18px;margin:12px 0 34px}
.machine-line{min-height:170px}
.machine-unit{
  width:96px;
  height:128px;
}
.machine-unit:before{width:66px;height:84px;bottom:24px}
.machine-unit:after{width:86px;bottom:18px}
.machine-unit .ram{height:64px;bottom:31px}
.machine-unit b{font-size:24px}
.connected-group{gap:56px}
.connected-group:after{top:53px;height:7px}
.gap-line{width:84px;height:7px;margin-bottom:68px}
.coil{width:96px;height:96px;margin-bottom:28px}
.machine-value{
  position:absolute;
  top:-30px;
  left:50%;
  transform:translateX(-50%);
  z-index:5;
  min-width:78px;
  padding:7px 10px;
  border-radius:10px;
  background:#123897;
  color:#fff;
  font-size:20px;
  font-weight:900;
  text-align:center;
  box-shadow:0 4px 12px rgba(18,56,151,.2);
}
.hydraulic-grid{
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin:20px 0 110px;
  align-items:start;
}
.hyd-card{
  padding:14px;
  min-height:150px;
  transition:.15s ease;
}
.hyd-card.editing{
  border:2px solid var(--blue);
  box-shadow:0 8px 24px rgba(7,87,201,.12);
}
.hyd-card h3{font-size:24px;margin:0 0 10px}
.value-display,.unit0-value{
  width:100%;
  min-height:66px;
  background:#fbfdff;
  color:var(--ink);
  border:2px solid #b9c9df;
  font-size:34px;
  cursor:pointer;
}
.input-hint{
  min-height:34px;
  margin-top:8px;
  color:var(--muted);
  font-size:14px;
  font-weight:700;
}
.keypad{
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-top:12px;
}
.keypad button{
  min-height:56px;
  padding:8px;
  font-size:24px;
  border-radius:10px;
}
.keypad .edit-key{background:#566675}
.keypad .wide-key{grid-column:span 2}
.keypad .enter{background:var(--blue);font-size:20px}
.operation-grid{grid-template-columns:1fr 330px}
.control-stack{height:330px}
.control-stack button{font-size:54px}
.control-card h3{font-size:24px}
.press-count{font-size:20px;padding:6px 12px}
.unit0-set{padding:18px}
.unit0-set label{font-size:22px}
.unit0-value{margin-top:12px}
.operation-actions{gap:16px;margin-top:20px}
.operation-actions button{
  min-height:78px;
  font-size:24px;
  border-radius:15px;
}
.modal-card{
  width:min(940px,95vw);
  max-height:92vh;
  overflow:auto;
  padding:22px;
}
.modal-header h2{font-size:28px}
.issue-row{
  grid-template-columns:64px 1fr auto auto;
  gap:16px;
  padding:22px 10px;
}
.issue-icon{width:58px;height:58px;font-size:29px}
.issue-copy strong{font-size:22px}
.issue-copy span{font-size:15px;margin-top:5px}
.large-photo-btn{
  width:auto;
  min-width:150px;
  height:58px;
  padding:0 18px;
  display:flex;
  gap:8px;
  font-size:18px;
  font-weight:900;
}
.photo-count{
  min-width:62px;
  font-size:18px;
  font-weight:900;
  color:var(--blue);
}
.photo-issue-row{
  grid-template-columns:64px 1fr auto auto;
}
.photo-preview{
  grid-column:2/-1;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  min-height:2px;
}
.photo-thumb{
  width:88px;
  height:70px;
  position:relative;
  border-radius:9px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#edf1f7;
}
.photo-thumb img{width:100%;height:100%;object-fit:cover}
.photo-thumb button{
  position:absolute;
  top:2px;
  right:2px;
  width:26px;
  height:26px;
  border:0;
  border-radius:50%;
  background:rgba(224,23,23,.9);
  color:#fff;
  font-size:19px;
  line-height:1;
}
.other-row .text-input{
  grid-column:2/3;
  min-height:58px;
  font-size:18px;
}
.other-row .large-photo-btn{grid-column:3/4}
.other-row .photo-count{grid-column:4/5}
.modal-actions .primary-btn{min-width:220px;min-height:64px}
.hidden{display:none!important}

@media (orientation:landscape) and (min-width:1000px){
  .app-header{height:78px}
  main{padding:12px}
}

.version-badge{
  display:inline-grid;
  place-items:center;
  min-width:40px;
  height:28px;
  padding:0 9px;
  border-radius:999px;
  background:#edf3fa;
  color:#082a61;
  border:1px solid #cbd7e8;
  font-size:13px;
  font-weight:900;
}


/* ===== V7: iPad 橫式不擁擠＋時間紀錄 ===== */

/* 頁面固定在橫式可視區域內，按鍵即使內容較長也保持可見 */
.screen{
  height:calc(100dvh - 102px);
  min-height:600px;
  overflow-y:auto;
  padding:18px 22px 18px;
  scrollbar-gutter:stable;
}
.screen.active{
  display:flex;
  flex-direction:column;
}
.bottom-action{
  position:sticky;
  z-index:12;
  left:auto;
  right:auto;
  bottom:12px;
  width:100%;
  min-height:94px;
  margin-top:18px;
  padding:18px 28px;
  font-size:34px;
  border-radius:18px;
  flex:0 0 auto;
}

/* Page 1：Production Plan 全部放在 Cut Length 下方 */
.order-layout{
  grid-template-columns:1.05fr .95fr 1.45fr 2.05fr;
  gap:14px;
  margin-top:18px;
  flex:0 0 auto;
}
.info-card{
  min-height:318px;
}
.production-card{
  display:flex;
  flex-direction:column;
  grid-template-columns:none;
  grid-template-rows:none;
}
.production-card .card-label{
  width:100%;
}
.production-card > div:nth-child(2){
  flex:0 0 auto;
}
.cut-length-label{
  padding-top:16px;
}
.cut-length{
  font-size:78px;
  line-height:1;
  margin-bottom:12px;
}
.plan-list{
  border-left:0;
  border-top:1px solid var(--line);
  padding:14px 16px 16px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 16px;
  justify-content:stretch;
  font-size:22px;
  line-height:1.2;
}
.plan-list > div{
  background:#f5f8fc;
  border:1px solid #e0e8f2;
  border-radius:10px;
  padding:9px 11px;
  text-align:center;
  white-space:nowrap;
}
.coil-info-card{
  min-height:318px;
}
.thickness-metric strong{
  font-size:43px;
}

/* Page 2/3：讓 NEXT 不必下滑 */
.speed-panel{
  margin-top:22px;
}
.current-speed-card{
  margin:18px auto 10px;
  padding:14px;
}
.current-speed-card strong{
  font-size:76px;
}
.machine-caption{
  margin:8px 0 27px;
}
.machine-line{
  min-height:145px;
}
.hydraulic-grid{
  margin:10px 0 8px;
}
.hyd-card{
  min-height:132px;
}

/* 操作紀錄面板 */
.time-log-panel,
.completed-record-panel{
  margin-top:14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  overflow:hidden;
}
.time-log-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 14px;
  background:#edf3fa;
  border-bottom:1px solid var(--line);
}
.time-log-header strong{
  font-size:18px;
}
.time-log-header span{
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}
.time-log-list{
  max-height:142px;
  overflow-y:auto;
}
.time-log-row{
  display:grid;
  grid-template-columns:minmax(205px,245px) 1fr;
  gap:14px;
  align-items:center;
  padding:9px 14px;
  border-bottom:1px solid #edf1f7;
}
.time-log-row:last-child{
  border-bottom:0;
}
.time-log-row time{
  font-variant-numeric:tabular-nums;
  font-size:14px;
  font-weight:900;
  color:#123897;
  white-space:nowrap;
}
.time-log-row span{
  font-size:16px;
  font-weight:750;
}
.time-log-empty{
  padding:16px;
  text-align:center;
  color:var(--muted);
}
.operation-actions{
  margin-top:12px;
}
.operation-actions button{
  min-height:82px;
}
.completed{
  padding-top:18px;
}
.completed h2{
  margin:12px 0 16px;
}
.summary-grid{
  grid-template-columns:repeat(4,minmax(180px,1fr));
  gap:12px;
}
.summary-card{
  padding:15px;
}
.summary-card strong{
  font-size:30px;
  margin-top:10px;
}
.summary-card .summary-time{
  font-size:16px;
  line-height:1.35;
}
.completed-record-panel{
  max-width:1100px;
  margin:16px auto 0;
}
.completed-log{
  max-height:160px;
}
.completed-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-top:14px;
}
.completed-actions .secondary-btn,
.completed-actions .done-btn{
  width:min(420px,42%);
  min-height:70px;
  margin-top:0;
  font-size:22px;
}

/* iPad 常見橫式高度 */
@media (orientation:landscape) and (max-height:850px){
  .app-header{
    height:68px;
  }
  main{
    padding:8px;
  }
  .screen{
    height:calc(100dvh - 84px);
    min-height:540px;
    padding:12px 16px 12px;
  }
  .screen-title-row h1{
    font-size:24px;
  }
  .step-badge{
    width:38px;
    height:38px;
    font-size:21px;
  }
  .order-layout{
    margin-top:12px;
  }
  .info-card,
  .coil-info-card{
    min-height:292px;
  }
  .customer-name{
    font-size:46px;
  }
  .big-value{
    font-size:40px;
    padding:22px 16px 12px;
  }
  .coil-metric strong{
    font-size:28px;
  }
  .thickness-metric strong{
    font-size:40px;
  }
  .cut-length{
    font-size:70px;
  }
  .plan-list{
    font-size:20px;
    padding:11px 13px 13px;
    gap:8px 12px;
  }
  .bottom-action{
    min-height:84px;
    font-size:31px;
    bottom:8px;
    margin-top:12px;
  }
  .speed-choice{
    width:70px;
    height:70px;
    min-width:70px;
  }
  .control-stack{
    height:275px;
  }
  .time-log-list{
    max-height:116px;
  }
}


/* ===== V8：第一頁 START 大型觸控按鍵 ===== */
.screen[data-step="1"] .bottom-action{
  min-height:118px;
  padding-top:27px;
  padding-bottom:27px;
  font-size:38px;
  border-radius:20px;
  margin-top:16px;
  box-shadow:0 10px 28px rgba(7,87,201,.24);
}

@media (orientation:landscape) and (max-height:850px){
  .screen[data-step="1"] .bottom-action{
    min-height:106px;
    padding-top:23px;
    padding-bottom:23px;
    font-size:35px;
  }
}


/* ===== V9：全切／多 Cut Length ===== */
.production-editor{border-top:1px solid var(--line);margin-top:18px;padding-top:18px}
.production-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}
.field-help{margin-top:4px;color:var(--muted);font-size:14px;font-weight:650}
.cut-mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;min-width:330px;padding:5px;border:1px solid var(--line);border-radius:14px;background:#eef3f8}
.cut-mode-choice{display:block;cursor:pointer}.cut-mode-choice input,.remainder-choice input{position:absolute;opacity:0;pointer-events:none}
.cut-mode-choice span{display:grid;place-items:center;min-height:58px;padding:10px 18px;border:2px solid transparent;border-radius:11px;background:#fff;font-size:19px;font-weight:900}
.cut-mode-choice.selected span{border-color:var(--blue);background:#eaf2ff;color:#0a45a6;box-shadow:0 4px 12px rgba(7,87,201,.14)}
.full-cut-panel{display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;margin:12px 0 16px;padding:15px;border:2px solid #b9cff3;border-radius:14px;background:#f5f9ff}
.full-cut-length{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:19px;font-weight:900}
.length-input-wrap,.mini-input-unit{display:flex;align-items:center;gap:8px}.full-cut-length input{width:210px;padding:14px 16px;border:2px solid #8eb4ee;border-radius:10px;font-size:30px;font-weight:900;color:#123897;text-align:center}
.full-cut-preview{min-width:210px;padding:15px;border-radius:12px;background:#123897;color:#fff;font-size:28px;font-weight:950;text-align:center;font-variant-numeric:tabular-nums}
.plan-column-labels,.plan-row{display:grid;grid-template-columns:minmax(190px,1.55fr) 100px 48px 100px 40px 82px;gap:9px;align-items:end}
.plan-column-labels{padding:0 10px 6px;color:var(--muted);font-size:12px;font-weight:850;text-align:center}.plan-rows{display:grid;gap:9px}
.plan-row{margin:0;padding:11px;border:1px solid var(--line);border-radius:12px;background:#fbfdff}.plan-field{display:flex;flex-direction:column;gap:5px;min-width:0}.plan-field>span{color:var(--muted);font-size:12px;font-weight:800}
.plan-row input{width:100%;min-width:0;padding:12px 9px;border:1px solid #bdcbe0;border-radius:9px;font-size:20px;font-weight:850;text-align:center}.plan-length-field input{font-size:24px;color:#123897}.plan-symbol{align-self:center;padding-bottom:12px;font-size:17px;font-weight:900;white-space:nowrap}
.plan-row .remove-plan{min-height:48px;padding:8px;font-weight:850}.add-plan-btn{width:100%;min-height:54px;margin-top:10px;font-size:17px}
.remainder-editor{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}.remainder-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.remainder-choice{display:block;cursor:pointer}.remainder-choice>span{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:105px;padding:14px;border:2px solid #cbd5e2;border-radius:14px;background:#fff;text-align:center}.remainder-choice b{font-size:21px}.remainder-choice i{margin:7px 0;color:var(--muted);font-size:13px;font-style:normal;font-weight:750}.remainder-choice.selected>span{border-color:var(--blue);background:#eef5ff;color:#0b459e;box-shadow:0 5px 14px rgba(7,87,201,.13)}
.full-cut-display{flex:0 0 auto}.full-cut-display .cut-length-label{padding-top:9px}.full-cut-title{display:flex;align-items:baseline;justify-content:center;gap:5px;margin-bottom:7px;font-size:58px}.full-cut-title strong{margin-left:9px;font-size:28px;color:#123897}.mixed-cut-title{padding:11px 12px 9px;color:#9b5600;font-size:17px;font-weight:950;text-align:center}
.production-card .plan-list{width:100%;flex:1;min-height:0;overflow-y:auto;border-top:1px solid var(--line);border-left:0;padding:9px 11px 11px;align-content:start;gap:7px;font-size:17px}.full-plan-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.mixed-plan-list{display:flex!important;flex-direction:column!important}.full-plan-item{display:grid;place-items:center;min-height:44px;padding:8px;border:1px solid #dde6f1;border-radius:9px;background:#f6f9fd;font-size:18px;font-weight:900;text-align:center}.cut-plan-block{display:grid;grid-template-columns:minmax(110px,.8fr) minmax(150px,1.25fr);align-items:center;min-height:48px;padding:7px 10px;border:1px solid #ccd9eb;border-radius:10px;background:#f7faff;text-align:center}.cut-plan-length{color:#123897;font-size:23px;line-height:1.05;font-variant-numeric:tabular-nums}.cut-plan-detail{color:#24364d;font-size:16px;font-weight:900}
.remainder-display{grid-column:1/-1;display:flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;border:2px dashed #c8a14c;border-radius:10px;background:#fff9e9;color:#764a00;text-align:center}.remainder-display strong{font-size:18px}.separate-remainder{flex-direction:column;min-height:82px}.remainder-blank-line{display:block;width:100%;height:13px}
@media(max-width:1100px){.production-editor-head{flex-direction:column}.cut-mode-switch{width:100%;min-width:0}.full-cut-panel{grid-template-columns:1fr}.plan-column-labels{display:none}.plan-row{grid-template-columns:minmax(165px,1.4fr) 86px 42px 86px 36px 70px;gap:7px;padding:9px}}
@media(orientation:landscape) and (max-height:850px){.full-cut-title{font-size:48px}.full-cut-title strong{font-size:24px}.mixed-cut-title{padding:7px;font-size:15px}.production-card .plan-list{padding:6px 8px 8px;gap:5px}.cut-plan-block{min-height:43px;padding:5px 8px}.cut-plan-length{font-size:20px}.cut-plan-detail{font-size:14px}.remainder-display{min-height:38px;padding:5px 8px}.remainder-display strong{font-size:15px}}


/* ===== V11：iPad 橫式全頁免下滑＋底部彈出鍵盤 ===== */

body.operator-mode{
  height:100dvh;
  overflow:hidden;
  overscroll-behavior:none;
}

body.operator-mode #app{
  height:100dvh;
  min-height:0;
  overflow:hidden;
}

body.operator-mode .app-header{
  height:62px;
  padding-top:7px;
  padding-bottom:7px;
}

body.operator-mode .brand-logo-wrap{
  width:48px;
  height:40px;
}

body.operator-mode .brand-title{
  font-size:18px;
}

body.operator-mode .brand-subtitle{
  font-size:10px;
}

body.operator-mode .header-btn{
  padding:8px 12px;
}

body.operator-mode .clock{
  min-width:230px;
  font-size:13px;
}

body.operator-mode main{
  height:calc(100dvh - 62px);
  padding:6px 8px 8px;
  overflow:hidden;
}

body.operator-mode #operatorView,
body.operator-mode #workflowArea{
  height:100%;
  min-height:0;
  overflow:hidden;
}

body.operator-mode .screen{
  width:100%;
  height:100%;
  min-height:0;
  max-height:100%;
  padding:10px 14px 10px;
  overflow:hidden;
  border-radius:14px;
}

body.operator-mode .screen.active{
  display:flex;
  flex-direction:column;
}

body.operator-mode .screen-title-row{
  min-height:40px;
  flex:0 0 40px;
  gap:8px;
}

body.operator-mode .screen-title-row h1{
  font-size:22px;
}

body.operator-mode .step-badge{
  width:36px;
  height:36px;
  font-size:20px;
}

body.operator-mode .back-btn{
  min-width:42px;
  min-height:40px;
  font-size:30px;
}

body.operator-mode .bottom-action{
  position:relative;
  inset:auto;
  bottom:auto;
  width:100%;
  flex:0 0 auto;
  margin-top:8px;
}

/* Page 1 */
body.operator-mode .screen[data-step="1"] .order-layout{
  flex:1 1 auto;
  min-height:0;
  margin-top:8px;
  gap:10px;
}

body.operator-mode .screen[data-step="1"] .info-card,
body.operator-mode .screen[data-step="1"] .coil-info-card{
  height:100%;
  min-height:0;
}

body.operator-mode .screen[data-step="1"] .card-label{
  padding:8px;
  font-size:13px;
}

body.operator-mode .screen[data-step="1"] .customer-name{
  font-size:42px;
  padding:10px;
}

body.operator-mode .screen[data-step="1"] .big-value{
  padding:16px 12px 8px;
  font-size:36px;
}

body.operator-mode .screen[data-step="1"] .kv{
  padding:11px 13px;
  font-size:17px;
}

body.operator-mode .screen[data-step="1"] .coil-metric{
  padding:7px;
  gap:3px;
}

body.operator-mode .screen[data-step="1"] .coil-metric strong{
  font-size:25px;
}

body.operator-mode .screen[data-step="1"] .thickness-metric strong{
  font-size:35px;
}

body.operator-mode .screen[data-step="1"] .full-cut-display .cut-length-label{
  padding-top:5px;
  font-size:17px;
}

body.operator-mode .screen[data-step="1"] .full-cut-title{
  margin-bottom:4px;
  font-size:42px;
}

body.operator-mode .screen[data-step="1"] .full-cut-title strong{
  font-size:21px;
}

body.operator-mode .screen[data-step="1"] .production-card .plan-list{
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:5px 7px 7px;
}

body.operator-mode .screen[data-step="1"] .full-plan-item,
body.operator-mode .screen[data-step="1"] .cut-plan-block{
  min-height:38px;
}

body.operator-mode .screen[data-step="1"] .bottom-action{
  min-height:96px;
  padding-top:20px;
  padding-bottom:20px;
  font-size:34px;
  margin-top:8px;
}

/* Page 2 */
body.operator-mode .screen[data-step="2"] .speed-panel{
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  margin-top:0;
}

body.operator-mode .screen[data-step="2"] .speed-panel h2{
  margin:0 0 10px;
  font-size:27px;
}

body.operator-mode .screen[data-step="2"] .speed-choices{
  flex-wrap:nowrap;
  gap:9px;
  margin:8px 0 12px;
}

body.operator-mode .screen[data-step="2"] .speed-choice{
  width:64px;
  height:64px;
  min-width:64px;
  font-size:25px;
}

body.operator-mode .screen[data-step="2"] .current-speed-card{
  width:290px;
  margin:8px auto 0;
  padding:10px;
}

body.operator-mode .screen[data-step="2"] .current-speed-card span{
  font-size:18px;
}

body.operator-mode .screen[data-step="2"] .current-speed-card strong{
  font-size:62px;
  line-height:1;
}

/* Page 3 */
body.operator-mode .screen[data-step="3"] .machine-wrap{
  flex:0 0 145px;
  min-height:0;
  margin-top:0;
}

body.operator-mode .screen[data-step="3"] .machine-caption{
  margin:2px 0 14px;
  font-size:14px;
}

body.operator-mode .screen[data-step="3"] .machine-line{
  min-height:112px;
  transform:scale(.82);
  transform-origin:center top;
}

body.operator-mode .screen[data-step="3"] .hydraulic-grid{
  flex:1 1 auto;
  min-height:0;
  grid-template-columns:repeat(4,1fr);
  align-items:start;
  gap:10px;
  margin:4px 0 0;
}

body.operator-mode .screen[data-step="3"] .hyd-card{
  min-height:0;
  padding:8px;
}

body.operator-mode .screen[data-step="3"] .hyd-card h3{
  margin:0 0 5px;
  font-size:19px;
}

body.operator-mode .screen[data-step="3"] .value-display{
  min-height:52px;
  padding:6px;
  font-size:28px;
}

body.operator-mode .screen[data-step="3"] .input-hint{
  min-height:24px;
  margin-top:4px;
  font-size:11px;
  line-height:1.2;
}

body.operator-mode .screen[data-step="3"] .bottom-action{
  min-height:70px;
  padding:12px 20px;
  font-size:28px;
}

/* Popup keypad used on Page 3 and Unit 0 on Page 4 */
.popup-keypad:not(.hidden){
  position:fixed;
  left:50%;
  bottom:max(12px, env(safe-area-inset-bottom));
  z-index:120;
  width:min(590px, calc(100vw - 32px));
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
  margin:0;
  padding:11px;
  border:2px solid var(--blue);
  border-radius:18px;
  background:rgba(245,248,252,.98);
  box-shadow:0 -12px 40px rgba(8,42,97,.30);
  transform:translateX(-50%);
  animation:ruijiKeypadUp .18s ease-out;
  backdrop-filter:blur(10px);
}

.popup-keypad:not(.hidden) button{
  min-height:52px;
  padding:6px;
  border-radius:11px;
  font-size:24px;
}

.popup-keypad:not(.hidden) .wide-key{
  grid-column:span 3;
}

.popup-keypad:not(.hidden) .enter{
  font-size:21px;
}

@keyframes ruijiKeypadUp{
  from{
    opacity:0;
    transform:translate(-50%,24px);
  }
  to{
    opacity:1;
    transform:translate(-50%,0);
  }
}

/* Page 4 */
body.operator-mode .screen[data-step="4"] .operation-top{
  flex:0 0 74px;
  min-height:0;
}

body.operator-mode .screen[data-step="4"] .mini-machine{
  width:600px;
  transform:scale(.56);
  transform-origin:left center;
  margin-right:-245px;
}

body.operator-mode .screen[data-step="4"] .current-speed-inline{
  padding:7px 12px;
  font-size:15px;
}

body.operator-mode .screen[data-step="4"] .current-speed-inline strong{
  font-size:25px;
}

body.operator-mode .screen[data-step="4"] .operation-grid{
  flex:1 1 auto;
  min-height:0;
  grid-template-columns:1fr 250px;
  gap:12px;
}

body.operator-mode .screen[data-step="4"] .controls-432{
  min-height:0;
  gap:10px;
}

body.operator-mode .screen[data-step="4"] .control-card{
  min-height:0;
  display:flex;
  flex-direction:column;
}

body.operator-mode .screen[data-step="4"] .control-card h3{
  margin:3px 0 5px;
  font-size:18px;
}

body.operator-mode .screen[data-step="4"] .press-count{
  align-self:center;
  padding:3px 8px;
  font-size:15px;
}

body.operator-mode .screen[data-step="4"] .control-stack{
  flex:1 1 auto;
  height:auto;
  min-height:196px;
}

body.operator-mode .screen[data-step="4"] .control-stack button{
  font-size:38px;
}

body.operator-mode .screen[data-step="4"] .unit0-set{
  min-height:0;
  padding:10px;
}

body.operator-mode .screen[data-step="4"] .unit0-set label{
  font-size:17px;
}

body.operator-mode .screen[data-step="4"] .unit0-value{
  min-height:54px;
  margin-top:6px;
  padding:7px;
  font-size:29px;
}

body.operator-mode .screen[data-step="4"] .unit0-set .input-hint{
  min-height:21px;
  margin-top:4px;
  font-size:11px;
}

body.operator-mode .screen[data-step="4"] .operation-actions{
  flex:0 0 64px;
  gap:9px;
  margin-top:8px;
}

body.operator-mode .screen[data-step="4"] .operation-actions button{
  min-height:64px;
  padding:8px 10px;
  font-size:19px;
}

body.operator-mode .screen[data-step="4"] .time-log-panel{
  flex:0 0 100px;
  min-height:0;
  margin-top:7px;
}

body.operator-mode .screen[data-step="4"] .time-log-header{
  padding:6px 10px;
}

body.operator-mode .screen[data-step="4"] .time-log-header strong{
  font-size:15px;
}

body.operator-mode .screen[data-step="4"] .time-log-header span{
  font-size:11px;
}

body.operator-mode .screen[data-step="4"] .time-log-list{
  max-height:66px;
  overflow-y:auto;
  overscroll-behavior:contain;
}

body.operator-mode .screen[data-step="4"] .time-log-row{
  grid-template-columns:205px 1fr;
  gap:8px;
  padding:5px 9px;
}

body.operator-mode .screen[data-step="4"] .time-log-row time{
  font-size:11px;
}

body.operator-mode .screen[data-step="4"] .time-log-row span{
  font-size:13px;
}

/* Page 5 */
body.operator-mode .screen[data-step="5"] .completed{
  flex:1 1 auto;
  min-height:0;
  padding-top:4px;
  overflow:hidden;
}

body.operator-mode .screen[data-step="5"] .check{
  width:54px;
  height:54px;
  font-size:36px;
}

body.operator-mode .screen[data-step="5"] .completed h2{
  margin:4px 0 8px;
  font-size:28px;
}

body.operator-mode .screen[data-step="5"] .summary-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}

body.operator-mode .screen[data-step="5"] .summary-card{
  padding:8px;
}

body.operator-mode .screen[data-step="5"] .summary-card span{
  font-size:11px;
}

body.operator-mode .screen[data-step="5"] .summary-card strong{
  margin-top:5px;
  font-size:22px;
}

body.operator-mode .screen[data-step="5"] .summary-card .summary-time{
  font-size:12px;
}

body.operator-mode .screen[data-step="5"] .completed-record-panel{
  margin-top:8px;
}

body.operator-mode .screen[data-step="5"] .completed-log{
  max-height:118px;
  overflow-y:auto;
}

body.operator-mode .screen[data-step="5"] .completed-actions{
  margin-top:8px;
}

body.operator-mode .screen[data-step="5"] .completed-actions .secondary-btn,
body.operator-mode .screen[data-step="5"] .completed-actions .done-btn{
  min-height:56px;
  padding:9px 14px;
  font-size:18px;
}

/* Very short landscape viewports */
@media (orientation:landscape) and (max-height:700px){
  body.operator-mode .app-header{
    height:56px;
  }

  body.operator-mode .brand-subtitle,
  body.operator-mode .clock{
    display:none;
  }

  body.operator-mode main{
    height:calc(100dvh - 56px);
    padding:4px 6px 6px;
  }

  body.operator-mode .screen{
    padding:7px 10px;
  }

  body.operator-mode .screen[data-step="1"] .bottom-action{
    min-height:82px;
    padding:15px;
  }

  body.operator-mode .screen[data-step="3"] .machine-wrap{
    flex-basis:124px;
  }

  body.operator-mode .screen[data-step="3"] .machine-line{
    transform:scale(.70);
  }

  body.operator-mode .screen[data-step="4"] .operation-top{
    flex-basis:58px;
  }

  body.operator-mode .screen[data-step="4"] .control-stack{
    min-height:166px;
  }

  body.operator-mode .screen[data-step="4"] .time-log-panel{
    flex-basis:86px;
  }

  .popup-keypad:not(.hidden) button{
    min-height:46px;
    font-size:21px;
  }
}


/* ===== V12：固定外框內重新排版，不重疊 ===== */
body.operator-mode .screen{overflow:hidden}
body.operator-mode .screen-title-row{flex:0 0 42px;min-height:42px}
body.operator-mode .screen-title-row h1{font-size:23px;letter-spacing:.02em}

/* Page 1 — clear four-card layout */
body.operator-mode .screen[data-step="1"] .order-layout{
  display:grid;
  grid-template-columns:1.02fr 1fr 1.18fr 1.72fr;
  gap:12px;
  align-items:stretch;
  flex:1 1 auto;
  min-height:0;
  margin-top:10px;
}
body.operator-mode .screen[data-step="1"] .info-card{
  min-width:0;
  min-height:0;
  height:100%;
  border-radius:16px;
  box-shadow:0 4px 16px rgba(20,50,90,.07);
}
body.operator-mode .screen[data-step="1"] .customer-card{
  display:grid;
  grid-template-rows:1fr 1fr;
}
body.operator-mode .screen[data-step="1"] .customer-section,
body.operator-mode .screen[data-step="1"] .order-section{
  min-height:0;
  display:flex;
  flex-direction:column;
}
body.operator-mode .screen[data-step="1"] .order-section{border-top:2px solid var(--line)}
body.operator-mode .screen[data-step="1"] .customer-name,
body.operator-mode .screen[data-step="1"] .order-value{
  flex:1;
  min-height:0;
  display:grid;
  place-items:center;
  padding:10px 8px;
  text-align:center;
  overflow-wrap:anywhere;
}
body.operator-mode .screen[data-step="1"] .customer-name{font-size:36px;line-height:1.12}
body.operator-mode .screen[data-step="1"] .order-value{font-size:25px;line-height:1.15;font-weight:900;color:var(--navy)}
body.operator-mode .screen[data-step="1"] .production-card{
  display:flex!important;
  flex-direction:column;
}
body.operator-mode .screen[data-step="1"] .full-cut-display{flex:0 0 auto;padding:4px 10px 7px}
body.operator-mode .screen[data-step="1"] .full-cut-title{font-size:38px;line-height:1.05}
body.operator-mode .screen[data-step="1"] .production-card .plan-list{
  flex:1 1 auto;
  min-height:0;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start;
  gap:6px;
  padding:8px 10px 10px;
  overflow-y:auto;
}
body.operator-mode .screen[data-step="1"] .full-plan-item,
body.operator-mode .screen[data-step="1"] .cut-plan-block,
body.operator-mode .screen[data-step="1"] .remainder-display{
  flex:0 0 auto;
  width:100%;
  min-height:38px;
  border-radius:9px;
}
body.operator-mode .screen[data-step="1"] .full-plan-item{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding:7px 12px;
  font-size:17px;
}
body.operator-mode .screen[data-step="1"] .cut-plan-block{
  display:flex!important;
  align-items:center;
  justify-content:flex-start;
  gap:14px;
  padding:7px 12px;
  text-align:left;
}
body.operator-mode .screen[data-step="1"] .cut-plan-length{flex:0 0 100px;font-size:19px;text-align:left}
body.operator-mode .screen[data-step="1"] .cut-plan-detail{font-size:17px;text-align:left}
body.operator-mode .screen[data-step="1"] .bottom-action{min-height:84px;font-size:31px}

/* Page 3 — stable rows, no scaling overlap */
body.operator-mode .screen[data-step="3"] .machine-wrap{
  flex:0 0 154px;
  min-height:154px;
  margin:4px 0 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
}
body.operator-mode .screen[data-step="3"] .machine-caption{margin:2px 0 8px;font-size:13px;line-height:1.25}
body.operator-mode .screen[data-step="3"] .machine-line{
  transform:scale(.76);
  transform-origin:top center;
  width:max-content;
  min-height:112px;
}
body.operator-mode .screen[data-step="3"] .hydraulic-grid{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  align-items:stretch;
  margin:4px 0 0;
}
body.operator-mode .screen[data-step="3"] .hyd-card{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:10px;
  border-radius:15px;
  box-shadow:0 4px 14px rgba(20,50,90,.06);
}
body.operator-mode .screen[data-step="3"] .hyd-card h3{font-size:20px;margin:0 0 8px}
body.operator-mode .screen[data-step="3"] .value-display{width:100%;min-height:60px;font-size:30px}
body.operator-mode .screen[data-step="3"] .input-hint{min-height:30px;margin-top:7px;font-size:12px;line-height:1.25}
body.operator-mode .screen[data-step="3"] .bottom-action{min-height:70px;font-size:27px}

/* Central modal keypad, intentionally covering the page */
.popup-keypad:not(.hidden){
  position:fixed!important;
  left:50%!important;
  top:50%!important;
  bottom:auto!important;
  z-index:999;
  width:min(620px,calc(100vw - 80px));
  transform:translate(-50%,-50%)!important;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  padding:18px;
  border:3px solid var(--blue);
  border-radius:22px;
  background:#f8fbff;
  box-shadow:0 0 0 100vmax rgba(3,18,40,.58),0 24px 70px rgba(0,0,0,.35);
  animation:ruijiKeypadCenter .16s ease-out;
}
.popup-keypad:not(.hidden) button{min-height:64px;font-size:27px;border-radius:12px}
.popup-keypad:not(.hidden) .enter{font-size:23px}
@keyframes ruijiKeypadCenter{
  from{opacity:0;transform:translate(-50%,-46%) scale(.96)}
  to{opacity:1;transform:translate(-50%,-50%) scale(1)}
}

/* Page 4 — remove log, center machine icon, larger controls */
body.operator-mode .screen[data-step="4"] .operation-top{
  flex:0 0 92px;
  min-height:92px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  position:relative;
}
body.operator-mode .screen[data-step="4"] .mini-machine{
  grid-column:2;
  width:max-content;
  margin:0;
  transform:scale(.64);
  transform-origin:center;
  justify-self:center;
}
body.operator-mode .screen[data-step="4"] .current-speed-inline{
  grid-column:3;
  justify-self:end;
  padding:8px 13px;
}
body.operator-mode .screen[data-step="4"] .operation-grid{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 255px;
  gap:14px;
  align-items:stretch;
}
body.operator-mode .screen[data-step="4"] .controls-432{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;min-height:0}
body.operator-mode .screen[data-step="4"] .control-card{min-width:0;min-height:0;display:grid;grid-template-rows:28px 28px 1fr;align-items:center}
body.operator-mode .screen[data-step="4"] .control-card h3{margin:0;font-size:19px}
body.operator-mode .screen[data-step="4"] .press-count{padding:4px 10px;font-size:15px}
body.operator-mode .screen[data-step="4"] .control-stack{
  height:auto;
  min-height:0;
  display:grid;
  grid-template-rows:1.2fr .62fr 1.2fr;
  border-radius:16px;
  box-shadow:0 5px 16px rgba(20,50,90,.08);
}
body.operator-mode .screen[data-step="4"] .control-stack button{font-size:44px;min-height:0}
body.operator-mode .screen[data-step="4"] .unit0-set{
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:16px;
  border-radius:16px;
  box-shadow:0 5px 16px rgba(20,50,90,.08);
}
body.operator-mode .screen[data-step="4"] .unit0-set label{font-size:19px}
body.operator-mode .screen[data-step="4"] .unit0-value{width:100%;min-height:70px;margin-top:10px;font-size:34px}
body.operator-mode .screen[data-step="4"] .operation-actions{
  flex:0 0 82px;
  display:grid;
  grid-template-columns:1fr 1.25fr 1.25fr;
  gap:12px;
  margin-top:10px;
}
body.operator-mode .screen[data-step="4"] .operation-actions button{
  min-height:82px;
  padding:12px 14px;
  border-radius:15px;
  font-size:21px;
  font-weight:900;
}
body.operator-mode .screen[data-step="4"] .warning-btn{background:#fff7ee}
body.operator-mode .screen[data-step="4"] .success-btn{font-size:23px}
body.operator-mode .screen[data-step="4"] .time-log-panel{display:none!important}

/* Page 5 — date and time on separate lines */
body.operator-mode .screen[data-step="5"] .summary-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  width:100%;
}
body.operator-mode .screen[data-step="5"] .summary-card{min-width:0;padding:11px 8px}
body.operator-mode .screen[data-step="5"] .summary-card .summary-time{
  white-space:pre-line;
  line-height:1.45;
  font-size:16px;
  overflow-wrap:anywhere;
}
body.operator-mode .screen[data-step="5"] .completed-record-panel{margin-top:10px}

@media (orientation:landscape) and (max-height:700px){
  body.operator-mode .screen[data-step="1"] .customer-name{font-size:31px}
  body.operator-mode .screen[data-step="1"] .order-value{font-size:22px}
  body.operator-mode .screen[data-step="3"] .machine-wrap{flex-basis:132px;min-height:132px}
  body.operator-mode .screen[data-step="3"] .machine-line{transform:scale(.65)}
  body.operator-mode .screen[data-step="4"] .operation-top{flex-basis:72px;min-height:72px}
  body.operator-mode .screen[data-step="4"] .mini-machine{transform:scale(.52)}
  body.operator-mode .screen[data-step="4"] .operation-actions{flex-basis:72px}
  body.operator-mode .screen[data-step="4"] .operation-actions button{min-height:72px}
  .popup-keypad:not(.hidden){width:min(570px,calc(100vw - 60px));padding:14px;gap:8px}
  .popup-keypad:not(.hidden) button{min-height:54px;font-size:24px}
}


/* ===== V13：1024×768 固定外框內重新整理 ===== */

/* Page 1: MATERIAL 平均三區，不擠在上方 */
body.operator-mode .screen[data-step="1"] .material-card{
  display:grid;
  grid-template-rows:auto repeat(3,minmax(0,1fr));
}
body.operator-mode .screen[data-step="1"] .material-metric{
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:8px;
  border-top:1px solid #e7edf5;
  text-align:center;
}
body.operator-mode .screen[data-step="1"] .material-metric span{
  color:var(--muted);
  font-size:15px;
  font-weight:800;
}
body.operator-mode .screen[data-step="1"] .material-metric strong{
  color:var(--ink);
  font-size:29px;
  line-height:1.05;
  overflow-wrap:anywhere;
}
body.operator-mode .screen[data-step="1"] .material-name{
  background:linear-gradient(180deg,#f5f9ff,#fff);
}
body.operator-mode .screen[data-step="1"] .material-name strong{
  color:#123897;
  font-size:38px;
}

/* Page 2: 0–10 變大、維持單排 */
body.operator-mode .screen[data-step="2"] .speed-choices{
  width:100%;
  max-width:980px;
  margin:14px auto 18px;
  display:flex;
  flex-wrap:nowrap;
  justify-content:center;
  gap:8px;
}
body.operator-mode .screen[data-step="2"] .speed-choice{
  width:78px;
  height:78px;
  min-width:78px;
  font-size:31px;
  border-width:3px;
  box-shadow:0 5px 13px rgba(8,42,97,.10);
}
body.operator-mode .screen[data-step="2"] .speed-choice:active{transform:scale(.95)}

/* Page 3: decorative icon only; cards and keypad never overlap */
body.operator-mode .screen[data-step="3"] .machine-wrap{
  flex:0 0 126px;
  min-height:126px;
  margin:2px 0 2px;
  display:grid;
  place-items:center;
  overflow:hidden;
}
body.operator-mode .screen[data-step="3"] .machine-line{
  min-height:112px;
  transform:scale(.70);
  transform-origin:center;
}
body.operator-mode .screen[data-step="3"] .machine-unit b,
body.operator-mode .screen[data-step="3"] .machine-value,
body.operator-mode .screen[data-step="4"] .machine-unit b,
body.operator-mode .screen[data-step="4"] .machine-value{
  display:none!important;
}
body.operator-mode .screen[data-step="3"] .hydraulic-grid{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  align-items:stretch;
  margin:6px 0 0;
}
body.operator-mode .screen[data-step="3"] .hyd-card{
  min-height:0;
  padding:16px;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:center;
  gap:14px;
  border:1px solid #cfdbea;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 22px rgba(20,50,90,.07);
}
body.operator-mode .screen[data-step="3"] .hyd-card h3{
  margin:0;
  font-size:24px;
}
body.operator-mode .screen[data-step="3"] .value-display{
  min-height:92px;
  border-radius:16px;
  font-size:39px;
  background:#f8fbff;
}
body.operator-mode .screen[data-step="3"] .input-hint{display:none!important}

/* Central keypad with its own live preview */
.popup-keypad:not(.hidden){
  position:fixed!important;
  left:50%!important;
  top:50%!important;
  bottom:auto!important;
  z-index:999;
  width:min(590px,calc(100vw - 72px));
  display:block!important;
  margin:0!important;
  padding:18px;
  border:3px solid var(--blue);
  border-radius:24px;
  background:#f8fbff;
  box-shadow:0 0 0 100vmax rgba(3,18,40,.62),0 26px 74px rgba(0,0,0,.38);
  transform:translate(-50%,-50%)!important;
}
.popup-keypad .keypad-display{
  min-height:82px;
  margin-bottom:12px;
  padding:10px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border:2px solid #b9cce5;
  border-radius:16px;
  background:#fff;
}
.popup-keypad .keypad-display-title{
  color:var(--muted);
  font-size:20px;
  font-weight:900;
}
.popup-keypad .keypad-preview{
  color:#123897;
  font-size:45px;
  line-height:1;
  font-variant-numeric:tabular-nums;
  overflow-wrap:anywhere;
}
.popup-keypad .keypad-buttons{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
}
.popup-keypad .keypad-buttons button{
  min-height:57px;
  border:0;
  border-radius:13px;
  background:#132537;
  color:#fff;
  font-size:25px;
  font-weight:900;
}
.popup-keypad .keypad-buttons .edit-key{background:#566675}
.popup-keypad .keypad-buttons .wide-key{grid-column:span 3}
.popup-keypad .keypad-buttons .enter{background:var(--blue);font-size:22px}

/* Page 4: clear HMI layout, visible back button, no current speed */
body.operator-mode .screen[data-step="4"]{
  gap:0;
}
body.operator-mode .screen[data-step="4"] .operation-title-row{
  flex:0 0 48px;
  min-height:48px;
}
body.operator-mode .screen[data-step="4"] .operation-back{
  flex:0 0 48px;
  width:48px;
  min-width:48px;
  height:44px;
  min-height:44px;
  display:grid;
  place-items:center;
  border:2px solid #b9cce5;
  border-radius:12px;
  background:#f6f9fd;
  color:var(--navy);
  font-size:32px;
  line-height:1;
  z-index:3;
}
body.operator-mode .screen[data-step="4"] .rollback-pill{
  margin-left:auto;
  padding:7px 12px;
  border-radius:999px;
  background:#edf3fa;
  color:var(--navy);
  font-size:14px;
  font-weight:800;
}
body.operator-mode .screen[data-step="4"] .operation-top{
  flex:0 0 74px;
  min-height:74px;
  display:grid;
  place-items:center;
  overflow:hidden;
}
body.operator-mode .screen[data-step="4"] .mini-machine{
  width:max-content;
  margin:0;
  transform:scale(.52);
  transform-origin:center;
}
body.operator-mode .screen[data-step="4"] .current-speed-inline{display:none!important}
body.operator-mode .screen[data-step="4"] .operation-grid{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 270px;
  gap:14px;
  align-items:stretch;
}
body.operator-mode .screen[data-step="4"] .controls-432{
  min-height:0;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
body.operator-mode .screen[data-step="4"] .control-card{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:9px;
  padding:10px;
  border:1px solid #cfdbea;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 22px rgba(20,50,90,.07);
}
body.operator-mode .screen[data-step="4"] .control-card-header{
  flex:0 0 36px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
}
body.operator-mode .screen[data-step="4"] .control-card h3{
  margin:0;
  font-size:21px;
}
body.operator-mode .screen[data-step="4"] .press-count{
  margin:0;
  padding:5px 10px;
  font-size:16px;
}
body.operator-mode .screen[data-step="4"] .control-stack{
  flex:1 1 auto;
  min-height:0;
  height:auto;
  display:grid;
  grid-template-rows:1.25fr .62fr 1.25fr;
  gap:9px;
  overflow:visible;
  border:0;
  border-radius:0;
  box-shadow:none;
}
body.operator-mode .screen[data-step="4"] .control-stack button{
  min-height:0;
  border-radius:18px;
  font-size:48px;
  box-shadow:inset 0 -5px 0 rgba(0,0,0,.13),0 5px 12px rgba(20,50,90,.12);
}
body.operator-mode .screen[data-step="4"] .control-stack button:active{
  transform:translateY(3px);
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.12);
}
body.operator-mode .screen[data-step="4"] .neutral{
  border:2px solid #d4dce6;
  background:#eef2f6;
  color:#506174;
}
body.operator-mode .screen[data-step="4"] .operation-side-panel{
  min-height:0;
  display:grid;
  grid-template-rows:1.25fr .82fr;
  gap:12px;
}
body.operator-mode .screen[data-step="4"] .piece-counter-card,
body.operator-mode .screen[data-step="4"] .unit0-set{
  min-height:0;
  padding:13px;
  border:1px solid #cfdbea;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 22px rgba(20,50,90,.07);
}
body.operator-mode .screen[data-step="4"] .piece-counter-card{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:center;
}
body.operator-mode .screen[data-step="4"] .side-card-label{
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-align:center;
}
body.operator-mode .screen[data-step="4"] .piece-total{
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:8px;
  margin:5px 0 2px;
}
body.operator-mode .screen[data-step="4"] .piece-total strong{
  color:#123897;
  font-size:52px;
  line-height:1;
}
body.operator-mode .screen[data-step="4"] .piece-total span{
  color:var(--muted);
  font-size:17px;
  font-weight:900;
}
body.operator-mode .screen[data-step="4"] .piece-context{
  min-height:36px;
  display:grid;
  place-items:center;
  padding:5px 6px;
  color:var(--ink);
  font-size:13px;
  font-weight:800;
  line-height:1.25;
  text-align:center;
}
body.operator-mode .screen[data-step="4"] .piece-actions{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:8px;
  margin-top:6px;
}
body.operator-mode .screen[data-step="4"] .piece-actions button{
  min-height:54px;
  border-radius:13px;
  font-size:15px;
  font-weight:900;
}
body.operator-mode .screen[data-step="4"] .piece-correct-btn{
  border:1px solid #cfdbea;
  background:#f5f7fa;
  color:#526176;
}
body.operator-mode .screen[data-step="4"] .piece-complete-btn{
  border:0;
  background:var(--blue);
  color:#fff;
  box-shadow:inset 0 -4px 0 rgba(0,0,0,.15);
}
body.operator-mode .screen[data-step="4"] .unit0-set{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
body.operator-mode .screen[data-step="4"] .unit0-set label{
  font-size:15px;
  letter-spacing:.03em;
}
body.operator-mode .screen[data-step="4"] .unit0-value{
  width:100%;
  min-height:70px;
  margin-top:10px;
  border-radius:15px;
  font-size:34px;
}
body.operator-mode .screen[data-step="4"] .unit0-set .input-hint{display:none!important}
body.operator-mode .screen[data-step="4"] .operation-actions{
  flex:0 0 88px;
  display:grid;
  grid-template-columns:1fr 1.15fr 1.15fr;
  gap:12px;
  margin-top:10px;
}
body.operator-mode .screen[data-step="4"] .operation-actions button{
  min-height:88px;
  padding:12px 16px;
  border-radius:18px;
  font-size:21px;
  font-weight:900;
  box-shadow:inset 0 -5px 0 rgba(0,0,0,.10),0 5px 13px rgba(20,50,90,.10);
}
body.operator-mode .screen[data-step="4"] .operation-actions button:active{transform:translateY(3px)}

/* Issue: directly record the problem piece */
.issue-piece-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:14px 10px;
  border-bottom:1px solid var(--line);
  background:#f7faff;
}
.issue-piece-copy strong{display:block;font-size:21px}
.issue-piece-copy span{display:block;margin-top:5px;color:var(--muted);font-size:15px;font-weight:700}
.issue-piece-stepper{
  display:grid;
  grid-template-columns:58px 82px 58px;
  align-items:center;
  overflow:hidden;
  border:2px solid #b9cce5;
  border-radius:14px;
  background:#fff;
}
.issue-piece-stepper button{
  min-height:58px;
  border:0;
  background:#edf4ff;
  color:var(--blue);
  font-size:31px;
  font-weight:900;
}
.issue-piece-stepper strong{
  text-align:center;
  font-size:30px;
  font-variant-numeric:tabular-nums;
}

@media (orientation:landscape) and (max-height:700px){
  body.operator-mode .screen[data-step="2"] .speed-choice{width:70px;height:70px;min-width:70px;font-size:28px}
  body.operator-mode .screen[data-step="3"] .machine-wrap{flex-basis:108px;min-height:108px}
  body.operator-mode .screen[data-step="3"] .machine-line{transform:scale(.61)}
  body.operator-mode .screen[data-step="3"] .value-display{min-height:76px;font-size:34px}
  body.operator-mode .screen[data-step="4"] .operation-top{flex-basis:58px;min-height:58px}
  body.operator-mode .screen[data-step="4"] .mini-machine{transform:scale(.43)}
  body.operator-mode .screen[data-step="4"] .operation-grid{grid-template-columns:minmax(0,1fr) 250px}
  body.operator-mode .screen[data-step="4"] .control-stack{gap:7px}
  body.operator-mode .screen[data-step="4"] .control-stack button{font-size:41px;border-radius:15px}
  body.operator-mode .screen[data-step="4"] .piece-total strong{font-size:44px}
  body.operator-mode .screen[data-step="4"] .piece-actions button{min-height:46px}
  body.operator-mode .screen[data-step="4"] .operation-actions{flex-basis:76px}
  body.operator-mode .screen[data-step="4"] .operation-actions button{min-height:76px}
  .popup-keypad:not(.hidden){width:min(545px,calc(100vw - 70px));padding:14px}
  .popup-keypad .keypad-display{min-height:70px}
  .popup-keypad .keypad-preview{font-size:39px}
  .popup-keypad .keypad-buttons button{min-height:49px;font-size:22px}
}


/* V13.1：第四頁機台圖使用實際小尺寸，不以 transform 造成重疊 */
body.operator-mode .screen[data-step="4"] .operation-top{
  flex-basis:66px;
  min-height:66px;
  overflow:hidden;
}
body.operator-mode .screen[data-step="4"] .mini-machine{
  transform:none!important;
  width:auto;
  height:60px;
  align-items:flex-end;
}
body.operator-mode .screen[data-step="4"] .mini-machine .connected-group{gap:22px}
body.operator-mode .screen[data-step="4"] .mini-machine .connected-group:after{
  left:10px;
  right:10px;
  top:24px;
  height:4px;
}
body.operator-mode .screen[data-step="4"] .mini-machine .machine-unit{
  width:45px;
  height:58px;
}
body.operator-mode .screen[data-step="4"] .mini-machine .machine-unit:before{
  width:32px;
  height:42px;
  bottom:11px;
  border-width:2px;
  border-radius:5px;
}
body.operator-mode .screen[data-step="4"] .mini-machine .machine-unit:after{
  width:42px;
  height:3px;
  bottom:7px;
}
body.operator-mode .screen[data-step="4"] .mini-machine .ram{
  width:7px;
  height:31px;
  bottom:16px;
  border-width:1px;
}
body.operator-mode .screen[data-step="4"] .mini-machine .gap-line{
  width:38px;
  height:4px;
  margin-bottom:31px;
}
body.operator-mode .screen[data-step="4"] .mini-machine .coil{
  width:50px;
  height:50px;
  margin-bottom:9px;
  border-width:3px;
  background:radial-gradient(circle,#23272c 0 4px,#ececec 5px 17px,#9ca0a4 18px 22px,#d9d9d9 23px);
}
body.operator-mode .screen[data-step="4"] .mini-machine .coil:after{
  left:-6px;
  right:-6px;
  height:4px;
  bottom:-8px;
}
@media (orientation:landscape) and (max-height:700px){
  body.operator-mode .screen[data-step="4"] .operation-top{flex-basis:56px;min-height:56px}
  body.operator-mode .screen[data-step="4"] .mini-machine{transform:none!important}
}


/* ===== V14：操作頁精修 ===== */

/* Every operator page has a larger, consistent return control */
body.operator-mode .back-btn{
  flex:0 0 62px!important;
  width:62px!important;
  min-width:62px!important;
  height:54px!important;
  min-height:54px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:2px solid #b9cce5!important;
  border-radius:15px!important;
  background:#f6f9fd!important;
  color:var(--navy)!important;
  font-size:38px!important;
  font-weight:900!important;
  line-height:1!important;
}
body.operator-mode .back-btn:active{transform:translateY(2px);background:#eaf2fc!important}

/* Page 2: make all 0-10 targets larger while preserving one row at 1024px */
body.operator-mode .screen[data-step="2"] .speed-panel{margin-top:12px}
body.operator-mode .screen[data-step="2"] .speed-choices{
  max-width:none;
  margin:16px auto 20px;
  gap:6px;
}
body.operator-mode .screen[data-step="2"] .speed-choice{
  width:84px;
  height:84px;
  min-width:84px;
  font-size:34px;
  border-width:3px;
}

/* Machine icons: true centre and clear Unit labels from left to right */
body.operator-mode .screen[data-step="3"] .machine-wrap{
  flex-basis:142px;
  min-height:142px;
  width:100%;
  margin:0;
  display:grid;
  place-items:center;
  overflow:visible;
}
body.operator-mode .screen[data-step="3"] .machine-line{
  width:max-content;
  min-height:126px;
  margin:0 auto;
  transform:scale(.72);
  transform-origin:center center;
}
body.operator-mode .screen[data-step="3"] .machine-unit b,
body.operator-mode .screen[data-step="4"] .machine-unit b{
  display:block!important;
  position:absolute;
  left:50%;
  bottom:-8px;
  z-index:5;
  width:76px;
  transform:translateX(-50%);
  color:#123897;
  font-size:16px;
  font-weight:900;
  line-height:1;
  text-align:center;
  white-space:nowrap;
}
body.operator-mode .screen[data-step="3"] .machine-line,
body.operator-mode .screen[data-step="4"] .mini-machine{
  justify-content:center;
}

/* Page 4: balanced icon, larger wide controls and simplified production flow */
body.operator-mode .screen[data-step="4"] .operation-title-row{flex-basis:54px;min-height:54px}
body.operator-mode .screen[data-step="4"] .operation-top{
  flex-basis:82px;
  min-height:82px;
  display:grid;
  place-items:center;
  overflow:visible;
}
body.operator-mode .screen[data-step="4"] .mini-machine{
  position:relative;
  left:auto;
  right:auto;
  width:max-content;
  height:68px;
  margin:0 auto;
  justify-self:center;
}
body.operator-mode .screen[data-step="4"] .mini-machine .machine-unit b{
  bottom:-5px;
  width:54px;
  font-size:11px;
}
body.operator-mode .screen[data-step="4"] .operation-grid{
  grid-template-columns:minmax(0,1fr) 292px;
  gap:16px;
}
body.operator-mode .screen[data-step="4"] .controls-432{gap:13px}
body.operator-mode .screen[data-step="4"] .control-card{
  padding:10px 5px 7px;
  gap:7px;
  overflow:hidden;
}
body.operator-mode .screen[data-step="4"] .control-card-header{padding:0 7px}
body.operator-mode .screen[data-step="4"] .control-stack{
  width:100%;
  gap:8px;
}
body.operator-mode .screen[data-step="4"] .control-stack button{
  width:100%;
  max-width:none;
  margin:0;
  border-radius:18px;
}
body.operator-mode .screen[data-step="4"] .control-stack .neutral{
  cursor:default;
  opacity:.72;
  box-shadow:none;
  background:#e9edf2;
  color:#9ba7b4;
}
body.operator-mode .screen[data-step="4"] .control-stack .neutral:active{transform:none;box-shadow:none}

body.operator-mode .screen[data-step="4"] .operation-side-panel{
  grid-template-rows:1.1fr .9fr;
  gap:12px;
}
body.operator-mode .screen[data-step="4"] .piece-counter-card{
  justify-content:space-between;
  padding:14px 12px 12px;
}
body.operator-mode .screen[data-step="4"] .current-piece-total{
  gap:9px;
  margin:4px 0 8px;
}
body.operator-mode .screen[data-step="4"] .current-piece-total strong{
  font-size:62px;
}
body.operator-mode .screen[data-step="4"] .current-piece-total span{
  color:#34475d;
  font-size:22px;
  font-weight:900;
}
body.operator-mode .screen[data-step="4"] .production-flow-actions{
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:auto;
}
body.operator-mode .screen[data-step="4"] .production-flow-actions button{
  min-height:66px;
  border:0;
  border-radius:15px;
  font-size:18px;
  font-weight:900;
  box-shadow:inset 0 -4px 0 rgba(0,0,0,.14),0 4px 10px rgba(20,50,90,.10);
}
body.operator-mode .screen[data-step="4"] .piece-feed-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  background:var(--green);
  color:#fff;
}
body.operator-mode .screen[data-step="4"] .piece-feed-btn .flow-arrow{
  font-size:34px;
  line-height:1;
}
body.operator-mode .screen[data-step="4"] .piece-rollback-btn{
  background:#f0f3f7;
  color:#34475d;
  border:2px solid #c9d4e1!important;
}
body.operator-mode .screen[data-step="4"] .production-flow-actions button:active{transform:translateY(2px)}

body.operator-mode .screen[data-step="4"] .operation-actions.two-actions{
  flex-basis:88px;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
body.operator-mode .screen[data-step="4"] .operation-actions.two-actions button{
  min-height:88px;
  font-size:23px;
}

/* Page 5: larger high-touch export and DONE controls */
body.operator-mode .screen[data-step="5"] .completed-actions{
  gap:14px;
  margin-top:10px;
}
body.operator-mode .screen[data-step="5"] .completed-actions .secondary-btn,
body.operator-mode .screen[data-step="5"] .completed-actions .done-btn{
  min-height:78px;
  height:78px;
  padding:14px 18px;
  font-size:21px;
  border-radius:17px;
}

@media (orientation:landscape) and (max-height:700px){
  body.operator-mode .back-btn{width:58px!important;min-width:58px!important;height:48px!important;min-height:48px!important;font-size:34px!important}
  body.operator-mode .screen[data-step="2"] .speed-choice{width:80px;height:80px;min-width:80px;font-size:32px}
  body.operator-mode .screen[data-step="3"] .machine-wrap{flex-basis:116px;min-height:116px}
  body.operator-mode .screen[data-step="3"] .machine-line{transform:scale(.61)}
  body.operator-mode .screen[data-step="4"] .operation-top{flex-basis:68px;min-height:68px}
  body.operator-mode .screen[data-step="4"] .operation-grid{grid-template-columns:minmax(0,1fr) 270px}
  body.operator-mode .screen[data-step="4"] .production-flow-actions button{min-height:56px}
  body.operator-mode .screen[data-step="4"] .operation-actions.two-actions{flex-basis:78px}
  body.operator-mode .screen[data-step="4"] .operation-actions.two-actions button{min-height:78px}
  body.operator-mode .screen[data-step="5"] .completed-actions .secondary-btn,
  body.operator-mode .screen[data-step="5"] .completed-actions .done-btn{min-height:68px;height:68px}
}


/* ===== V15：大型導覽鍵、真正置中的機台圖、直式進料／ROLLBACK ===== */

/* START / NEXT 全部統一，並提升到約原本兩倍的高度 */
body.operator-mode .screen[data-step="1"] .bottom-action,
body.operator-mode .screen[data-step="2"] .bottom-action,
body.operator-mode .screen[data-step="3"] .bottom-action{
  flex:0 0 132px!important;
  width:100%!important;
  min-height:132px!important;
  height:132px!important;
  margin-top:10px!important;
  padding:18px 24px!important;
  border-radius:22px!important;
  font-size:38px!important;
  font-weight:900!important;
  line-height:1!important;
  letter-spacing:.02em;
  box-shadow:inset 0 -7px 0 rgba(0,0,0,.13),0 8px 18px rgba(20,50,90,.16)!important;
}

/* Page 1：替大型 START 預留高度，不破壞卡片配置 */
body.operator-mode .screen[data-step="1"] .order-layout{
  margin-top:8px!important;
}
body.operator-mode .screen[data-step="1"] .info-card,
body.operator-mode .screen[data-step="1"] .coil-info-card{
  min-height:0!important;
}

/* Page 2：0–10 改成更大的高觸控按鍵，仍保持同一排 */
body.operator-mode .screen[data-step="2"] .speed-panel{
  flex:1 1 auto!important;
  min-height:0!important;
  justify-content:flex-start!important;
  padding-top:54px!important;
}
body.operator-mode .screen[data-step="2"] .speed-panel h2{
  margin:0 0 20px!important;
  font-size:30px!important;
}
body.operator-mode .screen[data-step="2"] .speed-choices{
  width:100%!important;
  max-width:none!important;
  display:grid!important;
  grid-template-columns:repeat(11,minmax(0,1fr))!important;
  gap:5px!important;
  margin:0 auto 24px!important;
}
body.operator-mode .screen[data-step="2"] .speed-choice{
  width:100%!important;
  min-width:0!important;
  height:106px!important;
  min-height:106px!important;
  border-radius:26px!important;
  font-size:36px!important;
  border-width:3px!important;
}
body.operator-mode .screen[data-step="2"] .current-speed-card{
  width:310px!important;
  margin:0 auto!important;
  padding:12px!important;
}

/* Page 3：機台圖以整個頁面內容區的 50% 為中心，不再偏左 */
body.operator-mode .screen[data-step="3"] .machine-wrap{
  position:relative!important;
  flex:0 0 142px!important;
  min-height:142px!important;
  width:100%!important;
  margin:0!important;
  overflow:visible!important;
}
body.operator-mode .screen[data-step="3"] .machine-line{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:max-content!important;
  min-height:126px!important;
  margin:0!important;
  transform:translate(-50%,-50%) scale(.75)!important;
  transform-origin:center center!important;
}
body.operator-mode .screen[data-step="3"] .hydraulic-grid{
  margin:4px 0 0!important;
}
body.operator-mode .screen[data-step="3"] .hyd-card{
  padding:13px!important;
  gap:10px!important;
}
body.operator-mode .screen[data-step="3"] .value-display{
  min-height:78px!important;
}

/* Page 4：圖示稍微放大，但保留現有控制鍵尺寸 */
body.operator-mode .screen[data-step="4"] .operation-top{
  position:relative!important;
  flex:0 0 96px!important;
  min-height:96px!important;
  width:100%!important;
  overflow:visible!important;
}
body.operator-mode .screen[data-step="4"] .mini-machine{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:max-content!important;
  height:auto!important;
  margin:0!important;
  transform:translate(-50%,-50%) scale(.64)!important;
  transform-origin:center center!important;
}
body.operator-mode .screen[data-step="4"] .mini-machine .machine-unit b{
  bottom:-7px!important;
  width:66px!important;
  font-size:15px!important;
}

/* 右側重新分配：上方留給大型直式進料／ROLLBACK，下方 Unit 0 壓成精簡橫式 */
body.operator-mode .screen[data-step="4"] .operation-grid{
  grid-template-columns:minmax(0,1fr) 292px!important;
  gap:16px!important;
}
body.operator-mode .screen[data-step="4"] .operation-side-panel{
  grid-template-rows:minmax(0,1fr) 94px!important;
  gap:12px!important;
}
body.operator-mode .screen[data-step="4"] .piece-counter-card{
  display:grid!important;
  grid-template-columns:auto 1fr!important;
  grid-template-rows:50px minmax(0,1fr)!important;
  align-items:center!important;
  justify-content:stretch!important;
  padding:12px!important;
}
body.operator-mode .screen[data-step="4"] .side-card-label{
  padding-left:4px!important;
  font-size:12px!important;
  text-align:left!important;
}
body.operator-mode .screen[data-step="4"] .current-piece-total{
  justify-content:flex-end!important;
  gap:7px!important;
  margin:0!important;
  padding-right:5px!important;
}
body.operator-mode .screen[data-step="4"] .current-piece-total strong{
  font-size:48px!important;
}
body.operator-mode .screen[data-step="4"] .current-piece-total span{
  font-size:18px!important;
}

/* 進料在上、ROLLBACK 在下；兩顆都占滿整個側欄 */
body.operator-mode .screen[data-step="4"] .production-flow-actions{
  grid-column:1 / -1!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  margin-top:8px!important;
}
body.operator-mode .screen[data-step="4"] .production-flow-actions button{
  width:100%!important;
  min-height:0!important;
  height:100%!important;
  border-radius:19px!important;
  font-size:22px!important;
  box-shadow:inset 0 -6px 0 rgba(0,0,0,.14),0 6px 14px rgba(20,50,90,.13)!important;
}
body.operator-mode .screen[data-step="4"] .piece-feed-btn{
  gap:12px!important;
}
body.operator-mode .screen[data-step="4"] .piece-feed-btn .flow-arrow{
  font-size:43px!important;
}
body.operator-mode .screen[data-step="4"] .piece-rollback-btn{
  font-size:20px!important;
}

/* Unit 0 改成橫向精簡卡片，讓上方兩顆按鍵取得足夠高度 */
body.operator-mode .screen[data-step="4"] .unit0-set{
  min-height:94px!important;
  display:grid!important;
  grid-template-columns:104px minmax(0,1fr)!important;
  align-items:center!important;
  gap:10px!important;
  padding:10px 12px!important;
}
body.operator-mode .screen[data-step="4"] .unit0-set label{
  font-size:13px!important;
  line-height:1.25!important;
  text-align:left!important;
}
body.operator-mode .screen[data-step="4"] .unit0-value{
  width:100%!important;
  min-height:66px!important;
  height:66px!important;
  margin:0!important;
  font-size:32px!important;
}

/* Page 5：兩顆結束按鍵提升到兩倍高度 */
body.operator-mode .screen[data-step="5"] .completed-actions{
  flex:0 0 132px!important;
  min-height:132px!important;
  height:132px!important;
  gap:16px!important;
  margin-top:10px!important;
}
body.operator-mode .screen[data-step="5"] .completed-actions .secondary-btn,
body.operator-mode .screen[data-step="5"] .completed-actions .done-btn{
  min-height:132px!important;
  height:132px!important;
  padding:20px 22px!important;
  border-radius:22px!important;
  font-size:24px!important;
  font-weight:900!important;
  box-shadow:inset 0 -7px 0 rgba(0,0,0,.12),0 8px 18px rgba(20,50,90,.14)!important;
}

/* 第五頁為大型按鍵騰出空間 */
body.operator-mode .screen[data-step="5"] .completed{
  padding-top:0!important;
}
body.operator-mode .screen[data-step="5"] .check{
  width:48px!important;
  height:48px!important;
  font-size:32px!important;
}
body.operator-mode .screen[data-step="5"] .completed h2{
  margin:2px 0 7px!important;
  font-size:25px!important;
}
body.operator-mode .screen[data-step="5"] .summary-card{
  padding:7px!important;
}
body.operator-mode .screen[data-step="5"] .summary-card strong{
  margin-top:3px!important;
}
body.operator-mode .screen[data-step="5"] .completed-record-panel{
  margin-top:6px!important;
}
body.operator-mode .screen[data-step="5"] .completed-log{
  max-height:85px!important;
}

/* 較矮的橫式螢幕仍維持相同視覺比例 */
@media (orientation:landscape) and (max-height:700px){
  body.operator-mode .screen[data-step="1"] .bottom-action,
  body.operator-mode .screen[data-step="2"] .bottom-action,
  body.operator-mode .screen[data-step="3"] .bottom-action{
    flex-basis:112px!important;
    min-height:112px!important;
    height:112px!important;
    font-size:34px!important;
  }

  body.operator-mode .screen[data-step="2"] .speed-panel{padding-top:24px!important}
  body.operator-mode .screen[data-step="2"] .speed-choice{
    height:92px!important;
    min-height:92px!important;
    font-size:32px!important;
  }

  body.operator-mode .screen[data-step="3"] .machine-wrap{
    flex-basis:114px!important;
    min-height:114px!important;
  }
  body.operator-mode .screen[data-step="3"] .machine-line{
    transform:translate(-50%,-50%) scale(.63)!important;
  }

  body.operator-mode .screen[data-step="4"] .operation-top{
    flex-basis:75px!important;
    min-height:75px!important;
  }
  body.operator-mode .screen[data-step="4"] .mini-machine{
    transform:translate(-50%,-50%) scale(.53)!important;
  }
  body.operator-mode .screen[data-step="4"] .operation-grid{
    grid-template-columns:minmax(0,1fr) 270px!important;
  }
  body.operator-mode .screen[data-step="4"] .operation-side-panel{
    grid-template-rows:minmax(0,1fr) 82px!important;
  }
  body.operator-mode .screen[data-step="4"] .piece-counter-card{
    grid-template-rows:42px minmax(0,1fr)!important;
  }
  body.operator-mode .screen[data-step="4"] .production-flow-actions button{
    font-size:19px!important;
  }
  body.operator-mode .screen[data-step="4"] .unit0-set{
    min-height:82px!important;
    grid-template-columns:92px minmax(0,1fr)!important;
    padding:7px 9px!important;
  }
  body.operator-mode .screen[data-step="4"] .unit0-value{
    min-height:58px!important;
    height:58px!important;
  }

  body.operator-mode .screen[data-step="5"] .completed-actions{
    flex-basis:112px!important;
    min-height:112px!important;
    height:112px!important;
  }
  body.operator-mode .screen[data-step="5"] .completed-actions .secondary-btn,
  body.operator-mode .screen[data-step="5"] .completed-actions .done-btn{
    min-height:112px!important;
    height:112px!important;
  }
}


/* V15.1：第四頁視覺驗證後的最後修正 */
body.operator-mode .screen[data-step="4"] .mini-machine{
  transform:translate(-50%,-50%) scale(1.05)!important;
}

/* 讓直式進料與 ROLLBACK 真正撐滿整個可用高度 */
body.operator-mode .screen[data-step="4"] .piece-counter-card{
  align-items:stretch!important;
}
body.operator-mode .screen[data-step="4"] .side-card-label,
body.operator-mode .screen[data-step="4"] .current-piece-total{
  align-self:center!important;
}
body.operator-mode .screen[data-step="4"] .production-flow-actions{
  align-self:stretch!important;
  height:100%!important;
}
body.operator-mode .screen[data-step="4"] .production-flow-actions button{
  min-height:96px!important;
}

@media (orientation:landscape) and (max-height:700px){
  body.operator-mode .screen[data-step="4"] .mini-machine{
    transform:translate(-50%,-50%) scale(.88)!important;
  }
  body.operator-mode .screen[data-step="4"] .production-flow-actions button{
    min-height:82px!important;
  }
}


/* ===== V16：加高中央鍵盤、第四頁機台圖真正置中、ROLLBACK 右箭頭 ===== */

/* 第三頁／第四頁共用的中央數字鍵盤：只增加垂直高度，維持原本寬度 */
.popup-keypad .keypad-buttons{
  gap:11px!important;
}
.popup-keypad .keypad-buttons button{
  min-height:78px!important;
  height:78px!important;
  padding:10px 8px!important;
  border-radius:15px!important;
  font-size:29px!important;
}
.popup-keypad .keypad-buttons .enter{
  font-size:25px!important;
}

/* 第四頁機台示意圖：以 operation-top 的真正中心定位，不再使用 absolute 偏移 */
body.operator-mode .screen[data-step="4"] .operation-top{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  text-align:center!important;
}
body.operator-mode .screen[data-step="4"] .mini-machine{
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  inset:auto!important;
  display:flex!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0 auto!important;
  transform:scale(1.05)!important;
  transform-origin:center center!important;
}

/* ROLLBACK 文字後方增加往右箭頭 */
body.operator-mode .screen[data-step="4"] .piece-rollback-btn{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:14px!important;
}
body.operator-mode .screen[data-step="4"] .piece-rollback-btn .rollback-arrow{
  display:inline-block!important;
  font-size:43px!important;
  line-height:1!important;
  font-weight:900!important;
}

@media (orientation:landscape) and (max-height:700px){
  .popup-keypad .keypad-buttons button{
    min-height:66px!important;
    height:66px!important;
    font-size:26px!important;
  }
  .popup-keypad .keypad-buttons .enter{font-size:23px!important}
  body.operator-mode .screen[data-step="4"] .mini-machine{
    transform:scale(.88)!important;
  }
  body.operator-mode .screen[data-step="4"] .piece-rollback-btn .rollback-arrow{
    font-size:37px!important;
  }
}


/* ===== V17：自動儲存、Google 同步與下一張訂單銜接 ===== */

.cloud-sync-panel{
  margin:0 0 14px;
  padding:16px 18px;
  border:1px solid #b9ccea;
  border-radius:16px;
  background:linear-gradient(135deg,#f7fbff,#edf5ff);
  box-shadow:0 5px 18px rgba(17,56,120,.07);
}

.cloud-sync-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}

.cloud-sync-head h2{
  margin:0;
  color:var(--navy);
  font-size:21px;
}

.cloud-sync-head p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}

.cloud-sync-badge{
  flex:0 0 auto;
  padding:7px 13px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
}

.cloud-sync-badge.not-configured{
  background:#e5e9ef;
  color:#596473;
}

.cloud-sync-badge.waiting{
  background:#fff0bf;
  color:#865c00;
}

.cloud-sync-badge.syncing{
  background:#dcecff;
  color:#0b4fbf;
}

.cloud-sync-badge.sent{
  background:#dff5e8;
  color:#08733d;
}

.cloud-sync-badge.error{
  background:#ffe0e0;
  color:#b11d25;
}

.cloud-sync-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:12px;
  margin-top:14px;
}

.cloud-sync-grid label{
  font-size:13px;
  font-weight:800;
  color:#26374f;
}

.cloud-sync-grid input{
  width:100%;
  margin-top:5px;
  padding:11px 12px;
  border:1px solid #b8c5d8;
  border-radius:10px;
  background:#fff;
  font:inherit;
}

.cloud-sync-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:12px;
}

.cloud-enable{
  display:flex;
  align-items:center;
  gap:9px;
  font-weight:900;
  color:var(--navy);
}

.cloud-enable input{
  width:20px;
  height:20px;
}

.cloud-sync-buttons{
  display:flex;
  gap:9px;
}

.cloud-sync-buttons button{
  min-height:45px;
  padding:9px 17px;
}

.cloud-sync-detail{
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid #d6e1f1;
  color:#52627a;
  font-size:13px;
}

.order-item.current:after{
  content:none!important;
}

.order-item-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.order-status{
  font-style:normal;
  font-size:11px;
  font-weight:900;
  padding:4px 8px;
  border-radius:999px;
  white-space:nowrap;
}

.order-status.pending{
  background:#edf1f6;
  color:#566273;
}

.order-status.in-progress{
  background:#fff0bf;
  color:#825900;
}

.order-status.completed{
  background:#dff5e8;
  color:#08733d;
}

.active-order-note{
  display:inline-block;
  margin-top:7px;
  padding:3px 8px;
  border-radius:999px;
  background:var(--blue);
  color:#fff;
  font-size:11px;
  font-weight:800;
}

body.operator-mode
.screen[data-step="5"]
.completed-actions.single-action{
  display:block!important;
}

body.operator-mode
.screen[data-step="5"]
.completed-actions.single-action
.done-btn{
  width:100%!important;
}

body.operator-mode .screen[data-step="6"]{
  overflow:hidden;
}

.complete-step{
  background:var(--green)!important;
}

.order-handoff{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-columns:1fr 1.35fr;
  grid-template-rows:auto auto 1fr;
  column-gap:24px;
  align-items:center;
  padding:12px 28px 18px;
}

.handoff-check{
  grid-column:1/-1;
  justify-self:center;
  width:76px;
  height:76px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--green);
  color:#fff;
  font-size:52px;
  font-weight:950;
  box-shadow:0 9px 22px rgba(13,135,77,.22);
}

.order-handoff>h2{
  grid-column:1/-1;
  justify-self:center;
  margin:4px 0 12px;
  color:var(--navy);
  font-size:30px;
}

.handoff-completed-card,
.next-order-ready,
.no-next-order{
  height:100%;
  min-height:280px;
  border:2px solid #ccd8e8;
  border-radius:22px;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px;
  box-shadow:0 8px 22px rgba(14,48,101,.08);
}

.handoff-completed-card{
  background:linear-gradient(#f7fff9,#eefaf3);
  border-color:#a8d8bd;
}

.handoff-completed-card span,
.next-order-label{
  font-size:14px;
  font-weight:900;
  letter-spacing:.09em;
  color:#67758a;
}

.handoff-completed-card strong,
.next-order-ready strong{
  margin-top:12px;
  font-size:52px;
  line-height:1;
  color:var(--navy);
}

.handoff-completed-card b,
.next-order-ready>span{
  margin-top:13px;
  font-size:24px;
  color:#24354d;
}

.next-order-ready{
  border-color:#9db8e3;
  background:linear-gradient(#fff,#f2f7ff);
}

.next-order-btn{
  width:100%;
  min-height:92px;
  margin-top:24px;
  border-radius:19px;
  font-size:28px;
  font-weight:950;
}

.no-next-order{
  grid-column:2;
  background:#f7f9fc;
}

.no-next-order strong{
  font-size:28px;
  color:var(--navy);
}

.no-next-order span{
  max-width:360px;
  margin-top:12px;
  color:var(--muted);
  font-size:17px;
  line-height:1.5;
}

@media(max-width:900px){
  .cloud-sync-grid{
    grid-template-columns:1fr;
  }

  .cloud-sync-actions{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media (orientation:landscape) and (max-height:700px){
  .handoff-check{
    width:58px;
    height:58px;
    font-size:39px;
  }

  .order-handoff>h2{
    font-size:25px;
    margin:2px 0 7px;
  }

  .handoff-completed-card,
  .next-order-ready,
  .no-next-order{
    min-height:220px;
    padding:18px;
  }

  .handoff-completed-card strong,
  .next-order-ready strong{
    font-size:43px;
  }

  .next-order-btn{
    min-height:76px;
    margin-top:15px;
    font-size:24px;
  }
}


/* ===== V18：現場選單／拖曳排序、後台自訂數字鍵盤、雙語現場介面 ===== */

body.operator-mode .screen[data-step="0"]{
  overflow:hidden;
}

.operator-order-select-layout{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) 112px;
  gap:12px;
  padding:8px 16px 12px;
}

.operator-order-help{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 16px;
  border:1px solid #cbd8e8;
  border-radius:14px;
  background:#f7faff;
}

.operator-order-help strong{
  color:var(--navy);
  font-size:18px;
}

.operator-order-help span{
  color:var(--muted);
  font-size:13px;
  text-align:right;
}

.operator-order-queue{
  min-height:0;
  overflow-y:auto;
  display:grid;
  align-content:start;
  gap:10px;
  padding:2px 4px 4px;
  overscroll-behavior:contain;
}

.operator-order-card{
  min-height:94px;
  display:grid;
  grid-template-columns:48px 54px minmax(0,1fr) 92px;
  align-items:center;
  gap:12px;
  padding:12px 16px;
  border:2px solid #cbd6e5;
  border-radius:18px;
  background:#fff;
  box-shadow:0 5px 14px rgba(18,49,97,.07);
  cursor:pointer;
  user-select:none;
}

.operator-order-card.selected{
  border-color:var(--blue);
  background:#eef5ff;
  box-shadow:0 0 0 3px rgba(30,103,210,.12);
}

.operator-order-card.current{
  border-color:#e0a600;
}

.operator-order-card.dragging{
  opacity:.45;
}

.operator-order-card.drag-over{
  transform:translateY(3px);
  border-color:#2a6fd3;
}

.operator-drag-handle{
  display:grid;
  place-items:center;
  height:56px;
  border-radius:12px;
  background:#edf2f8;
  color:#5f6d82;
  font-size:28px;
  font-weight:900;
  letter-spacing:-6px;
  cursor:grab;
}

.operator-order-index{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--navy);
  color:#fff;
  font-size:20px;
  font-weight:900;
}

.operator-order-main{
  min-width:0;
  display:grid;
  gap:4px;
}

.operator-order-main strong{
  color:var(--navy);
  font-size:27px;
}

.operator-order-main span{
  color:#22344d;
  font-size:19px;
  font-weight:800;
}

.operator-order-main small{
  color:#66758a;
  font-size:13px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.operator-order-state{
  text-align:center;
  color:#976600;
  font-size:12px;
  font-weight:900;
}

.operator-order-start-btn{
  width:100%;
  min-height:112px;
  border-radius:22px;
  font-size:30px;
  font-weight:950;
}

.operator-order-start-btn:disabled{
  opacity:.4;
  filter:grayscale(.4);
}

.operator-empty-queue{
  min-height:220px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:10px;
  border:2px dashed #c7d2e0;
  border-radius:18px;
  color:#5f6d80;
  text-align:center;
}

.operator-empty-queue strong{
  font-size:26px;
  color:var(--navy);
}

/* Admin number pad */
.admin-numberpad-overlay{
  position:fixed;
  inset:0;
  z-index:500;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(7,23,47,.58);
  backdrop-filter:blur(4px);
}

.admin-numberpad-overlay.hidden{
  display:none;
}

.admin-numberpad-dialog{
  width:min(560px,calc(100vw - 40px));
  padding:16px;
  border-radius:22px;
  background:#f6f9fd;
  box-shadow:0 24px 70px rgba(0,0,0,.35);
}

.admin-numberpad-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.admin-numberpad-head span{
  color:var(--navy);
  font-size:21px;
  font-weight:950;
}

.admin-numberpad-close{
  width:48px;
  height:48px;
  border:none;
  border-radius:50%;
  background:#dde5ef;
  color:#34445b;
  font-size:30px;
  font-weight:900;
}

.admin-numberpad-preview{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding:12px 18px;
  margin-bottom:12px;
  border:2px solid #9eb5d4;
  border-radius:15px;
  background:#fff;
  color:var(--navy);
  font-size:40px;
  font-weight:950;
  font-variant-numeric:tabular-nums;
}

.admin-numberpad-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
}

.admin-numberpad-grid button{
  min-height:74px;
  border:1px solid #9eb2ce;
  border-radius:14px;
  background:#fff;
  color:var(--navy);
  font-size:29px;
  font-weight:900;
  box-shadow:inset 0 -4px 0 rgba(0,0,0,.08);
}

.admin-numberpad-grid .edit-key{
  background:#eef1f5;
}

.admin-numberpad-grid .enter-key{
  grid-column:1/-1;
  min-height:82px;
  background:var(--blue);
  color:#fff;
  border-color:var(--blue);
  font-size:25px;
}

#fullCutLength,
.planLength,
.planQty,
.planBatch{
  cursor:pointer;
  caret-color:transparent;
}

@media (orientation:landscape) and (max-height:700px){
  .operator-order-select-layout{
    grid-template-rows:auto minmax(0,1fr) 92px;
  }

  .operator-order-card{
    min-height:78px;
  }

  .operator-order-start-btn{
    min-height:92px;
  }

  .admin-numberpad-grid button{
    min-height:62px;
  }

  .admin-numberpad-grid .enter-key{
    min-height:68px;
  }
}


/* V18.1：iPad 觸控排序鍵與完成後選單 */
.operator-order-card{
  grid-template-columns:48px 54px minmax(0,1fr) 106px!important;
}

.operator-order-controls{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  align-items:center;
}

.operator-order-controls small{
  grid-column:1/-1;
  min-height:15px;
  text-align:center;
  color:#976600;
  font-size:10px;
  font-weight:900;
}

.operator-move-btn{
  width:46px;
  height:46px;
  padding:0;
  border:1px solid #a9b9cf;
  border-radius:12px;
  background:#edf3fa;
  color:var(--navy);
  font-size:25px;
  font-weight:950;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.07);
}

.operator-move-btn:active{
  transform:translateY(2px);
}

.choose-order-btn{
  width:100%;
  min-height:62px;
  margin-top:10px;
  border-radius:15px;
  font-size:18px;
  font-weight:900;
}

.next-order-ready{
  justify-content:center;
}

@media (orientation:landscape) and (max-height:700px){
  .operator-move-btn{
    width:42px;
    height:40px;
    font-size:22px;
  }

  .choose-order-btn{
    min-height:52px;
    margin-top:7px;
  }
}


/* ===== V19：移除拖曳圖示，放大 SELECT ORDER 上下排序鍵 ===== */

/* 卡片不再保留拖曳欄，空間改給訂單資料與大型排序鍵 */
.operator-order-card{
  min-height:118px!important;
  grid-template-columns:58px minmax(0,1fr) 166px!important;
  gap:16px!important;
  padding:13px 18px!important;
}

/* 完全移除舊拖曳視覺與拖曳狀態 */
.operator-drag-handle,
.operator-order-card.dragging,
.operator-order-card.drag-over{
  display:none!important;
}

/* 左側順序編號也稍微放大 */
.operator-order-index{
  width:52px!important;
  height:52px!important;
  font-size:23px!important;
}

/* ↑ / ↓ 使用整個右側寬度，適合 iPad 直接觸控 */
.operator-order-controls{
  width:100%!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
  align-items:center!important;
  justify-items:stretch!important;
}

.operator-move-btn{
  width:100%!important;
  height:72px!important;
  min-height:72px!important;
  padding:0!important;
  border:2px solid #9fb2cc!important;
  border-radius:17px!important;
  background:#eaf1fa!important;
  color:var(--navy)!important;
  font-size:39px!important;
  line-height:1!important;
  font-weight:950!important;
  box-shadow:
    inset 0 -5px 0 rgba(0,0,0,.09),
    0 4px 10px rgba(18,49,97,.09)!important;
}

.operator-move-btn:active{
  transform:translateY(3px)!important;
  box-shadow:
    inset 0 -2px 0 rgba(0,0,0,.09),
    0 2px 5px rgba(18,49,97,.08)!important;
}

.operator-order-controls small{
  grid-column:1/-1!important;
  min-height:14px!important;
  margin-top:-4px!important;
  font-size:11px!important;
}

@media (orientation:landscape) and (max-height:700px){
  .operator-order-card{
    min-height:102px!important;
    grid-template-columns:52px minmax(0,1fr) 148px!important;
    gap:12px!important;
    padding:10px 14px!important;
  }

  .operator-order-index{
    width:46px!important;
    height:46px!important;
    font-size:21px!important;
  }

  .operator-move-btn{
    height:62px!important;
    min-height:62px!important;
    border-radius:15px!important;
    font-size:34px!important;
  }
}
.order-tools{display:grid;grid-template-columns:1fr;gap:10px;padding:12px}.order-tools input,.order-tools select{min-height:48px;border:1px solid #cbd5e1;border-radius:12px;padding:0 12px;font-size:16px}.order-pagination{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px}.order-pagination .secondary-btn{padding:10px 12px}.schedule-badge{display:inline-flex;margin-top:6px;padding:4px 8px;border-radius:999px;background:#e0f2fe;color:#075985;font-size:12px;font-weight:700}.continue-note{color:#b45309;font-weight:700}.advanced-backup{width:100%;padding-top:4px}.advanced-backup summary{cursor:pointer;font-weight:700;color:#64748b;margin-bottom:8px}


/* V23: dedicated factory/operator page */
body.operator-only-page #adminView:not(.active),
body.operator-only-page #operatorView:not(.active) {
  display: none !important;
}
body.operator-only-page #adminView.active,
body.operator-only-page #operatorView.active {
  display: block !important;
}
body.operator-only-page .header-actions {
  margin-left: auto;
}
body.operator-only-page .app-header {
  position: sticky;
  top: 0;
  z-index: 100;
}


/* V24: fixed current-piece issue reporting and clearer schedule history */
.issue-piece-copy small{
  display:block;
  margin-top:6px;
  color:#6b7280;
  font-size:12px;
  line-height:1.4;
}
.issue-piece-auto{
  min-width:132px;
  min-height:78px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:2px solid #b9cce5;
  border-radius:16px;
  background:#fff;
}
.issue-piece-auto span{
  color:#64748b;
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
}
.issue-piece-auto strong{
  margin-top:2px;
  color:var(--blue);
  font-size:34px;
  line-height:1;
  font-variant-numeric:tabular-nums;
}
.photo-storage-notice{
  margin:14px 10px 0;
  padding:12px 14px;
  border:1px solid #f2c46d;
  border-radius:12px;
  background:#fff8e8;
  color:#76510b;
}
.photo-storage-notice strong{display:block;font-size:13px;letter-spacing:.04em}
.photo-storage-notice span{display:block;margin-top:4px;font-size:12px;line-height:1.45}
.order-production-dates{
  display:block;
  margin-top:7px;
  color:#52627a;
  font-size:12px;
  font-weight:700;
  line-height:1.45;
}
.operator-order-date{margin-top:5px!important;color:#b45309!important;font-weight:900!important;letter-spacing:.03em}

/* V27：加班日期與結束時間排程 */
.overtime-schedule-actions{display:grid;grid-template-columns:minmax(180px,1fr) minmax(160px,.8fr) minmax(180px,1fr) auto;gap:14px;align-items:end}
.overtime-schedule-actions .field{display:grid;gap:7px}.overtime-schedule-actions .field span{font-size:13px;font-weight:800;color:#546176}
.overtime-schedule-actions input[type="date"],.overtime-schedule-actions input[type="time"]{width:100%;min-height:46px;border:1px solid #cfd8e6;border-radius:10px;padding:9px 12px;background:#fff;font:inherit}
.overtime-check{min-height:46px;align-items:center;padding:10px 12px;border:1px solid #dce3ed;border-radius:10px;background:#fff}
@media(max-width:900px){.overtime-schedule-actions{grid-template-columns:1fr 1fr}.overtime-schedule-actions .cloud-sync-buttons{grid-column:1/-1}}
@media(max-width:560px){.overtime-schedule-actions{grid-template-columns:1fr}.overtime-schedule-actions .cloud-sync-buttons{grid-column:auto}}

/* 生產日期選擇：主管按下「安排生產日期」後才選日期或待定 */
.schedule-modal{
  position:fixed;
  inset:0;
  z-index:1200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(6,18,39,.58);
  backdrop-filter:blur(5px);
}
.schedule-modal.hidden{display:none}
.schedule-modal-card{
  width:min(560px,100%);
  border-radius:24px;
  background:#fff;
  box-shadow:0 28px 80px rgba(6,18,39,.28);
  padding:24px;
}
.schedule-modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}
.schedule-modal-head h2{margin:0 0 5px;font-size:26px;color:#12233f}
.schedule-modal-head p{margin:0;color:#67748a}
.schedule-modal-close{
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  background:#edf2f8;
  color:#263a58;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.schedule-choice{
  display:grid;
  grid-template-columns:auto 1fr minmax(160px,210px);
  align-items:center;
  gap:14px;
  padding:17px;
  margin-top:12px;
  border:2px solid #dce4ef;
  border-radius:17px;
  background:#fff;
  cursor:pointer;
}
.schedule-choice.selected{
  border-color:#0b5bd3;
  background:#f3f7ff;
}
.schedule-choice input[type="radio"]{width:22px;height:22px}
.schedule-choice-copy{display:flex;flex-direction:column;gap:3px}
.schedule-choice-copy strong{font-size:18px;color:#172a47}
.schedule-choice-copy small{font-size:13px;color:#6a788e}
.schedule-choice input[type="date"]{
  width:100%;
  min-height:48px;
  border:1px solid #bfcbe0;
  border-radius:11px;
  padding:8px 11px;
  font-size:16px;
  background:#fff;
}
.schedule-choice input[type="date"]:disabled{opacity:.4}
.schedule-modal-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:22px;
}
#adminView>.cloud-sync-panel{margin-top:22px}

@media(max-width:640px){
  .schedule-modal{padding:12px;align-items:flex-end}
  .schedule-modal-card{border-radius:22px 22px 10px 10px;padding:20px}
  .schedule-choice{grid-template-columns:auto 1fr}
  .schedule-choice input[type="date"]{grid-column:2}
  .schedule-modal-actions{display:grid;grid-template-columns:1fr 1fr}
}

/* 固定件數：每列一律 1 件，不開放編輯 */
.plan-fixed-batch{display:flex;flex-direction:column;gap:7px;}
.plan-fixed-batch .planBatchFixed{min-height:46px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line,#d9dde3);border-radius:10px;background:#f4f5f7;font-size:18px;}

/* iPad-friendly admin order entry */
.choice-entry-row{display:block}
.choice-entry-row select{width:100%;min-height:48px;border:1px solid var(--line);border-radius:9px;padding:10px 12px;background:#fff;font-size:16px;font-weight:750;color:var(--ink)}
.choice-new-btn{border:1px solid #b8c9e8;background:#eef4ff;color:#123897;border-radius:9px;padding:10px 14px;font-weight:900;white-space:nowrap}
.choice-custom-input.hidden{display:none!important}
.choice-custom-input:not(.hidden){margin-top:8px}
.admin-numberpad-grid .decimal-key{background:#eef4ff;color:#123897}
@media(max-width:700px){.choice-new-btn,.choice-delete-btn{padding-inline:11px}}


/* 訂單後台：實體計算機風格螢幕鍵盤 */
.admin-numberpad-dialog{
  width:min(620px,94vw);
  background:linear-gradient(145deg,#e8e5dc,#c9c7c0);
  border:2px solid #aaa79e;
  box-shadow:0 24px 70px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.8);
}
.admin-numberpad-head{color:#222}
.admin-numberpad-preview{
  background:#efeee9;
  color:#171717;
  border:2px inset #b8b5ac;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:clamp(34px,6vw,58px);
  text-align:right;
}
.admin-numberpad-grid.calculator-layout{
  display:grid;
  grid-template-columns:repeat(4,minmax(70px,1fr));
  gap:14px;
  padding:14px;
  background:linear-gradient(135deg,#dad7cf,#bdbbb4);
  border-radius:16px;
}
.admin-numberpad-grid.calculator-layout button{
  min-height:82px;
  border:3px solid #121212;
  border-radius:15px;
  background:linear-gradient(#363636,#151515);
  color:#fff7cf;
  font-size:clamp(30px,5vw,48px);
  font-weight:700;
  line-height:1;
  box-shadow:inset 0 3px 2px rgba(255,255,255,.16), inset 0 -5px 6px rgba(0,0,0,.55), 0 4px 2px rgba(0,0,0,.35);
  touch-action:manipulation;
}
.admin-numberpad-grid.calculator-layout button:active{
  transform:translateY(3px);
  box-shadow:inset 0 2px 7px rgba(0,0,0,.7);
}
.admin-numberpad-grid.calculator-layout .clear-key{
  background:linear-gradient(#b46d75,#82454e);
  color:#fff5dc;
}
.admin-numberpad-grid.calculator-layout .function-key,
.admin-numberpad-grid.calculator-layout .enter-key{
  background:linear-gradient(#888983,#595a56);
  color:#fff4ca;
}
.admin-numberpad-grid.calculator-layout .decimal-key{
  background:linear-gradient(#363636,#151515);
  color:#fff7cf;
}
.choice-entry-row select:invalid{color:#6f7887}
.choice-custom-input:not(.hidden){display:block!important;min-height:48px;font-size:17px}
@media(max-width:700px){
  .admin-numberpad-grid.calculator-layout{gap:9px;padding:9px}
  .admin-numberpad-grid.calculator-layout button{min-height:68px;border-radius:12px;font-size:34px}
}

.choice-action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:9px}
.choice-action-row button{min-height:48px;font-size:16px}
.choice-delete-btn{border:1px solid #e0a7a7;background:#fff1f1;color:#a52222;border-radius:9px;padding:10px 14px;font-weight:900;white-space:nowrap}
.password-pad-overlay{position:fixed;inset:0;z-index:9999;background:rgba(3,12,28,.58);display:flex;align-items:center;justify-content:center;padding:22px}
.password-pad-overlay.hidden{display:none}
.password-pad-dialog{width:min(440px,94vw);background:#fff;border-radius:20px;box-shadow:0 24px 70px rgba(0,0,0,.3);padding:20px}
.password-pad-head{display:flex;align-items:center;justify-content:space-between;font-weight:950;font-size:22px;margin-bottom:14px}
.password-pad-close{border:0;background:#edf1f7;border-radius:10px;width:44px;height:44px;font-size:25px}
.password-pad-preview{height:66px;border:2px solid #b9c7db;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:30px;letter-spacing:10px;font-weight:950;margin-bottom:14px;background:#f8fafc}
.password-pad-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.password-pad-grid button{min-height:64px;border:1px solid #b7c5d9;border-radius:12px;background:#fff;font-size:26px;font-weight:950}
.password-pad-grid .password-clear{background:#fff1f1;color:#a52222}
.password-pad-grid .password-enter{grid-column:span 2;background:#0b4fbf;color:#fff;border-color:#0b4fbf}
.password-pad-error{min-height:24px;text-align:center;color:#b42318;font-weight:900;margin-top:10px}


/* 2026-07-20：統一公司主題計算機、放大下拉選單 */
.admin-numberpad-dialog{
  width:min(620px,94vw)!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  box-shadow:0 24px 70px rgba(8,42,97,.24)!important;
}
.admin-numberpad-head{color:var(--ink)!important}
.admin-numberpad-preview{
  background:#f5f8fc!important;
  color:var(--navy)!important;
  border:2px solid #b9cbea!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC",Arial,sans-serif!important;
}
.admin-numberpad-grid.calculator-layout{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(70px,1fr))!important;
  gap:12px!important;
  padding:12px!important;
  background:#edf3fa!important;
  border-radius:16px!important;
}
.admin-numberpad-grid.calculator-layout button,
.admin-numberpad-grid.calculator-layout .enter-key{
  grid-column:auto!important;
  min-height:76px!important;
  border:1px solid #9eb7db!important;
  border-radius:13px!important;
  background:#fff!important;
  color:var(--navy)!important;
  font-size:34px!important;
  font-weight:900!important;
  box-shadow:inset 0 -4px 0 rgba(8,42,97,.08)!important;
}
.admin-numberpad-grid.calculator-layout .function-key,
.admin-numberpad-grid.calculator-layout .clear-key{
  background:#e5edf8!important;
  color:var(--navy)!important;
}
.admin-numberpad-grid.calculator-layout .enter-key{
  background:var(--blue)!important;
  color:#fff!important;
  border-color:var(--blue)!important;
}
.admin-numberpad-grid.calculator-layout button:active{transform:translateY(2px)!important}
.choice-entry-row select{
  min-height:64px!important;
  padding:14px 46px 14px 16px!important;
  font-size:20px!important;
  font-weight:850!important;
  border-width:2px!important;
  border-color:#a9bcda!important;
  border-radius:12px!important;
}
@media(max-width:700px){
  .choice-entry-row select{min-height:68px!important;font-size:21px!important}
  .admin-numberpad-grid.calculator-layout{gap:9px!important;padding:9px!important}
  .admin-numberpad-grid.calculator-layout button,
  .admin-numberpad-grid.calculator-layout .enter-key{min-height:66px!important;font-size:31px!important}
}


/* 2026-07-20：後台欄位等高；滑動手勢由 JS 判斷後才開啟虛擬鍵盤 */
#orderForm .form-grid input,
#orderForm .choice-entry-row select{
  box-sizing:border-box!important;
  width:100%!important;
  height:64px!important;
  min-height:64px!important;
  padding:0 16px!important;
  font-size:20px!important;
  line-height:1.2!important;
  border:2px solid #a9bcda!important;
  border-radius:12px!important;
  background-color:#fff!important;
}
#orderForm .choice-entry-row select{
  padding-right:52px!important;
  font-weight:850!important;
  touch-action:manipulation;
}
#orderForm input[readonly]{touch-action:pan-y;}
@media(max-width:900px){
  #orderForm .form-grid input,
  #orderForm .choice-entry-row select{
    height:68px!important;
    min-height:68px!important;
    font-size:21px!important;
  }
}

/* V30：加班排程欄位避免在 iPad／窄視窗互相重疊 */
.overtime-schedule-actions{grid-template-columns:minmax(0,1.15fr) minmax(0,.9fr) minmax(0,1fr) minmax(150px,auto);gap:12px;width:100%}
.overtime-schedule-actions>*{min-width:0}
.overtime-schedule-actions .field,.overtime-schedule-actions .cloud-sync-buttons{width:100%}
.overtime-schedule-actions input[type="date"],.overtime-schedule-actions input[type="time"]{min-width:0;max-width:100%;box-sizing:border-box}
.overtime-check{min-width:0;white-space:normal;line-height:1.35}
.overtime-schedule-actions .cloud-sync-buttons .primary-btn{width:100%;min-height:46px;white-space:nowrap}
@media(max-width:1100px){.overtime-schedule-actions{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.overtime-schedule-actions .cloud-sync-buttons{grid-column:1/-1}}
@media(max-width:680px){.overtime-schedule-actions{grid-template-columns:minmax(0,1fr)}.overtime-schedule-actions .cloud-sync-buttons{grid-column:auto}}


/* V31：訂單卡片底部標記分列，避免「續做」與「現場目前訂單」互相重疊 */
.order-item-notes{display:flex;flex-wrap:wrap;align-items:center;gap:7px 9px;width:100%;margin-top:8px}
.order-item-notes .continue-note,.order-item-notes .active-order-note{display:inline-flex;align-items:center;width:auto;max-width:100%;margin:0;line-height:1.35;white-space:nowrap}
@media(max-width:520px){.order-item-notes{align-items:flex-start;flex-direction:column}}

/* V32：訂單後台卡片底部標記固定分行，避免續做文字與目前訂單徽章重疊 */
.order-item.current::after{content:none!important;display:none!important;}
.order-item-notes{
  display:flex!important;
  flex-direction:column!important;
  flex-wrap:nowrap!important;
  align-items:flex-start!important;
  gap:8px!important;
  width:100%!important;
  margin-top:10px!important;
}
.order-item-notes .continue-note,
.order-item-notes .active-order-note{
  position:static!important;
  float:none!important;
  clear:both!important;
  display:inline-flex!important;
  flex:0 0 auto!important;
  width:auto!important;
  max-width:100%!important;
  margin:0!important;
  white-space:nowrap!important;
  transform:none!important;
}


/* ===== Desktop interaction feedback =====
   所有可操作控制項都提供手掌游標、滑入與按下回饋。 */
@media (hover:hover) and (pointer:fine){
  button:not(:disabled),
  select:not(:disabled),
  input[type="date"]:not(:disabled),
  input[type="time"]:not(:disabled),
  input[type="checkbox"]:not(:disabled),
  input[type="radio"]:not(:disabled),
  label.cloud-enable,
  label.overtime-check,
  .schedule-choice,
  .remainder-choice,
  .cut-mode-choice,
  .order-item,
  .order-pagination button:not(:disabled),
  summary,
  [role="button"]{
    cursor:pointer!important;
  }

  button:not(:disabled),
  select:not(:disabled),
  input[type="date"]:not(:disabled),
  input[type="time"]:not(:disabled),
  .order-item,
  .schedule-choice,
  .remainder-choice>span,
  .cut-mode-choice>span{
    transition:transform .12s ease, box-shadow .15s ease, border-color .15s ease, background-color .15s ease, filter .15s ease;
  }

  button:not(:disabled):hover{
    transform:translateY(-1px);
    filter:brightness(.97);
    box-shadow:0 5px 14px rgba(12,43,91,.14);
  }
  button:not(:disabled):active{
    transform:translateY(1px);
    box-shadow:0 2px 6px rgba(12,43,91,.12);
  }
  select:not(:disabled):hover,
  input[type="date"]:not(:disabled):hover,
  input[type="time"]:not(:disabled):hover{
    border-color:#5f91dc!important;
    box-shadow:0 0 0 3px rgba(7,87,201,.10);
  }
  label.cloud-enable:hover,
  label.overtime-check:hover{
    background:#eef5ff;
    border-radius:10px;
  }
  .order-item:hover{
    border-color:#75a2e3;
    background:#f7faff;
    box-shadow:0 5px 14px rgba(12,43,91,.09);
  }
  .schedule-choice:hover,
  .remainder-choice:hover>span,
  .cut-mode-choice:hover>span{
    border-color:#75a2e3!important;
    background:#f7faff;
  }
}

button:disabled,
select:disabled,
input:disabled{
  cursor:not-allowed!important;
  opacity:.55;
}
.remainder-custom-field{display:flex;flex-direction:column;gap:8px;margin-top:12px}.remainder-custom-field>span{font-size:16px;font-weight:800;color:var(--muted)}.remainder-custom-field input{width:100%;min-height:58px;padding:0 18px;border:2px solid #cbd5e2;border-radius:14px;background:#fff;font-size:20px;font-weight:700}.remainder-custom-field input:focus{border-color:var(--blue);outline:none;box-shadow:0 0 0 4px rgba(7,87,201,.1)}


/* 訂單後台：主要操作移到表單最上方 */
.form-actions-top{
  margin-top:0;
  margin-bottom:18px;
  padding-bottom:16px;
  border-bottom:1px solid var(--line);
  flex-wrap:wrap;
}
.form-actions-top .primary-btn,
.form-actions-top .success-btn{
  min-height:54px;
}
.form-actions-bottom{
  margin-top:20px;
}
@media(max-width:700px){
  .form-actions-top{display:grid;grid-template-columns:1fr;}
  .form-actions-top .primary-btn,
  .form-actions-top .success-btn{width:100%;}
}
