:root{--bg: #f4f6fb;--bg-panel: rgba(255, 255, 255, .72);--line: rgba(130, 145, 188, .16);--text: #27314e;--muted: #75809d;--shadow: 0 26px 80px rgba(117, 128, 168, .14);--shadow-soft: 0 16px 34px rgba(117, 128, 168, .1)}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{display:flex;align-items:center;justify-content:center;padding:28px;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:radial-gradient(circle at 50% 24%,rgba(206,220,255,.32),transparent 26%),radial-gradient(circle at 20% 18%,rgba(228,220,255,.32),transparent 20%),radial-gradient(circle at 78% 12%,rgba(205,255,243,.18),transparent 18%),linear-gradient(180deg,#f8faff,var(--bg));overflow-x:hidden}body.modal-open{overflow:hidden}.shell{position:relative;width:min(1200px,100%);min-height:86vh;overflow:hidden;isolation:isolate;border-radius:38px;border:1px solid rgba(255,255,255,.84);background:#ffffff9e;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--shadow)}.shell:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#ffffffb3,#ffffff6b);pointer-events:none}.backglow{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 42%,rgba(176,206,255,.24),transparent 22%),radial-gradient(circle at 48% 39%,rgba(220,196,255,.18),transparent 30%),radial-gradient(circle at 54% 46%,rgba(195,255,245,.12),transparent 18%);filter:blur(28px);opacity:.88;transform:translate(0) scale(1);transition:transform .8s ease,opacity .8s ease}.shell[data-state=processing] .backglow{opacity:1}.header{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:22px 28px;border-bottom:1px solid rgba(125,134,162,.1)}.brand{display:inline-flex;align-items:center;gap:12px;font-size:14px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}.brand-mark{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:5px;border-radius:10px;border:1px solid rgba(255,255,255,.72);background:linear-gradient(155deg,#a4c6fff2,#d6bfffdb 52%,#bef4ffd1);box-shadow:inset 0 1px 2px #ffffffb3,0 8px 18px #8aa9e847}.brand-mark svg{display:block;width:100%;height:100%}.nav-link{color:var(--muted);text-decoration:none;font-size:14px}.main{position:relative;z-index:1;min-height:calc(86vh - 77px);display:grid;place-items:center;padding:48px 24px 36px}.stage{width:100%;max-width:920px;display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}.eyebrow{padding:8px 14px;border:1px solid rgba(136,149,193,.14);border-radius:999px;background:#ffffff8f;box-shadow:var(--shadow-soft);color:var(--muted);font-size:12px}h1{margin:6px 0 0;max-width:720px;font-size:clamp(2.2rem,4vw,4rem);line-height:1.04;letter-spacing:-.045em;font-weight:600}.sub{max-width:640px;margin:0;color:var(--muted);font-size:1.04rem;line-height:1.7}.orb-wrap{position:relative;display:grid;place-items:center;width:100%;min-height:500px;margin-top:10px}.orb-wrap:before{content:"";position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,#ffffff42,#fff0 68%);filter:blur(18px);pointer-events:none}.orb-halo,.orb-caustics{position:absolute;pointer-events:none;transition:transform .65s ease,opacity .65s ease}.orb-halo,.orb-caustics{border-radius:50%}.orb-halo{width:520px;height:520px;opacity:.9;background:radial-gradient(circle,#bad0ff52,#dac2ff33 38%,#fff0 72%);filter:blur(42px);animation:haloPulse 8s ease-in-out infinite;mix-blend-mode:screen}.orb-caustics{width:430px;height:430px;opacity:.52;filter:blur(18px);mix-blend-mode:screen;background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.8),transparent 15%),radial-gradient(circle at 69% 43%,rgba(205,229,255,.5),transparent 14%),radial-gradient(circle at 46% 72%,rgba(230,205,255,.42),transparent 17%);animation:causticsDrift 12s linear infinite}.orb-button{position:relative;z-index:2;width:320px;height:320px;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;transition:transform .5s ease,opacity .5s ease}.orb-button:disabled{cursor:progress}.orb-button:after{content:"";position:absolute;inset:6%;border-radius:50%;border:0;box-shadow:none;opacity:0;transform:scale(.94);transition:transform .45s ease,opacity .45s ease;pointer-events:none}.orb-loader{position:absolute;inset:0;z-index:3;display:grid;place-items:center;gap:12px;color:var(--muted);pointer-events:none;opacity:1;visibility:visible;transform:translateY(0) scale(1);transition:opacity .4s ease,transform .4s ease,visibility 0s linear 0s}.orb-loader-ring{width:54px;height:54px;border-radius:50%;border:2.5px solid rgba(137,152,195,.24);border-top-color:#7ca2ffdb;border-right-color:#cebcffe6;animation:orbLoaderSpin 1.1s linear infinite}.orb-loader-text{font-size:13px;letter-spacing:.01em}#orbCanvas{position:absolute;inset:0;display:block;width:100%;height:100%;border-radius:50%;filter:drop-shadow(0 32px 88px rgba(132,145,198,.24));transition:transform .45s ease,filter .45s ease,opacity .45s ease}.shell[data-orb-ready=false] #orbCanvas{opacity:.14}.shell[data-orb-ready=true] .orb-loader{opacity:0;visibility:hidden;transform:translateY(8px) scale(.96);transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s}.orb-wrap:hover .orb-halo,.orb-wrap:hover .orb-caustics{transform:scale(1.04);opacity:1}.orb-button:hover #orbCanvas,.orb-button:focus-visible #orbCanvas{transform:scale(1.03) translateY(-2px);filter:drop-shadow(0 40px 106px rgba(132,145,198,.3))}.shell[data-state=opening] .orb-button,.shell[data-state=upload] .orb-button{transform:scale(.8);opacity:.28}.shell[data-state=processing] .orb-button,.shell[data-state=result] .orb-button{transform:scale(.8);opacity:0;pointer-events:none}.shell[data-state=opening] .orb-halo{transform:scale(1.18);opacity:1}.shell[data-dragover=true] .orb-halo{transform:scale(1.24);opacity:1}.shell[data-state=processing] .orb-halo{transform:scale(1.14);opacity:1}.shell[data-state=processing] .orb-halo,.shell[data-state=processing] .orb-caustics,.shell[data-state=result] .orb-halo,.shell[data-state=result] .orb-caustics{transform:scale(.9);opacity:0}.shell[data-dragover=true] .orb-caustics{transform:scale(1.08);opacity:1}.shell[data-dragover=true] .orb-button{transform:scale(.76);opacity:.18}.hint{margin:6px 0 0;color:var(--muted);font-size:1rem;letter-spacing:-.02em}.recent-downloads{width:min(920px,100%);margin-top:6px;padding:18px;border-radius:24px;border:1px solid rgba(129,141,184,.14);background:#ffffff94;box-shadow:var(--shadow-soft);text-align:left}.recent-downloads-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.recent-downloads-head h2{margin:0;font-size:1.2rem;letter-spacing:-.02em}.recent-downloads-head .ghost{height:40px;padding:0 14px;font-size:14px}.recent-downloads-head .ghost.is-loading{position:relative;padding-left:36px;cursor:progress;opacity:.88}.recent-downloads-head .ghost.is-loading:before{content:"";position:absolute;left:14px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;border:2px solid rgba(116,137,193,.26);border-top-color:#6085e0e6;animation:orbLoaderSpin .8s linear infinite}.recent-empty{margin:10px 0 0;color:var(--muted)}.recent-grid{margin-top:12px;display:flex;flex-direction:column;gap:12px}.recent-grid.is-clearing{pointer-events:none}.recent-grid.is-clearing .recent-item{animation:recentRowClear .36s cubic-bezier(.2,.8,.2,1) forwards}.recent-grid.is-clearing .recent-item:nth-child(2){animation-delay:.03s}.recent-grid.is-clearing .recent-item:nth-child(3){animation-delay:.06s}.recent-grid.is-clearing .recent-item:nth-child(4){animation-delay:.09s}.recent-grid.is-clearing .recent-item:nth-child(5){animation-delay:.12s}.recent-grid.is-clearing .recent-item:nth-child(6){animation-delay:.15s}.recent-grid[hidden],.recent-empty[hidden]{display:none!important}.recent-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:18px;border:1px solid rgba(129,141,184,.2);background:#ffffffd6}.recent-thumb{position:relative;width:64px;height:64px;margin:0;overflow:hidden;border-radius:12px;border:1px solid rgba(129,141,184,.16);background:linear-gradient(180deg,#f8fbfff2,#f1f6fff2);flex:0 0 auto}.recent-thumb img{width:100%;height:100%;object-fit:cover}.recent-meta{display:grid;gap:4px;min-width:0;flex:1}.recent-name{margin:0;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recent-info{margin:0;color:var(--muted);font-size:12px;line-height:1.45}.recent-actions{display:flex;gap:8px;margin-left:auto;flex:0 0 auto}[dir=rtl] .recent-downloads,[dir=rtl] .error-modal-card{text-align:right}[dir=rtl] .recent-actions{margin-left:0;margin-right:auto}[dir=rtl] .recent-downloads-head .ghost.is-loading{padding-left:14px;padding-right:36px}[dir=rtl] .recent-downloads-head .ghost.is-loading:before{left:auto;right:14px}.recent-actions .button,.recent-actions .ghost{height:36px;padding:0 12px;font-size:13px;border-radius:12px;flex:0 0 auto;white-space:nowrap}.upload-panel,.processing,.result-panel{width:min(720px,100%)}.orb-panel{position:absolute;z-index:3;left:50%;bottom:14px;width:min(470px,calc(100% - 32px));padding:18px;border-radius:30px;border:1px solid rgba(255,255,255,.8);background:var(--bg-panel);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 30px 70px #7580a829;opacity:0;pointer-events:none;transform:translate(-50%,24px) scale(.88);transition:opacity .45s ease,transform .55s cubic-bezier(.2,.8,.2,1)}.shell[data-state=upload] .orb-panel.active{opacity:1;pointer-events:auto;transform:translate(-50%) scale(1)}.shell[data-dragover=true] .orb-panel.active{transform:translate(-50%,-6px) scale(1);box-shadow:0 34px 88px #7580a833}.dropzone{position:relative;overflow:hidden;min-height:250px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:28px 24px;border-radius:24px;border:1.5px dashed rgba(139,153,196,.28);background:linear-gradient(180deg,#ffffffb8,#f4f7ffd1);transition:border-color .25s ease,background .25s ease,transform .25s ease,box-shadow .25s ease}.dropzone:after{content:"";position:absolute;inset:6px;border-radius:18px;border:1px solid transparent;opacity:0;transition:opacity .25s ease,border-color .25s ease;pointer-events:none}.dropzone.dragover{border-color:#7da2ff94;background:linear-gradient(180deg,#f0f5ffeb,#fafafff5);transform:scale(1.015)}.dropzone.dropzone-ready{border-color:#6799ffd1;background:linear-gradient(180deg,#e8f1fffa,#f6f9fffa);transform:none;box-shadow:0 22px 48px #6688cd33}.dropzone.dropzone-ready:after{border-color:#83b3ffd1;opacity:1}.drop-icon{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;border:1px solid rgba(129,141,184,.14);background:linear-gradient(180deg,#ffffffe0,#f0f3ffeb);color:var(--muted);box-shadow:var(--shadow-soft);transition:transform .25s ease,background .25s ease,box-shadow .25s ease,color .25s ease}.dropzone.dropzone-ready .drop-icon{transform:translateY(-2px);background:linear-gradient(180deg,#f5fafffa,#e6f0fffa);color:#4666b5;box-shadow:0 16px 30px #6e8ed63d}.dropzone.dropzone-ready h3{color:#35539b}.dropzone.dropzone-ready .panel-text{color:#566993}.dropzone h3,.processing-title,.result-panel h3{margin:0;font-size:1.65rem;font-weight:600;letter-spacing:-.03em}.panel-text,.processing-copy,.footer-note{margin:0;color:var(--muted);line-height:1.65}.separator{width:100%;display:flex;align-items:center;gap:12px;margin:4px 0;color:var(--muted);font-size:14px;transition:opacity .22s ease,transform .22s ease}.separator:before,.separator:after{content:"";flex:1;height:1px;background:var(--line)}.file-meta{color:var(--muted);font-size:13px}.dropzone .inline-action{height:40px;padding:0 14px;font-size:13px}.dropzone .inline-action[hidden]{display:none!important}.dropzone label.button[for=fileInput]{transition:opacity .22s ease,transform .22s ease}.dropzone.dropzone-ready .separator,.dropzone.dropzone-ready label.button[for=fileInput]{opacity:0;transform:translateY(-4px);pointer-events:none}input[type=file]{display:none}.button,.ghost{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 22px;border-radius:16px;border:1px solid rgba(128,141,185,.18);font-size:15px;font-weight:600;text-decoration:none;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,background .25s ease}.button{background:#ffffffe0;color:var(--text);box-shadow:var(--shadow-soft)}.ghost{background:#ffffff7a;color:var(--muted)}.button:hover,.ghost:hover{transform:translateY(-1px);box-shadow:0 16px 28px #7580a824}.processing,.result-panel{position:absolute;z-index:4;left:50%;top:50%;width:min(560px,calc(100% - 32px));border-radius:28px;border:1px solid rgba(129,141,184,.14);background:#ffffffad;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--shadow-soft);padding:22px;opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.92);transition:opacity .4s ease,transform .5s cubic-bezier(.2,.8,.2,1)}.processing.active,.result-panel.active{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}.progress-track{width:100%;height:8px;margin-top:16px;overflow:hidden;border-radius:999px;background:#a8b3d92e}.progress-bar{width:36%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#9bbeffb3,#d8bcffd9,#b8fff2b8);box-shadow:0 0 18px #9bbeff59;animation:loading 1.7s ease-in-out infinite}.processing-copy{margin-top:12px}.result-card{position:relative;display:grid;place-items:center;margin-top:18px;overflow:hidden;border-radius:24px;border:1px solid rgba(129,141,184,.14);background:#fff;box-shadow:var(--shadow-soft);aspect-ratio:16 / 9}.result-card img{display:block;width:100%;height:100%;object-fit:cover}.result-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:20px}.footer-note{margin-top:8px;font-size:13px}.error-modal{position:fixed;inset:0;z-index:16;display:grid;place-items:center;padding:20px}.error-modal[hidden]{display:none!important}.error-modal-backdrop{position:absolute;inset:0;background:#181e306b;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.error-modal-card{position:relative;width:min(520px,100%);padding:24px;border-radius:28px;border:1px solid rgba(255,255,255,.86);background:#ffffffe6;box-shadow:0 28px 78px #35436a4d;text-align:left;animation:modalIn .22s ease-out}.error-modal-kicker{margin:0 0 10px;color:#6e4a37;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.error-modal-card h2{margin:0;font-size:clamp(1.4rem,2.8vw,1.9rem);letter-spacing:-.02em}.error-modal-card p{margin:12px 0 0;color:var(--muted);line-height:1.6}.error-modal-details{padding:10px 12px;border-radius:12px;border:1px solid rgba(125,134,162,.16);background:#f7f9ffe6;font-size:13px;color:#4b5777;word-break:break-word}.error-modal-actions{display:flex;justify-content:flex-end;margin-top:16px}@keyframes haloPulse{0%,to{transform:scale(1);opacity:.9}50%{transform:scale(1.05);opacity:1}}@keyframes causticsDrift{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.04)}to{transform:rotate(360deg) scale(1)}}@keyframes panelIn{0%{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes loading{0%{transform:translate(-70%)}50%{transform:translate(80%)}to{transform:translate(220%)}}@keyframes orbLoaderSpin{to{transform:rotate(360deg)}}@keyframes recentRowClear{to{opacity:0;transform:translate(18px) scale(.985)}}@keyframes modalIn{0%{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:900px){body{padding:16px}.shell{min-height:auto}.main{padding:36px 18px 28px}.orb-wrap{min-height:420px}.orb-button{width:250px;height:250px}.orb-halo{width:400px;height:400px}.orb-caustics{width:330px;height:330px}.orb-outline{width:284px;height:284px}.orb-outline-2{width:330px;height:330px}.orb-panel,.processing,.result-panel{width:min(100%,calc(100vw - 48px))}.recent-downloads{padding:14px}.recent-item{gap:10px;padding:9px 10px}.recent-thumb{width:56px;height:56px}.recent-actions .button,.recent-actions .ghost{height:32px;padding:0 9px;font-size:12px}}@media(prefers-reduced-motion:reduce){.orb-halo,.orb-caustics,.progress-bar,.orb-loader-ring{animation:none}.recent-grid.is-clearing .recent-item{animation:none;opacity:.5}.recent-downloads-head .ghost.is-loading:before{animation:none}.backglow,#orbCanvas,.orb-button,.orb-panel,.dropzone,.error-modal-card,.button,.ghost{transition:none}.error-modal-card{animation:none}}
