@property --pos{syntax:"<percentage>";inherits:true;initial-value:50%}.cf-cmp{--pos:50%;--cf-ar:1.3333;width:min(100%, calc(var(--cf-cmp-h,62vh) * var(--cf-ar)));aspect-ratio:var(--cf-ar);border-radius:var(--radius-card);isolation:isolate;background:var(--bg-card);-webkit-user-select:none;user-select:none;animation:hg-reveal var(--motion-reveal) both;margin-inline:auto;position:relative;overflow:hidden}.cf-cmp:after{content:"";z-index:6;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--premium-gold);pointer-events:none;position:absolute;inset:0}.cf-cmp.is-compare{touch-action:pan-y;cursor:ew-resize}.cf-cmp.is-gliding{transition:--pos 1.5s cubic-bezier(.22,1,.36,1)}.cf-cmp-img{object-fit:cover;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0}.cf-cmp-after{position:absolute;inset:0}.cf-cmp.is-compare .cf-cmp-after{clip-path:inset(0 0 0 var(--pos))}.cf-cmp-result{opacity:0;transition:opacity .6s cubic-bezier(.22,1,.36,1)}.cf-cmp-result.is-in{opacity:1}.cf-cmp-tag{transition:opacity var(--motion-standard)}.cf-cmp-handle{z-index:4;top:0;bottom:0;left:var(--pos);cursor:ew-resize;outline:none;justify-content:center;align-items:center;width:48px;margin-left:-24px;display:flex;position:absolute}.cf-cmp-handle:before{content:"";background:var(--text-primary);width:2px;box-shadow:0 0 12px color-mix(in srgb, var(--bg-base) 50%, transparent);margin-left:-1px;position:absolute;top:0;bottom:0;left:50%}.cf-cmp-knob{border-radius:var(--radius-pill);background:var(--accent-primary);width:48px;height:48px;color:var(--accent-on);box-shadow:0 0 0 6px color-mix(in srgb, var(--accent-primary) 22%, transparent);justify-content:center;align-items:center;display:flex;position:relative}.cf-cmp-knob:after{content:"";border-radius:inherit;background:radial-gradient(closest-side, color-mix(in srgb, var(--accent-primary) 38%, transparent), transparent);z-index:-1;animation:hg-breathe var(--motion-breathe) infinite;position:absolute;inset:-14px}.cf-root .cf-cmp .cf-cmp-handle:focus-visible{outline:none}.cf-cmp-handle:focus-visible .cf-cmp-knob{outline:2px solid var(--text-primary);outline-offset:4px}.cf-cmp-overlay{z-index:5;position:absolute;bottom:12px;left:12px}.cf-cmp-chip{border-radius:var(--radius-pill);background:color-mix(in srgb, var(--bg-base) 62%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);height:36px;font:600 var(--type-caption-size) / 1 var(--font-body);color:var(--text-primary);cursor:pointer;border:none;align-items:center;gap:8px;padding:0 14px;display:inline-flex}.cf-cmp-chip:hover{background:color-mix(in srgb, var(--bg-base) 80%, transparent)}.cf-cmp-chip-sep{border-radius:var(--radius-pill);background:var(--text-secondary);width:3px;height:3px}.cf-res-grid{box-sizing:border-box;width:100%;max-width:680px;padding:var(--space-2) var(--screen-margin) calc(var(--space-8) + env(safe-area-inset-bottom,0px));gap:var(--space-6);flex-direction:column;flex:1;margin:0 auto;display:flex}.cf-res-stage{align-items:center;gap:var(--space-3);--cf-cmp-h:64vh;flex-direction:column;display:flex;position:relative}.cf-res-glow{opacity:.45}.cf-res-hint{font:400 var(--type-caption-size) / var(--type-caption-lh) var(--font-body);color:var(--text-tertiary);text-align:center;margin:0}.cf-res-panel{gap:var(--space-6);flex-direction:column;min-width:0;display:flex}.cf-res-head .cf-eyebrow{margin-bottom:var(--space-2)}.cf-res-meta{align-items:center;gap:var(--space-2) var(--space-3);margin:var(--space-2) 0 0;font:400 15px/1.4 var(--font-body);color:var(--text-secondary);flex-wrap:wrap;display:flex}.cf-res-meta:empty{display:none}.cf-res-pro{border-radius:var(--radius-pill);background:var(--premium-bg);height:24px;color:var(--premium-gold);font:600 12px/1 var(--font-body);align-items:center;padding:0 10px;display:inline-flex}.cf-res-actions{gap:var(--space-3);flex-direction:column;display:flex}.cf-res-save{width:100%}.cf-res-secondary{gap:var(--space-2);flex-wrap:wrap;display:flex}.cf-res-secondary .cf-pill{flex:auto}.cf-res-section{gap:var(--space-3);flex-direction:column;display:flex}.cf-res-label{font:600 14px/1.2 var(--font-body);color:var(--text-secondary);margin:0}.cf-res-thumbs{gap:var(--space-2);flex-wrap:wrap;display:flex}.cf-res-thumb{border-radius:var(--radius-thumbnail);background:var(--bg-card);cursor:pointer;width:64px;height:64px;transition:border-color var(--motion-standard), box-shadow var(--motion-standard);border:2px solid #0000;padding:0;overflow:hidden}.cf-res-thumb img{object-fit:cover;width:100%;height:100%;display:block}.cf-res-thumb[aria-pressed=true]{border-color:var(--border-selected);box-shadow:0 0 12px color-mix(in srgb, var(--accent-primary) 35%, transparent);cursor:default}.cf-res-feedback{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-3) var(--space-3) var(--space-4);border-radius:var(--radius-pill);background:var(--bg-elevated);font:500 15px/1.3 var(--font-body);color:var(--text-secondary);display:flex}.cf-res-feedback-btns{gap:var(--space-2);display:flex}.cf-res-feedback .hg-icon-btn[aria-pressed=true]{background:color-mix(in srgb, var(--accent-primary) 16%, var(--bg-card));border-color:var(--border-selected);color:var(--text-primary)}.cf-res-prompt{font:400 15px/1.5 var(--font-body);color:var(--text-primary);margin:0}.cf-advisory{gap:var(--space-3);padding:var(--space-4);border-radius:var(--radius-card);background:var(--bg-elevated);border:1px solid color-mix(in srgb, var(--accent-cool) 35%, var(--border-subtle));align-items:flex-start;display:flex}.cf-advisory-icon{border-radius:var(--radius-pill);background:color-mix(in srgb, var(--accent-cool) 16%, transparent);width:32px;height:32px;color:var(--accent-cool);flex-shrink:0;justify-content:center;align-items:center;display:flex}.cf-advisory-text{font:400 14px/1.5 var(--font-body);color:var(--text-secondary);flex-direction:column;gap:4px;display:flex}.cf-advisory-reasons{color:var(--text-primary);flex-direction:column;gap:2px;margin:0;padding-inline-start:18px;display:flex}.cf-advisory-text strong{font:600 15px/1.35 var(--font-body);color:var(--text-primary)}.cf-res .cf-top{grid-template-columns:44px minmax(0,1fr) auto}@media (min-width:768px){.cf-res-stage{--cf-cmp-h:58vh}}@media (min-width:1024px){.cf-res-grid{gap:var(--space-10);max-width:1520px;min-height:0;padding:var(--space-2) var(--space-8) var(--space-8);flex-direction:row}.cf-res-stage{--cf-cmp-h:calc(100cqh - 40px);flex:1;justify-content:center;min-width:0;min-height:0;container-type:size}.cf-res-panel{width:clamp(360px,28vw,420px);min-height:0;scrollbar-gutter:stable;flex-shrink:0;margin-inline-end:calc(-1 * var(--space-2));padding-inline-end:var(--space-2);overflow-y:auto}.cf-res-head .cf-title{font-size:36px}}@media (prefers-reduced-motion:reduce){.cf-cmp,.cf-cmp-knob:after{animation:none}.cf-cmp-result,.cf-cmp-tag,.cf-res-thumb{transition:none}}.cf-reuse-lede{font:400 var(--type-body-size) / var(--type-body-lh) var(--font-body);color:var(--text-secondary);margin:0}
