:root{color:#1a1a1a;background:#dfdfdf;font-family:Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.5}*{box-sizing:border-box}body{min-height:100vh;margin:0}.app{max-width:1200px;margin:0 auto;padding:24px 20px 64px}.header{text-align:center;margin-bottom:24px}.header h1{margin:0;font:italic 700 clamp(2rem,5vw,3rem) Georgia,Times New Roman,serif}.subtitle{color:#555;margin:8px 0 0}.subtitle a,.credit a{color:#1a1a1a}.subtitle a:hover,.credit a:hover{color:#2563eb}.credit{text-align:center;color:#666;margin-top:48px;font-size:.9rem}.credit p{margin:0}.layout{grid-template-columns:240px 1fr;align-items:start;gap:20px;display:grid}.sidebar{position:sticky;top:16px}.panel{background:#fff;border-radius:12px;padding:16px;box-shadow:0 1px 4px #00000014}.panel-header{justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px;display:flex}.panel-header h2{margin:0;font-size:1rem}.machine-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.machine-item{text-align:left;cursor:pointer;background:#fafafa;border:1px solid #e0e0e0;border-radius:8px;flex-direction:column;gap:2px;width:100%;padding:10px 12px;display:flex}.machine-item:hover{border-color:#bbb}.machine-item.active{background:#eff6ff;border-color:#2563eb}.machine-item-name{font-size:.95rem;font-weight:600}.machine-item-meta{color:#666;font-size:.8rem}.main{min-width:0}.toolbar{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:12px;margin-bottom:12px;display:flex}.name-field{flex-direction:column;flex:1;gap:4px;min-width:200px;display:flex}.name-field span{color:#555;font-size:.85rem}.name-field input,.share-row input{width:100%;font:inherit;border:1px solid #ccc;border-radius:8px;padding:8px 10px}.toolbar-actions{gap:8px;display:flex}.btn{font:inherit;cursor:pointer;background:#fff;border:1px solid #ccc;border-radius:8px;padding:8px 14px}.btn:hover{background:#f5f5f5}.btn-primary{color:#fff;background:#2563eb;border-color:#2563eb}.btn-primary:hover{background:#1d4ed8}.btn-danger{color:#b91c1c;border-color:#fca5a5}.btn-danger:hover{background:#fef2f2}.canvas-panel{max-width:100%}.canvas-controls{flex-wrap:wrap;align-items:end;gap:10px;margin-bottom:10px;display:flex}.canvas-size-field{flex-direction:column;gap:4px;min-width:100px;display:flex}.canvas-size-field span{color:#555;font-size:.85rem}.canvas-size-field input{width:100px;font:inherit;border:1px solid #ccc;border-radius:8px;padding:8px 10px}.canvas-size-label{color:#666;align-self:center;margin-left:auto;font-size:.85rem}.canvas-shell{background:#cfcfcf;border-radius:20px;max-width:100%;padding:8px;display:inline-block;position:relative;overflow:auto;box-shadow:0 2px 8px #0000001a}.canvas-shell-toolbar{display:none}.canvas-shell.is-fullscreen{background:#dfdfdf;border-radius:0;flex-direction:column;width:100%;max-width:none;height:100%;padding:12px;display:flex;overflow:hidden}.canvas-shell.is-fullscreen .canvas-shell-toolbar{flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;display:flex}.canvas-shell.is-fullscreen .canvas-shell-title{font-weight:600}.canvas-shell.is-fullscreen .canvas-exit-btn{margin-left:auto}.canvas-shell.is-fullscreen .canvas-resize-handle{display:none}#canvas{cursor:crosshair;background:#fff;border-radius:12px;display:block}.canvas-resize-handle{cursor:nwse-resize;opacity:.7;background:linear-gradient(135deg,#0000 50%,#888 50%);border-radius:0 0 12px;width:18px;height:18px;position:absolute;bottom:4px;right:4px}.canvas-resize-handle:hover{opacity:1}.state-properties,.export-panel,.share-panel,.help{max-width:100%;margin-top:24px}.state-properties{background:#fff;border-radius:12px;padding:16px;box-shadow:0 1px 4px #00000014}.state-properties.hidden{display:none}.state-properties h2{margin:0 0 4px;font-size:1.1rem}.state-properties-hint{color:#666;margin:0 0 12px;font-size:.9rem}.state-properties-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));align-items:end;gap:12px;display:grid}.state-field{flex-direction:column;gap:4px;display:flex}.state-field span{color:#555;font-size:.85rem}.state-field input,.state-field select{font:inherit;border:1px solid #ccc;border-radius:8px;padding:8px 10px}.state-field input.hidden,.hidden{display:none}.state-checkbox{align-items:center;gap:8px;padding-bottom:8px;font-size:.95rem;display:flex}.export-panel,.share-panel,.help{max-width:100%;margin-top:24px}.export-links{text-align:center}.link-btn{color:#2563eb;cursor:pointer;font:inherit;background:0 0;border:none;padding:0 4px;text-decoration:underline}#output{resize:vertical;border:1px solid #ccc;border-radius:8px;width:100%;min-height:200px;margin-top:12px;padding:12px;font-family:ui-monospace,monospace;font-size:.85rem;display:none}.share-panel h2,.help h2{margin:0 0 8px;font-size:1.1rem}.share-row{gap:8px;margin-top:8px;display:flex}.share-row .btn{flex-shrink:0}.help ul{margin:0;padding-left:1.2rem}.help li+li{margin-top:6px}.status{color:#166534;min-height:1.25rem;margin-top:16px;font-size:.9rem}.error{color:red;padding:30px;font-size:1.5rem;display:block}@media (width<=900px){.layout{grid-template-columns:1fr}.sidebar{position:static}}