:root{color-scheme:light;font-family:Avenir Next,Segoe UI Variable Text,Trebuchet MS,sans-serif;--accent-950: #0f0419;--accent-900: #180826;--accent-800: #2c1047;--accent-700: #4a1b74;--accent-600: #63239a;--accent-500: #8430bf;--accent-400: #b35bdd;--accent-100: #f5edfc;--line: #e9e0f3;--line-strong: #d9c8ea;--text: #1d1724;--muted: #706779;--surface: #ffffff;color:var(--text);background:var(--surface)}*{box-sizing:border-box}html{min-height:100%}body{margin:0;min-width:320px;min-height:100vh;background:var(--surface)}#root{min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.6}.app-shell{min-height:100vh;background:var(--surface)}.portal-header{position:sticky;top:0;z-index:30;background:linear-gradient(180deg,#1a0a28,#120619);color:#faf7ff;box-shadow:0 10px 28px #0f041933}.portal-header-inner{max-width:1380px;margin:0 auto;min-height:82px;padding:0 2rem;display:flex;align-items:center;justify-content:space-between;gap:2rem}.brand-lockup{display:flex;align-items:center;gap:1rem}.brand-mark{display:flex;gap:.35rem;margin:0}.brand-mark span{width:.38rem;height:.38rem;border-radius:999px;background:var(--accent-400);box-shadow:0 0 0 1px #4a1b7433}.brand-mark span:nth-child(2){background:#9343ce}.brand-mark span:nth-child(3){background:#7830b8}.brand-mark span:nth-child(4){background:#5f239d}.brand-mark span:nth-child(5){background:#4a1b74}.brand-overline,.page-eyebrow,.card-kicker,.cta-label,.section-lead,.muted{color:var(--muted)}.brand-overline{margin:0 0 .2rem;color:#faf7ffb8;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase}.brand-title{margin:0;color:#faf7ff;font-size:1.35rem;font-weight:700;letter-spacing:.04em}.portal-nav{display:flex;align-items:stretch;gap:.5rem}.nav-item{position:relative;display:flex;align-items:stretch}.nav-button{min-width:96px;border:none;border-bottom:2px solid transparent;background:transparent;color:#faf7ffe6;padding:1.8rem .75rem 1.35rem;font-size:.82rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;transition:color .14s ease,border-color .14s ease}.nav-button:hover,.nav-button:focus-visible{color:#fff;outline:none}.nav-button[aria-current=page]{color:#fff;border-bottom-color:var(--accent-400)}.nav-button--trigger:after{content:"▾";margin-left:.45rem;font-size:.72rem}.nav-menu{position:absolute;top:calc(100% + .2rem);left:0;min-width:134px;padding:.22rem .2rem;border:none;border-radius:0;background:#fff;box-shadow:0 14px 28px #11071b1f;overflow:hidden}.menu-item{width:100%;border:none;background:transparent;color:var(--accent-800);padding:.62rem .92rem .62rem 1.1rem;text-align:left;font-weight:600;font-size:.85rem}.menu-item:hover,.menu-item:focus-visible{background:var(--accent-100);outline:none}.portal-body{padding:2.25rem 1.5rem 4rem}.page-canvas{max-width:1280px;margin:0 auto;display:grid;gap:2rem}.portal-surface{background:transparent;border:none;border-radius:0;box-shadow:none}.design-page,.janus-hero{padding:0 0 2.25rem}.design-header{gap:1.5rem}.design-header-actions{display:flex;flex-direction:column;align-items:flex-end;gap:.8rem;padding-top:.4rem}.design-controls,.design-summary,.design-results-panel{border-top:1px solid var(--line)}.design-controls{display:grid;grid-template-columns:minmax(260px,1fr) minmax(220px,320px);gap:1rem;margin-top:2rem;padding-top:1.85rem}.design-error{margin:1rem 0 0;color:#9b2226;font-weight:600}.design-summary{display:grid;gap:.5rem;padding-top:1.4rem;margin-top:1.4rem}.design-summary-line{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:.9rem}.design-summary-count{margin:0;color:var(--accent-700);font-size:1.6rem;font-weight:700}.design-summary-pattern{color:#000;font-size:1.1rem;font-weight:700}.design-map-layout{display:grid;grid-template-columns:minmax(320px,1.2fr) minmax(280px,1fr);gap:2rem;align-items:start;padding-top:1.6rem}.design-map-panel{min-width:0}.design-results-panel{padding-top:1rem}.design-results-panel h3{margin:0 0 1rem}.genome-map{width:100%;height:auto;max-width:520px;display:block}.genome-map-ring-shadow{fill:none;stroke:#8430bf14;stroke-width:30}.genome-map-ring{fill:none;stroke:var(--accent-700);stroke-width:18}.genome-map-ring-inner{fill:#fff;stroke:#f1e8fa;stroke-width:1}.genome-map-tick{stroke:var(--line-strong);stroke-width:2;stroke-linecap:round}.genome-site-line{stroke:var(--accent-400);stroke-width:3;stroke-linecap:round}.genome-site-dot{fill:var(--accent-500)}.genome-site-label{fill:var(--accent-800);font-size:10px;font-weight:600;paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.genome-map-center-name{fill:var(--accent-800);font-size:14px;font-weight:700}.genome-map-center-name--medium{font-size:13px}.genome-map-center-name--small{font-size:11.5px}.genome-map-center-length{fill:#5e4d74;font-size:11px;font-weight:600}.genome-map-center-enzyme{fill:#5e4d74;font-size:12px;font-weight:600}.genome-map-center-count{fill:var(--accent-600);font-size:12px;font-weight:700}.page-header,.content-grid,.inline-grid,.two-column-grid,.mapping-preview-grid,.coming-soon-grid,.page-stat-grid{display:grid;gap:1rem}.page-header{grid-template-columns:minmax(280px,1.8fr) minmax(280px,1fr);align-items:start;gap:2rem}.page-eyebrow{margin:0 0 .5rem;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-600)}.page-copy{max-width:68ch;margin:0;color:#4f4558;line-height:1.7}.cta-panel,.coming-soon-card,.stat-card{background:transparent;border:none;border-top:2px solid var(--line-strong);padding:1rem 0 0}.cta-panel{display:grid;gap:.85rem;border-top-color:var(--accent-400)}.cta-label{margin:0}.primary-cta,.button-row button{border-radius:10px;padding:.78rem 1.08rem;font-weight:700;transition:background .14s ease,color .14s ease,border-color .14s ease}.primary-cta{justify-self:start;border:1px solid var(--accent-700);background:var(--accent-700);color:#fff}.primary-cta:hover,.button-row button:hover{background:var(--accent-600);border-color:var(--accent-600)}.button-row,.toolbar-actions{display:flex;gap:.75rem;flex-wrap:wrap}.button-row button{border:1px solid var(--accent-700);background:var(--accent-700);color:#fff}.button-row .secondary{background:#fff;color:var(--accent-700);border-color:var(--accent-700)}.button-row .secondary:hover{background:var(--accent-100)}.button-row .ghost{background:#fff;color:#4f4558;border-color:var(--line-strong)}.button-row .ghost:hover{background:#faf8fd;border-color:var(--accent-400)}.button-row .clear-btn{background:#fff;color:#dc3545;border-color:#dc3545}.button-row .clear-btn:hover{background:#dc3545;color:#fff;border-color:#dc3545}.coming-soon-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:2rem;gap:1.5rem}.coming-soon-card{min-height:0;display:grid;align-content:start;gap:.7rem}.coming-soon-card h3,.section-card h2,.helper-box h3,.plate-box h3,.premix-box h3,.editor-box h3{margin:0}.coming-soon-card p:last-child{margin:0;color:#52495c;line-height:1.7}.card-kicker{margin:0;font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-600)}.janus-hero{display:grid;gap:1.5rem;border-bottom:1px solid var(--line)}.page-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}.stat-card{display:grid;gap:.85rem}.stat-card span{color:var(--muted);font-size:.83rem;letter-spacing:.08em;text-transform:uppercase}.stat-card strong{font-size:2rem;font-weight:700;color:var(--accent-800)}.toolbar-card{display:grid;gap:1rem;padding-top:1rem;border-top:1px solid var(--line)}.section-stack{display:grid;gap:2.25rem}.section-card{padding:2rem 0 0;border-top:1px solid var(--line);background:transparent;border-radius:0}.section-card:first-child{border-top:none;padding-top:0}.content-grid{padding:1.25rem 0 0}.inline-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.two-column-grid{grid-template-columns:minmax(280px,1fr) auto}.plate-grid-wrap{display:grid;gap:1rem;grid-template-columns:minmax(340px,1fr) minmax(224px,288px);align-items:start}.editor-box .drag-chip{padding:.41rem .72rem;font-size:.8rem}.helper-box,.premix-box,.subitem-box,.editor-box{background:transparent;border:1px solid var(--line);border-left:2px solid var(--accent-400);border-radius:0;padding:1rem}.plate-box{background:transparent;border:1px solid var(--line);border-left:2px solid var(--accent-400);border-radius:8px;padding:1rem}.table-wrap{overflow-x:auto;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}table{width:100%;border-collapse:collapse;background:#fff}th,td{text-align:left;padding:.78rem;border-bottom:1px solid var(--line);vertical-align:middle}th{background:#faf7fd;color:#5e4d74;font-size:.84rem;letter-spacing:.04em;text-transform:uppercase}tr:last-child td{border-bottom:none}label{display:grid;gap:.45rem;font-weight:600;color:#2a2133}input:not([type=file]),select,textarea{width:100%;border:1px solid var(--line-strong);border-radius:10px;padding:.74rem .9rem;background:#fff;color:var(--text)}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:.74rem 3.15rem .74rem 1.2rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M2 2L7 7L12 2' stroke='%231D1724' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1.45rem center}.design-upload-zone{position:relative;display:flex;align-items:center;justify-content:center;min-height:80px;padding:1.15rem 1.2rem;border:2px dashed var(--line-strong);border-radius:12px;background:#fff;cursor:pointer;transition:all .2s ease}.design-upload-zone.is-drag-active{border-color:var(--accent-500);background:#fcf9ff;border-style:solid}.design-upload-placeholder{display:flex;align-items:center;gap:.6rem;color:var(--muted);font-size:.95rem}.design-upload-icon{width:22px;height:22px;flex-shrink:0;color:var(--accent-500)}.design-upload-file{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;color:var(--accent-700);font-size:.95rem;font-weight:600;background:var(--accent-100);padding:.6rem 1.2rem;border-radius:10px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.design-upload-file .design-upload-icon{color:var(--accent-600);width:18px;height:18px;flex-shrink:0}.design-upload-zone>span:first-child,.design-select-field>span{font-weight:600;color:#2a2133}.design-file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.design-select-field{align-content:start;gap:.7rem}input:focus,select:focus,textarea:focus,button:focus-visible{outline:2px solid rgba(132,48,191,.3);outline-offset:2px}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;background:transparent;color:var(--muted);cursor:pointer;border-radius:4px;transition:color .14s ease,background .14s ease}.icon-button.icon-remove:hover:not(:disabled){color:#c41e3a;background:#fef2f2}.icon-button.icon-add:hover:not(:disabled){color:var(--accent-600);background:var(--accent-100)}.icon-button:disabled{opacity:.3;cursor:not-allowed}.icon-button svg{width:18px;height:18px}.table-inline-input{width:100%;border:none;background:#fff;padding:.4rem .5rem;border-radius:4px;color:var(--text)}.table-inline-input:focus{outline:none;background:#fff;box-shadow:none}.table-inline-input::placeholder{color:var(--muted)}.table-inline-value{display:block;padding:.4rem 0;color:var(--text)}.protocol-box{margin-top:1.5rem;border:2px solid var(--accent-400);border-radius:8px;padding:1rem}.protocol-box h3{margin-top:0;margin-bottom:.75rem}.transfer-settings-row{display:flex;gap:1rem;align-items:flex-end;flex-wrap:wrap}.transfer-settings-label{display:flex;flex-direction:column;gap:.4rem;font-weight:600;color:#2a2133}.transfer-settings-input{width:160px;height:38px;border:1px solid var(--line-strong);border-radius:8px;padding:.5rem .75rem;background:#fff;color:var(--text);font-size:.9rem}.toggle-switch{position:relative;display:inline-block;width:38px;height:22px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#d1d5db;transition:.3s;border-radius:22px}.toggle-slider:before{position:absolute;content:"";height:16px;width:16px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%;box-shadow:0 1px 3px #0003}.toggle-switch input:checked+.toggle-slider{background-color:var(--accent-500)}.toggle-switch input:focus-visible+.toggle-slider{outline:2px solid rgba(132,48,191,.3);outline-offset:2px}.toggle-switch input:checked+.toggle-slider:before{transform:translate(16px)}input:disabled{background-color:#e2e8f0;cursor:not-allowed}.color-circle-input{width:40px;height:24px;padding:2px;border:1px solid var(--line-strong);border-radius:12px;cursor:pointer;background:#fff;display:flex;align-items:center;justify-content:center}.color-circle-input::-webkit-color-swatch-wrapper{padding:0;margin:0;display:flex;align-items:center;justify-content:center}.color-circle-input::-webkit-color-swatch{border:none;border-radius:6px;width:32px;height:16px;margin:0 auto}.color-circle-input::-moz-color-swatch{border:none;border-radius:6px;width:32px;height:16px;margin:0 auto}.subitems-cell{display:flex;flex-direction:column;align-items:flex-start;gap:.4rem}.subitems-header{display:flex;align-items:flex-start;gap:.5rem;flex-shrink:0;width:100%}.subitems-header .chip-row{display:flex;flex-wrap:wrap;gap:.3rem;flex:1}.subitems-header .chip{font-size:.85rem;padding:.3rem .6rem}.subitems-header .chip button{font-size:.85rem;padding:0 .3rem}.toggle-button{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;background:transparent;color:var(--muted);cursor:pointer;flex-shrink:0;margin-top:.1rem}.toggle-button:hover{color:var(--accent-600)}.toggle-button svg{width:16px;height:16px}.subitems-expanded{display:flex;align-items:center;gap:.5rem;padding:.2rem 0 .5rem 32px;flex-wrap:wrap;width:100%}.subitems-row{display:flex;align-items:flex-end;gap:.5rem;flex-wrap:wrap}.subitems-row input[type=text]{width:90px;height:28px;padding:.3rem .4rem;border:1px solid var(--line-strong);border-radius:4px;font-size:.8rem}.subitems-row input.subitem-name-input{width:80px;background:#fff}.subitems-expanded .chip-row .chip{font-size:.85rem;padding:.3rem .6rem}.subitems-expanded .chip-row .chip button{font-size:.85rem;padding:0 .3rem}.subitems-row input[type=text]:focus{outline:2px solid rgba(132,48,191,.3);outline-offset:1px}.subitems-row input[type=number]{width:50px;height:28px;padding:.3rem .4rem;border:1px solid var(--line-strong);border-radius:4px;font-size:.8rem}.subitems-row .btn-like{padding:.3rem .5rem;height:28px;display:flex;align-items:center;font-size:.8rem;border:1px solid var(--accent-600);border-radius:4px;background:var(--accent-500);color:#fff;cursor:pointer;transition:all .14s ease;white-space:nowrap;margin-right:.6rem}.subitems-row .btn-like:hover{background:var(--accent-600);color:#fff}.subitems-row .btn-generate{padding:.3rem .5rem;height:28px;display:flex;align-items:center;font-size:.8rem;border:1px solid var(--accent-500);border-radius:4px;background:#fff;color:var(--accent-700);cursor:pointer;transition:all .14s ease;white-space:nowrap}.subitems-row .btn-generate:hover{background:var(--accent-500);color:#fff}.subitems-row label{display:flex;flex-direction:column;gap:.15rem;font-size:.75rem}.subitems-row label span{color:var(--muted)}.pattern-row .secondary{padding:.4rem .8rem;font-size:.85rem}.control-stack,.palette,.palette-group,.well-chip-row{display:grid;gap:.75rem}.chip-row,.well-chip-row{display:flex;flex-wrap:wrap;gap:.45rem}.chip,.drag-chip{display:inline-flex;align-items:center;gap:.4rem;border-radius:999px}.chip{padding:.38rem .78rem;color:#fff}.chip button{border:none;background:transparent;color:inherit;padding:0}.drag-chip{border:none;padding:.52rem .9rem;color:#fff;font-weight:600}.plate-grid{display:grid;gap:.35rem}.plate-grid[data-labware=plate-96]{grid-template-columns:repeat(12,minmax(52px,1fr))}.plate-grid[data-labware=plate-384]{grid-template-columns:repeat(24,minmax(20px,1fr));gap:.15rem}.plate-grid[data-labware=plate-384] .well-button{min-height:26px;padding:.1rem;border-radius:3px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.plate-grid[data-labware=plate-384] .well-button strong{font-size:.55rem;line-height:1}.plate-grid[data-labware=plate-384] .well-button small{display:none}.plate-grid[data-labware=plate-384] .well-button .dot-container{gap:2px!important;margin-top:-1px!important;justify-content:center}input.protocol-name-input{font-weight:600!important;border:none!important;background:transparent!important;width:90px!important;height:24px!important;text-align:center!important;padding:0!important;outline:none!important;transition:outline .2s ease!important}input.protocol-name-input:focus{outline:1px solid #d1d5db!important;border-radius:2px!important}.plate-grid[data-labware=rack-4x6]{grid-template-columns:repeat(6,minmax(58px,1fr))}.well-button{min-height:74px;border-radius:10px;border:1px solid var(--line-strong);background:#fff;padding:.45rem;text-align:left;display:grid;gap:.3rem;color:var(--text)}.well-button strong{font-size:.86rem}.well-button small{color:#5f5668}.well-button.selected{border-color:var(--accent-500);box-shadow:inset 0 0 0 2px var(--accent-500)}.well-button.filled{color:#fff}.well-button.filled small{color:#ffffffeb}.error-list{margin:0;padding-left:1rem;color:#9b2226}.mapping-preview-grid{display:grid;gap:1rem}.code-preview{margin:0;background:#120619;color:#f4effa;padding:1rem;overflow:auto;max-height:280px;font-family:Cascadia Code,Consolas,monospace;font-size:.9rem;line-height:1.55}@media(max-width:1040px){.page-header,.plate-grid-wrap,.design-map-layout,.design-controls,.page-stat-grid,.coming-soon-grid{grid-template-columns:1fr}}@media(max-width:720px){.portal-header-inner{min-height:unset;padding:1rem;flex-direction:column;align-items:flex-start}.portal-nav{width:100%;justify-content:flex-start}.nav-button{padding-top:1rem}.portal-body{padding:1rem .75rem 2.5rem}.design-page,.janus-hero,.section-card,.helper-box,.plate-box,.premix-box,.subitem-box,.editor-box,.toolbar-card{padding-left:0;padding-right:0}.two-column-grid,.plate-grid-wrap,.design-controls,.design-map-layout{grid-template-columns:1fr}.plate-grid[data-labware=plate-96]{grid-template-columns:repeat(6,minmax(52px,1fr))}.plate-grid[data-labware=plate-384]{grid-template-columns:repeat(12,minmax(20px,1fr))}}