:root{font-family:system-ui,-apple-system,"Noto Sans TC","Microsoft JhengHei",sans-serif;color:#192b44;background:#f1f5fa;font-size:16px;--blue:#2380cd;--pink:#d94c91;--line:#dce4ee}*{box-sizing:border-box}body{margin:0}.topbar{height:68px;background:#15263e;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 max(28px,calc((100vw - 1280px)/2))}.brand{font-size:18px;font-weight:650;display:flex;align-items:center;gap:12px}.mark{font-size:27px;color:#8fbeff}.badge{font-size:14px;border:1px solid #4c5d73;padding:6px 12px;border-radius:6px}main{max-width:1280px;margin:0 auto;padding:30px 24px 18px}.pageheading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:23px}.eyebrow{margin:0 0 7px;font-size:14px;letter-spacing:.15em;color:#506e93}h1{font-size:30px;line-height:1.3;margin:0 0 9px;font-weight:700}.intro{font-size:16px;margin:0;color:#66778c}.legend{display:flex;gap:22px;font-size:14px;padding-bottom:4px}.legend span{display:flex;align-items:center;gap:8px}.legend i{width:13px;height:13px;border-radius:3px}.male{background:var(--blue)}.female{background:var(--pink)}.panel{background:white;border:1px solid var(--line);border-radius:12px;box-shadow:0 3px 15px #17294405;margin-bottom:20px;overflow:hidden}.panelhead{padding:21px 24px 16px;display:flex;align-items:center;justify-content:space-between;gap:18px}h2{margin:0;font-size:18px;font-weight:700}.panelhead p{margin:6px 0 0;font-size:14px;color:#6d7b8e}.settings{display:flex;align-items:center;gap:23px;font-size:14px}.settings label{display:flex;align-items:center;gap:8px}.settings span{white-space:nowrap;color:#61728a}input,select{font:inherit;color:inherit}input[type=number]{width:67px;border:1px solid #c9d5e3;border-radius:5px;padding:7px 6px;background:white;text-align:center}input[type=range]{width:83px;accent-color:#345e99}output{min-width:32px;color:#61728a}input:focus-visible,select:focus-visible,.chart-scroll:focus-visible,.editor-scroll:focus-visible{outline:3px solid #a8c7f4;outline-offset:2px}.chart-scroll{overflow-x:auto;padding:0 17px}#chart{width:100%;min-width:880px;display:block;height:auto}.chartfoot{padding:13px 24px;display:flex;justify-content:space-between;gap:16px;background:#f8fafd;border-top:1px solid #e6edf4;color:#6b7b8d;font-size:14px}.note{color:#718299}.editorpanel .panelhead{border-bottom:1px solid #edf1f6}.direction{font-size:14px;color:#61748c;white-space:nowrap}.editor-scroll{padding:20px 24px 10px;overflow-x:auto}#editor{min-width:1010px}.row{display:flex;gap:12px;margin:0 0 12px;align-items:center}.rowname{width:77px;flex-shrink:0;font-size:14px;color:#63738a;line-height:1.5}.rowname strong{display:block;color:#273e5b;font-weight:650}.rowgrid{flex:1;display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:0}.cell{grid-column:span 2;border:1px solid #d8e3ef;padding:10px 7px;background:#f2f8fe;min-width:0;display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center}.cell.female-cell{background:#fff4f9;border-color:#efd4e2}.seatlabel{display:flex;justify-content:center;align-items:center;gap:4px;font-size:13px;color:#597085}.cell select{font-size:14px;background:white;border:1px solid #cbd7e5;border-radius:4px;padding:4px 3px;max-width:100%}.cell .seat{font-weight:700;font-size:17px;color:var(--blue);width:59px;text-align:center}.female-cell .seat{color:var(--pink)}.heightlabel{display:flex;align-items:center;gap:3px;font-size:13px;color:#657891}.cell input{width:60px;padding:5px 2px;font-size:15px}.sex{width:66px}.estimate{font-size:12px;color:#718299;min-height:17px}.editorfoot{font-size:14px;color:#6b7b8d;display:flex;justify-content:space-between;padding:12px 24px;border-top:1px solid #e7edf4;background:#f8fafd;gap:16px}#status{color:#3b5d82}.assumptions{font-size:14px;color:#728198;line-height:1.7;margin:4px 3px}footer{max-width:1280px;margin:0 auto;padding:0 26px 22px;font-size:13px;color:#8a97a8}@media(max-width:800px){.topbar{padding:0 18px}.brand{font-size:16px}.badge{font-size:13px}main{padding:23px 14px}h1{font-size:25px}.pageheading{align-items:flex-start;gap:14px}.legend{gap:12px;padding-top:36px}.panelhead{align-items:flex-start;flex-direction:column;padding:18px}.settings{flex-wrap:wrap;gap:12px}.chartfoot{flex-direction:column;gap:6px;padding:12px 18px}.editor-scroll{padding:16px 14px 8px}.editorfoot{padding:12px 18px;flex-wrap:wrap}.direction{font-size:14px}.chart-scroll{padding:0 4px}.panel{border-radius:9px}}@media(prefers-reduced-motion:no-preference){.cell{transition:background-color .15s}}
/* Compact working surface: chart and editor remain visible together. */
.topbar{height:44px}.brand{font-size:16px}.mark{font-size:23px}.badge{padding:3px 9px}main{max-width:1440px;padding:10px 18px 6px}.pageheading{margin-bottom:8px;align-items:center}.intro{font-size:14px}.legend{font-size:14px;padding:0}.panel{margin-bottom:9px;border-radius:8px}.panelhead{padding:9px 16px;gap:12px}h2{font-size:16px}.panelhead p{display:none}.settings{gap:17px}.settings input[type=number]{padding:3px 4px;width:55px}.chart-scroll{padding:0 12px}#chart{height:clamp(175px,calc(100dvh - 421px),350px);min-width:850px}.chartfoot{padding:6px 16px;font-size:13px;line-height:1.4;gap:10px}.editor-scroll{padding:8px 16px 3px}.row{gap:8px;margin-bottom:4px}.rowname{width:66px;font-size:14px;line-height:1.35}.cell{padding:5px 3px;gap:4px;justify-content:center}.identity{display:flex;align-items:center;justify-content:center;gap:4px;width:100%}.seatlabel{font-size:14px}.seatlabel{font-size:0}.cell .seat{font-size:15px;width:46px;padding:2px}.cell .sex{font-size:14px;width:57px;padding:3px 1px}.heightlabel{font-size:13px;gap:3px;justify-content:center}.cell input{width:50px;padding:2px;font-size:14px}.estimate{font-size:14px;min-height:0;line-height:1;color:#b68530}.estimate.confirmed{color:#397b66}.editorfoot{padding:6px 16px;font-size:13px;line-height:1.4}.assumptions{margin:2px 0;font-size:12px;line-height:1.5}@media(max-width:800px){main{padding:10px}.topbar{padding:0 14px}.pageheading{gap:8px}.intro{font-size:14px}.legend{padding:0;white-space:nowrap}.panelhead{flex-direction:row;align-items:center;flex-wrap:wrap;padding:8px 12px}.settings{gap:12px}.chartfoot{flex-direction:row;flex-wrap:wrap;padding:6px 12px;gap:3px}.chart-scroll{padding:0 2px}.editor-scroll{padding:7px 10px 3px}.editorfoot{padding:6px 12px}.direction{font-size:13px}.note{display:none}}@media(max-height:650px) and (min-width:900px){.pageheading{display:none}.assumptions{display:none}#chart{height:clamp(150px,calc(100dvh - 360px),280px)}}
.rowgrid{position:relative;margin-left:80px;margin-right:55px}.row-controls{position:absolute;top:50%;transform:translateY(-50%);display:flex;gap:3px}.row-controls button{width:24px;height:29px;border:1px solid #cbd7e5;border-radius:4px;background:#fff;color:#355a85;font-size:18px;line-height:1;padding:0;cursor:pointer}.row-controls button:hover{background:#eaf2ff}.row-controls button:focus-visible{outline:3px solid #a8c7f4;outline-offset:1px}.row-controls button:disabled{opacity:.4;cursor:default}#editor{min-width:1140px}.settingspanel{padding:9px 16px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}.settingspanel h2{font-size:14px;white-space:nowrap}.allsettings{display:flex;gap:14px;flex-wrap:wrap;font-size:14px}.allsettings label{gap:5px}.allsettings input[type=number]{width:48px;font-size:14px}.allsettings input[type=range]{width:65px}#setting-status{color:#aa5e2b;font-size:13px}#chart{height:clamp(165px,calc(100dvh - 477px),330px)}@media(max-height:650px) and (min-width:900px){#chart{height:clamp(135px,calc(100dvh - 413px),250px)}}@media(max-width:800px){.settingspanel{gap:9px;padding:10px 12px}.allsettings{gap:9px}.allsettings label{font-size:14px}}
.brand-icon{width:36px;height:36px;object-fit:contain;flex-shrink:0}.brand{gap:9px}
.cell.blank-cell{background:#f1f3f6;border-color:#d8dee6}.blank-cell .seat{color:#617083}.cell .seat{width:48px}.cell input::placeholder{color:#95a0ae;font-size:13px;opacity:1}

.height-toggle{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:14px;color:#405b7c;cursor:pointer}.height-toggle input{width:16px;height:16px;margin:0;accent-color:#345e99}.height-toggle:focus-within{outline:3px solid #a8c7f4;outline-offset:4px;border-radius:3px}

.header-tools{display:flex;align-items:center;gap:12px;min-width:0}.version-tools{display:flex;align-items:center;gap:5px}.version-tools input,.version-tools select,.version-tools button{height:28px;border:1px solid #53677f;border-radius:5px;font-size:13px}.version-tools input,.version-tools select{background:#fff;color:#263f5b;padding:3px 6px}.version-tools input{width:130px}.version-tools select{width:210px}.version-tools button{background:#264463;color:#fff;padding:0 10px;cursor:pointer;white-space:nowrap}.version-tools button:hover{background:#365f88}.version-tools button:disabled{opacity:.4;cursor:default}.version-tools button:focus-visible{outline:3px solid #a8c7f4;outline-offset:2px}.version-tools #version-save{background:#35769d;border-color:#548dab}.topbar{padding-left:max(18px,calc((100vw - 1404px)/2));padding-right:max(18px,calc((100vw - 1404px)/2));gap:12px}.brand{white-space:nowrap}.badge{white-space:nowrap}@media(max-width:1000px){.topbar{height:auto;min-height:44px;flex-wrap:wrap;padding-top:5px;padding-bottom:5px}.header-tools{margin-left:auto;flex-wrap:wrap;justify-content:flex-end}.version-tools select{width:180px}}@media(max-width:650px){.header-tools{width:100%;justify-content:space-between;gap:6px}.version-tools{width:100%;flex-wrap:wrap}.version-tools input{flex:1;min-width:100px;width:110px}.version-tools select{flex:1;min-width:140px;width:160px}.version-tools button{padding:0 9px}}

.row-handle{flex-shrink:0;width:23px;height:33px;border:1px solid #d4dfec;border-radius:6px;background:#f4f8fd;color:#6b84a2;font-size:24px;line-height:1;padding:0;cursor:grab;touch-action:none;user-select:none}.row-handle:hover{background:#e7f0fc;color:#315f93}.row-handle:active{cursor:grabbing}.row-handle:focus-visible{outline:3px solid #a8c7f4;outline-offset:2px}.row.drag-source{opacity:.5}.row.drop-target{outline:2px dashed #4c8cbd;outline-offset:1px;background:#eef6fd;border-radius:4px}.row-handle.is-dragging{cursor:grabbing}

.row-count-tools{display:flex;gap:6px;padding:7px 16px 0}.row-count-tools button{border:1px solid #cbd7e5;border-radius:5px;background:#f5f9fe;color:#355a85;font:inherit;font-size:13px;padding:3px 9px;cursor:pointer}.row-count-tools button:hover{background:#eaf2ff}.row-count-tools button:disabled{opacity:.4;cursor:default}.row-count-tools button:focus-visible{outline:3px solid #a8c7f4;outline-offset:2px}

.row-count-tools button{width:28px;height:28px;padding:0;font-size:19px;line-height:1}

.row-drag-active .rowname,.row-drag-active .row-controls{opacity:.28}.row-drag-active .row.drag-source{opacity:1}.row-drag-active .drag-source .cell > *{opacity:.4}.row-drag-active .row.drop-target{outline:none;background:transparent}.half-grid-overlay{position:absolute;inset:0;z-index:4;pointer-events:none;border-top:1px dashed #8aa4c3;border-bottom:1px dashed #8aa4c3;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1' height='8'%3E%3Cpath d='M.5 0V4' stroke='%238aa4c3'/%3E%3C/svg%3E");background-repeat:repeat}.row-drag-ghost{position:fixed;z-index:1000;pointer-events:none;opacity:1;filter:drop-shadow(0 9px 10px #19334f40);will-change:transform}.row-drag-ghost .cell{opacity:1;border-color:#5f8fbc}.row-drag-ghost .row-controls{display:none}.row-placement-preview{position:absolute;top:0;bottom:0;border:2px dashed #3c80b5;background:#a9d4f326;border-radius:5px;z-index:5;pointer-events:none}.row-drag-active{user-select:none}

.half-grid-overlay{display:grid;background-image:none}.half-grid-cell{border-left:1px dashed #8aa4c3;min-width:0;pointer-events:none}

#export-dialog{border:1px solid #d5dfeb;border-radius:12px;padding:22px;width:min(430px,calc(100vw - 32px));color:#263f5b;box-shadow:0 16px 60px #19334f33}#export-dialog::backdrop{background:#15263e66}.export-heading{display:flex;justify-content:space-between;align-items:center}.export-close{border:0;background:transparent;font-size:25px;cursor:pointer;color:#657891}#export-dialog p{font-size:14px;line-height:1.7;color:#657891}.export-name-label{display:flex;align-items:center;gap:12px;font-size:14px}.export-name-label input{width:100%;min-width:0;padding:8px;border:1px solid #cbd7e5;border-radius:5px}.export-formats{display:flex;gap:10px;margin-top:20px}.export-formats button{flex:1;background:#315d89;color:#fff;border:0;border-radius:6px;padding:10px;font:inherit;cursor:pointer}.export-formats button:hover{background:#4377aa}.export-formats button:disabled{opacity:.4;cursor:wait}

.row-controls{align-items:center}.row-controls .row-handle{width:23px;height:33px;font-size:24px;cursor:grab}.row-controls .row-handle:active{cursor:grabbing}

/* Colored rounded frames stay visible independently of faded form contents. */
.cell{border:2px solid var(--blue);border-radius:8px}
.cell.female-cell{border-color:var(--pink)}
.cell.blank-cell{border-color:#7a8797}
.row-drag-active .cell{opacity:1;border-color:rgb(35 128 205 / 65%);background:rgb(242 248 254 / 55%)}
.row-drag-active .cell.female-cell{border-color:rgb(217 76 145 / 65%);background:rgb(255 244 249 / 55%)}
.row-drag-active .cell.blank-cell{border-color:rgb(122 135 151 / 65%);background:rgb(241 243 246 / 55%)}
.row-drag-active .cell > *{opacity:.6}
.half-grid-overlay{border-color:#58799e;z-index:0}
.half-grid-cell{border-color:#58799e}
.rowgrid > .cell{position:relative;z-index:1}
.rowgrid > .row-controls{z-index:2}
.row-drag-ghost .cell{border-color:var(--blue)}
.row-drag-ghost .cell.female-cell{border-color:var(--pink)}
.row-drag-ghost .cell.blank-cell{border-color:#7a8797}
