:root{--bg: #1a1c20;--panel: #23262c;--text: #e6e8eb;--muted: #9aa0a6;--accent: #6ea8fe;color-scheme:dark light;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;color:var(--text);background-color:var(--bg)}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}.app-shell{display:flex;flex-direction:column;min-height:100%}.app-header{display:flex;align-items:center;gap:1.25rem;padding:.75rem 1.25rem;background:var(--panel);border-bottom:1px solid rgba(255,255,255,.08)}.app-header h1{margin:0;font-size:1.15rem;font-weight:600}.app-main{flex:1;min-height:0;display:flex}.toolbar{display:flex;align-items:center;gap:.75rem;flex:1;min-width:0}.toolbar-name{max-width:16rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.3rem .5rem;border:1px solid transparent;border-radius:6px;background:transparent;color:inherit;font:inherit;font-weight:600;cursor:pointer}.toolbar-name:hover{border-color:#ffffff2e;background:#ffffff0f}.toolbar-buttons{display:flex;gap:.35rem}.toolbar button,.modal-actions button,.slot-actions button{padding:.3rem .6rem;border:1px solid rgba(255,255,255,.12);border-radius:6px;background:transparent;color:inherit;font:inherit;cursor:pointer}.toolbar-buttons button:hover,.modal-actions button:hover:not(:disabled),.slot-actions button:hover{background:#ffffff14}.modal-actions button:disabled{opacity:.45;cursor:not-allowed}.toolbar-status{min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:.8rem;color:var(--muted)}.toolbar-status.is-error{color:#f28b82}.modal-overlay{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:1rem;background:#0000008c}.modal-panel{width:min(30rem,100%);max-height:80vh;overflow-y:auto;padding:1rem 1.15rem 1.15rem;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:var(--panel);box-shadow:0 12px 32px #00000073}.modal-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.9rem}.modal-header h2{margin:0;font-size:1rem}.modal-close{padding:0 .4rem;border:none;background:transparent;color:var(--muted);font-size:1.2rem;line-height:1;cursor:pointer}.modal-close:hover{color:var(--text)}.modal-form{display:flex;flex-direction:column;gap:.75rem}.modal-form label{display:flex;flex-direction:column;gap:.25rem;flex:1;font-size:.8rem;color:var(--muted)}.modal-form input{padding:.35rem .5rem;border:1px solid rgba(255,255,255,.16);border-radius:6px;background:#0003;color:var(--text);font:inherit}.modal-row{display:flex;gap:.75rem}.modal-note{margin:0;font-size:.8rem;color:var(--muted)}.modal-error{margin:0 0 .75rem;font-size:.85rem;color:#f28b82}.modal-actions{display:flex;justify-content:flex-end;gap:.4rem;margin-top:1rem}.slot-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3rem}.slot-item{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.4rem .5rem;border:1px solid rgba(255,255,255,.08);border-radius:6px}.slot-info,.slot-rename{display:flex;flex-direction:column;min-width:0;flex:1}.slot-rename input{width:100%;padding:.25rem .4rem;border:1px solid var(--accent);border-radius:5px;background:#0003;color:var(--text);font:inherit}.slot-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slot-current{color:var(--accent);font-style:normal;font-size:.8rem}.slot-date{font-size:.75rem;color:var(--muted)}.slot-actions{display:flex;gap:.3rem;flex:0 0 auto;font-size:.85rem}.slot-actions .is-danger{border-color:#f28b82;color:#f28b82}.toolbar-help{min-width:1.9rem}.board-banner{position:absolute;top:.75rem;left:50%;transform:translate(-50%);z-index:1;max-width:min(34rem,calc(100% - 1.5rem));margin:0;padding:.5rem .85rem;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:#23262ceb;font-size:.85rem;color:var(--muted);text-align:center;pointer-events:none}.board-banner.is-error{border-color:#f28b8280;color:#f28b82}.board-crash{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:2rem;text-align:center}.board-crash h2{margin:0;font-size:1rem}.board-crash p{margin:0;max-width:28rem;font-size:.9rem;color:var(--muted)}.board-crash button{margin-top:.5rem;padding:.35rem .8rem;border:1px solid rgba(255,255,255,.16);border-radius:6px;background:transparent;color:inherit;font:inherit;cursor:pointer}.shortcut-list{margin:0;display:flex;flex-direction:column;gap:.3rem;font-size:.85rem}.shortcut-row{display:flex;align-items:baseline;gap:.75rem}.shortcut-row dt{flex:0 0 9rem;display:flex;gap:.25rem;justify-content:flex-end}.shortcut-row dd{margin:0;color:var(--muted)}.board-area{position:relative;flex:1;min-height:0;background:#14161a;touch-action:none;-webkit-user-select:none;user-select:none}.rotation-control{display:flex;align-items:center;gap:.35rem}.rotation-control button{min-width:1.9rem;padding:.15rem .35rem;border:1px solid rgba(255,255,255,.12);border-radius:5px;background:transparent;color:inherit;font:inherit;line-height:1.3;cursor:pointer}.rotation-control button:hover:not(:disabled){background:#ffffff14}.rotation-control button:disabled{opacity:.45;cursor:not-allowed}.rotation-value{min-width:2.75rem;text-align:center;font-size:.85rem;font-variant-numeric:tabular-nums}kbd{padding:0 .25rem;border:1px solid rgba(255,255,255,.18);border-radius:4px;background:#ffffff0f;font-family:inherit;font-size:.9em}.inspector{width:14rem;flex:0 0 auto;padding:.75rem;background:var(--panel);border-left:1px solid rgba(255,255,255,.08);overflow-y:auto}.inspector-subtitle{margin:1.1rem 0 .4rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}.inspector-data{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.2rem .6rem;font-size:.85rem}.inspector-data dt{color:var(--muted)}.inspector-data dd{margin:0}.inspector-edges{list-style:none;margin:0;padding:0;font-size:.8rem}.inspector-edges li{display:flex;justify-content:space-between;gap:.5rem;padding:.15rem 0;border-bottom:1px solid rgba(255,255,255,.05)}.inspector-edge-name{color:var(--muted)}.inspector-actions{margin-top:1.1rem;display:flex;flex-direction:column;gap:.4rem}.inspector-actions button{padding:.4rem .6rem;border:1px solid rgba(255,255,255,.12);border-radius:6px;background:transparent;color:inherit;font:inherit;cursor:pointer}.inspector-actions button:hover:not(:disabled){background:#ffffff14}.inspector-actions button:disabled{opacity:.45;cursor:not-allowed}.zoom-controls{position:absolute;right:.75rem;bottom:.75rem;display:flex;align-items:center;gap:.25rem;padding:.25rem;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:#23262ce6}.zoom-controls button{min-width:2rem;padding:.25rem .5rem;border:1px solid rgba(255,255,255,.12);border-radius:5px;background:transparent;color:inherit;font:inherit;line-height:1.2;cursor:pointer}.zoom-controls button:hover{background:#ffffff14}.zoom-level{min-width:3.25rem;text-align:center;font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}.palette{width:12rem;flex:0 0 auto;padding:.75rem;background:var(--panel);border-right:1px solid rgba(255,255,255,.08);overflow-y:auto}.palette-title{margin:0 0 .5rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.palette-title:not(:first-child){margin-top:1.1rem}.palette-note{margin:0;font-size:.85rem;color:var(--muted)}.palette-error{margin:0;font-size:.85rem;color:#f28b82}.palette-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.25rem}.palette-item{width:100%;display:flex;align-items:center;gap:.6rem;padding:.35rem .5rem;border:1px solid transparent;border-radius:6px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}.palette-item:hover{background:#ffffff0f}.palette-item.is-active{border-color:var(--accent);background:#6ea8fe24}.palette-thumb{width:2.25rem;height:2rem;flex:0 0 auto;object-fit:cover;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}.palette-thumb--select{display:block;background:#6ea8fe40;border:1px solid var(--accent)}.palette-thumb--eraser{display:block;background:repeating-linear-gradient(45deg,#3a3f47,#3a3f47 4px,#2b2f36 4px 8px)}@media(max-width:900px){.app-header{flex-wrap:wrap;gap:.5rem 1rem}.palette{width:10rem}.inspector{width:11.5rem}}@media(max-width:640px){.app-main{flex-direction:column}.palette,.inspector{width:auto;max-height:30vh;border:none;border-bottom:1px solid rgba(255,255,255,.08)}.inspector{border-bottom:none;border-top:1px solid rgba(255,255,255,.08)}.palette-list{flex-direction:row;flex-wrap:wrap}.palette-item{width:auto}.board-area{min-height:55vh}.shortcut-row dt{flex-basis:7rem}}
