:root{--navy:#102b38;--navy-soft:#1c3b48;--mint:#91e1be;--mint-dark:#246950;--ink:#223540;--muted:#72818a;--border:#e1e8eb;--surface:#f3f6f7;--blue:#326d91;--orange:#d9963f;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--surface);font-synthesis:none;font-size:16px}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.42}a{color:inherit}button,select,input,textarea{outline-offset:3px}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid #258ab3}button{border:0;background:none}button svg{flex-shrink:0}input,textarea,select{background:#fff;border:1px solid #d5dfe4;border-radius:6px;padding:10px 11px;min-width:0;max-width:100%}textarea{resize:vertical}input[type=number]{appearance:textfield}input[type=checkbox]{accent-color:#367e61;width:16px;height:16px;padding:0;flex-shrink:0}select{cursor:pointer;padding-right:28px}h1,h2,h3,p{margin:0}h2{font-size:24px;font-weight:650;letter-spacing:-.02em}h3{font-size:18px;font-weight:650}p{line-height:1.65}small{font-size:12px}svg{vertical-align:middle}[hidden]{display:none!important}.boot{height:100dvh;display:flex;flex-direction:column;gap:15px;align-items:center;justify-content:center}.boot h1{font-size:30px}.boot p{color:var(--muted)}.topbar{height:76px;background:white;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px;gap:26px}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;flex-shrink:0}.brand>span{font-size:21px;font-weight:720;letter-spacing:-.6px}.brand small{display:block;font-weight:450;font-size:11px;letter-spacing:.15px;color:var(--muted);margin-top:1px}.brand em{font-style:normal;font-size:10px;margin-left:6px;color:#8998a0}.main-nav{display:flex;gap:5px;align-self:stretch;align-items:center;min-width:0}.nav-tab{height:38px;display:flex;align-items:center;gap:7px;padding:0 12px;color:#6c7e87;border-radius:6px;font-size:14px;white-space:nowrap}.nav-tab.active{background:#edf4f4;color:var(--navy);font-weight:650}.nav-tab:hover{background:#f1f5f6}.header-actions{display:flex;gap:9px;margin-left:auto;flex-shrink:0}.button{min-height:38px;padding:9px 13px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:14px;font-weight:550;white-space:nowrap;transition:background .12s}.primary{background:var(--navy);color:#fff;border:1px solid var(--navy)}.primary:hover{background:#224654}.quiet{background:white;border:1px solid #dbe4e8}.quiet:hover{background:#f1f6f6}.ghost{color:#506974}.ghost:hover{background:#f2f6f6}.full-width{width:100%}.icon-button{width:31px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:5px;flex-shrink:0}.icon-button span{display:none}.icon-button:hover{background:#e7eff1}.app-shell{display:grid;grid-template-columns:220px minmax(0,1fr)278px;height:calc(100dvh - 76px)}.app-shell:not([data-view=designer]){grid-template-columns:220px minmax(0,1fr)}.sidebar{min-height:0;background:var(--navy);color:#dee7ec;display:flex;flex-direction:column;padding:23px 15px 16px;overflow:hidden}.vessel-summary{padding:0 8px 22px;border-bottom:1px solid #ffffff15}.sidebar-caption{font-size:10px;letter-spacing:1.45px;color:#94b3c1;font-weight:650}.vessel-title{display:flex;align-items:center;gap:9px;margin-top:14px;color:#b7e5d3}.vessel-title h1{font-size:19px;color:white;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:620}.vessel-title svg{flex-shrink:0}.vessel-imo{margin:8px 0 18px 33px;color:#98afba;font-size:12px;letter-spacing:.2px}.vessel-numbers{display:flex;gap:26px;margin-bottom:18px}.vessel-numbers span{display:flex;flex-direction:column;font-size:12px;color:#99b1bc;gap:2px}.vessel-numbers strong{font-size:24px;font-weight:550;color:#f2f7f8;letter-spacing:-.7px}.sidebar-new{background:#234653;color:#c3e9db;width:100%;border:1px solid #3c626f;font-weight:500;font-size:13px}.sidebar-new:hover{background:#2c5362}.bay-list-title{display:flex;align-items:center;justify-content:space-between;margin:15px 8px 8px;font-size:13px;font-weight:550}.bay-list-title .icon-button:hover{background:#ffffff15}.bay-search{display:flex;align-items:center;margin:0 6px 13px;border:1px solid #45606c;gap:5px;border-radius:5px;padding:0 8px;color:#839ca8}.bay-search input{background:transparent;border:0;color:#dbe8ee;border-radius:0;padding:7px 0;width:100%;font-size:13px}.bay-search input::placeholder{color:#829ca9}.bay-list{flex:1;min-height:70px;overflow:auto;padding:0 0 8px;scrollbar-width:thin;scrollbar-color:#46616c transparent}.bay-list-item{display:flex;align-items:center;width:100%;gap:11px;border-radius:6px;padding:10px 8px;color:#b6cbd5;text-align:left;margin:2px 0;min-height:57px}.bay-list-item:hover{background:#ffffff07}.bay-list-item.active{background:#284b55;border:1px solid #3f716e;padding:9px 7px;color:#e8fff2}.bay-number{font-size:16px;background:#ffffff0b;border:1px solid #ffffff12;border-radius:4px;width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-variant-numeric:tabular-nums}.bay-list-item.active .bay-number{color:#bdf2d8;border-color:#72ae9e50;background:#679f8a1c}.bay-list-meta{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.bay-list-meta b{font-size:13px;font-weight:550}.bay-list-meta small{font-size:10px;color:#8eacb7;white-space:nowrap}.bay-list-item.active small{color:#abcbc6}.bay-list-item>svg{margin-left:auto;color:#91b3b5}.empty-list{padding:15px;font-size:14px}.sidebar-foot{font-size:10px;display:flex;gap:7px;align-items:center;color:#86a4b0;margin:20px 8px 0}.workarea{min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}.workbar{min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 27px;background:#f7f9fa;border-bottom:1px solid var(--border);flex-shrink:0}.breadcrumb{font-size:11px;color:#87949d;display:flex;align-items:center;gap:9px;margin-bottom:6px;line-height:1.4}.breadcrumb span{color:#b3bfc5}.workbar-actions{display:flex;align-items:center;gap:8px}.workbar-actions .button{font-size:12px;padding:8px 11px;min-height:34px}.mobile-bay-picker{display:none}.editor-toolbar{display:flex;align-items:center;padding:11px 18px;background:#fff;gap:12px;border-bottom:1px solid var(--border);min-height:62px;overflow-x:auto;flex-shrink:0}.tool-group{display:flex;gap:3px}.tool{display:flex;align-items:center;justify-content:center;gap:6px;padding:9px 10px;border-radius:5px;color:#72818a;font-size:12px;white-space:nowrap;min-height:36px}.tool.active{background:#e9f3ee;color:#2f7157;box-shadow:inset 0 0 0 1px #cfe2d7;font-weight:650}.tool:hover{background:#f1f5f6}.tool.active:hover{background:#e2f1e9}.twenty-icon{font-size:11px;width:19px;height:18px;border:1px solid currentColor;display:flex;align-items:center;justify-content:center;border-radius:3px;font-weight:600}.toolbar-divider{height:23px;border-left:1px solid var(--border)}.mirror-control{display:flex;align-items:center;gap:6px;font-size:12px;color:#6e838d;white-space:nowrap}.mirror-control input{width:14px;height:14px}.history-tools{margin-left:auto;display:flex;gap:2px;color:#758d97}.board-top{display:flex;align-items:center;justify-content:space-between;padding:12px 26px 0;gap:10px;flex-shrink:0}.segmented{display:flex;background:#e5ecef;padding:3px;border-radius:6px}.segmented button{padding:5px 11px;border-radius:4px;font-size:12px;color:#83929a;white-space:nowrap}.segmented button.active{background:white;box-shadow:0 1px 3px #102b3815;color:#435f6b;font-weight:600}.zoom-tools{display:flex;gap:3px;align-items:center;color:#7b929c}.zoom-tools>span{font-size:11px;min-width:39px;text-align:center;font-variant-numeric:tabular-nums}.canvas-scroll{flex:1;min-height:140px;overflow:auto;background-image:radial-gradient(#cad7df78 .8px,transparent .8px);background-size:17px 17px;touch-action:none;overscroll-behavior:contain;padding:19px 24px;position:relative}.drawing-paper{width:max-content;margin:auto;min-height:100%;display:flex;align-items:center;justify-content:center}.bay-svg{display:block;overflow:visible;flex-shrink:0;user-select:none}.centerline{stroke:#9baeba;stroke-width:1;stroke-dasharray:5 6;opacity:.7;pointer-events:none}.centerline-label{font:10px monospace;fill:#96a8b3;pointer-events:none}.svg-area-label{font-size:11px;font-weight:700;letter-spacing:1.6px;fill:#6d8997}.svg-axis{font-family:Consolas,"SFMono-Regular",monospace;font-size:13px;font-weight:500;fill:#718f9f;cursor:pointer}.svg-axis:hover{fill:#264d63}.slot{cursor:crosshair}.slot-box{fill:#f6fafb;stroke:#c5d3db;stroke-width:1;transition:fill .08s,stroke .08s}.slot.empty .slot-box{stroke-dasharray:3 3;fill:#edf3f5;fill-opacity:.7}.empty-cross{stroke:#bbcbd5;stroke-width:1;pointer-events:none}.slot.valid .slot-box{fill:#d8efe4;stroke:#8cbea8;stroke-dasharray:none}.slot.valid .empty-cross{display:none}.slot.reefer .slot-box{fill:#dcecf7;stroke:#87b2ce}.slot.only20 .slot-box{stroke:#c99749;stroke-width:1.7;fill:#f2ead8}.slot.reefer.only20 .slot-box{fill:#dcecf7;stroke:#c99749}.slot.selected .slot-box{stroke:#2b6d8b;stroke-width:2.4}.slot:hover .slot-box{stroke:#3d7b92;stroke-width:2}.slot .reefer-mark,.slot .short-mark{display:none;font:600 12px Arial,sans-serif;fill:#3e6f90;pointer-events:none}.slot.reefer .reefer-mark{display:block}.slot.only20 .short-mark{display:block;fill:#9c742a}.slot:focus{outline:none}.slot:focus-visible .slot-box{stroke:#196eab;stroke-width:3}.selection-box{fill:#2d84b615;stroke:#4288ad;stroke-width:1;stroke-dasharray:4 3;pointer-events:none}.canvas-legend{display:flex;align-items:center;gap:20px;padding:12px 24px;background:white;border-top:1px solid var(--border);font-size:11px;color:#7a8c97;flex-shrink:0;flex-wrap:wrap}.canvas-legend>span{display:inline-flex;align-items:center;gap:6px}.key{width:12px;height:10px;border-radius:2px;border:1px solid}.normal{background:#d8efe4;border-color:#8cbea8}.reef{background:#dcecf7;border-color:#87b2ce}.twenty{background:#f2ead8;border-color:#c99749}.absent{background:#edf3f5;border-color:#c5d3db;border-style:dashed}.selection-count{margin-left:auto;font-size:10px}.canvas-status{display:flex;align-items:center;justify-content:space-between;gap:9px;background:#eaf0f3;color:#8196a2;padding:9px 23px;font-size:10px;flex-shrink:0;line-height:1.5}.canvas-status>span:first-child{font-family:Consolas,monospace;color:#5a7f92;white-space:nowrap}.canvas-status>span:last-child{white-space:nowrap}.inspector{background:white;border-left:1px solid var(--border);overflow:auto;min-height:0;padding:22px 20px;scrollbar-width:thin}.inspector-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.inspector-heading h2{font-size:16px;font-weight:650;letter-spacing:-.1px}.number-tag{background:#eaf1f4;color:#577b8d;font-family:Consolas,monospace;font-size:13px;padding:4px 9px;border-radius:5px}.inspector-section{padding:0 0 19px;margin-bottom:19px;border-bottom:1px solid var(--border)}.inspector-title{color:#7d929e;font-size:10px;letter-spacing:1.1px;font-weight:650;margin-bottom:14px;display:flex;justify-content:space-between}.bay-stats{display:grid;grid-template-columns:repeat(3,1fr);padding:0 2px 17px;gap:7px}.bay-stats>div{display:flex;flex-direction:column;gap:5px}.bay-stats strong{font-size:23px;font-weight:550;color:#315667;letter-spacing:-.5px}.bay-stats span{font-size:11px;color:#7f929c}.compact-actions{display:flex;justify-content:space-between;gap:8px}.text-button{font-size:12px;color:#648490;padding:5px 0;display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap}.text-button:hover{color:#264e61}.danger{color:#b37170}.danger:hover{color:#9d4946}.text-button svg{width:13px;height:13px}.slot-address{display:flex;gap:0;justify-content:space-between;background:#f1f6f8;border:1px solid #e1eaf0;border-radius:7px;padding:14px 17px;margin-bottom:11px}.slot-address>div{display:flex;flex-direction:column;gap:5px}.slot-address small{font-size:9px;letter-spacing:1px;color:#8b9eaa}.slot-address strong{font-size:23px;font-family:Consolas,monospace;font-weight:450;color:#416b83}.selection-placeholder{border:1px dashed #dbe4e9;background:#f8fafb;border-radius:6px;padding:17px 12px;color:#8a9da7;font-size:12px;text-align:center;margin-bottom:10px}.flag-control{display:flex;align-items:center;justify-content:space-between;padding:9px 0;gap:8px}.flag-control>span{display:flex;flex-direction:column;gap:5px}.flag-control b{font-size:12px;font-weight:600;color:#426270}.flag-control small{font-size:10px;color:#8a9da7}.flag-control .switch{appearance:none;width:31px;height:18px;border:0;background:#d7e3e8;border-radius:15px;padding:2px;position:relative;transition:background .1s;cursor:pointer;margin:0}.switch:after{content:"";height:14px;width:14px;display:block;border-radius:50%;background:white;box-shadow:0 1px 3px #0002;transition:transform .1s}.switch:checked{background:#63a486}.switch:checked:after{transform:translateX(13px)}.switch:indeterminate{background:#829ab3}.switch:indeterminate:after{transform:translateX(6px)}.switch:disabled{opacity:.35;cursor:default}.selection-actions{display:flex;justify-content:space-between;margin-top:8px;gap:5px}.selection-actions .text-button{font-size:10px}.field{display:flex;flex-direction:column;gap:7px;margin:12px 0;min-width:0}.field>span{font-size:14px;font-weight:550;color:#55717f}.field input,.field select,.field textarea{font-size:14px;width:100%}.inspector .field{margin:11px 0;gap:6px}.inspector .field>span{font-size:11px;color:#7b919e;font-weight:450}.inspector .field input,.inspector .field select,.inspector .field textarea{font-size:12px;padding:9px 10px;background:#fafcfd}.inspector .button{font-size:11px;min-height:34px}.check-line{display:flex;align-items:center;gap:7px;font-size:12px;line-height:1.5;color:#6b8695;cursor:pointer}.inspector .check-line{font-size:11px;margin:13px 0}.inspector .check-line input{width:13px;height:13px}.check-link{display:flex;gap:6px;align-items:center;text-align:left;font-size:11px;color:#6b8f84;padding:0}.check-link.has-warnings{color:#ba955d}.page-scroll,.overview-content{overflow:auto;min-height:0;padding:26px;flex:1}.detail-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:23px;max-width:1100px;margin:auto}.form-card{background:white;border:1px solid var(--border);border-radius:8px;padding:24px;margin-bottom:22px}.form-card>p{color:#7b8f9a;font-size:14px;margin:10px 0 16px}.card-heading{display:flex;align-items:center;gap:13px;margin-bottom:23px;color:#446776}.card-heading h3{color:#304e5e}.card-heading p{font-size:12px;color:#80939e;margin-top:5px}.vessel-name-field{margin-bottom:20px}.fields-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 21px}.fields-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.fields-grid .wide{grid-column:1/-1}.summary-grid,.overview-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:20px 0}.overview-summary{grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 25px}.summary-card{border:1px solid #dfe8ed;border-radius:6px;background:#fbfcfd;padding:17px;display:flex;flex-direction:column;gap:10px}.summary-card span{font-size:12px;color:#869aa5}.summary-card strong{font-size:26px;font-weight:550;color:#315d72}.bay-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:19px}.bay-card{padding:17px;background:white;border:1px solid #d8e3e9;border-radius:8px;text-align:left;transition:border-color .12s,box-shadow .12s}.bay-card:hover{border-color:#82b7ac;box-shadow:0 2px 12px #29455e0b}.bay-card-head,.bay-card-foot{display:flex;justify-content:space-between;align-items:center;gap:8px}.bay-card-head strong{font-size:16px;color:#3c6072}.bay-card-head>span{font-size:11px;color:#7e96a4}.bay-card .bay-svg{width:100%;height:250px;margin:20px 0;pointer-events:none}.bay-card .svg-axis{font-size:13px}.bay-card .centerline-label{display:none}.bay-card-foot{font-size:10px;color:#8da0ac;border-top:1px solid var(--border);padding-top:13px}.json-meta{padding:14px 28px;display:flex;align-items:center;gap:25px;background:white;font-size:12px;color:#7891a0;border-bottom:1px solid var(--border);flex-wrap:wrap}.json-meta>span:first-child{color:#537586;font-family:Consolas,monospace}.json-meta .text-button{margin-left:auto}.json-preview{background:#142d3b;color:#acd3da;line-height:1.7;font-size:13px;font-family:Consolas,"SFMono-Regular",monospace;margin:0;flex:1;padding:25px 29px;overflow:auto;tab-size:2;min-height:0}.settings-page{max-width:1100px;margin:0 auto;width:100%}.code-input{font-family:Consolas,monospace;font-size:12px!important}.font-table{margin-top:20px;overflow:auto}.font-row,.font-table-head{display:grid;grid-template-columns:1.25fr 1.6fr 70px 1fr;gap:12px;align-items:center;min-width:550px;margin-bottom:10px}.font-table-head{font-size:11px;color:#8a9ca5}.font-row>span{font-size:13px;text-transform:capitalize;color:#607c8b}.font-row input{width:100%;font-size:12px;padding:9px}.muted{color:#8196a2;font-size:12px}.empty-add{margin:40px auto}dialog{padding:0;border:0;border-radius:12px;box-shadow:0 22px 80px #08243040;width:min(590px,calc(100vw - 32px));max-height:88dvh;overflow:hidden;color:var(--ink);background:white}dialog.wide-dialog{width:min(820px,calc(100vw - 32px))}dialog::backdrop{background:#102b386e;backdrop-filter:blur(3px)}.dialog-form{display:flex;flex-direction:column;max-height:88dvh}.dialog-head{display:flex;align-items:center;justify-content:space-between;padding:23px 27px;border-bottom:1px solid var(--border);gap:15px}.dialog-head h2{font-size:20px}.dialog-body{padding:19px 27px 25px;overflow:auto;flex:1;min-height:0}.dialog-body>p{font-size:14px;color:#7f949f;margin-bottom:15px}.dialog-body .muted{font-size:12px}.dialog-foot{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:17px 27px;border-top:1px solid var(--border);background:#f8fafb;flex-shrink:0}.dialog-error{color:#ae5553;background:#fbefed;border:1px solid #edcbc6;padding:11px;font-size:13px;border-radius:5px;margin:15px 0}.dialog-body fieldset{border:1px solid #dce7ed;border-radius:7px;padding:11px 16px 16px;margin:18px 0}.dialog-body legend{font-size:13px;font-weight:600;color:#466a7d;padding:0 6px}.dialog-body .check-line{margin:13px 0;color:#617f8f;font-size:13px}.dialog-body .field{margin:12px 0}.dialog-body .field>span{font-size:12px}.new-grids{display:grid;grid-template-columns:1fr 1fr;gap:16px}.new-grids fieldset{margin-top:14px}.dialog-hint{border:1px solid #dce8e8;background:#eff7f4;padding:12px 15px;font-size:12px;color:#698a7c;border-radius:5px;margin-top:18px;line-height:1.6}.grid-generator{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:13px 0}.grid-generator input[type=number]{width:75px;padding:8px;font-size:13px}.grid-generator span{font-size:12px;color:#7291a0}.grid-generator .button{font-size:12px;min-height:32px}.impact{font-size:12px;color:#b18750;margin:15px 0 0;line-height:1.6}.modal-json{width:100%;min-height:350px;max-height:50dvh;font:12px/1.65 Consolas,monospace;white-space:pre;resize:vertical;background:#163140;color:#bfdae0;border-color:#345263}.issue-summary{display:flex;gap:10px;margin-bottom:18px}.issue-summary>span{font-size:13px;background:#edf4f4;border:1px solid #dbe7ea;padding:7px 11px;border-radius:5px;color:#648593}.issue-list{display:flex;flex-direction:column;gap:9px}.issue-item{display:flex;align-items:flex-start;gap:11px;border:1px solid #e4e9ed;padding:12px;border-radius:6px;text-align:left;width:100%;background:#fbfcfd;font-size:12px;line-height:1.65;color:#708896}.issue-item svg{color:#c8a167;flex-shrink:0;margin-top:1px}.issue-item.error svg{color:#bf6d65}.issue-item b{display:block;color:#54768a;margin-bottom:3px;font-size:12px}.issue-item:hover{border-color:#b4cbd7}.empty-issues{text-align:center;padding:25px;color:#518674}.empty-issues svg{display:block;margin:0 auto 15px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:10;background:#143b3b;color:#e1f9ea;border:1px solid #598577;box-shadow:0 6px 30px #102b3830;border-radius:7px;padding:13px 21px;max-width:min(90vw,650px);font-size:14px;line-height:1.5}.toast.error{background:#5c3636;color:#ffede8;border-color:#956362}body.drag-over:after{content:"Drop a vessel ZIP";position:fixed;inset:12px;z-index:20;background:#173c4aea;border:3px dashed #80c7b5;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:24px;color:#d4f1e7;pointer-events:none;padding:30px;text-align:center}
@media(min-width:1600px){.app-shell{grid-template-columns:240px minmax(0,1fr)310px}.app-shell:not([data-view=designer]){grid-template-columns:240px minmax(0,1fr)}.inspector{padding:26px}.tool{font-size:13px;padding:10px 12px}.mirror-control{font-size:13px}.canvas-legend{font-size:12px}}
@media(max-width:1250px){.topbar{padding:0 16px;gap:17px}.nav-tab{padding:0 9px;gap:5px;font-size:12px}.header-actions .save-project{display:none}.header-actions{gap:6px}.app-shell{grid-template-columns:190px minmax(0,1fr)245px}.app-shell:not([data-view=designer]){grid-template-columns:190px minmax(0,1fr)}.sidebar{padding:20px 11px 14px}.vessel-title h1{font-size:16px}.bay-list-meta small{font-size:9px}.workbar{padding:17px 20px}.inspector{padding:21px 15px}.editor-toolbar{gap:8px;padding:10px 12px}.tool{padding:9px 8px}.tool-group{gap:1px}.mirror-control>svg{display:none}.canvas-status #tool-hint{max-width:45%}.detail-layout{grid-template-columns:1fr 310px}.brand>span{font-size:19px}.brand img{width:32px;height:32px}.main-nav{gap:2px}.overview-summary{gap:10px}.fields-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1050px){.app-shell{grid-template-columns:175px minmax(0,1fr)225px}.app-shell:not([data-view=designer]){grid-template-columns:175px minmax(0,1fr)}.brand small{font-size:10px}.nav-tab svg{display:none}.nav-tab{font-size:12px;padding:0 8px}.header-actions .button{font-size:12px;padding:8px 9px}.topbar{gap:12px}.tool span:not(.twenty-icon){display:none}.mirror-control{font-size:11px}.workbar-actions .button span{display:none}.workbar-actions .button{padding:8px}.canvas-status{font-size:9px;flex-wrap:wrap}.canvas-status #tool-hint{max-width:none;order:3;width:100%}.canvas-legend{gap:12px;font-size:10px}.detail-layout{grid-template-columns:1fr}.overview-summary{grid-template-columns:repeat(2,1fr)}.vessel-imo{margin-left:0}.vessel-title{gap:7px}.vessel-title svg{width:19px}.bay-list-item{gap:8px}.bay-list-meta small{font-size:9px}.bay-list-item>svg{display:none}.inspector .field select{font-size:11px}.flag-control small{font-size:9px}}
@media(max-width:800px){.topbar{height:auto;min-height:70px;flex-wrap:wrap;padding:12px 17px 0;gap:9px}.brand{margin-right:auto}.brand>span{font-size:19px}.header-actions{margin-left:0}.header-actions .ghost span{display:none}.header-actions .button{font-size:12px;min-height:34px;padding:7px 9px}.main-nav{order:3;width:100%;gap:10px;overflow-x:auto;padding:6px 0 8px}.nav-tab{font-size:13px;height:31px;padding:0 10px}.nav-tab svg{display:block;width:15px;height:15px}.app-shell,.app-shell:not([data-view=designer]){height:calc(100dvh - 119px);grid-template-columns:minmax(0,1fr)225px}.app-shell:not([data-view=designer]){grid-template-columns:1fr}.sidebar{display:none}.workbar{min-height:79px;padding:12px 18px}.mobile-bay-picker{display:block;max-width:91px;min-height:34px;font-size:12px;padding:6px 26px 6px 9px}.workbar h2{font-size:22px}.breadcrumb{font-size:10px}.toolbar-divider{display:none}.editor-toolbar{padding:8px 12px;gap:7px}.tool{min-height:35px;padding:8px}.tool-group{gap:2px}.mirror-control{font-size:10px}.mirror-control span{max-width:45px;white-space:normal;line-height:1.3}.mirror-control input{width:12px;height:12px}.history-tools .icon-button{width:25px}.board-top{padding:12px 16px 0}.canvas-legend{padding:11px 15px}.canvas-legend .selection-count{width:100%;margin-left:0}.canvas-status{padding:8px 15px}.page-scroll,.overview-content{padding:20px 17px}.form-card{padding:20px}.overview-summary{gap:10px}.summary-card{padding:15px}.json-meta{padding:11px 18px;gap:10px}.json-preview{font-size:11px;padding:18px}.header-actions .save-project{display:none}.workbar-actions{gap:5px}.dialog-head{padding:19px 21px}.dialog-body{padding:15px 21px 21px}.dialog-foot{padding:15px 21px}.modal-json{min-height:300px}.font-row,.font-table-head{gap:8px}.toast{font-size:13px;bottom:16px}.drawing-paper{min-height:100%}}
@media(max-width:580px){.topbar{padding:11px 12px 0}.brand img{width:29px;height:29px}.brand>span{font-size:18px}.brand small{font-size:9px}.main-nav{gap:3px}.nav-tab{font-size:12px;padding:0 8px;gap:4px}.nav-tab svg{width:13px;height:13px}.app-shell{display:flex;flex-direction:column;height:auto;min-height:calc(100dvh - 117px)}.app-shell:not([data-view=designer]){display:block;height:calc(100dvh - 117px)}.workarea{height:calc(100dvh - 117px);min-height:560px}.app-shell:not([data-view=designer]) .workarea{min-height:0;height:100%}.inspector{border-left:0;border-top:1px solid var(--border);padding:24px 20px;display:grid;grid-template-columns:1fr 1fr;gap:0 23px;overflow:visible}.inspector-heading,.inspector-footer{grid-column:1/-1}.inspector-section{min-width:0;margin-bottom:16px}.inspector-heading{margin-bottom:22px}.compact-actions{gap:6px;flex-wrap:wrap}.compact-actions .text-button{font-size:10px}.slot-address{padding:11px 12px}.slot-address strong{font-size:19px}.slot-address small{font-size:8px}.selection-actions{flex-wrap:wrap;gap:1px}.flag-control small{font-size:9px;line-height:1.5}.inspector-title{font-size:9px}.inspector .field select{font-size:10px}.inspector .check-line{font-size:10px}.flag-control b{font-size:11px}.bay-stats strong{font-size:22px}.bay-stats span{font-size:10px}.workbar{padding:13px 16px;gap:8px}.workbar-actions .button{min-height:33px}.mobile-bay-picker{width:80px}.editor-toolbar{gap:5px;padding:8px 10px;min-height:54px}.tool{padding:8px}.tool-group{gap:0}.tool svg{width:16px;height:16px}.mirror-control{margin-left:2px;gap:3px}.history-tools .icon-button{width:26px}.history-tools .icon-button svg{width:16px;height:16px}.board-top{padding:12px 13px 0}.segmented button{font-size:11px;padding:5px 8px}.zoom-tools>span{font-size:10px;min-width:34px}.zoom-tools{gap:0}.zoom-tools .icon-button{width:27px}.canvas-scroll{padding:14px;min-height:180px}.canvas-legend{gap:13px;padding:9px 16px;font-size:10px}.canvas-status{font-size:9px}.canvas-status #tool-hint{display:none}.overview-summary{gap:9px}.summary-card span{font-size:11px}.summary-card strong{font-size:25px}.bay-cards{grid-template-columns:1fr}.fields-grid.three,.fields-grid{gap:2px 13px}.field>span{font-size:12px}.field input,.field textarea{font-size:14px;padding:9px}.form-card{padding:19px 17px}.json-meta>span:nth-child(2){font-size:10px}.workbar-actions .primary span{display:none}.json-preview{font-size:11px;padding:16px}.new-grids{grid-template-columns:1fr;gap:0}.dialog-body{padding:14px 18px 20px}.dialog-head,.dialog-foot{padding:17px 18px}.dialog-head h2{font-size:18px}.dialog-body fieldset{padding:8px 12px 12px;margin:12px 0}.dialog-body .field>span{font-size:12px}.dialog-body .button{font-size:12px}.dialog-body .fields-grid{gap:0 13px}.dialog-foot .button{font-size:13px}.dialog-body .check-line{font-size:12px}.dialog-hint{font-size:11px}.toast{font-size:12px;max-width:92vw;width:max-content}.modal-json{min-height:270px;font-size:11px}.header-actions{gap:4px}.header-actions .primary{font-size:11px;padding:8px}.header-actions .primary svg{width:15px;height:15px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Planner semantics: hatch covers, visibility checks and ordered pair roles. */
.hatch-line{stroke:#c56b69;stroke-width:2.5;stroke-linecap:butt;pointer-events:stroke}
.key.hatch{height:3px;background:#c56b69;border:0;border-radius:0}
.pairing-hint{font-size:11px;color:#718792;line-height:1.6;margin:-2px 0 4px}
.pairing-hint b{font-weight:600;color:#42687b}
.pairing-hint+.text-button{margin-bottom:12px}
.planner-notice{display:flex;align-items:center;gap:8px;padding:8px 23px;background:#fff4df;border-top:1px solid #f1dfbd;color:#926629;font-size:11px;flex-shrink:0;line-height:1.5}
.planner-notice svg{flex-shrink:0}.planner-notice .text-button{margin-left:auto;color:#926629}
.slot .hidden-mark{display:none;font:700 10px Arial,sans-serif;fill:#a45434;pointer-events:none}
.slot.planner-hidden .hidden-mark{display:block}.slot.planner-hidden .slot-box{stroke:#c58457;stroke-dasharray:4 2}
.slot.only20 .short-mark{font-size:24px}.slot.reefer.only20 .short-mark{display:none}
@media(max-width:600px){.planner-notice{padding:7px 12px;gap:6px;font-size:10px}}
.empty-vessel{margin:auto;padding:35px 24px;text-align:center;max-width:560px;color:#65828f}.empty-vessel>svg{color:#619780;margin-bottom:24px}.empty-vessel h3{font-size:24px;color:var(--navy);margin-bottom:14px}.empty-vessel p{font-size:14px;margin-bottom:24px}.empty-vessel>div{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.coupling-board{background:#fff;border:1px solid var(--border);border-radius:9px;padding:23px;margin-bottom:26px}.coupling-board-head{margin-bottom:20px}.coupling-board-head p{font-size:12px;color:#738994;margin-top:7px}.coupling-area+.coupling-area{margin-top:21px;padding-top:19px;border-top:1px solid var(--border)}.coupling-area-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.coupling-area-head h4{margin:0;font-size:13px;font-weight:650;color:#34596b}.coupling-area-head .check-line{margin:0;font-size:11px}.coupling-instruction{font-size:11px;color:#718995;margin:8px 0 12px;min-height:18px}.coupling-groups{display:flex;flex-wrap:wrap;gap:10px}.couple-group{display:flex;align-items:center;border:1px solid #dce5e9;border-radius:7px;padding:4px;background:#f7fafb}.couple-group.connected{background:#eef8f3;border-color:#c6e3d4}.couple-node{width:42px;height:37px;border-radius:4px;font:600 14px Consolas,"SFMono-Regular",monospace;color:#446b7e}.couple-node:hover{background:#e2efea}.couple-node.pending{background:var(--navy);color:#fff;box-shadow:0 0 0 2px #91e1be}.couple-link{width:24px;height:28px;display:flex;align-items:center;justify-content:center;color:#7baf96;border-radius:4px}.couple-link svg{width:17px}.couple-link:hover{color:#a34f42;background:#fae7e0}.couple-link span{display:none}
@media(max-width:600px){.coupling-board{padding:17px}.coupling-area-head{align-items:flex-start}.coupling-groups{gap:7px}.couple-node{width:38px}.empty-vessel{padding:30px 16px}}
/* Hatch covers are drawn directly on the bay's deck/hold divider. */
.hatch-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#fff8f1;border-top:1px solid #f0dfd0;border-bottom:1px solid #f0dfd0;padding:10px 23px;flex-shrink:0}
.hatch-tools{display:flex;gap:6px}.hatch-tools .button{font-size:12px;min-height:33px;padding:7px 10px}.hatch-tools .primary{background:#9b5951;border-color:#9b5951}.hatch-instruction{font-size:11px;color:#95766a;flex:1;min-width:160px;line-height:1.5}.hatch-extra{display:flex;align-items:center;gap:16px;margin-left:auto}.hatch-extra .button{font-size:12px;min-height:33px;padding:7px 10px}
.hatch-guide{fill:#fff4e7;stroke:#e3c8ae;stroke-width:1;stroke-dasharray:5 4;pointer-events:none}.hatch-hit{fill:transparent;stroke:#ebd9c8;stroke-width:.6;cursor:crosshair}.hatch-hit.covered{fill:#bd65530b}.hatch-hit:hover{fill:#bd655315}.hatch-hit:focus-visible{outline:none;stroke:#85524a;stroke-width:2}.hatch-editing .hatch-line{stroke-width:4;pointer-events:none}.bay-svg.hatch-editing{cursor:grab}.hatch-editing .slot,.hatch-editing .svg-axis{cursor:grab}
.hatch-boundary{cursor:pointer}.hatch-boundary rect{fill:transparent;stroke:none}.hatch-boundary circle{fill:#fff;stroke:#9b5951;stroke-width:1.5}.hatch-boundary path{stroke:#9b5951;stroke-width:1.5;pointer-events:none}.hatch-boundary.broken circle{fill:#fae2be}.hatch-boundary:hover circle,.hatch-boundary:focus-visible circle{stroke:#394f62;stroke-width:3}.hatch-boundary:focus-visible{outline:none}
@media(max-width:600px){.hatch-toolbar{padding:9px 12px;gap:8px}.hatch-instruction{order:3;flex-basis:100%;font-size:10px}.hatch-tools{gap:4px}.hatch-tools .button{padding:6px 8px;font-size:11px}.hatch-extra{gap:10px}.hatch-extra .button{padding:6px 8px}.hatch-extra .text-button{font-size:11px}}
.hatch-boundary.inactive{opacity:.3;cursor:default}.hatch-boundary.inactive:hover circle{stroke:#9b5951;stroke-width:1.5}
button{touch-action:manipulation}

.hatch-tools .button,.hatch-extra .button,.hatch-extra .text-button{min-height:44px;min-width:44px}

/* Private workspace and saved vessels. */
.login-page{min-height:100dvh;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at 20% 15%,#214758,transparent 65%),#102b38}.login-card{width:min(430px,100%);padding:36px;background:#fff;border:1px solid #e2e9e8;border-radius:14px;box-shadow:0 24px 80px #0003}.login-brand{font-size:25px;font-weight:700;margin:12px 0 26px}.login-card h1{font-size:23px}.login-card p{font-size:14px;color:#6d818a;margin:12px 0 22px}.login-card form{display:grid;gap:15px}.login-card input{min-height:45px}.login-card .button{min-height:45px}.login-foot{font-size:12px;color:#718990;margin-top:24px;padding-top:18px;border-top:1px solid #e4eceb;line-height:1.5}.login-error{color:#a0453c;font-size:13px;line-height:1.5}.login-notice{background:#fff4df;color:#765c32;padding:12px;margin-bottom:15px;font-size:13px;border-radius:5px}.logout-button{width:38px;height:38px}.saved-page{padding:24px}.saved-search{display:flex;align-items:end;gap:15px;margin-bottom:22px}.saved-search .field{flex:1}.saved-search>span{font-size:12px;color:#718990;white-space:nowrap;margin-bottom:12px}.saved-vessel{display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid #dce6e6;border-radius:8px;background:white;padding:20px;margin-bottom:12px}.saved-vessel h3{overflow-wrap:anywhere}.saved-vessel p{font-size:13px;color:#72838d;margin:5px 0}.saved-vessel small{color:#8c9ca4;font-size:11px}.saved-vessel>div:last-child{display:flex;align-items:center;gap:16px}.saved-empty{border:1px dashed #ccdada;padding:30px;border-radius:8px;font-size:14px;line-height:1.7;background:#fff}.saved-pager{display:flex;justify-content:end;gap:8px;margin:18px 0}.saved-backup{border-top:1px solid #dbe5e5;margin-top:30px;padding-top:20px;display:flex;gap:10px;flex-wrap:wrap}.saved-backup p{width:100%;font-size:12px;color:#72838d}
/* Pair comparison and grid controls stay in the designer. */
.twin-paper{display:flex;align-items:center;gap:22px}.bay-frame{background:#ffffff70;border:1px solid #d9e5e9;border-radius:9px;padding:12px}.active-frame{border-color:#86bca9}.bay-frame-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:29px;padding:0 9px}.bay-frame-head span{font-size:11px;color:#508772}.pair-context{font-size:10px;color:#718e99;padding:2px 9px}.inline-grid{background:#fff;border-bottom:1px solid #dce7e9;flex-shrink:0}.inline-grid summary{padding:11px 25px;font-size:12px;font-weight:600;cursor:pointer;color:#426573}.inline-grid-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;padding:0 24px 15px}.grid-targets{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:14px}.grid-targets .field{width:180px;max-width:100%;margin-bottom:0}.inline-grid-body>div{min-width:0}.inline-grid .grid-generator{min-height:32px}.inline-grid-body>div>.field{margin-top:0}.inline-grid .grid-generator{flex-wrap:wrap;margin-bottom:8px;gap:7px;font-size:11px}.inline-grid .grid-generator input[type=number]{width:52px;padding:6px}.inline-grid .button{min-height:30px;padding:6px 9px;font-size:11px}.inline-grid .field>span{font-size:11px}.inline-grid input,.inline-grid select{padding:7px;font-size:12px}.inline-grid-foot{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px}.inline-grid-foot .impact{font-size:11px}.creation-pair-area{margin:16px 0}.creation-pair-area h4{font-size:13px;margin:0 0 10px}.creation-pair-area .check-line{margin-bottom:12px}.creation-pair-area .coupling-groups{margin-top:10px}
@media(max-width:1000px){.topbar{gap:12px;padding:0 16px}.nav-tab{padding:0 8px;gap:5px}.header-actions{gap:6px}.header-actions .button{padding:8px 10px}.header-actions .button span{display:none}.header-actions .button{min-width:38px}}
@media(max-width:600px){.login-card{padding:25px}.header-actions{gap:3px}.header-actions .button,.logout-button{width:34px;min-width:34px;height:38px;padding:7px}.header-actions .button span{display:none}.saved-page{padding:15px}.saved-search{gap:8px;flex-wrap:wrap}.saved-search .field{min-width:160px}.saved-vessel{padding:15px;align-items:start;gap:12px;flex-direction:column}.saved-vessel>div:last-child{align-self:end}.saved-backup .button{font-size:11px}.inline-grid summary{padding:11px 15px}.inline-grid-body{grid-template-columns:1fr;padding:0 15px 12px;gap:10px;max-height:260px;overflow:auto}.inline-grid-foot{grid-column:1}.inline-grid .grid-generator{margin-bottom:6px}.twin-paper{gap:14px}.bay-frame{padding:8px}}

.edit-state{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 22px;background:#fff5e4;border-bottom:1px solid #ead6b6;flex-shrink:0}.edit-state[hidden]{display:none}.edit-state>div{display:flex;align-items:center;gap:10px}.edit-state strong{font-size:12px;color:#8a622c;white-space:nowrap}.edit-state #edit-vessel-name{font-size:11px;color:#987746;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.edit-state .button{font-size:12px;min-height:34px;padding:7px 10px}.couple-swap{display:flex;align-items:center;justify-content:center;width:27px;height:32px;margin-left:4px;color:#547f6b;border-left:1px solid #d1e5d9}.couple-swap span{display:none}
@media(max-width:600px){.edit-state{padding:8px 12px;gap:6px}.edit-state #edit-vessel-name{display:none}.edit-state>div{gap:5px}.edit-state .button{font-size:11px;min-height:38px;padding:7px}.edit-state .button svg{display:none}.edit-state strong{font-size:11px}}

/* Cell states use distinct fills, borders and markers on a neutral surface. */
.canvas-scroll{background-color:#f4f3ef;background-image:none}.bay-frame{background:#fff;border-color:#c2c7c3}.active-frame{border-color:#507960}.partner-frame .bay-svg{opacity:1}.slot-box{fill:#fff;stroke:#737b76;stroke-width:1.4}.slot.empty .slot-box{fill:#fff;fill-opacity:1;stroke:#737b76;stroke-width:1.4;stroke-dasharray:4 3}.empty-cross{stroke:#7c837e;stroke-width:1.3}.slot.valid .slot-box{fill:#76bb89;stroke:#285f39;stroke-width:1.6;stroke-dasharray:none}.slot.reefer .slot-box{fill:#80bfe1;stroke:#22536f}.slot.only20 .slot-box{fill:#e9bc61;stroke:#79540d;stroke-width:1.8}.slot.reefer.only20 .slot-box{fill:#80bfe1;stroke:#79540d;stroke-width:2}.slot .reefer-mark{fill:#183e54}.slot.only20 .short-mark{fill:#493309}.slot.selected .slot-box{stroke:#7222a3;stroke-width:3.2}.slot:hover .slot-box{stroke:#1e3025;stroke-width:2.5}.slot:focus-visible .slot-box{stroke:#7222a3;stroke-width:3.2}.svg-axis{fill:#36413b;font-weight:600}.svg-area-label{fill:#46554b}.key.normal{background:#76bb89;border-color:#285f39}.key.absent{background:#fff;border-color:#737b76}.key.reef{background:#80bfe1;border-color:#22536f}.key.twenty{background:#e9bc61;border-color:#79540d}

.bay-list-item.paired .bay-number{min-width:47px;font-size:12px;white-space:nowrap}.bay-list-item.paired{gap:9px}

/* Vessel selection cards */
.library-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
#saved-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;align-items:stretch}
.saved-vessel{display:flex;flex-direction:column;align-items:stretch;justify-content:start;gap:16px;padding:20px;margin:0;min-width:0;border-radius:12px;box-shadow:0 3px 12px #102b3806}
.saved-vessel:hover{border-color:#8ca9af;box-shadow:0 5px 20px #102b3810}
.vessel-card-icon{height:90px;display:flex;align-items:center;justify-content:center;position:relative;background:#eef4f3;border-radius:8px;color:#355b63}
.vessel-card-icon span{position:absolute;top:8px;right:8px;font-size:11px;background:#fff;padding:3px 7px;border:1px solid #d4dfdf;border-radius:4px;color:#586c74}
.vessel-card-details{text-align:center;flex:1}.saved-vessel h3{font-size:17px;line-height:1.4}.saved-vessel small{display:block;margin-top:9px;color:#627781}
.saved-vessel>div.vessel-card-actions{display:flex;align-items:center;justify-content:center;align-self:stretch;gap:8px;flex-wrap:wrap;border-top:1px solid #e3ebeb;padding-top:14px}
.vessel-card-actions .button{padding:8px 12px}.vessel-card-actions .text-button{font-size:12px}.saved-empty{grid-column:1/-1}.saved-vessel.is-hidden{border-style:dashed}
@media(max-width:600px){#saved-list{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}.saved-vessel{padding:15px}.vessel-card-icon{height:75px}.saved-search>span{margin-bottom:0}}

.saved-vessel{position:relative}.vessel-drag-handle{position:absolute;z-index:1;top:8px;left:8px;width:36px;height:36px;border:1px solid #d2dfdf;border-radius:6px;background:#fff;color:#355b63;font-size:24px;cursor:grab;touch-action:none;user-select:none}.vessel-drag-handle:active{cursor:grabbing}.vessel-drag-handle:focus-visible{outline:3px solid #278b78;outline-offset:2px}.saved-vessel.is-dragging{opacity:.5}.saved-vessel.drop-before{box-shadow:-5px 0 0 #278b78}.saved-vessel.drop-after{box-shadow:5px 0 0 #278b78}@media(max-width:600px){.saved-vessel.drop-before{box-shadow:0 -5px 0 #278b78}.saved-vessel.drop-after{box-shadow:0 5px 0 #278b78}}

.layout-hint{color:#526d78;font-size:13px;margin:20px 0 12px}.planner-paper{background:#fff;border:1px solid #d2dfdf;border-radius:8px;padding:16px;overflow:auto;min-height:200px}.planner-overview{display:block;max-width:none}.fit-horizontal .planner-overview{width:100%;height:auto}.fit-vertical .planner-overview{height:65vh;width:auto}.planner-bay{cursor:pointer}.planner-bay:focus{outline:none}.planner-bay:hover>rect:first-of-type,.planner-bay:focus>rect:first-of-type{fill:#278b7810;stroke:#278b78;stroke-width:2}

.vessel-sheet{padding:20px;display:flex;flex-direction:column;gap:14px}.vessel-sheet>p,#sheet-status{font-size:13px;color:#526d78}.sheet-scroll{overflow:auto;max-height:70vh;border:1px solid #cbdada;border-radius:6px;background:white}.details-table{border-collapse:separate;border-spacing:0;min-width:1500px;width:100%;font-size:13px}.details-table th{position:sticky;top:0;background:#eaf1f1;z-index:2;text-align:left;padding:12px;color:#244752;border-bottom:1px solid #bbcece;white-space:nowrap}.details-table td{border-right:1px solid #d8e2e2;border-bottom:1px solid #d8e2e2;padding:0;min-width:120px}.details-table input{width:100%;min-width:120px;border:0;border-radius:0;background:transparent;padding:12px;font-size:13px}.details-table input:focus{outline:2px solid #278b78;outline-offset:-2px;background:#f4fff9}.details-table th:first-child,.details-table td:first-child{position:sticky;left:0;min-width:190px;background:#f6f9f9;z-index:1}.details-table th:first-child{z-index:3;background:#eaf1f1}.details-table .sheet-row-status{padding:10px;color:#657a83;min-width:220px}.sheet-changed td{background:#fff5df!important}.sheet-changed .sheet-row-status{color:#926127}.app-shell[data-view=details] .workarea{min-width:0}

/* Keep designer controls compact so the bay canvas gets the available height. */
.app-shell[data-view=designer] .workbar{min-height:48px;padding:7px 18px;position:relative;z-index:3;overflow:visible}
.app-shell[data-view=designer] .workbar .breadcrumb{display:none}
.app-shell[data-view=designer] .workbar h2{font-size:19px;white-space:nowrap}
.app-shell[data-view=designer] .workbar-actions{min-width:0}
.designer-controls{display:flex;align-items:center;min-width:0;background:#fff;border-bottom:1px solid var(--border);flex-shrink:0}
.designer-controls .editor-toolbar{flex:1;min-width:0;min-height:44px;padding:5px 12px;border:0;gap:8px}
.designer-controls .tool{padding:7px 8px;min-height:32px}
.designer-controls .board-top{padding:5px 12px;gap:10px;background:#fff}
.app-shell[data-view=designer] .workbar .inline-grid{border:1px solid #dbe4e8;border-radius:6px;position:static;background:white}
.app-shell[data-view=designer] .workbar .inline-grid summary{padding:8px 10px;font-size:11px;white-space:nowrap}
.app-shell[data-view=designer] .workbar .inline-grid[open]{border-color:#83b5a5}
.app-shell[data-view=designer] .workbar .inline-grid-body{position:absolute;right:18px;top:calc(100% + 4px);width:min(640px,calc(100% - 36px));max-height:min(500px,65dvh);overflow:auto;z-index:5;background:white;border:1px solid #cfdddf;border-radius:8px;padding:10px 16px 14px;box-shadow:0 12px 35px #102b3826}
@media(max-width:1400px){.designer-controls .tool>span:not(.twenty-icon){display:none}.designer-controls .tool{min-width:34px;padding:7px}.designer-controls .mirror-control>span{display:none}}
@media(max-width:800px){.designer-controls{flex-wrap:wrap}.designer-controls .editor-toolbar{flex-basis:100%}.designer-controls .board-top{width:100%;padding-top:0;justify-content:space-between}}
@media(max-width:600px){.app-shell[data-view=designer] .workbar{padding:6px 10px;gap:6px;min-height:46px}.app-shell[data-view=designer] .workbar h2{display:none}.app-shell[data-view=designer] .workbar-actions{width:100%;justify-content:space-between;gap:5px}.app-shell[data-view=designer] .workbar .inline-grid summary{font-size:10px;padding:8px}.app-shell[data-view=designer] .workbar .inline-grid-body{position:fixed;top:126px;left:16px;right:16px;width:auto;max-height:65dvh}.designer-controls .editor-toolbar{padding:4px 10px}.designer-controls .board-top{padding:0 10px 4px}.designer-controls .segmented button{font-size:11px;padding:5px 8px}.designer-controls .zoom-tools{gap:1px}}

.only20-assist{padding:12px;background:#eef7f3;border:1px solid #cfe2d8;border-radius:7px;margin-bottom:16px}.only20-assist p{font-size:12px;color:#55786b;margin-bottom:10px}.only20-assist .button{white-space:normal}.pair-check{border:1px solid #e4e9ed;border-radius:6px;background:#fbfcfd}.pair-check .issue-item{border:0;background:transparent}.pair-check-actions{display:flex;flex-wrap:wrap;gap:8px;padding:0 12px 12px}.pair-check-actions .button{font-size:12px;white-space:normal}

.batch-export-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 18px;padding:12px;background:white;border:1px solid #dce6e6;border-radius:8px}.batch-export-bar>span{font-size:12px;color:#55717f}.batch-export-bar .button{margin-left:auto}.vessel-export-select{z-index:2;background:white;border-radius:5px;padding:4px;position:absolute;top:12px;right:12px;display:flex;align-items:center;gap:5px;font-size:11px;color:#55717f;cursor:pointer}

.fleet-numbers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px;margin:28px 8px}.fleet-numbers>div{display:flex;flex-direction:column;gap:5px}.fleet-numbers strong{font-size:25px;color:#f2f7f8;font-weight:550;overflow-wrap:anywhere}.fleet-numbers span{font-size:12px;color:#99b1bc}.fleet-note{font-size:11px;color:#99b1bc;line-height:1.6;margin:0 8px 22px}

.vessel-notes{background:white;border:1px solid var(--border);border-radius:9px;padding:20px 23px;margin-bottom:24px}.notes-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.notes-heading h3 small{color:#718995;font-weight:400}.notes-heading p,.notes-empty{font-size:12px;color:#738994;margin-top:7px}.notes-list{margin-top:16px}.note-row{display:grid;grid-template-columns:85px minmax(0,1fr)auto;align-items:start;gap:15px;padding:12px 0;border-top:1px solid var(--border)}.note-row>strong{font-size:13px;padding-top:8px}.note-row>p{font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere;padding-top:6px}.note-row>div{display:flex;align-items:center;gap:10px}.note-row .button{font-size:12px}@media(max-width:600px){.vessel-notes{padding:15px}.note-row{grid-template-columns:1fr auto;gap:6px 10px}.note-row>p{grid-column:1/-1;grid-row:2}.notes-heading h3{font-size:16px}}