*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:#ddd;background:#1e1e1e;font-family:-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}button{font-family:inherit}.app{-webkit-user-select:none;user-select:none;flex-direction:column;width:100vw;height:100dvh;font-size:12px;display:flex}.menu-bar{background:#2b2b2b;border-bottom:1px solid #000;flex:none;align-items:center;gap:4px;height:32px;padding:0 8px;display:flex}.app-name{color:#e67e22;letter-spacing:.5px;margin-right:12px;font-weight:600}.menu{position:relative}.menu summary{cursor:pointer;color:#ccc;border-radius:3px;padding:6px 10px;list-style:none}.menu summary::-webkit-details-marker{display:none}.menu[open] summary,.menu summary:hover{background:#444}.menu-dropdown{z-index:50;background:#333;border:1px solid #111;border-radius:4px;flex-direction:column;min-width:180px;padding:4px;display:flex;position:absolute;top:28px;left:0;box-shadow:0 4px 12px #00000080}.menu-dropdown button{color:#ddd;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:3px;padding:6px 10px;font-size:12px}.menu-dropdown button:hover{color:#fff;background:#4b9eff}.app-body{flex:auto;min-height:0;display:flex}.toolbar{background:#2b2b2b;border-right:1px solid #000;flex-direction:column;flex:0 0 40px;align-items:center;gap:2px;padding:6px 0;display:flex}.tool-button{color:#ccc;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.tool-button:hover{background:#444}.tool-button.active{color:#fff;background:#4b9eff}.center-column{flex-direction:column;flex:auto;min-width:0;display:flex}.control-bar{color:#ccc;background:#2b2b2b;border-bottom:1px solid #000;flex:0 0 36px;align-items:center;gap:16px;padding:0 12px;display:flex}.color-input{align-items:center;gap:4px;display:flex}.color-input input[type=color]{background:0 0;border:1px solid #555;border-radius:3px;width:22px;height:22px;padding:0}.stroke-width-input{align-items:center;gap:4px;display:flex}.stroke-width-input input{width:48px}.canvas-area{cursor:default;background:#555;flex:auto;position:relative;overflow:hidden}.canvas-area canvas{background:#fff;position:absolute;inset:0}.status-bar{color:#aaa;background:#2b2b2b;border-top:1px solid #000;flex:0 0 28px;justify-content:flex-end;align-items:center;gap:8px;padding:0 12px;display:flex}.status-bar .icon-btn{color:#ccc;cursor:pointer;background:0 0;border:1px solid #555;border-radius:3px;width:20px;height:20px}.zoom-readout{text-align:center;cursor:pointer;width:48px}.right-panels{background:#2b2b2b;border-left:1px solid #000;flex-direction:column;flex:0 0 240px;display:flex;overflow-y:auto}.panel{border-bottom:1px solid #000;padding-bottom:8px}.panel-header{color:#ccc;text-transform:uppercase;letter-spacing:.5px;justify-content:space-between;align-items:center;padding:8px 10px;font-size:11px;font-weight:600;display:flex}.panel-header-actions{gap:2px;display:flex}.panel-empty{color:#777;margin:0;padding:0 10px}.icon-btn{color:#ccc;cursor:pointer;background:0 0;border:none;border-radius:3px;justify-content:center;align-items:center;width:22px;height:22px;display:inline-flex}.icon-btn:hover{background:#444}.field{color:#bbb;justify-content:space-between;align-items:center;gap:8px;padding:4px 10px;display:flex}.field input,.field select{color:#ddd;background:#1e1e1e;border:1px solid #555;border-radius:3px;width:100px;padding:2px 4px}.layer-list{max-height:260px;overflow-y:auto}.layer-row{color:#ccc;cursor:pointer;white-space:nowrap;align-items:center;gap:4px;padding:4px 10px;display:flex}.layer-row:hover{background:#383838}.layer-row.selected{color:#fff;background:#3a5a84}.layer-name{text-overflow:ellipsis;outline:none;overflow:hidden}.align-grid{grid-template-columns:repeat(4,1fr);gap:4px;padding:0 10px 8px;display:grid}.align-grid button{color:#ccc;cursor:pointer;background:#1e1e1e;border:1px solid #555;border-radius:3px;justify-content:center;align-items:center;height:28px;display:flex}.align-grid button:hover{background:#444}.pathfinder-grid{grid-template-columns:repeat(2,1fr);gap:4px;padding:0 10px;display:grid}.pathfinder-grid button{color:#ccc;cursor:pointer;background:#1e1e1e;border:1px solid #555;border-radius:3px;padding:6px 0}.pathfinder-grid button:hover{background:#444}.selection-overlay{pointer-events:none;position:absolute;inset:0}.selection-outline{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.selection-outline polygon{fill:none;stroke:#4b9eff;stroke-width:1px}.handle{pointer-events:auto;cursor:pointer;background:#fff;border:1.5px solid #4b9eff;border-radius:2px;width:10px;height:10px;position:absolute}.handle-rotate{cursor:grab;border-radius:50%;width:12px;height:12px}.text-edit-overlay{resize:none;background:0 0;border:1px dashed #4b9eff;outline:none;min-width:60px;min-height:1.4em;padding:0;font-family:Helvetica,Arial,sans-serif;line-height:1.2;position:absolute}.canvas-area,.selection-overlay .handle{touch-action:none}.app-mobile{overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;font-size:14px}.app-mobile .center-column{position:relative}.app-mobile .canvas-area{background:#3a3a3a}.mobile-chrome{pointer-events:none;z-index:10;--m-safe-top:max(env(safe-area-inset-top), 10px);--m-safe-bottom:max(env(safe-area-inset-bottom), 10px);--m-safe-left:max(env(safe-area-inset-left), 10px);--m-safe-right:max(env(safe-area-inset-right), 10px);position:absolute;inset:0}.m-pill{pointer-events:auto;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#242426eb;border:1px solid #ffffff14;border-radius:16px;align-items:center;gap:2px;padding:4px;display:flex;position:absolute;box-shadow:0 6px 20px #00000059}.m-pill button{color:#e6e6e6;touch-action:manipulation;background:0 0;border:none;border-radius:12px;justify-content:center;align-items:center;gap:6px;min-width:44px;height:44px;padding:0 10px;font-size:14px;display:inline-flex}.m-pill button:active{background:#ffffff1f}.m-pill button.active{color:#fff;background:#4b9eff}.m-pill button:disabled{color:#6a6a6a}.m-top-left{top:var(--m-safe-top);left:var(--m-safe-left)}.m-top-right{top:var(--m-safe-top);right:var(--m-safe-right)}.m-zoom{font-variant-numeric:tabular-nums;min-width:64px!important}.m-bottom{left:var(--m-safe-left);right:var(--m-safe-right);bottom:var(--m-safe-bottom);flex-direction:column;align-items:center;gap:8px;display:flex;position:absolute}.m-bottom .m-pill{max-width:100%;position:static}.m-dock{gap:4px}.m-dock button{width:48px;height:48px;padding:0}.m-shape-btn{position:relative}.m-flyout-mark{opacity:.7;border-bottom:5px solid;border-left:5px solid #0000;position:absolute;bottom:5px;right:5px}.m-shapes{flex-wrap:wrap;justify-content:center}.m-actions{scrollbar-width:none;touch-action:pan-x;overflow-x:auto}.m-actions button{color:#cfcfcf;flex-direction:column;flex:none;gap:2px;height:52px;font-size:11px}.m-style-btn{position:relative}.swatch{border:2px solid #fff9;border-radius:50%;width:20px;height:20px;display:inline-block}.swatch-stroke{background:0 0;border-width:5px}.swatch-none{background:linear-gradient(135deg,#0000 45%,#e5484d 45% 55%,#0000 55%),#fff;border-width:2px;border-color:#fff9}.m-style-btn .swatch{position:absolute}.m-style-btn .swatch:first-child{top:8px;left:8px}.m-style-btn .swatch:last-child{bottom:8px;right:8px}.app-mobile .handle:before{content:"";border-radius:50%;position:absolute;inset:-17px}.app-mobile .handle{width:12px;height:12px}.app-mobile .handle-rotate{width:16px;height:16px}.sheet{pointer-events:auto;max-height:min(62dvh,520px);padding-bottom:env(safe-area-inset-bottom);background:#262628;border-radius:18px 18px 0 0;flex-direction:column;transition:transform .16s ease-out;animation:.18s ease-out sheet-in;display:flex;position:absolute;bottom:0;left:0;right:0;box-shadow:0 -8px 30px #00000073}@keyframes sheet-in{0%{transform:translateY(100%)}}.sheet-header{touch-action:none;flex:none;justify-content:space-between;align-items:center;padding:18px 16px 8px;display:flex;position:relative}.sheet-grip{background:#555;border-radius:3px;width:36px;height:5px;margin-left:-18px;position:absolute;top:7px;left:50%}.sheet-title{color:#eee;font-size:16px;font-weight:600}.sheet-done{color:#fff;background:#4b9eff;border:none;border-radius:18px;height:36px;padding:0 14px;font-size:14px;font-weight:600}.sheet-body{overscroll-behavior:contain;flex:auto;padding:4px 0 16px;overflow-y:auto}.sheet-hint{color:#888;text-transform:uppercase;letter-spacing:.5px;margin:0 16px 8px;font-size:12px}.sheet-list{flex-direction:column;display:flex}.sheet-list button,.sheet-list-link{color:#e6e6e6;text-align:left;background:0 0;border:none;border-top:1px solid #333;align-items:center;gap:8px;min-height:48px;padding:0 20px;font-size:16px;text-decoration:none;display:flex}.sheet-list button:active,.sheet-list-link:active{background:#333}.sheet-grid{grid-template-columns:repeat(2,1fr);gap:8px;padding:0 16px;display:grid}.sheet-grid button{color:#ddd;background:#1e1e1e;border:1px solid #3c3c3c;border-radius:12px;align-items:center;gap:8px;height:52px;padding:0 14px;font-size:15px;display:flex}.sheet-style-row{gap:24px;padding:4px 16px 12px;display:flex}.sheet .color-input{color:#ddd;gap:10px;font-size:15px}.sheet .color-input input[type=checkbox]{width:22px;height:22px}.sheet .color-input input[type=color]{border-radius:10px;width:44px;height:44px}.sheet .panel{border-bottom:none}.sheet .panel>.panel-header:first-child:not(:has(.panel-header-actions)){display:none}.sheet .panel>.panel-header:first-child>span{visibility:hidden}.sheet .panel-header{padding:12px 16px 8px;font-size:12px}.sheet .field{min-height:48px;padding:4px 16px;font-size:15px}.sheet .field input,.sheet .field select{width:150px;height:36px;font-size:16px}.sheet .field output{text-align:right;color:#aaa;width:36px}.sheet .field input[type=range]{flex:auto;width:auto;height:28px}.sheet .panel-empty{padding:8px 16px}.sheet .layer-list{max-height:none}.sheet .layer-row{min-height:48px;font-size:15px}.sheet .icon-btn{width:40px;height:40px}.sheet .align-grid,.sheet .pathfinder-grid{gap:8px;padding:0 16px 12px}.sheet .align-grid button,.sheet .pathfinder-grid button{border-radius:10px;height:48px;font-size:15px}.app-mobile .text-edit-overlay{background:#fff9;min-width:120px}