/* Full-screen glass, with only a title, hand-drawn lock and underlined input. */
html.case-access-open,html.case-access-open body{overflow:hidden;overscroll-behavior:none;scroll-behavior:auto}
html[data-private-case]:not([data-case-unlocked="true"]) #main,html[data-case-arriving] #main{visibility:hidden}
.case-access{
  --glass-wash:rgba(243,246,241,.32);
  --glass-reading:rgba(243,246,241,.72);
  --glass-sheen:rgba(255,255,255,.18);
  --glass-edge:rgba(255,255,255,.6);
  --glass-error:#762c25;
}
:root[data-theme="dark"] .case-access{
  --glass-wash:rgba(25,35,29,.48);
  --glass-reading:rgba(25,35,29,.74);
  --glass-sheen:rgba(195,226,208,.045);
  --glass-edge:rgba(214,238,222,.14);
  --glass-error:#ffc1b5;
}
dialog.case-access{
  position:fixed;inset:var(--access-top,0px) 0 auto;width:100%;max-width:none;height:var(--access-vh,100dvh);max-height:none;min-height:0;
  margin:0;padding:clamp(24px,5vw,72px);border:0;border-radius:0;
  overflow:hidden;overscroll-behavior:none;color:var(--ink);
  background:radial-gradient(ellipse at 50% 52%,var(--glass-reading) 0,transparent 78%),
    linear-gradient(140deg,var(--glass-sheen),transparent 60%);
  box-shadow:inset 0 1px 0 var(--glass-edge);
}
.case-access::backdrop{background:var(--glass-wash);-webkit-backdrop-filter:blur(20px) saturate(155%);backdrop-filter:blur(20px) saturate(155%)}
.case-access[open]{display:grid;place-items:center}
.case-access-content{width:min(1050px,100%);padding:0;position:relative}
.case-access-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}
.case-access h2{font-size:clamp(44px,6.15vw,88px);line-height:1.1;font-weight:500;letter-spacing:-3px;margin:0}
.case-access-lock{order:1;width:88px;height:104px;flex-shrink:0;fill:none;stroke:var(--green);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transform:rotate(-6deg)}
.case-access-lock .lock-sketch{stroke-width:.9;opacity:.45}
.case-access-lock .lock-rays{stroke-width:1.3;opacity:.7}
.case-access-lock .lock-key{opacity:0}
.case-access-form{margin-top:54px}
.case-access input{
  display:block;width:100%;min-width:0;border:0;border-bottom:1px solid var(--control-line);
  outline:none;background:transparent;color:var(--ink);padding:14px 0 22px;
  font:400 clamp(30px,4.2vw,60px)/1.25 Outfit,Arial,sans-serif;letter-spacing:-1.4px;
  border-radius:0;box-shadow:none;caret-color:var(--green);
}
.case-access input::placeholder{color:var(--body-text);opacity:1}
.case-access input:focus{border-bottom:2px solid var(--green);padding-bottom:21px}
.case-access input[aria-invalid="true"]{border-bottom-color:var(--glass-error)}
#case-access-status{font-size:13px;color:var(--glass-error);margin:16px 0 0}
#case-access-status:empty{display:none}
.case-access-dismiss{position:absolute;right:max(28px,env(safe-area-inset-right));top:max(24px,env(safe-area-inset-top));display:flex;align-items:center;gap:10px;z-index:1}
.case-access kbd{font:400 12px/1.4 Outfit,Arial,sans-serif;color:var(--ink)}
.case-access-close{width:44px;height:44px;display:grid;place-items:center;padding:0;background:transparent;border:0;border-radius:50%;color:var(--ink)}
.case-access-close:hover{background:var(--quiet-surface)}
.case-access-close svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.case-access::backdrop{background:var(--paper)}dialog.case-access{background:var(--paper)}}
@media(prefers-reduced-motion:no-preference){.case-access[open] .case-access-content{animation:access-appear 200ms ease-out both}@keyframes access-appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}}
@media(max-width:700px){
 dialog.case-access[open]{padding:24px;place-items:start stretch}.case-access-content{padding:0;margin-top:clamp(64px,calc(var(--access-vh,100dvh)*.18),130px)}
 .case-access-heading{flex-direction:row;align-items:center;gap:16px}
 .case-access h2{font-size:clamp(38px,10vw,62px);letter-spacing:-1.8px;max-width:450px}
 .case-access-lock{width:58px;height:70px}
 .case-access-form{margin-top:28px}.case-access input{font-size:clamp(27px,7vw,36px);padding:12px 0 18px;letter-spacing:-.7px}
 .case-access input:focus{padding-bottom:17px}
 .case-access-dismiss{right:16px;top:max(16px,env(safe-area-inset-top));gap:5px}
}
@media(max-height:550px){.case-access-content{padding:0}.case-access-lock{width:55px;height:65px}.case-access h2{font-size:42px}.case-access-heading{flex-direction:row;gap:18px}.case-access-form{margin-top:24px}.case-access input{font-size:32px}}

/* Compact content tracks the visual viewport as the software keyboard opens. */
@media(max-width:700px){
 .case-access-dismiss{top:max(12px,env(safe-area-inset-top))}
 .case-access h2{font-size:clamp(32px,9.5vw,46px);line-height:1.06}
 .case-access-lock{width:52px;height:62px}
 .case-access-form{margin-top:clamp(18px,calc(var(--access-vh,100dvh)*.065),30px)}
}
.case-access-unlock{position:absolute;left:50%;top:50%;width:120px;height:140px;pointer-events:none;transform:translate(calc(-50% + var(--lock-dx,0px)),calc(-50% + var(--lock-dy,0px))) scale(var(--lock-scale,1)) rotate(-6deg);transform-origin:center;z-index:2}
.case-access-unlock[hidden]{display:none}
.case-access-unlock.is-centered{transform:translate(-50%,-50%) scale(1) rotate(0deg)}
.case-access-unlock .case-access-lock{display:block;width:120px;height:140px;transform:none}
.case-access-unlock .lock-rays{opacity:0}
.case-access-unlock .lock-shackle{transform-box:view-box;transform-origin:71px 48px}
.case-access-unlock .lock-key{transform-box:view-box;transform-origin:50px 76px}
.case-access.is-unlocking .case-access-heading>.case-access-lock{visibility:hidden}
.case-access.is-unlocking h2,.case-access.is-unlocking .case-access-form,.case-access.is-unlocking .case-access-dismiss,
.case-access.is-arriving .case-access-content,.case-access.is-arriving .case-access-dismiss{opacity:0;pointer-events:none}
.case-access.is-arriving .case-access-content{visibility:hidden}
.case-access.is-arriving .case-access-unlock .lock-shackle{transform:translateY(-9px) rotate(22deg)}
.case-access.is-leaving,.case-access.is-leaving::backdrop{opacity:0}
html[data-case-arriving]::before{content:"";position:fixed;inset:0;background:var(--paper);z-index:2147483645}
html[data-case-arriving]::after{content:"";position:fixed;width:120px;height:140px;left:50%;top:50%;transform:translate(-50%,-50%);background:var(--green);z-index:2147483646;mask:var(--case-open-lock) center/contain no-repeat;-webkit-mask:var(--case-open-lock) center/contain no-repeat}
html.case-arrival-dialog-ready::after{display:none}
@media(prefers-reduced-motion:no-preference){
 .case-access-unlock{transition:transform 320ms cubic-bezier(.22,.8,.26,1)}
 .case-access h2,.case-access-form,.case-access-dismiss{transition:opacity 130ms ease-out}
 .case-access.is-unlocking .case-access-content{animation:none}
 .case-access.is-unlocking .case-access-unlock .lock-key{animation:access-key-turn 360ms ease-in-out 100ms both}
 .case-access.is-unlocking .case-access-unlock .lock-shackle{animation:access-shackle-open 250ms cubic-bezier(.2,.8,.3,1) 330ms both}
 .case-access.is-leaving,.case-access.is-leaving::backdrop{transition:opacity 150ms ease-out}
 @keyframes access-key-turn{0%{opacity:0;transform:translate(20px,14px) rotate(25deg)}25%{opacity:1;transform:translate(0,0) rotate(0)}75%{opacity:1;transform:rotate(-38deg)}100%{opacity:0;transform:rotate(-38deg)}}
 @keyframes access-shackle-open{from{transform:translateY(0) rotate(0)}to{transform:translateY(-9px) rotate(22deg)}}
}
@media(prefers-reduced-motion:reduce){.case-access-unlock .lock-shackle{transform:translateY(-9px) rotate(22deg)}}

:root{--case-open-lock:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20116%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cg%20transform%3D%22translate%280%20-9%29%20rotate%2822%2071%2048%29%22%3E%3Cpath%20d%3D%22M26%2048C23%2023%2029%209%2046%208C64%206%2074%2023%2071%2048M35%2047C33%2029%2036%2018%2047%2017C59%2016%2064%2029%2062%2047%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M19%2049C34%2046%2062%2046%2078%2049C82%2063%2082%2084%2078%2098C62%20103%2033%20103%2017%2098C14%2084%2014%2062%2019%2049ZM50%2066C42%2065%2041%2076%2047%2078L45%2088L55%2087L53%2077C59%2073%2057%2067%2050%2066Z%22%2F%3E%3C%2Fsvg%3E")}