@font-face{font-family:Manrope;src:url(/fonts/Manrope-regular.ttf)format("truetype");font-weight:400}@font-face{font-family:Manrope;src:url(/fonts/Manrope-bold.ttf)format("truetype");font-weight:700}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b0f14;--bg-2:#0f141b;--panel:#111821;--panel-2:#151d27;--panel-3:#1a2330;--border:#ffffff14;--border-strong:#ffffff29;--text:#f3f6fb;--text-soft:#d5dde7;--muted:#93a1b3;--steel:#7f8c9d;--steel-2:#5f6c7b;--steel-3:#2a3441;--danger:#ff7b7b;--shadow:0 18px 48px #00000059}*{box-sizing:border-box}html,body,#root{min-height:100%}body{color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;background:radial-gradient(circle at top,#18212c 0%,#0f141b 38%,#0b0f14 100%);margin:0;font-family:Manrope,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,textarea{appearance:none;font-family:inherit}.loginScreen{background:radial-gradient(circle at 50% 10%,#78889c1f,#0000 35%),linear-gradient(#090c11 0%,#0b0f14 100%);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.loginPanel{opacity:1;flex-direction:column;gap:34px;width:min(100%,480px);transition:opacity 1.2s,transform 1.2s,filter 1.2s;animation:1s forwards loginPanelAppear;display:flex;transform:translateY(0)}.loginPanelIdle{opacity:.2;filter:blur(.4px);transform:translateY(8px)}.loginInput{color:#fffffff5;letter-spacing:.2px;opacity:0;appearance:none;background:0 0;border:none;border-bottom:1px solid #ffffff61;border-radius:0;outline:none;width:100%;height:62px;padding:0;font-size:24px;font-weight:400;line-height:62px;transition:border-bottom-color .35s,opacity .8s,color .35s;animation:.9s forwards loginInputAppear}.loginInputEmail{animation-delay:.2s}.loginInputPassword{animation-delay:.42s}.loginInput::placeholder{color:#ffffff85;transition:color .35s}.loginInput:focus{border-bottom-color:#fffffff0}.loginInput:focus::placeholder{color:#ffffffd1}.loginInput:disabled{opacity:.55}.loginError{color:var(--danger);letter-spacing:.3px;margin-top:-18px;font-size:14px;animation:.35s forwards loginErrorAppear}.loginHiddenButton{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}@keyframes loginPanelAppear{0%{opacity:0;filter:blur(4px);transform:translateY(22px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes loginInputAppear{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes loginErrorAppear{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.authTopBar{min-height:58px;color:var(--text);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:20;background:#090c11e0;justify-content:space-between;align-items:center;gap:12px;padding:12px 24px;font-size:13px;display:flex;position:sticky;top:0}.authLogoutButton{border:1px solid var(--border-strong);height:38px;color:var(--text);cursor:pointer;background:linear-gradient(#232d38 0%,#1b232d 100%);border-radius:12px;padding:0 16px;font-size:13px;font-weight:700;transition:transform .18s,border-color .18s,background .18s}.authLogoutButton:hover{background:linear-gradient(#2a3542 0%,#202a34 100%);border-color:#ffffff3d;transform:translateY(-1px)}.editor{grid-template-columns:320px minmax(0,1fr);gap:24px;min-height:calc(100vh - 58px);padding:24px;display:grid}.editorSidebar,.canvasArea,.resultPanel{border:1px solid var(--border);box-shadow:var(--shadow);background:linear-gradient(#151d27fa 0%,#111821fa 100%)}.editorSidebar{border-radius:24px;flex-direction:column;gap:16px;padding:20px;display:flex}.editorLogo{color:var(--text);letter-spacing:-.02em;font-size:24px;font-weight:700}.uploadButton{color:#fff;cursor:pointer;background:linear-gradient(#3d4a58 0%,#2c3642 100%);border:1px solid #ffffff24;border-radius:14px;justify-content:center;align-items:center;width:100%;min-height:48px;padding:0 16px;font-size:14px;font-weight:700;transition:transform .18s,background .18s,border-color .18s;display:flex}.uploadButton:hover{background:linear-gradient(#485666 0%,#33404d 100%);border-color:#ffffff38;transform:translateY(-1px)}.uploadButton input{display:none}.toolCard{border:1px solid var(--border);background:#ffffff05;border-radius:18px;align-items:center;gap:12px;width:100%;padding:14px;display:flex}.toolCard.active{background:#94a3b814;border-color:#9faebf80}.toolIcon{width:38px;height:38px;color:var(--text);background:linear-gradient(#303b48 0%,#252f3a 100%);border:1px solid #ffffff14;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;font-size:20px;display:flex}.toolTitle{color:var(--text);font-size:15px;font-weight:700}.toolDescription{color:var(--muted);margin-top:3px;font-size:12px;line-height:1.45}.modeBox{flex-direction:column;gap:10px;display:flex}.modeSegmented{background:#ffffff09;border:1px solid #ffffff14;border-radius:18px;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:6px;display:grid}.modeSegment{min-height:72px;color:var(--text-soft);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:14px;padding:12px 13px;transition:background .18s,color .18s,transform .18s,opacity .18s,box-shadow .18s}.modeSegment:hover:not(:disabled){background:#ffffff0a;transform:translateY(-1px)}.modeSegment.active{color:#fff;background:linear-gradient(#3d4a58 0%,#2b3541 100%);box-shadow:0 10px 24px #0003,inset 0 1px #ffffff14}.modeSegment:disabled{opacity:.5;cursor:not-allowed}.modeSegmentTitle{font-size:13px;font-weight:700;line-height:1.25;display:block}.modeSegmentMeta{opacity:.82;margin-top:4px;font-size:11px;line-height:1.4;display:block}.promptBox{flex-direction:column;gap:8px;display:flex}.fieldLabel{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);font-size:12px;font-weight:700}.promptInput{resize:vertical;border:1px solid var(--border);width:100%;min-height:128px;color:var(--text);background:#0f141b;border-radius:16px;outline:none;padding:14px 16px;font-size:14px;line-height:1.5;transition:border-color .2s,box-shadow .2s,background .2s}.promptInput::placeholder{color:#7c8897}.promptInput:focus{border-color:#9faebf8c;box-shadow:0 0 0 4px #94a3b81f}.primaryButton,.secondaryButton{cursor:pointer;border-radius:14px;width:100%;min-height:46px;font-size:14px;font-weight:700;transition:transform .18s,opacity .18s,background .18s,border-color .18s}.primaryButton{color:#fff;background:linear-gradient(#495868 0%,#343f4c 100%);border:1px solid #ffffff24}.primaryButton:hover:not(:disabled){background:linear-gradient(#566678 0%,#3b4856 100%);transform:translateY(-1px)}.secondaryButton{border:1px solid var(--border);color:var(--text);background:#ffffff0a}.secondaryButton:hover:not(:disabled){background:#ffffff12;transform:translateY(-1px)}.primaryButton:disabled,.secondaryButton:disabled{opacity:.45;cursor:not-allowed;transform:none}.debugBox,.statusBox{border:1px solid var(--border);color:var(--text-soft);background:#ffffff08;border-radius:16px;padding:14px;font-size:13px;line-height:1.65}.debugTitle{color:var(--text);margin-bottom:6px;font-weight:700}.statusBox{color:#c6d0dc;background:#94a3b814;border-color:#9faebf2e}.editorWorkspace{grid-template-columns:minmax(0,1fr) 360px;gap:24px;min-width:0;display:grid}.canvasArea{border-radius:28px;justify-content:center;align-items:center;min-height:calc(100vh - 106px);padding:24px;display:flex;overflow:auto}.canvasFrame{isolation:isolate;-webkit-user-select:none;user-select:none;background:#0b0f14;border-radius:22px;flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 24px 60px #0000005c}.canvas{cursor:crosshair;z-index:1;touch-action:none;-webkit-user-select:none;user-select:none;background:#0b0f14;border-radius:20px;width:auto;max-width:none;height:auto;max-height:none;display:none;position:relative}.canvas.visible{display:block}.generationOverlay{z-index:5;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:radial-gradient(circle,#94a3b814,#0000 42%),#070a0e75;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.generationOverlayCard{text-align:center;background:linear-gradient(#141b24f0 0%,#0e131bf0 100%);border:1px solid #ffffff1a;border-radius:20px;width:min(88%,360px);padding:22px 20px 18px;box-shadow:0 18px 50px #0000005c,inset 0 1px #ffffff0d}.generationLoader{border:3px solid #ffffff1f;border-top-color:#fffffff5;border-radius:999px;width:50px;height:50px;margin:0 auto;animation:.9s linear infinite generationSpin}.generationTitle{color:var(--text);letter-spacing:-.02em;margin-top:14px;font-size:18px;font-weight:700}.generationText{color:var(--text-soft);margin-top:8px;font-size:13px;line-height:1.5}@keyframes generationSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.emptyState{text-align:center;max-width:420px}.emptyTitle{color:var(--text);letter-spacing:-.02em;font-size:28px;font-weight:700}.emptyText{color:var(--muted);margin-top:10px;font-size:15px;line-height:1.6}.resultPanel{border-radius:28px;flex-direction:column;min-height:calc(100vh - 106px);padding:20px;display:flex;overflow:hidden}.panelTitle{color:var(--text);margin-bottom:14px;font-size:18px;font-weight:700}.smallEmpty{color:var(--muted);font-size:14px;line-height:1.6}.resultList{flex-direction:column;gap:16px;min-height:0;margin-top:14px;display:flex;overflow:auto}.resultItem{border:1px solid var(--border);background:#ffffff08;border-radius:18px;padding:14px}.resultLabel{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;font-size:12px;font-weight:700}.resultItem img{border:1px solid var(--border);background:#0f141b;border-radius:14px;width:100%;display:block}.resultPrompt{color:var(--text-soft);word-break:break-word;margin-top:10px;font-size:13px;line-height:1.55}.maskPreviewFrame{background-image:linear-gradient(45deg,#313a46 25%,#0000 25%),linear-gradient(-45deg,#313a46 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#313a46 75%),linear-gradient(-45deg,#0000 75%,#313a46 75%);background-position:0 0,0 9px,9px -9px,-9px 0;background-size:18px 18px;border-radius:14px;padding:8px}.maskPreviewFrame img{border-radius:10px;width:100%;display:block}@media (width<=1180px){.editor{grid-template-columns:300px minmax(0,1fr)}.editorWorkspace{grid-template-columns:minmax(0,1fr) 320px}}@media (width<=980px){.editor,.editorWorkspace{grid-template-columns:1fr}.canvasArea,.resultPanel{min-height:auto}.resultPanel,.resultList{overflow:visible}}@media (width<=720px){.loginScreen{padding:28px}.loginPanel{gap:28px;width:100%}.loginInput{height:58px;font-size:21px}.authTopBar{flex-direction:column;align-items:flex-start;padding:12px 16px}.editor{gap:16px;padding:16px}.editorSidebar,.canvasArea,.resultPanel{border-radius:22px}.canvasArea,.resultPanel{padding:16px}.modeSegmented{grid-template-columns:1fr}.emptyTitle{font-size:24px}.emptyText{font-size:14px}}.canvasLegend{z-index:3;color:#f3f6fbeb;pointer-events:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#070a0eb8;border:1px solid #ffffff1f;border-radius:999px;max-width:calc(100% - 28px);padding:9px 12px;font-size:12px;font-weight:700;line-height:1.35;position:absolute;bottom:14px;left:14px}.contextDivider{background:#ffffff14;height:1px;margin:10px 0}.smallDebugTitle{color:#d5dde7eb;letter-spacing:.03em;text-transform:uppercase;margin-top:8px;margin-bottom:2px;font-size:12px}.contextHint{color:var(--muted);border-top:1px solid #ffffff14;margin-top:12px;padding-top:10px;font-size:12px;line-height:1.55}
