/* Tool shell follows Primer Designer. Shared site.css supplies fonts and action tokens.
   Map geometry, sequence rows and swatches keep their functional sizing. */
*{box-sizing:border-box}
textarea{resize:vertical}
input[type=color]{padding:3px;height:37px}
details[open]>summary{margin-bottom:7px}
.paste-panel{margin:8px 0}
.record-heading{flex:1;min-width:180px}
.record-picker{max-width:260px}
.record-actions,.actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.notice ul{padding-left:20px}
.map-feature{cursor:pointer;outline:none}
.map-feature:hover .feature-shape,.map-feature:focus-visible .feature-shape{stroke-width:2}
.map-feature[aria-pressed=true] .feature-shape{stroke-width:3}
.feature-label{font-size:11px;fill:#293e58;font-family:Arial,sans-serif;pointer-events:none}
.linear-label{font-size:12px;paint-order:stroke;stroke:#fff;stroke-width:4;stroke-linejoin:round}
.map-tick{font-size:10px;fill:#5c6e85}
.map-center-title{font:600 17px var(--font-ui);fill:#344962}
.map-center-length{font:13px var(--font-ui);fill:#718299}
.map-caption span{overflow-wrap:anywhere}
.legend-item{display:flex;align-items:center;gap:6px}
.feature-table th:first-child{width:61%}
.feature-table td{padding:0;border-top:1px solid #f0f3f7;vertical-align:middle}
.feature-row-button .feature-dot{display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:7px}
.feature-table tr.selected{background:#edf4ff}
.feature-inspector .small{font-size:11px;margin-bottom:12px}
.feature-inspector details{margin:8px 0}
.sequence-toolbar input{width:105px}
.sequence-toolbar label{margin:0}
.sequence-viewport #sequenceRows{position:absolute;left:0;top:0;width:100%}
.sequence-row{height:28px;white-space:pre;display:flex;align-items:center;padding:0 18px;min-width:max-content}
.sequence-number{display:inline-block;color:#91a0b3;width:76px;flex-shrink:0;font-size:11px;text-align:right;padding-right:18px}
.base{display:inline-block;cursor:text;min-width:8px;text-align:center}
.base.group-end{margin-right:9px}
.base.selected{background:#c7ddff;color:#143d78}
.base.annotated{border-bottom:2px solid var(--base-color);line-height:24px}
.sequence-row:hover{background:#f8faff}
dialog::backdrop{background:#23385455;backdrop-filter:blur(2px)}
.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}
dialog .form-grid{margin-top:12px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
#plasmidMap[data-mode="linear"]{min-height:0;max-height:none}
#plasmidMap{display:block;width:100%;height:auto;min-height:270px;max-height:610px;user-select:none;min-width:640px}
.map-frame:focus-visible{outline:2px solid #315fc3;outline-offset:-2px}
.restriction-controls>summary{font-weight:600}
.check-label input{width:auto}
.restriction-filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(130px,.7fr);gap:10px}
.restriction-table-wrap{max-height:240px;overflow:auto}
.restriction-table th{text-align:left;background:#f4f6fa;position:sticky;top:0;padding:6px;z-index:1}
.restriction-table th:first-child{width:25%}
.restriction-table th:nth-child(2){width:13%}
.restriction-table td{padding:6px;border-bottom:1px solid #e8edf4;overflow-wrap:anywhere;vertical-align:top}
.cut-position.selected{background:#315fc3;color:#fff}
.restriction-help{font-size:11px;color:#647187;margin:8px 0 0}
.incomplete-cut{font-size:10px;display:block;color:#786747}
.restriction-label{fill:#874775;pointer-events:auto;cursor:pointer}
.map-cut{cursor:pointer;outline:none}
.map-cut:hover .cut-mark,.map-cut:focus-visible .cut-mark,.map-cut[aria-pressed=true] .cut-mark{stroke:#315fc3;stroke-width:3}
.restriction-label:focus-visible{outline:1px solid #315fc3}
.feature-colour-heading{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}
.feature-colour-heading label{margin:0}
.feature-colour-heading input[type=color]{width:48px;flex:0 0 48px}
.feature-colour-heading .small{flex:1;min-width:130px;font-size:11px}
.color-swatch[aria-pressed=true]::after{content:"";position:absolute;inset:6px;border:2px solid white;outline:1px solid #17283d;border-radius:2px}
.color-swatch:focus-visible{outline:3px solid #315fc3;outline-offset:2px}
.colour-options input[type=text]{max-width:150px}
.map-feature[aria-pressed=true] .feature-symbol,.map-feature:focus-visible .feature-symbol{stroke-width:6}
.current-colour{width:24px;height:24px;border:1px solid #526174;border-radius:2px}
.feature-palette{display:grid;gap:5px;margin:9px 0 12px;grid-template-columns:repeat(10,minmax(0,1fr))}
.color-swatch{width:100%;padding:0;border:1px solid #526174;box-shadow:inset 0 0 0 2px #ffffff80;position:relative;height:auto;aspect-ratio:1;min-height:26px;border-radius:2px}
.custom-colour-controls{display:flex;align-items:flex-end;gap:14px}
.custom-colour-controls input[type=color]{width:54px}
@media (max-width:440px){.feature-palette{grid-template-columns:repeat(8,minmax(0,1fr))}
}
.bulk-panel>summary{font-weight:600}
.bulk-panel label{margin-top:12px}
.bulk-panel .actions{margin:8px 0}
.bulk-panel .colour-label{margin:14px 0 0}
.feature-select-cell{display:flex;align-items:center;min-width:0}
.feature-select-cell input[type=checkbox]{width:18px;height:18px;flex:0 0 18px;margin:0 0 0 12px;padding:0}
.feature-select-cell .feature-row-button{min-width:0;padding-left:9px}
.recovery-panel{padding:0 16px 12px;margin:0 0 20px;border:1px solid #dce4ee;border-radius:8px;background:#fff}
.recovery-panel .small{max-width:900px}
.recovery-panel select{max-width:650px;margin-bottom:9px}
.recovery-panel .check-label{margin-top:8px}
input[type=checkbox]:focus-visible{outline:3px solid #315fc3;outline-offset:3px}
@media (max-width:440px){.bulk-type{flex-wrap:wrap}
.bulk-type select{flex-basis:100%}
.bulk-panel .actions button{white-space:normal}
.bulk-panel #applyBulk{white-space:normal}
}
.dna-search-form,.range-form,.copy-controls{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.dna-search-form>div{flex:1;min-width:180px}
.dna-search-form input{font-family:var(--font-mono,monospace)}
.range-form>div{flex:1;min-width:100px}
.copy-controls{margin-top:14px}
.copy-controls>div{min-width:200px;flex:1}
.copy-controls button{white-space:normal}
.qualifier-row{border:1px solid #dce4ee;border-radius:6px;padding:10px;margin:10px 0;background:#f8fafc}
.qualifier-row label{margin:0 0 8px}
.qualifier-row input,.qualifier-row textarea{margin-top:4px;min-width:0}
.qualifier-actions{display:flex;justify-content:space-between;align-items:center;gap:8px}
.qualifier-actions input{margin:0}
.advanced-qualifiers{margin-top:12px}
.qualifier-row textarea{resize:vertical;min-height:55px}
#recordSettingsDialog label{margin-top:12px}
#copyFallbackText{font-family:monospace;word-break:break-all}
#exportError:empty{display:none}
.sequence-tools .actions{margin:8px 0}
@media (max-width:440px){.sequence-tools{padding:14px}
.dna-search-form{align-items:stretch}
.dna-search-form>div{flex-basis:100%}
.copy-controls>div{flex-basis:100%}
.copy-controls button{flex:1}
.range-form button{width:100%}
.record-actions{flex-wrap:wrap}
.qualifier-actions{flex-wrap:wrap}
}
.top-actions a{background:#edf0f5;display:inline-flex;align-items:center;justify-content:center;min-height:34px;margin:0;padding:8px 14px;border:0;border-radius:8px;color:#fff;font-size:16px;line-height:18px;text-decoration:none}
.top-actions .faq-nav-btn{margin-left:auto}
.top-actions .home-btn{background:var(--action-neutral)}
.top-actions .help-btn{background:var(--action-primary)}
.top-actions a:focus-visible{outline:3px solid #315fc3;outline-offset:3px}
[data-seo-intro=tool]{margin:0 0 16px;font-size:15px}
.muted{color:#64748b}
.import-panel{justify-content:space-between;align-items:center;gap:22px;display:block;padding:0;border:0;border-radius:0;background:transparent;transition:none}
.import-panel.dragover{border-color:#315fc3;outline:2px dashed var(--action-primary);outline-offset:8px;background:#eef4ff}
.import-panel .small{margin:8px 0}
button{font:inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;margin:0;padding:12px 22px;border:0;border-radius:8px;background:var(--action-primary);color:#fff;font-size:16px;line-height:1.25;min-height:44px;white-space:normal}
button.compact{padding:8px 14px;min-height:36px;font-size:14px}
.neutral{background:var(--action-neutral);color:#fff;border-color:var(--action-neutral)}
.download{background:var(--action-success);color:#fff}
.danger{background:var(--action-danger);color:#fff;border-color:var(--action-danger)}
button:disabled{cursor:default;transform:none!important;box-shadow:none!important;opacity:.5}
label,.colour-label{font-size:16px;font-weight:700;color:#1f2937;margin-bottom:6px}
input[type=file]{display:block;width:100%;background:#fff}
input[type=checkbox]{width:auto;accent-color:var(--action-primary)}
input[type=range]{accent-color:var(--action-primary)}
summary:hover{color:var(--action-primary)}
.paste-panel form{max-width:none;padding:0}
.paste-panel textarea{font-family:Consolas,monospace;min-height:170px}
.paste-panel button{margin-top:14px}
#status.error,.error{color:#a13037}
.error{white-space:normal;margin:6px 0;font-size:14px}
.record-actions{gap:8px}
.record-actions button{padding:10px 14px;font-size:16px}
.notice{border:1px solid #eddfba;padding:0 14px;margin-bottom:18px;border-radius:8px;background:#fffbeb}
.notice li{margin-bottom:6px;font-size:14px}
.work-grid>*{min-width:0}
.segmented{display:flex;border:1px solid #d8e1ed;overflow:hidden;border-radius:8px;border-color:#cbd5e1}
.segmented button{background:#fff;border-radius:0;font-size:14px;min-height:34px;padding:6px 12px;color:#374151}
.segmented button[aria-pressed=true]{background:var(--action-primary);color:#fff}
.map-controls output{min-width:38px;text-align:center;font-size:14px;color:#4b5563}
.rotation-control input{height:20px;width:90px;padding:0}
.legend-swatch{border-radius:2px;border:1px solid #45566c;width:10px;height:10px}
.count{font-weight:400;margin-left:6px;font-size:14px;color:#64748b}
.feature-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:14px}
.feature-table th{text-align:left;position:sticky;top:0;font-weight:600;z-index:1;font-size:14px;color:#374151;background:#f1f5f9;padding:10px 14px}
.feature-row-button{display:block;white-space:normal;text-align:left;background:transparent;width:100%;border-radius:0;font-weight:500!important;min-height:48px;box-shadow:none!important;transform:none!important;font-size:16px;color:#1f2937;padding:10px 14px}
.feature-row-button .type{display:block;margin-top:2px;font-size:13px;color:#64748b}
.feature-position{padding:8px 13px!important;overflow-wrap:anywhere;font-size:13px;color:#475569}
.feature-inspector .small,.feature-colour-heading .small{font-size:14px}
.feature-inspector details textarea{font-family:Consolas,monospace;font-size:14px}
.feature-inspector select{padding-left:7px;padding-right:5px;padding:10px}
.bulk-panel,.qualifier-row{border-radius:8px;background:#f8fafc}
.bulk-type{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bulk-type select{flex:1;min-width:140px}
.restriction-help,.incomplete-cut{font-size:13px;color:#4b5563}
.restriction-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:14px}
.cut-position{background:#f8eff6;color:#71395f;border:1px solid #dfcadd;min-height:26px;padding:2px 6px;margin:2px;font-size:13px;white-space:normal}
.sequence-toolbar .small{margin-left:auto;font-size:14px}
.review-note{padding:8px 10px;border:1px solid #e5cf91;background:#fff8e5;font-size:14px;border-radius:8px}
dialog .dialog-heading h2{font-size:24px}
footer{text-align:center;padding:30px;border-top:1px solid #e5e7eb;background:#fff;margin-top:40px;font-size:14px}
footer a{color:#315fc3;text-decoration:none}
@media (max-width:1100px){.work-grid{grid-template-columns:minmax(0,1fr)}
.feature-table-wrap{max-height:360px}
}
@media (max-width:800px){body{padding:15px}
.editor-shell{padding:18px}
.record-bar{align-items:flex-start}
.record-actions{width:100%}
.top-actions .faq-nav-btn{margin-left:auto}
}
@media (max-width:440px){body{padding:10px}
.editor-shell{padding:12px}
h1{font-size:28px}
.record-actions button{font-size:14px;padding:8px 12px}
.rotation-control{width:100%;margin:4px 0 0}
.restriction-filters,.form-grid{grid-template-columns:minmax(0,1fr)}
.custom-colour-controls{flex-wrap:wrap}
.feature-table th:first-child{width:58%}
.feature-table th{padding:8px}
.feature-position{padding:8px!important}
.panel-heading{gap:10px}
.top-actions a{font-size:13px}
.restriction-table th,.restriction-table td{padding:4px}
}
body{margin:0;padding:30px;background:#f8fafc;color:#1f2937;font-size:16px;line-height:normal}
.editor-shell{max-width:1150px;margin:auto;padding:28px}
.top-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:18px}
h1{color:#1f2937;margin:0 0 .67em;font-size:30px;font-weight:700;line-height:normal}
h2,h3,h4{margin:0;line-height:normal;font-family:var(--font-ui)}
h2{font-weight:700;color:#1f2937;font-size:24px;margin:28px 0 16px}
h3{font-weight:700;color:#1f2937;font-size:18px;margin:0 0 8px}
h4{color:#1f2937;font-size:16px;margin:0}
.small{font-size:14px;line-height:1.5;margin:6px 0;color:#4b5563}
label{font-size:16px;font-weight:700;display:block;margin-top:16px;margin-bottom:6px;color:#1f2937}
.colour-label{font-size:16px;font-weight:700;color:#1f2937}
.import-panel label{margin-top:16px}
input,select,textarea{border:1px solid #cbd5e1;border-radius:8px;padding:10px;font-family:var(--font-ui);font-size:16px;width:100%;max-width:100%;min-width:0;color:#1f2937;line-height:normal}
.paste-panel,.recovery-panel{margin:16px 0;padding:0;border:0;border-radius:0;background:transparent}
.paste-panel[open],.recovery-panel[open]{padding-bottom:8px}
summary{font-size:16px;font-weight:700;color:#1f2937;cursor:pointer;list-style-position:outside}
details>summary{padding:8px 0}
#status{color:#4b5563;margin:12px 0;min-height:0;font-size:14px}
#status:empty{display:none}
#emptyState{margin:16px 0 0}
.record-bar{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin:28px 0 18px}
.record-heading h2{margin:0 0 6px;font-size:24px;overflow-wrap:anywhere}
.record-picker label{margin-top:0}
.work-grid{display:grid;grid-template-columns:minmax(640px,1.5fr) minmax(0,1fr);gap:24px;align-items:start}
.panel{background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}
.panel-heading{border-bottom:1px solid #e8edf4;border-color:#dbe3ef;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:0 0 12px;background:transparent;border:0}
.panel-heading h3{margin:0}
.map-controls{border-bottom:1px solid #eff2f7;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:0 0 12px;border:0}
.rotation-control{display:flex;align-items:center;gap:8px;margin:0 0 0 auto;font-weight:400;font-size:14px}
.map-frame{overflow:hidden;position:relative;border:1px solid #dbe4f0;border-radius:8px;background:#fff;overflow-x:auto;overscroll-behavior-x:contain;touch-action:pan-x pan-y}
.map-caption{border-top:1px solid #e8edf4;display:flex;justify-content:space-between;gap:12px;min-height:0;padding:10px 0;border:0;background:transparent;font-size:14px;color:#374151}
.feature-legend{display:flex;flex-wrap:wrap;gap:8px 14px;padding:8px 0;font-size:13px;color:#4b5563}
.map-scroll-hint{border-bottom:1px solid #e8edf4;margin:0;padding:6px 0;font-size:14px;background:transparent;color:#4b5563;border:0}
.restriction-controls{border-bottom:1px solid #e8edf4;padding:0;margin:0 0 12px;border:0}
#featureSearch{margin:0 0 12px;width:100%;background:#fff}
.feature-table-wrap{max-height:360px;overflow:auto;scrollbar-gutter:stable;border:1px solid #dbe4f0;border-radius:8px;background:#fff}
.feature-inspector{padding:16px 0 0;margin-top:16px;border-top:1px solid #dbe4f0;background:transparent}
.feature-inspector label{margin-top:12px}
.inspector-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.bulk-panel{margin:0 0 12px;padding:0;border:0;border-radius:0;background:transparent}
.bulk-panel[open]{padding-bottom:12px}
.check-label{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:400;margin:8px 0 12px}
.feature-colour-heading .colour-label{margin:0}
.sequence-tools{padding:0;margin-top:28px}
.sequence-tools h3{margin-bottom:12px}
.sequence-panel{margin-top:28px}
.sequence-panel>p{margin:8px 0}
.sequence-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:9px;border-bottom:1px solid #edf0f6;padding:12px 0;border:0}
.sequence-viewport{position:relative;height:290px;overflow:auto;font:13px/28px Consolas,"Courier New",monospace;outline-offset:-3px;border:1px solid #dbe4f0;border-radius:8px;background:#fff}
.range-selection{border-top:1px solid #e8edf4;margin-top:12px;padding-top:0;border:0}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.colour-actions{margin:12px 0}
.colour-options .actions{align-items:stretch}
.qualifier-actions .check-label{margin:0;font-size:14px}
.error:empty{display:none}
dialog{border:1px solid #cbd5e1;border-radius:8px;width:min(520px,calc(100vw - 32px));padding:24px;color:#1f2937;background:#fff;box-shadow:0 4px 18px #00000014}
.dialog-heading h2{margin:0;font-size:24px}
dialog p{margin:14px 0;line-height:1.5}
@media (max-width:1100px){.work-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:800px){body{padding:12px}
.editor-shell{padding:28px}
.record-bar{align-items:flex-start}
.record-actions{width:100%}
.top-actions .faq-nav-btn{margin-left:0}
}
@media (max-width:440px){body{padding:12px}
.editor-shell{padding:28px}
h1{font-size:30px}
.sequence-tools{padding:0}
.record-actions button{font-size:16px;padding:10px 14px}
.rotation-control{width:100%;margin:4px 0 0}
.restriction-filters,.form-grid{grid-template-columns:minmax(0,1fr)}
.map-caption{flex-direction:column;gap:3px}
.sequence-toolbar .small{width:100%;margin:0}
.sequence-row{padding:0 8px}
.sequence-number{width:59px;padding-right:10px}
}

/* Map detail and editor-owned context actions; the page shell is unchanged. */
#plasmidMap{min-width:720px;text-rendering:optimizeLegibility;shape-rendering:geometricPrecision}
.work-grid{grid-template-columns:minmax(720px,1.5fr) minmax(0,1fr)}
.feature-label{font:600 13px Arial,sans-serif;fill:#1f2937}
.linear-label{font-size:13px}
.feature-label[data-feature-id]{pointer-events:auto;cursor:pointer}
.feature-label[data-feature-id]:focus-visible{outline:2px solid var(--action-primary)}
.map-tick{font:12px Arial,sans-serif;fill:#475569}
.map-center-title{font:600 19px Arial,sans-serif;fill:#1f2937}
.map-center-length{font:14px Arial,sans-serif;fill:#475569}
.restriction-label{fill:#803664}
/* User-requested desktop-menu appearance; scoped apart from page action colours. */
.feature-context-menu{position:fixed;z-index:1000;width:250px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);overflow:auto;display:grid;gap:0;padding:4px;border:1px solid #4a4a4a;border-radius:6px;background:#2b2b2b;color:#f1f1f1;color-scheme:dark;box-shadow:0 6px 20px #0005}
.context-target{margin:0 4px 4px;padding:5px 6px 8px;border-bottom:1px solid #484848;color:#bdbdbd;font-size:12px;font-weight:400;line-height:1.35;overflow-wrap:anywhere}
#featureContextMenu button{width:100%;justify-content:flex-start;text-align:left;padding:6px 10px;min-height:30px;border:0;border-radius:3px;background:transparent;color:#f1f1f1;font-size:13px;font-weight:400!important;line-height:1.35;box-shadow:none;transform:none;transition:none;outline:0;opacity:1}
#featureContextMenu button:enabled:hover,#featureContextMenu button:focus-visible{background:#414141;box-shadow:none;transform:none}
#featureContextMenu button:focus-visible{outline:1px solid #a6a6a6;outline-offset:-1px;border-radius:3px}
#featureContextMenu button:disabled{color:#929292;background:transparent;opacity:1}
@media(pointer:coarse){#featureContextMenu button{min-height:44px}}
#renameFeatureForm>.actions{margin-top:20px}
@media(max-width:1100px){.work-grid{grid-template-columns:minmax(0,1fr)}}

#editReviewDialog{max-height:calc(100vh - 32px);overflow:auto}
#editReviewSummary,.edit-impact-list li{overflow-wrap:anywhere}
#editReviewDialog h3{margin:20px 0 8px;font-size:17px}
.edit-impact-list{padding-left:22px;max-height:180px;overflow:auto;line-height:1.5}
.edit-impact-list li+li{margin-top:7px}
#editReviewDialog .actions{margin-top:20px}