.xh{max-width:1180px}.xh-field{background-image:linear-gradient(135deg,#996cfc1f,#0000),url(/home/icon-x-320.webp)}.xh-source{border:0;grid-template-columns:1fr 1fr;gap:8px;width:100%;max-width:620px;margin:0;padding:0;display:grid}.xh-source legend{color:var(--on-navy-2);margin-bottom:8px;font-size:15px;font-weight:700}.xh-source button{border:1px solid var(--edge);background:var(--raised);min-height:44px;color:var(--on-navy-2);font:inherit;cursor:pointer;border-radius:10px;font-weight:800}.xh-source button[aria-pressed=true]{border-color:var(--cn-gold);background:color-mix(in srgb, var(--cn-gold) 15%, var(--raised));color:var(--cn-cream)}.xh-progress{box-sizing:border-box;border:1px solid var(--edge);background:var(--raised);border-radius:12px;align-items:center;gap:13px;width:100%;max-width:620px;padding:13px 15px;display:flex}.xh-progress>span{border:3px solid color-mix(in srgb, var(--cn-gold) 25%, transparent);border-top-color:var(--cn-gold);border-radius:50%;flex:none;width:27px;height:27px;animation:.8s linear infinite scan-turn}.xh-progress div{gap:2px;display:grid}.xh-progress b{color:var(--cn-cream);font-size:14.5px}.xh-progress small{color:var(--on-navy-2)}.xh-promise{grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;width:min(680px,100%);margin:30px auto 0;display:grid}.xh-promise>div{border:1px solid var(--cn-rule);background:var(--cn-white);text-align:center;border-radius:16px;gap:3px;min-width:0;padding:18px;display:grid}.xh-promise b{font-size:17px}.xh-promise span{color:var(--cn-ink-2);font-size:14px}.xh-promise>span{color:var(--cn-purple);font-size:25px;font-weight:900}.xh-examples{max-width:960px}.xh-examples ul{grid-template-columns:minmax(0,1fr);gap:16px}.xh-examples li{border-radius:16px}.xh-examples img{aspect-ratio:3;object-fit:cover}.xh-result{scroll-margin-top:24px}.xh-result-head{justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px;display:flex}.xh-result-head h2{letter-spacing:-.035em;margin:0;font-size:clamp(24px,4vw,34px)}.xh-result-head p{color:var(--cn-ink-2);margin:5px 0 0}.xh-result-head-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.xh-result-head button{border:1px solid var(--cn-rule);background:var(--cn-white);color:var(--cn-navy);font:inherit;cursor:pointer;border-radius:10px;flex:none;padding:10px 15px;font-weight:800}.xh-result-head-actions button:first-child{border-color:color-mix(in srgb, var(--cn-purple) 55%, var(--cn-rule));color:var(--cn-purple)}.xh-photo-progress{background:color-mix(in srgb, var(--cn-purple) 9%, var(--cn-white));color:var(--cn-ink-2);border-radius:10px;margin-bottom:13px;padding:9px 12px;font-size:13px;font-weight:700;position:relative;overflow:hidden}.xh-photo-progress span{background:var(--cn-purple);height:3px;transition:width .15s;position:absolute;inset:auto auto 0 0}.xh-tabs{background:color-mix(in srgb, var(--cn-navy) 8%, var(--cn-white));border-radius:14px;grid-template-columns:1fr 1fr;gap:5px;padding:5px;display:inline-grid}.xh-tabs button{min-width:160px;color:var(--cn-ink-2);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:10px;padding:10px 15px;font-weight:800}.xh-tabs button[aria-selected=true]{background:var(--cn-white);color:var(--cn-navy);box-shadow:0 4px 18px #00123b1a}.xh-tabs small{color:var(--cn-purple);margin-left:5px;font-weight:900}.xh-work{grid-template-columns:minmax(0,1fr) 270px;align-items:start;gap:22px;margin-top:14px;display:grid}.xh-preview{border:1px solid var(--cn-rule);background:var(--cn-white);border-radius:18px;min-width:0;padding:12px;box-shadow:0 20px 50px -38px #00123b8c}.xh-profile-preview{background:#000;border-radius:12px;padding-bottom:82px;position:relative;overflow:hidden}.xh-profile-preview canvas{aspect-ratio:3;width:100%;height:auto;display:block}.xh-owner{aspect-ratio:1;background:var(--cn-purple);width:18%;color:var(--cn-white);border:clamp(3px,.5vw,6px) solid #000;border-radius:50%;place-items:center;font-size:clamp(30px,6vw,80px);font-weight:900;display:grid;position:absolute;top:calc(82% - 82px);left:4.2%;overflow:hidden}.xh-owner img{object-fit:cover;width:100%;height:100%}.xh-profile-bar{color:#fff;align-items:baseline;gap:8px;display:flex;position:absolute;bottom:20px;left:24%;right:3%}.xh-profile-bar b{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:clamp(14px,2.2vw,25px);overflow:hidden}.xh-profile-bar span{text-overflow:ellipsis;white-space:nowrap;color:#8b98a5;min-width:0;font-size:clamp(11px,1.4vw,16px);overflow:hidden}.xh-video-preview{width:min(620px,100%);margin:0 auto;position:relative}.xh-video-preview canvas{aspect-ratio:1;background:var(--cn-navy);border-radius:12px;width:100%;height:auto;display:block}.xh-video-preview--header{width:100%}.xh-video-preview--header canvas{aspect-ratio:3}.xh-video-preview button{color:#fff;font:inherit;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#00123bd1;border:1px solid #ffffff6b;border-radius:999px;padding:10px 16px;font-size:13px;font-weight:800;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.xh-video-preview button:disabled{opacity:.65;cursor:default}.xh-controls{border:1px solid var(--cn-rule);background:var(--cn-white);border-radius:16px;gap:19px;padding:19px;display:grid}.xh-controls fieldset{border:0;min-width:0;margin:0;padding:0}.xh-controls legend{margin-bottom:9px;font-size:14px;font-weight:900}.xh-formats{grid-template-columns:1fr 1fr;gap:7px;display:grid}.xh-formats button{border:1px solid var(--cn-rule);background:var(--cn-cream);min-width:0;color:var(--cn-navy);font:inherit;cursor:pointer;text-align:center;border-radius:9px;gap:2px;padding:9px 6px;display:grid}.xh-formats button[aria-pressed=true]{border-color:var(--cn-purple);background:color-mix(in srgb, var(--cn-purple) 12%, var(--cn-white));box-shadow:inset 0 0 0 1px var(--cn-purple)}.xh-formats b{font-size:13px}.xh-formats span{color:var(--cn-ink-3);font-size:11px}.xh-swatches{flex-wrap:wrap;gap:9px;display:flex}.xh-swatches button{border:2px solid var(--cn-white);width:34px;height:34px;box-shadow:0 0 0 1px var(--cn-rule);cursor:pointer;border-radius:50%}.xh-swatches button[aria-pressed=true]{box-shadow:0 0 0 3px var(--cn-purple)}.xh-counts{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.xh-counts button{border:1px solid var(--cn-rule);background:var(--cn-cream);min-width:0;color:var(--cn-navy);font:inherit;cursor:pointer;border-radius:8px;padding:8px 3px;font-size:13px;font-weight:800}.xh-counts button[aria-pressed=true]{border-color:var(--cn-purple);background:color-mix(in srgb, var(--cn-purple) 12%, var(--cn-white))}.xh-actions{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}.xh-actions button{min-height:48px;font:inherit;cursor:pointer;border-radius:11px;padding:0 20px;font-weight:900}.xh-primary{background:var(--cn-purple);color:var(--cn-white);border:0}.xh-primary:hover:not(:disabled){background:color-mix(in srgb, var(--cn-purple) 80%, var(--cn-navy))}.xh-secondary{border:1px solid var(--cn-rule);background:var(--cn-white);color:var(--cn-navy)}.xh-actions button:disabled{opacity:.56;cursor:default}.xh-message{color:var(--cn-navy);margin:11px 0 0;font-size:14px;font-weight:750}.xh-note{color:var(--cn-ink-3);margin:12px 0 0;font-size:13px;line-height:1.5}@media (max-width:820px){.xh-work{grid-template-columns:1fr}.xh-controls{grid-template-columns:1fr 1fr}.xh-controls .xc-range,.xh-controls .xc-check{grid-column:1/-1}}@media (max-width:600px){.xh-field{background-image:linear-gradient(135deg,#996cfc1f,#0000);padding-right:20px}.xh-promise{grid-template-columns:1fr;gap:8px}.xh-promise>span{transform:rotate(90deg)}.xh-result-head{align-items:flex-start}.xh-result-head-actions{justify-content:flex-start}.xh-tabs{box-sizing:border-box;width:100%}.xh-tabs button{min-width:0;padding-inline:8px}.xh-controls{grid-template-columns:1fr}.xh-profile-preview{padding-bottom:62px}.xh-owner{top:calc(82% - 62px)}.xh-profile-bar{bottom:15px}.xh-examples ul{grid-template-columns:none}}@media (prefers-reduced-motion:reduce){.xh-progress>span{border-color:var(--cn-gold);animation:none}}
