:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;--canvas-height: 600px;--text-color: #e9ecef;--bg-color: #1b1e23;--panel-bg: #20242a;--panel-bg-strong: #252a31;--panel-border: #303741;--panel-border-strong: #3a434f;--panel-hover: #2b3139;--panel-soft: #252a31;--accent: #2c7da0;--accent-strong: #1d6d8d;--highlight: #2aa6b8;--highlight-strong: #1f8796;--focus-ring: #5aa9e6;--text-muted: #a9b1bb;--text-muted-strong: #c4cbd3;--text-subtle: #7f8a96;--text-inverse: #f8f9fa;--text-strong: #0b0d10;--button-bg: #20242a;--btn-disabled-bg: #3a4048;--btn-disabled-text: #8e98a3;--menu-bg: #1f2329;--menu-hover: #2a3038;--menu-dropdown-bg: #f4f6f8;--menu-dropdown-text: #1b1e23;--menu-dropdown-border: #d6dbe1;--menu-dropdown-hover: #e9edf2;--menu-disabled: #9aa4af;--menu-mobile-bg: #1f2329;--menu-mobile-border: #313844;--menu-mobile-hover: #2a3038;--link-color: #2c7da0;--link-hover: #1d6d8d;--loading-bg: rgba(10, 12, 15, .6);--spinner-track: #2f3640;--spinner-head: #5aa9e6;--error-bg: #3b2025;--error-text: #f4c7cf;--error-border: #7a3a44;--error-close-hover: #ffffff;--popup-overlay: rgba(10, 12, 15, .7);--popup-bg: #f7f9fb;--popup-text: #1b1e23;--popup-heading: #2c7da0;--popup-link: #2c7da0;--popup-muted: #6b7682;--popup-bg-dark: #20242a;--popup-text-dark: #e9edf2;--popup-muted-dark: #a7b0bb;--popup-heading-dark: #9ad4e5;--popup-link-dark: #8ab4ff;--popup-shadow: rgba(5, 8, 12, .35);--color-picker-bg: #20242a;--color-picker-shadow: #12151a80;--color-picker-actions: #9aa4af;--toggle-border: #2aa6b8;--toggle-bg-active: #2aa6b8;--toggle-select: #3c8c6b;--toggle-select-border: #2f7558;--toggle-delete: #d9534f;--toggle-delete-border: #b94440;--toggle-delete-hover: #c9403c;--canvas-bg: #16191e;--hover-green: #29c17e;--preview-dark: #ffffff;--preview-light: #1f2329;--popup-heading-muted: #9aa4af;--popup-text-muted: #b5bdc7;--popup-close-hover: #d6dde5;--popup-button-border: #d6dbe1;--popup-button-hover: #e6eaef;--on-highlight: #0b0d10;--input-bg-light: #ffffff;--input-border-light: #8e98a3;--input-text-light: #1b1e23;--status-processing: #f6b26b;color-scheme:dark;color:var(--text-color);background-color:var(--bg-color);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}a{font-weight:500;color:var(--link-color);text-decoration:inherit}a:hover{color:var(--link-hover)}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1;text-align:center}h2{font-size:1.5em;margin:1rem 0}h3{font-size:1.2em;margin:.8rem 0;color:var(--text-muted)}#app{max-width:1400px;margin:0 auto;padding:.5rem}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--button-bg);color:inherit;cursor:pointer;transition:border-color .25s;margin:.25rem}button:hover{border-color:var(--accent-strong)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.menu-bar{background-color:var(--menu-bg);color:#fff;display:flex;justify-content:space-between;padding:0 10px;position:relative;z-index:1000;height:40px;margin-bottom:8px;align-items:center}.menu-left-section{display:flex;align-items:center}.menu-bar-logo{height:30px;margin-right:10px}.menu-toggle{display:none;background:none;border:none;color:#fff;font-size:24px;cursor:pointer;padding:0 10px}.menu-items-container{display:flex;align-items:center}.menu-item{position:relative}.menu-button{background:none;border:none;color:#fff;padding:5px 20px;font-size:16px;cursor:pointer;font-family:inherit;border-radius:0}.menu-button:hover,.menu-item:hover>.menu-button{background-color:var(--menu-hover)}.dropdown-content{display:none;position:absolute;background-color:var(--menu-dropdown-bg);min-width:220px;box-shadow:0 8px 16px #0003;z-index:1}.menu-item:hover .dropdown-content{display:block}.dropdown-content a{color:var(--menu-dropdown-text);padding:12px 16px;text-decoration:none;display:flex;justify-content:space-between;align-items:center;text-align:left;font-size:14px}.dropdown-content a:hover{background-color:var(--menu-dropdown-hover)}.dropdown-content a.disabled{color:var(--menu-disabled);pointer-events:none;cursor:default}.shortcut{color:var(--text-subtle);font-size:14px}.menu-separator{border-top:1px solid var(--menu-dropdown-border);margin:5px 0}.theme-toggle-button{background:var(--menu-bg);border:none;color:#fff;cursor:pointer;font-size:22px;padding:0 10px;display:flex;align-items:center;border-radius:4px;width:38px}.submenu-item{position:relative}.submenu-item>a{display:flex;justify-content:space-between;align-items:center}.submenu-arrow{margin-left:auto;padding-left:1rem}.submenu-content{display:none;position:absolute;left:100%;top:-1px;background-color:var(--menu-dropdown-bg);min-width:250px;box-shadow:0 8px 16px #0003;z-index:1;border:1px solid var(--menu-dropdown-border)}.submenu-item:hover>.submenu-content{display:block}@media (max-width: 768px){.menu-items-container.open .submenu-item>a{font-weight:700}.menu-items-container.open .submenu-arrow{display:none}.menu-items-container.open .submenu-content{display:block;position:static;box-shadow:none;border:none;background-color:transparent;padding-left:16px;min-width:auto}.submenu-item:hover>.submenu-content{display:none}.menu-items-container.open .submenu-item:hover>.submenu-content{display:block}.menu-left-section{flex-grow:1}.menu-toggle{display:block}.shortcut{display:none}.menu-items-container{display:none;position:absolute;top:100%;left:0;background-color:var(--menu-mobile-bg);width:100%;flex-direction:column;align-items:flex-start}.menu-items-container.open{display:flex}.menu-item{width:100%}.menu-button{width:99%;text-align:left}.dropdown-content{position:static;display:none;box-shadow:none;background-color:var(--menu-mobile-border);border-top:1px solid var(--menu-mobile-border)}.menu-item:focus-within .dropdown-content{display:block}.dropdown-content a{color:#fff}.dropdown-content a:hover{background-color:var(--menu-mobile-hover)}}.light-mode .menu-item>.menu-button,.light-mode .menu-toggle,.light-mode nav.menu-bar .theme-toggle-button{background-color:var(--menu-bg);color:#fff}.light-mode .dropdown-content a:hover{color:#000}.popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--popup-overlay);display:flex;justify-content:center;align-items:center;z-index:1000}.popup-content{position:relative;background:var(--popup-bg);padding:15px 25px;border-radius:8px;max-width:550px;width:90%;box-shadow:0 5px 15px var(--popup-shadow);color:var(--popup-text);margin:20px}.popup-content h1{margin-top:0;color:var(--popup-heading-muted)}.popup-content h2{margin-top:0;color:var(--popup-heading)}.popup-content a{color:var(--popup-link);text-decoration:none}.popup-content a:hover{text-decoration:underline}.popup-close-hint{margin-top:20px;font-size:.9em;color:var(--popup-muted);text-align:center}.popup-text,.popup-text-scrollable{color:var(--popup-text-muted)}.popup-text-scrollable{overflow-y:scroll;max-height:400px}.shortcuts-table>tbody>tr>td{padding:0 5px}.about-version{font-size:.8em;color:var(--popup-text-muted);margin-top:-30px;text-align:center}.popup-close-btn{position:absolute;top:10px;right:15px;background:none;border:none;cursor:pointer;padding:5px;line-height:1;font-size:1.5rem;color:var(--text-subtle);z-index:10}.popup-close-btn:hover{color:var(--popup-close-hover)}.light-mode .popup-close-btn{background-color:transparent}.light-mode .btn-left,.light-mode .btn-right,.light-mode .btn-flip{color:var(--text-color);background-color:var(--panel-bg);border:1px solid var(--popup-button-border)}.light-mode .btn-left:hover,.light-mode .btn-right:hover,.light-mode .btn-flip:hover{background-color:var(--popup-button-hover)}.popup-logo{display:block;margin:0 auto 10px}.settings-content{max-width:640px}.settings-grid{display:flex;flex-direction:column;gap:16px;margin-top:10px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.settings-label{font-weight:600;color:var(--popup-heading);min-width:220px}.settings-control{display:flex;align-items:center;gap:12px}.settings-swatch{width:32px;height:32px;border-radius:6px;border:1px solid var(--popup-button-border);box-shadow:inset 0 0 0 1px #00000014;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}.settings-swatch-button{background:none;border:none;padding:0;cursor:pointer}.settings-swatch-button:hover .settings-swatch{transform:translateY(-1px);border-color:var(--accent);box-shadow:0 4px 10px #0000002e}.settings-swatch-button:active .settings-swatch{transform:translateY(0);box-shadow:inset 0 0 0 1px #0000002e}.settings-swatch-button:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:8px}.settings-value{font-family:monospace;font-size:.9em;color:var(--popup-text-muted)}.settings-color-picker-overlay{z-index:1100}.settings-color-picker-content{background:var(--color-picker-bg);box-shadow:0 4px 24px var(--color-picker-shadow);display:flex;flex-direction:column;align-items:center;gap:1em}@media (max-width: 600px){.settings-row{flex-direction:column;align-items:flex-start}.settings-label{min-width:auto}}.editor-layout{display:grid;grid-template-columns:300px 1fr;gap:.5rem;align-items:start}.file-and-measurement-container{display:flex;justify-content:space-between;align-items:center;padding:0 10px;height:2em;line-height:2em}.file-name{text-align:left;font-family:monospace;font-size:14px;color:var(--text-muted-strong)}.light-mode .file-name{color:var(--text-color)}.measurement-result{text-align:right;font-family:Arial,sans-serif;font-size:14px;color:var(--text-muted);padding-right:5px}@media (max-width: 1200px){.editor-layout{grid-template-columns:240px 1fr}}.polygon-palette{padding:.5rem;border:2px solid var(--panel-border);border-radius:12px;background-color:var(--panel-bg);height:fit-content}.palette-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(60px,1fr));gap:.5rem;margin:0 auto 1rem}.polygon-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.5rem;min-height:70px;background-color:var(--panel-bg-strong);border:2px solid var(--panel-border-strong);border-radius:8px;color:var(--text-muted-strong);cursor:pointer;transition:all .3s ease}.polygon-btn:hover{border-color:var(--accent);background-color:var(--panel-hover);color:var(--text-inverse);transform:translateY(-2px);box-shadow:0 4px 8px #646cff4d}.polygon-btn.selected{border-color:var(--accent);background-color:var(--highlight);color:var(--on-highlight);box-shadow:0 0 10px #646cff80}.polygon-btn.selected:hover{background-color:var(--highlight-strong);border-color:var(--accent-strong)}.polygon-label{margin-top:.5rem;font-size:.7rem;font-weight:600}.selected-info{margin-top:.5rem;padding:.3rem;background-color:var(--menu-bg);border-radius:6px;min-height:1.5rem;display:flex;justify-content:center;align-items:center}.selected-info p{margin:0;color:var(--focus-ring);font-weight:500}.polygon-label-input{font-size:11px;margin-top:5px;width:36px}.custom-polygon-creator{height:60px;padding:.35rem .5rem .15rem;width:36px;margin-top:4px;margin-left:3px}@media (max-width: 1200px){.custom-polygon-creator{padding-right:.2rem;padding-left:.2rem}}.light-mode .polygon-btn.selected{border-color:var(--accent);background-color:var(--highlight);color:var(--text-inverse)}.light-mode .polygon-btn.selected:hover{background-color:var(--highlight-strong);color:var(--text-inverse)}.light-mode .polygon-label-input{background-color:var(--input-bg-light);border:1px solid var(--input-border-light);color:var(--input-text-light)}.corner-button{margin-top:-16px;margin-left:42px}.tiling-controls{margin-top:1.5rem;padding:1rem;background-color:var(--menu-bg);border-radius:8px}.tiling-controls button{display:block;width:100%;margin:.5rem 0;padding:.5rem;font-size:.9rem}.canvas-controls{display:flex;flex-direction:column;gap:10px;margin-bottom:6px;border-radius:8px}.control-group{display:flex;gap:10px;flex-wrap:wrap}.visualization-controls{display:flex;gap:10px;align-items:center}.toggle-btn{padding:8px;border:2px solid var(--toggle-border);background:transparent;color:var(--toggle-border);border-radius:4px;cursor:pointer;transition:all .2s ease}.toggle-btn:hover{background:#646cff1a}.toggle-btn.active{background:var(--toggle-bg-active);color:#fff}.toggle-btn.mode-select{background-color:var(--toggle-select);border-color:var(--toggle-select-border);color:#fff}.toggle-btn.mode-delete{background-color:var(--toggle-delete);border-color:var(--toggle-delete-border)}.toggle-btn.mode-delete:hover{background-color:var(--toggle-delete-hover)}.tiling-polygon.delete-mode{opacity:.8}.tiling-polygon.delete-mode:hover{opacity:1;filter:brightness(1.1)}.undo-button{padding:.5rem 1rem}.redo-button{margin-left:5px;padding:.5rem 1rem}.fill-color-btn{margin-left:8px;border:2px solid var(--toggle-border);display:inline-flex;align-items:center;gap:.3em;padding:.3em .9em;border-radius:5px}.canvas-container{border:2px solid var(--panel-border);border-radius:12px;background-color:var(--panel-bg);padding:.5rem}.node-label{pointer-events:none;-webkit-user-select:none;user-select:none}svg .node-label{opacity:.9;transition:opacity .2s ease}svg:hover .node-label{opacity:1}.editor-canvas{width:100%;height:var(--canvas-height);display:block;border:2px solid var(--panel-border-strong);border-radius:8px;background-color:var(--canvas-bg);cursor:grab;outline:none}.editor-canvas:active{cursor:grabbing}.editor-canvas:focus{border-color:var(--focus-ring);box-shadow:0 0 0 2px #646cff4d}.clickable-polygon,.clickable-text{cursor:pointer}.polygon-center{cursor:move}.polygon-point{cursor:crosshair}.tessellation{pointer-events:all}.tiling-polygon{cursor:pointer;transition:all .2s ease}.tiling-polygon:hover{fill-opacity:.6;stroke-width:2px!important}.perimeter-edge-transparent{cursor:pointer}.perimeter-edge-transparent:hover{filter:drop-shadow(0 0 8px rgba(255,61,0,.6));stroke:var(--hover-green)!important}.interior-edge-transparent{cursor:pointer}.interior-edge-group:hover .interior-edge{stroke:var(--hover-green)!important;filter:drop-shadow(0 0 8px rgba(0,200,83,.65));animation:edgePulse 1.2s ease-in-out infinite}@keyframes edgePulse{0%{stroke-width:3px;filter:drop-shadow(0 0 2px rgba(0,200,83,.4))}50%{stroke-width:5px;filter:drop-shadow(0 0 10px rgba(0,200,83,.9))}to{stroke-width:3px;filter:drop-shadow(0 0 2px rgba(0,200,83,.4))}}.interior-edge-transparent:hover{stroke:var(--hover-green)!important}.dark-mode svg .inserter-preview-wireframe{color:var(--preview-dark);filter:drop-shadow(0 0 6px rgba(255,255,255,.35))}.light-mode svg .inserter-preview-wireframe{color:var(--preview-light);filter:drop-shadow(0 0 4px rgba(0,0,0,.25))}svg .failed-polygon-wireframe,svg .inserter-preview-wireframe{pointer-events:none}svg .failed-polygon-wireframe polygon,svg .inserter-preview-wireframe polygon{vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}svg .inserter-preview-wireframe polygon{filter:drop-shadow(0 0 6px rgba(255,255,255,.35));opacity:.9}.grid-pattern line{pointer-events:none}.editor-canvas-wrapper{position:relative}.error-container{position:absolute;top:0;left:0;width:100%;padding:.5rem;box-sizing:border-box;z-index:10;pointer-events:none}.error-message{display:flex;align-items:center;background-color:var(--error-bg);color:var(--error-text);font-size:12px;border:1px solid var(--error-border);border-radius:4px;padding:.5rem .25rem;box-shadow:0 .5rem 1rem #00000026;pointer-events:auto;word-break:break-word}.error-icon{margin-right:.75rem;font-size:1.25rem}.error-text{flex-grow:1}.error-close{background:none;border:none;font-size:1.5rem;font-weight:700;color:var(--error-text);cursor:pointer;padding:0 .5rem;margin-left:1rem}.error-close:hover{color:var(--error-close-hover)}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}#toast-container{position:fixed;right:16px;bottom:16px;display:flex;flex-direction:column;gap:8px;z-index:9999;pointer-events:none}.editor-toast{background:#263238;color:#e0f7fa;border:1px solid #4FC3F7;border-radius:8px;padding:10px 12px;box-shadow:0 6px 16px #0000004d;max-width:420px;font:14px/1.35 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;white-space:pre-wrap;cursor:pointer;pointer-events:auto;opacity:0;transform:translateY(8px);transition:opacity .15s ease,transform .15s ease}.editor-toast[data-severity=warning]{background:#3e2723;color:#ffe0b2;border-color:#ffb74d}.editor-toast[data-severity=error]{background:#311920;color:#ffcdd2;border-color:#ef5350}.light-mode{color:#1b1e23;background-color:#f7f9fb;--text-color: #1b1e23;--text-strong: #0b0d10;--text-muted: #6b7682;--bg-color: #f7f9fb;--panel-bg: #ffffff;--panel-bg-strong: #f4f6f8;--panel-border: #d6dbe1;--panel-border-strong: #c2c8d1;--panel-hover: #e9edf2;--panel-soft: #eef2f6;--button-bg: #ffffff;--link-hover: #1d6d8d;--popup-text: #1b1e23;--popup-muted: #6b7682;--popup-heading-muted: #1b1e23;--popup-text-muted: #6b7682;--error-bg: #fdecee;--error-text: #8a2c3a;--error-border: #f3c2c7;--canvas-bg: #ffffff;--color-picker-bg: #ffffff;--color-picker-shadow: #cbd3dd80;--color-picker-actions: #6b7682}.light-mode a:hover{color:var(--link-hover)}.light-mode button{background-color:var(--button-bg)}.light-mode h3{color:var(--text-muted)}.light-mode .polygon-palette,.light-mode .canvas-container{background-color:var(--panel-bg);border-color:var(--panel-border)}.light-mode .polygon-btn{background-color:var(--panel-bg-strong);border-color:var(--panel-border);color:var(--text-color)}.light-mode .polygon-btn:hover{background-color:var(--panel-hover);color:var(--text-strong)}.light-mode .selected-info,.light-mode .canvas-controls,.light-mode .tiling-controls{background-color:var(--panel-soft)}.light-mode .editor-canvas{background-color:var(--canvas-bg);border-color:var(--panel-border-strong)}.dark-mode{color:var(--text-color);background-color:var(--bg-color);color-scheme:dark;--text-color: #e9ecef;--text-strong: #f8f9fa;--text-muted: #a9b1bb;--text-muted-strong: #c4cbd3;--text-subtle: #7f8a96;--bg-color: #1b1e23;--panel-bg: #20242a;--panel-bg-strong: #252a31;--panel-border: #303741;--panel-border-strong: #3a434f;--panel-hover: #2b3139;--panel-soft: #252a31;--button-bg: #20242a;--link-hover: #1d6d8d;--canvas-bg: #16191e;--popup-bg: var(--popup-bg-dark);--popup-text: var(--popup-text-dark);--popup-muted: var(--popup-muted-dark);--popup-heading: var(--popup-heading-dark);--popup-heading-muted: var(--popup-text-dark);--popup-text-muted: var(--popup-muted-dark);--popup-link: var(--popup-link-dark)}@media (max-width: 1200px){.editor-layout{grid-template-columns:1fr;gap:1rem}.polygon-palette{order:2}.canvas-container{order:1}.palette-grid{grid-template-columns:repeat(auto-fit,minmax(50px,1fr));max-width:none}.responsive-control{display:none}}@media (max-width: 768px){:root{--canvas-height: 400px}.canvas-controls{flex-direction:column;align-items:stretch}.tiling-controls button{font-size:.8rem;padding:.4rem}}.color-picker-popup{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--popup-overlay);z-index:1000}.color-picker-popup .popup-content{background:var(--color-picker-bg);padding:24px 32px;border-radius:8px;box-shadow:0 4px 24px var(--color-picker-shadow);display:flex;flex-direction:column;gap:1em;align-items:center}.popup-actions{display:flex;gap:.6em;color:var(--color-picker-actions)}ui5-slider.ui5-color-picker-alpha-slider{display:none}.loading-indicator{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--loading-bg);z-index:1000;display:flex;justify-content:center;align-items:center}.loading-content{background-color:var(--panel-bg-strong);border:2px solid var(--focus-ring);border-radius:8px;padding:20px;text-align:center;color:#fff;display:flex;flex-direction:column;align-items:center;gap:15px}.spinner{width:40px;height:40px;border:4px solid var(--spinner-track);border-top:4px solid var(--spinner-head);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.polygon-btn.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}button:disabled{opacity:.5;cursor:not-allowed;background-color:var(--btn-disabled-bg);color:var(--btn-disabled-text)}.status.processing{color:var(--status-processing);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.editor-canvas[style*="cursor: wait"]{cursor:wait!important}.editor-canvas[style*="pointer-events: none"] *{pointer-events:none!important}.canvas-container{flex-grow:1;display:flex;flex-direction:column}.editor-canvas-wrapper{position:relative;width:100%;flex-grow:1}.editor-canvas{width:100%}.zoom-rotation{position:absolute;top:10px;right:15px;font-family:Arial,sans-serif;font-size:14px;color:var(--text-muted);pointer-events:none}