:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#252d31;background:#f2f5f5;font-size:14px;letter-spacing:0;color-scheme:light}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select{cursor:pointer}button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:7px 11px;background:#fff;color:#293336;border:1px solid #cbd4d5;border-radius:5px;font-weight:600}button:hover:not(:disabled){background:#eef6f3;border-color:#7a9990}button:disabled{cursor:not-allowed;opacity:.55}button svg,i svg{width:17px;height:17px;flex-shrink:0}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,.upload-zone:focus-visible{outline:3px solid #00826b;outline-offset:3px}input:not([type=radio]):not([type=color]):not([type=range]),select{width:100%;min-width:0;border:1px solid #cbd4d5;border-radius:4px;padding:8px;background:#fff;color:#253333}input[type=color]{width:40px;height:28px;padding:1px;border:1px solid #b9c7c4;border-radius:3px;background:#fff}input[type=range]{width:100%;accent-color:#00826b}h1,h2,h3,p{margin:0}h1{font-size:18px}h2{font-size:14px}h3{font-size:14px}.topbar{background:#fff;border-bottom:1px solid #d8dfdf;min-height:62px;padding:12px 28px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.brand>i{color:#00826b}.brand strong{font-size:22px}.brand>span:not(.beta){color:#627172;font-size:12px}.beta{background:#fbe6df;color:#954429;font-size:10px;font-weight:700;padding:3px 5px;border-radius:3px}.top-actions{display:flex;gap:8px}.workspace{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:340px minmax(0,1fr);min-height:calc(100vh - 62px)}.editor{padding:20px 22px;background:#fff;border-right:1px solid #d8dfdf}.section-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.icon-button{width:34px;height:34px;min-height:34px;padding:6px}.field{display:flex;flex-direction:column;gap:6px;color:#526164;font-size:12px;margin-bottom:12px}.os-picker{padding:0;margin:0 0 12px;border:0;display:flex;gap:0}.os-picker legend{font-size:12px;color:#526164;margin-bottom:6px}.os-picker label{flex:1;text-align:center;position:relative}.os-picker input{position:absolute;opacity:0;width:100%;height:100%;inset:0;margin:0;cursor:pointer}.os-picker span{display:block;border:1px solid #cbd4d5;padding:9px 2px;font-size:12px;font-weight:600}.os-picker label:first-of-type span{border-radius:4px 0 0 4px}.os-picker label:last-of-type span{border-radius:0 4px 4px 0}.os-picker input:checked+span{color:#006753;background:#e7f4ee;border-color:#00826b}.os-picker input:focus-visible+span{outline:3px solid #00826b;outline-offset:2px}.muted{color:#6c7779;font-size:10px}.slots{display:grid;gap:5px;margin-bottom:12px}.slot-row{display:grid;grid-template-columns:minmax(0,1fr) 30px;align-items:center;gap:4px}.slot-select{justify-content:flex-start;height:46px;min-width:0;padding:5px 9px;font-weight:500;text-align:left}.slot-select[aria-pressed=true]{background:#eaf5f0;border-color:#00826b}.slot-select img{width:32px;height:32px;object-fit:contain}.slot-select>span{display:flex;flex-direction:column;min-width:0;gap:3px}.slot-select small{color:#657174;font-size:10px;font-weight:400}.slot-row>.icon-button{width:30px;height:30px;min-height:30px}.upload-zone{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;border:1px dashed #96b0a8;background:#f5faf8;padding:14px 6px;border-radius:4px;cursor:pointer;text-align:center;font-size:12px;margin-bottom:16px}.upload-zone small{font-size:10px;color:#697a74}.upload-zone.drag{background:#e3f4eb;outline:2px solid #00826b}.composition{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-top:1px solid #e1e7e5;border-bottom:1px solid #e1e7e5;padding:13px 0 0;margin-bottom:16px}.color-field{display:flex;align-items:center;justify-content:space-between;font-size:12px}.composition .field{margin-bottom:10px}.template-row{display:grid;grid-template-columns:minmax(0,1fr) 34px 34px;gap:5px}.preview-area{padding:22px 26px;min-width:0}.preview-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:10px}.desktop{width:100%;aspect-ratio:16/10;position:relative;overflow:hidden;background:#d5e5e4;border:1px solid #bdcdca;border-radius:6px;isolation:isolate}.desktop>#wallpaper{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;z-index:-1}.desktop-icons{position:absolute;top:22px;left:18px;display:grid;gap:21px;width:98px}.desktop-item{display:flex;align-items:center;flex-direction:column;gap:6px}.desktop-item img{width:var(--icon-size,48px);height:var(--icon-size,48px);object-fit:contain;max-width:90px;max-height:90px}.desktop-item span{font-size:11px;text-align:center;background:#ffffffd9;padding:2px 5px;border-radius:3px;max-width:110px;overflow-wrap:anywhere;line-height:1.25}.preview-clock{position:absolute;right:24px;top:24px;display:flex;align-items:flex-end;flex-direction:column;gap:3px;color:#21352f}.preview-clock>span{font-size:36px;font-weight:300}.preview-clock small{background:#ffffffd9;padding:2px 5px;border-radius:3px}.taskbar{position:absolute;bottom:0;left:0;right:0;height:36px;background:#ffffffed;border-top:2px solid var(--accent,#00826b);display:flex;align-items:center;gap:18px;padding:0 16px;color:#405952}.taskbar span{margin-left:auto;font-size:10px}.taskbar svg{width:17px;height:17px}.desktop>#preview-pointer{position:absolute;top:58%;left:60%;width:28px;height:28px;object-fit:contain;pointer-events:none}.build-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:16px 0 8px}.build-row>div{display:flex;flex-direction:column;gap:4px;min-width:0}.build-row strong{font-size:14px;overflow-wrap:anywhere}.build-row small{font-size:11px;color:#657471}.primary{background:#00826b;color:white;border-color:#00826b;white-space:nowrap}.primary:hover:not(:disabled){background:#006955;color:white}.capabilities{border-top:1px solid #d1dcda;margin-top:15px;padding-top:14px}.capabilities ul{margin:10px 0 0;padding-left:18px;line-height:1.7;color:#526461;font-size:12px;overflow-wrap:anywhere}#status{min-height:35px;font-size:12px;color:#35695b;line-height:1.6;overflow-wrap:anywhere}#status.error{color:#a33336}.safety{border-top:1px solid #d1dcda;margin-top:15px;padding-top:13px}.safety summary{font-size:12px;font-weight:600;cursor:pointer}.safety summary svg{width:14px;height:14px;vertical-align:middle}.safety p{font-size:12px;line-height:1.7;color:#526461;margin-top:12px}.safety pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#e7edeb;font-size:11px;padding:12px;border-radius:4px;line-height:1.6}.unavailable{display:flex;gap:7px;align-items:center;flex-wrap:wrap;border-top:1px solid #d1dcda;margin-top:15px;padding-top:14px}.unavailable>span{font-size:11px;color:#63716e}.unavailable button{font-size:10px;min-height:28px}.privacy,.limits{font-size:11px;line-height:1.6;color:#667470;margin-top:12px;overflow-wrap:anywhere}.limits{color:#875532}.desktop img[hidden]{display:none}
@media(max-width:850px){.workspace{grid-template-columns:300px minmax(0,1fr)}.editor{padding:18px 16px}.preview-area{padding:20px 18px}.topbar{padding:12px 18px}.build-row{align-items:flex-start;flex-direction:column}.desktop{aspect-ratio:4/3}.desktop-icons{top:12px;left:8px;gap:15px}.desktop-item img{max-width:60px;max-height:60px}.preview-clock{right:14px;top:14px}.preview-clock>span{font-size:28px}}
@media(max-width:650px){.topbar{flex-wrap:wrap;padding:12px 16px}.top-actions{margin-left:auto}.brand>span:not(.beta){display:none}.workspace{display:flex;flex-direction:column}.editor{border-right:0;border-bottom:1px solid #d8dfdf;padding:18px 20px}.preview-area{padding:18px 20px}.desktop{aspect-ratio:4/3;min-height:260px}.build-row{flex-direction:row;align-items:center}.build-row .primary{font-size:12px;padding:8px}.desktop-icons{gap:15px}.desktop-item img{max-width:56px;max-height:56px}.desktop-item span{font-size:10px}.top-actions button span{font-size:11px}.composition{gap:12px}.preview-clock>span{font-size:28px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
.desktop{container-type:size;min-height:320px}.desktop-item img{width:min(var(--icon-size,48px),12cqh);height:min(var(--icon-size,48px),12cqh)}