.lpx-demo{--demo-ink:#103340;--demo-paper:#f4f1e9;--demo-muted:#a9c1c8;--demo-border:#35535e;--demo-accent:#91e6d7;--demo-amber:#f4bf73;color:#f6f3eb;max-width:1800px;margin:auto;padding:62px 4.5% 0}.lpx-demo [hidden]{display:none!important}.lpx-demo button{cursor:pointer}.lpx-demo button:disabled{cursor:not-allowed;opacity:.45}.lpx-demo button,.lpx-demo input,.lpx-demo textarea{font:inherit}.lpx-demo button:focus-visible,.lpx-demo input:focus-visible,.lpx-demo textarea:focus-visible,.lpx-demo summary:focus-visible{outline-offset:3px;outline:3px solid #e6a649}.demo-heading{grid-template-columns:1.2fr 1fr;align-items:end;gap:10%;margin-bottom:42px;display:grid}.demo-kicker{letter-spacing:.14em;color:#9db7c0;font:10px/1.5 monospace;display:block}.demo-heading h1{letter-spacing:-.065em;margin:19px 0 0;font-size:clamp(42px,5.4vw,76px);font-weight:600;line-height:1.02}.demo-heading em,.demo-boundary em{color:var(--demo-accent);font-family:Georgia,serif;font-weight:400}.demo-intro>p:first-child{max-width:44ch;margin-bottom:20px;font-size:18px;line-height:1.6}.lpx-demo .demo-fine{color:var(--demo-muted);margin:12px 0;font-size:12px;line-height:1.6}.demo-local{color:var(--demo-accent);align-items:center;gap:9px;font-size:12px;display:flex}.demo-local i{background:var(--demo-accent);border-radius:100%;width:7px;height:7px}.demo-console{border:1px solid var(--demo-border);background:#102e3b;border-radius:10px;overflow:hidden;box-shadow:0 30px 70px #00121e44}.demo-console-bar{border-bottom:1px solid var(--demo-border);letter-spacing:.1em;background:#09232f;align-items:center;gap:20px;min-height:57px;padding:10px 22px;font:10px/1.5 monospace;display:flex}.demo-console-bar b{letter-spacing:-.04em;margin-right:12px;font-size:17px}.demo-local-label{color:#afc4ca;margin-left:auto;font-size:9px}.lpx-demo .demo-reset{border:0;border-left:1px solid var(--demo-border);color:var(--demo-accent);background:0 0;min-height:36px;padding:6px 0 6px 20px;font:12px/1.5 Arial,sans-serif}.demo-progress{border-bottom:1px solid var(--demo-border);padding:0 24px}.demo-progress ol{margin:0;padding:0;list-style:none;display:flex}.demo-progress li{flex:1;position:relative}.demo-progress li:not(:last-child):after{content:"→";color:#6c8893;font-size:13px;position:absolute;top:50%;right:9%;transform:translateY(-50%)}.demo-progress button{color:#9bb5bf;background:0 0;border:0;border-bottom:3px solid #0000;align-items:center;gap:10px;width:100%;min-height:69px;padding:12px 0;font-size:13px;display:flex}.demo-progress button span{border:1px solid #476470;border-radius:100%;place-items:center;width:25px;height:25px;font:10px/1 monospace;display:grid}.demo-progress .current button{color:var(--demo-paper);border-bottom-color:var(--demo-accent)}.demo-progress .current button span{background:var(--demo-accent);color:#092c37;border-color:var(--demo-accent)}.demo-progress .complete button{color:var(--demo-accent)}.demo-workspace{grid-template-columns:minmax(280px,330px) minmax(0,1fr);display:grid}.demo-config{border-right:1px solid var(--demo-border);background:#12323f;flex-direction:column;min-width:0;padding:24px;display:flex}.demo-panel-label{color:#9ebac3;letter-spacing:.1em;justify-content:space-between;gap:12px;margin-bottom:24px;font:10px/1.5 monospace;display:flex}.demo-panel-label span:last-child{color:var(--demo-amber)}.demo-config h2{letter-spacing:-.045em;margin:0 0 10px;font-size:28px;line-height:1.13}.demo-config fieldset{border:0;min-width:0;margin:18px 0 0;padding:0}.demo-config legend{color:#cbdce0;margin-bottom:9px;padding:0;font-size:11px;font-weight:600;line-height:1.5}.demo-choice-pair{grid-template-columns:1fr 1fr;gap:7px;display:grid}.demo-choice-pair button{text-align:left;color:#f3f3e9;background:#163d49;border:1px solid #45626c;border-radius:3px;flex-direction:column;gap:5px;min-height:72px;padding:12px 9px;display:flex}.demo-choice-pair strong{font-size:12px;font-weight:500}.demo-choice-pair small{color:#afc5ce;font-size:10px;line-height:1.4}.demo-choice-pair button[aria-pressed=true]{border-color:var(--demo-accent);background:#204b53}.lpx-demo .demo-seed-note{margin:7px 0 0;font-size:10px}.demo-field{color:#cbdce0;margin-top:17px;font-size:11px;font-weight:600;display:block}.demo-field>span{float:right;color:#9eb5be;font:10px/1.5 monospace}.demo-field input,.demo-field textarea{color:#f9f6ec;resize:vertical;background:#0a2834;border:1px solid #47616c;border-radius:3px;width:100%;min-height:44px;margin-top:8px;padding:11px;font-size:13px;line-height:1.5;display:block}.demo-segments{border:1px solid #45626c;border-radius:3px;display:flex;overflow:hidden}.demo-segments button{color:#b9cdd5;background:#0c2936;border:0;flex:1;min-height:44px;padding:10px;font-size:12px}.demo-segments button[aria-pressed=true]{background:var(--demo-paper);color:var(--demo-ink)}.demo-palette-list{flex-direction:column;gap:5px;display:flex}.demo-palette-list button{color:#c2d3d7;text-align:left;background:0 0;border:1px solid #0000;border-radius:3px;align-items:center;gap:8px;min-height:44px;padding:7px 9px;font-size:11px;display:flex}.demo-palette-list button[aria-pressed=true]{color:#fff;background:#1d4650;border-color:#81d7c9}.demo-palette-list button>span:last-child{color:var(--demo-accent);margin-left:auto}.demo-swatches{flex-shrink:0;display:flex}.demo-swatches i{border:1px solid #91a7ad66;width:17px;height:17px;display:block}.demo-swatches i:first-child{border-radius:50% 0 0 50%}.demo-swatches i:last-child{border-radius:0 50% 50% 0}.demo-checks label{align-items:center;gap:9px;min-height:36px;font-size:12px;display:flex}.demo-checks input,.demo-approval input{accent-color:var(--demo-accent);flex-shrink:0;width:17px;height:17px}.demo-checks .demo-fine{font-size:10px}.demo-workflow-actions{align-items:center;gap:10px;margin-top:auto;padding-top:24px;display:flex}.demo-primary{border:1px solid var(--demo-accent);background:var(--demo-accent);color:#092e37;border-radius:3px;flex:1;justify-content:space-between;align-items:center;gap:14px;min-height:46px;padding:12px 16px;display:flex;font-size:12px!important;font-weight:600!important}.demo-primary:hover:not(:disabled){background:#b5f1e5}.demo-back,.demo-text-button{color:var(--demo-accent);background:0 0;border:0;min-height:44px;padding:12px 0;font-size:12px!important}.demo-back{color:#d2e0e4;white-space:nowrap}.demo-errors{color:#ffe5c2;background:#593c2a;border:1px solid #db9e65;padding:14px 14px 14px 28px;font-size:12px;line-height:1.5}.demo-canvas-column{flex-direction:column;min-width:0;display:flex}.demo-preview-toolbar{background:#0e2935;border-bottom:1px solid #294a59;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:15px 20px;display:flex}.demo-view-switch,.demo-width-switch{gap:3px;display:flex}.demo-preview-toolbar button{color:#b1c7cf;background:0 0;border:1px solid #0000;border-radius:3px;min-height:36px;padding:7px 12px;font-size:11px}.demo-view-switch button[aria-pressed=true]{color:#f3f3ec;background:#244957;border-color:#496773}.demo-width-switch button[aria-pressed=true]{color:var(--demo-accent);border-color:#53757d}.demo-canvas-mat{background-color:#1b3d4a;background-image:radial-gradient(#71949f44 .8px,#0000 .8px);background-size:16px 16px;justify-content:center;align-items:flex-start;min-height:540px;padding:28px 22px;display:flex}.demo-browser{background:var(--demo-paper);border:1px solid #48626c;border-radius:5px;width:100%;min-width:0;overflow:hidden;box-shadow:0 15px 35px #00192355}.demo-browser-mobile{width:360px;max-width:100%}.demo-browser-chrome{color:#4a5f63;background:#e8e5dc;border-bottom:1px solid #c4c8c1;justify-content:space-between;align-items:center;gap:10px;min-height:35px;padding:10px 12px;font:9px/1.3 monospace;display:flex}.demo-browser-chrome>span:first-child{color:#7d979b;letter-spacing:2px;white-space:nowrap;font-size:8px}.demo-browser-chrome>span:nth-child(2){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.demo-browser-chrome>span:last-child{white-space:nowrap;font-size:8px}.demo-browser iframe{background:var(--demo-paper);border:0;width:100%;height:465px;display:block}.demo-browser-mobile iframe{height:540px}.demo-art-caption{color:#c0d1d7;border-bottom:1px solid var(--demo-border);background:#183947;justify-content:space-between;gap:14px;padding:12px 21px;font:9px/1.6 monospace;display:flex}.demo-art-caption>span:last-child{text-align:right;color:#9fbac4;font:10px/1.5 Arial,sans-serif}.demo-inspector{background:#0d2a37;flex:1;min-height:224px;padding:0 22px 20px}.demo-inspector-tabs{border-bottom:1px solid var(--demo-border);gap:23px;margin-bottom:21px;display:flex;overflow-x:auto}.demo-inspector-tabs button{color:#a6bec8;white-space:nowrap;background:0 0;border:0;border-bottom:2px solid #0000;min-height:45px;padding:15px 0 12px;font-size:11px}.demo-inspector-tabs button[aria-pressed=true]{border-bottom-color:var(--demo-accent);color:var(--demo-accent)}.demo-brief-inspector{overflow-wrap:anywhere;grid-template-columns:1fr 1fr;gap:25px;display:grid}.demo-brief-inspector h3{color:#f4f1e9;letter-spacing:-.02em;margin:9px 0;font:400 29px/1.2 Georgia,serif}.demo-brief-inspector p{margin-bottom:0;font-size:12px}.demo-brief-inspector dl{margin:0}.demo-brief-inspector dl>div{border-bottom:1px solid #2e4b58;justify-content:space-between;gap:20px;padding:8px 0;font-size:11px;display:flex}.demo-brief-inspector dt{color:#9ebac3}.demo-brief-inspector dd{text-align:right;color:#edf1eb;margin:0}.demo-role-list details,.demo-source-inspector details{border-bottom:1px solid #34515d}.demo-role-list summary,.demo-source-inspector summary{cursor:pointer;color:#c9d7dc;min-height:44px;padding:12px 0;font-size:11px;line-height:1.5}.demo-role-list summary span{width:90px;color:var(--demo-accent);font-weight:600;display:inline-block}.demo-role-list details p{max-width:75ch;padding:0 5px 7px;font-size:12px}.demo-role-list>.demo-fine{margin:0 0 7px}.demo-source-inspector>div>p{margin:5px 0;font-size:11px}.demo-source-inspector pre{white-space:pre-wrap;overflow-wrap:anywhere;color:#d1e2df;background:#071e29;border:1px solid #355663;border-radius:3px;max-height:260px;padding:15px;font:10px/1.65 monospace;overflow:auto}.demo-ai-reference{margin:24px 0 18px}.demo-ai-reference img{aspect-ratio:3/2;object-fit:cover;border:1px solid #4a6a73;border-radius:3px;width:100%;height:auto;display:block}.demo-ai-reference figcaption{color:#adc5cb;margin-top:9px;font-size:10px;line-height:1.65}.demo-stage-copy{flex:1}.demo-stage-copy>.demo-kicker{margin:8px 0 18px}.demo-stage-copy>p{margin:18px 0;font-size:13px}.demo-stage-copy strong{color:#f5f3ec;overflow-wrap:anywhere}.demo-plan{counter-reset:plan;margin:26px 0;padding:0;list-style:none}.demo-plan li{border-top:1px solid var(--demo-border);counter-increment:plan;padding:20px 0}.demo-plan b{color:var(--demo-accent);margin-bottom:9px;font-size:13px;font-weight:500;display:block}.demo-plan b:before{content:"0" counter(plan) " / ";color:#98b2bc;font:10px/1.5 monospace}.demo-plan span{color:#b9cdd4;font-size:12px;line-height:1.8;display:block}.demo-review-list{color:#bed0d5;margin:25px 0;padding:0;font-size:12px;list-style:none}.demo-review-list li{border-top:1px solid var(--demo-border);padding:13px 0 13px 22px;position:relative}.demo-review-list li:before{content:"↳";color:var(--demo-amber);position:absolute;left:0}.demo-approval{background:#244651;border:1px solid #617e85;border-radius:3px;align-items:flex-start;gap:10px;margin-top:28px;padding:15px;font-size:12px;line-height:1.7;display:flex}.demo-approved{color:var(--demo-accent);letter-spacing:.05em;margin:8px 0 20px;font:10px/1.6 monospace;display:block}.demo-downloads{flex-direction:column;gap:9px;margin:25px 0;display:flex}.demo-downloads button{color:#eff6e8;text-align:left;background:#21494e;border:1px solid #668882;border-radius:3px;justify-content:space-between;align-items:center;gap:12px;min-height:60px;padding:13px;font-size:12px;display:flex}.demo-downloads button:hover:not(:disabled){border-color:var(--demo-accent);background:#315f60}.demo-downloads button span{color:var(--demo-accent);white-space:nowrap;font:10px/1.5 monospace}.demo-status{color:#b7ced5;border-top:1px solid var(--demo-border);background:#08232f;align-items:center;gap:12px;min-height:49px;padding:13px 23px;font-size:11px;display:flex}.demo-status>span{color:var(--demo-accent);font-size:18px}.demo-boundary{grid-template-columns:1fr 1fr;gap:10%;padding:70px 10px;display:grid}.demo-boundary h2{margin:20px 0;font-size:clamp(31px,3.5vw,48px);line-height:1.1}.demo-boundary p{max-width:50ch;font-size:14px}.demo-boundary dl{margin:0}.demo-boundary dl>div{border-top:1px solid var(--demo-border);padding:19px 0}.demo-boundary dt{color:var(--demo-accent);margin-bottom:9px;font-size:13px}.demo-boundary dd{color:#b1c7cf;margin:0;font-size:12px;line-height:1.8}@media (min-width:1500px){.demo-workspace{grid-template-columns:370px minmax(0,1fr)}.demo-config{padding:28px}.demo-browser iframe{height:530px}.demo-canvas-mat{padding:32px}.demo-browser-mobile iframe{height:580px}}@media (max-width:1050px){.lpx-demo{padding:42px 3% 0}.demo-workspace{grid-template-columns:285px minmax(0,1fr)}.demo-config{padding:20px 16px}.demo-heading{gap:6%}.demo-preview-toolbar{padding:12px}.demo-canvas-mat{padding:20px 12px}.demo-art-caption{flex-direction:column;gap:4px;padding:12px}.demo-art-caption>span:last-child{text-align:left}.demo-brief-inspector{grid-template-columns:1fr;gap:18px}.demo-inspector{padding:0 14px 18px}.demo-inspector-tabs{gap:16px}.demo-local-label{display:none}.demo-console-bar .demo-reset{margin-left:auto}.demo-progress li:not(:last-child):after{display:none}.demo-progress button{gap:7px;font-size:12px}.demo-heading h1{font-size:54px}.demo-intro>p:first-child{font-size:16px}}@media (max-width:760px){.lpx-demo{padding:32px 4% 0}.demo-heading{grid-template-columns:1fr;gap:24px;margin-bottom:28px}.demo-heading h1{font-size:clamp(42px,10vw,62px)}.demo-intro>p:first-child{max-width:45ch;margin-bottom:12px}.demo-workspace{grid-template-columns:1fr}.demo-config{border-right:0;border-bottom:1px solid var(--demo-border);padding:22px}.demo-config fieldset{margin-top:18px}.demo-config h2{font-size:31px}.demo-console-bar{padding:10px 15px;font-size:9px}.demo-progress{padding:0 10px}.demo-progress button{flex-direction:column;gap:7px;min-height:77px;padding:11px 3px;font-size:10px}.demo-progress button span{width:23px;height:23px}.demo-choice-pair button{min-height:65px;padding:12px}.demo-choice-pair strong{font-size:13px}.demo-choice-pair small{font-size:11px}.demo-field input,.demo-field textarea{font-size:16px}.demo-palette-list button{font-size:12px}.demo-palette-list{gap:3px}.demo-checks label{min-height:44px}.demo-workflow-actions{padding-top:20px}.demo-back{padding-right:12px}.demo-primary{min-height:49px}.demo-canvas-mat{min-height:0;padding:22px 13px}.demo-browser iframe{height:460px}.demo-browser-mobile iframe{height:520px}.demo-preview-toolbar button{min-height:44px;padding:8px}.demo-preview-toolbar{gap:5px}.demo-width-switch button{font-size:10px}.demo-inspector-tabs button{min-height:48px}.demo-brief-inspector{grid-template-columns:1fr;gap:15px}.demo-brief-inspector dl>div{padding:11px 0;font-size:12px}.demo-inspector{padding:0 18px 22px}.demo-role-list summary{font-size:12px}.demo-role-list summary span{width:auto;margin-bottom:4px;display:block}.demo-boundary{grid-template-columns:1fr;gap:22px;padding:45px 0}.demo-boundary h2{font-size:38px}.demo-status{align-items:flex-start;padding:12px 15px;font-size:11px}.demo-downloads button{min-height:64px}}@media (prefers-reduced-motion:reduce){.lpx-demo *{scroll-behavior:auto!important}}
