:root{--bg:#0f1115;--card:#171a21;--line:#262b36;--text:#eef1f6;--muted:#9aa3b2;--accent:#7c5cff;--accent2:#22d3ee;--err:#ff6b6b}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}button{font:inherit;color:inherit;background:var(--card);border:1px solid var(--line);cursor:pointer;border-radius:12px;min-height:48px;padding:12px 18px}button:hover:not(:disabled){border-color:#3a4152}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,input:focus-visible{outline:3px solid var(--accent2);outline-offset:2px}.primary{background:linear-gradient(135deg,var(--accent),#5b8cff);border:0;font-weight:600}.big{border-radius:14px;padding:16px 32px;font-size:1.15rem}.shell{flex-direction:column;min-height:100dvh;display:flex}.top{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.brand{font-size:1.2rem;font-weight:700}.logo{color:var(--accent2)}.privacy{color:var(--muted);font-size:.85rem}.muted{color:var(--muted)}.tiny{margin:0;font-size:.78rem}.sr{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.error{color:var(--err);margin:8px 0}.landing{text-align:center;max-width:760px;margin:0 auto;padding:56px 20px}.landing h1{margin:0 0 12px;font-size:clamp(2rem,6vw,3.2rem);line-height:1.1}.sub{color:var(--muted);margin:0 0 32px;font-size:1.1rem}.drop{border:2px dashed var(--line);border-radius:20px;padding:44px 20px;transition:all .15s}.drop.over{border-color:var(--accent);background:#171a2b}.features{text-align:left;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:40px 0 0;padding:0;list-style:none;display:grid}.features li{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px}.features b{margin-bottom:4px;display:block}.features span{color:var(--muted);font-size:.9rem}.editor{flex:1;grid-template-columns:1fr 340px;gap:20px;width:100%;max-width:1300px;margin:0 auto;padding:20px;display:grid}.stage{flex-direction:column;gap:12px;min-width:0;display:flex}.canvasWrap{border:1px solid var(--line);background:#000;border-radius:16px;place-items:center;max-height:calc(100dvh - 190px);display:grid;position:relative;overflow:hidden}.layer{object-fit:contain;grid-area:1/1;width:auto;max-width:100%;height:auto;max-height:calc(100dvh - 190px);display:block}.divider{pointer-events:none;background:#fff;width:2px;position:absolute;top:0;bottom:0;box-shadow:0 0 8px #0008}.tag{background:#000a;border-radius:999px;padding:4px 10px;font-size:.75rem;position:absolute;top:10px}.tag.left{left:10px}.tag.right{right:10px}.spinner{border:3px solid #fff4;border-top-color:#fff;border-radius:50%;width:22px;height:22px;animation:.8s linear infinite sp;position:absolute;bottom:12px;right:12px}@keyframes sp{to{transform:rotate(360deg)}}.compare input{width:100%}.panel{background:var(--card);border:1px solid var(--line);border-radius:16px;flex-direction:column;align-self:start;gap:14px;padding:16px;display:flex}.presets{flex-wrap:wrap;gap:8px;display:flex}.chip{border-radius:999px;min-height:40px;padding:8px 16px}.chip.on{background:var(--accent);border-color:var(--accent)}.tool .row{justify-content:space-between;margin-bottom:6px;display:flex}.tool output{color:var(--muted);font-variant-numeric:tabular-nums}input[type=range]{width:100%;accent-color:var(--accent);height:28px}.actions{gap:8px;display:flex}.actions .primary,.actions button:only-child{flex:1}.actions button{flex:none}.actions:last-of-type button{flex:1}@media (max-width:860px){.editor{grid-template-columns:1fr;padding:12px}.canvasWrap,.layer{max-height:55dvh}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
