:root{--text: #221a26;--glass-bg: rgba(255, 255, 255, .22);--glass-bg-strong: rgba(255, 255, 255, .28);--glass-border: rgba(255, 255, 255, .42);--glass-highlight: rgba(255, 255, 255, .55);--glass-shadow: 0 10px 28px rgba(0, 0, 0, .22);--glass-r: 16px;--focus: rgba(255, 255, 255, .55)}body{margin:0;padding:0}.ad{position:relative;overflow:hidden;border-radius:18px;box-shadow:0 14px 34px #00000038;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:transparent}.bg{position:absolute;inset:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover;display:block;transform:scale(1.01);-webkit-user-select:none;user-select:none;pointer-events:none}.ad:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(80% 60% at 20% 10%,rgba(0,0,0,.08),transparent 60%),linear-gradient(to top,rgba(0,0,0,.18),transparent 58%);border-radius:inherit}.glass{position:relative;border-radius:var(--glass-r);background:var(--glass-bg);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);backdrop-filter:blur(14px) saturate(180%);-webkit-backdrop-filter:blur(14px) saturate(180%);overflow:hidden}.glass:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,var(--glass-highlight),rgba(255,255,255,0) 55%),radial-gradient(120% 90% at 20% 0%,rgba(255,255,255,.22),transparent 55%);opacity:.65}.swatches{position:absolute;z-index:2;left:10px;top:41%;transform:translateY(-50%);padding:10px;display:flex;flex-direction:column;gap:8px;align-items:center}.swatch{--swatch: #000;width:26px;height:26px;border-radius:999px;border:1px solid rgba(255,255,255,.55);background:var(--swatch);cursor:pointer;box-shadow:0 8px 18px #0000002e;transition:transform .12s ease,box-shadow .12s ease}.swatch:hover{transform:translateY(-1px);box-shadow:0 10px 22px #00000038}.swatch.isSelected{box-shadow:0 0 0 3px #ffffff8c,0 10px 22px #00000038}.swatch:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus),0 10px 22px #00000038}.cta{position:absolute;z-index:2;left:10px;right:10px;bottom:10px;height:40px;border-radius:var(--glass-r);border:1px solid rgba(255,255,255,.38);color:#fffffff5;font-weight:800;font-size:16px;letter-spacing:.25px;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;box-shadow:0 12px 26px #00000047,inset 0 1px #ffffff38;text-shadow:0 1px 2px rgba(0,0,0,.55),0 0 14px rgba(0,0,0,.25);transition:transform .12s ease,background .12s ease,border-color .12s ease}.cta.glass:before{opacity:.35}.cta:after{content:"→";font-size:14px;line-height:1;opacity:.9;transform:translateY(-.5px);transition:all .2s ease}.cta:hover{background:#897d9b94;border-color:#c7b8b87a}.cta:hover:after{transform:translate(8px)}.cta:active{transform:translateY(0) scale(.95)}.cta:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus),0 12px 26px #00000047,inset 0 1px #ffffff38}