.demos-app{--muted:var(--text-3);--muted-2:color-mix(in srgb, var(--text-3) 70%, transparent);--surface-2:var(--bg-2);--accent-light:var(--accent-bg);--green:var(--success);--green-light:var(--success-bg);--green-text:var(--success-text);--amber:var(--warning);--amber-light:var(--warning-bg);--amber-text:var(--warning-text);--red:var(--danger);--red-light:var(--danger-bg);--red-text:var(--danger-text);--blue:var(--info);--blue-light:var(--info-bg);--blue-text:var(--info-text);isolation:isolate;background:var(--bg);color:var(--text);position:relative}.demos-app:before{content:"";background:radial-gradient(ellipse, color-mix(in srgb, var(--accent) 9%, transparent) 0%, transparent 65%);pointer-events:none;z-index:-1;width:min(900px,90vw);height:520px;position:absolute;top:-10%;left:50%;transform:translate(-50%)}.demos-app .page{min-height:100vh;padding-bottom:96px;position:relative}.demos-app .wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 40px;position:relative}.demos-app h1{letter-spacing:-.035em;color:var(--text);margin:0 0 20px;font-size:clamp(2.25rem,4.6vw,3.5rem);font-weight:600;line-height:1.05}.demos-app h2{letter-spacing:-.028em;color:var(--text);margin:0 0 12px;font-size:clamp(1.5rem,2.8vw,2.125rem);font-weight:600;line-height:1.1}.demos-app h3{letter-spacing:-.018em;color:var(--text);margin:0 0 8px;font-size:clamp(1.0625rem,1.7vw,1.25rem);font-weight:600;line-height:1.25}.demos-app p{color:var(--text-2);margin:0;font-size:1rem;line-height:1.65}.demos-app .lumen-em{letter-spacing:-.005em;color:var(--accent-text);padding:0 .04em;font-family:Instrument Serif,Times New Roman,serif;font-style:italic;font-weight:400}.demos-app .btn{border-radius:var(--radius);cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--text);letter-spacing:-.01em;white-space:nowrap;justify-content:center;align-items:center;gap:7px;padding:9px 18px;font-family:inherit;font-size:.9rem;font-weight:500;line-height:1;transition:background .15s,border-color .15s,color .15s,transform .15s,box-shadow .15s;display:inline-flex;text-decoration:none!important}.demos-app .btn:hover{background:var(--bg-2);border-color:var(--border-2)}.demos-app .btn.primary{background:var(--btn-bg);color:var(--btn-color);border-color:var(--btn-bg);box-shadow:var(--shadow)}.demos-app .btn.primary:hover{background:var(--btn-hover);border-color:var(--btn-hover);box-shadow:var(--shadow-lg)}.demos-app .btn.accent-btn{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:var(--shadow)}.demos-app .btn.accent-btn:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.demos-app .btn.lg{border-radius:var(--radius-lg);padding:13px 24px;font-size:.95rem}.demos-app .card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow)}.demos-app .status-pill{letter-spacing:.005em;white-space:nowrap;border-radius:999px;align-items:center;gap:5px;padding:3px 9px;font-size:.72rem;font-weight:600;display:inline-flex}.demos-app .status-pill:before{content:"";border-radius:50%;flex-shrink:0;width:6px;height:6px}.demos-app .sp-blue{background:var(--info-bg);color:var(--info-text)}.demos-app .sp-blue:before{background:var(--info)}.demos-app .sp-purple{background:var(--accent-bg);color:var(--accent-text)}.demos-app .sp-purple:before{background:var(--accent)}.demos-app .sp-green{background:var(--success-bg);color:var(--success-text)}.demos-app .sp-green:before{background:var(--success)}.demos-app .sp-amber{background:var(--warning-bg);color:var(--warning-text)}.demos-app .sp-amber:before{background:var(--warning)}.demos-app .sp-red{background:var(--danger-bg);color:var(--danger-text)}.demos-app .sp-red:before{background:var(--danger)}.demos-app .sp-gray{background:var(--bg-2);color:var(--text-3)}.demos-app .sp-gray:before{background:var(--text-3)}.demos-app .eyebrow{letter-spacing:.12em;text-transform:uppercase;color:var(--accent-text);background:var(--accent-bg);border:1px solid color-mix(in srgb, var(--accent) 18%, transparent);border-radius:999px;align-items:center;gap:6px;margin-bottom:22px;padding:5px 11px;font-size:.7rem;font-weight:700;display:inline-flex}.demos-app .panel-label{letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-bottom:14px;font-size:.65rem;font-weight:700}.demos-app .section-heading{margin-bottom:32px}.demos-app .section-heading p{max-width:580px;margin-top:8px;font-size:1rem}.demos-app .field{margin-bottom:18px}.demos-app .field label{color:var(--text);margin-bottom:6px;font-size:.82rem;font-weight:500;display:block}.demos-app .field label strong{color:var(--accent-text);font-weight:600}.demos-app .field input[type=text],.demos-app .field input[type=number],.demos-app .field input[type=url],.demos-app .field input[type=email],.demos-app .field select,.demos-app .field textarea{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);outline:none;padding:10px 13px;font-family:inherit;font-size:.9rem;transition:border-color .15s,box-shadow .15s}.demos-app .field input:focus,.demos-app .field select:focus,.demos-app .field textarea:focus{border-color:color-mix(in srgb, var(--accent) 50%, var(--border));box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent)}.demos-app .field input::placeholder,.demos-app .field textarea::placeholder{color:var(--text-3)}.demos-app .field input[type=range]{width:100%;accent-color:var(--accent);cursor:pointer;height:4px;margin-top:4px;padding:0}.demos-app .field-hint{color:var(--text-3);margin-top:6px;font-size:.75rem}.demos-app .divider{background:var(--border);height:1px;margin:6px 0 18px}.demos-app .cta-block{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);justify-content:space-between;align-items:center;gap:48px;margin-top:96px;padding:56px;display:flex;position:relative;overflow:hidden}.demos-app .cta-block:before{content:"";background:radial-gradient(circle, color-mix(in srgb, var(--accent) 12%, transparent) 0%, transparent 60%);pointer-events:none;width:480px;height:480px;position:absolute;top:-40%;right:-10%}.demos-app .cta-block>*{position:relative}.demos-app .cta-block h2{margin-bottom:10px}.demos-app .cta-block p{max-width:460px}.demos-app .cta-btn{white-space:nowrap;border-radius:var(--radius-lg);flex-shrink:0;padding:13px 26px;font-size:.95rem}.demos-app .inputs-panel{padding:28px}@media (width<=900px){.demos-app .cta-block{flex-direction:column;align-items:flex-start;gap:24px;padding:36px 28px}.demos-app .cta-btn{justify-content:center;width:100%}}@media (width<=640px){.demos-app .wrap{padding:0 22px}.demos-app h1{font-size:clamp(28px,9vw,40px)}.demos-app h2{font-size:1.5rem}.demos-app .cta-block{margin-top:64px;padding:28px 22px}.demos-app .inputs-panel{padding:20px}}
