.object-topbar nav{display:flex;gap:24px}
.object-topbar nav a,.object-demo-footer a{color:var(--muted);font-size:.88rem;text-decoration:none}
.object-topbar nav a:hover,.object-demo-footer a:hover{color:var(--blue)}
.object-demo-main{padding:clamp(32px,6vw,84px) clamp(20px,5vw,72px) 72px}
.object-demo-heading{max-width:920px;padding-bottom:42px}
.object-demo-heading h1{margin:0;font-size:clamp(3rem,7vw,6.4rem)}
.object-demo-lead{max-width:680px;margin:24px 0 0;color:var(--muted);font-size:clamp(1.05rem,2vw,1.25rem);line-height:1.5}
.object-demo-notice{max-width:760px;margin:20px 0 0;padding:14px 16px;border-left:2px solid var(--blue);background:rgb(47 91 234/.055);color:var(--muted);font-size:.9rem;line-height:1.5}
.object-demo-tabs{display:none}
.object-demo-layout{display:grid;grid-template-columns:minmax(310px,.86fr) minmax(0,1.14fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.object-editor,.object-preview-panel{min-width:0;padding:clamp(20px,3.5vw,48px);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.object-editor{background:var(--paper-deep)}
.object-editor-heading,.object-preview-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px}
.object-editor-heading h2,.object-preview-heading h2{font-size:1.2rem;letter-spacing:-.025em}
.object-editor-heading p,.object-preview-heading span{margin:8px 0 0;color:var(--muted);font-size:.82rem;line-height:1.4}
.object-button{min-height:44px;padding:9px 13px;border:1px solid var(--line);background:transparent;color:var(--ink);font-size:.84rem;font-weight:700;cursor:pointer}
.object-button:hover{border-color:var(--blue);color:var(--blue)}
.object-block-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:18px 0;padding:12px;border:1px solid var(--line);background:var(--paper)}
.object-block-picker button{min-height:44px;border:1px solid var(--line);background:transparent;text-align:left;padding:8px 10px;cursor:pointer}
.object-block-picker button:hover{border-color:var(--blue);color:var(--blue)}
.object-editor-blocks{display:grid;gap:10px;margin-top:20px}
.object-editor-block{border:1px solid var(--line);background:var(--paper)}
.object-editor-block header{display:flex;min-height:48px;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px 7px 14px;border-bottom:1px solid var(--line)}
.object-editor-block header strong{font-size:.86rem}
.object-block-tools{display:flex;gap:5px}
.object-block-tools button{width:36px;height:36px;border:1px solid var(--line);background:transparent;cursor:pointer}
.object-block-tools button:hover:not(:disabled){border-color:var(--blue);color:var(--blue)}
.object-block-tools button:disabled{opacity:.42;cursor:not-allowed}
.object-fields{display:grid;gap:12px;padding:13px}
.object-fields label{display:grid;gap:6px;color:var(--muted);font-size:.78rem;font-weight:700}
.object-fields input,.object-fields textarea{width:100%;min-height:42px;padding:9px 10px;border:1px solid var(--line);border-radius:0;background:var(--white);color:var(--ink);font:400 .9rem/1.45 Arial,sans-serif}
.object-fields textarea{min-height:88px;resize:vertical}
.object-fields input:focus-visible,.object-fields textarea:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
.object-reset{margin-top:18px;padding:8px 0;border:0;background:transparent;color:var(--muted);font-size:.82rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.object-reset:hover{color:var(--blue)}
.object-preview-heading{min-height:48px;align-items:center;margin-bottom:22px}
.object-preview-heading h2{margin:0}
.object-preview-heading span{margin:0;text-transform:uppercase;letter-spacing:.08em;font-size:.68rem;font-weight:800}
.object-preview{display:grid;max-width:720px;gap:20px}
.object-preview-block{min-width:0}
.object-preview-block--title h2{font-size:clamp(2.6rem,5vw,4.5rem)}
.object-preview-block--text p{margin:0;color:var(--muted);font-size:1.08rem;line-height:1.62;white-space:pre-wrap}
.object-preview-block img,.object-preview-block video{display:block;width:100%;max-height:440px;aspect-ratio:16/10;object-fit:cover;background:var(--paper-deep)}
.object-preview-block audio{width:100%}
.object-preview-caption,.object-preview-fallback{margin:8px 0 0;color:var(--muted);font-size:.82rem;line-height:1.45}
.object-preview-fallback{padding:14px;border:1px solid var(--line)}
.object-demo-footer{display:flex;justify-content:space-between;gap:18px;padding:20px clamp(20px,5vw,72px);border-top:1px solid var(--line)}
@media(max-width:900px){
  .object-demo-layout{grid-template-columns:1fr}
  .object-preview-panel{border-top:0}
}
@media(max-width:700px){
  .object-topbar{min-height:64px;padding:0 18px}
  .object-topbar nav{display:none}
  .object-demo-main{padding:34px 18px 52px}
  .object-demo-heading{padding-bottom:28px}
  .object-demo-heading h1{font-size:clamp(2.8rem,13vw,4rem)}
  .object-demo-lead{margin-top:18px;font-size:1rem}
  .object-demo-notice{font-size:.84rem}
  .object-demo-tabs{display:grid;grid-template-columns:1fr 1fr;margin-bottom:14px;border:1px solid var(--line)}
  .object-demo-tabs button{min-height:48px;border:0;background:transparent;font-weight:750;cursor:pointer}
  .object-demo-tabs button[aria-selected="true"]{background:var(--blue);color:#fff}
  .object-demo-layout{display:block;border:0}
  .object-editor,.object-preview-panel{padding:0;border:0;background:transparent}
  .object-demo-layout[data-view="edit"] .object-preview-panel,.object-demo-layout[data-view="view"] .object-editor{display:none}
  .object-editor-heading{display:block}
  .object-editor-heading h2,.object-preview-heading h2{font-size:1.1rem}
  .object-editor-heading .object-button{width:100%;margin-top:14px}
  .object-block-picker{grid-template-columns:1fr}
  .object-preview-heading{margin:2px 0 16px}
  .object-preview-block--title h2{font-size:clamp(2.6rem,12vw,3.5rem)}
  .object-demo-footer{flex-direction:column;padding:18px}
}
@media(prefers-reduced-motion:reduce){.object-demo-tabs button{scroll-behavior:auto}}
