.personaliser{display:grid;align-items:start;gap:2rem;grid-template-columns:minmax(0,1fr) minmax(360px,520px)}
.personaliser>.form-card,.personaliser>.preview-wrap{min-width:0}
.editor-order-summary-disclosure{position:static;margin:1rem 0;border:1px solid rgba(109,40,217,.2);border-radius:1rem;background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.08)}
.editor-order-summary-disclosure>summary{cursor:pointer;padding:.85rem 1rem;font-weight:800;color:#4c1d95}
.editor-order-summary{position:static!important;margin:0;border:0;border-top:1px solid #ece7f8;border-radius:0;box-shadow:none;background:#fff}
.editor-layer-picker{margin:1rem 0;padding:.8rem;border:1px solid #e5e7eb;border-radius:.8rem;background:#fff}
.editor-layer-list{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.55rem}
.editor-layer-list button{border:1px solid #cfd4dc;border-radius:999px;background:#fff;padding:.5rem .7rem;color:#344054}
.editor-layer-list button[aria-pressed="true"]{border-color:#6d28d9;background:#f1ebff;color:#4c1d95;font-weight:800}
.editor-layout-controls{display:grid;grid-template-columns:minmax(150px,max-content) minmax(0,1fr);align-items:center;gap:.65rem 1rem}
.editor-layout-controls label{margin:0}
.editor-layout-controls select,.editor-layout-controls input{width:100%;min-width:0}
.editor-layout-controls output{justify-self:end;min-width:3.5rem;color:#475467;font-variant-numeric:tabular-nums}
.editor-layout-status{min-height:1.5rem;margin:.75rem 0;color:#475467}
.editor-layout-status.is-error{color:#b42318;font-weight:750}
.editor-preview-loading{display:flex;align-items:center;justify-content:space-between;gap:.8rem}
.editor-preview-loading [data-preview-retry]{flex:0 0 auto}
@media (min-width: 1180px){.personaliser{grid-template-columns:minmax(0,1fr) minmax(360px,520px)}.preview-wrap{position:sticky;top:110px}}
@media (max-width: 1179px){.personaliser{grid-template-columns:1fr}.preview-wrap{position:relative;top:auto}.editor-raster-preview{margin-inline:auto}.editor-order-summary-disclosure{position:static}}
@media (max-width: 620px){.editor-layout-controls{grid-template-columns:1fr}.editor-layout-controls output{justify-self:start}.editor-order-summary-disclosure:not([open]){box-shadow:none}.editor-order-summary-disclosure>summary{font-size:.88rem}.editor-preview-loading{align-items:flex-start;flex-direction:column}}
/* 320px physical viewport at 200% browser zoom presents a 160px CSS
   viewport. Keep every control in the document reflow while retaining
   horizontal scrolling only inside the two tab rails. */
@media (max-width: 240px){
    .form-card{padding:.7rem}
    .editor-mobile-steps,.preview-tabs{max-width:100%;overscroll-behavior-inline:contain}
    .field,.field input,.field textarea,.field select,.package-grid,.package-option,.checkline,.editor-layer-picker,.editor-layout-controls{min-width:0;max-width:100%}
    .package-option{width:100%;padding:.6rem;overflow-wrap:anywhere}
    .package-option strong{display:grid;grid-template-columns:minmax(0,1fr);gap:.15rem}
    .package-option small{margin-left:0}
    .checkline,.field small,.editor-audit-notice{overflow-wrap:anywhere}
}
@media (prefers-reduced-motion:reduce){.editor-raster-preview{transition:none}}