:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.4;font-weight:400;color:#000;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:100%}*{box-sizing:border-box}body{margin:0;background:#fff;height:100%}#root{height:100vh}button,input,textarea{font-family:inherit;color:inherit}button{background:none;border:none}.app{display:flex;height:100vh;background:#fff;color:#000}.sidebar{width:220px;border-right:1px solid #ddd;padding:16px;background:#fff;display:flex;flex-direction:column;gap:16px;height:100%;overflow-y:auto}.sidebar-header h1{margin:0;font-size:1.1rem;letter-spacing:.02em}.sidebar-header p{margin:4px 0 0;color:#333;font-size:.85rem}.add-field{display:flex;flex-direction:column;gap:8px}.add-field input{width:100%;padding:8px 10px;border:1px solid #d9d9d9;border-radius:0;background:#fff}.add-field button{padding:8px 10px;border:1px solid #d9d9d9;background:#fff;border-radius:0;cursor:pointer}.sidebar-section{display:flex;flex-direction:column;gap:10px}.sidebar-footer{margin-top:auto;padding-top:12px;border-top:1px solid #ddd;display:flex;flex-direction:column;gap:6px}.reset-button{border:1px solid #ddd;padding:6px 8px;background:#fff;cursor:pointer;font-size:.8rem;text-align:left}.reset-button:hover{opacity:.8}.sidebar-hint{margin:0;font-size:.7rem;color:#333}.sidebar-title{margin:0;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:#333}.field-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.field-item{display:flex;justify-content:space-between;align-items:center;font-size:.9rem;padding:6px 8px;border:1px solid #ddd;border-radius:0;background:#fff;color:#000;gap:8px}.field-count{font-size:.75rem;color:#9a9a9a;font-weight:400}.field-name{min-width:0;display:flex;align-items:center;gap:4px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.field-delete{border:1px solid #d9d9d9;background:#fff;border-radius:0;padding:3px 6px;font-size:.7rem;cursor:pointer;flex-shrink:0}.main{flex:1;display:flex;flex-direction:column;min-width:0;background:#fff;height:100%;min-height:0;overflow:hidden}.main-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #ddd;background:#fff}.main-header h2{margin:0;font-size:1.1rem}.main-header p{margin:4px 0 0;color:#333;font-size:.85rem}.storage-indicator{font-size:.75rem;color:#333;border:1px solid #d9d9d9;padding:4px 10px;border-radius:0;background:#fff}.field-board{flex:1;overflow-x:auto;overflow-y:auto;padding:12px;min-height:0}.field-board-inner{--field-column-width: clamp(360px, 42vw, 420px);display:grid;grid-auto-flow:column;grid-auto-columns:var(--field-column-width);gap:12px;align-items:start;justify-content:start;align-content:start;width:max-content}.field-column{width:100%;background:#fff;border:1px solid #ddd;border-radius:0;padding:12px;display:flex;flex-direction:column;gap:12px}.field-body{display:flex;flex-direction:column;gap:10px;width:100%}.field-header{display:flex;justify-content:space-between;align-items:baseline;gap:12px;width:100%}.field-name-input{flex:1;min-width:0;border:none;border-bottom:1px solid #d9d9d9;font-size:.95rem;font-weight:600;padding:2px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.field-name-input:focus{outline:none;border-bottom-color:#666}.field-meta{font-size:.75rem;color:#333;flex-shrink:0}@media(min-width:480px){.field-board{padding:16px}.field-board-inner{gap:16px}}@media(min-width:768px){.field-board-inner{gap:18px}}@media(min-width:1024px){.field-board{padding:20px}.field-board-inner{gap:20px}}@media(min-width:1280px){.field-board{padding:24px}.field-board-inner{gap:22px}}.field-dropzone{border:1px dashed #ccc;border-radius:0;background:#fff;padding:12px;text-align:center;transition:border-color .2s ease,background .2s ease;width:100%}.field-dropzone.is-active{border-color:#000;background:#f7f7f7}.dropzone-label{position:relative;display:flex;flex-direction:column;gap:4px;cursor:pointer;width:100%;align-items:center}.dropzone-label input{position:absolute;inset:0;opacity:0;cursor:pointer}.dropzone-title{font-size:.85rem;font-weight:600;color:#000}.dropzone-subtitle,.dropzone-tip{font-size:.75rem;color:#333;display:block}.url-form{display:flex;gap:8px;width:100%}.url-input{flex:1;border:1px solid #d9d9d9;background:#fff;padding:6px 8px;font-size:.8rem}.url-button{border:1px solid #d9d9d9;background:#fff;padding:6px 8px;font-size:.75rem;cursor:pointer}.url-error{margin:-4px 0 0;color:#7a3d2c;font-size:.75rem}.field-error{margin:-4px 0 0;color:#7a3d2c;font-size:.75rem;width:100%}.field-images{display:flex;flex-direction:column;gap:8px;padding:0;min-height:140px;border-radius:0;background:#fff;border:1px dashed transparent;transition:border-color .2s ease,background .2s ease;width:100%}.field-images.is-over{border-color:#000;background:#f7f7f7}.empty-state{text-align:center;color:#333;font-size:.8rem;padding:20px 8px}.image-card{background:#fff;border:1px solid #ddd;border-radius:0;padding:4px;display:flex;flex-direction:column;gap:4px;width:100%;transition:box-shadow .2s ease,opacity .2s ease}.image-card:hover{box-shadow:0 2px 4px #00000014;opacity:.98}.image-toolbar{display:flex;justify-content:space-between;gap:6px}.drag-handle,.image-remove{border:1px solid #d9d9d9;background:#fff;border-radius:0;padding:3px 5px;font-size:.65rem;cursor:pointer}.drag-handle{cursor:grab}.drag-handle:active{cursor:grabbing}.image-remove{opacity:0;transition:opacity .2s ease}.image-card:hover .image-remove{opacity:1}.image-card:focus-within .image-remove{opacity:1}.image-wrapper{width:100%;border-radius:0}.image-wrapper img{width:100%;height:auto;display:block}.image-note{border:1px solid #d9d9d9;border-radius:0;padding:3px 5px;font-size:.7rem}.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}