:root{font-family:"Yu Gothic UI",Meiryo,system-ui,sans-serif;color:#172334;background:#edf1f5;--ink:#172334;--muted:#536171;--line:#d8e0e8;--paper:#fff;--blue:#12397a;--red:#c92039;--green:#176244;--radius:8px}
*{box-sizing:border-box}
body{margin:0}
button,input,select{font:inherit}
button,select{cursor:pointer}
button{border:1px solid #c8d4e0;border-radius:6px;background:#fff;color:var(--ink);font-weight:650;padding:8px 13px;white-space:nowrap}
button:hover:not(:disabled){background:#edf3fa;border-color:#8cabc9}
button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #397fcc;outline-offset:2px}
button:disabled{cursor:not-allowed;opacity:.52}
.primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.primary:hover:not(:disabled){background:#1d4b97;border-color:#1d4b97}
.review-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 24px;background:#132235;color:#fff;min-height:49px}
.review-title{display:flex;align-items:center;gap:10px;white-space:nowrap;font-size:14px}
.review-title span{font-size:11px;color:#c8d6e5}
.review-bar nav{display:flex;gap:5px;flex-wrap:wrap}
.review-bar button{padding:5px 10px;background:transparent;color:#dbe5ee;border-color:#50637a;font-size:12px}
.review-bar button[aria-pressed=true]{background:#fff;color:#192a40;border-color:#fff}
.review-bar button b{font-family:system-ui;margin-right:3px}
.appbar{height:61px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:#fff;border-bottom:1px solid var(--line)}
.brand,.appbar-right,.section-head,.screen-head,.row-actions,.toolbar,.panel-footer,.option-row{display:flex;align-items:center;gap:10px}
.brandmark{font:900 17px system-ui;letter-spacing:.04em;padding:6px 9px;border-left:4px solid var(--red);color:#a91831}
.brand>div{display:grid;line-height:1.3}
.brand small,.muted,small{font-size:12px;color:var(--muted)}
.environment,.status{border-radius:4px;padding:4px 8px;background:#eaf0f8;color:#23415c;font-size:12px;font-weight:700}
.environment.backup{background:#fff1d3;color:#7a4708}
.status{color:#176244;background:#e3f3ea}
.status.offline{color:#931d2e;background:#fae4e8}
.status:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:5px;vertical-align:2px}
.workspace{max-width:1510px;margin:auto;padding:20px 24px}
.workspace-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:15px}
h1,h2,h3,p{margin:0}
h1{font-size:27px;letter-spacing:.01em;line-height:1.25}
h2{font-size:17px}
.eyebrow{font-size:12px;font-weight:700;color:#49617d;margin-bottom:4px}
.workspace-heading .muted{margin-top:5px}
.two-column{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:16px;align-items:start}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);min-width:0}
.section-head,.screen-head{justify-content:space-between;padding:12px 14px;flex-wrap:wrap}
.section-head{border-bottom:1px solid var(--line)}
.count{font:700 12px system-ui;color:#334e6c;background:#edf3f9;padding:5px 8px;border-radius:4px}
.add-form{padding:12px 14px;border-bottom:1px solid var(--line);background:#f8fafc;display:grid;gap:5px}
label{font-size:12px;font-weight:700}
.entry{display:flex;gap:8px}
input,select{border:1px solid #b9c9d9;border-radius:5px;padding:8px;color:var(--ink);background:#fff;min-width:0}
.entry input{flex:1;width:0;font:750 20px system-ui;letter-spacing:.07em;padding:6px 9px}
.entry input::placeholder{font-weight:500;color:#7c8b9c}
.entry .primary{min-width:105px}
.error{font-size:12px;color:#a3162e;line-height:1.45}
.error:empty{display:none}
.list-wrap{max-height:314px;overflow:auto}
table{width:100%;border-collapse:collapse;text-align:left}
thead{background:#f4f6fa;color:#4b5869;font-size:11px}
td,th{padding:7px 14px;border-bottom:1px solid #e8edf2}
tbody tr:last-child td{border-bottom:0}
td:first-child{font:800 21px system-ui;letter-spacing:.07em}
.row-actions{justify-content:flex-end;gap:6px}
.row-actions button{font-size:12px;padding:5px 9px}
.done{color:#145840;background:#ebf6f0;border-color:#bbd9c9}
.panel-footer{border-top:1px solid var(--line);padding:9px 14px;justify-content:space-between;min-height:46px}
.notice{font-size:12px;color:#345477;overflow-wrap:anywhere}
.undo-area{display:flex;gap:5px;flex-wrap:wrap}
.undo-area button{font-size:11px;padding:3px 5px}
.empty-table{padding:22px;color:#536171;font-size:13px}
.screen-head select{padding:5px 8px;font-size:12px}
.screen-head .toolbar button{font-size:12px;padding:5px 8px}
.monitor-body{padding:10px 14px 14px;background:#f6f8fb;border-radius:0 0 var(--radius) var(--radius)}
.monitor-body .monitor-note{margin-top:8px;display:flex;justify-content:space-between;gap:6px;font-size:11px;color:#536171}
.stage{position:relative;isolation:isolate;overflow:hidden;aspect-ratio:16/9;background:#df0b2d;container-type:inline-size;width:100%;user-select:none}
.stage.portrait{aspect-ratio:9/16;max-width:min(100%,clamp(150px,calc((100dvh - 352px) * 9 / 16),330px));margin-inline:auto}
.stage:before{content:"";position:absolute;inset:0 0 0 61%;background:#202178;z-index:-2}
.stage.portrait:before{inset:68% 0 0}
.brand-wave{position:absolute;width:52%;height:42%;left:-3%;top:-4%;object-fit:contain;z-index:-1}
.stage.portrait .brand-wave{width:92%;height:26%;top:-4%}
.stage-title{position:absolute;left:3%;top:2%;width:55%;height:29%;object-fit:contain;z-index:1}
.stage.portrait .stage-title{left:5%;top:2%;width:90%;height:19%}
.screen-area{position:absolute;display:grid;min-width:0}
.number-window{padding:.9cqw;overflow:hidden;align-content:start}
.ticket-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8cqw}
.stage.portrait .ticket-grid{gap:1.6cqw}
.tile{display:grid;place-items:center;aspect-ratio:1;background:url("assets/parts-1.png") center/100% 100% no-repeat;color:#101d40;font:bold clamp(8px,4.7cqw,112px) system-ui;letter-spacing:.02em}
.stage.portrait .tile{font-size:8.1cqw}
.stage-state{background:#fff;color:#182540;border-radius:.6cqw;padding:1.4cqw;text-align:center;font-size:2.5cqw;font-weight:750;margin:auto}
.stage.portrait .stage-state{font-size:4cqw}
.ad-area{border:2px solid #171d70;background:#edf0f4;border-radius:1.2cqw;box-shadow:.35cqw .35cqw 0 #111a4b;overflow:visible;align-content:stretch}
.info-label{position:absolute;z-index:1;left:17%;top:0;transform:translateY(-55%);width:66%;max-height:18%;object-fit:contain}
.ad-content{display:grid;place-items:center;height:100%;overflow:hidden;padding:7% 5% 4%;text-align:center;color:#526078;font-size:2.15cqw;line-height:1.55}
.stage.portrait .ad-content{font-size:3.5cqw}
.ad-content b{font-size:1.15em;color:#1a3157}
.ad-content img{width:100%;height:100%;min-height:0;object-fit:contain}
.editing .screen-area{outline:2px solid #75c4ff;cursor:move;touch-action:none}
.editing .screen-area.active-area{outline:2px solid #ffda77}
.editing.invalid .screen-area{outline:2px dashed #ffecbf}
.area-label{position:absolute;z-index:3;top:0;left:0;padding:2px 5px;background:#12243c;color:#fff;font-size:10px;transform:translateY(-100%);pointer-events:none}
.handle{position:absolute;z-index:4;right:0;bottom:0;border-radius:0;padding:0;min-width:15px;min-height:15px;background:#fff;border:2px solid #165eab;cursor:nwse-resize;touch-action:none}
.divider{position:absolute;z-index:4;padding:0;background:#fff9df;border:1px solid #e0b963;touch-action:none;font:700 12px system-ui;display:grid;place-items:center}
.divider.vertical{width:13px;height:22%;top:48%;transform:translateX(-50%);cursor:ew-resize}
.divider.horizontal{height:13px;width:26%;left:37%;transform:translateY(-50%);cursor:ns-resize}
.edit-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;padding:9px 0 0}
.edit-actions button{font-size:12px}
.field-group{display:grid;gap:9px;padding:12px 14px}
.field-group label{display:grid;gap:4px}
.field-group input[type=range]{width:100%;padding:0;accent-color:var(--blue)}
.field-group .file-input{max-width:100%;font-size:11px}
.field-group output{font:700 12px system-ui;color:#345477}
.small-actions{display:flex;gap:6px;flex-wrap:wrap;padding:8px 14px;border-top:1px solid var(--line)}
.small-actions button{font-size:11px;padding:5px 8px}
.desk{display:grid;grid-template-columns:190px minmax(0,1fr);gap:20px}
.rail{min-width:0}
.rail-label{color:#5d6c7d;font-size:11px;font-weight:700;margin:8px 8px 10px}
.rail button{display:flex;justify-content:space-between;width:100%;margin-bottom:5px;background:transparent;text-align:left;border-color:transparent}
.rail button.selected{color:#163a72;background:#e0eaf7;border-color:#c4d6ed}
.desk-body{max-width:1000px;min-width:0}
.entry-with-keypad{display:grid;grid-template-columns:minmax(210px,.73fr) minmax(0,1.27fr);gap:16px;align-items:start}
.keypad-panel .add-form{border-bottom:0}
.keypad-panel .entry{display:grid}
.keypad-panel .entry input{width:100%;font-size:28px}
.keypad-panel .entry .primary{min-height:42px}
.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px 14px 14px}
.keypad button{font:700 18px system-ui;min-height:38px;padding:4px}
.keypad .control{font:700 11px "Yu Gothic UI",Meiryo,sans-serif}
.layout-three{display:grid;grid-template-columns:190px minmax(0,1fr) 228px;gap:12px;align-items:start}
.layout-three .screen-head{align-items:start}
.layout-three .stage.landscape{max-width:min(100%,clamp(320px,calc((100dvh - 354px) * 16 / 9),1060px));margin-inline:auto}
.layout-three .rail{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:7px}
.layout-three .rail button{display:grid;gap:3px;justify-content:start}
.quick-receipt{display:flex;align-items:center;gap:8px}
.quick-receipt input{width:105px;font-weight:700}
.quick-receipt .error{max-width:150px}
.number-strip{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:10px;padding:9px 12px;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
.number-strip b{font-size:12px;margin-right:4px}
.number-strip button{font:750 15px system-ui;padding:4px 7px}
.number-strip .manage{font:650 12px "Yu Gothic UI",Meiryo,sans-serif;margin-left:auto}
dialog{padding:0;border:1px solid var(--line);border-radius:9px;max-width:calc(100vw - 28px);color:var(--ink)}
dialog::backdrop{background:#111d2bb0}
#edit-form{width:365px;max-width:100%;padding:20px;display:grid;gap:10px}
#edit-form p{font-size:13px;color:var(--muted)}
#edit-form .error{color:#a3162e}
#edit-form footer{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}
#full-dialog{width:min(94vw,1440px);max-height:94vh;background:#0a0c13;overflow:auto}
#full-screen-preview .stage.portrait{max-width:min(100%,calc(85vh * 9 / 16))}
.close-full{position:absolute;z-index:7;right:8px;bottom:8px;font-size:12px}
@media(max-width:1020px){.layout-three{grid-template-columns:145px minmax(0,1fr)}.layout-three>.inspector{grid-column:2}.desk{grid-template-columns:155px minmax(0,1fr)}}
@media(max-width:700px){.review-bar{align-items:flex-start;flex-direction:column;padding:8px 12px}.appbar{padding:0 12px;height:55px}.workspace{padding:14px 12px}.workspace-heading{align-items:start;flex-direction:column;gap:8px}.two-column,.desk,.entry-with-keypad,.layout-three{grid-template-columns:minmax(0,1fr)}.layout-three>.inspector{grid-column:auto}.rail{display:flex;gap:4px;flex-wrap:wrap}.rail button,.layout-three .rail button{width:auto;display:flex;margin-bottom:0}.rail-label{width:100%;margin:4px}.toolbar{flex-wrap:wrap}.stage.portrait{max-width:min(100%,250px)}.quick-receipt{width:100%;flex-wrap:wrap}.list-wrap{max-height:none}h1{font-size:23px}td,th{padding-inline:10px}.row-actions{gap:3px}.row-actions button{padding-inline:6px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:0s!important;transition-duration:0s!important}}