@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@500;600;700&display=swap');
:root{--bg:#0a0b0e;--panel:rgba(20,21,26,.76);--line:rgba(255,255,255,.09);--text:#f4f1ea;--muted:#9899a3;--lime:#c9ff5b;--violet:#9b82ff;--red:#ff6e6e}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;overflow-x:hidden}.ambient{position:fixed;border-radius:50%;filter:blur(120px);opacity:.13;pointer-events:none}.a1{width:620px;height:620px;background:#7455ff;right:-180px;top:-220px}.a2{width:480px;height:480px;background:#b8ff50;left:-260px;bottom:-250px}header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,5vw,72px);border-bottom:1px solid var(--line);position:relative;z-index:2}.brand{color:var(--text);text-decoration:none;display:flex;gap:12px;align-items:center;font-family:Manrope;font-size:18px}.brand b{color:var(--lime)}.mark{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,var(--lime),#74ccb5);color:#10120c;font-weight:800}.runtime{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}.dot{width:8px;height:8px;border-radius:50%;background:#777;box-shadow:0 0 0 4px #7772}.dot.loaded{background:var(--lime);box-shadow:0 0 0 4px #c9ff5b20}.dot.loading{background:#ffcb66;animation:pulse 1s infinite}.dot.error{background:var(--red)}button,.small{font:inherit;border:0;cursor:pointer}.small{padding:9px 14px;border-radius:10px;background:#f2f0e9;color:#151519;font-weight:600;text-decoration:none}.ghost{background:#ffffff0b;color:#c4c3c8;border:1px solid var(--line)}main{width:min(1400px,92vw);margin:0 auto;padding:76px 0 42px}.intro{margin-bottom:42px}.eyebrow{color:var(--lime);font-size:11px;letter-spacing:.22em;font-weight:700}.intro h1{font-family:Manrope;margin:13px 0 14px;font-size:clamp(45px,6.5vw,86px);line-height:.96;letter-spacing:-.055em}.intro h1 em{font-style:normal;color:#8a8b94}.intro p{color:var(--muted);font-size:17px;max-width:600px}.workspace{display:grid;grid-template-columns:minmax(360px,520px) 1fr;gap:18px}.panel{border:1px solid var(--line);border-radius:24px;background:var(--panel);backdrop-filter:blur(24px);box-shadow:0 24px 70px #0005}.controls{padding:25px}.mode-row{display:flex;gap:6px;margin-bottom:22px}.mode{padding:7px 10px;border-radius:8px;color:#777984;font-size:12px}.mode.active{background:#ffffff0b;color:#f4f1ea}.field{display:flex;flex-direction:column;gap:8px;color:#c2c1c7;font-size:12px;font-weight:600}.field small{color:#6e707a;font-weight:400}.prompt-field textarea{min-height:128px;resize:vertical}textarea,input,select{width:100%;color:var(--text);background:#0d0e12;border:1px solid var(--line);border-radius:12px;padding:12px 13px;font:inherit;outline:none}textarea:focus,input:focus,select:focus{border-color:#a58dff88;box-shadow:0 0 0 3px #9b82ff12}textarea::placeholder{color:#555762}.dropzone{margin:16px 0 12px;padding:15px;border:1px dashed #ffffff20;border-radius:14px;display:flex;align-items:center;gap:12px;cursor:pointer;transition:.2s}.dropzone:hover,.dropzone.drag{border-color:var(--violet);background:#9b82ff0b}.upload-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#ffffff0a;font-size:20px}.dropzone b,.dropzone small{display:block;font-size:12px}.dropzone small{color:#666873;margin-top:3px}.previews{display:flex;gap:8px;overflow:auto}.thumb{position:relative;flex:0 0 60px;height:60px}.thumb img{width:100%;height:100%;object-fit:cover;border-radius:10px}.thumb button{position:absolute;right:-3px;top:-5px;width:18px;height:18px;border-radius:50%;background:#eee;color:#111;font-size:11px}.grid{display:grid;grid-template-columns:1.5fr .7fr;gap:13px;margin-top:18px}details{margin:17px 0;color:#888a94;font-size:12px}details summary{cursor:pointer;margin-bottom:12px}.generate{width:100%;padding:15px 18px;border-radius:14px;background:var(--lime);color:#11150d;font-weight:700;display:flex;justify-content:center;gap:16px;align-items:center;transition:.2s}.generate:hover{transform:translateY(-1px);box-shadow:0 10px 30px #c9ff5b1c}.generate:disabled{opacity:.4;cursor:not-allowed;transform:none}.generate kbd{background:#0002;padding:3px 6px;border-radius:5px;font-size:10px}.notice{min-height:18px;margin-top:12px;color:var(--red);font-size:12px}.result-panel{min-height:640px;overflow:hidden;position:relative;display:grid;place-items:center}.empty,.working{text-align:center;color:var(--muted)}.empty h2,.working h2{color:var(--text);margin:22px 0 6px;font-family:Manrope}.empty p,.working p{margin:0}.orb{margin:auto;width:100px;height:100px;border-radius:36%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#d5ff7e,#8270ff 52%,#28253e 75%);box-shadow:0 20px 80px #896fff44;transform:rotate(9deg)}.orb span{font-size:30px;transform:rotate(-9deg)}.loader{margin:auto;width:76px;height:76px;border-radius:50%;border:2px solid #ffffff10;border-top-color:var(--lime);animation:spin 1s linear infinite}.result{width:100%;height:100%;position:absolute;inset:0}.result img{width:100%;height:calc(100% - 58px);object-fit:contain;background:#08090b}.result-actions{height:58px;padding:0 16px;display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px}.hidden{display:none!important}footer{width:min(1400px,92vw);margin:0 auto;padding:20px 0 32px;display:flex;justify-content:space-between;color:#585a63;font-size:11px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.35}}@media(max-width:850px){header{padding:0 16px}.runtime #statusText{display:none}.workspace{grid-template-columns:1fr}.result-panel{min-height:480px}main{padding-top:45px}.intro h1{font-size:50px}footer{flex-direction:column;gap:8px}}