.migration-page{max-width:1440px;padding:calc(var(--shell-header) + 28px) 28px 48px;margin:auto}.migration-page .title-strip{margin-bottom:24px}.migration-settings,.migration-actions{flex-wrap:wrap;align-items:end;gap:12px;margin:18px 0;display:flex}.migration-settings label,.migration-actions label{gap:5px;font-size:13px;display:grid}.migration-settings select,.migration-actions select,.migration-settings button,.migration-actions button{font:inherit;border:1px solid var(--border);background:var(--paper);color:var(--foreground);cursor:pointer;padding:9px 12px}.migration-page button:focus-visible,.migration-page select:focus-visible,.migration-page summary:focus-visible{outline:2px solid var(--primary);outline-offset:3px}.migration-note{max-width:950px;color:var(--muted);font-size:13px}#samples{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:18px;display:grid}.migration-sample{border:1px solid var(--persona-border);background:var(--persona-background);color:var(--persona-text);border-radius:16px;min-width:0;padding:20px}.migration-sample>h2{margin:0 0 18px;font:600 17px system-ui}.migration-sample>h3{letter-spacing:.08em;text-transform:uppercase;color:var(--persona-text-muted);margin:24px 0 12px;font:500 12px system-ui}.migration-controls{flex-wrap:wrap;align-items:center;gap:16px;min-height:48px;display:flex}.migration-sample [data-demo-tool]{margin-bottom:12px}.migration-sample .migration-starters{flex-wrap:wrap;gap:8px;margin:16px 0;display:flex}.migration-live{margin:40px 0}.migration-live>p{max-width:900px}.migration-live-layout{grid-template-columns:minmax(0,2fr) minmax(260px,1fr);align-items:start;gap:20px;display:grid}.migration-live-frame{border:1px solid var(--border);min-width:0;height:640px}#live-host{min-width:0;height:100%}.migration-code{border:1px solid var(--border);min-width:0;padding:16px;font-size:13px}.migration-code summary{cursor:pointer;font-weight:600}.migration-code pre{max-height:540px;font:12px/1.6 var(--font-mono,monospace);overflow:auto}.migration-config-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.migration-config-grid>div{min-width:0}.migration-page[data-width=narrow] .migration-sample,.migration-page[data-width=narrow] .migration-live-frame{justify-self:center;width:320px;max-width:100%}.migration-page[data-width=narrow] #samples{grid-template-columns:repeat(3,minmax(0,1fr))}@media (width<=1050px){#samples,.migration-page[data-width=narrow] #samples,.migration-live-layout{grid-template-columns:1fr}}@media (width<=600px){.migration-page{padding:calc(var(--shell-header) + 20px) 12px 40px}.migration-sample{padding:16px}.migration-config-grid{grid-template-columns:1fr}.migration-live-frame{height:560px}}
