:root{--bg:#0d1013;--bg-2:#14181d;--card:#191e24;--card-2:#1f252c;--line:#2a323b;--text:#e7ecf1;--muted:#8c9aa8;--accent:#ff7a2f;--accent-2:#ffa163;--ok:#3ddc84;--warn:#ffc53d;--err:#ff5f56;--radius:12px;--font:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;font-size:14px;overflow:hidden}#app{flex-direction:column;height:100%;display:flex}.topbar{border-bottom:1px solid var(--line);z-index:5;background:linear-gradient(#171c22,#12161a);flex:none;justify-content:space-between;align-items:center;gap:16px;padding:10px 16px;display:flex}.brand{align-items:center;gap:12px;min-width:0;display:flex}.logo{filter:drop-shadow(0 2px 6px #ff7a2f66);font-size:26px;line-height:1}.brand h1{letter-spacing:-.01em;margin:0;font-size:16px;font-weight:650}.brand p{color:var(--muted);margin:2px 0 0;font-size:12px}.topbar-actions{align-items:center;gap:10px;display:flex}.badge-privacy{color:var(--ok);white-space:nowrap;background:#3ddc841a;border:1px solid #3ddc8440;border-radius:99px;padding:5px 10px;font-size:11.5px}.layout{flex:auto;min-height:0;display:flex}.panel{background:var(--bg-2);border-right:1px solid var(--line);scrollbar-width:thin;scrollbar-color:#303842 transparent;flex-direction:column;flex:0 0 330px;gap:12px;width:330px;padding:12px;display:flex;overflow-y:auto}.panel::-webkit-scrollbar{width:8px}.panel::-webkit-scrollbar-thumb{background:#303842;border-radius:8px}.viewport{background:radial-gradient(at 50% 40%,#1b222a 0%,#0d1013 70%);flex:auto;min-width:0;position:relative}#canvasHost{position:absolute;inset:0}#canvasHost canvas{display:block;width:100%!important;height:100%!important}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px}.card h2{color:var(--accent-2);text-transform:uppercase;letter-spacing:.05em;margin:0 0 12px;font-size:13px;font-weight:650}#dropZone{background:linear-gradient(#1a2027,#161b21);border:2px dashed #35404b;transition:border-color .15s,background .15s}#dropZone.hot{border-color:var(--accent);background:#ff7a2f14}.drop-inner{text-align:center;flex-direction:column;align-items:center;gap:8px;padding:8px 0;display:flex}.drop-icon{font-size:30px}.muted{color:var(--muted);font-size:12px}.field{margin-bottom:10px;display:block}.field>span{color:var(--muted);margin-bottom:5px;font-size:11.5px;display:block}input[type=number],select{background:var(--card-2);border:1px solid var(--line);width:100%;color:var(--text);font:inherit;border-radius:8px;outline:none;padding:8px 10px;font-size:13px;transition:border-color .15s}input[type=number]:focus,select:focus{border-color:var(--accent)}select{appearance:none;background-image:linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);cursor:pointer;background-position:calc(100% - 15px) 15px,calc(100% - 10px) 15px;background-repeat:no-repeat;background-size:5px 5px,5px 5px;padding-right:28px}.row{align-items:flex-end;gap:8px;display:flex}.row .field{flex:1;margin-bottom:0}.row.three .field{flex:1 1 0;min-width:0}.field .row{margin-bottom:0}.check{color:var(--muted);cursor:pointer;user-select:none;align-items:center;gap:8px;margin:10px 0 0;font-size:12.5px;display:flex}.check input{accent-color:var(--accent);cursor:pointer;width:15px;height:15px}button{font:inherit;cursor:pointer;border:1px solid #0000;border-radius:8px;transition:filter .15s,background .15s,border-color .15s}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:linear-gradient(180deg, var(--accent), #e9631b);color:#1a0d04;width:100%;padding:10px 14px;font-size:13.5px;font-weight:650;box-shadow:0 2px 10px #ff7a2f40}.primary:hover:not(:disabled){filter:brightness(1.08)}.primary.big{padding:13px;font-size:15px}.primary.sm,.ghost.sm{width:auto;padding:7px 14px;font-size:12.5px}.ghost{background:var(--card-2);border:1px solid var(--line);color:var(--text);padding:8px 12px;font-size:13px}.ghost:hover:not(:disabled){background:#262d35;border-color:#3d4854}.seg{background:var(--card-2);border:1px solid var(--line);border-radius:9px;margin-bottom:12px;padding:3px;display:flex}.seg-btn{color:var(--muted);background:0 0;flex:1;padding:7px;font-size:12.5px;font-weight:550}.seg-btn.active{background:var(--accent);color:#1a0d04}.kv{flex-direction:column;gap:6px;margin-bottom:12px;display:flex}.kv>div{justify-content:space-between;align-items:baseline;gap:10px;font-size:12.5px;display:flex}.kv span{color:var(--muted);flex:none}.kv b{text-align:right;word-break:break-word;min-width:0;font-weight:600}.hint{color:var(--muted);margin:8px 0 0;font-size:11.5px;line-height:1.45}.summary{background:var(--card-2);border:1px solid var(--line);color:var(--text);border-radius:8px;padding:10px;font-size:12.5px;line-height:1.5}.summary .big-num{color:var(--accent-2);font-weight:700}.warn{color:var(--warn);background:#ffc53d1a;border:1px solid #ffc53d4d;border-radius:8px;margin-top:10px;padding:9px 10px;font-size:11.5px;line-height:1.45}.progress{margin-top:12px}.progress .bar{background:var(--card-2);border:1px solid var(--line);border-radius:99px;height:6px;overflow:hidden}.progress .fill{background:linear-gradient(90deg, var(--accent), var(--accent-2));width:0%;height:100%;transition:width .2s}.progress span{color:var(--muted);margin-top:7px;font-size:11.5px;display:block}.pieces{flex-direction:column;gap:6px;max-height:320px;margin-top:12px;display:flex;overflow-y:auto}.piece{background:var(--card-2);border:1px solid var(--line);cursor:pointer;border-radius:8px;align-items:center;gap:9px;padding:8px 9px;font-size:12px;transition:border-color .15s;display:flex}.piece:hover{border-color:#46525f}.piece.dim{opacity:.45}.swatch{border-radius:3px;flex:none;width:11px;height:11px}.piece .meta{flex:1;min-width:0;line-height:1.35}.piece .meta b{font-weight:600;display:block}.piece .meta small{color:var(--muted);font-size:11px}.fit-ok{color:var(--ok)}.fit-bad{color:var(--err)}.dl{border:1px solid var(--line);color:var(--muted);background:0 0;flex:none;padding:4px 8px;font-size:11px}.dl:hover{color:var(--text);border-color:var(--accent)}.foot{color:#5c6975;text-align:center;margin-top:auto;padding:6px 4px 2px;font-size:10.5px;line-height:1.4}.view-tools{backdrop-filter:blur(10px);border:1px solid var(--line);z-index:3;background:#14181deb;border-radius:12px;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;max-width:calc(100% - 24px);padding:9px 14px;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.tool-group{align-items:center;gap:6px;display:flex}.slider{color:var(--muted);align-items:center;gap:8px;font-size:11.5px;display:flex}.slider input[type=range]{width:110px;accent-color:var(--accent);cursor:pointer}.chip{background:var(--card-2);border:1px solid var(--line);color:var(--muted);border-radius:7px;padding:6px 11px;font-size:11.5px}.chip:hover{color:var(--text)}.chip.active{border-color:var(--accent);color:var(--accent-2);background:#ff7a2f29}.empty-state{color:var(--muted);pointer-events:none;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:20px;display:flex;position:absolute;inset:0}.empty-state .es-icon{opacity:.5;font-size:54px}.empty-state h2{color:var(--text);margin:8px 0 0;font-size:17px}.empty-state p{margin:0;font-size:13px}.stats{border:1px solid var(--line);color:var(--muted);pointer-events:none;z-index:3;background:#14181de6;border-radius:9px;padding:8px 11px;font-size:11.5px;line-height:1.6;position:absolute;top:12px;right:12px}.stats b{color:var(--text);font-weight:600}.modal{backdrop-filter:blur(4px);z-index:50;background:#06080ab3;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal-box{background:var(--card);border:1px solid var(--line);border-radius:14px;width:100%;max-width:560px;max-height:80vh;padding:24px;font-size:13px;line-height:1.6;position:relative;overflow-y:auto}.modal-box h2{margin:0 0 14px;font-size:18px}.modal-box h3{color:var(--accent-2);margin:20px 0 8px;font-size:14px}.modal-box ol,.modal-box ul{margin:0;padding-left:20px}.modal-box li{margin-bottom:8px}.modal-box code{background:var(--card-2);border-radius:4px;padding:1px 5px;font-size:12px}.modal-x{background:var(--card-2);border:1px solid var(--line);color:var(--muted);border-radius:8px;width:30px;height:30px;font-size:13px;position:absolute;top:14px;right:14px}.modal-x:hover{color:var(--text)}@media (width<=860px){body{overflow:auto}.layout{flex-direction:column-reverse}.panel{border-right:none;border-top:1px solid var(--line);flex:auto;width:100%;overflow:visible}.viewport{flex:0 0 46vh;min-height:300px}.badge-privacy{display:none}.view-tools{gap:8px;padding:7px 10px}.slider input[type=range]{width:78px}}