.app{display:flex;flex-direction:column;height:100vh;font-family:system-ui,-apple-system,sans-serif}.tabs{display:flex;gap:2px;background:#e0e0e0;padding:4px 4px 0;border-bottom:1px solid #ccc}.tab{padding:8px 16px;border:1px solid #ccc;border-bottom:none;background:#f0f0f0;cursor:pointer;border-radius:4px 4px 0 0;position:relative}.tab:hover{background:#e8e8e8}.tab.active{background:#fff;border-bottom:1px solid white;margin-bottom:-1px}.tab-close{margin-left:8px;padding:2px 6px;border-radius:50%;font-size:12px}.tab-close:hover{background:#ddd}.content{flex:1;padding:16px;overflow:auto;background:#fff}.home-page{max-width:600px;margin:0 auto;text-align:center;padding-top:40px}.puzzle-list{max-width:1000px;margin:0 auto}.puzzle-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.puzzle-table{width:100%;border-collapse:collapse}.puzzle-table th,.puzzle-table td{padding:8px 12px;text-align:left;border-bottom:1px solid #ddd}.puzzle-table th{background:#f5f5f5;font-weight:600}.puzzle-table .actions{display:flex;gap:8px}.puzzle-editor{height:100%;display:flex;flex-direction:column}.puzzle-editor-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #ddd}.puzzle-editor-actions{display:flex;gap:8px}.puzzle-editor-layout{display:flex;gap:24px;flex:1;overflow:hidden}.puzzle-editor-left{flex:2;overflow:auto}.puzzle-editor-right{flex:1;overflow:auto;display:flex;flex-direction:column;gap:16px}.solution-status{padding:8px 12px;margin-bottom:16px;border-radius:4px}.solution-status .complete{color:#2e7d32;background:#e8f5e9;padding:4px 8px;border-radius:4px}.solution-status .incomplete{color:#f57c00;background:#fff3e0;padding:4px 8px;border-radius:4px}.solution-status .conflict{color:#c62828;background:#ffebee;padding:4px 8px;border-radius:4px}.puzzle-info{background:#f9f9f9;padding:12px;border-radius:4px}.puzzle-info h3{margin:0 0 12px;font-size:14px}.form-field{margin-bottom:8px}.form-field label{display:block;font-size:12px;color:#666;margin-bottom:2px}.form-field input{width:100%;padding:6px 8px;border:1px solid #ddd;border-radius:4px;box-sizing:border-box}.elements-editor{background:#f9f9f9;padding:12px;border-radius:4px}.elements-editor h3{margin:0 0 12px;font-size:14px}.counter-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}.counter-row span{min-width:100px}.counter-row button{width:24px;height:24px;padding:0;font-size:16px}.properties-list{display:flex;flex-direction:column;gap:12px;margin-top:12px}.property-section{background:#fff;padding:8px;border-radius:4px;border:1px solid #ddd}.property-name{width:100%;padding:4px 8px;border:1px solid #ccc;border-radius:4px;font-weight:600;margin-bottom:8px;box-sizing:border-box}.instances-list{display:flex;flex-wrap:wrap;gap:4px}.instance-value{width:80px;padding:4px 6px;border:1px solid #ddd;border-radius:4px;font-size:12px}.hints-editor{background:#f9f9f9;padding:12px;border-radius:4px}.hints-editor h3{margin:0 0 12px;font-size:14px}.puzzle-text{margin-bottom:16px}.puzzle-text label{display:block;font-size:12px;color:#666;margin-bottom:4px}.puzzle-text textarea{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px;box-sizing:border-box;resize:vertical}.hints-groups-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.hints-groups{display:flex;flex-direction:column;gap:12px}.hints-group{background:#fff;padding:8px;border-radius:4px;border:1px solid #ddd}.hints-group-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.hints-group textarea{width:100%;padding:6px;border:1px solid #ddd;border-radius:4px;box-sizing:border-box;resize:vertical}.constraints-list{margin-top:8px;padding-top:8px;border-top:1px solid #eee}.constraint{display:flex;align-items:center;padding:4px 0;font-size:12px;gap:8px}.constraint-type{color:#666;flex-shrink:0}.constraint-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.constraint-actions{display:flex;gap:4px;flex-shrink:0}.constraint-action-btn{padding:2px 6px;font-size:11px;border:1px solid #ddd;border-radius:3px;background:#fafafa;cursor:pointer}.constraint-action-btn:hover:not(:disabled){background:#f0f0f0}.constraint-action-btn:disabled{opacity:.5;cursor:not-allowed}.constraint-action-remove:hover:not(:disabled){background:#ffebee;border-color:#ef9a9a;color:#c62828}.add-constraint-btn{margin-top:8px;padding:4px 8px;font-size:12px;border:1px dashed #ccc;border-radius:4px;background:transparent;color:#666;cursor:pointer;width:100%}.add-constraint-btn:hover:not(:disabled){background:#f5f5f5;border-color:#999;color:#333}.add-constraint-btn:disabled{opacity:.5;cursor:not-allowed}.constraint-editor{margin:12px 0;padding:12px;background:#f9f9f9;border:1px solid #e0e0e0;border-radius:4px}.no-constraints{color:#999;font-size:12px;font-style:italic}.puzzle-grid,.grid-section{margin-bottom:24px}.grid-section h4{margin:0 0 8px;font-size:14px;color:#666}.grid-table{border-collapse:collapse}.grid-table th,.grid-table td{border:1px solid #ddd;padding:4px 8px;text-align:center;min-width:40px}.grid-table th{background:#f5f5f5;font-weight:400;font-size:12px}.row-header{text-align:right!important}.grid-cell{width:40px;height:40px;font-weight:700}.cell-true{background:#c8e6c9;color:#2e7d32}.cell-false{background:#ffcdd2;color:#c62828}.cell-conflict{background:#fff3e0;color:#e65100}.cell-unknown{background:#fafafa;color:#bbb}.connections-table{margin-top:24px}.connections-table h3{margin:0 0 12px;font-size:14px}.connections-table table{width:100%;border-collapse:collapse}.connections-table th,.connections-table td{padding:6px 12px;text-align:left;border-bottom:1px solid #ddd;font-size:13px}.connections-table th{background:#f5f5f5}.connection-true td{background:#f1f8e9}.connection-false td{background:#fbe9e7}.connection-conflict td{background:#fff8e1}.error{color:#c62828;padding:8px 12px;background:#ffebee;border-radius:4px;margin-bottom:16px}button{padding:6px 12px;border:1px solid #ccc;border-radius:4px;background:#fff;cursor:pointer}button:hover{background:#f5f5f5}button:disabled{opacity:.5;cursor:not-allowed}.token-chip{display:inline-flex;align-items:center;padding:4px 10px;border-radius:16px;font-size:13px;cursor:pointer;transition:background-color .15s,transform .1s;white-space:nowrap;border:1px solid transparent}.token-chip:hover{transform:scale(1.02)}.token-chip:active{transform:scale(.98)}.token-chip-selected{background:#e3f2fd;color:#1565c0;border-color:#90caf9}.token-chip-selected:hover{background:#bbdefb}.token-chip-choice{background:#f5f5f5;color:#424242;border-color:#e0e0e0}.token-chip-choice:hover{background:#eee;border-color:#bdbdbd}.grammar-constraint-widget{background:#fff;border:1px solid #ddd;border-radius:4px;padding:12px}.grammar-stream{display:flex;flex-wrap:wrap;gap:6px;min-height:32px;padding:8px;background:#fafafa;border:1px solid #e0e0e0;border-radius:4px;margin-bottom:12px}.grammar-placeholder{color:#999;font-size:13px;font-style:italic}.grammar-choices{display:flex;flex-wrap:wrap;gap:6px;padding:8px 0;border-top:1px solid #eee;margin-bottom:12px}.grammar-no-choices{color:#999;font-size:13px;font-style:italic}.grammar-status{padding:8px 12px;border-radius:4px;font-size:13px;margin-bottom:12px}.grammar-complete{background:#e8f5e9;color:#2e7d32}.grammar-failed{background:#ffebee;color:#c62828}.grammar-actions{display:flex;gap:8px;justify-content:flex-end}