@keyframes sp-ring{0%{box-shadow:0 0 #f29e5cbf}70%{box-shadow:0 0 0 12px #f29e5c00}to{box-shadow:0 0 #f29e5c00}}@keyframes sp-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}.demo-spotlight{border-radius:inherit;animation:1.6s ease-out infinite sp-ring}@media (prefers-reduced-motion:reduce){.demo-spotlight{box-shadow:0 0 0 3px var(--sp-apricot);animation:none}.demo-pushnotif,.demo-completion-card,.demo-row-detail{animation:none!important}}.demo-stage{--demo-stage-bg:var(--sp-teal-dark);--demo-stage-muted:#cfe3de;--demo-phone-body:#0a2a29;background:var(--demo-stage-bg);color:#fff;background-image:radial-gradient(#ffffff12 1px,#0000 1px);background-size:28px 28px;padding:clamp(48px,6vw,80px) clamp(20px,4vw,48px) clamp(56px,7vw,96px)}.demo-stage-inner{flex-direction:column;gap:clamp(32px,4vw,48px);max-width:1320px;margin:0 auto;display:flex}.demo-stage-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px 48px;display:flex}.demo-stage-head-left{flex-direction:column;gap:18px;max-width:760px;display:flex}.demo-stage-badges{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.demo-stage-pill{background:var(--sp-apricot);color:var(--sp-ink);font:700 13px var(--sp-font-body);letter-spacing:.02em;border-radius:999px;padding:5px 12px}.demo-stage-sub{font:600 14px var(--sp-font-body);color:var(--demo-stage-muted)}.demo-stage-h1{font:800 clamp(40px, 6vw, 80px)/.98 var(--sp-font-display);letter-spacing:-.04em;text-wrap:balance;margin:0}.demo-stage-h1-accent{color:var(--sp-apricot)}.demo-stage-lead{font:400 clamp(17px, 1.5vw, 20px)/1.55 var(--sp-font-body);color:var(--demo-stage-muted);text-wrap:pretty;max-width:620px;margin:0}.demo-stage-head-right{flex-direction:column;align-items:flex-end;gap:10px;display:flex}.demo-timer-card{background:#ffffff14;border:1px solid #ffffff24;border-radius:18px;align-items:center;gap:12px;padding:14px 18px;display:flex}.demo-timer-text{flex-direction:column;display:flex}.demo-timer-label{font:600 12px var(--sp-font-body);letter-spacing:.1em;text-transform:uppercase;color:var(--demo-stage-muted)}.demo-timer-value{font:700 32px/1 var(--sp-font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.demo-reset-link{font:600 14px var(--sp-font-body);color:var(--demo-stage-muted);cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:6px;padding:6px 8px;display:flex}.demo-reset-link:hover{color:#fff;background:#ffffff14}.demo-stage-body{flex-wrap:wrap;align-items:flex-start;gap:28px;display:flex}.demo-mission-rail{flex-direction:column;flex:280px;gap:14px;max-width:340px;display:flex;position:sticky;top:96px}.demo-role-card[hidden],.demo-mission-list[hidden],.demo-completion-card[hidden]{display:none}.demo-role-card{color:var(--sp-ink);background:#fff;border-radius:20px;align-items:center;gap:12px;padding:14px 16px;display:flex}.demo-role-text{flex-direction:column;flex:1;min-width:0;display:flex}.demo-role-label{font:600 12px var(--sp-font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--sp-muted)}.demo-role-name{font:700 17px var(--sp-font-body)}.demo-mission-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.demo-mission-item{border:1px solid #0000;border-radius:18px;gap:14px;padding:14px 16px;transition:background .3s,border-color .3s;display:flex}.demo-mission-num{width:30px;height:30px;font:700 14px var(--sp-font-body);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.demo-mission-text{flex-direction:column;gap:3px;min-width:0;display:flex}.demo-mission-title{font:700 17px/1.25 var(--sp-font-display)}.demo-mission-hint{font:400 14px/1.45 var(--sp-font-body);color:var(--demo-stage-muted);text-wrap:pretty}.demo-mission-where{font:600 13px var(--sp-font-body);color:var(--sp-apricot);align-items:center;gap:6px;display:inline-flex}.demo-completion-card{background:var(--sp-apricot);color:var(--sp-ink);border-radius:28px;flex-direction:column;gap:16px;padding:28px;animation:.4s ease-out sp-in;display:flex}.demo-completion-heading{font:800 40px/1 var(--sp-font-display);letter-spacing:-.03em}.demo-completion-body{font:500 16px/1.5 var(--sp-font-body);text-wrap:pretty;margin:0}.demo-completion-cta{background:var(--sp-ink);color:#fff;font:600 16px var(--sp-font-body);border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:15px;text-decoration:none;display:flex}.demo-completion-cta:hover{background:var(--sp-teal-dark);color:#fff}.demo-completion-demolink{font:500 14px var(--sp-font-body);align-self:center;text-decoration:underline}.demo-completion-again{font:600 15px var(--sp-font-body);color:var(--sp-ink);cursor:pointer;background:0 0;border:none;align-self:center;align-items:center;gap:6px;display:flex}.demo-devices{flex-wrap:wrap;flex:1000 720px;align-items:flex-start;gap:24px;min-width:0;display:flex}.demo-phone-col{flex-direction:column;flex:0 0 340px;align-items:center;gap:12px;margin:0 auto;display:flex}.demo-phone-frame{background:var(--demo-phone-body);border-radius:54px;width:340px;height:704px;padding:10px;box-shadow:0 40px 80px -30px #0009,inset 0 0 0 1.5px #ffffff1f}.demo-phone-screen-wrap{background:var(--sp-cream);width:100%;height:100%;color:var(--sp-ink);border-radius:44px;flex-direction:column;display:flex;position:relative;overflow:hidden}.demo-phone-statusbar{height:46px;font:600 14px var(--sp-font-body);flex-shrink:0;justify-content:space-between;align-items:center;padding:0 26px 0 30px;display:flex}.demo-phone-island{background:var(--demo-phone-body);border-radius:999px;width:96px;height:28px}.demo-phone-statusicons{align-items:center;gap:5px;display:flex}.demo-pushnotif{z-index:5;backdrop-filter:blur(10px);cursor:pointer;background:#fffffff5;border-radius:22px;align-items:center;gap:12px;padding:12px 14px;animation:.35s ease-out sp-in;display:flex;position:absolute;top:50px;left:10px;right:10px;box-shadow:0 12px 30px -8px #1c2b2d59}.demo-pushnotif[hidden]{display:none}.demo-pushnotif-icon{background:var(--sp-teal);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;display:flex}.demo-pushnotif-text{flex-direction:column;flex:1;gap:1px;min-width:0;display:flex}.demo-pushnotif-meta{font:600 11px var(--sp-font-body);color:var(--sp-muted);justify-content:space-between;display:flex}.demo-pushnotif-title{font:700 14px var(--sp-font-body)}.demo-pushnotif-body{font:400 12.5px/1.35 var(--sp-font-body);color:var(--sp-ink-2)}.demo-phone-content{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden auto}.demo-phone-screen[hidden]{display:none}.demo-phone-screen{flex-direction:column;gap:14px;padding:8px 18px 16px;display:flex}.demo-phone-screen--center{text-align:center;flex:1;justify-content:center;align-items:center;gap:12px;padding:0 26px}.demo-phone-pagetitle{font:700 26px/1.1 var(--sp-font-display);letter-spacing:-.02em}.demo-phone-greetrow{justify-content:space-between;align-items:center;display:flex}.demo-phone-greeting{flex-direction:column;gap:2px;display:flex}.demo-phone-date{font:500 12px var(--sp-font-body);color:var(--sp-muted)}.demo-phone-hello{font:700 24px/1.1 var(--sp-font-display);letter-spacing:-.02em}.demo-phone-cta{background:var(--sp-teal);color:#fff;border-radius:22px;flex-direction:column;gap:10px;padding:18px;display:flex}.demo-phone-cta-title{font:700 22px/1.1 var(--sp-font-display);letter-spacing:-.015em}.demo-phone-cta-body{font:400 14px/1.4 var(--sp-font-body);opacity:.88}.demo-phone-cta-btn{background:var(--sp-apricot);color:var(--sp-ink);font:700 14px var(--sp-font-body);cursor:pointer;border:none;border-radius:13px;align-self:flex-start;align-items:center;gap:8px;padding:11px 15px;display:flex}.demo-phone-label{font:600 11px var(--sp-font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--sp-muted)}.demo-phone-latest[hidden]{display:none}.demo-phone-latest{flex-direction:column;gap:6px;display:flex}.demo-phone-latest-card{cursor:pointer;text-align:left;background:#fff;border:none;border-radius:16px;flex-direction:column;gap:7px;padding:13px 14px;display:flex}.demo-phone-latest-title{font:600 14px/1.3 var(--sp-font-body)}.demo-badges-row{flex-wrap:wrap;gap:6px;display:flex}.demo-phone-tabs{background:var(--sp-hover-ghost);border-radius:12px;grid-template-columns:1fr 1fr;gap:4px;padding:3px;display:grid}.demo-phone-tab{text-align:center;font:600 13px var(--sp-font-body);cursor:pointer;color:var(--sp-muted);background:0 0;border:none;border-radius:9px;padding:8px}.demo-phone-tab.active{color:var(--sp-ink);background:#fff}.demo-phone-field{font:600 13px var(--sp-font-body);flex-direction:column;gap:6px;display:flex}.demo-phone-field textarea{border:1.5px solid var(--sp-border-input);font:400 14px/1.4 var(--sp-font-body);color:var(--sp-ink);resize:none;font-family:var(--sp-font-body);background:#fff;border-radius:14px;outline:none;padding:11px 13px}.demo-phone-field textarea:focus{border-color:var(--sp-teal);box-shadow:0 0 0 4px var(--sp-teal-tint)}.demo-phone-chips{flex-wrap:wrap;gap:6px;display:flex}.demo-mini-pill{font:600 13px var(--sp-font-body);cursor:pointer;color:var(--sp-ink);border:1.5px solid var(--sp-border-input);background:#fff;border-radius:999px;padding:7px 12px}.demo-mini-pill.active{background:var(--sp-teal);color:#fff;border-color:var(--sp-teal)}.demo-phone-severity{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.demo-sev-tile{cursor:pointer;border:1.5px solid var(--sp-border-input);color:var(--sp-muted);font:700 13px var(--sp-font-body);background:#fff;border-radius:14px;flex-direction:column;align-items:center;gap:6px;padding:11px 6px;display:flex}.demo-sev-tile.active[data-value="0"]{background:var(--sp-low-bg);border-color:var(--sp-low);color:var(--sp-low-ink)}.demo-sev-tile.active[data-value="1"]{background:var(--sp-mid-bg);border-color:var(--sp-mid);color:var(--sp-mid-ink)}.demo-sev-tile.active[data-value="2"]{background:var(--sp-high-bg);border-color:var(--sp-high);color:var(--sp-high-ink)}.demo-phone-photo-btn{border:1.5px dashed var(--sp-dashed);cursor:pointer;font:600 14px var(--sp-font-body);color:var(--sp-muted);background:#fff;border-radius:14px;align-items:center;gap:10px;padding:11px 13px;display:flex}.demo-phone-photo-btn.has-photo{border-style:solid;border-color:var(--sp-teal);color:var(--sp-teal-dark)}.demo-phone-submit{background:var(--sp-teal);color:#fff;font:700 16px var(--sp-font-body);cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:15px;display:flex}.demo-phone-submit:hover{background:var(--sp-teal-dark)}.demo-success-icon{background:var(--sp-apricot-tint);width:76px;height:76px;color:var(--sp-apricot-ink);border-radius:50%;justify-content:center;align-items:center;display:flex}.demo-success-title{font:700 30px/1.1 var(--sp-font-display);letter-spacing:-.02em}.demo-success-body{font:400 15px/1.5 var(--sp-font-body);color:var(--sp-muted)}.demo-success-summary{text-align:left;background:#fff;border-radius:16px;align-items:center;gap:10px;width:100%;padding:12px 14px;display:flex}.demo-success-summary-text{font:600 14px/1.35 var(--sp-font-body)}.demo-success-link{font:700 15px var(--sp-font-body);color:var(--sp-teal);cursor:pointer;background:0 0;border:none;padding:8px}.demo-phone-stat{background:var(--sp-teal);color:#fff;border-radius:18px;align-items:center;gap:12px;padding:14px 16px;display:flex}.demo-phone-stat-num{font:700 32px/1 var(--sp-font-display)}.demo-phone-stat-text{font:500 14px/1.35 var(--sp-font-body);opacity:.9}.demo-myreports-list{flex-direction:column;gap:10px;display:flex}.demo-myreport-card{background:#fff;border-radius:18px;flex-direction:column;gap:8px;padding:13px 15px;display:flex}.demo-myreport-meta{font:500 12px var(--sp-font-body);color:var(--sp-muted);justify-content:space-between;display:flex}.demo-myreport-title{font:600 15px/1.35 var(--sp-font-body)}.demo-mine-feedback{font:400 13px/1.45 var(--sp-font-body);background:#f3f8f6;border-radius:12px;gap:8px;padding:10px 12px;display:flex}.demo-account-card{background:#fff;border-radius:18px;align-items:center;gap:12px;padding:16px;display:flex}.demo-account-identity{flex-direction:column;display:flex}.demo-account-name{font:700 16px var(--sp-font-body)}.demo-account-role{font:500 13px var(--sp-font-body);color:var(--sp-muted)}.demo-account-rows{font:400 15px var(--sp-font-body);background:#fff;border-radius:18px;overflow:hidden}.demo-account-row{border-bottom:1px solid var(--sp-divider);justify-content:space-between;padding:13px 16px;display:flex}.demo-account-row:last-child{border-bottom:none}.demo-account-row>span:first-child{color:var(--sp-muted)}.demo-account-value--on{color:var(--sp-teal);font-weight:600}.demo-phone-tabbar{border-top:1px solid var(--sp-border);background:#fff;flex-shrink:0;grid-template-columns:repeat(4,1fr);padding:8px 0 22px;display:grid}.demo-tab{color:var(--sp-subtle);font:600 10px var(--sp-font-body);cursor:pointer;background:0 0;border:none;flex-direction:column;align-items:center;gap:3px;padding:4px;display:flex}.demo-tab.active{color:var(--sp-teal)}.demo-device-caption{font:600 13px var(--sp-font-body);color:var(--demo-stage-muted);align-items:center;gap:6px;display:flex}.demo-browser-col{flex-direction:column;flex:560px;gap:12px;min-width:0;display:flex}.demo-browser{border-radius:18px;overflow-x:auto;box-shadow:0 40px 80px -30px #0009}.demo-browser-chrome{background:var(--sp-hover-ghost);border-radius:18px 18px 0 0;align-items:center;gap:8px;min-width:620px;padding:12px 16px;display:flex}.demo-browser-dot{border-radius:50%;width:12px;height:12px}.demo-browser-url{font:500 13px var(--sp-font-body);color:var(--sp-muted);background:#fff;border-radius:9px;flex:1;align-items:center;gap:6px;margin:0 12px;padding:6px 12px;display:flex}.demo-live-pill{font:600 12px var(--sp-font-body);border-radius:999px;align-items:center;gap:6px;padding:4px 10px;transition:background .4s,color .4s;display:flex}.demo-live-dot{border-radius:50%;width:7px;height:7px;transition:background .4s}.demo-browser-shell{background:#fff;border-radius:0 0 18px 18px;min-width:620px;height:640px;display:flex;overflow:hidden}.demo-sidebar{border-right:1px solid var(--sp-border);flex-direction:column;flex-shrink:0;gap:20px;width:190px;padding:18px 12px;display:flex}.demo-sidebar-brand{font:700 16px var(--sp-font-display);align-items:center;gap:8px;padding:0 6px;display:flex}.demo-sidebar-nav{flex-direction:column;gap:3px;display:flex}.demo-nav-link{cursor:pointer;font:600 14px var(--sp-font-body);color:var(--sp-ink);text-align:left;background:0 0;border:none;border-radius:10px;align-items:center;gap:10px;padding:9px 10px;display:flex}.demo-nav-link.active{background:var(--sp-teal-tint);color:var(--sp-teal)}.demo-nav-link-label{flex:1}.demo-nav-badge{background:var(--sp-apricot);color:var(--sp-ink);font:700 11px var(--sp-font-body);border-radius:999px;padding:1px 7px}.demo-nav-badge[hidden]{display:none}.demo-sidebar-footer{align-items:center;gap:8px;margin-top:auto;padding:0 6px;display:flex}.demo-sidebar-identity{flex-direction:column;display:flex}.demo-sidebar-username{font:600 13px var(--sp-font-body)}.demo-sidebar-userrole{font:500 11px var(--sp-font-body);color:var(--sp-muted)}.demo-browser-main{background:var(--sp-cream);flex-direction:column;flex:1;gap:16px;min-width:0;padding:22px 24px;display:flex;overflow-y:auto}.demo-dash-head{flex-direction:column;gap:2px;display:flex}.demo-dash-date{font:500 13px var(--sp-font-body);color:var(--sp-muted)}.demo-dash-greeting{font:700 26px/1.1 var(--sp-font-display);letter-spacing:-.02em}.demo-kpis{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.demo-kpi{border:1px solid var(--sp-border);background:#fff;border-radius:16px;flex-direction:column;gap:2px;padding:14px 16px;transition:background .3s,border-color .3s;display:flex}.demo-kpi--risk{background:var(--sp-high-bg);border-color:#f3cfc6}.demo-kpi-value{font:700 30px/1 var(--sp-font-display);color:var(--sp-teal)}.demo-kpi--risk .demo-kpi-value{color:var(--sp-high-ink)}.demo-kpi-label{font:500 13px var(--sp-font-body);color:var(--sp-muted)}.demo-rows-card{border:1px solid var(--sp-border);background:#fff;border-radius:18px;flex-direction:column;gap:2px;padding:8px;display:flex}.demo-empty-state{text-align:center;font:500 14px var(--sp-font-body);color:var(--sp-muted);margin:0;padding:28px}.demo-row2{border-radius:14px;transition:background .4s}.demo-row2-summary{cursor:pointer;text-align:left;width:100%;font-family:var(--sp-font-body);background:0 0;border:none;border-radius:14px;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:11px 12px;display:grid}.demo-row2-summary:hover{background:var(--sp-surface-sunken)}.demo-badge{font:600 12px var(--sp-font-body);white-space:nowrap;border-radius:999px;justify-self:start;align-items:center;gap:6px;padding:4px 9px;display:inline-flex}.demo-badge-dot{border-radius:50%;width:6px;height:6px}.demo-row2-title{flex-direction:column;gap:1px;min-width:0;display:flex}.demo-row2-title-text{font:600 14px var(--sp-font-body);white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:8px;min-width:0;display:flex;overflow:hidden}.demo-new-chip{background:var(--sp-apricot);color:var(--sp-ink);font:700 10px var(--sp-font-body);letter-spacing:.04em;border-radius:999px;flex-shrink:0;padding:2px 7px}.demo-row2-subtitle{font:500 12px var(--sp-font-body);color:var(--sp-muted)}.demo-status-badge{font:600 12px var(--sp-font-body);white-space:nowrap;border:1.5px solid #0000;border-radius:999px;justify-self:start;padding:3px 10px}.demo-row2-chevron{color:var(--sp-subtle);font-size:16px}.demo-row-detail{flex-direction:column;gap:12px;padding:4px 12px 14px;animation:.25s ease-out sp-in;display:flex}.demo-row-detail-divider{background:var(--sp-divider);height:1px}.demo-row-meta-line{font:500 13px var(--sp-font-body);color:var(--sp-muted);flex-wrap:wrap;gap:16px;display:flex}.demo-row-meta-line span,.demo-resolve-btn,.demo-closed-feedback{align-items:center;gap:6px;display:flex}.demo-inline-icon{flex-shrink:0}.demo-closed-feedback .demo-inline-icon{align-self:flex-start;margin-top:2px}.demo-row-actionrow{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.demo-assign-btn{background:var(--sp-teal);color:#fff;font:600 14px var(--sp-font-body);cursor:pointer;border:none;border-radius:11px;align-items:center;gap:8px;padding:10px 14px;display:flex}.demo-assign-btn:hover{background:var(--sp-teal-dark)}.demo-assignee-label{font:600 14px var(--sp-font-body);align-items:center;gap:8px;display:flex}.demo-feedback-group{flex-direction:column;gap:6px;display:flex}.demo-feedback-label{font:600 13px var(--sp-font-body)}.demo-feedback-textarea{resize:none;border:1.5px solid var(--sp-border-input);font:400 14px/1.45 var(--sp-font-body);color:var(--sp-ink);font-family:var(--sp-font-body);background:#fff;border-radius:12px;outline:none;padding:10px 12px}.demo-feedback-textarea:focus{border-color:var(--sp-teal);box-shadow:0 0 0 4px var(--sp-teal-tint)}.demo-resolve-btn{background:var(--sp-ok-ink);color:#fff;font:600 14px var(--sp-font-body);cursor:pointer;border:none;border-radius:11px;align-self:flex-start;align-items:center;gap:8px;padding:10px 14px;display:flex}.demo-resolve-btn:hover{opacity:.9}.demo-closed-feedback{background:var(--sp-ok-bg);font:400 13px/1.45 var(--sp-font-body);color:var(--sp-ok-ink);border-radius:12px;gap:8px;padding:10px 12px;display:flex}.demo-avatar{background:var(--sp-teal-tint);width:30px;height:30px;color:var(--sp-teal);font:700 11px var(--sp-font-body);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.demo-avatar--apricot{background:var(--sp-apricot-tint);color:var(--sp-apricot-ink)}.demo-avatar--lg{width:44px;height:44px;font-size:15px}.demo-avatar--sm{background:var(--sp-teal-tint);width:24px;height:24px;color:var(--sp-teal);font-size:10px}.demo-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px}.demo-mobile-fallback{text-align:center;max-width:1320px;font:500 15px/1.6 var(--sp-font-body);color:var(--demo-stage-muted);background:#ffffff14;border:1px solid #ffffff24;border-radius:18px;margin:24px auto 0;padding:20px;display:none}@media (width<=1100px){.demo-mission-rail{max-width:none;position:static}}@media (width<=1060px){.demo-stage-body{display:none}.demo-mobile-fallback{display:block}}
