.lp .demo-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:1.5rem;display:grid}.lp .demo-card{border:1px solid var(--line);height:100%;box-shadow:var(--card-shadow);background:#fff;border-radius:.9rem;flex-direction:column;transition:border-color .15s,transform .15s;display:flex;overflow:hidden}.lp .demo-card:hover{border-color:#b8c4d4;transform:translateY(-2px)}.lp .demo-shot{aspect-ratio:800/538;background:var(--surface);border-bottom:1px solid var(--line);display:block;overflow:hidden}.lp .demo-shot img{object-fit:cover;object-position:top;width:100%;height:100%}.lp .demo-meta{flex-direction:column;gap:.15rem;padding:1rem 1.15rem 0;display:flex}.lp .demo-name{font-family:Poppins LP,Archivo LP,sans-serif;font-size:1.08rem;font-weight:600}.lp .demo-sub{color:var(--muted);font-size:15px}.lp .demo-open{color:var(--green);margin:auto 1.15rem 1.1rem;padding-top:.8rem;font-size:15px;font-weight:650}.lp .demo-card:hover .demo-open{text-underline-offset:3px;text-decoration:underline}.lp .demo-card:focus-visible{outline:3px solid color-mix(in srgb, var(--green) 55%, white);outline-offset:3px}.lp.demo-app{flex-direction:column;font-size:15px;display:flex;position:fixed;inset:0;overflow:hidden}.lp .demo-bar{border-bottom:1px solid var(--line);background:#fff;flex:none;align-items:center;gap:.75rem;height:60px;padding:0 1rem;display:flex}.lp .demo-bar .brand{flex:none}.lp .demo-bar .brand .demo-logo-icon{height:30px;display:none}@media (max-width:639px){.lp .demo-bar .brand .demo-logo-icon{display:block}.lp .demo-bar .brand .demo-logo-full{display:none}}.lp .demo-switch{flex:0 300px;min-width:0}.lp .demo-switch .field{min-height:2.4rem;padding-right:2rem;font-size:15px}.lp .demo-devices{border:1px solid var(--line);border-radius:.5rem;display:none;overflow:hidden}.lp .demo-devices button{color:var(--ink-2);padding:.45rem .8rem;font-size:14px}.lp .demo-devices button[aria-pressed=true]{background:var(--surface);color:var(--ink);font-weight:650}.lp .demo-cta{white-space:nowrap;margin-left:auto}@media (min-width:900px){.lp .demo-devices{display:inline-flex}}.lp .demo-body{flex:1;min-height:0;display:flex;position:relative}.lp .demo-stage{background:var(--surface);flex:1;justify-content:center;min-width:0;display:flex}.lp .demo-frame{background:#fff;border:0;width:100%;height:100%}.lp .demo-stage.phone{padding:1.25rem}.lp .demo-stage.phone .demo-frame{border:8px solid #0b1a33;border-radius:1.4rem;width:390px;max-width:100%;box-shadow:0 20px 50px -24px #0b1a3380}.lp .demo-panel{border-right:1px solid var(--line);background:#fff;flex:none;width:360px;position:relative;overflow-y:auto}.lp .demo-panel-toggle{display:none}.lp .demo-panel-inner{padding:1.25rem 1.25rem 2rem}.lp .demo-title{letter-spacing:-.02em;font-family:Poppins LP,Archivo LP,sans-serif;font-size:1.35rem;font-weight:700}.lp .demo-hint{color:var(--muted);margin-top:.2rem}.lp .demo-panel fieldset{border-top:1px solid var(--line);gap:.7rem;margin-top:1.1rem;padding-top:1rem;display:grid}.lp .demo-panel legend{float:left;width:100%;color:var(--ink);justify-content:space-between;align-items:baseline;margin-bottom:.2rem;font-weight:650;display:flex}.lp .demo-current{color:var(--muted);font-size:14px;font-weight:400}.lp .demo-field{gap:.25rem;display:grid}.lp .demo-field>span{color:var(--ink-2);font-size:13.5px}.lp .demo-field .field{min-height:2.5rem;padding:.5rem .7rem;font-size:15px}.lp .demo-field textarea.field{resize:vertical;line-height:1.4}.lp .demo-themes{grid-template-columns:repeat(3,1fr);gap:.45rem;display:grid}.lp .demo-themes button{border:1px solid var(--line);text-align:left;border-radius:.5rem;gap:.3rem;width:100%;padding:.35rem;transition:border-color .15s;display:grid}.lp .demo-themes button:hover{border-color:#b8c4d4}.lp .demo-themes button[aria-pressed=true]{border-color:var(--green);box-shadow:0 0 0 2px var(--green)}.lp .demo-themes .sw{border-radius:.3rem;height:26px;display:flex;overflow:hidden}.lp .demo-themes .sw i{flex:1}.lp .demo-themes .sw i:first-child{flex:2}.lp .demo-themes .nm{white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;line-height:1.2;overflow:hidden}.lp .demo-secs{gap:.35rem;display:grid}.lp .demo-secs li{border:1px solid var(--line);background:#fff;border-radius:.55rem}.lp .demo-secs li.off{background:var(--surface);border-style:dashed}.lp .demo-secs li.off .nm{color:var(--muted)}.lp .demo-secs .row{align-items:center;gap:.15rem;padding:.3rem .35rem .3rem .65rem;display:flex}.lp .demo-secs .nm{flex:1;min-width:0;font-size:14.5px;font-weight:600;line-height:1.25;display:grid}.lp .demo-secs .nm small{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;font-weight:400;overflow:hidden}.lp .demo-secs .row button{min-width:2rem;height:2rem;color:var(--ink-2);border-radius:.4rem;padding:0 .45rem;font-size:13.5px;font-weight:600}.lp .demo-secs .row button:hover:not(:disabled){background:var(--surface);color:var(--ink)}.lp .demo-secs .row button:disabled{opacity:.3}.lp .demo-secs .row button.del{color:#b4321f}.lp .demo-secs .edit{border-top:1px solid var(--line);gap:.6rem;padding:.65rem .65rem .75rem;display:grid}.lp .demo-secs .opts{flex-wrap:wrap;gap:.35rem;display:flex}.lp .demo-secs .opts button{border:1px solid var(--line);border-radius:.45rem;padding:.35rem .7rem;font-size:13.5px}.lp .demo-secs .opts button[aria-pressed=true]{border-color:var(--green);box-shadow:0 0 0 1px var(--green);font-weight:650}.lp .demo-add{flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.3rem;display:flex}.lp .demo-add span{color:var(--muted);margin-right:.1rem;font-size:13.5px}.lp .demo-add button{color:var(--green);border:1px solid #b8c4d4;border-radius:.5rem;padding:.45rem .75rem;font-size:13.5px;font-weight:650}.lp .demo-add button:hover{background:var(--surface)}.lp .demo-palette{gap:.35rem;display:grid}.lp .demo-palette label{cursor:pointer;border-radius:.5rem;grid-template-columns:40px 1fr auto;align-items:center;gap:.7rem;padding:.3rem .4rem;display:grid}.lp .demo-palette label:hover{background:var(--surface)}.lp .demo-palette input[type=color]{border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:.4rem;width:40px;height:32px;padding:0}.lp .demo-palette .pl{line-height:1.25;display:grid}.lp .demo-palette .pl span{font-size:14.5px;font-weight:600}.lp .demo-palette .pl small{color:var(--muted);font-size:12.5px}.lp .demo-palette code{color:var(--ink-2);font-family:ui-monospace,monospace;font-size:12.5px}.lp .demo-warn{color:#8a4b00;background:#fff6e5;border:1px solid #f3d9a8;border-radius:.5rem;padding:.55rem .7rem;font-size:13.5px;line-height:1.45}.lp .demo-color{align-items:center;gap:.7rem;display:flex}.lp .demo-color input[type=color]{border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:.4rem;width:44px;height:36px;padding:0}.lp .demo-upload{min-height:2.6rem;color:var(--green);cursor:pointer;border:1px dashed #b8c4d4;border-radius:.55rem;justify-content:center;align-items:center;font-weight:650;display:flex;position:relative}.lp .demo-upload:hover{background:var(--surface)}.lp .demo-upload:focus-within{outline:3px solid color-mix(in srgb, var(--green) 55%, white);outline-offset:2px}.lp .demo-upload input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.lp .demo-link{color:var(--green);text-underline-offset:3px;justify-self:start;font-size:14px;font-weight:600;text-decoration:underline}.lp .demo-error{color:#b4321f;font-size:14px}.lp .demo-fine{color:var(--muted);font-size:13px;line-height:1.45}.lp .demo-actions{gap:.75rem;margin:1.4rem 0 .8rem;display:grid}@media (max-width:899px){.lp .demo-cta{display:none}.lp .demo-panel{border-right:0;border-top:1px solid var(--line);z-index:5;border-radius:1rem 1rem 0 0;flex-direction:column;width:auto;max-height:72%;display:flex;position:absolute;inset:auto 0 0;overflow:hidden;box-shadow:0 -12px 32px -12px #0b1a334d}.lp .demo-panel:not(.open) .demo-panel-inner{display:none}.lp .demo-panel-inner{overflow-y:auto}.lp .demo-panel-toggle{width:100%;color:var(--green);border-bottom:1px solid var(--line);flex:none;padding:.85rem;font-weight:650;display:block}}.lp .demo-spots{grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem .5rem;display:grid}.lp .demo-spots li{gap:.25rem;min-width:0;display:grid}.lp .demo-spots li>span{color:var(--ink-2);font-size:12.5px;line-height:1.25}.lp .demo-spots button,.lp .demo-picker li button{aspect-ratio:4/3;background:var(--surface);outline-offset:2px;border:2px solid #0000;border-radius:.45rem;width:100%;transition:border-color .15s;display:block;overflow:hidden}.lp .demo-spots button:hover,.lp .demo-picker li button:not(:disabled):hover{border-color:var(--ink)}.lp .demo-spots button[aria-pressed=true]{border-color:var(--green)}.lp .demo-spots img,.lp .demo-picker img{object-fit:cover;width:100%;height:100%}.lp .demo-spot-empty{height:100%;color:var(--muted);border:1px dashed var(--line);border-radius:.35rem;place-items:center;font-size:1.3rem;display:grid}.lp .demo-picker{background:var(--surface);border-radius:.6rem;gap:.6rem;padding:.7rem;display:grid}.lp .demo-picker ul{grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem;display:grid}.lp .demo-picker li button:disabled{border-color:var(--green);cursor:default}.lp .demo-stage{position:relative}.lp .demo-droptip{z-index:2;color:#fff;text-align:center;pointer-events:none;background:#052754eb;border-radius:999px;width:max-content;max-width:calc(100% - 2rem);padding:.5rem .9rem;font-size:13.5px;line-height:1.3;position:absolute;bottom:14px;left:50%;transform:translate(-50%);box-shadow:0 6px 20px -8px #0006}@media (max-width:899px){.lp .demo-droptip{display:none}}