:root{color:#2a2115;font-synthesis:none;text-rendering:optimizelegibility;background:#f9f9f9;font-family:Georgia,Times New Roman,serif}*{box-sizing:border-box}html,body,#root{overscroll-behavior:none;background:#f9f9f9;width:100%;height:100%;margin:0;overflow:hidden}html{position:fixed;inset:0}body{background:#f9f9f9;min-width:280px;height:100dvh;position:fixed;inset:0}button{font:inherit}.watch-experience{width:100%;height:100dvh;padding:max(8px, env(safe-area-inset-top)) max(4px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(4px, env(safe-area-inset-left));isolation:isolate;grid-template-rows:1fr auto;place-items:center;display:grid;position:relative;overflow:hidden}.watch-viewport{perspective:900px;align-self:center;width:min(96vw,610px);height:min(143vw,100dvh - 42px,810px);min-height:390px;position:relative}.art-layer{--lock-left:0%;--lock-top:0%;--lock-width:0%;--lock-height:0%;width:100%;aspect-ratio:var(--art-ratio);transform-origin:50% 28%;transform-style:preserve-3d;will-change:opacity, transform, filter;position:absolute;top:50%;left:50%}.art-image{pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;display:block;position:absolute;inset:0}.art-image--lid-front{clip-path:ellipse(43.35% 28.6% at 50.35% 64.3%)}.art-image--body{z-index:1}.art-layer--segmented{opacity:1;z-index:2;transform:translate(-50%,-50%)}.lock-layer{z-index:3;width:100%;aspect-ratio:var(--art-ratio);backface-visibility:hidden;will-change:transform;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.watch-lid{z-index:4;transform-origin:50.35% 92.8%;transform-style:preserve-3d;backface-visibility:hidden;will-change:transform, opacity, filter;position:absolute;inset:0;transform:rotateX(0)}.watch-lid .art-image--lid-front{backface-visibility:hidden}.watch-lid-inside-proxy{z-index:4;opacity:0;transform-origin:50% 0;pointer-events:none;will-change:transform, opacity;background:radial-gradient(at 50% 18%,#ffe087eb,#b5711ff2 56%,#5d3109fa 100%);border:clamp(2px,.7vw,5px) solid #71410deb;border-radius:50%;width:85.8%;height:8.2%;position:absolute;top:92.4%;left:7.4%;transform:translateY(-36%)scaleY(.08);box-shadow:inset 0 5px 10px #ffe28c61,inset 0 -7px 10px #411f0473,0 5px 7px #3d270e24}.lock-positioner{left:var(--lock-left);top:var(--lock-top);width:var(--lock-width);height:var(--lock-height);z-index:8;position:absolute}.combination-lock{grid-template-columns:repeat(5,minmax(0,1fr));gap:3.5%;width:100%;height:100%;display:grid}.letter-cylinder-shell{border-radius:12%/7%;min-width:0;height:100%;position:relative;overflow:hidden}.letter-cylinder{--reel-offset:0px;--letter-pitch:min(44px, 6.93vw);color:#28180a;cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:linear-gradient(90deg,#411d036b,#0000 17%,#ffe78f47 45%,#0000 72%,#491f027a),linear-gradient(#7c430c 0%,#c17d22 10%,#e5ae4d 45%,#d28c2b 75%,#77400c 100%);border:1px solid #5b3008cc;border-radius:12%/7%;outline:none;width:100%;min-width:0;height:100%;margin:0;padding:0;position:relative;overflow:hidden;box-shadow:inset 1px 0 1px #ffe0808f,inset -1px 0 2px #3918028c,0 0 0 .5px #f4c35599}.native-switch-overlay{z-index:7;border-radius:inherit;opacity:.001;appearance:auto;clip-path:inset(0 round 12% 7%);pointer-events:none;touch-action:none;border:0;width:100%;height:100%;margin:0;padding:0;display:block;position:absolute;inset:0;overflow:hidden}.native-switch-overlay.is-enabled:not(:disabled){pointer-events:auto}.letter-cylinder:before,.letter-cylinder:after{content:"◆";z-index:4;color:#4b2405a8;text-shadow:0 1px #ffd66873;pointer-events:none;font-size:clamp(6px,1.55vw,13px);line-height:1;position:absolute;left:50%;transform:translate(-50%)scaleX(.72)}.letter-cylinder:before{top:5%}.letter-cylinder:after{bottom:4%}.letter-cylinder:focus-visible{box-shadow:inset 0 0 0 2px #ffefb0eb,0 0 0 2px #4b2d0cd1}.letter-cylinder:disabled{cursor:default;opacity:1}.letter-cylinder.is-locked{cursor:default}.cylinder-glint{z-index:3;pointer-events:none;background:linear-gradient(#361600d1,#441d027a 24%,#0000 39% 61%,#3e1a0180 76%,#321500d6),linear-gradient(100deg,#0000 18%,#fff2b74d 43%,#0000 62%);position:absolute;inset:0}.letter-reel{width:100%;transform:translateY(calc(-50% + var(--reel-offset)));will-change:transform;flex-direction:column;align-items:center;display:flex;position:absolute;top:50%;left:0}.is-settling .letter-reel{transition:transform .17s cubic-bezier(.18,.72,.22,1)}.reel-letter{flex:0 0 var(--letter-pitch);color:#241509;width:100%;font-size:clamp(18px,5.4vw,39px);font-weight:700;line-height:var(--letter-pitch);text-shadow:0 1px #ffe086cc,0 -1px #41180052;place-items:center;display:grid}.is-engaged{filter:brightness(1.04);transform:scaleX(.97)}.state-unlocking .art-layer--segmented,.state-unlocking .lock-layer{animation:.39s cubic-bezier(.3,.7,.35,1) both unlock-shudder}.state-opening .art-layer--segmented,.state-opening .lock-layer{animation:.85s cubic-bezier(.22,.68,.24,1) both case-open-settle}.state-opening .watch-lid{animation:.82s cubic-bezier(.2,.64,.22,1) both lid-swing-open}.state-open .watch-lid{opacity:0;transform:rotateX(-100deg)}.state-opening .watch-lid-inside-proxy{animation:.43s cubic-bezier(.18,.7,.22,1) .39s both lid-inside-arrive}.state-open .watch-lid-inside-proxy{opacity:1;transform:translateY(0)scaleY(1)}.watch-hands{z-index:3;opacity:0;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;transition:opacity .28s ease-out;display:block;position:absolute;inset:0;overflow:visible}.watch-hands.is-visible{opacity:1}.watch-hand{will-change:transform}.interaction-hint{left:50%;bottom:max(10px, env(safe-area-inset-bottom));z-index:8;color:#3f301e91;letter-spacing:.15em;text-transform:uppercase;white-space:nowrap;pointer-events:none;margin:0;font-family:ui-sans-serif,system-ui,sans-serif;font-size:11px;transition:opacity .4s,transform .4s;position:absolute;transform:translate(-50%)}.interaction-hint.is-hidden{opacity:0;transform:translate(-50%,4px)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@keyframes unlock-shudder{0%,to{transform:translate(-50%,-50%)rotate(0)}22%{transform:translate(calc(-50% - 2px),-50%)rotate(-.3deg)}45%{transform:translate(calc(3px - 50%),-50%)rotate(.35deg)}68%{transform:translate(calc(-50% - 1px),-50%)rotate(-.12deg)}}@keyframes case-open-settle{0%{transform:translate(-50%,-50%)scale(1)}38%{transform:translate(-50%,-50.25%)scale(1.008)}to{transform:translate(-50%,-50%)scale(1)}}@keyframes lid-swing-open{0%{opacity:1;filter:brightness();transform:rotateX(0)}18%{opacity:1;filter:brightness(1.08);transform:rotateX(-12deg)}72%{opacity:1;filter:brightness(.82)saturate(.82);transform:rotateX(-82deg)}88%{opacity:.72;filter:brightness(.72)saturate(.68);transform:rotateX(-94deg)}to{opacity:0;filter:brightness(.74)saturate(.62);transform:rotateX(-100deg)}}@keyframes lid-inside-arrive{0%{opacity:0;transform:translateY(-36%)scaleY(.08)}45%{opacity:.68}to{opacity:1;transform:translateY(0)scaleY(1)}}@media (height<=570px){.watch-viewport{height:calc(100dvh - 18px);min-height:0}.interaction-hint{display:none}}@media (width>=700px){.watch-viewport{height:min(92dvh,810px)}.interaction-hint{font-size:12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.1s!important;transition-delay:0s!important;animation-duration:1ms!important;animation-iteration-count:1!important}}
