.app{min-height:100vh;width:100%;max-width:100%;display:flex;flex-direction:column;overflow-x:hidden;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.app-header{text-align:center;padding:2rem;background:rgba(0,0,0,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.app-header h1{margin:0 0 .5rem;font-size:2.5rem;font-weight:700}.app-header p{margin:0;opacity:.8;font-size:1.1rem}.app-main{flex:1;width:100%;max-width:100%;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:2rem;gap:1rem;overflow-x:hidden}.workspace-nav{display:flex;justify-content:center;gap:.75rem}.generator-drawer-toggle-row{display:flex;justify-content:center;gap:.75rem;margin-bottom:0}.workspace-link{text-decoration:none;border:1px solid rgba(255,255,255,.4);border-radius:999px;background:rgba(255,255,255,.15);color:#fff;font-weight:600;padding:.5rem 1rem;min-height:44px;cursor:pointer;transition:background-color .15s ease}.workspace-link-active{background:#ffffff;color:#2a2e55}.workspace-layout{width:100%;max-width:100%;display:grid;grid-template-columns:minmax(320px,1fr) minmax(320px,1fr);gap:1rem;align-items:start}.workspace-layout>*{min-width:0}.workspace-layout-single-column{grid-template-columns:minmax(320px,1fr)}.workspace-layout-generator{--drawer-shell-height: clamp(20rem, 46vh, 30rem);grid-template-columns:minmax(0,1fr);gap:1.25rem}.workspace-layout-generator .overlay-workspace{order:1}.workspace-layout-generator .generator-controls-panel{order:2}.workspace-layout-generator .generator-results-panel{order:3}.workspace-layout-generator.workspace-layout-has-patterns .generator-results-panel{order:2}.workspace-layout-generator.workspace-layout-has-patterns .generator-controls-panel{order:3}.generator-controls-panel,.generator-results-panel{width:100%;min-width:0;background:rgba(255,255,255,.12);border-radius:12px;padding:1rem}.generator-controls-panel{display:flex;flex-direction:column;gap:.75rem;min-height:var(--drawer-shell-height)}.generator-drawer-content{border-top:1px solid rgba(255,255,255,.2);padding-top:.75rem;max-height:calc(var(--drawer-shell-height) - 3.5rem);overflow-y:auto;overflow-x:hidden;padding-right:.25rem;scrollbar-gutter:stable;scroll-padding-top:.75rem}.generator-drawer-content>*{min-width:0}.generator-results-panel{min-height:clamp(18rem,34vh,26rem)}.generator-results-panel h2,.pattern-generator h2{margin:0 0 .75rem}.pattern-form{display:flex;flex-direction:column;gap:1rem}.form-actions{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.form-actions-top{padding:.55rem .65rem;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:rgba(11,16,35,.16)}.form-layout-columns{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:.75rem;align-items:start}.form-layout-columns>*,.form-sections-grid>*,.form-section>*{min-width:0}.pattern-display,.patterns-grid,.pattern-card{min-width:0}.form-sections-grid{display:grid;gap:.75rem;align-items:start}.form-sections-grid-left{grid-template-columns:repeat(2,minmax(220px,1fr))}.form-section-color{position:sticky;top:4.4rem}.form-section{border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:.75rem;display:flex;flex-direction:column;gap:.6rem;background:rgba(13,18,42,.3)}.form-section h3,.form-section h4{margin:0;font-size:.95rem}.form-group{display:flex;flex-direction:column;gap:.3rem}.form-group label{font-size:.85rem;opacity:.92}.form-group input,.form-group select{border:1px solid rgba(255,255,255,.25);border-radius:8px;padding:.45rem .55rem;background:rgba(255,255,255,.96);color:#20233f}.form-group .computed-value{border:1px solid rgba(255,255,255,.25);border-radius:8px;padding:.45rem .55rem;background:rgba(255,255,255,.14);color:#fff;font-weight:600;line-height:1.25}.submit-button{border:0;border-radius:999px;padding:.55rem 1rem;background:#0a8f64;color:#fff;font-weight:700}.submit-button:disabled{opacity:.65;cursor:not-allowed}.error,.submit-error,.validation-summary{color:#ffd9d9;font-size:.82rem}.overlay-workspace{width:100%;max-width:960px;min-width:0;margin:0 auto;background:rgba(255,255,255,.12);border-radius:12px;padding:1rem;display:flex;flex-direction:column;gap:.75rem;overflow-x:hidden}.overlay-guidance{margin:0;font-size:.95rem;opacity:.9}.wall-image-uploader{display:flex;flex-direction:column;gap:.5rem}.wall-image-label{font-size:.9rem;font-weight:600}.wall-image-input{width:100%;max-width:100%}.uploaded-wall-preview{width:100%;max-width:100%;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:rgba(15,20,43,.35);padding:.5rem;overflow:hidden}.uploaded-wall-preview img{display:block;width:100%;max-height:420px;object-fit:contain;border-radius:8px}.overlay-selected{border:2px solid #2ecc71;box-shadow:0 0 0 2px #2ecc7140}.overlay-unselected{border:2px dashed rgba(255,255,255,.7);opacity:.85}.overlay-canvas{position:relative;display:flex;flex-direction:column;gap:.5rem;width:100%;max-width:100%;min-width:0}.overlay-viewport-controls{display:flex;flex-wrap:wrap;gap:.4rem}.overlay-viewport-button{border:1px solid rgba(255,255,255,.35);border-radius:8px;background:rgba(255,255,255,.12);color:#fff;padding:.3rem .6rem;min-height:44px;font-size:.85rem;cursor:pointer}.overlay-viewport-status{display:inline-flex;gap:.8rem;align-items:center;font-size:.85rem;opacity:.95}.overlay-stage-viewport{display:block;width:100%;max-width:100%;overflow:hidden;border-radius:8px}.overlay-stage{position:relative;display:block;width:100%}.overlay-stage img{display:block;width:100%;max-width:100%;height:auto}.react-resizable{position:relative}.react-resizable-handle{position:absolute;width:14px;height:14px;border-radius:3px;border:2px solid #2ecc71;background:rgba(8,16,42,.85);box-shadow:0 0 0 1px #fff3;z-index:3}.react-resizable-handle-se{cursor:se-resize;right:-7px;bottom:-7px}.overlay-dimensions{background:rgba(16,18,34,.45);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:.75rem}.overlay-dimensions-grid{display:grid;gap:.75rem;grid-template-columns:repeat(2,minmax(0,1fr))}.overlay-dimensions-grid h3{margin:0;font-size:.95rem}.overlay-dimensions-grid p{margin:.25rem 0 0;font-weight:600}.overlay-dimensions-error{margin:.5rem 0 0;color:#ffb3b3}.pattern-card.selected{outline:3px solid rgba(10,63,160,.5);outline-offset:2px}.pattern-selection-indicator{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;font-weight:700;color:#0a3fa0;background:#d9e9ff;border-radius:999px;padding:.25rem .55rem}.welcome-message{text-align:center;max-width:600px;background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:3rem;box-shadow:0 8px 32px #0000001a}.welcome-message h2{margin:0 0 1rem;font-size:2rem;color:#fff}.welcome-message p{margin:1rem 0;font-size:1.1rem;opacity:.9;line-height:1.6}.status-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin:2rem 0}.status-item{padding:1rem;background:rgba(255,255,255,.1);border-radius:10px;font-size:.9rem}.status-item strong{display:block;margin-bottom:.25rem;color:#fff}code{background:rgba(0,0,0,.3);padding:.25rem .5rem;border-radius:4px;font-family:Monaco,Menlo,monospace;font-size:.9rem}@media (max-width: 768px){.app-main{padding:1rem;gap:.75rem}.app-header h1{font-size:2rem}.workspace-layout-generator{gap:.9rem}.overlay-workspace,.generator-controls-panel,.generator-results-panel{padding:.9rem}.generator-controls-panel{gap:1rem;min-height:auto}.generator-drawer-toggle-row{justify-content:stretch}.generator-drawer-toggle-row .workspace-link{width:100%;text-align:center}.upload-primary-cta,.overlay-guidance,.uploaded-wall-preview{margin-bottom:.4rem}.workspace-layout,.form-layout-columns,.form-sections-grid-left,.form-sections-grid{grid-template-columns:1fr}.form-actions{flex-direction:column;align-items:stretch}.form-actions>*{width:100%}.form-group input,.form-group select,.submit-button,.wall-image-input{min-height:44px}.form-actions-top,.form-section-color{position:static}.generator-drawer-content{border-top:0;padding-top:.35rem;max-height:none;overflow:visible;padding-right:0}.patterns-grid-three-up{grid-template-columns:1fr!important}.status-grid,.overlay-dimensions-grid{grid-template-columns:1fr}.welcome-message{padding:2rem}}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{min-height:100vh}button{font-family:inherit;cursor:pointer}input,textarea,select{font-family:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}