:root{--bg: #fafafa;--surface: #ffffff;--border: #e0e0e0;--border-strong: #c8c8c8;--text: #1f2328;--text-muted: #586069;--accent: #2962ff;--accent-soft: #e3f2fd;--danger: #c62828;--code-bg: #0d1117;--code-fg: #e6edf3}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;line-height:1.5}main{max-width:960px;margin:0 auto;padding:32px 24px 80px}.example-header{margin-bottom:24px}.example-header h1{margin:0 0 8px;font-size:1.75rem}.example-header p{margin:0;color:var(--text-muted);max-width:60ch}.back-link{display:inline-block;margin-bottom:16px;color:var(--accent);text-decoration:none;font-size:.875rem}.back-link:hover{text-decoration:underline}.demo{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:20px;margin:24px 0}.sortable-list{list-style:none;padding:8px;margin:0;border:2px dashed var(--border);border-radius:8px;min-height:80px;background:var(--bg)}.sortable-item{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:12px 14px;margin:6px 0;cursor:grab;-webkit-user-select:none;user-select:none;transition:background-color .12s ease,border-color .12s ease,transform .12s ease}.sortable-item:hover{background:#f5f7fa}.sortable-item:active{cursor:grabbing}.sortable-ghost{opacity:.4;background:var(--accent-soft)}.sortable-chosen{background:var(--accent-soft);border-color:var(--accent)}.sortable-drag{opacity:.6}.sortable-selected{background:#fff8e1;border-color:#f9a825}.sortable-focused{outline:2px solid var(--accent);outline-offset:2px}.code-section{margin-top:32px}.code-section h2{font-size:1.125rem;margin:0 0 12px}pre.code-block{background:var(--code-bg);color:var(--code-fg);border-radius:8px;padding:16px 18px;overflow-x:auto;font-size:.8125rem;line-height:1.55;margin:0}pre.code-block code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace}.notes{background:#fff8e1;border-left:4px solid #f9a825;padding:12px 16px;border-radius:4px;margin:16px 0;font-size:.9375rem}.notes strong{color:#6d4c00}