@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:Manrope,Segoe UI,sans-serif;color:#202b40;background:#f7f9fc;font-synthesis:none;--blue:#2864e8}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit;background:none;border:0}a{color:inherit;text-decoration:none}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid #91b3ff;outline-offset:4px}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.svg-defs{position:absolute;width:0;height:0}[hidden]{display:none!important}.center{width:100%;min-height:100svh;padding:60px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center}.brand{display:flex;align-items:center;gap:10px;font-size:29px;font-weight:800;letter-spacing:-1.2px;margin-bottom:30px}.brand img{width:35px;height:35px}.brand-dot{color:var(--blue)}.activation-card{width:100%;max-width:490px;background:white;border:1px solid #e6ebf3;border-radius:18px;padding:36px;box-shadow:0 12px 45px #193b7010}h1{font-size:25px;font-weight:800;letter-spacing:-.8px;line-height:1.35;text-align:center;margin:0 0 12px}#form-description{text-align:center;color:#7d889a;font-size:14px;line-height:1.7;margin:0 0 28px}form>label{display:flex;justify-content:space-between;font-size:14px;font-weight:600;margin-bottom:10px}form>label span{color:#9aa5b6;font-size:14px;font-weight:400}.key-input-wrap{position:relative}.key-input-wrap>svg{position:absolute;left:15px;top:18px;color:#98a7bc;width:18px}input,textarea{background:#fbfcfe;border:1px solid #dce3ed;border-radius:9px;color:#263c5d;outline:none;width:100%;transition:border-color .15s,box-shadow .15s}input{height:55px;padding:15px 12px 15px 42px;font:14px Consolas,monospace}input::placeholder,textarea::placeholder{color:#a0adc1}input:focus,textarea:focus{border-color:#7199ef;box-shadow:0 0 0 3px #edf3ff}textarea{padding:15px;font:16px/1.7 Consolas,monospace;resize:vertical;min-height:95px}.field-hint{font-size:14px;color:#97a2b2;margin:9px 0 22px;line-height:1.6}.primary{min-height:51px;width:100%;border-radius:9px;background:var(--blue);color:white;display:flex;align-items:center;justify-content:center;gap:12px;font-size:14px;font-weight:600;padding:14px 20px;transition:background .15s}.primary:hover{background:#1b52ce}.primary:disabled{opacity:.65;cursor:wait}.primary svg{width:18px}.information{border-top:1px solid #edf0f5;margin-top:27px;padding-top:21px;text-align:center}.information p{color:#8793a5;font-size:14px;line-height:1.8;margin:0 auto 15px;max-width:365px}.help-links{display:flex;align-items:center;justify-content:center;gap:16px;color:#5774a6;font-size:14px}.help-links>span{color:#c0cad8}.help-links button{padding:0}.help-links a:hover,.help-links button:hover{color:var(--blue)}.demo-note{display:flex;justify-content:center;align-items:center;gap:9px;color:#a3adbd;font-size:14px;margin-top:23px}.demo-note button{color:#6d87af;padding:0;font-size:14px}.error{color:#b2433e;background:#fff2f0;padding:12px;border-radius:8px;font-size:14px;line-height:1.6;margin:16px 0 0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.upload-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:15px;flex-wrap:wrap}.upload-button{font-size:14px;font-weight:600;display:flex;gap:6px;align-items:center;cursor:pointer;color:#5675a8}.upload-button svg{width:16px}.text-button{font-size:14px;color:#5675a8;text-decoration:underline;text-underline-offset:4px}#image-preview{max-width:100%;max-height:150px;display:block;margin:0 auto 20px;border-radius:8px}.result-note{font-size:14px;text-align:center;color:#8793a5}.code-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:20px 0}.code-part{background:#f5f8fe;border:1px solid #e4ebf7;border-radius:8px;padding:12px 3px;text-align:center}.code-part span{display:block;font-size:14px;color:#91a0b9;margin-bottom:7px}.code-part code{font-size:16px;color:#3564b9}.reset-button{display:block;margin:18px auto 0}dialog{border:1px solid #e2e8f2;border-radius:18px;padding:28px;max-width:520px;width:calc(100% - 32px);color:#26364e;box-shadow:0 25px 100px #12326022}dialog::backdrop{background:#172b4966;backdrop-filter:blur(4px)}.dialog-top{display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:14px;letter-spacing:1.5px;color:#8a9ab4}.dialog-top button{font-size:26px}dialog h2{font-size:25px;letter-spacing:-.7px}dialog ol{padding-left:22px}dialog li{padding-left:8px;margin-bottom:20px;font-size:14px}dialog p{font-size:14px;color:#8492a8;line-height:1.8}.dialog-note{background:#f0f5ff;padding:15px;font-size:14px;line-height:1.8;border-radius:8px}@media(max-width:540px){.center{padding:36px 18px}.brand{margin-bottom:25px}.activation-card{padding:28px 22px;border-radius:15px}h1{font-size:23px}#form-description{font-size:14px}input{font-size:14px;padding-left:37px}.key-input-wrap>svg{left:12px}.code-part code{font-size:14px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Secondary information stays below the main activation form. */
.center{justify-content:flex-start;padding-top:48px;padding-bottom:35px}.below-form{width:100%;max-width:490px;margin-top:18px}.quick-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.quick-links a{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:17px 13px;background:white;border:1px solid #e3eaf4;border-radius:12px;transition:border-color .15s,background .15s}.quick-links a:hover{border-color:#a4bff5;background:#f3f7ff}.quick-links svg{color:#3971db;width:20px;height:20px;margin-bottom:3px}.quick-links strong{font-size:14px;font-weight:700;line-height:1.5}.quick-links a>span{font-size:14px;line-height:1.6;color:#8695ab}.about-service{padding:27px 4px 0}.about-service h2{font-size:17px;letter-spacing:-.3px;margin:0 0 10px}.about-service p{font-size:14px;line-height:1.85;color:#7a899e;margin:0 0 17px}.about-service details{border-bottom:1px solid #e3e9f2;padding-bottom:17px}.about-service summary{font-size:14px;color:#5276ad;cursor:pointer;line-height:1.6}.about-service details p{margin:12px 0 0}.benefits{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-wrap:wrap;gap:12px 18px}.benefits li{display:flex;align-items:center;gap:6px;color:#7b8aa1;font-size:14px;line-height:1.7}.benefits svg{width:15px;height:15px;color:#5282d6}.demo-note{margin-top:27px}@media(max-width:540px){.center{padding-top:30px}.quick-links{gap:7px}.quick-links a{padding:14px 10px}.quick-links strong{font-size:14px}.quick-links a>span{font-size:14px}.benefits{gap:9px 14px}}@media(max-width:350px){.quick-links{grid-template-columns:1fr}.quick-links a{display:grid;grid-template-columns:20px 1fr;align-items:center}.quick-links a>span{grid-column:2}.quick-links svg{margin:0}}
.quick-links button{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:17px 13px;background:white;border:1px solid #e3eaf4;border-radius:12px;text-align:left;transition:border-color .15s,background .15s}.quick-links button:hover{border-color:#a4bff5;background:#f3f7ff}.quick-links button>span{font-size:14px;line-height:1.6;color:#8695ab}.price-list{border:1px solid #e4eaf4;border-radius:10px;margin:22px 0 12px;overflow:hidden}.price-row{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:15px 16px;font-size:14px;line-height:1.5}.price-row+.price-row{border-top:1px solid #edf1f7}.price-value{font-size:14px;color:#8a98ad;white-space:nowrap}.price-caption{font-size:14px;color:#94a0b2;margin-bottom:20px}#shop{max-height:calc(100svh - 32px);overflow:auto}@media(max-width:540px){.quick-links button{padding:14px 10px}}@media(max-width:350px){.quick-links button{display:grid;grid-template-columns:20px 1fr;align-items:center}.quick-links button>span{grid-column:2}.price-row{padding:13px 10px;font-size:14px}}
.cid-prices{width:100%;border-collapse:collapse;font-size:14px}.cid-prices th,.cid-prices td{padding:14px 15px;text-align:right;white-space:nowrap}.cid-prices th:first-child{text-align:left}.cid-prices thead{background:#f5f8fe;color:#8292aa;font-size:14px}.cid-prices th{font-weight:500}.cid-prices tbody tr{border-top:1px solid #edf1f7}.cid-prices td:last-child{font-weight:700;color:#2c5fbd}.cid-prices tbody tr:last-child{background:#f0f5ff}@media(max-width:400px){.cid-prices th,.cid-prices td{padding:13px 9px}.cid-prices{font-size:14px}}
/* Consistent column widths and numeric alignment in CID pricing. */
.cid-prices{table-layout:fixed;font-variant-numeric:tabular-nums}.cid-prices th,.cid-prices td{width:33.333%;height:52px;padding:14px 18px;vertical-align:middle}.cid-prices thead th{height:43px;font-size:14px;font-weight:600;color:#6c7f9c}.cid-prices th:first-child{padding-left:20px}.cid-prices td:last-child,.cid-prices th:last-child{padding-right:20px}.cid-prices tbody th{font-weight:600;color:#344663}.cid-prices tbody td:nth-child(2){color:#7687a0}.cid-prices tbody tr:last-child{background:transparent}.cid-prices tbody tr:nth-child(even){background:#f8faff}#shop .price-list{margin:20px 0}#shop h2{margin:15px 0 10px}#shop-description{margin:0;line-height:1.7}@media(max-width:400px){.cid-prices th,.cid-prices td{height:48px;padding:12px 10px}.cid-prices th:first-child{padding-left:12px}.cid-prices td:last-child,.cid-prices th:last-child{padding-right:12px}}
#help{max-width:600px;max-height:calc(100svh - 32px);overflow:auto}.help-intro{margin-bottom:22px}.product-guides{border:1px solid #e3eaf4;border-radius:10px;overflow:hidden;margin:20px 0}.product-guides details+details{border-top:1px solid #e3eaf4}.product-guides summary{padding:17px 18px;cursor:pointer;font-size:15px;font-weight:600;color:#345d9e}.product-guides summary span{display:block;font-size:14px;font-weight:400;color:#8a99af;line-height:1.6;margin:5px 0 0 18px}.product-guides details[open] summary{background:#f3f7ff}.product-guides details>p,.product-guides details>a{margin:15px 18px;display:block}.product-guides details>a{font-size:14px;color:#356bd0;line-height:1.6}.product-guides ol{margin:18px 18px 18px 24px}.product-guides li{line-height:1.8;font-size:14px;margin-bottom:12px}.product-guides code{font-size:14px;background:#edf3fe;padding:2px 5px;border-radius:4px}
/* Illustrated product guides. */
#help{max-width:820px}.guide-figure{margin:18px}.guide-image-button{display:block;width:100%;padding:0;border:1px solid #dce7f8;border-radius:10px;overflow:hidden;background:#f5f8fe;cursor:zoom-in}.guide-image-button img{display:block;width:100%;height:auto}.guide-figure figcaption{font-size:14px;line-height:1.6;color:#8292a9;margin-top:8px}.guide-figure figcaption span{color:#396cc0}.product-guides ol{counter-reset:guide;list-style:none;padding:0;margin:20px}.product-guides ol li{counter-increment:guide;position:relative;padding:0 0 0 37px;margin:0 0 21px;font-size:14px;line-height:1.8}.product-guides ol li:before{content:counter(guide);position:absolute;left:0;top:1px;width:25px;height:25px;display:grid;place-items:center;background:#edf3ff;border-radius:7px;font-size:14px;font-weight:700;color:#356ed2}.guide-service-step{border-left:2px solid #cbdcf8;padding-left:13px}.guide-zoom{max-width:1200px;width:calc(100% - 24px);max-height:calc(100svh - 24px);padding:18px;overflow:auto}.guide-zoom img{display:block;width:100%;height:auto;margin-top:12px}.guide-zoom .dialog-top{gap:16px}.guide-zoom h2{font-size:17px;margin:0}.guide-zoom button{min-width:36px;min-height:36px}@media(max-width:540px){#help{padding:20px}.guide-figure{margin:12px}.product-guides ol{margin:18px 14px}.product-guides summary{padding:16px 14px}}
.photo-steps{padding:4px 20px 22px}.photo-step{margin:25px 0 35px}.photo-step:last-child{margin-bottom:0}.photo-step h3{display:flex;gap:12px;align-items:center;font-size:16px;line-height:1.6;margin:0 0 10px;color:#304665}.photo-step h3>span{display:grid;place-items:center;flex:0 0 29px;height:29px;border-radius:8px;background:#eaf1ff;color:#2e67d1;font-size:14px}.photo-step>p{font-size:14px;line-height:1.85;margin:0 0 14px;color:#71819a}.step-figure{margin:0}.step-figure figcaption{font-size:14px;color:#8a98ad;line-height:1.7;margin-top:8px}.step-figure .plain-image{display:block;background:#f9fbff}.step-figure .plain-image img{max-width:100%;width:auto;max-height:480px;height:auto;margin:auto}.stage-frame{display:block;position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;background:white}.stage-frame img{position:absolute!important;display:block!important;width:200%!important;max-width:none!important;height:200%!important;max-height:none!important;object-fit:fill;margin:0!important}.tile-0 img{left:0;top:0}.tile-1 img{left:-100%;top:0}.tile-2 img{left:0;top:-100%}.tile-3 img{left:-100%;top:-100%}#guide-zoom-frame{margin-top:12px}.guide-zoom .plain-image img{width:auto;max-width:100%;max-height:80svh;margin:auto}.guide-zoom .stage-frame{max-width:1000px;margin-inline:auto}@media(max-width:540px){.photo-steps{padding:0 12px 18px}.photo-step h3{font-size:15px}.photo-step{margin-top:20px}}
/* Larger activation key field. */
.key-input-wrap input{height:68px;font-size:18px;padding:20px 14px 20px 44px;letter-spacing:.1px}.key-input-wrap>svg{top:24px;width:20px;height:20px}.activation-card{max-width:550px}.below-form{max-width:550px}@media(max-width:540px){.key-input-wrap input{height:64px;font-size:clamp(12px,3.4vw,17px);padding:19px 10px 19px 34px;letter-spacing:0}.key-input-wrap>svg{top:23px;left:10px;width:18px;height:18px}}
/* Center the placeholder and entered key within the field. */
.key-input-wrap input{text-align:center;padding-left:14px;padding-right:14px}.key-input-wrap>svg{display:none}@media(max-width:540px){.key-input-wrap input{padding-left:10px;padding-right:10px}}
/* Subtle emphasis for the activation key input. */
.key-input-wrap input{background:#f3f7ff;border:1.5px solid #a9c3f5;box-shadow:0 2px 8px #2864e80a}.key-input-wrap input:hover{border-color:#7fa5ee}.key-input-wrap input:focus{background:#fff;border-color:#487de6;box-shadow:0 0 0 3px #2864e814}
/* Clear, distinct typography for the product key. */
.key-input-wrap input{font-family:'Segoe UI',Arial,sans-serif;font-weight:600;letter-spacing:.7px}.key-input-wrap input::placeholder{font-family:inherit;font-weight:500;color:#8599b8}@media(max-width:540px){.key-input-wrap input{letter-spacing:.15px}}
/* Smaller key text on desktop and mobile. */
.key-input-wrap input{font-size:16px}@media(max-width:540px){.key-input-wrap input{font-size:clamp(11px,3vw,14px)}}
.resume-key{font-family:Consolas,monospace;color:#2864e8;font-size:14px;overflow-wrap:anywhere;margin:24px 0}.chat-launch{position:fixed;right:22px;bottom:22px;border:0;border-radius:28px;background:#2864e8;color:white;padding:15px 21px;box-shadow:0 6px 24px #2864e833;z-index:10;cursor:pointer}#chat-count:not(:empty){background:white;color:#2864e8;border-radius:50%;padding:2px 6px;margin-left:5px}#chat{width:min(460px,calc(100vw - 24px));padding:24px}#chat h2{font-size:19px;margin:0}#chat-messages{height:290px;overflow:auto;display:flex;flex-direction:column;gap:12px;padding:14px 0;font-size:14px;color:#64748b}.chat-message{max-width:88%;padding:10px 14px;background:#f1f5f9;border-radius:14px;color:#17243b;align-self:flex-start;overflow-wrap:anywhere}.chat-message.customer{background:#eaf1ff;align-self:flex-end}.chat-message p{margin:0 0 5px;white-space:pre-wrap}.chat-message small{font-size:14px;color:#64748b}#chat-form .primary{margin-top:10px}#support-error{font-size:14px;margin:12px 0}#support-error a{color:#2864e8}#change-key{margin-top:14px}@media(max-width:560px){.chat-launch{right:12px;bottom:12px;padding:12px 16px;font-size:14px}#chat{padding:18px}#chat-messages{height:min(290px,35vh)}.resume-key{font-size:14px}}
/* Floating support window */
#chat{position:fixed;inset:auto 24px 24px auto;margin:0;width:360px;height:540px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 48px);padding:0;border:1px solid #dce5f3;border-radius:20px;background:#fff;box-shadow:0 18px 65px #18345730;z-index:30;overflow:hidden;text-align:left}
#chat[open]{display:flex;flex-direction:column}
.chat-header{display:flex;align-items:center;gap:10px;padding:13px 14px;background:#2864e8;color:#fff;flex-shrink:0}
.chat-avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#ffffff24;font-size:22px;font-weight:750;flex-shrink:0}
#chat h2{color:#fff;font-size:16px;line-height:1.4;font-weight:700}
.chat-header p{margin:3px 0 0;color:#e3ecff;font-size:14px;line-height:1.4}
#close-chat{margin-left:auto;align-self:flex-start;width:32px;height:32px;border:0;border-radius:8px;background:#ffffff1f;color:white;font-size:26px;line-height:1;cursor:pointer}
#close-chat:hover{background:#ffffff38}
#chat-messages{flex:1;min-height:0;height:auto;padding:14px 12px;background:#f5f7fc;gap:10px;font-size:14px;line-height:1.6;color:#53637c;overscroll-behavior:contain}
#chat .chat-message{flex-shrink:0;max-width:88%;padding:9px 12px;border-radius:15px 15px 15px 4px;background:#fff;box-shadow:0 2px 5px #20395f08;color:#1b2d48;font-size:16px;line-height:1.55}
#chat .chat-message.customer{background:#e3edff;border-radius:15px 15px 4px 15px}
#chat .chat-author{display:block;font-size:14px;color:#466491;margin-bottom:3px;font-weight:650}
#chat .chat-message p{font-size:14px;line-height:1.5;margin:0 0 5px;color:#1b2d48}
#chat .chat-message small{display:block;font-size:14px;color:#75839a;text-align:right}
#chat-form{display:grid;grid-template-columns:minmax(0,1fr) 42px;align-items:end;gap:8px;flex-shrink:0;padding:10px 12px;border-top:1px solid #e7edf6;background:white}
#chat-form label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#chat-text{font-family:inherit;font-size:16px;line-height:1.5;height:44px;min-height:44px;max-height:100px;resize:none;border-radius:12px;background:#fafbfe;padding:10px}
#chat-form .primary{width:42px;height:44px;min-height:44px;padding:0;font-size:0;border-radius:11px;margin:0}#chat-form .primary::after{content:"↑";font-size:24px;line-height:1}
#chat-error:empty{display:none}#chat-error{flex-shrink:0;margin:0;padding:0 16px 12px;font-size:14px;background:#fff}
@media(max-width:560px){#chat{inset:auto 12px max(12px,env(safe-area-inset-bottom)) auto;width:calc(100% - 24px);max-width:360px;height:min(520px,78dvh);max-height:calc(100dvh - 24px);border-radius:16px}.chat-header{padding:11px 12px}.chat-header p{display:none}#chat-messages{padding:12px 10px}#chat-form{padding:9px 10px}#chat h2{font-size:15px}.chat-avatar{width:30px;height:30px;font-size:18px}#chat-text{font-size:16px}#chat .chat-message{max-width:90%}}
#chat-text{line-height:22px;padding:10px;height:46px;min-height:46px;scrollbar-width:thin}#chat-form .primary{height:46px}
/* Explicit send label on desktop and mobile. */
#chat-form{grid-template-columns:minmax(0,1fr) auto}
#chat-form .primary{width:auto;min-width:94px;height:46px;padding:0 14px;font-size:14px;font-weight:600;line-height:1;border-radius:11px}
#chat-form .primary::after{content:none}
@media(max-width:560px){#chat-form{gap:7px}#chat-form .primary{min-width:88px;padding:0 11px;font-size:14px}}
/* Grow the composer with its text; keep long drafts scrollable. */
#chat-text{max-height:156px;overflow-y:hidden;box-sizing:border-box}
@media(max-width:560px){#chat-text{max-height:134px}}
.support-secondary{display:block;margin-top:10px;font-size:14px;color:#788499;text-align:center;text-decoration:none}.support-secondary:hover{color:#2864e8;text-decoration:underline}#support-error .support-secondary{color:#788499}#support-error .primary{font-size:14px;min-height:42px;padding:11px 15px}
/* A little more room for the activation key on every screen. */
.activation-card{max-width:590px}
@media(max-width:540px){.center{padding-left:14px;padding-right:14px}.activation-card{padding-left:16px;padding-right:16px}.key-input-wrap input{font-size:clamp(12px,3.35vw,15px);letter-spacing:.15px}}
/* Short introduction above the key form. */
.center>.brand{margin-bottom:18px}.welcome-note{width:100%;max-width:590px;text-align:center;margin:0 0 24px}.welcome-note p{margin:0;color:#63748e;font-size:16px;line-height:1.6}.welcome-note strong{font-weight:600;color:#263b5b}.welcome-note nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:8px}.welcome-note button{border:0;background:transparent;padding:5px 2px;color:#2864e8;font:inherit;font-size:14px;cursor:pointer}.welcome-note button:hover{text-decoration:underline}.welcome-note nav>span{color:#a8b5c8}.welcome-note button:focus-visible{outline:2px solid #2864e8;outline-offset:3px;border-radius:3px}@media(max-width:540px){.center>.brand{margin-bottom:14px}.welcome-note{margin-bottom:18px}.welcome-note p{font-size:14px}.welcome-note button{font-size:14px}.welcome-note nav{margin-top:5px}}
@media(min-width:561px){.chat-launch{font-size:14px}.welcome-note [data-open-chat]{font-size:14px}}
.welcome-note nav{flex-wrap:wrap;column-gap:12px;row-gap:2px}@media(max-width:540px){.welcome-note nav{column-gap:9px}}
/* Purchase and support cards above the activation form. */
.welcome-note{margin-bottom:14px}.top-actions{width:100%;max-width:590px;margin:0 0 22px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:540px){.welcome-note{margin-bottom:12px}.top-actions{gap:7px;margin-bottom:16px}.top-actions button{padding:12px 7px}.top-actions strong{font-size:14px}.top-actions button>span{font-size:14px}}
@media(max-width:540px){.top-actions button>span{font-size:14px;line-height:1.45}.top-actions strong{font-size:14px}}
/* Make help actions easier to notice. */
.information .help-links{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.information .help-links button{font-size:15px;line-height:1.4}
.information .help-links [data-help]{padding:8px 13px;border:1px solid #cbdcff;border-radius:9px;background:#eaf1ff;color:#245bd0;font-weight:650}
.information .help-links [data-help]:hover{background:#dce8ff;border-color:#9bbcf7}
@media(max-width:540px){.information .help-links button{font-size:14px}}
/* Space between the logo and the action cards. */
.center>.brand{margin-bottom:30px}
@media(max-width:540px){.center>.brand{margin-bottom:24px}}
/* Alternative UX — the previous files are saved in tmp/before-ux-*. */
:root{background:#f5f7fb;color:#1e2c43}
.center{padding-top:36px;padding-bottom:32px}.center>.brand{margin-bottom:24px}
.top-actions{max-width:620px;gap:10px;margin-bottom:18px}
.top-actions button{display:grid;grid-template-columns:20px 1fr;column-gap:10px;row-gap:2px;align-items:center;background:transparent;border-color:transparent;padding:12px 16px;border-radius:12px}
.top-actions button:hover{background:#eaf0fa;border-color:transparent}.top-actions svg{grid-row:1/3;margin:0;width:19px;height:19px}.top-actions strong{font-size:14px;font-weight:650}.top-actions button>span{grid-column:2;font-size:14px;color:#738198}
.activation-card{max-width:620px;padding:30px 38px 26px;border:1px solid #e5ebf4;border-radius:22px;box-shadow:0 10px 38px #213e6d08}
.activation-steps{display:grid;grid-template-columns:1fr 1.55fr 1fr;list-style:none;gap:10px;padding:0 0 25px;margin:0 0 28px;border-bottom:1px solid #edf1f7}
.activation-steps li{display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;white-space:nowrap;color:#8995a7;font-weight:600}
.activation-steps li>span{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#f0f3f8;color:#8995a7;font-size:14px;flex-shrink:0}
.activation-steps [aria-current=step]{color:#2864e8}.activation-steps [aria-current=step]>span{background:#2864e8;color:#fff;box-shadow:0 3px 9px #2864e825}.activation-steps .done{color:#5e7aa5}.activation-steps .done>span{background:#eaf1ff;color:#2864e8}
h1{font-size:26px;font-weight:750;letter-spacing:-.7px;margin-bottom:10px}#form-description{font-size:14px;color:#728097;line-height:1.6;margin-bottom:26px}
.key-input-wrap input{height:66px;background:#f6f9ff;border-color:#b2caf6;border-radius:12px;font-size:17px;letter-spacing:.6px;box-shadow:none;color:#203e73}.key-input-wrap input::placeholder{color:#91a5c4}
.activation-card .primary{border-radius:12px;min-height:52px;font-size:15px;box-shadow:0 4px 10px #2864e814}.field-hint{color:#7b899e}
.information{margin-top:24px;padding-top:18px}.information p{font-size:14px;color:#7b899e;line-height:1.6;margin-bottom:14px;max-width:440px}.information .help-links{gap:14px}.information .help-links [data-help]{border:0;background:#edf3ff;border-radius:8px;padding:8px 12px;font-size:14px}.information .help-links button{font-size:14px}
#product-context{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:-6px 0 20px;color:#365d94;font-size:14px}#product-context svg{width:16px;height:16px}#product-name{font-weight:650}#product-status{color:#7a8ca6;font-size:14px}
.iid-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;font-size:14px;font-weight:600}.iid-heading .text-button{font-size:14px;text-decoration:none;color:#2864e8;padding:6px 0}
#iid-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.iid-group{position:relative;display:block}.iid-group>span{position:absolute;left:10px;top:8px;font-size:14px;color:#8897ae;pointer-events:none}.iid-group input{height:62px;padding:22px 7px 9px;text-align:center;font:18px/1.2 Consolas,monospace;letter-spacing:1.5px;border-radius:10px;background:#fafbfe}.iid-group input::placeholder{font-size:14px;letter-spacing:3px;color:#c7d1e1}.iid-group.complete input{background:#f3f7ff;border-color:#b8cdf0}.iid-group input:focus{border-color:#2864e8;background:#fff;box-shadow:0 0 0 3px #2864e811}
.iid-meter{height:3px;border-radius:4px;background:#eef2f8;margin-top:14px;overflow:hidden}.iid-meter>span{display:block;height:100%;width:0;background:#2864e8;transition:width .15s}#iid-count{font-size:14px;margin:8px 0 14px}#iid-count.complete{color:#2864e8}#paste-hint{margin-top:0}
#iid-form .upload-row{margin-top:12px;gap:8px}#upload-caption{font-size:14px;margin-bottom:16px}#change-key{display:block;margin:15px auto 0}
.code-grid{gap:10px;margin:18px 0}.code-part{padding:14px 5px;background:#f6f9ff;border-color:#dce7f9;border-radius:10px;cursor:pointer;user-select:text}.code-part:hover,.code-part.copied{background:#eaf1ff;border-color:#95b4ef}.code-part span{font-size:14px;color:#647ea7}.code-part code{font:19px Consolas,monospace;letter-spacing:.5px}.result-hint{text-align:center;font-size:14px;color:#7788a2;margin:10px 0 0}.result-note{display:table;margin:0 auto;background:#f1f4f9;color:#718096;padding:6px 10px;border-radius:6px}
.below-form{max-width:620px;margin-top:12px}.about-service{padding:18px 10px 0}.about-service h2{font-size:15px}.about-service p{font-size:14px;line-height:1.75}.about-service summary{font-size:14px}.benefits{margin-top:14px}.demo-note{margin-top:20px}
#chat-notice{position:fixed;right:24px;bottom:78px;max-width:calc(100vw - 32px);padding:12px 16px;border:1px solid #d6e3f8;border-radius:12px;background:#fff;color:#285db1;font-size:14px;box-shadow:0 5px 25px #203b6717;z-index:20}
@media(max-width:540px){.center{padding:24px 12px}.center>.brand{margin-bottom:18px}.top-actions{gap:4px;margin-bottom:14px}.top-actions button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 3px;text-align:center}.top-actions svg{width:18px;height:18px;margin-bottom:3px}.top-actions strong{font-size:14px}.top-actions button>span{font-size:14px}.activation-card{padding:22px 18px;border-radius:18px}.activation-steps{gap:4px;padding-bottom:20px;margin-bottom:22px}.activation-steps li{font-size:14px;gap:5px}.activation-steps li>span{width:21px;height:21px;font-size:14px}h1{font-size:22px}#form-description{font-size:14px;margin-bottom:22px}.key-input-wrap input{font-size:clamp(12px,3.35vw,15px);letter-spacing:.15px;height:62px}.iid-group input{font-size:17px;letter-spacing:.6px;padding-left:4px;padding-right:4px}#iid-groups{gap:8px}.code-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.code-part{padding:10px;display:flex;align-items:center;justify-content:space-around}.code-part span{margin:0}.code-part code{font-size:19px}.information .help-links{gap:8px}.information .help-links button,.information .help-links [data-help]{font-size:14px}#chat-notice{right:12px;bottom:66px;font-size:14px}.about-service{padding-left:6px;padding-right:6px}}
/* Leave room for the floating support button at the end of the page. */
.center{padding-bottom:90px}
@media(max-width:540px){.activation-steps li{font-size:14px}.center{padding-bottom:84px}}
/* Readable typography across desktop and mobile. */
#form-description,.about-service p,.about-service summary,dialog p,dialog li,.price-row,.cid-prices{font-size:16px;line-height:1.65}
.top-actions strong{font-size:16px}.top-actions button>span{font-size:14px;color:#61718a}
form>label,.iid-heading{font-size:16px}form>label span,.field-hint,#iid-count,#upload-caption,.text-button,.upload-button,.result-hint,.result-note,.benefits li,.demo-note,.demo-note button,.price-caption,.price-value,.support-secondary,.dialog-note,.eyebrow{font-size:14px}
.field-hint,.information p,#upload-caption,.result-hint,.demo-note,.price-caption{color:#65758d}
.information p{font-size:14px;line-height:1.7}.information .help-links button,.information .help-links [data-help]{font-size:16px}
.activation-steps li,.activation-steps li>span,.iid-group>span,.code-part span,#product-status{font-size:14px}#product-context{font-size:16px}
.iid-group input{height:70px;padding-top:29px}.iid-group>span{top:7px;line-height:18px}
.activation-card .primary{font-size:16px}
#chat .chat-message p{font-size:16px}#chat .chat-author,#chat .chat-message small,.chat-header p,#chat-form label,#chat-error,#chat-notice,.chat-launch{font-size:14px}
@media(max-width:540px){.top-actions strong{font-size:16px;min-height:2.8em;display:flex;align-items:center;justify-content:center;line-height:1.4}.top-actions button>span{font-size:14px;line-height:1.45}.top-actions button{padding:9px 3px}.activation-steps{grid-template-columns:1fr 1.4fr 1fr;gap:8px}.activation-steps li{flex-direction:column;gap:7px;white-space:normal;text-align:center;line-height:1.35;justify-content:flex-start}.activation-steps li>span{width:26px;height:26px}.key-input-wrap input{font-size:clamp(14px,3.9vw,16px);letter-spacing:0;padding-left:8px;padding-right:8px}.information .help-links{gap:10px}.iid-heading .text-button{font-size:14px}.chat-header p{font-size:14px}}
/* One calm, self-contained error and support panel. */
#error-panel{margin-top:18px;padding:18px 20px;background:#fff8f4;border:1px solid #f1dfd2;border-radius:12px;text-align:left}
#error-panel #error{margin:0;padding:0;background:none;border:0;border-radius:0;color:#8c4a30;font-size:16px;font-weight:650;line-height:1.5}
#error-detail{margin:7px 0 0;color:#6f625c;font-size:14px;line-height:1.65}
#error-panel #support-error{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;margin:15px 0 0}
#error-panel .support-chat{width:auto;min-height:42px;padding:10px 16px;border:1px solid #c7d8f5;border-radius:9px;background:#fff;color:#285db6;font-size:14px;font-weight:650;line-height:1.4;box-shadow:none}
#error-panel .support-chat:hover{background:#edf3ff;border-color:#9cb9ed}
#error-panel .support-secondary{display:inline;margin:0;padding:8px 0;color:#706f76;font-size:14px;line-height:1.4;text-align:left}
@media(max-width:540px){#error-panel{padding:16px}#error-panel #support-error{gap:10px 16px}}
#error-panel{text-align:center}
#error-panel #support-error{justify-content:center}
/* Clear, evenly aligned purchase and support cards. */
.top-actions{gap:12px;margin-bottom:20px}
.top-actions button{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;min-width:0;padding:18px 12px;background:#fff;border:1px solid #e0e7f2;border-radius:14px;text-align:center;box-shadow:0 3px 12px #203b6704}
.top-actions button:hover{background:#f8faff;border-color:#afc7ef;box-shadow:0 4px 16px #203b670a}
.top-actions svg{box-sizing:content-box;width:21px;height:21px;padding:9px;margin:0 0 5px;background:#edf3ff;border-radius:12px;color:#2864e8}
.top-actions strong{display:flex;align-items:center;justify-content:center;min-height:24px;font-size:16px;line-height:1.4;font-weight:650}
.top-actions button>span{font-size:14px;line-height:1.45;color:#667992}
@media(max-width:540px){.top-actions{gap:8px;margin-bottom:16px}.top-actions button{padding:13px 6px;border-radius:12px;gap:4px}.top-actions svg{width:19px;height:19px;padding:8px;margin-bottom:5px;border-radius:10px}.top-actions strong{font-size:14px;min-height:40px;line-height:1.4}.top-actions button>span{font-size:14px;min-height:41px;display:flex;align-items:center;justify-content:center;line-height:1.45}}
/* Compact action cards without reducing text size. */
.top-actions button{padding:12px 8px;gap:4px}
.top-actions svg{width:18px;height:18px;padding:6px;margin-bottom:2px;border-radius:9px}
.top-actions strong{min-height:0}
.top-actions button>span{min-height:0}
@media(max-width:540px){.top-actions button{padding:10px 5px;gap:3px}.top-actions svg{width:18px;height:18px;padding:5px;margin-bottom:2px}.top-actions strong,.top-actions button>span{min-height:0}}
/* Purchase and guide windows with a stable header and scrollable content. */
#shop.service-dialog,#help.service-dialog{width:min(560px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - 64px);padding:0;border:1px solid #dfe7f2;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 24px 90px #172c4c30}
#shop.service-dialog[open],#help.service-dialog[open]{display:flex;flex-direction:column}
.service-dialog::backdrop{background:#18284266;backdrop-filter:blur(4px)}
.service-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:23px 26px 20px;border-bottom:1px solid #e9eef5;flex-shrink:0;background:#fff}
.service-dialog-header .eyebrow{font-size:14px;letter-spacing:.7px;color:#6c809f}.service-dialog-header h2{font-size:25px;line-height:1.3;margin:6px 0 0;letter-spacing:-.5px;color:#20324e}
.dialog-close{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border-radius:12px;background:#f0f3f8;color:#596b86;font-size:27px;line-height:1}.dialog-close:hover{background:#e4ebf5}
.service-dialog-body{overflow-y:auto;min-height:0;padding:20px 26px;overscroll-behavior:contain}.service-dialog-body>p:first-child{margin:0 0 18px;font-size:16px;line-height:1.6;color:#65758d}
.service-dialog-footer{flex-shrink:0;padding:17px 26px 20px;border-top:1px solid #e9eef5;background:#fafbfe}.service-dialog-footer>p{font-size:14px;color:#486185;font-weight:600;margin:0 0 12px}.service-dialog-footer .primary{font-size:16px;border-radius:11px}.service-dialog-footer .support-secondary{font-size:14px}
.shop-options{display:grid;gap:9px;margin:0;border:0;border-radius:0}.shop-option{display:grid;grid-template-columns:24px minmax(0,1fr) auto;column-gap:12px;row-gap:3px;text-align:left;align-items:center;padding:14px;border:1px solid #e0e7f2;border-radius:12px;background:#fff}.shop-option strong{font-size:16px;font-weight:650}.shop-option>span:not(.option-mark){grid-column:2;font-size:14px;color:#73829a}.shop-option b{grid-column:3;grid-row:1/3;font-size:16px;font-weight:650;color:#31588f;white-space:nowrap}.option-mark{display:grid;place-items:center;grid-row:1/3;width:22px;height:22px;border-radius:50%;border:1px solid #ced9ea;color:transparent;font-size:14px}.shop-option:hover{border-color:#a4beea}.shop-option[aria-pressed=true]{background:#f0f5ff;border-color:#7fa6ee}.shop-option[aria-pressed=true] .option-mark{background:#2864e8;color:#fff;border-color:#2864e8}
#help .product-guides>details{border:1px solid #e1e8f2;border-radius:12px;margin:0 0 10px;padding:0 15px;overflow:hidden}#help .product-guides>details>summary{font-size:16px;padding:16px 0;color:#2d4262}#help .product-guides>details>summary span{font-size:14px;color:#75849a;line-height:1.5}#help .product-guides>details[open]{border-color:#b4caee}#help .dialog-note{font-size:14px;margin-top:16px}
@media(max-width:560px){#shop.service-dialog,#help.service-dialog{inset:auto 0 0;margin:0;width:100%;max-height:90dvh;border-radius:20px 20px 0 0;border-bottom:0}.service-dialog-header{padding:18px 18px 15px}.service-dialog-header h2{font-size:22px}.service-dialog-body{padding:17px 16px}.service-dialog-footer{padding:14px 16px max(16px,env(safe-area-inset-bottom))}.shop-option{padding:12px 10px;column-gap:9px}.shop-option strong,.shop-option b{font-size:16px}.service-dialog-header .eyebrow{font-size:14px}}
/* Slightly smaller typography inside purchase and help windows. */
.service-dialog-header h2{font-size:22px}
.service-dialog-header .eyebrow{font-size:12px}
.service-dialog-body>p:first-child,#shop .shop-option strong,#shop .shop-option b{font-size:14px}
#shop .shop-option>span:not(.option-mark),#shop .price-caption,.service-dialog-footer>p,.service-dialog-footer .support-secondary{font-size:13px}
.service-dialog-footer .primary{font-size:14px}
#help .service-dialog-body p,#help .service-dialog-body li,#help .product-guides>details>summary{font-size:14px}
#help .product-guides>details>summary span,#help .dialog-note,#help figcaption{font-size:13px}
#help .photo-step h3{font-size:16px}
@media(max-width:560px){.service-dialog-header h2{font-size:20px}.service-dialog-header .eyebrow{font-size:12px}}
/* Compact mobile chat; desktop retains its current size. */
@media(max-width:560px){
 #chat{width:calc(100% - 24px);max-width:350px;height:min(420px,68dvh);max-height:calc(100dvh - 24px);border-radius:15px}
 .chat-header{padding:10px 12px;gap:9px}#chat h2{font-size:15px}.chat-avatar{width:28px;height:28px;font-size:17px}#close-chat{width:32px;height:32px}
 #chat-messages{padding:10px;gap:9px;font-size:14px}
 #chat .chat-message{padding:8px 11px;max-width:92%}#chat .chat-message p{font-size:14px;line-height:1.5}#chat .chat-author{font-size:12px;margin-bottom:3px}#chat .chat-message small{font-size:11px}
 #chat-form{padding:8px;gap:6px}#chat-text{max-height:112px;font-size:16px}#chat-form .primary{min-width:80px;padding:0 9px;font-size:13px}
}
/* Slightly taller mobile chat. */
@media(max-width:560px){#chat{height:min(460px,74dvh)}}
/* Consistent compact type scale across the customer interface. */
:root{font-size:14px}
h1{font-size:23px}#form-description,.about-service p,.about-service summary{font-size:14px;line-height:1.6}.about-service h2{font-size:16px}
.top-actions strong{font-size:14px}.top-actions button>span{font-size:12px}
form>label,.iid-heading,#product-context{font-size:14px}
form>label span,.field-hint,#iid-count,#upload-caption,.text-button,.upload-button,.result-hint,.result-note,.benefits li,.demo-note,.demo-note button,.price-caption,.price-value,.support-secondary,.dialog-note{font-size:12px;line-height:1.55}
.information p{font-size:13px;line-height:1.6}.information .help-links button,.information .help-links [data-help]{font-size:14px}
.activation-steps li{font-size:12px}.activation-steps li>span,.iid-group>span,.code-part span,#product-status{font-size:12px}
.key-input-wrap input{font-size:16px}.iid-group input{font-size:17px}.code-part code{font-size:17px}
.activation-card .primary{font-size:14px}
#error-panel #error{font-size:14px}#error-detail{font-size:13px}#error-panel .support-chat,#error-panel .support-secondary{font-size:13px}
#chat h2{font-size:15px}.chat-header p{font-size:12px}
#chat-messages,#chat .chat-message,#chat .chat-message p{font-size:14px;line-height:1.5}
#chat .chat-author{font-size:12px}#chat .chat-message small{font-size:11px}
#chat-form label,#chat-error,#chat-notice,.chat-launch{font-size:12px}
#chat-form .primary{font-size:13px}#chat-text{font-size:14px}
#chat .chat-message{padding:8px 11px}
@media(min-width:561px){#chat{width:350px;height:480px}.chat-header{padding:11px 13px}#chat-messages{padding:12px;gap:10px}}
@media(max-width:540px){h1{font-size:21px}.key-input-wrap input{font-size:clamp(13px,3.6vw,15px)}.activation-steps li{font-size:12px}.iid-heading .text-button{font-size:12px}}
@media(max-width:560px){#chat-text{font-size:16px}}
/* Fit narrow phones and the visible area above the on-screen keyboard. */
.top-actions button,.activation-card,.iid-group,.shop-option,.service-dialog-body{min-width:0}
.top-actions strong,.top-actions button>span,.service-dialog-header h2,.shop-option strong{overflow-wrap:anywhere}
@media(max-width:560px){
 #chat{bottom:calc(max(12px,env(safe-area-inset-bottom)) + var(--keyboard-offset,0px));height:min(460px,74dvh,calc(var(--visible-height,100dvh) - 24px - env(safe-area-inset-bottom)));max-height:calc(var(--visible-height,100dvh) - 24px - env(safe-area-inset-bottom))}
 #chat-text{max-height:max(46px,min(112px,calc(var(--visible-height,100dvh) * .26)))}
}
@media(max-width:360px){
 .center{padding-left:10px;padding-right:10px}.activation-card{padding-left:14px;padding-right:14px}
 .top-actions{gap:6px}.top-actions button{padding-left:4px;padding-right:4px}.top-actions strong{font-size:13px}
 .activation-steps{gap:4px}.activation-steps li{font-size:12px}
 #iid-groups{gap:6px}.iid-group input{font-size:16px;letter-spacing:0}
 .information .help-links{gap:8px}.information .help-links [data-help]{padding:8px 10px}
 .shop-option{grid-template-columns:20px minmax(0,1fr) auto;column-gap:7px}.shop-option strong,.shop-option b{font-size:14px}
 #chat-form .primary{min-width:74px;padding-left:7px;padding-right:7px}
}
@media(max-height:450px){
 .service-dialog-header{padding:10px 16px}.service-dialog-header .eyebrow{display:none}.service-dialog-header h2{margin:0;font-size:20px}
 .service-dialog-footer{padding:10px 16px}.service-dialog-footer>p{margin-bottom:6px}.service-dialog-footer .primary{min-height:42px;padding:10px}
 #chat .chat-header{padding-top:7px;padding-bottom:7px}#chat-messages{padding-top:7px;padding-bottom:7px}
}
/* Additional questions and contact topics. */
.service-faq{width:100%;max-width:620px;margin-top:28px}
.service-faq h2{font-size:17px;line-height:1.4;margin:0 0 15px;color:#2a3e5c}
.service-faq details{border-bottom:1px solid #e0e7f1}.service-faq details:first-of-type{border-top:1px solid #e0e7f1}
.service-faq summary{display:flex;align-items:center;justify-content:space-between;gap:14px;list-style:none;cursor:pointer;padding:16px 2px;font-size:14px;font-weight:600;color:#3d5374;line-height:1.5}
.service-faq summary::-webkit-details-marker{display:none}.service-faq summary::after{content:'+';font-size:20px;color:#7c94b7;font-weight:400;flex-shrink:0}.service-faq details[open]>summary::after{content:'−'}.service-faq details[open]>summary{color:#2864e8}
.faq-answer{padding:0 2px 18px}.faq-answer p{font-size:13px;line-height:1.7;color:#697b94;margin:0 0 12px}.faq-answer button{font-size:13px;color:#2864e8;padding:5px 0;text-align:left;line-height:1.5}.faq-answer button:hover{text-decoration:underline}.faq-actions{display:flex;gap:18px;flex-wrap:wrap}
@media(max-width:540px){.service-faq{margin-top:23px;padding:0 5px}.service-faq summary{padding:14px 0}.faq-answer{padding-left:0;padding-right:0}}
.site-footer{width:100%;max-width:620px;margin:26px 0 0;padding-top:19px;border-top:1px solid #e0e7f1;text-align:center;color:#8290a5;font-size:12px}
.site-footer nav{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 20px;margin-top:8px}.site-footer button{font-size:12px;line-height:1.5;color:#6b7e9a;padding:4px 0}.site-footer button:hover{color:#2864e8;text-decoration:underline}
.legal-dialog{width:min(620px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - 48px);padding:0;border:1px solid #dfe7f2;border-radius:20px;overflow:hidden;background:#fff}.legal-dialog[open]{display:flex;flex-direction:column}.legal-dialog .service-dialog-header h2{font-size:21px}.legal-dialog .service-dialog-body{font-size:14px}.legal-dialog .service-dialog-body p{font-size:14px;line-height:1.7;color:#63748e}.legal-dialog h3{font-size:15px;color:#30496b;margin:22px 0 8px}.legal-dialog .legal-draft{padding:12px 14px;background:#fff7ed;border-radius:10px;color:#8d6541;font-size:13px}.legal-contact{font-size:14px;color:#2864e8;padding:8px 0}.contact-option{padding:0 0 18px;border-bottom:1px solid #e7edf5}.contact-option a{color:#2864e8}.contact-note{font-size:12px!important}.legal-dialog .primary{font-size:14px}
@media(max-width:560px){.legal-dialog{inset:auto 0 0;margin:0;width:100%;max-height:90dvh;border-radius:18px 18px 0 0}.legal-dialog .service-dialog-header h2{font-size:19px}.site-footer nav{gap:6px 14px}}
/* Compact page ending below the footer. */
.center{padding-bottom:24px}
@media(max-width:540px){.center{padding-bottom:20px}}
#iid-form .upload-row{margin-bottom:18px}
/* Smaller installation-code fields with a clear incomplete state. */
#iid-groups{gap:8px}.iid-group input{height:54px;font-size:15px;line-height:20px;letter-spacing:.5px;padding:23px 5px 7px}.iid-group>span{font-size:11px;line-height:14px;top:5px;left:8px}.iid-group input::placeholder{font-size:12px;letter-spacing:2px}
.iid-step #form-title{font-size:21px}.iid-step #form-description{font-size:13px;margin-bottom:20px}
#iid-form .primary:disabled{background:#dfe6f1;color:#8492a7;box-shadow:none;opacity:1;cursor:not-allowed}
@media(max-width:540px){#iid-groups{gap:6px}.iid-group input{height:52px;font-size:15px;letter-spacing:0;padding-top:22px}.iid-step #form-title{font-size:20px}}
/* Matching code tiles for installation and confirmation steps. */
#iid-groups,.code-grid{gap:10px}
#iid-groups{grid-template-columns:repeat(3,minmax(0,1fr))}
.code-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.iid-group input,.code-part{box-sizing:border-box;height:72px;border:1px solid #dce7f9;border-radius:10px;background:#f6f9ff}
.iid-group input{width:100%;padding:34px 3px 12px}
.iid-group>span{top:11px;left:0;width:100%;text-align:center;line-height:16px}
.iid-group>span,.code-part span{font-size:12px;color:#647ea7;font-weight:400}
.code-part{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:11px 3px;gap:7px}
.code-part span{margin:0;line-height:16px}
.iid-group input,.code-part code{font:17px/20px Consolas,monospace;letter-spacing:.5px;color:#3564b9}
.iid-group input::placeholder{font:inherit;letter-spacing:inherit;color:#a9bad4}
@media(max-width:540px){
 #iid-groups,.code-grid{gap:8px}
 .code-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .iid-group input{height:60px;padding:29px 3px 9px}
 .iid-group>span{top:7px;left:0;width:100%}
 .code-part{height:64px;flex-direction:column;justify-content:center;padding:9px 10px;gap:6px}
 .iid-group input,.code-part code{font-size:17px;letter-spacing:0}
 .iid-group input{font-size:clamp(14px,3.8vw,17px)}
}
/* Group letters sit above the outlined confirmation-code cells. */
.code-part{height:auto;padding:0;gap:7px;border:0;border-radius:0;background:transparent}
.code-part:hover,.code-part.copied{background:transparent}
.code-part span{font-size:14px;font-weight:600;line-height:20px;color:#30496b}
.code-part code{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;min-width:0;height:52px;border:1px solid #dce7f9;border-radius:10px;background:#f6f9ff}
.code-part:hover code,.code-part.copied code{background:#eaf1ff;border-color:#95b4ef}
@media(max-width:540px){.code-part code{height:46px}}
/* Phone navigation with safe areas and comfortable touch controls. */
.mobile-nav{display:none}
@media(max-width:540px){
 .center{padding-top:20px;padding-bottom:calc(86px + env(safe-area-inset-bottom));padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
 .brand{font-size:25px;margin-bottom:20px}.brand img{width:30px;height:30px}.activation-card{scroll-margin-top:16px;padding:22px 16px;border-radius:18px;box-shadow:0 5px 24px #193b7007}
 .mobile-nav{position:fixed;bottom:0;left:0;right:0;z-index:25;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:7px 10px calc(7px + env(safe-area-inset-bottom));border-top:1px solid #e2e8f2;background:#fff;box-shadow:0 -4px 18px #17243b06}
 .mobile-nav a,.mobile-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:46px;font-size:11px;color:#536b91}.mobile-nav a{color:#2864e8}.mobile-nav span{font-size:23px;line-height:20px}.mobile-nav svg{width:20px;height:20px}
 .chat-launch{display:none}#chat{z-index:60}.service-dialog,.legal-dialog{z-index:70}.text-button,.support-secondary,.site-footer button,.faq-answer button{min-height:44px;display:inline-flex;align-items:center;justify-content:center}.reset-button{display:flex}
 .top-actions{grid-template-columns:repeat(3,minmax(0,1fr))}.top-actions button{display:flex;align-items:center;padding:12px 4px;gap:4px}.top-actions strong{font-size:13px}.top-actions button>span{font-size:11px}.top-actions svg{width:18px;height:18px}
 .service-dialog-body{overscroll-behavior:contain}.site-footer nav{gap:2px 15px}.upload-button{min-height:44px}.shop-option{min-height:58px}
}
/* Keep the key field separated from its submit button. */
#key-form>.primary{margin-top:20px}
/* More prominent action for starting another activation. */
#reset,#change-key{font-size:16px;font-weight:600;line-height:1.5;min-height:48px;padding:12px 16px}
/* Align confirmation group labels with the left edge of their fields. */
.code-part span{align-self:stretch;text-align:left;padding-left:2px}
/* Place each confirmation letter beside its numeric field. */
.code-part{flex-direction:row;align-items:center;gap:8px}
.code-part span{align-self:center;flex:0 0 14px;width:14px;padding:0;text-align:left}
.code-part code{flex:1;width:auto;min-width:0}
@media(min-width:541px) and (max-width:680px){.code-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ocr-status{font-size:13px;line-height:1.6;color:#61718a;margin:12px 0}.ocr-status:empty{display:none}
#iid-form .ocr-review{display:flex;align-items:center;justify-content:flex-start;gap:10px;min-height:48px;margin:12px 0;padding:10px 12px;background:#edf4ff;border-radius:10px;color:#315894;font-size:14px;text-align:left}
#ocr-confirm{flex:0 0 20px;width:20px;height:20px;margin:0;padding:0;accent-color:#2864e8}
/* Full-screen purchase and instructions on mobile. */
@media(max-width:560px){
 #shop.service-dialog,#help.service-dialog{inset:0;margin:0;width:100%;height:100vh;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0;box-sizing:border-box}
 #shop .service-dialog-body,#help .service-dialog-body{flex:1;min-height:0}
 #shop .service-dialog-header,#help .service-dialog-header{padding-top:max(18px,env(safe-area-inset-top));padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
 #shop .service-dialog-footer,#help .service-dialog-footer{padding-bottom:max(16px,env(safe-area-inset-bottom))}
}/* Compact purchase and guide content. */
#shop .service-dialog-header,#help .service-dialog-header{padding:14px 18px;gap:12px}
#shop .service-dialog-header .eyebrow,#help .service-dialog-header .eyebrow{display:none}
#shop .service-dialog-header h2,#help .service-dialog-header h2{margin:0;font-size:20px}
#shop .service-dialog-body,#help .service-dialog-body{padding:14px 18px}
#shop .service-dialog-body>p:first-child,#help .service-dialog-body>p:first-child{margin-bottom:12px;line-height:1.5}
#shop .shop-options{gap:6px}
#shop .shop-option{padding:10px 12px;min-height:58px;border-radius:9px}
#shop .price-caption{margin:10px 0 0}
#shop .service-dialog-footer,#help .service-dialog-footer{padding:12px 18px}
#shop .service-dialog-footer>p,#help .service-dialog-footer>p{margin-bottom:8px}
#help .product-guides{margin:10px 0;border:0;border-radius:0}
#help .product-guides>details{margin-bottom:6px;padding:0 12px;border-radius:9px}
#help .product-guides>details>summary{padding:11px 0;min-height:44px;box-sizing:border-box}
#help .product-guides>details>summary span{margin-top:2px;line-height:1.4}
#help .photo-steps{padding:0 0 12px}
#help .photo-step{margin:16px 0 22px}
#help .photo-step h3{margin-bottom:7px;gap:8px}
#help .photo-step>p{margin-bottom:10px;line-height:1.6}
#help .dialog-note{margin:10px 0 0}
@media(max-width:560px){
 #shop .service-dialog-body,#help .service-dialog-body{flex:0 1 auto;padding:12px 16px}
 #shop .service-dialog-header,#help .service-dialog-header{padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left))}
 #shop .service-dialog-footer,#help .service-dialog-footer{padding:12px 16px max(12px,env(safe-area-inset-bottom))}
}
