*{box-sizing:border-box;margin:0;padding:0}body{color:#333;background:#f0f0f0;height:100vh;font-family:system-ui,-apple-system,sans-serif;font-size:14px;overflow:hidden}#app{height:100vh}.app-layout{height:100%;display:flex}.sidebar{background:#fff;flex-direction:column;padding:16px;display:flex;overflow-y:auto}.left-panel{border-right:1px solid #ccc;width:280px;min-width:280px}.right-panel{border-left:1px solid #ccc;width:260px;min-width:260px}.sidebar-footer{text-align:center;margin-top:auto;padding-top:12px}.sidebar-footer-link{color:#aaa;cursor:pointer;font-size:11px;line-height:1.6;text-decoration:none;display:block}.sidebar-footer-link:hover{cursor:pointer;color:#ccc}.app-header{border-bottom:1px solid #ddd;align-items:center;gap:8px;margin-bottom:16px;padding-bottom:12px;display:flex}.app-header-icon{flex-shrink:0;width:28px;height:28px}.app-header-title{color:#333;letter-spacing:-.3px;font-size:18px;font-weight:700}.svg-panel{-webkit-user-select:none;user-select:none;background:#e8e8e8;flex:1;justify-content:center;align-items:center;padding:24px;display:flex;position:relative}.svg-panel svg{background:#fff;border-radius:4px;width:100%;height:100%;box-shadow:0 1px 4px #00000026}.section-title{text-transform:uppercase;letter-spacing:.5px;color:#666;border-bottom:1px solid #eee;margin:16px 0 8px;padding-bottom:4px;font-size:13px;font-weight:600}.section-title:first-child{margin-top:0}.input-group{margin-bottom:8px}.input-group label{color:#888;margin-bottom:2px;font-size:12px;display:block}.input-group input{border:1px solid #ccc;border-radius:3px;width:100%;padding:6px 8px;font-size:14px}.input-group input:focus{border-color:#4a90d9;outline:none;box-shadow:0 0 0 2px #4a90d933}button{cursor:pointer;background:#f8f8f8;border:1px solid #ccc;border-radius:3px;margin-bottom:8px;padding:5px 12px;font-size:13px}button:hover{background:#eee}button:disabled{opacity:.35;cursor:default;pointer-events:none}button.active{color:#fff;background:#4a90d9;border-color:#4a90d9}.error-msg{color:#c33;min-height:0;font-size:12px}.error-msg:not(:empty){margin-top:4px;margin-bottom:4px}.hidden{display:none}.spine-rect{fill:#f5e6c8;stroke:#8b7355;stroke-width:.5px}.hole-dot{fill:#444;cursor:pointer}.hole-dot:hover{fill:#4a90d9}.hole-dot.selected{fill:#c33}.coord-label{fill:#666;text-anchor:middle;font-family:system-ui,sans-serif}.grid-line-major{stroke:#ccc;stroke-width:.2px;pointer-events:none}.ghost-layer{pointer-events:none}.ghost-hole-dot{fill:#4a90d9;opacity:.4}.cursor-tooltip{fill:#555;pointer-events:none;font-family:system-ui,sans-serif}.spine-rect{cursor:crosshair}.persistent-panel{border-top:1px solid #ddd;margin-top:16px;padding-top:8px}.export-textarea{resize:vertical;border:1px solid #ccc;border-radius:3px;width:100%;min-height:120px;padding:6px 8px;font-family:monospace;font-size:12px}.export-textarea:focus{border-color:#4a90d9;outline:none;box-shadow:0 0 0 2px #4a90d933}.export-btn-row{gap:6px;margin-top:6px;display:flex}.export-btn-row button{flex:1}.export-btn-row button.save-disabled{opacity:.5;pointer-events:none}.current-file-name{color:#888;text-overflow:ellipsis;white-space:nowrap;min-height:14px;margin-top:4px;font-size:11px;font-style:italic;overflow:hidden}.mode-switcher{gap:0;margin-bottom:16px;display:flex}.mode-btn{border-color:#ccc;border-radius:0;flex:1;margin-bottom:0}.mode-btn:first-child{border-radius:3px 0 0 3px}.mode-btn:last-child{border-radius:0 3px 3px 0}.mode-btn.active{color:#fff;background:#4a90d9;border-color:#4a90d9}.thread-edge{pointer-events:none}.thread-edge--positive{stroke:#2a9d8f;stroke-width:.8px}.thread-edge--negative{stroke:#c44;stroke-width:.8px;stroke-dasharray:2 1.5}.thread-edge--preview{opacity:.4;pointer-events:none}.thread-edge-label-bg{fill:#fff;stroke:#555;stroke-width:.35px;pointer-events:none}.thread-edge-label{fill:#333;text-anchor:middle;dominant-baseline:central;pointer-events:none;font-family:sans-serif;font-size:2.4px;font-weight:700}.thread-current-point{fill:#2ecc71;cursor:crosshair;pointer-events:none}.thread-start-marker{pointer-events:none}.thread-start-marker--positive{fill:#2a9d8f;stroke:none}.thread-start-marker--negative{fill:#c44;stroke:none}.thread-end-marker{pointer-events:none}.thread-end-marker--positive{fill:#2a9d8f;stroke:none}.thread-end-marker--negative{fill:#c44;stroke:none}.thread-knot-marker{fill:#c44;stroke:none;pointer-events:none}.thread-knot-cross{stroke:#fff;stroke-width:1.5px;stroke-linecap:round;pointer-events:none}.anchor-loop{stroke-width:1px;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.anchor-loop--positive{stroke:#3498db}.anchor-loop--negative{stroke:#3498db;stroke-dasharray:2 1.5}.hidden-link-stitch{stroke:#3498db;stroke-width:1px;stroke-dasharray:3 2;stroke-linecap:round;pointer-events:none}.thread-edge--hidden-link-origin{stroke:#3498db}.hidden-link-eligible-halo{fill:none;stroke:#3498db;stroke-width:.6px;stroke-dasharray:1.5 1;opacity:.75;pointer-events:none}.chain-eligible-halo,.anchor-loop-eligible-halo{fill:none;stroke:#e67e22;stroke-width:.6px;stroke-dasharray:1.5 1;opacity:.75;pointer-events:none}.thread-edge--chain{stroke-width:.7px}.sewing-panel .section-title:first-child{margin-top:0}.sewing-panel>button{width:100%;display:block}.radio-group{margin-bottom:8px}.radio-option{cursor:pointer;align-items:center;gap:6px;margin-bottom:4px;font-size:13px;display:flex}.radio-option label{cursor:pointer}.reset-btn{color:#c33;background:#fff8f8;border-color:#c33;width:100%}.reset-btn:hover{background:#fee}button.gallery-cta{color:#fff;background:#4a90d9;border-color:#4a90d9;font-weight:500;animation:1.8s ease-out .4s 2 gallery-cta-pulse}button.gallery-cta:hover{background:#3a7fc8;border-color:#3a7fc8}@keyframes gallery-cta-pulse{0%{box-shadow:0 0 #4a90d98c}60%{box-shadow:0 0 0 6px #4a90d900}to{box-shadow:0 0 #4a90d900}}.undo-redo-row{gap:6px;margin-bottom:4px;display:flex}.undo-redo-row button{flex:1;margin-bottom:0}.metadata-panel{border-bottom:1px solid #eee;padding-bottom:14px}.meta-view-title{color:#222;word-break:break-word;margin-bottom:3px;font-size:15px;font-weight:600;line-height:1.3}.meta-view-title.meta-view-empty{color:#bbb;font-style:italic;font-weight:400}.meta-view-author{color:#888;margin-bottom:10px;font-size:12px}.meta-view-desc{color:#555;white-space:pre-wrap;word-break:break-word;margin-bottom:10px;font-size:13px;line-height:1.55}.metadata-input{box-sizing:border-box;border:1px solid #ccc;border-radius:3px;width:100%;margin-bottom:6px;padding:5px 7px;font-size:13px}.metadata-input:focus{border-color:#4a90d9;outline:none;box-shadow:0 0 0 2px #4a90d933}.metadata-textarea{resize:vertical;box-sizing:border-box;border:1px solid #ccc;border-radius:3px;width:100%;min-height:240px;padding:5px 7px;font-family:inherit;font-size:13px}.metadata-textarea:focus{border-color:#4a90d9;outline:none;box-shadow:0 0 0 2px #4a90d933}.char-count{text-align:right;color:#999;margin-top:2px;font-size:11px;display:block}.playback-step-label{text-align:center;font-variant-numeric:tabular-nums;-webkit-user-select:none;user-select:none;flex-direction:column;gap:2px;margin-bottom:10px;display:flex}.playback-step-main{color:#333;min-height:1.2em;font-size:13px;font-weight:500}.playback-step-count{color:#888;font-size:11px}.playback-btn-row{gap:6px;margin-bottom:4px;display:flex}.playback-btn-row button{flex:1;margin-bottom:0}.playback-view-btn{width:100%;margin-top:8px;margin-bottom:0}.mode-btn:disabled{opacity:.4;cursor:not-allowed}.next-edge-label{color:#555;min-height:16px;margin-top:4px;margin-bottom:4px;font-size:12px}.ruler-layer{pointer-events:none}.ruler-baseline{stroke:#aaa;stroke-width:.3px}.ruler-tick-minor{stroke:#bbb;stroke-width:.2px}.ruler-tick-major{stroke:#888;stroke-width:.3px}.ruler-label{fill:#666;pointer-events:none;font-family:system-ui,sans-serif;font-size:2.5px}.ruler-crosshair{stroke:#4a90d9;stroke-width:.3px;stroke-dasharray:3 2;pointer-events:none;opacity:.55}.gallery-backdrop{z-index:1000;background:#00000080;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.gallery-modal{background:#fff;border-radius:6px;flex-direction:column;width:100%;max-width:860px;max-height:80vh;display:flex;overflow:hidden;box-shadow:0 8px 32px #00000040}.gallery-header{border-bottom:1px solid #eee;flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.gallery-title{color:#333;margin:0;font-size:16px;font-weight:600}.gallery-close-btn{color:#888;cursor:pointer;background:0 0;border:none;border-radius:3px;margin:0;padding:2px 6px;font-size:16px;line-height:1}.gallery-close-btn:hover{color:#333;background:#f0f0f0}.gallery-content{flex:1;min-height:0;overflow-y:auto}.gallery-section{padding:16px 20px 4px}.gallery-section+.gallery-section{padding-top:8px}.gallery-section-title{text-transform:uppercase;letter-spacing:.06em;color:#888;border-bottom:1px solid #e8e8e8;margin-bottom:10px;padding-bottom:6px;font-size:12px;font-weight:700}.gallery-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.gallery-card{cursor:pointer;border:1px solid #ddd;border-radius:5px;outline:none;padding:12px;transition:border-color .15s,box-shadow .15s}.gallery-card:hover,.gallery-card:focus{border-color:#4a90d9;box-shadow:0 0 0 2px #4a90d933}.gallery-card:active{background:#f5f9ff}.gallery-card-title{color:#222;margin-bottom:3px;font-size:13px;font-weight:600;line-height:1.3}.gallery-card-author{color:#888;margin-bottom:6px;font-size:11px}.gallery-card-desc{color:#555;-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:12px;line-height:1.45;display:-webkit-box;overflow:hidden}.gallery-card-desc--empty{color:#bbb;font-style:italic}.bottom-panel{flex-direction:column;flex-shrink:0;gap:4px;margin-top:auto;display:flex}.bottom-panel button{width:100%}.mode-switcher-hr{border:none;border-top:1px solid #eee;margin:10px 0}.shortcuts-container{margin-bottom:12px}.help-shortcut-list{flex-direction:column;gap:8px;display:flex}.help-shortcut-row{flex-direction:column;gap:2px;display:flex}.help-key{white-space:nowrap;color:#333;background:#f0f0f0;border:1px solid #ccc;border-radius:3px;align-self:flex-start;padding:1px 5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}.help-shortcut-desc{color:#555;font-size:12px;line-height:1.4}.sig-line{stroke:#ccc;stroke-width:.5px;pointer-events:none}.sig-preview-line{stroke:#aaa;stroke-width:.5px;stroke-dasharray:2 1.5;pointer-events:none}.sig-direction-label{font-size:2px;font-style:italic}.sig-button{fill:#666;stroke:none;cursor:pointer}.sig-button:hover,.sig-button--active{fill:#444}.sig-button--active:hover{fill:#2b2b2b}.sig-button--locked{opacity:.25;cursor:default;pointer-events:none}.cancel-thread-btn{color:#c33;background:#fff8f8;border-color:#c33;width:100%}.cancel-thread-btn:hover{background:#fee}.hover-menu{z-index:100;pointer-events:auto;-webkit-user-select:none;user-select:none;background:#fff;border:1px solid #ddd;border-radius:8px;min-width:210px;padding:4px 0;font-size:13px;position:absolute;box-shadow:0 4px 16px #00000029}.hover-menu-item{cursor:pointer;color:#333;align-items:center;gap:8px;padding:7px 12px;line-height:1.3;display:flex}.hover-menu-item:hover{background:#f0f5ff}.hover-menu-item--primary{font-weight:600}.hover-menu-item--disabled{color:#bbb;pointer-events:none}.hover-menu-icon{text-align:center;color:#888;flex-shrink:0;width:16px;font-size:12px}.hover-menu-icon--positive{color:#2a9d8f}.hover-menu-icon--negative{color:#c44}.anchor-loop--preview,.hidden-link-stitch--preview{opacity:.4}.welcome-banner{color:#333;background:#e8f4fd;border-bottom:2px solid #4a90d9;margin-bottom:16px;padding:18px 16px 16px;font-size:13px;line-height:1.6}.welcome-banner strong{margin-bottom:8px;font-size:14px;display:block}.welcome-banner-actions{align-items:center;gap:10px;margin-top:14px;display:flex}.welcome-banner-start{color:#fff;cursor:pointer;background:#4a90d9;border:none;border-radius:4px;padding:5px 12px;font-size:13px}.welcome-banner-start:hover{background:#357abd}.welcome-banner-skip{color:#666;cursor:pointer;background:0 0;border:none;padding:0;font-size:12px;text-decoration:underline}.welcome-banner-skip:hover{color:#333}.driver-active .driver-overlay,.driver-active *{pointer-events:none}.driver-active .driver-active-element,.driver-active .driver-active-element *,.driver-popover,.driver-popover *{pointer-events:auto}@keyframes animate-fade-in{0%{opacity:0}to{opacity:1}}.driver-fade .driver-overlay{animation:.2s ease-in-out animate-fade-in}.driver-fade .driver-popover{animation:.2s animate-fade-in}.driver-popover{all:unset;box-sizing:border-box;color:#2d2d2d;z-index:1000000000;background-color:#fff;border-radius:5px;min-width:250px;max-width:300px;margin:0;padding:15px;position:fixed;top:0;right:0;box-shadow:0 1px 10px #0006}.driver-popover *{font-family:Helvetica Neue,Inter,ui-sans-serif,Apple Color Emoji,Helvetica,Arial,sans-serif}.driver-popover-title{zoom:1;margin:0;font:700 19px/1.5 sans-serif;display:block;position:relative}.driver-popover-close-btn{all:unset;cursor:pointer;color:#d2d2d2;z-index:1;text-align:center;width:32px;height:28px;font-size:18px;font-weight:500;transition:color .2s;position:absolute;top:0;right:0}.driver-popover-close-btn:hover,.driver-popover-close-btn:focus{color:#2d2d2d}.driver-popover-title[style*=block]+.driver-popover-description{margin-top:5px}.driver-popover-description{zoom:1;margin-bottom:0;font:400 14px/1.5 sans-serif}.driver-popover-footer{text-align:right;zoom:1;justify-content:space-between;align-items:center;margin-top:15px;display:flex}.driver-popover-progress-text{color:#727272;zoom:1;font-size:13px;font-weight:400}.driver-popover-footer button{all:unset;box-sizing:border-box;text-shadow:1px 1px #fff;color:#2d2d2d;cursor:pointer;zoom:1;background-color:#fff;border:1px solid #ccc;border-radius:3px;outline:0;padding:3px 7px;font:12px/1.3 sans-serif;text-decoration:none;display:inline-block}.driver-popover-footer .driver-popover-btn-disabled{opacity:.5;pointer-events:none}:not(body):has(>.driver-active-element){overflow:hidden!important}.driver-no-interaction,.driver-no-interaction *{pointer-events:none!important}.driver-popover-footer button:hover,.driver-popover-footer button:focus{background-color:#f7f7f7}.driver-popover-navigation-btns{flex-grow:1;justify-content:flex-end;display:flex}.driver-popover-navigation-btns button+button{margin-left:4px}.driver-popover-arrow{content:"";border:5px solid #fff;position:absolute}.driver-popover-arrow-side-over{display:none}.driver-popover-arrow-side-left{border-top-color:#0000;border-bottom-color:#0000;border-right-color:#0000;left:100%}.driver-popover-arrow-side-right{border-top-color:#0000;border-bottom-color:#0000;border-left-color:#0000;right:100%}.driver-popover-arrow-side-top{border-bottom-color:#0000;border-left-color:#0000;border-right-color:#0000;top:100%}.driver-popover-arrow-side-bottom{border-top-color:#0000;border-left-color:#0000;border-right-color:#0000;bottom:100%}.driver-popover-arrow-side-center{display:none}.driver-popover-arrow-side-left.driver-popover-arrow-align-start,.driver-popover-arrow-side-right.driver-popover-arrow-align-start{top:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-start,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-start{left:15px}.driver-popover-arrow-align-end.driver-popover-arrow-side-left,.driver-popover-arrow-align-end.driver-popover-arrow-side-right{bottom:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-end,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-end{right:15px}.driver-popover-arrow-side-left.driver-popover-arrow-align-center,.driver-popover-arrow-side-right.driver-popover-arrow-align-center{margin-top:-5px;top:50%}.driver-popover-arrow-side-top.driver-popover-arrow-align-center,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-center{margin-left:-5px;left:50%}.driver-popover-arrow-none{display:none}