:root{color:#ecfeff;background:#030712;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;overflow:hidden}body{margin:0;min-width:320px;background:radial-gradient(circle at 18% 14%,rgb(34 211 238 / 22%),transparent 28%),radial-gradient(circle at 84% 18%,rgb(129 140 248 / 24%),transparent 30%),radial-gradient(circle at 56% 92%,rgb(14 165 233 / 12%),transparent 32%),linear-gradient(135deg,#020617,#08111f 52%,#050816)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(115deg,transparent 0 42%,rgb(34 211 238 / 10%) 48%,transparent 54% 100%),linear-gradient(rgb(148 163 184 / 5%) 1px,transparent 1px),linear-gradient(90deg,rgb(148 163 184 / 5%) 1px,transparent 1px);background-size:100% 100%,48px 48px,48px 48px}button,input,select,textarea{font:inherit}.page{display:grid;grid-template-columns:minmax(620px,1.04fr) minmax(420px,.96fr);gap:clamp(14px,1.5vw,22px);width:100%;height:100%;padding:clamp(14px,1.7vw,22px);animation:page-in .55s ease both}.panel{position:relative;min-height:0;overflow:hidden;border:1px solid rgb(103 232 249 / 18%);border-radius:30px;background:linear-gradient(145deg,#0f172ac2,#020617a8);box-shadow:0 28px 80px #0000005c,inset 0 1px #ffffff14;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.form-panel,.result-panel{padding:clamp(16px,1.8vw,24px)}.form-panel{display:grid;grid-template-rows:auto minmax(0,1fr)}.result-panel{display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:14px;animation:panel-in .65s ease .08s both}.header,.result-head{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:60px;margin-bottom:clamp(12px,1.3vw,18px)}.brand-title{display:inline-grid;grid-template-columns:auto auto auto;align-items:end;gap:8px;border:1px solid rgb(103 232 249 / 16%);border-radius:22px;background:linear-gradient(135deg,#0ea5e924,#4f46e51c);padding:8px 14px 9px;box-shadow:inset 0 1px #ffffff17,0 18px 50px #06b6d41a;font-weight:950;letter-spacing:-.04em;text-transform:uppercase}.brand-title span{color:#7dd3fc;font-size:clamp(16px,1.7vw,24px);line-height:1}.brand-title strong{background:linear-gradient(90deg,#f8fafc,#67e8f9);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:clamp(26px,3.1vw,40px);line-height:.9}.mode-pill,.result-head span{border:1px solid rgb(103 232 249 / 22%);border-radius:999px;background:#082f495c;color:#67e8f9;font-size:12px;font-weight:900;letter-spacing:.08em;padding:8px 12px;white-space:nowrap}h1,h2,p{margin:0}h1{background:linear-gradient(90deg,#f8fafc,#67e8f9 45%,#c4b5fd);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:clamp(30px,5vw,76px);font-weight:950;letter-spacing:-.07em;line-height:.9}h2{color:#e0f2fe;font-size:clamp(20px,1.9vw,28px)}.form{display:grid;grid-template-rows:auto auto minmax(190px,1fr) auto auto;gap:14px;min-height:0}.top-grid,.controls-grid{display:grid;gap:12px}.top-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.controls-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}.parameter-hint{align-self:end;grid-column:1 / -1;overflow:hidden;border:1px solid rgb(103 232 249 / 14%);border-radius:14px;background:#082f4938;color:#bae6fd;font-size:11px;font-weight:800;padding:8px 10px;text-overflow:ellipsis;white-space:nowrap}.prompt-field{min-height:0;gap:2px;align-content:start}.bottom-row{display:grid;grid-template-columns:minmax(0,1fr) 174px;gap:12px;align-items:stretch;min-height:64px}label{position:relative;display:grid;gap:7px;color:#a5f3fc;font-size:12px;font-weight:900;letter-spacing:.04em}input,textarea{width:100%;min-width:0;border:1px solid rgb(103 232 249 / 18%);border-radius:16px;background:#0307128c;color:#ecfeff;outline:none;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}input,.select-button{height:42px;padding:0 12px}input[type=number]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;background:linear-gradient(135deg,#0ea5e92e,#4f46e51a);font-weight:900}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{margin:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.select-button{display:flex;align-items:center;justify-content:space-between;width:100%;border:1px solid rgb(103 232 249 / 18%);border-radius:16px;background:linear-gradient(45deg,transparent 50%,#67e8f9 50%) calc(100% - 18px) 18px / 6px 6px no-repeat,linear-gradient(135deg,#67e8f9 50%,transparent 50%) calc(100% - 12px) 18px / 6px 6px no-repeat,linear-gradient(135deg,#0ea5e92e,#4f46e51a);color:#ecfeff;box-shadow:none;text-align:left}.select-button:hover:not(:disabled){transform:none;box-shadow:0 0 0 3px #22d3ee21,0 0 30px #22d3ee1a}.select-menu{position:absolute;z-index:20;top:calc(100% + 6px);left:0;right:0;overflow:hidden;border:1px solid rgb(103 232 249 / 26%);border-radius:16px;background:#020617fa;box-shadow:0 18px 45px #0000006b,0 0 0 1px #ffffff0d inset;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.select-menu button{display:block;width:100%;height:38px;border-radius:0;background:transparent;color:#e0f2fe;box-shadow:none;text-align:left}.select-menu button:hover{transform:none;background:#0ea5e92e;box-shadow:none}textarea{height:100%;min-height:150px;resize:none;padding:10px 14px 14px}.prompt-field textarea{margin-top:-2px}input::placeholder,textarea::placeholder{color:#64748b}input:focus,.select-button:focus,textarea:focus{border-color:#22d3ee;background:#080d20d1;box-shadow:0 0 0 3px #22d3ee21,0 0 30px #22d3ee1a}input:disabled{color:#67e8f9;background:#0f172a8f}.hint{overflow:hidden;color:#89a6c4;font-size:11px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}button{height:44px;border:0;border-radius:16px;background:linear-gradient(135deg,#06b6d4,#4f46e5);color:#fff;cursor:pointer;font-weight:950;padding:0 18px;box-shadow:0 18px 45px #4f46e542;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease}button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 20px 50px #22d3ee3d}input[type=file]{display:none}.upload-summary{display:flex;gap:10px;min-height:64px;align-items:stretch}.upload-trigger,.clear-upload{height:100%;min-height:64px;flex:1;border:1px solid rgb(103 232 249 / 18%);border-radius:18px;background:#0307128c;color:#ecfeff;text-align:left;padding:12px 14px;box-shadow:none}.upload-trigger span,.upload-trigger small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.upload-trigger small{margin-top:4px;color:#89a6c4;font-size:11px;font-weight:600}.clear-upload{flex:0 0 82px;background:#7f1d1d47;color:#fecaca}.upload-modal{width:min(520px,100%);border:1px solid rgb(103 232 249 / 22%);border-radius:22px;background:linear-gradient(145deg,#0f172af5,#020617f0);padding:24px;box-shadow:0 30px 90px #0000007f}.drop-zone{display:grid;place-items:center;justify-items:center;min-height:240px;border:1.5px dashed rgb(103 232 249 / 28%);border-radius:22px;background:radial-gradient(circle at top,rgb(34 211 238 / 10%),transparent 55%),#0206178f;padding:24px;text-align:center}.drop-zone.active{border-color:#22d3ee;box-shadow:inset 0 0 0 1px #22d3ee40,0 0 30px #22d3ee1a}.drop-zone strong{color:#f8fafc;font-size:22px;letter-spacing:-.04em}.drop-zone span{color:#8ba4c7;font-size:13px;font-weight:600}.drop-zone input{display:none}.top-grid,.bottom-row,.controls-grid{min-height:0}button:disabled{cursor:not-allowed;opacity:.65}.secondary{flex:1;border:1px solid rgb(103 232 249 / 18%);background:#0ea5e91f;color:#bae6fd;box-shadow:none}.icon-button{width:36px;height:36px;border-radius:999px;background:#94a3b824;color:#e0f2fe;font-size:24px;line-height:1;padding:0;box-shadow:none}.progress-wrap{display:grid;gap:8px}.progress-meta{display:flex;justify-content:space-between;color:#bae6fd;font-size:12px;font-weight:900}.progress-bar{overflow:hidden;height:10px;border:1px solid rgb(103 232 249 / 18%);border-radius:999px;background:#0f172ab8}.progress-bar div{height:100%;border-radius:inherit;background:linear-gradient(90deg,#22d3ee,#818cf8);box-shadow:0 0 22px #22d3ee8c;transition:width .35s ease}.error{border:1px solid rgb(248 113 113 / 25%);border-radius:16px;background:#7f1d1d47;color:#fecaca;padding:12px}.empty,.result-stage{display:grid;min-height:0;height:100%;place-items:center}.empty{align-content:center;gap:10px;border:1px dashed rgb(103 232 249 / 18%);border-radius:24px;color:#89a6c4;text-align:center}.empty strong{color:#67e8f9;font-size:clamp(42px,5vw,72px);letter-spacing:-.06em}.images{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,340px));justify-content:center;align-content:center;gap:12px;width:100%;max-height:100%;min-height:0;overflow:auto;scrollbar-width:none}.images::-webkit-scrollbar{display:none}.image-card{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:10px;width:min(100%,340px);height:min(100%,520px);min-height:280px;justify-self:center;border:1px solid rgb(103 232 249 / 14%);border-radius:24px;background:linear-gradient(145deg,#0206177a,#0f172a61);padding:10px}.image-card img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;border:1px solid rgb(103 232 249 / 16%);border-radius:18px;cursor:zoom-in}.preview-backdrop{background:#020617db}.preview-modal{position:relative;display:grid;place-items:center;width:min(92vw,1200px);height:min(90vh,900px);padding:18px}.preview-modal img{max-width:100%;max-height:100%;object-fit:contain;border:1px solid rgb(103 232 249 / 18%);border-radius:22px;box-shadow:0 24px 80px #0000007f}.preview-close{position:absolute;top:18px;right:18px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#020617bd;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:20px;animation:fade-in .2s ease both}.modal{width:min(680px,100%);max-height:min(680px,86vh);overflow:auto;border:1px solid rgb(103 232 249 / 22%);border-radius:22px;background:linear-gradient(145deg,#0f172af5,#020617f0);color:#e0f2fe;padding:24px;box-shadow:0 30px 90px #0000007f;animation:panel-in .24s ease both;scrollbar-width:none}.modal::-webkit-scrollbar{display:none}.modal-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.info-list{display:grid;gap:12px;margin:0}.info-list div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;border-bottom:1px solid rgb(103 232 249 / 14%);padding-bottom:12px}.info-list dt{color:#7dd3fc;font-weight:900}.info-list dd{margin:0;overflow-wrap:anywhere}@keyframes page-in{0%{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}@keyframes panel-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media (max-width: 1100px){.page{grid-template-columns:1fr;grid-template-rows:minmax(0,1.2fr) minmax(260px,.8fr)}.controls-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 680px){.page{padding:10px}.top-grid,.bottom-row,.controls-grid{grid-template-columns:1fr}.header,.result-head{align-items:flex-start;flex-direction:column}}
