:root{color:#e9eaee;font-synthesis:none;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--muted:#999da7;--line:#ffffff12;--accent:#9ebeff;background:#101114;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}body{height:100dvh;min-height:480px;margin:0;padding:20px}main{background:#222327;border:1px solid #ffffff16;border-radius:16px;flex-direction:column;min-width:0;max-width:1920px;height:100%;margin:auto;display:flex;overflow:hidden;box-shadow:0 24px 70px #0005}header{background:linear-gradient(#2d2e33,#292a2f);flex-shrink:0;justify-content:space-between;align-items:center;height:66px;padding:0 24px;display:flex}.brand{align-items:center;gap:11px;display:flex}.brand strong{letter-spacing:-.65px;font-size:18px;font-weight:600}.mark{align-items:center;gap:3px;display:flex}.mark i{background:#b9cfff;border-radius:2px;width:5px;height:18px}.mark i:nth-child(2){background:#e5ebfa;height:24px}.mark i:nth-child(3){background:#889ed1;height:13px}.badge{letter-spacing:1.2px;color:#b1b3bc;border:1px solid #ffffff19;border-radius:5px;margin-left:5px;padding:5px 7px;font-size:8px;font-weight:600}.local{color:#a2a6b1;font-size:11px}.local span{color:#9caf9f;margin-right:6px;font-size:7px}.toolbar{border-block:1px solid var(--line);background:#292a2f;flex-wrap:wrap;flex-shrink:0;align-items:center;gap:8px;padding:10px 20px;display:flex}button,select,input,summary{font:inherit;color:#e9eaf0;background:#ffffff08;border:1px solid #ffffff16;border-radius:7px;min-height:34px;padding:8px 12px;font-size:12px;transition:background .15s,border-color .15s}button,summary{cursor:pointer;touch-action:manipulation}button:hover,summary:hover{background:#ffffff13;border-color:#ffffff26}button:active{background:#ffffff1e}button:disabled,select:disabled,input:disabled{opacity:.38;cursor:default}.primary{color:#1d2c46;background:#dce6fa;border-color:#e9effb;font-weight:600;box-shadow:0 1px 2px #0002}.primary:hover{background:#f0f4ff;border-color:#fff}.primary:active{background:#c4d4f2}select{padding-right:24px}input{font-variant-numeric:tabular-nums;background:#17181c;width:100px}.divider{background:var(--line);width:1px;height:20px;margin:0 5px}label{color:#b5b8c1;align-items:center;gap:8px;font-size:11px;display:flex}.range-status{color:var(--muted);font-variant-numeric:tabular-nums;margin-left:4px;font-size:11px}.help{margin-left:auto}.help summary{text-align:center;border-radius:50%;width:34px;padding-inline:0;font-weight:600}.popover{position:relative}.popover summary{-webkit-user-select:none;user-select:none;list-style:none}.popover summary::-webkit-details-marker{display:none}.popover[open] summary{background:#ffffff16;border-color:#ffffff30}.panel{z-index:5;background:#2c2e34;border:1px solid #ffffff24;border-radius:14px;width:280px;padding:20px;font-size:12px;line-height:1.65;position:absolute;top:calc(100% + 10px);left:0;box-shadow:0 18px 50px #0009}.panel strong{letter-spacing:-.2px;font-size:14px;font-weight:600}.panel p{color:#b0b5c0;margin:8px 0 14px}.panel label{justify-content:space-between;margin:12px 0}.panel button{width:100%;margin-top:10px}.help .panel{width:310px;left:auto;right:0}.tabbar{border-bottom:1px solid var(--line);background:#222327;flex-shrink:0;align-items:stretch;gap:8px;min-height:54px;padding:10px 20px;display:flex}#tabs{scrollbar-width:thin;gap:6px;min-width:0;scroll-padding:8px;display:flex;overflow-x:auto}.tab{background:#ffffff03;border:1px solid #0000;border-radius:8px;flex-shrink:0;align-items:center;max-width:270px;display:flex}.tab.active{background:#393c45;border-color:#ffffff1c;box-shadow:0 1px 3px #0003}.tab button{background:0 0;border:0}.tab [role=tab]{text-overflow:ellipsis;white-space:nowrap;text-align:left;color:#a6abb6;max-width:220px;overflow:hidden}.tab.active [role=tab]{color:#f0f2f7}.tab .close{color:#9ca3b1;width:32px;min-height:32px;margin-right:2px;padding:0;font-size:17px}.tab .close:hover{color:#fff;background:#ffffff10}.tab[data-status=error]{border-color:#b46c6c}.tab[data-status=loading] [role=tab]:before,.tab[data-status=queued] [role=tab]:before{content:"· ";color:var(--accent)}#add{color:#a8aebb;background:0 0;border-color:#0000;flex-shrink:0;width:34px;padding:0;font-size:20px}.image-label{color:#c4c8d2;background:#191a1e;flex-shrink:0;justify-content:space-between;gap:16px;padding:10px 22px;font-size:11px;display:flex}#name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}#dimensions{color:#9298a5;white-space:nowrap}#stage{background:#111215;flex:1;min-height:120px;position:relative;overflow:hidden}canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block}canvas:active{cursor:grabbing}.overlay{text-align:center;background:#111215f5;flex-direction:column;justify-content:center;align-items:center;padding:24px;display:flex;position:absolute;inset:0;overflow:auto}.overlay h1{letter-spacing:-1.5px;margin:28px 0 0;font-size:clamp(25px,3.5vw,38px);font-weight:500;line-height:1.15}.overlay h2{font-size:20px;font-weight:500}.overlay p{color:#969da9;max-width:440px;margin:16px 0 20px;font-size:13px;line-height:1.8}.overlay button{min-width:180px;min-height:40px;margin-top:8px}.overlay small{letter-spacing:1.2px;color:#8991a0;margin-top:25px;font-size:9px}.privacy-note{color:#747d8e;margin-top:10px;font-size:10px}.empty-mark{flex-shrink:0;width:94px;height:64px;position:relative}.empty-mark span{background:linear-gradient(145deg,#394354,#202630);border:1px solid #aebfd44a;border-radius:10px;width:52px;height:60px;position:absolute;top:2px;left:21px;transform:rotate(-14deg)translate(-19px);box-shadow:0 6px 18px #0004}.empty-mark span:nth-child(2){background:linear-gradient(145deg,#4a5670,#252d3c);transform:rotate(13deg)translate(19px)}.empty-mark span:nth-child(3){background:linear-gradient(140deg,#7087ad,#35435c);border-color:#b2c6e478;transform:none}.empty-mark span:nth-child(3):after{content:"";background:linear-gradient(135deg,#0000 50%,#c9dcff22 50%);border:1px solid #d6e6ff75;border-radius:3px;position:absolute;inset:12px}.quiet{color:#a9c2ed;background:0 0;border-color:#0000}.quiet:hover{background:#ffffff08;border-color:#0000}.spinner{border:2px solid #3c4555;border-top-color:#9bbaf8;border-radius:50%;width:24px;height:24px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}footer{color:#a3a8b3;font-variant-numeric:tabular-nums;border-top:1px solid var(--line);background:#25262b;flex-shrink:0;align-items:center;gap:20px;padding:10px 20px;font-size:11px;display:flex}#status{margin-right:auto}#position{align-items:center;gap:8px;display:flex}#position input{width:90px;min-height:30px;padding:6px 8px}#position button{min-height:30px;padding:5px 10px}.sampling{color:#8c93a0}#zoom-status{color:#e6e9f1;text-align:right;min-width:66px;font-weight:600}#error,#warning{color:#969eae;flex-shrink:0;margin:0;padding:7px 20px;font-size:10px;line-height:1.5}#error{color:#ffb4b4}#error:empty,#warning:empty{display:none}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}@media (width<=760px){body{min-height:400px;padding:0}main{border:0;border-radius:0}header{height:56px;padding:0 max(16px,env(safe-area-inset-left));padding-top:env(safe-area-inset-top);height:calc(56px + env(safe-area-inset-top))}.brand strong{font-size:17px}.local{display:none}.toolbar{gap:6px;padding:8px 12px}button,select,summary{min-height:44px}input{min-height:44px;font-size:16px}.toolbar .divider,.range-status{display:none}.help summary{width:44px;padding-block:12px}.tabbar{min-height:56px;padding:6px 12px}.tab [role=tab]{max-width:180px}.tab .close{width:40px;min-height:44px}#add{width:44px}.image-label{padding:9px 14px;font-size:10px}footer{padding:8px 12px calc(8px + env(safe-area-inset-bottom));flex-wrap:wrap;gap:8px}#position{order:3;justify-content:center;width:100%}#position label{flex:1}#position input{width:100%;min-width:0;min-height:44px}#position button{min-width:44px;min-height:44px}.sampling{display:none}.panel,.help .panel{top:calc(112px + env(safe-area-inset-top));width:auto;max-height:calc(100dvh - 140px);position:fixed;left:12px;right:12px;overflow:auto}.overlay{padding:16px}.overlay button{min-height:44px}.overlay h1{margin-top:18px;font-size:28px}.overlay small{margin-top:16px}.overlay p{margin:12px 0}.badge{margin-left:0;font-size:7px}#error,#warning{max-height:54px;padding-inline:14px;overflow:auto}}@media (width<=380px){.toolbar #open{flex:1}.toolbar #display-menu{margin-left:auto}.toolbar{gap:5px}button,select,summary{padding-inline:9px}.badge{letter-spacing:.7px}.overlay .empty-mark{display:none}.overlay h1{margin-top:0}}@media (height<=560px){body{min-height:320px;padding:0}main{border-radius:0}header{height:40px;padding-top:0}.tabbar{padding-block:3px}.image-label{padding-block:5px}.overlay .empty-mark,.overlay small,.privacy-note{display:none}.overlay h1{margin-top:0;font-size:22px}.overlay p{margin:6px 0;font-size:12px}.overlay button{min-height:34px;margin-top:5px}.toolbar,footer{padding-block:5px}#position{order:initial;width:auto;margin-left:auto}#position label{flex:initial}#position input{width:70px}.panel,.help .panel{max-height:calc(100dvh - 104px);top:92px}#warning{max-height:28px;overflow:auto}}@media (prefers-reduced-motion:reduce){*{transition:none!important}.spinner{animation:none}}.panel .panel-close{color:#aeb6c5;background:0 0;border:0;width:32px;min-width:32px;min-height:32px;margin:0;padding:0;font-size:20px;position:absolute;top:6px;right:8px}.panel strong{padding-right:24px;display:block}@media (pointer:coarse){button,summary,select,.tab .close,#add,#position button{min-width:44px;min-height:44px}input,#position input{min-height:44px;font-size:16px}.panel .panel-close{width:44px;min-height:44px;top:0;right:0}}
