.wd-scene{isolation:isolate;background:#173049;border-radius:28px;grid-template-columns:300px minmax(0,1fr);gap:40px;min-height:660px;padding:32px;display:grid;position:relative;overflow:hidden}.wd-background{object-fit:cover;z-index:-2;width:100%;height:100%;position:absolute;inset:0}.wd-scene:before{content:"";z-index:-1;background:linear-gradient(90deg,#0b20334d,#06162555);position:absolute;inset:0}.wd-controls{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#173e65;background:#f3f9ffd1;border:1px solid #ffffff90;border-radius:22px;flex-direction:column;gap:24px;padding:26px;display:flex;box-shadow:0 12px 40px #061a3022}.wd-controls h3{margin:0;font-family:Manrope,sans-serif;font-size:22px;font-weight:600}.wd-controls fieldset{border:0;min-width:0;margin:0;padding:0}.wd-controls legend{margin-bottom:14px;font:600 14px Manrope,sans-serif}.wd-swatches{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.wd-swatches button{aspect-ratio:1;cursor:pointer;background:0 0;border:1px solid #8da6bd77;border-radius:50%;width:100%;max-width:48px;padding:3px;transition:transform .25s,border-color .25s,box-shadow .25s;position:relative}.wd-swatches button img{object-fit:cover;border-radius:50%;width:100%;height:100%}.wd-swatches button:hover{transform:translateY(-2px)}.wd-swatches button[aria-pressed=true]{border:2px solid #259ce8;box-shadow:0 0 0 3px #219af626}.wd-swatches button:focus-visible{outline-offset:3px;outline:3px solid #259ce8}.wd-swatches button span{color:#fff;text-shadow:0 1px 3px #000;background:#001d3355;border-radius:50%;place-items:center;font-size:20px;display:grid;position:absolute;inset:4px}.wd-choice{border-top:1px solid #90abc344;gap:6px;margin-top:auto;padding-top:18px;display:grid}.wd-choice>span{opacity:.7;font-size:12px}.wd-choice strong{font:600 17px Manrope,sans-serif}.wd-preview{flex-direction:column;justify-content:center;align-items:center;gap:20px;min-width:0;display:flex}.wd-window{object-fit:contain;filter:drop-shadow(0 20px 24px #0005);width:100%;max-width:590px;height:520px;animation:.45s both wd-appear}.wd-caption{color:#fff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);text-align:center;background:#0c253bb3;border:1px solid #fff4;border-radius:100px;padding:12px 24px;font:600 17px Manrope,sans-serif}.wd-controls strong,.wd-controls legend{color:inherit}@keyframes wd-appear{0%{opacity:.3}to{opacity:1}}@media (width<=900px){.wd-scene{grid-template-columns:260px minmax(0,1fr);gap:24px;padding:24px}.wd-controls{padding:20px}.wd-window{height:440px}}@media (width<=650px){.wd-scene{border-radius:22px;flex-direction:column;gap:18px;min-height:0;padding:16px;display:flex}.wd-preview{order:-1}.wd-window{height:300px}.wd-controls{gap:20px}.wd-swatches{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.wd-caption{padding:9px 18px;font-size:14px}.wd-controls legend{font-size:13px}.wd-choice{padding-top:12px}}@media (prefers-reduced-motion:reduce){.wd-window{animation:none}.wd-swatches button{transition:none}}.wd-background{filter:none;animation:none;transform:none}.wd-night-image{object-fit:cover;z-index:-2;opacity:0;pointer-events:none;width:100%;height:100%;animation:28s ease-in-out infinite wd-photo-night;position:absolute;inset:0}.wd-controls{-webkit-backdrop-filter:blur(2px);color:#fff;text-shadow:0 1px 4px #000f1ecc;background:#e1f1ff24;border:1px solid #ffffff73;box-shadow:inset 0 1px #ffffff4d,0 12px 36px #0514261f}html[data-vn-theme=night] .wd-controls{color:#fff;background:#10233724;border-color:#e1f4ff66}.wd-choice{border-top-color:#ffffff52}@keyframes wd-photo-night{0%,15%,to{opacity:0}45%,65%{opacity:1}}@media (prefers-reduced-motion:reduce){.wd-night-image{opacity:0;animation:none}}