@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Unbounded:wght@500;700&display=swap');
*{box-sizing:border-box}body{margin:0;background:#0b0d17;color:#f5f4fb;font-family:Manrope,Arial,sans-serif}.app{min-height:100vh;display:grid;grid-template-columns:250px minmax(520px,1fr) 355px;background:radial-gradient(circle at 74% 18%,#251f61 0,transparent 28%),#0b0d17}aside{padding:32px 20px;border-right:1px solid #282a3b;display:flex;flex-direction:column}.brand{font:700 16px Unbounded,sans-serif;letter-spacing:-.8px}.brand span{color:#54e9ff}.caption,.eyebrow{font-size:10px;letter-spacing:1.6px;color:#82859d;font-weight:800}.caption{margin:10px 0 38px}.new{border:1px solid #6460ff;background:#252450;color:white;padding:14px;border-radius:12px;font-weight:700;text-align:left;cursor:pointer}.history{margin-top:38px}.history p{font-size:10px;color:#71748a;font-weight:800;letter-spacing:1.5px}.history button{background:#1b1d2d;border:0;color:#e9e8f0;width:100%;border-radius:10px;padding:13px;text-align:left;font-weight:700}.history small{display:block;color:#777a91;margin-top:5px}.profile{margin-top:auto;display:flex;gap:10px;align-items:center;padding-top:20px;border-top:1px solid #282a3b}.profile i{width:10px;height:10px;border-radius:50%;background:#4be8ad;box-shadow:0 0 12px #4be8ad}.profile b,.profile small{display:block;font-size:11px}.profile small{color:#85889e;margin-top:4px}.workspace{padding:55px clamp(32px,6vw,90px) 28px;display:flex;flex-direction:column;min-width:0}header{display:flex;justify-content:space-between;gap:20px}h1{font:500 clamp(26px,3.4vw,47px)/1.17 Unbounded,sans-serif;letter-spacing:-2px;margin:8px 0}h1 em{font-style:normal;color:#56e6ff}.status{font-size:12px;white-space:nowrap;color:#b9bac8;padding-top:15px}.status span:first-child{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;background:#4be8ad}.status .busy{background:#ffd75b;box-shadow:0 0 10px #ffd75b}.status .done{background:#4be8ad}.status .error{background:#ff608b}.chat{flex:1;overflow:auto;min-height:420px;padding:65px 0 24px}.welcome{max-width:520px}.orb{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;color:#55eaff;background:linear-gradient(135deg,#3631a0,#ed3ca6);font-size:22px}.welcome h2{font:500 27px/1.3 Unbounded,sans-serif;letter-spacing:-1px;margin:22px 0 15px}.welcome p{color:#9fa1b6;line-height:1.7;font-size:14px}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.chips button{border:1px solid #3c3e56;background:transparent;color:#caccdb;border-radius:20px;padding:9px 13px;font-size:12px;cursor:pointer}.message{max-width:85%;padding:15px 17px;border-radius:15px;line-height:1.55;font-size:14px;margin:12px 0 12px auto;background:#3633a3}.message.assistant{margin-left:0;margin-right:auto;background:#202231}.workspace form{display:flex;padding:9px 10px 9px 16px;align-items:center;border:1px solid #41435c;background:#171925;border-radius:16px;box-shadow:0 12px 40px #0004}.workspace textarea{resize:none;height:55px;flex:1;background:none;color:white;border:0;outline:0;padding:8px 0;font:13px/1.45 Manrope}.workspace textarea::placeholder{color:#777a91}.workspace form button{border:0;background:#55e6ff;color:#0b1020;border-radius:12px;width:40px;height:40px;font-size:25px;cursor:pointer}.hint{font-size:10px;color:#65687d;margin:9px 0 0}.preview{border-left:1px solid #282a3b;padding:48px 24px;background:#11131e}.previewHead{display:flex;justify-content:space-between;align-items:end}.preview h2{font:700 19px Unbounded,sans-serif;margin:5px 0}.previewHead span{font-size:11px;color:#85889f}.empty{height:68vh;min-height:420px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#777a91;text-align:center}.empty span{font-size:34px;color:#484a63}.empty p{font-size:13px;line-height:1.7}.loader{width:28px;height:28px;border:3px solid #343651;border-top-color:#55e6ff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:25px}.gallery a{position:relative;aspect-ratio:4/5;border-radius:10px;overflow:hidden;background:#252740}.gallery img{width:100%;height:100%;object-fit:cover;display:block}.gallery span{position:absolute;left:7px;bottom:6px;background:#0b0d17cc;border-radius:5px;padding:3px 5px;font-size:9px}.joblog{color:#898ca2;font-size:11px;line-height:1.6;margin-top:18px;white-space:pre-line}@media(max-width:980px){.app{grid-template-columns:210px 1fr}.preview{grid-column:2;padding-top:20px;border-top:1px solid #282a3b}.empty{display:none}.gallery{grid-template-columns:repeat(5,1fr)}.workspace{min-height:70vh}}@media(max-width:680px){.app{display:block}aside{display:none}.workspace{padding:28px 20px}.preview{padding:24px 20px}.gallery{grid-template-columns:repeat(3,1fr)}h1{letter-spacing:-1.4px}.chat{min-height:350px}}
.message.progress{border:1px solid #45496c;min-width:290px}.message.progress b{display:block;color:#f2f3ff}.message.progress small{display:block;color:#9ca0bd;margin-top:6px}.pulse{display:inline-block;width:7px;height:7px;background:#55e6ff;border-radius:50%;margin-left:8px;animation:pulse 1.2s infinite}@keyframes pulse{50%{opacity:.3;transform:scale(.6)}}
.attachment{display:flex;align-items:center;gap:9px;margin:10px 0 8px;color:#9397ac;font-size:11px}.attachment label{color:#7ceefa;cursor:pointer;font-weight:800}.attachment label span{font-size:17px;vertical-align:-2px}.attachment input{display:none}.attachment small{font-size:10px;color:#75798e}.attachment button{border:0;background:#37394d;color:white;width:18px;height:18px;border-radius:50%;font-size:15px;line-height:16px;cursor:pointer}.attachment:has(input:focus) label{outline:2px solid #55e6ff;outline-offset:3px;border-radius:3px}
.templateHead{display:flex;align-items:center;justify-content:space-between;margin:28px 0 12px;gap:15px}.templateHead b{font-size:10px;letter-spacing:1.2px;color:#9699b0}.templateHead span{font-size:11px;color:#54e9ff}.templates{display:grid;grid-template-columns:repeat(5,minmax(82px,1fr));gap:8px}.template{position:relative;padding:5px;border:1px solid #353850;background:#171925;border-radius:10px;color:#e8e9f4;text-align:left;cursor:pointer;transition:.2s}.template:hover{transform:translateY(-2px);border-color:#7379a9}.template.selected{border-color:#55e6ff;box-shadow:0 0 0 1px #55e6ff55}.template strong{position:absolute;top:9px;left:9px;font-size:8px;color:white;z-index:1}.template small{display:block;font-size:9px;margin:6px 2px 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini{height:60px;border-radius:6px;display:block;position:relative;overflow:hidden;background:#17205c}.mini:before,.mini:after,.mini i,.mini b,.mini em{content:"";position:absolute;display:block}.mini:before{inset:0;background:linear-gradient(135deg,#111a40,#4d2cba 55%,#ef3c93)}.mini:after{width:33px;height:33px;border-radius:50%;background:#5cecf8;right:-11px;top:-9px;opacity:.8}.mini i{height:5px;width:30px;left:8px;top:12px;background:#fff}.mini b{height:7px;width:52px;left:8px;top:25px;background:#fff}.mini em{height:14px;width:60px;left:8px;bottom:7px;border-radius:4px;background:#ffffff33}.mini.soft-lilac:before{background:linear-gradient(135deg,#fff8f2,#c8b4ff)}.mini.soft-lilac:after{background:#7257d9}.mini.soft-lilac i,.mini.soft-lilac b{background:#30215f}.mini.signal-red:before{background:linear-gradient(135deg,#17171d,#e33d49)}.mini.lime-grid:before{background:repeating-linear-gradient(0deg,#111 0 8px,#192217 9px 10px)}.mini.lime-grid:after{background:#d5ff4f}.mini.sky-minimal:before{background:linear-gradient(135deg,#ecf7ff,#5baeff)}.mini.sky-minimal i,.mini.sky-minimal b{background:#143a9d}.mini.sunset-pop:before{background:linear-gradient(135deg,#ffbf8d,#ff3974)}.mini.mono-luxury:before{background:#f6f0e8}.mini.mono-luxury i,.mini.mono-luxury b{background:#181514}.mini.mono-luxury:after{background:#d9be8b}.mini.aqua-glass:before{background:linear-gradient(135deg,#0d3e4b,#0dbda7)}.mini.blueprint:before{background:repeating-linear-gradient(0deg,#1743ba 0 9px,#2c62dd 10px 11px)}.mini.blueprint:after{background:#ffd64d}.mini.candy-collage:before{background:linear-gradient(135deg,#fd4da1,#9257ff 50%,#ffe681)}@media(max-width:980px){.templates{grid-template-columns:repeat(5,1fr)}}@media(max-width:680px){.templates{grid-template-columns:repeat(3,1fr)}.templateHead{align-items:flex-start;flex-direction:column;gap:5px}}