.completion-surface{--blue:var(--color-primary);--deep:var(--color-primary-strong);--ink:var(--color-text);--text:var(--color-text-secondary);--muted:var(--color-text-muted);--line:var(--color-border);--bg:var(--color-bg-subtle);--tint:var(--color-primary-tint)}.completion-surface *{box-sizing:border-box}.completion-surface{margin:0;font-family:inherit;color:var(--ink);background:var(--bg);word-break:keep-all}.completion-surface button,.completion-surface input,.completion-surface textarea,.completion-surface select{font:inherit}.completion-surface button,.completion-surface a,.completion-surface input,.completion-surface textarea{touch-action:manipulation}.completion-surface button{cursor:pointer}.completion-surface button:disabled{cursor:default}.completion-surface a{color:var(--deep)}.completion-surface button:focus-visible,.completion-surface a:focus-visible,.completion-surface input:focus-visible,.completion-surface textarea:focus-visible{outline:var(--focus-ring);outline-offset:3px}.completion-surface [hidden]{display:none!important}.completion-surface .top{height:76px;padding:0 40px;background:var(--color-surface);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.completion-surface .brand{font-size:22px;font-weight:850;letter-spacing:-1px}.completion-surface .brand span{color:var(--blue)}.completion-surface .brand small{font-size:12px;font-weight:550;letter-spacing:0;color:var(--muted);border-left:1px solid var(--line);padding-left:16px;margin-left:16px}.completion-surface .prototype{font-size:12px;color:var(--color-warning-text);background:var(--color-warning-tint);border:1px solid var(--color-warning-border);border-radius:20px;padding:8px 12px;white-space:nowrap}.completion-surface .topnav{display:flex;gap:6px;background:var(--color-bg-subtle);padding:4px;border-radius:12px}.completion-surface .topnav button{border:0;background:transparent;color:var(--color-text-tertiary);padding:10px 16px;border-radius:9px;font-size:14px;font-weight:650}.completion-surface .topnav button[aria-selected=true]{background:var(--color-surface);color:var(--deep);box-shadow:var(--shadow-sm)}.completion-surface .shell{max-width:1230px;padding:36px 32px 50px;margin:auto}.completion-surface .eyebrow{font-size:11px;letter-spacing:1.8px;font-weight:800;color:var(--blue);margin-bottom:11px}.completion-surface .section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:26px}.completion-surface h1{font-size:29px;line-height:1.35;margin:0 0 9px;letter-spacing:-.8px}.completion-surface .sub{color:var(--color-text-tertiary);font-size:14px;line-height:1.65;margin:0}.completion-surface .pill{display:inline-flex;align-items:center;gap:6px;color:var(--color-text-secondary);background:var(--color-bg-muted);border-radius:99px;padding:7px 11px;font-size:11px;font-weight:650}.completion-surface .pill i{width:6px;height:6px;background:var(--color-border-primary);border-radius:50%}.completion-surface .btn{border:1px solid var(--line);border-radius:11px;background:var(--color-surface);padding:11px 15px;font-weight:650;color:var(--text);font-size:13px;white-space:nowrap}.completion-surface .btn:hover{background:var(--color-surface-sunken)}.completion-surface .btn.blue{background:var(--blue);border-color:var(--blue);color:var(--color-on-primary)}.completion-surface .btn.blue:hover{background:var(--deep)}.completion-surface .btn:disabled{opacity:.5}.completion-surface .customer-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:28px}.completion-surface .stage-box{background:var(--color-border);border:1px solid var(--color-border);border-radius:20px;overflow:hidden}.completion-surface .stage-toolbar{height:51px;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center;padding:0 20px;font-size:12px;color:var(--color-text-tertiary);background:var(--color-surface-sunken)}.completion-surface .dots{display:flex;gap:5px;align-items:center}.completion-surface .dots i{width:7px;height:7px;border-radius:50%;background:var(--color-border-strong)}.completion-surface .dots span{margin-left:9px}.completion-surface .switcher{display:flex;gap:2px}.completion-surface .switcher button{border:0;border-radius:6px;background:transparent;padding:6px 9px;font-size:11px;color:var(--color-text-tertiary)}.completion-surface .switcher .selected{background:var(--color-primary-tint-strong);color:var(--deep);font-weight:750}.completion-surface .stage{min-height:590px;position:relative;padding:25px;display:flex;align-items:center;justify-content:center;isolation:isolate}.completion-surface .backpage{position:absolute;top:16px;bottom:16px;width:390px;max-width:calc(100% - 40px);border-radius:12px;background:var(--color-surface);padding:30px 26px;filter:blur(2px);overflow:hidden;z-index:-2}.completion-surface .backpage .backbrand{font-weight:800;font-size:13px;border-bottom:1px solid var(--color-bg-muted);padding-bottom:20px}.completion-surface .backpage h3{font-size:22px;margin:40px 0 20px}.completion-surface .skeleton{height:12px;border-radius:8px;background:var(--color-bg-muted);margin:14px 0}.completion-surface .skeleton.field{height:44px;background:var(--color-surface);border:1px solid var(--color-border)}.completion-surface .skeleton.blue{height:48px;background:var(--color-border-primary);margin-top:30px}.completion-surface .veil{position:absolute;inset:0;background:var(--color-overlay);z-index:-1}.completion-surface .stage.desktop .backpage{width:90%;padding:30px 60px}.completion-surface .stage.desktop .completion{max-width:452px}.completion-surface .stage.desktop .completion h2{font-size:27px}.completion-surface .completion{width:100%;max-width:360px;background:var(--color-surface);border-radius:24px;padding:28px 24px 22px;box-shadow:var(--shadow-md);position:relative;overflow-wrap:anywhere}.completion-surface .close{position:absolute;right:16px;top:14px;background:transparent;color:var(--color-text-muted);width:32px;height:32px;border:0;border-radius:9px;font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center}.completion-surface .close:hover{background:var(--color-bg-muted)}.completion-surface .success-mark{width:47px;height:47px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--color-primary-tint);margin-bottom:18px;color:var(--blue)}.completion-surface .success-mark svg{width:25px;height:25px}.completion-surface .complete-kicker{font-size:12px;font-weight:750;color:var(--blue);margin-bottom:9px}.completion-surface .completion h2{font-size:25px;letter-spacing:-.7px;line-height:1.35;margin:0 0 12px}.completion-surface .message{font-size:14px;color:var(--color-text-tertiary);line-height:1.7;margin:0 0 20px;white-space:pre-line}.completion-surface .course-box{background:var(--color-bg-subtle);border:1px solid var(--color-bg-muted);border-radius:14px;padding:16px;margin-bottom:20px}.completion-surface .course-label{font-size:10px;letter-spacing:1px;color:var(--color-text-muted);font-weight:750;margin-bottom:8px}.completion-surface .course-title{font-size:14px;line-height:1.6;font-weight:730;margin-bottom:10px;white-space:pre-line}.completion-surface .event-row{display:flex;align-items:center;gap:7px;font-size:12px;line-height:1.7;color:var(--color-text-tertiary)}.completion-surface .event-row svg{width:13px;height:13px;color:var(--color-text-muted);flex-shrink:0}.completion-surface .cta{border:0;background:var(--blue);color:var(--color-on-primary);border-radius:12px;min-height:54px;width:100%;display:flex;justify-content:center;align-items:center;gap:10px;padding:12px 16px;font-size:15px;font-weight:750;text-decoration:none;text-align:center;line-height:1.4}.completion-surface .cta:hover{background:var(--deep);color:var(--color-on-primary)}.completion-surface .cta svg{width:16px;height:16px;flex-shrink:0}.completion-surface .note{margin:11px 0 0;font-size:11px;line-height:1.6;text-align:center;color:var(--color-text-muted);white-space:pre-line}.completion-surface .close-text{border:0;background:none;display:block;margin:14px auto 0;color:var(--color-text-muted);font-size:12px;padding:3px 10px}.completion-surface .stage-closed{display:flex;flex-direction:column;text-align:center;gap:16px;background:var(--color-surface);border-radius:18px;padding:28px;box-shadow:var(--shadow-md)}.completion-surface .guide{display:flex;flex-direction:column;gap:16px}.completion-surface .guide-card{background:var(--color-surface);border:1px solid var(--line);border-radius:18px;padding:22px}.completion-surface .guide-card h2{font-size:17px;margin:0 0 20px;letter-spacing:-.3px}.completion-surface .guide-item{display:flex;gap:13px;margin-top:21px}.completion-surface .number{color:var(--deep);background:var(--tint);width:27px;height:27px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:11px;font-weight:800;border-radius:8px}.completion-surface .guide-item strong{font-size:14px;display:block;margin:3px 0 5px}.completion-surface .guide-item p{font-size:12px;color:var(--color-text-muted);line-height:1.65;margin:0}.completion-surface .guide-callout{background:var(--color-primary-tint);padding:20px;border:1px solid var(--color-primary-tint-strong);border-radius:16px;font-size:13px;line-height:1.65;color:var(--color-text-tertiary)}.completion-surface .guide-callout b{color:var(--deep);display:block;margin-bottom:6px}.completion-surface .guide-actions{display:flex;gap:8px;flex-wrap:wrap}.completion-surface .muted-small{font-size:11px;color:var(--color-text-muted);line-height:1.6;margin:14px 0 0}.completion-surface .admin-layout{display:grid;grid-template-columns:minmax(0,1.42fr) minmax(330px,1fr);gap:26px;align-items:start}.completion-surface .form-stack{display:flex;flex-direction:column;gap:16px}.completion-surface .form-card{background:var(--color-surface);border:1px solid var(--line);border-radius:17px;padding:22px}.completion-surface .form-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:17px}.completion-surface .form-title h2{font-size:15px;letter-spacing:-.25px;margin:0}.completion-surface .step{color:var(--blue);margin-right:9px;font-size:12px}.completion-surface .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.completion-surface .field{margin:0 0 14px}.completion-surface .field:last-child{margin-bottom:0}.completion-surface .field label{display:block;font-size:12px;font-weight:650;color:var(--color-text-secondary);margin-bottom:7px}.completion-surface .field input,.completion-surface .field textarea{width:100%;border:1px solid var(--color-border);border-radius:9px;background:var(--color-surface);padding:10px 11px;font-size:13px;color:var(--ink);line-height:1.5;min-height:40px}.completion-surface .field textarea{resize:vertical;min-height:75px}.completion-surface .field input:focus,.completion-surface .field textarea:focus{border-color:var(--blue);outline:var(--focus-ring);outline-offset:0}.completion-surface .field small{color:var(--muted);font-size:11px;line-height:1.6;display:block;margin-top:5px}.completion-surface .toggle-label{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--color-text-tertiary);cursor:pointer}.completion-surface .toggle{position:relative;appearance:none;width:35px;height:21px;border-radius:20px;background:var(--color-border-strong);cursor:pointer;margin:0;transition:background .15s}.completion-surface .toggle:after{content:'';width:15px;height:15px;position:absolute;border-radius:50%;left:3px;top:3px;background:var(--color-surface);box-shadow:var(--shadow-sm);transition:transform .15s}.completion-surface .toggle:checked{background:var(--blue)}.completion-surface .toggle:checked:after{transform:translateX(14px)}.completion-surface .check-label{display:flex;gap:8px;align-items:center;font-size:12px;line-height:1.5;color:var(--color-text-tertiary)}.completion-surface .check-label input{accent-color:var(--blue);width:15px;height:15px;margin:0}.completion-surface .preview-column{position:sticky;top:20px}.completion-surface .preview-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:12px;font-weight:700;color:var(--color-text-tertiary)}.completion-surface .preview-board{background:var(--color-border);border:1px solid var(--color-border);border-radius:20px;min-height:505px;display:flex;align-items:center;justify-content:center;padding:25px 18px}.completion-surface .preview-board .completion{box-shadow:var(--shadow-md)}.completion-surface .preview-board .completion h2{font-size:24px}.completion-surface .preview-board .close,.completion-surface .preview-board .close-text{pointer-events:none}.completion-surface .preview-board .completion{max-width:360px}.completion-surface .preview-foot{font-size:11px;color:var(--color-text-muted);line-height:1.7;padding:13px 4px}.completion-surface .save-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--color-surface);border:1px solid var(--line);padding:16px 20px;border-radius:16px}.completion-surface .save-bar .save-state{font-size:11px;color:var(--color-text-muted)}.completion-surface .save-bar .buttons{display:flex;gap:8px}.completion-surface .error{color:var(--color-danger-text);background:var(--color-danger-tint);border:1px solid var(--color-danger-border);font-size:12px;padding:11px 14px;border-radius:9px;line-height:1.6}.completion-surface .disabled-preview{text-align:center;max-width:290px;color:var(--color-text-tertiary);line-height:1.7}.completion-surface .disabled-preview strong{display:block;font-size:20px;color:var(--color-text);margin-bottom:10px}.completion-surface .system-note{border-top:1px solid var(--line);margin-top:28px;padding-top:18px;display:flex;gap:20px;flex-wrap:wrap;font-size:11px;color:var(--color-text-muted);line-height:1.6}.completion-surface .system-note strong{color:var(--color-text-tertiary)}.completion-surface .toast{position:fixed;z-index:100;bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);background:var(--color-text);color:var(--color-on-primary);border-radius:12px;padding:13px 20px;font-size:13px;box-shadow:var(--shadow-md);line-height:1.6}.completion-surface .live-dialog{padding:0;border:0;border-radius:24px;max-width:calc(100vw - 32px);width:400px;max-height:calc(100dvh - 32px);overflow:auto;box-shadow:var(--shadow-md)}.completion-surface .live-dialog::backdrop{background:var(--color-overlay);backdrop-filter:blur(3px)}.completion-surface .live-dialog .completion{max-width:none;box-shadow:none}.completion-surface .live-dialog .completion .close-text{display:none}.completion-surface .modal-caption{margin:0;background:var(--color-warning-tint);color:var(--color-warning-text);text-align:center;font-size:10px;padding:8px 14px;line-height:1.5}.completion-surface .faux-nav{font-size:12px;color:var(--color-text-muted);margin-bottom:20px}.completion-surface .faux-nav span{color:var(--deep);font-weight:650}.completion-surface .head-actions{display:flex;gap:8px;align-items:center}.completion-surface .state-chip{font-size:10px;padding:5px 8px;border-radius:6px;background:var(--color-primary-tint);color:var(--deep);font-weight:700}@media(max-width:950px){.completion-surface .top{height:auto;min-height:76px;flex-wrap:wrap;padding:18px 24px;gap:15px}.completion-surface .brand small{display:none}.completion-surface .prototype{margin-left:auto}.completion-surface .topnav{order:3;width:100%}.completion-surface .topnav button{flex:1}.completion-surface .customer-grid,.completion-surface .admin-layout{grid-template-columns:1fr}.completion-surface .guide{display:grid;grid-template-columns:1fr 1fr}.completion-surface .guide-actions{grid-column:1/-1}.completion-surface .preview-column{position:static}.completion-surface .preview-board{min-height:540px}.completion-surface .shell{padding:28px 22px}.completion-surface .section-head{align-items:flex-start}.completion-surface .head-actions{flex-wrap:wrap;justify-content:flex-end}.completion-surface .stage{min-height:570px}.completion-surface .form-card{padding:20px}.completion-surface .guide-callout{align-self:start}}@media(max-width:520px){.completion-surface .top{padding:16px}.completion-surface .prototype{font-size:10px}.completion-surface .brand{font-size:20px}.completion-surface .topnav button{font-size:12px;padding:9px 11px}.completion-surface .shell{padding:25px 16px 40px}.completion-surface .section-head{display:block}.completion-surface h1{font-size:25px}.completion-surface .section-head .pill,.completion-surface .section-head .head-actions{margin-top:16px}.completion-surface .guide{display:flex}.completion-surface .stage{padding:20px 12px;min-height:560px}.completion-surface .completion{padding:25px 21px 20px}.completion-surface .completion h2{font-size:24px}.completion-surface .stage-toolbar{padding:0 12px}.completion-surface .form-row{grid-template-columns:1fr;gap:0}.completion-surface .preview-board{padding:22px 12px}.completion-surface .save-bar{align-items:flex-start;flex-direction:column}.completion-surface .save-bar .buttons{width:100%;justify-content:space-between}.completion-surface .prototype{white-space:normal}.completion-surface .field textarea{font-size:14px}.completion-surface .field input{font-size:16px}.completion-surface .live-dialog{width:calc(100vw - 32px)}.completion-surface .guide-callout{font-size:13px}}@media(prefers-reduced-motion:reduce){.completion-surface *{scroll-behavior:auto!important;transition:none!important}}
.completion-surface{font-family:inherit;word-break:keep-all;color:var(--color-text)}.completion-surface textarea{font:inherit}.completion-surface .toggle{min-height:21px;padding:0;border:0;flex-shrink:0}.completion-surface .check-label input{min-height:15px;padding:0;flex-shrink:0}.completion-surface .live-dialog{margin:auto;overscroll-behavior:contain}.completion-surface .live-dialog .completion{border-radius:0}.completion-surface .cta[aria-disabled=true]{background:var(--color-text-disabled);cursor:not-allowed}.completion-surface .completion{box-sizing:border-box}.completion-surface .event-row span{min-width:0;overflow-wrap:anywhere}.completion-surface .completion .close{min-height:32px}.completion-surface .preview-board{min-width:0}.completion-surface .form-stack{min-width:0}.completion-surface .completion-status{margin:0 0 18px}.completion-surface .btn{min-height:44px}.completion-surface .live-dialog .completion .close-text{display:block}@media(max-width:520px){.completion-surface .field textarea{font-size:16px}.completion-surface .form-title{flex-wrap:wrap}.completion-surface .save-bar .buttons{flex-wrap:wrap}.completion-surface .preview-board{min-height:0}.completion-surface .live-dialog{max-height:calc(100dvh - 24px)}}

/* Explicit component resets prevent landing/admin utility styles leaking into the card. */
.completion-surface .completion{color:var(--color-text);font-size:16px;font-style:normal;text-align:left}
.completion-surface .completion .message{padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;margin:0 0 20px;color:var(--color-text-tertiary);font-size:14px;font-weight:400;line-height:1.7;white-space:pre-line}
.completion-surface .completion h2{padding:0;border:0;background:transparent;color:var(--color-text);font-weight:700;text-transform:none;text-decoration:none}
.completion-surface .completion a.cta,.completion-surface .completion a.cta:visited{color:var(--color-surface);text-decoration:none;border:0;box-shadow:none}
.completion-surface .completion a.cta:hover{color:var(--color-surface);text-decoration:none}
.completion-surface .completion a.cta[aria-disabled=true]:hover{background:var(--color-text-disabled);cursor:not-allowed}
.completion-surface .completion button.close,.completion-surface .completion button.close-text{padding:0;box-shadow:none;font-weight:400;text-transform:none}
.completion-surface .completion button.close-text{padding:3px 10px}