*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden}body{background:#1a252f;color:#ecf0f1;font-family:Segoe UI,system-ui,sans-serif;font-size:12px}.app{display:flex;height:100%}.panel{width:312px;height:100%;background:linear-gradient(180deg,#2c3e50,#1a252f);overflow-y:auto;box-shadow:4px 0 20px #0000004d;display:flex;flex-direction:column}.panel-head{padding:10px 12px 8px;text-align:center;border-bottom:1px solid rgba(255,255,255,.08)}.panel-head h1{font-size:16px;letter-spacing:.04em}.panel-head .ver{font-size:9px;color:#7f8c8d;margin-top:2px}.nav{display:flex;flex-wrap:wrap;gap:3px;padding:8px 10px}.nav button{flex:1 1 28%;padding:5px 4px;font-size:10px;border:1px solid rgba(255,255,255,.15);background:#ffffff0f;color:#bdc3c7;border-radius:4px;cursor:pointer}.nav button.active{background:#3498db;color:#fff;border-color:#2980b9}.nav button:disabled{opacity:.4;cursor:default}.section{padding:8px 12px 12px}.section-title{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#95a5a6;margin-bottom:8px;padding-bottom:4px;border-bottom:1px solid rgba(255,255,255,.1)}.block-label{font-size:10px;color:#bdc3c7;margin:6px 0 3px}input[type=number],input[type=text],select,input[type=file]{width:100%;padding:4px 6px;background:#1a252f;border:1px solid rgba(255,255,255,.2);border-radius:4px;color:#ecf0f1;font-size:11px}input[type=number].short{width:64px;display:inline-block}.row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}button.btn{padding:6px 10px;cursor:pointer;border:1px solid rgba(255,255,255,.2);border-radius:4px;background:#ffffff14;color:#ecf0f1;font-size:11px}button.btn:hover{background:#ffffff26}button.btn.primary{background:#3498db;border-color:#2980b9;color:#fff}button.btn.good{background:#27ae60;border-color:#219a52;color:#fff}button.btn.danger{background:#c0392b;border-color:#922b21;color:#fff}button.btn:disabled{background:#4a5568;color:#a0aec0;cursor:default}.hint{font-size:9px;color:#7f8c8d;margin-top:4px;white-space:pre-line;line-height:1.35}.err{font-size:10px;color:#e74c3c;margin-top:6px}.ok{font-size:10px;color:#2ecc71;margin-top:6px}.light-card{border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:6px;margin-bottom:6px;background:#00000026}.footer-nav{margin-top:auto;padding:10px;display:flex;gap:6px;border-top:1px solid rgba(255,255,255,.08)}.footer-nav button{flex:1}.canvas-wrap{flex:1;position:relative;background:#2a2a2a}.canvas-wrap canvas{display:block;width:100%;height:100%}.zoom-bar{position:absolute;right:16px;bottom:16px;display:flex;align-items:center;gap:6px;background:#1a252fd9;padding:6px 8px;border-radius:6px;border:1px solid rgba(255,255,255,.12)}.ctx-menu{position:absolute;left:16px;top:16px;display:none;gap:4px;background:#1a252fe6;padding:6px;border-radius:6px}.ctx-menu.visible{display:flex}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:80}.modal-box{width:min(460px,92vw);background:#1f2a33;border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:16px;color:#ecf0f1}.modal-box h3{margin-bottom:10px}.modal-bar{height:8px;background:#111;border-radius:4px;overflow:hidden;margin:8px 0}.modal-bar>div{height:100%;background:linear-gradient(90deg,#3498db,#2ecc71);width:0}.te-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#1a1a2e;z-index:60;display:flex;flex-direction:column}.te-toolbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px;background:#16213e}.te-canvas-wrap{flex:1;position:relative;overflow:hidden}.te-canvas-wrap canvas{position:absolute;left:0;top:0}.te-status{padding:6px 10px;font-size:11px;color:#bdc3c7;display:flex;gap:12px;background:#0f1a2b}.toggle{display:flex;align-items:center;gap:6px;font-size:11px;color:#bdc3c7;margin-top:6px}