@import url('/assets/fonts.css');
:root{--bg:#f8f9fc;--white:#fff;--ink:#262638;--muted:#868696;--purple:#7453e8;--purple-dark:#6142d0;--lavender:#f0ebff;--border:#eaeaf180;--purple-line:#7453e880;--green:#299c76;--orange:#cf9236;--red:#ca5361;--shadow:0 4px 20px #29224604;--radius:19.5px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;letter-spacing:-.15px}button,input,select,textarea{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{border:0}svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}h1,h2,h3,p{margin:0}h1{font-size:29px;font-weight:650;letter-spacing:-1.15px;line-height:1.3}h2{font-size:17px;font-weight:600;letter-spacing:-.35px}h3{font-size:14px;font-weight:600}p{line-height:1.7}small{font-size:12px}.muted{color:var(--muted)}.purple{color:var(--purple)}.mono{font-family:'SFMono-Regular',Consolas,monospace;font-size:12px}.flex{display:flex;align-items:center;gap:12px}.between{display:flex;align-items:center;justify-content:space-between;gap:12px}.stack{display:grid;gap:20px}.mt{margin-top:24px}.mb{margin-bottom:24px}.hidden{display:none!important}.nowrap{white-space:nowrap}.logo{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:700;letter-spacing:-1px}.logo-mark{display:inline-flex;align-items:center;justify-content:center;width:34px;height:36px;color:white;background:var(--purple);border-radius:15px;font-size:30px;line-height:1;font-weight:750;padding-bottom:5px;font-family:Arial}.logo-dot{color:var(--purple)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 17px;min-height:40px;border-radius:12px;border:1px solid transparent;font-size:12px;font-weight:550;white-space:nowrap;transition:background .16s,transform .16s}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:wait}.btn svg{width:16px;height:16px}.btn-primary{background:var(--purple);color:white;box-shadow:0 2px 3px #5037b119}.btn-primary:hover{background:var(--purple-dark)}.btn-secondary{background:white;border-color:var(--border);color:#5a596c}.btn-secondary:hover{background:#f8f7fc;border-color:#d9d2ee80}.btn-soft{background:var(--lavender);color:var(--purple)}.btn-soft:hover{background:#e8dfff}.btn-text{padding:5px 0;background:transparent;color:var(--purple);min-height:24px}.btn-danger{background:#fff0f2;color:var(--red)}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:35px;height:35px;border-radius:12px;background:transparent;color:#8c8b9c}.icon-btn:hover{background:var(--lavender);color:var(--purple)}.icon-btn svg{width:18px}.badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:9px;background:#f1eff8;color:#817295;font-size:10px;font-weight:550;white-space:nowrap}.badge:before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor}.badge.succeeded,.badge.paid,.badge.open{background:#eaf7f0;color:var(--green)}.badge.queued,.badge.running,.badge.inspecting,.badge.validating{background:#eeeafd;color:var(--purple)}.badge.awaiting_inputs,.badge.pending,.badge.manual_review{background:#fff6e8;color:var(--orange)}.badge.failed,.badge.rejected,.badge.refunded{background:#fff0f1;color:var(--red)}.tag{display:inline-flex;align-items:center;padding:4px 7px;border:1px solid var(--border);border-radius:7.5px;color:#8c8c9c;font-size:10px;background:#fafafe}.card{border:1px solid var(--border);border-radius:var(--radius);background:var(--white);box-shadow:var(--shadow)}.card-header{padding:20px 22px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}.card-body{padding:22px}.subtitle{margin-top:6px;color:var(--muted);font-size:13px}.eyebrow{text-transform:uppercase;font-size:10px;color:#a2a0af;letter-spacing:1.2px;font-weight:600}.divider{height:1px;background:var(--border);margin:20px 0}label{display:block;font-size:12px;color:#605c72;font-weight:550;margin-bottom:8px}input,textarea,select{width:100%;background:white;border:1px solid #e2e0eb80;border-radius:12px;padding:12px 13px;outline:none;color:var(--ink)}input:focus,textarea:focus,select:focus{border-color:#ad96f380;box-shadow:0 0 0 3px #7453e810}textarea{resize:vertical;min-height:110px;line-height:1.6}.field{margin-bottom:20px}.field-note{font-size:11px;line-height:1.6;color:var(--muted);margin-top:7px}.check{width:auto;margin-right:8px}.empty{padding:38px 20px;text-align:center}.empty-icon{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:19.5px;background:#f6f3ff;color:#a78ddf;margin-bottom:14px}.empty-icon svg{width:23px;height:23px}.empty h3{font-size:14px;margin-bottom:5px}.empty p{font-size:12px;color:var(--muted);max-width:370px;margin:auto}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left}thead{background:#fcfcfe}th{font-size:10px;text-transform:uppercase;letter-spacing:.7px;font-weight:550;color:#9c9baa;padding:13px 22px;border-bottom:1px solid var(--border);white-space:nowrap}td{padding:16px 22px;border-bottom:1px solid #f1f0f580;font-size:12px}tr:last-child td{border-bottom:0}.file-name{display:flex;align-items:center;gap:11px;min-width:160px}.file-symbol{display:inline-flex;align-items:center;justify-content:center;width:33px;height:36px;color:#9477cf;background:#f6f2ff;border-radius:10.5px}.file-symbol svg{width:17px}.clickable{cursor:pointer}.clickable:hover{background:#faf9fe}.table-toolbar{padding:15px 22px;border-bottom:1px solid var(--border);display:flex;gap:12px;align-items:center}.search-input{position:relative;flex:1;max-width:300px}.search-input svg{position:absolute;left:12px;top:10px;width:15px;color:#aaa6b7}.search-input input{padding:10px 12px 10px 35px;font-size:12px}.filter-select{width:auto;padding:10px;font-size:12px;color:#7b778c}
/* Workspace */
.sidebar{position:fixed;left:0;top:0;bottom:0;width:228px;background:white;border-right:1px solid var(--border);display:flex;flex-direction:column;padding:30px 18px 20px;z-index:30}.sidebar .logo{padding-left:12px;margin-bottom:42px}.sidebar .eyebrow{padding:0 13px;margin-bottom:13px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;margin:3px 0;font-size:12px;font-weight:500;color:#888596;transition:background .15s}.nav-item:hover{background:#f9f7fd;color:var(--purple)}.nav-item.active{background:#f0ebfc;color:var(--purple);font-weight:600}.nav-item svg{width:18px;height:18px}.nav-count{margin-left:auto;padding:2px 6px;font-size:9px;background:#e7ddff;border-radius:6px}.nav-gap{height:25px}.sidebar-bottom{margin-top:auto}.sidebar-promo{margin:20px 5px;padding:17px 14px;background:#faf8ff;border:1px solid #eee7ff80;border-radius:15px}.sidebar-promo .flex{gap:8px;color:var(--purple);font-size:11px;font-weight:600}.sidebar-promo svg{width:16px}.sidebar-promo p{font-size:10px;color:#a099b0;margin:8px 0 13px;line-height:1.7}.sidebar-promo .btn{width:100%;font-size:10px;min-height:33px;padding:7px}.account-mini{display:flex;align-items:center;gap:10px;padding:12px 9px;border-top:1px solid var(--border);margin-top:12px}.avatar{width:32px;height:32px;border-radius:50%;background:#efebf8;display:inline-flex;align-items:center;justify-content:center;color:#866bc3;font-size:11px;font-weight:600;flex-shrink:0}.account-mini h3{font-size:11px;max-width:124px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-mini p{font-size:9px;color:#a6a2b1;line-height:1.6}.workspace{margin-left:228px;min-height:100vh}.topbar{height:75px;border-bottom:1px solid var(--border);background:white;display:flex;align-items:center;justify-content:space-between;padding:0 34px;gap:20px}.breadcrumb{display:flex;align-items:center;gap:11px;font-size:11px;color:#a09caa}.breadcrumb svg{width:14px}.breadcrumb strong{font-weight:500;color:#5e5b70}.top-right{display:flex;align-items:center;gap:15px}.top-search{display:flex;align-items:center;gap:8px;color:#aca8b6;font-size:10px;padding-right:20px;border-right:1px solid var(--border)}.top-search svg{width:15px}.shortcut{border:1px solid var(--border);padding:2px 4px;font-size:9px;margin-left:20px;border-radius:6px}.notification-button{position:relative}.notification-dot{position:absolute;top:8px;right:8px;width:5px;height:5px;background:var(--purple);border:1px solid #ffffff80;border-radius:50%}.main-content{padding:30px 34px 25px;max-width:1580px;margin:0 auto}.page-intro{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:27px;gap:20px}.page-intro h1{font-size:27px}.page-intro .subtitle{font-size:12px}.page-intro .btn{margin-top:3px}.intro-kicker{display:flex;align-items:center;gap:7px;font-size:10px;color:#a39eaf;margin-bottom:9px}.intro-kicker span{height:6px;width:6px;border-radius:50%;background:#54b394}.overview-layout{display:grid;grid-template-columns:minmax(0,1fr) 278px;gap:24px}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-bottom:23px}.stat{padding:19px 20px;position:relative;min-height:133px}.stat-icon{display:inline-flex;width:30px;height:30px;align-items:center;justify-content:center;border-radius:12px;position:absolute;right:18px;top:18px;background:#f1ecff;color:#9e80e4}.stat-icon.green{background:#ebf7f1;color:#70b997}.stat-icon.blue{background:#edf3ff;color:#91aadd}.stat-icon svg{width:15px;height:15px}.stat-label{color:#9c97a9;font-size:10px;font-weight:500;margin-bottom:15px}.stat-value{font-size:30px;line-height:1.05;font-weight:600;letter-spacing:-1px}.stat-foot{font-size:9px;color:#a29bac;margin-top:11px;display:flex;align-items:center;gap:5px}.stat-foot svg{width:11px;height:11px}.stat-foot .green{color:#69ac8d}.decode-card{padding:23px 24px}.section-description{font-size:11px;color:#9a94a6;margin-top:5px}.step-pill{font-size:9px;padding:6px 10px;background:#f8f7fb;border:1px solid var(--border);color:#a39bad;border-radius:7.5px;display:flex;gap:6px;align-items:center}.step-pill svg{width:12px;height:12px}.drop-zone{border:1.5px dashed #dcd3ef80;border-radius:15px;background:#fcfaff;min-height:224px;margin-top:21px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:25px;transition:background .2s,border-color .2s;cursor:pointer}.drop-zone:hover,.drop-zone.dragging{background:#f4efff;border-color:var(--purple-line)}.upload-symbol{width:51px;height:51px;border-radius:21px;background:#eee7fe;display:flex;align-items:center;justify-content:center;color:#9876d6;margin-bottom:17px;box-shadow:0 0 0 7px #f7f2ff}.upload-symbol svg{width:24px;height:24px}.drop-zone h3{font-size:13px;font-weight:500;margin-bottom:6px}.drop-zone h3 span{color:var(--purple);font-weight:600}.drop-zone p{font-size:10px;color:#aaa1b8}.drop-zone .btn{margin-top:18px;padding:8px 15px;font-size:10px;min-height:33px}.upload-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:15px;font-size:9px;color:#aaa1b7}.upload-foot .flex{gap:5px}.upload-foot svg{width:12px;height:12px}.coverage-strip{display:flex;align-items:center;gap:8px;margin-top:21px;padding-top:19px;border-top:1px solid var(--border);font-size:9px;color:#a39cad;flex-wrap:wrap}.coverage-strip svg{width:13px;color:#aaa0bd}.coverage-strip .tag{font-size:9px}.recent-card{margin-top:23px}.recent-card .card-header{padding:20px 22px}.recent-card .btn-text{font-size:10px}.recent-card .empty{padding:32px 20px}.plan-card{background:linear-gradient(145deg,#faf7ff,#f2edfc);border-color:#e8e0f680;padding:22px}.plan-card .eyebrow{color:#a696bf;font-size:9px;letter-spacing:.9px}.plan-icon{width:35px;height:35px;display:flex;align-items:center;justify-content:center;background:#eae0fe;border-radius:15px;color:#936bcc}.plan-icon svg{width:17px}.plan-card h2{font-size:19px;letter-spacing:-.6px;margin-top:16px}.plan-card p{font-size:11px;color:#a295b5;margin-top:8px;line-height:1.8}.plan-card .btn{width:100%;margin-top:18px;font-size:10px;min-height:36px}.plan-card .divider{background:#e8def7;margin:18px 0}.plan-feature{display:flex;align-items:center;gap:8px;font-size:10px;color:#9686ac;margin-top:10px}.plan-feature svg{width:12px;color:#b49ace}.help-card{padding:22px;margin-top:20px}.help-icon{width:32px;height:32px;background:#f4f2f9;color:#a49ab9;display:flex;align-items:center;justify-content:center;border-radius:13.5px;margin-bottom:14px}.help-icon svg{width:17px}.help-card h3{font-size:12px}.help-card p{font-size:10px;color:#aaa2b2;margin-top:7px;line-height:1.9}.help-card .btn-text{margin-top:14px;font-size:10px}.compat-card{margin-top:20px;padding:21px}.compat-card h3{font-size:11px;margin-bottom:16px}.compat-row{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:10px;color:#9b92a7}.compat-row span:last-child{font-size:9px;color:#6ca98d}.compat-row .coming{color:#c5a06d!important}.compat-card .btn-text{font-size:9px;margin-top:16px}.workspace-footer{display:flex;align-items:center;justify-content:space-between;padding:25px 1px 0;font-size:9px;color:#b1a9bc}.system-status{display:flex;align-items:center;gap:6px}.system-status:before{content:'';width:5px;height:5px;background:#72bfa0;border-radius:50%}.workspace-footer a:hover{color:var(--purple)}
/* Billing, support, admin */
.tabs{display:flex;gap:24px;border-bottom:1px solid var(--border);margin-bottom:25px}.tab{padding:12px 0;font-size:12px;border-bottom:2px solid transparent;background:transparent;color:#9290a0}.tab.active{color:var(--purple);border-color:var(--purple-line)}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.price-card{padding:25px;position:relative}.price-card.featured{border-color:#c6b4f580;box-shadow:0 4px 24px #7453e809}.popular{position:absolute;top:-10px;right:18px;background:var(--purple);color:white;padding:4px 9px;border-radius:7.5px;font-size:9px}.price-card .price-icon{display:inline-flex;background:#f4efff;color:#a184d9;padding:9px;border-radius:13.5px;margin-bottom:20px}.price-card h2{font-size:17px}.price-card .price{font-size:35px;letter-spacing:-1.2px;font-weight:650;margin-top:19px}.price span{font-size:11px;color:#aaa1b3;font-weight:400;letter-spacing:0;margin-left:6px}.price-card p{font-size:11px;color:#9a90a8;margin-top:7px}.price-features{list-style:none;margin:20px 0;padding:0}.price-features li{display:flex;align-items:center;gap:9px;font-size:11px;color:#92879f;margin-top:13px}
/* What a plan does not pay for is listed with the rest, struck through rather
   than hidden, so the limits are read at the same time as the price. */
.price-features li.excluded{color:#6f6579}
.price-features li.excluded svg{color:#a8616f;stroke-width:2}
.price-features li:first-of-type.excluded,.price-features li.excluded:not(.excluded+.excluded){margin-top:15px}.price-features svg{width:13px;height:13px;color:#a382d4}.quantity-control{display:flex;align-items:center;justify-content:space-between;background:#faf9fd;border:1px solid var(--border);border-radius:10.5px;margin-top:23px;padding:5px}.quantity-control button{width:30px;height:28px;background:white;color:#8b72b7;border:1px solid var(--border);border-radius:7.5px}.quantity-control input{border:0;background:transparent;text-align:center;max-width:80px;padding:5px;font-size:12px;box-shadow:none}.checkout-bar{margin-top:23px;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.checkout-bar strong{font-size:18px}.info-banner{background:#f4f1fd;border:1px solid #e8e1f980;border-radius:13.5px;padding:14px 18px;display:flex;gap:11px;align-items:flex-start;color:#9a85b6;font-size:11px;line-height:1.7;margin-bottom:24px}.info-banner svg{width:17px;height:17px;margin-top:2px}.support-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:24px}.ticket-row{display:flex;align-items:center;gap:14px;padding:20px 22px;border-bottom:1px solid var(--border)}.ticket-row:last-child{border-bottom:0}.ticket-row h3{font-size:12px;margin-bottom:6px}.ticket-row p{font-size:10px;color:#a49cac}.ticket-row .badge{margin-left:auto}.ticket-symbol{width:37px;height:37px;border-radius:15px;background:#f5f1fc;color:#a389c4;display:flex;align-items:center;justify-content:center}.ticket-symbol svg{width:17px}.thread{padding:22px}.message{padding:17px 20px;border:1px solid var(--border);border-radius:15px;max-width:88%;margin-bottom:18px;background:#fcfcff}.message.staff{background:#f5f0ff;border-color:#e9e0fa80;margin-left:auto}.message.private{background:#fff8e9;border-color:#f1e6cf80}.message-header{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:10px;color:#a294b3;margin-bottom:9px}.message-header strong{font-size:11px;color:#7a688e}.message p{white-space:pre-wrap;font-size:12px;color:#81778d;line-height:1.8}.thread-compose{padding:22px;border-top:1px solid var(--border)}.source-viewer{background:#201e30;color:#d5cde5;padding:24px;border-radius:13.5px;overflow:auto;max-height:460px;font:12px/1.8 Consolas,monospace;white-space:pre;tab-size:4}.details-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:20px 0}.detail-item{background:#faf9fd;border:1px solid var(--border);border-radius:12px;padding:13px}.detail-item label{font-size:10px;margin-bottom:8px;color:#a899b8}.detail-item strong{font-size:12px;font-weight:550;overflow-wrap:anywhere}.requirement{padding:17px;border:1px solid #efe1c780;background:#fffaf2;border-radius:13.5px;margin-top:15px}.requirement h3{font-size:12px;margin-bottom:5px;color:#aa8751}.requirement p{font-size:11px;color:#b49c79}.requirement .mono{margin-top:6px;display:block}.requirement .btn{margin-top:12px}.settings-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px}.settings-layout .card-body{padding:25px}.settings-layout .card-header h2{font-size:14px}.setting-row{display:flex;align-items:center;gap:10px;margin-top:18px}.setting-row input[type=checkbox]{width:auto}.code-example{border:1px solid #e6e0f080;border-radius:13.5px;padding:19px;background:#fbf9ff;font:12px/1.8 Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;color:#8b76a8}.docs-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:24px}.endpoint{display:flex;align-items:center;gap:9px;margin-top:14px;font-size:11px}.method{padding:4px 7px;font-size:9px;border-radius:6px;background:#eae4ff;color:#8a67c6;font-weight:650}.method.get{background:#e6f7ef;color:#62a98a}.compat-table td,.compat-table th{padding:19px 22px}.coming-panel{padding:20px;background:#fffbf4;border:1px solid #f1e7d480;border-radius:13.5px;margin-top:22px;color:#b29a77;font-size:11px;line-height:1.8}.admin-switch{padding:10px 14px;background:#faf4e9;border:1px solid #f2e5cd80;border-radius:12px;color:#b3966b;font-size:11px;margin-bottom:20px}.notification-list{display:grid;gap:10px}.notification{padding:14px 16px;background:#faf9fe;border:1px solid var(--border);border-radius:12px;text-align:left}.notification h3{font-size:11px;margin-bottom:4px}.notification p{font-size:10px;color:#a297b0}.notification.unread{border-left:3px solid var(--purple-line)}.admin-stats{grid-template-columns:repeat(4,1fr)}
/* Modals and feedback */
.modal-overlay{position:fixed;inset:0;background:#28223b55;backdrop-filter:blur(4px);z-index:100;display:flex;align-items:center;justify-content:center;padding:24px}.modal{background:white;border-radius:25.5px;box-shadow:0 20px 80px #21153825;width:520px;max-width:100%;max-height:90vh;overflow:auto}.modal.wide{width:850px}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:23px 25px;border-bottom:1px solid var(--border)}.modal-header h2{font-size:17px}.modal-content{padding:25px}.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:22px}.account-code{font-size:27px;letter-spacing:3px;font-family:Consolas,monospace;padding:21px 10px;text-align:center;background:#f5f0ff;border:1px dashed #d3c2f380;border-radius:15px;color:var(--purple);margin:20px 0}.form-error{font-size:11px;color:var(--red);line-height:1.7;margin-top:10px}.toast{display:flex;align-items:center;gap:11px;background:white;border:1px solid #e2d8f480;border-radius:15px;box-shadow:0 8px 40px #2b165e12;padding:15px 20px;font-size:12px;max-width:430px;animation:toast-in .2s ease}.toast svg{color:var(--purple);width:18px}.toast.error{border-color:#efd1d780}.toast.error svg{color:var(--red)}#toasts{position:fixed;bottom:25px;right:25px;display:grid;gap:10px;z-index:200}.spinner{width:16px;height:16px;border:2px solid #c3b6e480;border-top-color:var(--purple-line);border-radius:50%;animation:spin 1s linear infinite}.initial-loading{height:100vh;display:flex;align-items:center;justify-content:center;gap:15px;color:#a295b5;font-size:12px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes toast-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.loading-box{padding:60px;display:flex;justify-content:center}
/* Public site */
.public-site{background:#fbfaff;min-height:100vh}.public-nav{max-width:1220px;margin:auto;height:92px;padding:0 38px;display:flex;align-items:center;justify-content:space-between}.public-nav .logo{font-size:26px}.public-nav-links{display:flex;align-items:center;gap:30px;font-size:12px;color:#9690a3}.public-nav-links a:hover{color:var(--purple)}.public-nav-actions{display:flex;align-items:center;gap:12px}.public-nav-actions .btn-text{color:#7e738f;padding:10px 13px}.hero{max-width:1220px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:50px;padding:70px 38px 75px;align-items:center}.hero-label{display:inline-flex;align-items:center;gap:7px;border:1px solid #e6dcf780;background:#f6f1ff;color:#a083c4;font-size:10px;padding:7px 11px;border-radius:30px;margin-bottom:24px}.hero-label span{width:5px;height:5px;background:#a18ac8;border-radius:50%}.hero h1{font-size:61px;font-weight:650;letter-spacing:-3px;line-height:1.08;color:#373047}.hero h1 em{font-style:normal;color:var(--purple)}.hero-description{font-size:14px;color:#a095ad;line-height:1.85;margin-top:25px;max-width:405px}.hero-actions{display:flex;gap:13px;margin-top:28px}.hero-actions .btn{font-size:12px;padding:13px 20px}.hero-trust{display:flex;align-items:center;gap:20px;margin-top:25px;font-size:10px;color:#b1a7bd}.hero-trust .flex{gap:6px}.hero-trust svg{width:13px;color:#a791be}.hero-art{position:relative;padding:12px 0 15px}.hero-glow{position:absolute;inset:-40px;background:radial-gradient(ellipse at 50% 50%,#e7d6fc8a,transparent 70%);pointer-events:none}.code-window{background:#292338;border:1px solid #42384e80;box-shadow:0 20px 60px #492a6420;border-radius:21px;position:relative;overflow:hidden;transform:rotate(-2deg)}.code-title{display:flex;align-items:center;justify-content:space-between;padding:16px 19px;border-bottom:1px solid #42374f80;font-size:10px;color:#a392b7}.window-dots{display:flex;gap:5px}.window-dots span{width:6px;height:6px;background:#685678;border-radius:50%}.window-dots span:first-child{background:#b47891}.window-dots span:nth-child(2){background:#b8996c}.window-dots span:nth-child(3){background:#7aab96}.code-tabs{display:flex;gap:22px;padding:15px 23px 0;color:#79698d;font-size:10px}.code-tabs .active{color:#d1b7e9;border-bottom:1px solid #ab87d280;padding-bottom:11px}.code-lines{padding:22px 24px 30px;font:11px/2.1 Consolas,monospace;color:#aa94ba}.code-lines .ln{display:inline-block;width:25px;color:#665775;font-size:9px;user-select:none}.code-lines .kw{color:#b894e0}.code-lines .fn{color:#a2cbbd}.code-lines .txt{color:#cbb392}.code-lines .comment{color:#7c6b89}.code-bottom{padding:12px 20px;background:#322a42;color:#9d85b4;font-size:9px;display:flex;justify-content:space-between}.code-bottom .flex{gap:5px}.code-bottom svg{width:12px;height:12px}.recovered-float{position:absolute;bottom:-8px;right:-18px;background:white;box-shadow:0 8px 30px #47325813;border:1px solid #e8dff280;border-radius:15px;display:flex;align-items:center;gap:12px;padding:14px 19px;transform:rotate(2deg)}.recovered-icon{width:32px;height:32px;border-radius:15px;background:#edf7f1;color:#7db79a;display:flex;align-items:center;justify-content:center}.recovered-icon svg{width:17px}.recovered-float strong{display:block;font-size:11px;color:#72647f}.recovered-float small{font-size:9px;color:#b0a4b9;display:block;margin-top:4px}
/* How we compare. The feature label and our own column are pinned so the
   comparison is always anchored to us; the rival columns scroll under them, one
   at a time, and advance on their own. */
.public-compare{position:relative;padding-bottom:48px}
.public-compare::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:100vw;border-top:1px solid var(--border);pointer-events:none}
.compare-frame{position:relative}
.compare{border-radius:0 0 var(--radius) var(--radius);background:var(--white);border:1px solid var(--border);border-top:0;isolation:isolate}
/* The header row is its own table so it can park with the heading, laid out
   identically to the body so the columns line up exactly. */
.compare-headwrap{margin-top:28px;border:1px solid var(--border);border-bottom:0;border-radius:var(--radius) var(--radius) 0 0;background:#1d1829;overflow:hidden}
.compare-headrow{margin:0}
.compare-headrow thead th{position:static;border-bottom:1px solid var(--border)}
/* Level with the middle of the table itself, so the dot strip at the foot of the
   card does not drag them below centre. */
.compare-step{position:fixed;top:50%;z-index:40;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--border);background:#221a33;color:#c3a8e2;box-shadow:0 6px 18px #0004;opacity:0;visibility:hidden;transform:translateY(-50%) scale(.85);transition:transform .3s ease,background .16s,border-color .16s,color .16s}
.compare-step.showing{visibility:visible;transform:translateY(-50%) scale(1)}
.compare-step:hover{background:#2e2342;border-color:var(--purple-line);color:#e7d7fb}
.compare-step svg{width:17px;height:17px}
.compare-prev svg{transform:rotate(180deg)}
@media(max-width:1340px){.compare-step{display:none}}
.compare-inline-nav{display:none;justify-content:center;align-items:center;gap:10px;width:100%}
.compare-inline-step{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--border);background:#241d33;color:#bda7d6;padding:0}
.compare-inline-step:hover{border-color:var(--purple-line);color:#e7d7fb}
.compare-inline-step svg{width:13px;height:13px}
.compare-inline-step:first-child svg{transform:rotate(180deg)}
@media(max-width:1340px){.compare-inline-nav{display:flex}}
.compare-table{border-collapse:separate;border-spacing:0;width:100%;table-layout:fixed;font-size:11.5px}
/* Table headings elsewhere are painted with a gradient through a transparent
   text fill. These are row labels and domain names, so the fill is restored. */
/* The section heading and the column headers stay with the reader for the length
   of the table, so a row read halfway down still has names attached to it. */
.public-section.public-compare{padding-bottom:77px}
.compare-head{position:sticky;top:0;z-index:30;padding:14px 0 0}
.compare-table thead{background:#1d1829}
.compare-table thead .compare-us{background:#221a33}
.compare-nav{border-radius:0 0 var(--radius) var(--radius)}
.compare-table th{-webkit-text-fill-color:currentColor;background-image:none;-webkit-background-clip:border-box;background-clip:border-box}
.compare-table th,.compare-table td{padding:0 14px;height:40px;text-align:center;vertical-align:middle;white-space:nowrap;border-bottom:1px solid var(--border)}
.compare-table thead th{height:54px;font-size:11.5px;font-weight:600;letter-spacing:-.2px;text-transform:none;color:#a79bb5;background:#1d1829;border-bottom:1px solid var(--border);position:sticky;top:var(--compare-head,132px);z-index:5}
.compare-table tbody tr:last-child th,.compare-table tbody tr:last-child td{border-bottom:0}
/* Pinned: the row label, then our column immediately after it. */
.compare-table .compare-label{white-space:normal;line-height:1.35}
.compare-label{width:250px;text-align:left!important;text-transform:none;letter-spacing:-.1px;font-size:11.5px;font-weight:500;color:#cdc3d8;background:#181420}
.compare-table thead .compare-label{background:#1d1829}
.compare-us{background:#221a33;color:#e4d4f7!important;box-shadow:1px 0 0 var(--border)}
.compare-table tbody td.compare-us{background:#221a33;box-shadow:1px 0 0 var(--border)}
.compare-rival{width:auto}
/* A service is swapped in rather than scrolled to, so the change reads as
   movement without the table ever being wider than its container. */
@keyframes compareInRight{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
@keyframes compareInLeft{from{opacity:0;transform:translateX(-16px)}to{opacity:1;transform:none}}
.compare-in-right{animation:compareInRight .34s cubic-bezier(.22,.61,.36,1) both}
.compare-in-left{animation:compareInLeft .34s cubic-bezier(.22,.61,.36,1) both}
.compare-mark{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;font-size:11px;font-weight:700}
.compare-mark svg{width:14px;height:14px;stroke-width:2.4}
.compare-yes .compare-mark{background:#1e4634;color:#7fd3aa}
td.compare-us .compare-mark{background:#2c5a43;color:#9ae9c2}
.compare-no .compare-mark{background:#4a2129;color:#e8919f}
.compare-maybe .compare-mark{background:#3c3348;color:#b3a6c1}
.compare-price-row th,.compare-price-row td{height:52px;font-size:14px;font-weight:650;color:#cfc3dc}
.compare-price-row td.compare-us{color:#9ae9c2}
.compare-gap td{height:10px;padding:0;background:#1d1829;border-bottom:1px solid var(--border)}
.compare-table [data-tip]{cursor:help}
.compare-nav{display:flex;align-items:center;justify-content:center;height:58px;border-top:1px solid var(--border);background:#1d1829}
.compare-dots{display:flex;align-items:center;gap:10px}
.compare-dot{width:8px;height:8px;padding:0;border-radius:50%;border:0;background:#4b3f5c;transition:background .2s,transform .2s}
.compare-dot:hover{background:#7d68a0}
.compare-dot.active{background:var(--purple);transform:scale(1.35)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* One tooltip serves the whole page. */
.tip{position:fixed;z-index:120;max-width:290px;padding:10px 12px;border:1px solid #44344f80;border-radius:11px;background:#251d37;color:#e2d6f2;font-size:11px;line-height:1.65;box-shadow:0 10px 30px #0006;opacity:0;transform:translateY(4px);transition:opacity .14s,transform .14s;pointer-events:none}
.tip.visible{opacity:1;transform:translateY(0)}
@media(max-width:1000px){.compare-label{width:210px}}
@media(max-width:760px){.compare-label{width:170px;font-size:10.5px;padding:0 10px}
.compare-table{font-size:10.5px}
.compare-table th,.compare-table td{padding:0 8px}}
@media(max-width:560px){.compare-label{width:130px;font-size:10px;padding:0 8px}
.compare-table thead th{font-size:10px}
.compare-price-row th,.compare-price-row td{font-size:12px}}

/* The trial uploader, inline under the three steps, so a file can be tried
   without opening anything first. */
.public-try{margin-top:34px}
.public-try .drop-zone{min-height:0;padding:34px 28px}
.public-try-note{text-align:center;margin-top:16px;line-height:1.7}
.public-try-note svg{width:14px;height:14px;vertical-align:middle;margin-right:5px;position:relative;top:-1px}
@media(max-width:760px){.public-try{margin-top:26px}.public-try .drop-zone{padding:26px 18px}}


/* Live recovery figures, under the trust strip on the landing page. Named apart
   from the workspace dashboard's .stat blocks so the two cannot collide. */
.public-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:26px}
.public-stat{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:22px 22px 20px;display:flex;flex-direction:column}
.public-stat-icon{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:11px;background:var(--lavender);color:var(--purple);margin-bottom:12px}
.public-stat-icon svg{width:17px;height:17px}
.public-stat-value{font-size:31px;font-weight:650;letter-spacing:-1.2px;line-height:1.05}
.public-stat-value sup{font-size:15px;font-weight:500;color:var(--purple);top:-.75em}
.public-stat label{font-size:11px;font-weight:550;letter-spacing:-.2px;margin-top:6px}
.public-stat p{font-size:10.5px;line-height:1.55;color:var(--muted);margin-top:7px}
@media(max-width:1000px){.public-stats-grid{grid-template-columns:1fr 1fr;gap:13px}}
@media(max-width:560px){.public-stats-grid{gap:10px}.public-stat{padding:16px 14px}.public-stat-value{font-size:24px}.public-stat p{font-size:10px}}
.trust-strip{padding:23px 38px;max-width:1144px;margin:auto;border-top:1px solid #eae4f280;border-bottom:1px solid #eae4f280;display:flex;align-items:center;justify-content:space-between;gap:25px}.trust-strip .eyebrow{font-size:8px;letter-spacing:1px;color:#b3a8c0}.trust-strip strong{font-size:15px;color:#a99bb7;font-weight:550;letter-spacing:-.4px}.public-section{max-width:1220px;margin:auto;padding:77px 38px}.section-heading{text-align:center;margin-bottom:38px}.section-heading .eyebrow{color:#a991c1;font-size:9px;letter-spacing:1.7px;margin-bottom:12px}.section-heading h2{font-size:33px;letter-spacing:-1.4px;font-weight:600;color:#51445f}.section-heading p{font-size:12px;color:#b0a2bc;margin-top:12px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.feature-card{padding:28px;background:white;border:1px solid #ebe3f280;border-radius:19.5px}.feature-card .step-number{font-size:10px;color:#bca8cf;float:right}.feature-card .feature-icon{width:39px;height:39px;background:#f3ecfd;color:#a082c4;display:flex;align-items:center;justify-content:center;border-radius:16.5px;margin-bottom:20px}.feature-icon svg{width:19px}.feature-card h3{font-size:14px;color:#796889;margin-bottom:10px}.feature-card p{font-size:11px;color:#b1a2bb;line-height:1.9}.public-pricing{background:#f6f2fc;border-top:1px solid #eee6f680;border-bottom:1px solid #eee6f680}.public-pricing .price-card{background:white;padding:29px}.public-pricing .price-card .btn{width:100%;margin-top:5px}.public-pricing .pricing-grid{max-width:960px;margin:auto}
.public-pricing .pricing-grid-wide{max-width:none;grid-template-columns:repeat(4,1fr)}
@media(max-width:1100px){.public-pricing .pricing-grid-wide{grid-template-columns:repeat(2,1fr);max-width:760px}}.public-plan-note{font-size:11px;color:#ab98bd;text-align:center;margin-top:27px}.public-plan-note a{color:var(--purple)}.public-cta{background:linear-gradient(120deg,#ece2fc,#f4eefc);border:1px solid #e5d8f580;border-radius:24px;padding:38px 45px;display:flex;align-items:center;justify-content:space-between}.public-cta h2{font-size:27px;color:#7c629b;letter-spacing:-1px}.public-cta p{font-size:12px;color:#ae98c2;margin-top:9px}.public-footer{max-width:1144px;margin:auto;padding:30px 0 35px;border-top:1px solid #eae4f280;display:flex;align-items:center;justify-content:space-between;color:#b4a7bf;font-size:10px}.public-footer .logo{font-size:20px;color:#847090}.public-footer .logo-mark{width:25px;height:27px;font-size:22px;border-radius:10.5px}.public-footer .flex{gap:20px}.mobile-nav-btn{display:none}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at top,#ede3ff,transparent 60%),#faf8fd;padding:25px}.login-card{width:420px;background:white;border:1px solid #e9dff580;border-radius:25.5px;padding:35px;box-shadow:0 15px 65px #76508c08}.login-card .logo{justify-content:center;margin-bottom:32px}.login-card h1{text-align:center;font-size:23px}.login-card>p{text-align:center;color:#ac9cbb;font-size:12px;margin-top:10px;margin-bottom:26px}.login-card .btn{width:100%}.login-card input{text-align:center;letter-spacing:2px;font-family:Consolas,monospace;font-size:17px}.login-card .login-bottom{font-size:11px;text-align:center;color:#ab9fb4;margin-top:22px}.login-card .login-bottom a{color:var(--purple)}.public-doc{max-width:1000px;margin:auto;padding:35px 38px 80px}
/* Privacy and terms. Long-form text, so the measure is narrower than a card of
   controls and the lists carry their own marker. */
/* The same panel and row highlight the API page uses, so a long policy reads as
   a list of sections rather than one wall of text. */
.public-doc .legal-doc{max-width:820px}
.legal-doc{--border:#3c334b80;--ink:#eee8f5;--muted:#ac9abb;background:#211d2e;border-color:#44344f80;color:#eee8f5;overflow:hidden}
.legal-section{padding:22px 26px;border-bottom:1px solid var(--border);transition:background .16s,box-shadow .16s}
.legal-section:last-child{border-bottom:0}
.legal-section:hover{background:#342b44;box-shadow:inset 3px 0 #9877cf}
.legal-doc h2{font-size:14px;margin:0 0 10px}
.legal-doc p{font-size:12.5px;line-height:1.85;color:var(--muted);margin-bottom:12px}
.legal-section p:last-child,.legal-section .legal-list:last-child{margin-bottom:0}
.legal-updated{display:flex;align-items:center;gap:7px;font-size:10.5px;color:var(--muted);padding:20px 26px;border-bottom:1px solid var(--border)}
.legal-updated svg{width:14px;height:14px}
.legal-list{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:8px}
.legal-list li{position:relative;padding-left:16px;font-size:12.5px;line-height:1.75;color:var(--muted)}
.legal-list li::before{content:'';position:absolute;left:2px;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--purple)}.public-doc h1{margin-bottom:12px}.public-doc p{font-size:13px;color:#a495b1;line-height:1.9;margin-bottom:20px}.public-doc h2{margin:30px 0 12px;font-size:20px}
@media(min-width:1650px){.main-content{padding-top:40px}.overview-layout{grid-template-columns:minmax(0,1fr) 320px}.drop-zone{min-height:270px}.stat{min-height:150px}.sidebar{width:245px}.workspace{margin-left:245px}.stats-grid{gap:23px}}
@media(max-width:1200px){.overview-layout{grid-template-columns:minmax(0,1fr) 245px;gap:18px}.main-content{padding:26px}.topbar{padding:0 26px}.sidebar{width:205px}.workspace{margin-left:205px}.stat{padding:18px 15px}.stat-icon{right:13px}.stat-label{max-width:85px;font-size:9px}.stat-foot{font-size:8px}.hero h1{font-size:49px}.hero{gap:35px}.hero-trust{gap:12px}.code-lines{font-size:10px}.upload-foot{flex-wrap:wrap}.stats-grid{gap:12px}}
@media(max-width:1000px){.overview-layout{grid-template-columns:1fr}.overview-aside{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}.help-card,.compat-card{margin-top:0}.plan-card{padding:19px}.plan-card p{font-size:10px}.plan-card h2{font-size:16px}.hero{gap:30px;padding-top:50px}.hero h1{font-size:44px}.public-nav-links{gap:20px}.public-nav{padding:0 25px}.public-nav-actions .btn{font-size:10px;padding:9px 12px}.recovered-float{right:-5px}.settings-layout{grid-template-columns:1fr}.docs-grid{grid-template-columns:1fr}.support-layout{grid-template-columns:1fr}.support-aside{display:none}.pricing-grid{gap:13px}.price-card{padding:22px}.top-search{display:none}.admin-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:transform .2s;width:228px;box-shadow:10px 0 30px #21133614}.sidebar.mobile-open{transform:translateX(0)}.workspace{margin-left:0}.mobile-nav-btn{display:inline-flex}.topbar{height:64px;padding:0 18px}.top-right{gap:9px}.main-content{padding:24px 18px}.page-intro h1{font-size:24px}.page-intro .btn{font-size:10px;padding:10px 12px}.overview-aside{grid-template-columns:1fr 1fr}.compat-card{display:none}.stats-grid{gap:10px}.stat{padding:15px 12px;min-height:120px}.stat-icon{width:24px;height:24px;right:12px;top:12px}.stat-icon svg{width:12px;height:12px}.stat-label{font-size:9px;margin-bottom:17px;max-width:70px}.stat-value{font-size:26px}.stat-foot{font-size:8px}.decode-card{padding:20px}.step-pill{display:none}.drop-zone{min-height:220px}.upload-foot{font-size:8px}.pricing-grid{grid-template-columns:1fr}.price-card{padding:25px}.checkout-bar{align-items:flex-start;flex-direction:column}.settings-layout{grid-template-columns:1fr}.details-grid{grid-template-columns:1fr 1fr}.workspace-footer{gap:15px;flex-wrap:wrap;font-size:8px}.hero{grid-template-columns:1fr;padding:35px 24px 65px;gap:45px}.hero h1{font-size:48px;max-width:450px}.hero-description{font-size:13px}.hero-art{max-width:500px;width:100%;margin:auto}.public-nav{height:78px;padding:0 24px}.public-nav-links{display:none}.public-nav-actions .btn-text{padding:8px 5px}.public-nav .logo{font-size:23px}.public-nav .logo-mark{width:29px;height:31px;font-size:25px}.public-nav-actions .btn-primary{font-size:10px;padding:10px 12px}.trust-strip{padding:22px 25px;flex-wrap:wrap;justify-content:center;gap:18px}.trust-strip .eyebrow{width:100%;text-align:center}.trust-strip strong{font-size:12px}.public-section{padding:50px 24px}.section-heading h2{font-size:27px}.feature-grid{grid-template-columns:1fr}.feature-card{padding:25px}.public-pricing .pricing-grid{max-width:420px;gap:25px}.public-cta{padding:28px;flex-direction:column;align-items:flex-start;gap:23px}.public-cta h2{font-size:25px}.public-footer{padding:24px;margin:0 24px;flex-wrap:wrap;gap:20px}.public-footer .flex{gap:15px}.public-footer .footer-copyright{width:100%;font-size:9px}.modal-overlay{padding:15px}.modal-header{padding:20px}.modal-content{padding:20px}.account-code{font-size:22px;letter-spacing:2px}.table-toolbar{padding:13px;flex-wrap:wrap}.filter-select{max-width:180px}.table-wrap td,.table-wrap th{padding-left:16px;padding-right:16px}.public-doc{padding:25px}.thread{padding:15px}.message{max-width:95%}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.top-search{background:transparent;cursor:pointer}.search-result{width:100%;display:flex;align-items:center;gap:12px;padding:13px 12px;border-bottom:1px solid var(--border);background:transparent;color:var(--ink);text-align:left;border-radius:12px}.search-result:hover{background:#eee8f9}.search-result-name{flex:1;min-width:0}.search-result-name strong{display:block;font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-result-name small{display:block;color:var(--muted);font-size:10px;margin-top:5px}
@media(max-width:1000px){.top-search{display:flex;font-size:0;padding-right:12px}.top-search .shortcut{display:none}.top-search svg{width:17px;height:17px}}

/* Quiet scrollbars for dialogs and their nested code panels. */
.modal,.modal .source-viewer,.modal .code-example,.modal .table-wrap{scrollbar-width:thin;scrollbar-color:#756781 #211d2e;scrollbar-gutter:stable}
.modal::-webkit-scrollbar,.modal *::-webkit-scrollbar{width:6px;height:6px}
.modal::-webkit-scrollbar-track,.modal *::-webkit-scrollbar-track{background:#211d2e;border-radius:18px}
.modal::-webkit-scrollbar-thumb,.modal *::-webkit-scrollbar-thumb{background:#756781;border-radius:18px;border:1px solid transparent;background-clip:padding-box}
.modal::-webkit-scrollbar-thumb:hover,.modal *::-webkit-scrollbar-thumb:hover{background:#5f506d}
.modal .source-viewer{scrollbar-color:#62516f #201e30}
.modal .source-viewer::-webkit-scrollbar-track{background:#201e30}
.modal .source-viewer::-webkit-scrollbar-thumb{background:#62516f}
.modal .source-viewer::-webkit-scrollbar-thumb:hover{background:#79668a}

#global-search-results{background:#f7f5fc;border:1px solid #eee9f580;border-radius:15px;padding:6px}.search-result:last-child{border-bottom:0}

.search-modal{background:#211d2e;color:#eee8f5;border:1px solid #3c334b80;scrollbar-color:#645470 #211d2e}
.search-modal .modal-header{border-color:#3c334b80}
.search-modal .icon-btn{color:#a99abb}
.search-modal .icon-btn:hover{background:#393047;color:#e1d5ef}
.search-modal .search-input input{background:#171421;border-color:#44384f80;color:#eee6f7}
.search-modal .search-input input::placeholder{color:#9c8cab}
.search-modal .search-input input:focus{border-color:#9877cf80;box-shadow:0 0 0 3px #9877cf18}
.search-modal .search-input svg{color:#a58bbf}
.search-modal #global-search-results{background:#191624;border-color:#3c334b80;max-height:55vh;overflow:auto;scrollbar-width:thin;scrollbar-color:#645470 #191624}
.search-modal .search-result{color:#eee6f7;border-color:#332b4080;background:transparent}
.search-modal .search-result:hover{background:#342b44}
.search-modal .search-result-name small,.search-modal .empty p{color:#ac9abb}
.search-modal .file-symbol,.search-modal .empty-icon{background:#342943;color:#bda0e5}
.search-modal .search-result>svg{color:#a690ba}
.search-modal .badge{background:#3a2c4d;color:#c0a0e7}
.search-modal .badge.succeeded{background:#20392f;color:#85c7a6}
.search-modal .badge.manual_review,.search-modal .badge.awaiting_inputs{background:#403424;color:#dec08c}
.search-modal .badge.failed{background:#422730;color:#e8a0af}
.search-modal .empty h3{color:#e3d8ed}

.modal::-webkit-scrollbar-corner,.modal *::-webkit-scrollbar-corner{background:#211d2e}.search-modal #global-search-results::-webkit-scrollbar-track,.search-modal #global-search-results::-webkit-scrollbar-corner{background:#191624}

/* Tables share the search dialog's charcoal surfaces and violet accents. */
.card:has(.table-wrap),.card:has(#files-table){--border:#3c334b80;--ink:#eee8f5;--muted:#ac9abb;background:#211d2e;border-color:#3c334b80;color:#eee8f5}
.table-wrap{--border:#3c334b80;--ink:#eee8f5;--muted:#ac9abb;background:#191624;color:#eee8f5;scrollbar-width:thin;scrollbar-color:#645470 #191624}
.table-wrap table{background:#191624;color:#eee8f5}
.table-wrap thead{background:#292137}
.table-wrap th{color:#bda0e5;border-color:#44364f80}
.table-wrap td{border-color:#332b4080}
.table-wrap tbody tr{transition:background .15s,box-shadow .15s}
.table-wrap tbody tr:hover{background:#342b44;box-shadow:inset 3px 0 #9877cf}
.table-wrap .muted{color:#ac9abb}
.table-wrap .file-symbol,.table-wrap .avatar{background:#342943;color:#bda0e5}
.table-wrap .tag{background:#30243e;border-color:#4a365d80;color:#c0a0e7}
.table-wrap .icon-btn{color:#ae93c7}
.table-wrap .icon-btn:hover{background:#443254;color:#dfc8fa}
.table-wrap .badge{background:#3a2c4d;color:#c0a0e7}
.table-wrap .badge.succeeded,.table-wrap .badge.paid,.table-wrap .badge.open{background:#20392f;color:#85c7a6}
.table-wrap .badge.awaiting_inputs,.table-wrap .badge.pending,.table-wrap .badge.manual_review{background:#403424;color:#dec08c}
.table-wrap .badge.failed,.table-wrap .badge.rejected,.table-wrap .badge.refunded{background:#422730;color:#e8a0af}
.table-wrap .btn-soft{background:#3a2c4d;color:#d0aff7}
.table-wrap .btn-soft:hover{background:#4a365f}
.table-wrap .btn-secondary{background:#282132;border-color:#4b3b5b80;color:#c9b6da}
.table-wrap .btn-secondary:hover{background:#3a2c4d;border-color:#80609880}
.card:has(#files-table) .table-toolbar{background:#211d2e;border-color:#3c334b80}
.card:has(#files-table) .table-toolbar input,.card:has(#files-table) .filter-select{background:#171421;border-color:#44384f80;color:#eee6f7}
.card:has(#files-table) .table-toolbar input::placeholder{color:#9c8cab}
.card:has(#files-table) .table-toolbar input:focus,.card:has(#files-table) .filter-select:focus{border-color:#9877cf80;box-shadow:0 0 0 3px #9877cf18}
.card:has(.table-wrap) .card-header>.tag{background:#30243e;border-color:#4a365d80;color:#c0a0e7}
.card:has(.table-wrap) .card-header .btn-text{color:#bd9ae9}
.card:has(#files-table) .empty-icon{background:#342943;color:#bda0e5}
.table-wrap::-webkit-scrollbar{width:6px;height:6px}
.table-wrap::-webkit-scrollbar-track,.table-wrap::-webkit-scrollbar-corner{background:#191624}
.table-wrap::-webkit-scrollbar-thumb{background:#645470;border-radius:18px}

/* Ambient light and slow RGB accents, anchored to the existing violet palette. */
.ambient-particles{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
#app{position:relative;z-index:1}
.public-site{background:transparent}
body:has(.public-site){background:#fbfaff}
.btn-primary{position:relative;isolation:isolate;background:linear-gradient(to right,#4c6ef5,#e64980,#4c6ef5);background-size:200% 100%;animation:rgb-flow 4s ease infinite;box-shadow:0 3px 12px #7453e82b;transition:box-shadow .25s,transform .2s}
.btn-primary::before{content:none}
.btn-primary:hover{background:linear-gradient(to right,#4c6ef5,#e64980,#4c6ef5);background-size:200% 100%;box-shadow:0 0 18px #a778e565,0 5px 20px #7453e835;transform:translateY(-1px)}
.btn-primary:active{transform:translateY(1px)}
.btn-primary[data-action='trial-start'],.btn-primary[data-action='new-decode'],.btn-primary[data-action='browse-files'],.btn-primary[data-action='browse-trial']{animation:rgb-flow 4s ease infinite,action-breathe 4s ease-in-out infinite}
.btn-primary:disabled,.btn-primary:disabled::before{animation:none}
.btn:focus-visible{outline:2px solid #b794e8;outline-offset:4px;box-shadow:0 0 17px #a778e540}
.card:has(.table-wrap),.card:has(#files-table),.search-modal{position:relative;isolation:isolate;border-color:#77539338;box-shadow:0 0 0 1px #ad7de412,0 0 26px #9563da16,0 8px 24px #21153812;transition:box-shadow .3s,border-color .3s}
.card:has(.table-wrap)::before,.card:has(#files-table)::before,.search-modal::before{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:radial-gradient(240px circle at var(--glow-x,50%) var(--glow-y,0%),#c797ffb3,#9268c42e 55%,transparent 80%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:2;opacity:.65;transition:opacity .3s}
.card:has(.table-wrap):hover,.card:has(#files-table):hover,.search-modal:hover{border-color:#9670be44;box-shadow:0 0 0 1px #ad7de41c,0 0 32px #9563da30,0 10px 28px #21153816}
.card:has(.table-wrap):hover::before,.card:has(#files-table):hover::before,.search-modal:hover::before{opacity:1}
.table-wrap tbody tr:hover .file-symbol{box-shadow:0 0 13px #b68ae525;transition:box-shadow .2s}
.hero-glow{animation:ambient-breathe 8s ease-in-out infinite}
.code-window{box-shadow:0 0 35px #a275df1a,0 20px 60px #492a6420}
.hero-label span,.intro-kicker>span{box-shadow:0 0 8px currentColor}
@keyframes rgb-flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes action-breathe{0%,100%{box-shadow:0 0 0 0 #a78be400,0 3px 14px #7453e825}50%{box-shadow:0 0 0 5px #a78be414,0 0 24px #956be54d}}
@keyframes ambient-breathe{0%,100%{opacity:.7;transform:scale(.98)}50%{opacity:1;transform:scale(1.04)}}
@media(prefers-reduced-motion:reduce){.ambient-particles{display:none}.btn-primary,.btn-primary::before,.hero-glow{animation:none!important}.btn-primary:hover{transform:none}.card::before,.search-modal::before{background:linear-gradient(130deg,#a17ac066,transparent 60%)}*::before,*::after{animation:none!important;transition:none!important}}

/* Small rising sparks, matching the reference's size, colour and cadence. */
.ambient-particles{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:2}
.ambient-particle{position:absolute;top:0;border-radius:50%;pointer-events:none;animation:particle-rise var(--duration) linear infinite;animation-delay:var(--delay);will-change:transform,opacity}
@keyframes particle-rise{0%{transform:translateY(105vh) scale(0);opacity:0}10%,90%{opacity:var(--spark-opacity)}100%{transform:translateY(-10vh) scale(1);opacity:0}}
.ambient-particles.paused .ambient-particle{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.ambient-particles{display:none}.ambient-particle{animation:none!important}}

/* Animated button fills and a GPU-rendered backdrop. */
body,body:has(.public-site){background:linear-gradient(120deg,#e5dcf5,#f5dfea,#dceafa)}
.gpu-background{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;image-rendering:auto}
.public-site,.workspace{background:transparent}
.sidebar,.topbar{background:#ffffffb8}
.card:has(.table-wrap),.card:has(#files-table),.search-modal{box-shadow:0 8px 30px #291a4924}
.card:has(.table-wrap)::before,.card:has(#files-table)::before,.search-modal::before{content:none}
.card:has(.table-wrap):hover,.card:has(#files-table):hover,.search-modal:hover{box-shadow:0 0 34px #9563da40,0 12px 30px #21153825}
.table-wrap tbody tr:hover{box-shadow:none;background:#342b44}
.btn:not(.btn-text):not(.btn-danger){position:relative;isolation:isolate;overflow:hidden;background:#6457de!important;color:#fff!important;animation:none!important;box-shadow:0 4px 15px #6847c535;text-shadow:0 1px 2px #24134470}
.btn:not(.btn-text):not(.btn-danger)::before{content:'';position:absolute;inset:0 auto 0 -24px;width:calc(300% + 96px);padding:0;border-radius:0;background:linear-gradient(90deg,#435ce5 0%,#a345d4 12.5%,#dc347d 25%,#297bbe 37.5%,#435ce5 50%,#a345d4 62.5%,#dc347d 75%,#297bbe 87.5%,#435ce5 100%);mask:none;-webkit-mask:none;opacity:1;z-index:-1;pointer-events:none;animation:button-colours 8s linear infinite;will-change:transform}
.btn:not(.btn-text):not(.btn-danger):hover{box-shadow:0 0 25px #ae5ed580,0 5px 18px #536ee64a;transform:translateY(-1px)}
.btn:not(.btn-text):not(.btn-danger):disabled::before{animation-play-state:paused}
@keyframes button-colours{from{transform:translateX(0) skewX(-18deg)}to{transform:translateX(-50%) skewX(-18deg)}}
@media(prefers-reduced-motion:reduce){.btn:not(.btn-text):not(.btn-danger)::before{animation:none!important;will-change:auto}.btn:not(.btn-text):not(.btn-danger):hover{transform:none}}

/* Gradient headings stay readable on both light and charcoal surfaces. */
@supports (background-clip:text){
  h1,h2,h3,th{background-image:linear-gradient(100deg,#5133af,#af285f 55%,#23669e);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
  .table-wrap th,.card:has(.table-wrap) h2,.card:has(.table-wrap) h3,.card:has(#files-table) h2,.card:has(#files-table) h3,.search-modal h2{background-image:linear-gradient(100deg,#c3a2ff,#f5a0cc 55%,#8bd7f3)}
}
@media(forced-colors:active){h1,h2,h3,th{background:none;color:CanvasText;-webkit-text-fill-color:CanvasText}}

/* Charcoal theme throughout; ambient colour stays behind the content. */
:root{color-scheme:dark;--bg:#090810;--white:#1b1627;--ink:#eee9f6;--muted:#afa4bd;--purple:#b69af4;--purple-line:#b69af480;--purple-dark:#9b78e8;--lavender:#1b1627;--border:#30263e80;--green:#85c7a6;--orange:#dec08c;--red:#e8a0af;--shadow:0 8px 28px #0003}
body,body:has(.public-site){background:linear-gradient(120deg,#090810,#160d22,#0b1423)}
.sidebar,.topbar{background:#120f1bea}
.modal,.toast,.login-card,.feature-card,.public-pricing .price-card,.recovered-float{background:#1b1627;color:var(--ink)}
.public-pricing{background:#100c1899}
.public-cta,.plan-card{background:linear-gradient(120deg,#22182f,#181422)}
.login-page{background:transparent}
input,textarea,select{background:#110e1b;color:var(--ink)}
label,.recovered-float strong{color:#d6cbe5}
input::placeholder,textarea::placeholder{color:#9386a5}
.drop-zone,.detail-item,.notification,.message,.quantity-control,.sidebar-promo{background:var(--white)}
.drop-zone:hover,.drop-zone.dragging,.message.staff{background:#281b3b}
.message.private,.requirement,.coming-panel,.admin-switch{background:#2c241b;color:#dec08c}
.upload-symbol{background:#2c2040;box-shadow:none}
.hero-label,.account-code,.info-banner,.code-example,.step-pill{background:#251a36;color:#c4acdf}
.hero-glow{background:radial-gradient(ellipse,#66369924,transparent 70%)}
.nav-item:hover,.nav-item.active,.quantity-control button,.tag,.file-symbol,.avatar,.stat-icon,.help-icon,.plan-icon,.price-card .price-icon,.feature-card .feature-icon,.empty-icon{background:#30213f;color:#c4a5e9}
.badge{background:#342440;color:#d1b6ee}
.badge.succeeded,.badge.paid,.badge.open,.recovered-icon,.stat-icon.green{background:#20392f;color:#85c7a6}
.badge.awaiting_inputs,.badge.pending,.badge.manual_review{background:#403424;color:#dec08c}
.badge.failed,.badge.rejected,.badge.refunded,.btn-danger{background:#422730;color:#e8a0af}
.badge.queued,.badge.running,.badge.inspecting,.badge.validating,.stat-icon.blue{background:#292747;color:#b8b4f4}
.clickable:hover{background:#2b2039}
@supports(background-clip:text){h1,h2,h3,th{background-image:linear-gradient(100deg,#c3a2ff,#f0a0cd 55%,#8bc9ef)}}

/* Subtle outlines separate dark surfaces without overpowering their glows. */
.card,.feature-card,.login-card,.modal,.toast,.public-cta,.recovered-float{border:1px solid var(--border)}
.card:has(.table-wrap),.card:has(#files-table),.search-modal{border-color:#44344f80}
.card:has(.table-wrap),.card:has(#files-table){overflow:hidden}
.card>.table-toolbar:first-child,.card>.card-header:first-child,.card>.table-wrap:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}
.card:has(.table-wrap):hover,.card:has(#files-table):hover,.search-modal:hover{border-color:#70508480}
input,textarea,select,.tag,.sidebar-promo,.step-pill,.quantity-control,.quantity-control button,.detail-item,.code-example,.info-banner,.message,.account-code,.hero-label,.public-pricing{border-color:var(--border)}
.drop-zone{border-color:#59416e80}
.requirement,.coming-panel,.admin-switch{border-color:#59472c80}

/* Brand colours match the buttons and gradient headings. */
.logo-mark{background:linear-gradient(120deg,#435ce5,#a345d4 48%,#dc347d);color:#fff;box-shadow:0 4px 16px #9450d52b}
@supports(background-clip:text){.logo>span:not(.logo-mark){background-image:linear-gradient(100deg,#c3a2ff,#f0a0cd 55%,#8bc9ef);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}.logo-dot{color:inherit}}
@media(forced-colors:active){.logo>span:not(.logo-mark){background:none;color:CanvasText;-webkit-text-fill-color:CanvasText}}

/* Select2 shares the charcoal inputs, violet accents and slim scrollbars. */
.select2-container{font:inherit;min-width:0;max-width:100%}
.select2-container--default .select2-selection--single,.select2-container--default .select2-selection--multiple{background:#110e1b;border:1px solid #44344f80;border-radius:12px;min-height:42px;transition:box-shadow .2s,border-color .2s}
.select2-container--default .select2-selection--single .select2-selection__rendered{color:#eee6f7;line-height:40px;padding:0 34px 0 13px;font-size:12px}
.select2-container--default .select2-selection--single .select2-selection__arrow{height:40px;right:10px}
.select2-container--default .select2-selection--single .select2-selection__arrow b{border-color:#bda0e580 transparent transparent transparent}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent #bda0e580 transparent}
.select2-container--default.select2-container--focus .select2-selection,.select2-container--open .select2-selection,.select2-selection:focus-visible{border-color:#9877cf80;box-shadow:0 0 0 3px #9877cf20;outline:none}
.select2-dropdown{background:#191624;color:#eee6f7;border:1px solid #59416e80;border-radius:12px;overflow:hidden;box-shadow:0 12px 32px #0006,0 0 20px #9563da20;z-index:110}
.select2-results__option{padding:11px 13px;font-size:12px;line-height:1.4}
.select2-container--default .select2-results__option[aria-selected=true]{background:#30243e;color:#d9b8fa}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:#443057;color:#fff}
.select2-container--default .select2-results__option[aria-disabled=true]{color:#7e728b}
.select2-container--default .select2-search--dropdown .select2-search__field{background:#110e1b;border:1px solid #44344f80;color:#eee6f7;border-radius:9px;padding:9px;font-size:12px}
.select2-search--dropdown{padding:8px}
.select2-container--default .select2-results>.select2-results__options{max-height:240px;scrollbar-width:thin;scrollbar-color:#756781 #191624}
.select2-results__options::-webkit-scrollbar{width:6px}
.select2-results__options::-webkit-scrollbar-track{background:#191624}
.select2-results__options::-webkit-scrollbar-thumb{background:#756781;border-radius:18px}
.select2-container--default.select2-container--disabled .select2-selection--single{background:#211a2b;opacity:.6;cursor:not-allowed}
.select2-container--default .select2-selection--multiple .select2-selection__choice{background:#3a2c4d;border-color:#59416e80;color:#d9b8fa}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{color:#c4a5e9}
.select2-container--default .select2-selection__placeholder{color:#9386a5}
@media(max-width:760px){.table-toolbar>.select2-container{max-width:180px}}

/* Toolbar controls align with the adjacent search input. */
.table-toolbar .select2-container--default .select2-selection--single{height:36px;min-height:36px;background:#171421;border-color:#44384f80}
.table-toolbar .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:34px}
.table-toolbar .select2-container--default .select2-selection--single .select2-selection__arrow{height:34px}

/* Animated RGB fills meet the button edge directly. */
.btn:not(.btn-text):not(.btn-danger){border:0}

.compat-php-targets{display:flex;flex-wrap:wrap;gap:7px;min-width:230px}

.badge.partial,.table-wrap .badge.partial{background:#403424;color:#dec08c}

.workspace-avatar{cursor:pointer;border:1px solid #59416e80;transition:box-shadow .2s,background .2s}.workspace-avatar:hover{background:#443057;box-shadow:0 0 15px #9563da50}.workspace-avatar:focus-visible{outline:2px solid #b794e8;outline-offset:3px}[data-code-panel] .account-code{overflow-wrap:anywhere}

/* Trial previews contain only the permitted source; document height is blank space. */
.trial-source-frame{position:relative;overflow:hidden;border:1px solid var(--border);border-radius:20.25px;background:#201e30}
.trial-source-scroll{overflow:auto;scrollbar-width:thin;scrollbar-color:#756781 #191522;scrollbar-gutter:stable;position:relative}
.trial-source-scroll::-webkit-scrollbar{width:6px;height:6px}
.trial-source-scroll::-webkit-scrollbar-track{background:#191522}
.trial-source-scroll::-webkit-scrollbar-thumb{background:#756781;border-radius:9px}
.trial-source-scroll:focus-visible{outline:2px solid #b794e8;outline-offset:-2px}
.trial-source-document{box-sizing:border-box;min-width:100%;width:max-content;padding:24px}
.trial-source-text{margin:0;padding:0;color:#d5cde5;font:12px/22px Consolas,monospace;white-space:pre;tab-size:4}
.trial-source-shade{position:absolute;inset:0 8px 0 0;background:#14111b;opacity:0;pointer-events:none}
.trial-source-lock{position:absolute;inset:0 8px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;color:#d7c4ee;opacity:0;pointer-events:none;text-align:center;padding:12px}
.trial-source-lock svg{width:28px;height:28px;color:#b994e6;filter:drop-shadow(0 0 12px #9563da70)}
.trial-source-lock strong{font-size:13px}.trial-source-lock span{font-size:11px;color:#a59bb2}

.decode-progress{padding:28px 20px;text-align:center;border:1px solid var(--border);border-radius:20.25px;background:linear-gradient(135deg,#211a30,#171421)}
.decode-progress h3{font-size:15px;margin:16px 0 8px}.decode-progress p{font-size:11px;line-height:1.8;color:#a59bb2;margin:0}
.decode-animation,.decode-queue-icon{position:relative;width:64px;height:64px;margin:0 auto;display:flex;align-items:center;justify-content:center;color:#c4a4ef}
.decode-animation>svg,.decode-queue-icon>svg{width:25px;height:25px;filter:drop-shadow(0 0 10px #9563da80)}
.decode-animation>span{position:absolute;inset:0;border:2px solid transparent;border-top-color:#ad7df080;border-right-color:#6d9ae880;border-radius:50%;animation:decode-orbit 2.2s linear infinite}
.decode-animation>span:nth-of-type(2){inset:7px;border-top-color:#ed82c180;border-right-color:transparent;animation-duration:3.4s;animation-direction:reverse}
.decode-animation>span:nth-of-type(3){inset:-5px;border:0;background:#a778e8;box-shadow:0 0 12px #a778e8;width:4px;height:4px;margin:auto;transform-origin:2px 35px;top:-66px;animation:decode-orbit 2.2s linear infinite}
.decode-progress-track{overflow:hidden;height:3px;max-width:220px;margin:20px auto 0;border-radius:6px;background:#352740}
.decode-progress-track>span{display:block;height:100%;width:40%;border-radius:6px;background:linear-gradient(90deg,#7d9dec,#b47eee,#ef85c0);animation:decode-scan 1.8s ease-in-out infinite}
@keyframes decode-orbit{to{transform:rotate(360deg)}}@keyframes decode-scan{from{transform:translateX(-110%)}to{transform:translateX(360%)}}
@media(prefers-reduced-motion:reduce){.decode-animation>span,.decode-progress-track>span{animation:none}.decode-animation>span:nth-of-type(3){display:none}}

/* On a plan the pill carries the countdown and, after it, the credit balance the
   plan does not cover. */
.header-credits>span.header-extra{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:22px;padding:0 7px;border-radius:9px;background:#ffffff14;font-size:10px;font-weight:600;letter-spacing:-.2px;color:#cdbbe3}
.header-credits{display:flex;align-items:center;gap:11px;min-height:46px;padding:8px 14px;border:1px solid #72539480;border-radius:18px;background:linear-gradient(120deg,#39254b,#251d37);color:#dcc9f3;box-shadow:0 0 18px #9563da14;transition:box-shadow .2s,border-color .2s;flex-shrink:0}
.header-credits:hover{border-color:#b184da80;box-shadow:0 0 22px #9563da40}
.header-credits:focus-visible{outline:2px solid #b794e8;outline-offset:3px}
.header-credits>svg{width:19px;height:19px;color:#be97ed}.header-credits>svg:last-child{width:14px;height:14px;margin-left:4px}
.header-credits>span{display:flex;align-items:baseline;gap:7px}.header-credits strong{font-size:21px;font-weight:700;line-height:1.2;background:linear-gradient(100deg,#a8beff,#d3a4f1,#efa7d0);color:transparent;background-clip:text;-webkit-background-clip:text}.header-credits>span>span{font-size:11px;font-weight:600;color:#c1aed7}
@media(max-width:760px){.header-credits{padding:7px 10px;gap:7px;min-height:40px;border-radius:15px}.header-credits strong{font-size:18px}.header-credits>svg:last-child{display:none}.header-credits>span{gap:5px}.header-credits>span>span{font-size:10px}}
@media(max-width:420px){.top-right{gap:6px}.header-credits>svg:first-child{display:none}.header-credits{padding:7px 8px}}
@media(max-width:760px){.topbar>.flex{min-width:0;gap:8px;flex:1}.topbar .breadcrumb{min-width:0}.topbar .breadcrumb>span,.topbar .breadcrumb>svg{display:none}.topbar .breadcrumb strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar .top-right{flex-shrink:0}}

/* A spend is confirmed against the balance either side of it: what the
   workspace holds now, and what it will hold after. The numbers are large
   because they are the whole decision. */
.spend-ledger{display:flex;align-items:stretch;gap:14px;margin-top:20px}
.spend-box{flex:1;min-width:0;padding:18px 14px;border:1px solid var(--border);border-radius:16px;background:#171421;text-align:center}
.spend-box label{display:block;font-size:9.5px;letter-spacing:.4px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.spend-box strong{font-size:29px;font-weight:700;letter-spacing:-1.1px;line-height:1.1;background:linear-gradient(100deg,#a8beff,#d3a4f1,#efa7d0);color:transparent;background-clip:text;-webkit-background-clip:text}
.spend-arrow{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--muted);flex-shrink:0}
.spend-arrow svg{width:22px;height:22px;color:var(--purple)}
.spend-arrow small{font-size:9.5px;white-space:nowrap}
.spend-short .spend-box:last-child{border-color:#a8616f80;background:#221520}
.spend-short .spend-box:last-child strong{background:none;color:#e8a0af;-webkit-text-fill-color:#e8a0af}
.spend-warning{border-color:#a8616f80}
@media(max-width:560px){.spend-ledger{gap:10px}.spend-box{padding:14px 10px}.spend-box strong{font-size:23px}}
.unlock-confirm-icon{display:flex;align-items:center;justify-content:center;width:64px;height:64px;margin:0 auto 20px;border:1px solid #72539480;border-radius:24px;background:linear-gradient(135deg,#402950,#251d37);box-shadow:0 0 25px #9563da20;color:#ccacf3}.unlock-confirm-icon svg{width:28px;height:28px;filter:drop-shadow(0 0 9px #9563da60)}

.file-access{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:10px;font-weight:600;padding:6px 9px;border:1px solid transparent;border-radius:10.5px}.file-access svg{width:13px;height:13px}.file-access.locked{color:#d2acf5;background:#382345;border-color:#68437e80}.file-access.unlocked{color:#91d7b5;background:#183329;border-color:#315c4780}.file-access.unavailable{color:#a59bb2;background:#241e30;border-color:#3a304880;font-weight:400}

.file-table th.file-column-centered,.file-table td.file-column-centered{text-align:center;vertical-align:middle}

.upload-group{border-top:1px solid var(--border);background:#171421}.upload-group>summary{display:flex;align-items:center;gap:13px;padding:18px 22px;cursor:pointer;list-style:none;transition:background .2s}.upload-group>summary::-webkit-details-marker{display:none}.upload-group>summary:hover{background:#231a30}.upload-group-symbol{display:flex;color:#b28ad8}.upload-group-symbol svg{width:22px;height:22px}.upload-group-info{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}.upload-group-info strong{font-size:12px;color:#d9c9eb;overflow-wrap:anywhere}.upload-group-info>span{font-size:10px;color:#a59bb2}.upload-group-count{font-size:10px;color:#c3a0e5;white-space:nowrap}.upload-group>summary>svg{width:16px;height:16px;color:#9e80bd;transition:transform .2s}.upload-group[open]>summary>svg{transform:rotate(90deg)}.upload-group-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 22px 18px}.upload-group-actions .field-note{margin:0;max-width:370px}.upload-group-actions>.flex{flex-wrap:wrap;justify-content:flex-end}.upload-group .table-wrap{border-top:1px solid var(--border)}.file-access.free{color:#8dc8f0;background:#192d40;border-color:#34587580}.partial-free-notice{border-color:#4a6a8480;background:#1b2b3b;color:#bdcee0}.partial-manual-action{margin:14px 0 18px}
@media(max-width:760px){.upload-group>summary{padding:16px 14px;gap:9px}.upload-group-count{font-size:9px;white-space:normal;max-width:80px;text-align:right}.upload-group-actions{padding:0 14px 16px;align-items:flex-start;flex-direction:column}.upload-group-actions>.flex{justify-content:flex-start}.upload-group-actions .btn{font-size:10px}}

/* Keep page scroll fixed while dialogs are open and contain scrolling to the dialog. */
html.modal-open,body.modal-open{overflow:hidden;overscroll-behavior:none}
.modal-overlay{overscroll-behavior:contain}
.modal{max-height:90dvh;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}

.badge.partial{background:#42212c;color:#f0a4b7;border-color:#78405280}

/* Protection summary boxes in the decoded-file view: one box per protection,
   dimmed when the file does not carry it. */
.protection-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}
.protection-box{position:relative;padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--white);display:flex;flex-direction:column;gap:6px}
.protection-box .protection-icon{display:inline-flex;width:28px;height:28px;align-items:center;justify-content:center;border-radius:10px;background:#241d33;color:#8d81a0;margin-bottom:2px}
.protection-box .protection-icon svg{width:14px;height:14px}
.protection-box label{font-size:9px;letter-spacing:.3px;text-transform:uppercase;color:#8e82a0;margin:0}
.protection-box strong{font-size:13px;font-weight:600;color:#a59bb2;overflow-wrap:anywhere}
.protection-box p{font-size:9px;line-height:1.6;color:#7d7390;margin:0}
.protection-box.on{border-color:#6a4b9280;background:linear-gradient(140deg,#241a35,#1b1527)}
.protection-box.on .protection-icon{background:#3a2a52;color:#c3a0e5}
.protection-box.on strong{color:#dcccee}
.protection-box.on p{color:#a494bb}
.protection-box.off{opacity:.72}
@media(max-width:760px){.protection-grid{grid-template-columns:1fr 1fr}}

/* A partial recovery a workspace holds no credits for stays visible but locked. */
.file-access.locked-partial{color:#e0b57f;background:#332514;border-color:#6d533080}
.partial-locked-notice{border-color:#6d533080;background:#2a1f12;color:#dcc4a2}

/* Compatibility overview: one card per protection system. */
.compat-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.compat-summary-item{padding:20px;border:1px solid var(--border);border-radius:15px;background:var(--white);display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.compat-summary-item .protection-icon{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:13px;background:#3a2a52;color:#c3a0e5}
.compat-summary-item .protection-icon svg{width:16px;height:16px}
.compat-summary-item h3{font-size:13px;color:#dcccee}
.compat-summary-item p{font-size:10px;color:#a59bb2}
/* Three protection systems read as a set, so they stay three across on a phone
   and shed their padding instead of stacking. */
@media(max-width:760px){.compat-summary{grid-template-columns:repeat(3,1fr);gap:10px}
/* A grid item will not shrink below its longest word by default, which makes
   the SourceGuardian column wider than the other two. The tracks are held equal
   and the long name and its PHP range wrap instead of widening the card. */
.compat-summary-item{padding:14px 11px;gap:6px;border-radius:13px;min-width:0;overflow-wrap:anywhere}
.compat-summary-item .tag{white-space:normal;overflow-wrap:anywhere;text-align:center}
.compat-summary-item h3{font-size:11px}
.compat-summary-item p{font-size:9px;line-height:1.5}
.compat-summary-item .protection-icon{width:28px;height:28px;border-radius:10px}
.compat-summary-item .protection-icon svg{width:14px;height:14px}}

/* One modal carries a ZIP from its first scan to its recovered files. */
.batch-stages{display:flex;gap:10px;list-style:none;padding:0;margin:0 0 20px}
.batch-stage{flex:1;display:flex;align-items:center;gap:9px;padding:11px 12px;border:1px solid var(--border);border-radius:12px;background:var(--white);min-width:0}
.batch-stage-dot{flex:none;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;background:#241d33;color:#8e82a0}
.batch-stage-dot svg{width:12px;height:12px}
.batch-stage strong{display:block;font-size:11px;color:#a59bb2}
.batch-stage small{display:block;font-size:9px;color:#7d7390;line-height:1.5;margin-top:2px}
.batch-stage.active{border-color:#6a4b9280;background:linear-gradient(140deg,#241a35,#1b1527)}
.batch-stage.active .batch-stage-dot{background:var(--purple);color:#fff}
.batch-stage.active strong{color:#dcccee}
.batch-stage.done .batch-stage-dot{background:#1d3a2c;color:#8fd3af}
.batch-stage.done strong{color:#96a08f}
@media(max-width:760px){.batch-stages{flex-wrap:wrap}.batch-stage{flex:1 1 45%}.batch-stage small{display:none}}

.batch-progress{margin-bottom:16px;font-size:11px;color:#a59bb2}
.batch-progress .between{margin-bottom:8px}
.batch-progress strong{color:#dcccee}
.batch-bar{height:6px;border-radius:3px;background:#241d33;overflow:hidden}
.batch-bar span{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#7453e8,#b28ad8);transition:width .4s ease}

.batch-counts{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.batch-count{font-size:10px;padding:6px 10px;border-radius:10px;border:1px solid var(--border);background:var(--white);color:#a59bb2}
.batch-count strong{color:#dcccee;margin-right:3px}
.batch-count.green{border-color:#315c4780;background:#183329;color:#91d7b5}
.batch-count.blue{border-color:#34587580;background:#192d40;color:#8dc8f0}
.batch-count.amber{border-color:#6d533080;background:#2a1f12;color:#e0b57f}
.batch-count.red{border-color:#78405280;background:#42212c;color:#f0a4b7}
.batch-count.green strong,.batch-count.blue strong,.batch-count.amber strong,.batch-count.red strong{color:inherit}

.batch-request .field{margin-top:12px}
.batch-request .btn{margin-top:12px}
.batch-files{margin-top:20px;max-height:280px;overflow:auto}
.batch-unlock{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:22px;padding:18px 20px;border:1px solid #6a4b9280;border-radius:15px;background:linear-gradient(140deg,#241a35,#1b1527)}
.batch-unlock strong{font-size:13px;color:#dcccee}
.batch-unlock .field-note{margin-top:5px;max-width:420px}

/* Progress updates patch these containers in place, so they must exist even when
   they have nothing to show. */
.batch-counts:empty,.batch-systems:empty{display:none}
.batch-systems{margin-bottom:4px}

.batch-files table{table-layout:fixed;width:100%}
.batch-files td:nth-child(2){width:132px}
.batch-files td:nth-child(3){width:152px}
.batch-file-row strong{overflow-wrap:anywhere}
/* Detection fills this line in mid-scan. Reserving its height keeps row heights
   stable, so a patched list does not shift under the reader. */
.batch-file-row [data-cell="meta"]{display:block;min-height:15px}
.search-more{margin-top:14px;text-align:center}
.load-more{display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px;border-top:1px solid var(--border)}
.load-more .field-note{margin:0}
.pager{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px;border-top:1px solid var(--border)}
.pager .field-note{margin:0}
.pager-controls{display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:center}
.pager-page,.pager-step{min-width:32px;height:32px;padding:0 10px;border:1px solid var(--border);border-radius:9px;background:var(--white);color:#a59bb2;font-size:11px;display:inline-flex;align-items:center;justify-content:center;gap:5px}
.pager-page:hover:not(.current),.pager-step:hover:not([disabled]){background:#241d33;color:#dcccee}
.pager-page.current{background:var(--purple);border-color:var(--purple-line);color:#fff;font-weight:600}
.pager-step[disabled]{opacity:.4}
.pager-step svg{width:13px;height:13px}
.pager-step:first-child svg{transform:rotate(180deg)}
.pager-gap{color:#7d7390;font-size:11px;padding:0 3px}
@media(max-width:760px){.pager-controls{gap:4px}.pager-step{padding:0 8px;font-size:10px}}
.batch-versions{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px}
.tag-more{background:#241d33;color:#a59bb2}

/* Credits are bought by the credit, on a slider, priced by volume. */
.credit-builder .card-body{padding:25px}
.credit-amount{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
#credit-slider{flex:1;min-width:220px;-webkit-appearance:none;appearance:none;height:18px;border-radius:9999px;background:#241d33;border:1px solid var(--border);outline:none}
#credit-slider::-webkit-slider-thumb{-webkit-appearance:none;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#8b5cf6,#c084fc);border:4px solid #1a152680;box-shadow:0 2px 10px #7453e855;cursor:grab}
#credit-slider::-webkit-slider-thumb:active{cursor:grabbing}
#credit-slider::-moz-range-thumb{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#8b5cf6,#c084fc);border:4px solid #1a152680;box-shadow:0 2px 10px #7453e855;cursor:grab}
#credit-slider:focus-visible{border-color:var(--purple-line)}
.credit-count{display:flex;align-items:baseline;gap:8px}
.credit-count input{width:110px;font-size:20px;font-weight:600;text-align:center;padding:9px}
.credit-count span{font-size:11px;color:#a59bb2}
.credit-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px}
.credit-tier{padding:15px;border:1px solid var(--border);border-radius:13.5px;background:var(--white);display:flex;flex-direction:column;gap:3px;text-align:left;color:#a59bb2}
.credit-tier strong{font-size:17px;color:#dcccee}
.credit-tier span{font-size:10px;color:#8e82a0}
.credit-tier small{font-size:10px;color:#7d7390;margin-top:5px}
.credit-tier.active{border-color:#6a4b9280;background:linear-gradient(140deg,#241a35,#1b1527)}
.credit-tier.active strong{color:#c3a0e5}
.credit-total{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:24px;padding-top:22px;border-top:1px solid var(--border)}
.credit-total strong{font-size:26px;letter-spacing:-.8px}
.credit-rate{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
@media(max-width:760px){.credit-tiers{grid-template-columns:1fr}.credit-amount{flex-direction:column;align-items:stretch}.credit-count{justify-content:center}}
.header-credits.header-plan{border-color:#6a4b9280;background:linear-gradient(135deg,#2c1f42,#1e1730)}
.header-credits.header-plan svg{color:#c3a0e5}
.stat.purple .stat-icon{background:#3a2a52;color:#c3a0e5}

/* Payment happens inside the workspace, in the workspace's own theme. */
.pay-screen{display:flex;flex-direction:column;gap:18px}
.pay-summary{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:18px 20px;border:1px solid #6a4b9280;border-radius:15px;background:linear-gradient(140deg,#241a35,#1b1527)}
.pay-summary strong{display:block;font-size:24px;letter-spacing:-.6px;color:#dcccee;margin-top:4px;overflow-wrap:anywhere}
.pay-countdown{text-align:right}
.pay-countdown strong{font-size:17px;color:#e0b57f}
.pay-body{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:start}
.pay-qr{padding:12px;background:#fff;border-radius:15px;line-height:0}
.pay-qr img{display:block;width:200px;height:200px}
.pay-fields{display:flex;flex-direction:column;gap:14px;min-width:0}
.pay-fields .field{margin:0}
.pay-copy{display:flex;align-items:center;gap:9px;padding:11px 13px;border:1px solid var(--border);border-radius:12px;background:var(--white)}
.pay-copy .mono{flex:1;min-width:0;font-size:12px;overflow-wrap:anywhere}
.pay-copy .btn{flex:none;padding:7px 11px;font-size:10px}
.pay-address{font-size:11px}
.pay-status{display:flex;align-items:center;gap:11px;font-size:11px;color:#a59bb2;padding:14px 16px;border:1px solid var(--border);border-radius:13.5px;background:var(--white);line-height:1.7}
.spinner.small{width:15px;height:15px;border-width:2px;flex:none}
@media(max-width:760px){.pay-body{grid-template-columns:1fr}.pay-qr{justify-self:center}.pay-countdown{text-align:left}}
/* The compatibility tables also appear on the landing page, under pricing. */
.public-compat .card{background:var(--white)}
/* The hero glow and the nav buttons spill past a phone viewport; the page
   itself should never scroll sideways. */
.public-site{overflow-x:clip}
.hero{overflow:hidden}
@media(max-width:760px){.public-nav-actions{flex-wrap:wrap;justify-content:flex-end}}
/* Two stacked sections double their padding; between the compatibility block
   and the closing call to action that reads as a hole. A rule closes the band. */
.public-compat,.public-stats{position:relative;padding-bottom:77px}
.public-section:has(.public-cta){padding-top:48px;padding-bottom:48px}
.public-compat::after,.public-stats::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:100vw;border-top:1px solid var(--border);pointer-events:none}

/* The dividers that separate the page's bands run the full width of the window,
   as the pricing band's do. These two blocks are centred and capped, so the rule
   is drawn behind them rather than on their own box. */
.trust-strip,.public-footer{position:relative;border-top-color:transparent;border-bottom-color:transparent}
.trust-strip::before,.trust-strip::after,.public-footer::before{content:'';position:absolute;left:50%;transform:translateX(-50%);width:100vw;border-top:1px solid var(--border);pointer-events:none}
.trust-strip::before{top:-1px}
.trust-strip::after{bottom:-1px}
.public-footer::before{top:-1px}

/* The hero illustration resolves a wrapped file into readable PHP. */
.code-lines .code-text{white-space:pre}
.code-lines.decoding .code-text{color:#8f7fb0}
.code-tabs button{cursor:pointer;background:transparent;border:0;border-bottom:1px solid transparent;color:inherit;font:inherit;padding:0 0 11px;transition:color .2s,border-color .2s}
.code-tabs button.active{color:#d1b7e9;border-bottom-color:#ab87d280}
.code-tabs button:hover:not(.active){color:#d6c7e8}
@media(prefers-reduced-motion:reduce){.code-lines.decoding .code-text{color:inherit}}

/* In-page nav links glide to their section. The reduced-motion block above
   already forces scroll-behavior back to auto, so this respects that. */
html{scroll-behavior:smooth}
#how-it-works,#compatibility,#pricing,#comparison{scroll-margin-top:24px}
/* The coverage link is an inline anchor, so its icon would sit on the text
   baseline rather than beside the words. */
.coverage-strip a{display:inline-flex;align-items:center;gap:6px}
/* An icon that leads a run of prose sits on the text baseline, which reads as
   floating above the words. These are inline, so they are nudged rather than
   turned into flex rows, which would stop the text wrapping under them. */
.coming-panel>svg:first-child,.batch-systems>svg:first-child,.field-note>svg:first-child{vertical-align:middle}
/* The sidebar is a fixed full-height column; without this its contents are
   unreachable on a short viewport, which is most phones in landscape and any
   small window. */
.sidebar{overflow-y:auto;overscroll-behavior:contain}
.sidebar::-webkit-scrollbar{width:5px}
.sidebar::-webkit-scrollbar-thumb{background:#3c334b;border-radius:3px}
.sidebar-bottom{flex-shrink:0}

/* Landing-page Telegram link. Fixed so it stays reachable while the page
   scrolls, and under the modal (100) and toast (200) layers. */
.telegram-float{position:fixed;right:25px;bottom:25px;z-index:40;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;color:white;background:linear-gradient(to right,#4c6ef5,#e64980,#4c6ef5);background-size:200% 100%;animation:rgb-flow 4s ease infinite;box-shadow:0 3px 12px #7453e82b;transition:box-shadow .25s,transform .2s}
.telegram-float:hover{box-shadow:0 0 18px #a778e565,0 5px 20px #7453e835;transform:translateY(-2px)}
.telegram-float:active{transform:translateY(1px)}
.telegram-float svg{width:18px;height:18px;fill:currentColor;stroke:none}
/* On a phone it collapses to the mark so it never covers the content. */
@media(max-width:560px){.telegram-float{right:16px;bottom:16px;width:48px;height:48px}}

/* Phones. The pricing grid stops at two columns higher up, which still overflows
   a phone, and the compatibility table's desktop padding and 230px target column
   push it wider than the viewport. Both are sized to fit rather than scroll. */
@media(max-width:760px){
.pricing-grid,.public-pricing .pricing-grid,.pricing-grid-wide,.public-pricing .pricing-grid-wide{grid-template-columns:1fr;max-width:420px}
.compat-table td,.compat-table th{padding:13px 12px}
.compat-table th{font-size:9px}
.compat-php-targets{min-width:0;gap:5px}
.compat-php-targets .tag{font-size:9px;padding:3px 5px}
}
@media(max-width:420px){
.compat-table td,.compat-table th{padding:11px 7px}
.compat-table .field-note{font-size:10px}
}
/* The summary cards keep three across on a phone, so the widest name has to fit
   the column rather than break mid-word the way overflow-wrap:anywhere allows. */
@media(max-width:560px){
.compat-summary-item h3{font-size:11px;overflow-wrap:normal;hyphens:none}
.compat-summary-item{padding:12px 9px}
.compat-summary-item .tag{font-size:9px;padding:3px 5px}
}
