.experience-page{max-width:1150px;margin:auto;padding:56px 0}.experience-heading{max-width:820px;margin-bottom:36px}.experience-heading h1{font-size:clamp(36px,5vw,68px);line-height:1.08;letter-spacing:-.045em}.experience-page p{color:#465e59;line-height:1.8}.demo-layout{display:grid;grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr);gap:24px}.demo-layout form,.demo-preview,.demo-comparison section,.example-card{background:#fffefa;border:1px solid var(--sp-line);padding:24px;min-width:0}.demo-layout label{display:block;font-size:12px;font-weight:700;margin:16px 0 6px}.demo-layout input,.demo-layout textarea{width:100%;padding:12px;border:1px solid #c4ccc5;background:#fffefa;color:#18252b;font:inherit}.demo-preview iframe{width:100%;height:530px;border:0;background:#f3f1e9}.demo-actions{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.demo-comparison{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin:24px 0}.demo-comparison pre{white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.8 ui-monospace,monospace}.experience-page button[disabled]{opacity:.5;cursor:not-allowed}.experience-page :focus-visible{outline:3px solid #3656d8;outline-offset:4px}.guide-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.example-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.example-card h2{font-size:24px;line-height:1.3}.example-card nav{display:flex;flex-wrap:wrap;gap:12px;font-size:13px}.evidence-note{padding:20px;background:#edf2df;border:1px solid #d9ded8;margin-bottom:24px}
@media(max-width:760px){.demo-layout,.demo-comparison,.example-grid{grid-template-columns:minmax(0,1fr)}.experience-page{padding:32px 0}.demo-layout form,.demo-preview,.demo-comparison section,.example-card{padding:18px}.demo-preview iframe{height:460px}}