.material-symbols-outlined{vertical-align:middle}.demo-main{position:relative;overflow:hidden;display:flex;align-items:center;padding:clamp(3rem,6vw,5.5rem) 0 clamp(4rem,7vw,6.5rem);min-height:78vh}.demo-shell{position:relative;z-index:10;width:100%;max-width:80rem;margin:0 auto;padding:0 1.5rem}@media(min-width:640px){.demo-shell{padding:0 2rem}}.demo-shell *{box-sizing:border-box}.demo-shell .hidden{display:none!important}.demo-split{display:grid;gap:clamp(2.5rem,5vw,4.5rem);align-items:center}#loginView{row-gap:2rem;grid-template-areas:"intro" "frame" "steps"}#loginView .demo-rail{grid-area:intro}#loginView .demo-frame{grid-area:frame}#loginView .demo-steps-block{grid-area:steps;min-width:0}#loginView .demo-lead{margin-bottom:0}@media(min-width:1024px){.demo-split{grid-template-columns:minmax(0,1fr) minmax(0,27rem)}#loginView{grid-template-areas:"intro frame" "steps frame";align-content:center;row-gap:2.25rem;-moz-column-gap:clamp(2.5rem,5vw,4.5rem);column-gap:clamp(2.5rem,5vw,4.5rem)}}.demo-console{display:grid;gap:clamp(1.75rem,3.5vw,2.75rem)}.demo-head__top{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.demo-head__top .eyebrow{margin:0}.demo-console .demo-lead{max-width:38rem;margin-bottom:0}.demo-rail{min-width:0}.demo-shell .eyebrow{display:block}.demo-rail .eyebrow{margin-bottom:1.25rem}.demo-display{font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(2rem,1.1rem + 2.6vw,3.1rem);line-height:1.06;letter-spacing:-.032em;margin:0 0 1.25rem;color:inherit}.demo-display--sm{font-size:clamp(1.6rem,1rem + 1.6vw,2.1rem);letter-spacing:-.025em;margin-bottom:.75rem}.demo-lead{font-size:clamp(1rem,.95rem + .25vw,1.125rem);line-height:1.65;color:var(--color-muted);margin:0 0 2rem;max-width:34rem}.demo-steps{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--color-border);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);counter-reset:demo-step;max-width:34rem}.demo-steps-block .demo-steps{margin-bottom:1rem}.demo-steps-block{animation:demo-fade-up .5s var(--ease-out-expo) both;animation-delay:.18s}.demo-steps li{counter-increment:demo-step;display:grid;grid-template-columns:2.75rem minmax(0,1fr);gap:.25rem .75rem;padding:.9rem 0;background:var(--color-ink)}.demo-steps li:before{content:counter(demo-step,decimal-leading-zero);grid-row:1 / span 2;font-family:Space Grotesk,sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.16em;color:var(--color-accent);padding-top:.15rem}.demo-steps .step-title{font-family:Manrope,sans-serif;font-weight:700;font-size:.94rem;letter-spacing:-.01em}.demo-steps .step-text{font-size:.875rem;line-height:1.5;color:var(--color-muted)}.demo-note{max-width:34rem}.demo-frame{position:relative;min-width:0}.demo-card{background:transparent;width:100%;padding:clamp(1.25rem,3vw,2rem)}.demo-card .card-index{margin:0 0 1.25rem}.demo-shell label{display:block;font-family:Inter,sans-serif;font-size:.8rem;font-weight:600;color:var(--color-on-ink-variant);margin:1rem 0 .375rem}.demo-card label:first-of-type{margin-top:0}.demo-shell input{width:100%;padding:13px 15px;border:1px solid var(--ink-border);border-radius:2px;background:#98a2b80f;color:var(--color-on-ink);font-family:Inter,sans-serif;font-size:.9rem;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.demo-shell input::-moz-placeholder{color:var(--color-on-ink-muted)}.demo-shell input::placeholder{color:var(--color-on-ink-muted)}.demo-shell input:hover{border-color:var(--ink-border-strong)}.demo-shell input:focus{border-color:var(--color-accent-electric);box-shadow:0 0 0 3px #4f7cff47}.demo-shell button.pw-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:flex;align-items:center;width:auto;margin:0;padding:0;border:none;border-radius:0;background:none;color:var(--color-muted);cursor:pointer}.demo-shell button.pw-toggle:hover{color:var(--color-on-ink)}.demo-shell button:not(.pw-toggle){position:relative;width:100%;margin-top:1.375rem;padding:14px 18px;border:none;border-radius:2px;background:#fff;color:#0a0e16;font-family:Manrope,sans-serif;font-size:.95rem;font-weight:700;letter-spacing:-.01em;cursor:pointer;transition:background .2s var(--ease-out-expo),border-color .2s ease,transform .15s ease}.demo-shell button:not(.pw-toggle):before,.demo-shell button:not(.pw-toggle):after{content:"";position:absolute;width:7px;height:7px;border-style:solid;border-color:var(--color-accent-electric);opacity:0;transition:opacity .2s ease,top .2s var(--ease-out-expo),bottom .2s var(--ease-out-expo),left .2s var(--ease-out-expo),right .2s var(--ease-out-expo)}.demo-shell button:not(.pw-toggle):before{top:7px;left:7px;border-width:1px 0 0 1px}.demo-shell button:not(.pw-toggle):after{bottom:7px;right:7px;border-width:0 1px 1px 0}.demo-shell button:not(.pw-toggle):hover{background:#e6eaf2}.demo-shell button:not(.pw-toggle):hover:before{opacity:1;top:4px;left:4px}.demo-shell button:not(.pw-toggle):hover:after{opacity:1;bottom:4px;right:4px}.demo-shell button:not(.pw-toggle):active{transform:scale(.99)}.demo-shell button:not(.pw-toggle):disabled{opacity:.55;cursor:default}.demo-shell button:focus-visible{outline:none;box-shadow:0 0 0 3px #4f7cff47}.demo-shell button.ghost{background:transparent;border:1px solid var(--ink-border-strong);color:inherit}.demo-shell button.ghost:before{opacity:.9;top:-1px;left:-1px}.demo-shell button.ghost:after{content:none}.demo-shell button.ghost:hover{background:#98a2b814;border-color:var(--ink-border-strong)}.demo-shell button.ghost:hover:before{top:-1px;left:-1px}.demo-shell button.btn-icon{display:flex;align-items:center;justify-content:center;gap:10px}.demo-shell button.btn-icon .material-symbols-outlined{font-size:20px}.demo-console #goBtn,.demo-console #doneBtn{width:auto;max-width:22rem}.demo-console #doneBtn{margin-inline:auto}.demo-console .phone-wrap{max-width:32rem;margin-inline:auto}.demo-shell button.logout-top{width:auto;margin:0;padding:9px 15px;font-size:.8rem;gap:7px}.demo-shell button.logout-top .material-symbols-outlined{font-size:18px}.variant-wrap{display:flex;flex-wrap:wrap;align-items:center;gap:0 1.25rem;margin:0 0 1.75rem;border-bottom:1px solid var(--color-border)}.variant-wrap .variant-label{flex:0 0 auto;margin:0;padding-bottom:.75rem;font-family:Inter,sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--color-accent)}.variant-wrap .variant-hint{flex:0 1 auto;margin:0 0 0 auto;padding-bottom:.75rem;font-size:.75rem;line-height:1.5;color:var(--color-muted)}.variant-wrap .variant-hint:empty{display:none}.variant-switch{display:flex;flex-wrap:wrap;gap:0 .25rem}.variant-switch.is-busy{opacity:.6}.demo-shell button.variant-option{position:relative;display:flex;align-items:center;gap:.625rem;width:auto;margin:0 0 -1px;padding:.5rem .625rem .75rem;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;color:var(--color-on-ink-variant);font-family:Inter,sans-serif;font-size:.875rem;font-weight:500;letter-spacing:normal;line-height:1.35;text-align:left;cursor:pointer;transition:border-color .25s var(--ease-out-expo),background-color .25s var(--ease-out-expo),color .25s var(--ease-out-expo)}.demo-shell button.variant-option:before,.demo-shell button.variant-option:after{content:none}.demo-shell button.variant-option:hover:not(.is-active):not(:disabled){border-bottom-color:var(--ink-border-strong);color:var(--color-on-ink)}.demo-shell button.variant-option:active{transform:none}.demo-shell button.variant-option:disabled{opacity:1;cursor:default}.demo-shell button.variant-option.is-active{border-bottom-color:var(--color-accent-electric);color:var(--color-on-ink);font-weight:600}.demo-shell button.variant-option .variant-option__num{flex:0 0 auto;display:grid;place-items:center;width:1.375rem;height:1.375rem;border-radius:50%;background:var(--color-ink);color:var(--color-muted);font-size:.7rem;font-weight:700;font-variant-numeric:tabular-nums}.demo-shell button.variant-option.is-active .variant-option__num{background:var(--color-accent-electric);color:#fff}.demo-shell button.variant-option .variant-option__label{flex:1 1 auto}.demo-shell .guide{border-left:2px solid var(--color-accent);padding:.125rem 0 .125rem 1rem;max-width:34rem;font-size:.875rem;line-height:1.6;color:var(--color-muted)}.demo-shell .guide b{color:var(--color-on-ink);font-weight:600}.demo-shell .guide i{font-style:normal;font-family:Space Grotesk,sans-serif;color:var(--color-on-ink)}.demo-shell .guide:has(.guide-band){border-left:0;padding:0;max-width:none}.guide-band__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.5rem 1rem;margin:0 0 1.25rem;padding-bottom:.75rem;border-bottom:1px solid var(--color-border);font-family:Manrope,sans-serif;font-size:1rem;font-weight:700;letter-spacing:-.01em;color:var(--color-on-ink)}.guide-band__tag{font-family:Space Grotesk,sans-serif;font-size:.68rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--color-accent)}.guide-band__cols{display:grid;gap:1.5rem 2.5rem;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));align-items:start}.guide-block__title{margin:0 0 .625rem;font-family:Inter,sans-serif;font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--color-muted)}.guide-steps{display:grid;gap:.625rem;margin:0;padding:0;list-style:none}.guide-steps li{position:relative;padding-left:1rem;font-size:.85rem;line-height:1.55}.guide-steps li:before{content:"";position:absolute;left:0;top:.6em;width:5px;height:1px;background:var(--color-accent)}.guide-quotes{display:grid;gap:.5rem;margin:0;padding:0;list-style:none}.guide-quotes li{padding:.5rem .75rem;border-left:2px solid var(--color-border);background:var(--color-ink-raised);font-family:Space Grotesk,sans-serif;font-size:.85rem;line-height:1.5;color:var(--color-on-ink)}.guide-quotes li:before{content:"„"}.guide-quotes li:after{content:"“"}.guide-quotes--accent li{border-left-color:var(--color-accent-electric)}.guide-block__note{margin:.875rem 0 0;font-size:.82rem;line-height:1.55}.demo-shell #cases{counter-reset:demo-case}.demo-shell .case{position:relative;border:1px solid var(--ink-border);border-radius:2px;background:linear-gradient(180deg,#98a2b80e,#98a2b805);padding:2.25rem 1rem .9rem;margin-bottom:.625rem;font-size:.85rem;transition:border-color .2s ease}.demo-shell .case:not(.is-skeleton){counter-increment:demo-case}.demo-shell .case:not(.is-skeleton):before{content:counter(demo-case,decimal-leading-zero);position:absolute;top:.875rem;left:1rem;font-family:Space Grotesk,sans-serif;font-size:.68rem;font-weight:600;letter-spacing:.24em;color:var(--color-accent)}.demo-shell .case:not(.is-skeleton):hover{border-color:var(--ink-border-strong)}.demo-shell .case .name{font-family:Manrope,sans-serif;font-weight:700;font-size:.95rem;letter-spacing:-.01em;color:inherit}.demo-shell .case .kv{color:var(--color-muted);margin-top:.3125rem;line-height:1.5}.demo-shell .case .kv b{font-family:Space Grotesk,sans-serif;font-weight:600;font-feature-settings:"tnum";color:var(--color-on-ink)}.demo-shell .case .kv:last-of-type{margin-top:.625rem;padding-top:.5rem;border-top:1px solid var(--color-border);font-size:.8rem}@media(min-width:620px){.demo-shell.wide #cases{display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));gap:.625rem;margin-bottom:.25rem}.demo-shell.wide #cases .case{margin-bottom:0}}.demo-shell .case .tag{display:inline-flex;align-items:center;gap:6px;margin-left:.5rem;padding:3px 9px;border:1px solid var(--ink-border);border-radius:2px;background:var(--color-ink);vertical-align:middle;font-family:Space Grotesk,sans-serif;font-size:.6rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--color-muted);white-space:nowrap}.demo-shell .case .tag:before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}.demo-shell .case .tag.open{color:var(--color-accent)}.demo-shell .case .tag.partial{color:#f5c26b}.demo-shell .case .tag.disputed{color:#ff9d94}.demo-shell .case .tag.paid{color:var(--color-signal-strong)}.demo-shell .case button.callBtn{margin-top:.75rem;padding:10px 14px;font-size:.82rem;display:flex;align-items:center;justify-content:center;gap:8px}.demo-shell .case button.callBtn .material-symbols-outlined{font-size:18px}.demo-shell .phone-wrap{text-align:center;margin-top:.5rem}.demo-shell .phone-wrap .alloc-label{margin:1.25rem 0 0}.demo-shell .phone{font-family:Space Grotesk,sans-serif;font-size:clamp(1.75rem,3.5vw,2.5rem);font-weight:600;line-height:1.1;letter-spacing:-.02em;font-feature-settings:"tnum";margin:.5rem 0;color:inherit}.demo-shell .countdown{font-family:Space Grotesk,sans-serif;font-size:.66rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--color-muted)}.demo-card h1,.demo-card h2{font-family:Manrope,sans-serif;font-size:1.35rem;font-weight:700;line-height:1.25;letter-spacing:-.02em;margin:0 0 .375rem;color:inherit}.demo-card p.sub{color:var(--color-muted);font-size:.9rem;line-height:1.55;margin:0 0 1.375rem}.demo-shell .msg{margin-top:.875rem;font-size:.84rem;line-height:1.45;display:flex;align-items:flex-start;gap:9px;padding:11px 13px;border-radius:2px;border:1px solid transparent;animation:demo-fade-up .25s ease both}.demo-shell .msg:empty{display:none}.demo-shell .msg:before{content:"";flex:0 0 auto;width:17px;height:17px;margin-top:.5px;background-position:center;background-repeat:no-repeat;background-size:contain}.demo-shell .msg.err{color:#ff9d94;background:#c0362c24;border-color:#c0362c73}.demo-shell .msg.err:before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff9d94' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='8' x2='12' y2='12'/%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'/%3E%3C/svg%3E")}.demo-shell .msg.ok{color:var(--color-signal);background:#17c88b1a;border-color:#17c88b66;font-weight:600}.demo-shell .msg.ok:before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2317c88b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E")}.demo-shell .call-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#05070bdb;display:flex;align-items:center;justify-content:center;padding:1.25rem}.demo-shell .call-modal .cm-box{position:relative;width:100%;max-width:26rem;padding:clamp(1.25rem,3vw,1.5rem);background:var(--color-ink-raised);color:var(--color-on-ink);border:1px solid var(--ink-border-strong);border-radius:2px;animation:demo-fade-up .25s ease both}.demo-shell .call-modal .cm-title{font-family:Manrope,sans-serif;font-size:1.1rem;font-weight:700;letter-spacing:-.015em;margin:0 0 .5rem}.demo-shell .call-modal .cm-text{font-size:.875rem;color:var(--color-muted);line-height:1.55;margin:0 0 1.125rem}.demo-shell .call-modal .cm-text b{color:inherit;font-weight:600}.demo-shell .call-modal .cm-actions{display:flex;gap:.625rem;margin-top:1.125rem}.demo-shell .call-modal .cm-actions button{margin-top:0;flex:1;padding:12px 14px}.demo-shell .call-modal .cm-actions button .material-symbols-outlined{font-size:18px}.demo-frame{animation:demo-fade-up .5s var(--ease-out-expo) both;animation-delay:.1s}.demo-shell #cases .case:not(.is-skeleton){animation:demo-fade-up .4s ease both}.demo-shell #cases .case:not(.is-skeleton):nth-child(2){animation-delay:.05s}.demo-shell #cases .case:not(.is-skeleton):nth-child(3){animation-delay:.1s}.demo-shell #cases .case:not(.is-skeleton):nth-child(4){animation-delay:.15s}.demo-shell #cases .case:not(.is-skeleton):nth-child(5){animation-delay:.2s}.demo-shell #cases .case:not(.is-skeleton):nth-child(6){animation-delay:.25s}.demo-shell #cases .case:not(.is-skeleton):nth-child(n+7){animation-delay:.3s}#allocView:not(.hidden){animation:demo-fade-up .4s ease both}@keyframes demo-fade-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.demo-shell .case.is-skeleton{pointer-events:none;padding-top:1rem}.demo-shell .sk-line{height:12px;border-radius:2px;margin:9px 0;background-color:#98a2b824;background-image:linear-gradient(100deg,#98a2b800 20%,#98a2b838,#98a2b800 80%);background-size:200% 100%;background-repeat:no-repeat;animation:sk-shimmer 1.25s ease-in-out infinite}.demo-shell .sk-line.title{width:52%;height:15px;margin:2px 0 12px}.demo-shell .sk-line.mid{width:88%}.demo-shell .sk-line.short{width:64%}@keyframes sk-shimmer{0%{background-position:150% 0}to{background-position:-50% 0}}.demo-shell button.is-loading{color:transparent!important;position:relative;opacity:1}.demo-shell button.is-loading>*{visibility:hidden}.demo-shell button.is-loading:before{content:none}.demo-shell button.is-loading:after{content:"";position:absolute;top:50%;left:50%;right:auto;bottom:auto;width:18px;height:18px;margin:-9px 0 0 -9px;border:2px solid rgba(10,14,22,.25);border-top-color:#0a0e16;border-radius:50%;opacity:1;transition:none;animation:btn-spin .6s linear infinite}.demo-shell button.ghost.is-loading:after{border-color:#98a2b859;border-top-color:var(--color-on-ink)}@keyframes btn-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.demo-frame,.demo-steps-block,#cases .case:not(.is-skeleton),#allocView:not(.hidden),.call-modal .cm-box,.msg{animation:none}.sk-line{animation:none}.demo-shell button.is-loading:after{animation-duration:1.2s}}
