:root{font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:#e7f3f6;background:#081220}*{box-sizing:border-box}body{margin:0}header{height:68px;display:flex;align-items:center;gap:24px;justify-content:space-between;border-bottom:1px solid #283b50;padding:0 max(22px,calc((100% - 1160px)/2))}.brand{font-weight:850;font-size:19px;color:#d7f7ee;text-decoration:none}header a{color:#c6ece5;text-decoration:none}.tag{font-size:11px;color:#8ce5ca;letter-spacing:2px}main{max-width:1160px;margin:auto;padding:55px 22px}.intro{display:grid;grid-template-columns:2fr 1fr;gap:44px;align-items:end}.eyebrow{color:#77dbb5;font-size:11px;font-weight:800;letter-spacing:3px}h1{font-size:clamp(38px,5vw,70px);line-height:1.02;margin:17px 0 20px;letter-spacing:-2px}p{line-height:1.65;color:#a6baca}.intro p{max-width:630px}.warn{background:#142536;border:1px solid #345066;padding:20px;border-radius:12px;color:#c0d3dd;line-height:1.65}.workspace{margin-top:52px;border:1px solid #2c4658;border-radius:16px;overflow:hidden;background:#101f30}.toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:17px 20px;border-bottom:1px solid #2b4356}button,.upload{background:#a3efcb;color:#09201b;padding:11px 16px;border:0;border-radius:7px;font-weight:750;cursor:pointer;font-size:13px}button:not(#export),button#clear{background:#21354a;color:#e4f7fa}button:disabled{opacity:.35;cursor:not-allowed}#filename{font-size:12px;color:#99b2c3;margin-left:auto;max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.panels{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(280px,1fr)}.canvas{min-width:0;border-right:1px solid #2b4356}.canvas-head{display:flex;justify-content:space-between;align-items:center;padding:19px 22px;font-size:13px;color:#c7e1ee}#sizeLabel{color:#95acbb}.preview{height:480px;display:flex;align-items:center;justify-content:center;padding:30px;background-color:#0b1927;background-image:linear-gradient(#1a2b392f 1px,transparent 1px),linear-gradient(90deg,#1a2b392f 1px,transparent 1px);background-size:22px 22px}.preview svg{width:100%;height:100%;max-width:100%;max-height:100%;display:block;object-fit:contain}.empty{color:#6e8ba0;text-align:center;max-width:240px;line-height:1.6}.results{padding:20px 22px}.results h2{margin:0 0 20px;font-size:20px}.metric{padding:12px 0;border-bottom:1px solid #263a4d;display:flex;justify-content:space-between;gap:12px;font-size:13px}.metric span{color:#9eafbe}.metric b{color:#d6f3e8}.warnings{font-size:13px;line-height:1.5;padding-top:17px}.warning{margin:10px 0;padding:11px;border-radius:7px;background:#263243;color:#f4dba6}.ok{color:#9df0c8}.fine{font-size:11px}.next{padding:54px 0 20px;max-width:750px}.next h2{font-size:25px}footer{text-align:center;color:#6f879b;border-top:1px solid #293a4c;padding:25px;font-size:12px}@media(max-width:800px){.intro,.panels{grid-template-columns:1fr}.canvas{border-right:0;border-bottom:1px solid #2b4356}.preview{height:350px}#filename{width:100%;margin:4px 0 0}}
