:root{--ink:#171713;--gold:#c79235;--paper:#f5f0e6}*{box-sizing:border-box}html,body{min-height:100%;color:var(--ink);background:#121210;margin:0;font-family:Arial,Helvetica,sans-serif}button,label,a{font:inherit;-webkit-tap-highlight-color:transparent}.tryon-shell{background:var(--paper);grid-template-rows:66px 1fr;max-width:1120px;height:100dvh;margin:auto;display:grid;overflow:hidden}.topbar{z-index:30;background:#fbfaf7;border-bottom:1px solid #ddd6c8;justify-content:space-between;align-items:center;padding:0 21px;display:flex}.topbar>span{text-transform:uppercase;letter-spacing:.2em;color:#79736a;font-size:10px}.topbar>button{cursor:pointer;background:0 0;border:0;width:44px;height:44px;font:32px Georgia,serif}.brand{color:var(--ink);text-align:center;flex-direction:column;line-height:1;text-decoration:none;display:flex}.brand b{letter-spacing:.28em;font:23px Georgia,serif}.brand small{letter-spacing:.48em;margin-top:6px;font-size:6px}.stage{background:radial-gradient(circle at 50% 24%,#fbf7ef,#e5dbcb);position:relative;overflow:hidden}.welcome{text-align:center;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:24px 20px 48px;display:flex}.hero-wrist{background:linear-gradient(145deg,#282420,#0d0d0c);border-radius:110px;width:min(470px,74vw);height:165px;margin-bottom:22px;position:relative;overflow:hidden;box-shadow:0 22px 55px #36260c38}.wrist-shape{background:linear-gradient(90deg,#9e654d,#d6a181 48%,#a66850);border-radius:45%;height:190%;position:absolute;top:-44%;left:16%;right:16%;transform:rotate(-4deg)}.hero-wrist img{filter:drop-shadow(0 5px 5px #00000061);width:72%;position:absolute;top:47%;left:14%;transform:translateY(-50%)rotate(-4deg)}.eyebrow{letter-spacing:.24em;color:#9b712c;margin:0 0 13px;font-size:9px;font-weight:800}.welcome h1{letter-spacing:-.045em;margin:0;font:400 clamp(42px,7vw,68px)/.92 Georgia,serif}.welcome h1 em{color:var(--gold);font-weight:400}.intro{color:#756f65;max-width:490px;margin:20px 0;font-size:13px;line-height:1.6}.actions{gap:10px;display:flex}.actions button,.actions label{border:1px solid var(--ink);text-transform:uppercase;letter-spacing:.09em;cursor:pointer;padding:16px 23px;font-size:11px}.actions button{background:var(--ink);color:#fff}.actions label{background:#fff}.welcome>input{display:none}.welcome>small{color:#8b857d;margin-top:16px;font-size:9px}.photo-frame{touch-action:none;background:#d9d0c1;position:absolute;inset:0 0 116px;overflow:hidden}.customer-photo{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.hand-guide{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:4% 8% 12%}.hand-guide span{color:#fff;letter-spacing:.05em;background:#0009;padding:9px 12px;font-size:9px;position:absolute;bottom:0}.hand-silhouette{border:2px dashed #ffffffeb;border-radius:46% 46% 34% 34%;width:48%;height:86%;position:relative}.hand-silhouette i{border:2px dashed #ffffffeb;border-bottom:0;border-radius:50% 50% 0 0;width:14%;height:35%;position:absolute;top:-18%}.hand-silhouette i:first-child{height:29%;top:-8%;left:8%}.hand-silhouette i:nth-child(2){height:36%;top:-16%;left:25%}.hand-silhouette i:nth-child(3){height:40%;top:-20%;left:43%}.hand-silhouette i:nth-child(4){height:35%;top:-15%;left:61%}.hand-silhouette i:nth-child(5){height:27%;top:-6%;left:78%}.hand-silhouette b{border:2px dashed #ffffffeb;border-left:0;border-radius:0 70% 70% 0;width:42%;height:30%;position:absolute;bottom:8%;right:-28%;transform:rotate(-16deg)}.shutter{cursor:pointer;background:0 0;border:3px solid #fff;border-radius:50%;width:66px;height:66px;padding:5px;position:absolute;bottom:25px;left:50%;transform:translate(-50%)}.shutter i{background:#fff;border-radius:50%;width:100%;height:100%;display:block}.bracelet-overlay{transform-origin:50%;z-index:8;touch-action:none;cursor:grab;filter:drop-shadow(0 3px 3px #2a180261);margin:-34px -18px;padding:34px 18px;position:absolute}.bracelet-overlay img{pointer-events:none;width:100%;height:auto;display:block}.picker{z-index:20;position:absolute;top:18px;left:18px}.picker-trigger{color:#fff;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;background:#121210d6;border:1px solid #ffffff59;justify-content:space-between;gap:18px;min-width:218px;padding:14px;font-size:11px;display:flex}.picker-trigger i{color:#dfb560;font:18px Georgia,serif}.picker-menu{background:#faf8f2fa;width:300px;margin-top:7px;padding:17px;box-shadow:0 18px 50px #0000003d}.picker-menu p{text-transform:uppercase;letter-spacing:.13em;color:#777168;margin:0 0 10px;font-size:9px}.picker-menu>div{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.picker-menu button{cursor:pointer;background:#fff;border:1px solid #d8d1c5;min-height:42px}.picker-menu button.active{background:var(--ink);color:#fff;border-color:var(--ink)}.picker-menu .apply{background:var(--gold);color:#fff;border-color:var(--gold);text-transform:uppercase;letter-spacing:.1em;width:100%;margin-top:9px}.fit-status{z-index:12;color:#fff;letter-spacing:.06em;white-space:nowrap;background:#0c0c0aeb;border:1px solid #deb763b8;border-radius:7px;padding:11px 15px;font-size:10px;font-weight:700;position:absolute;top:21px;left:50%;transform:translate(-50%)}.fit-status i{background:#5bc271;border-radius:50%;width:7px;height:7px;margin-right:8px;display:inline-block}.fit-status.working i{background:#e5b354}.change-photo{z-index:12;color:#fff;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;background:#11110fbf;border:1px solid #ffffff59;padding:13px;font-size:9px;position:absolute;top:18px;right:18px}.fine-fit{z-index:18;color:#fff;background:#0c0c0af0;border:1px solid #deb763bf;border-radius:8px;width:min(440px,100% - 36px);padding:13px 16px 14px;position:absolute;bottom:101px;left:50%;transform:translate(-50%);box-shadow:0 8px 28px #00000061}.fine-fit label{text-transform:uppercase;letter-spacing:.08em;color:#d0cbc0;grid-template-columns:1fr auto 1fr;align-items:center;margin-bottom:7px;font-size:8px;display:grid}.fine-fit label b{color:#fff;letter-spacing:.1em;font-size:10px}.fine-fit label span:last-child{text-align:right}.fine-fit input{accent-color:#e0ad50;width:100%;height:7px;display:block}.result{z-index:15;background:#faf8f2f7;justify-content:space-between;align-items:center;gap:15px;padding:14px 15px;display:flex;position:absolute;bottom:18px;left:18px;right:18px;box-shadow:0 8px 28px #0000002e}.result div{flex-direction:column;gap:5px;display:flex}.result small{text-transform:uppercase;letter-spacing:.13em;color:#857f74;font-size:8px}.result b{font:400 17px Georgia,serif}.result a{background:var(--ink);color:#fff;text-transform:uppercase;letter-spacing:.09em;white-space:nowrap;padding:14px 16px;font-size:9px;text-decoration:none}.result a span{color:#e2b766;margin-left:7px}@media (width<=620px){.tryon-shell{grid-template-rows:56px 1fr}.topbar{padding:0 12px}.topbar>span{display:none}.welcome{padding-bottom:70px}.hero-wrist{width:88vw;height:135px}.actions{flex-direction:column;width:100%;max-width:290px}.actions button,.actions label{width:100%}.photo-frame{inset:0 0 176px}.hand-guide{inset:7% 2% 13%}.hand-silhouette{width:64%;height:76%}.picker{top:10px;left:10px}.picker-trigger{min-width:205px;padding:12px 11px;font-size:10px}.picker-menu{width:min(300px,100vw - 20px)}.fit-status{font-size:8px;top:61px}.change-photo{width:41px;height:41px;padding:0;font-size:0;top:10px;right:10px}.change-photo:after{content:"↻";font-size:19px}.fine-fit{width:calc(100% - 20px);padding:9px 12px;bottom:84px}.result{padding:11px;bottom:10px;left:10px;right:10px}.result b{font-size:14px}.result a{padding:13px 11px}.hand-guide span{bottom:48px}}.hero-wrist{aspect-ratio:3/2;background:#0d0d0c;border-radius:22px;width:min(510px,82vw);height:auto}.hero-wrist img{object-fit:contain;object-position:center;filter:none;width:100%;height:100%;display:block;position:static;transform:none}@media (width<=620px){.hero-wrist{width:92vw;max-width:430px;height:auto}}.hand-outline{filter:drop-shadow(0 2px 4px #00000040);width:min(52%,360px);height:88%;display:block;overflow:visible}.hand-outline path{fill:#ffffff09;stroke:#fffffff5;stroke-width:3px;stroke-dasharray:9 8;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}@media (width<=620px){.hand-outline{width:78%;height:82%}}.hand-contour{object-fit:contain;filter:drop-shadow(0 2px 4px #00000059);opacity:.97;width:auto;max-width:88%;height:88%;display:block;transform:rotate(-7deg)}@media (width<=620px){.hand-contour{max-width:98%;height:96%;transform:translate(-1%,-1%)rotate(-10deg)scale(1.06)}}