.layout-editor{display:grid;gap:15px}.layout-heading,.layout-footer{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.layout-heading>div{flex:1}.layout-heading h3{font-size:18px}.layout-heading label{min-width:180px}.layout-stage{background:#e8edef;border:1px solid var(--line);padding:25px;display:flex;justify-content:center;align-items:center;min-height:250px;max-height:54vh;overflow:hidden}.layout-frame{position:relative;overflow:hidden;width:min(100%,650px);max-height:45vh;aspect-ratio:16/9;touch-action:none;box-shadow:0 5px 18px #0003;outline:3px solid #486474;background:#000;user-select:none}.layout-frame[style*="aspect-ratio: 1080 / 2376"],.layout-frame.portrait{width:auto;height:45vh}.layout-art{position:absolute;inset:0;pointer-events:none}.layout-art img,.layout-art video{max-width:none!important;object-fit:fill!important}.layout-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#fff3 1px,transparent 1px),linear-gradient(90deg,#fff3 1px,transparent 1px);background-size:12.5% 12.5%;border:1px solid #fff7}.layout-guides{position:absolute;inset:0;pointer-events:none}.layout-guides button{pointer-events:auto;position:absolute;background:#009da9;color:white;border:2px solid white;border-radius:50%;width:34px;height:34px;padding:0;box-shadow:0 2px 8px #0005;touch-action:none}.layout-guides [data-layout-size]{right:9px;bottom:9px;cursor:nwse-resize}.layout-guides [data-layout-angle]{top:9px;left:calc(50% - 17px);cursor:grab}.layout-screen-label{position:absolute;bottom:7px;left:7px;color:white;background:#0009;padding:4px 7px;border-radius:4px;font-size:10px;pointer-events:none}.layout-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.layout-tools .active{background:var(--accent-soft);border-color:var(--accent)}.layout-tools label{font-size:11px;min-width:90px;flex:1}.layout-tools input[type=range]{padding:0;width:100%;accent-color:var(--accent)}.layout-tools input[type=color]{padding:3px;height:35px;width:80px}.layout-footer{padding-top:14px;border-top:1px solid var(--line)}.layout-footer>span{margin-right:auto;font-size:11px;color:var(--muted)}.layout-youtube-note{height:100%;display:grid;place-content:center;text-align:center;color:white;padding:20px;line-height:1.7}.layout-dialog{width:min(1100px,96vw)}
.status-with-dot{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:650}.status-dot{width:9px;height:9px;display:inline-block;border-radius:50%;flex:none}.status-dot.red{background:#e33b4d;animation:offline-pulse 1.8s ease-in-out infinite}.status-dot.yellow{background:#eab328}.status-dot.green{background:#20aa75}.status-description{display:block;font-size:11px;color:var(--muted);max-width:245px;margin-top:6px;white-space:normal!important}.delivery-receipts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:15px 0}.receipt-step{background:var(--canvas);border:1px solid var(--line);padding:13px;border-radius:8px;color:var(--muted);font-size:12px}.receipt-step.confirmed{border-color:#6ac9a0;background:#e9f8f0;color:#227c54}.receipt-step strong,.receipt-step small{display:block}.receipt-step small{font-size:10px;margin-top:5px}.media-select{position:absolute;left:12px;top:12px;z-index:2;width:20px;height:20px;accent-color:var(--accent)}.media-card.selected{outline:2px solid var(--accent)}.media-selection-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 18px;border:1px solid var(--line);background:var(--surface);border-radius:10px;margin-bottom:18px}.media-selection-tools label{flex-direction:row;align-items:center}.media-selection-tools input{width:18px;height:18px}.media-selection-tools strong{margin-right:auto}.media-card-send{flex-wrap:wrap}.youtube-preview{width:100%;height:100%;border:0;min-height:200px}.delivery-uploads.compact{padding:9px 12px;margin:5px 0 13px}.delivery-uploads.compact h3{display:none}.delivery-uploads.compact .upload-row{padding:0;border:0}.delivery-uploads.compact .upload-file small,.delivery-uploads.compact .pill{display:none}.delivery-uploads.compact progress{height:4px;margin-top:5px}.upload-row button{font-size:11px;padding:6px 10px}.delivery-dialog .modal-head{position:sticky;top:0;background:var(--surface);z-index:3}.layout-frame.portrait{width:230px;height:auto}.media-card .media-thumb .media-select{margin:0}@keyframes offline-pulse{50%{opacity:.28;box-shadow:0 0 0 4px #e33b4d17}}@media(prefers-reduced-motion:reduce){.status-dot.red{animation:none}}@media(max-width:650px){.delivery-receipts{grid-template-columns:repeat(2,1fr)}.layout-stage{padding:14px}.layout-heading label{min-width:100%;width:100%}.layout-tools button{font-size:11px}.layout-footer button{flex:1}.layout-footer>span{width:100%}.media-selection-tools{padding:12px}}
.preview-stage{position:relative;overflow:hidden}.assigned-file-list{display:grid;gap:9px;margin:18px 0}.assigned-file{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:8px}.assigned-file label{display:flex;flex-direction:row;align-items:center;gap:10px;min-width:0;overflow-wrap:anywhere}.assigned-file input{width:18px;height:18px;flex:none;accent-color:var(--accent)}.assigned-file button{flex:none;font-size:11px}.manage-preview{margin:auto;max-width:100%}
@media(min-width:800px){.layout-editor{grid-template-columns:minmax(0,1fr) 235px;gap:12px}.layout-heading{grid-column:1/-1}.layout-heading h3{margin:0 0 5px}.layout-heading p{font-size:12px;margin:0}.layout-stage{grid-column:1;grid-row:2;padding:15px;min-height:240px;max-height:39vh}.layout-device-note{grid-column:1;grid-row:3;margin:0}.layout-tools{grid-column:2;grid-row:2/4;display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:start;align-items:center}.layout-tools button{font-size:11px;padding:8px}.layout-tools label{grid-column:1/-1;display:block;width:100%;min-width:0}.layout-tools label input{margin-top:3px}.layout-tools [data-layout-reset]{grid-column:1/-1}.layout-footer{grid-column:1/-1;padding-top:10px}.layout-dialog .modal-head{padding-top:19px;padding-bottom:15px}}