:root{--app-height: 100vh;--paper: #f5f1e9;--paper-deep: #ebe5da;--ink: #211d19;--ink-soft: rgba(33, 29, 25, .68);--line: rgba(33, 29, 25, .18);--bell-brass: #8d6745;--night: #0d0c0b;--display-font: "Cormorant", Georgia, "Times New Roman", serif;--body-font: "Carlito", "Helvetica Neue", Helvetica, Arial, sans-serif;color-scheme:light;color:var(--ink);background:var(--paper);font-family:var(--body-font);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;height:var(--app-height);min-height:100%;margin:0;overflow:hidden;overscroll-behavior:none}body{background:var(--paper);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button,input{font:inherit}button{letter-spacing:.05em}img{-webkit-user-drag:none;-webkit-user-select:none;user-select:none}::selection{background:#8d674538}.auth-screen{display:grid;min-height:100%;min-height:var(--app-height);place-items:center;overflow-y:auto;padding:calc(32px + env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) calc(36px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:linear-gradient(#f5f1e9f0,#f5f1e9f0),repeating-linear-gradient(90deg,transparent 0 47px,rgba(33,29,25,.05) 48px)}.auth-panel{position:relative;width:min(100%,600px);padding:clamp(32px,8vw,64px);border:1px solid var(--line);background:#faf7f1eb;box-shadow:12px 12px 0 var(--paper-deep)}.auth-panel:before{position:absolute;top:16px;right:16px;bottom:16px;left:16px;border:1px solid rgba(33,29,25,.08);content:"";pointer-events:none}.auth-panel>*{position:relative}.auth-panel h1,.selection-header h1{margin:0;font-family:var(--display-font);font-weight:700;letter-spacing:-.025em}.auth-panel h1{max-width:440px;font-size:clamp(2.55rem,9vw,4.7rem);line-height:.96}.auth-copy,.intro{color:var(--ink-soft);letter-spacing:.015em}.auth-copy{max-width:450px;margin:22px 0 0;font-size:.98rem;line-height:1.65}.auth-form{display:grid;gap:12px;margin-top:32px}.code-label,.lock-badge{font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase}.brand-logo{display:block;width:clamp(135px,21vw,195px);height:auto;margin:0 0 clamp(24px,4vw,36px)}.code-label{color:var(--ink-soft)}.code-input{width:100%;min-height:58px;border:1px solid var(--line);border-radius:0;outline:none;padding:0 17px;background:transparent;color:var(--ink);font:500 1.08rem/1.2 SFMono-Regular,Consolas,Liberation Mono,monospace;letter-spacing:.1em;text-transform:uppercase;transition:box-shadow .15s ease,border-color .15s ease}.code-input::placeholder{color:#211d194d}.code-input:focus{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}.unlock-button,.secondary-button,.continue-button,.back-button{min-height:48px;border-radius:0;cursor:pointer;font-size:.78rem;font-weight:600;text-transform:uppercase;touch-action:manipulation;transition:background-color .16s ease,color .16s ease,transform .16s ease}.unlock-button{border:1px solid var(--ink);padding:0 22px;background:var(--ink);color:var(--paper)}.unlock-button:hover{background:var(--bell-brass);border-color:var(--bell-brass)}.secondary-button,.continue-button{border:1px solid var(--ink);padding:0 18px;background:transparent;color:var(--ink)}.secondary-button:hover,.continue-button:hover{background:var(--ink);color:var(--paper)}.continue-button{width:100%;margin-top:12px}.auth-status,.selection-status{color:var(--bell-brass);line-height:1.4}.auth-status{min-height:1.4em;margin:0;font-size:.88rem}.selection-screen{height:100%;height:var(--app-height);overflow-y:auto;padding:calc(32px + env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) calc(42px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:var(--paper);-webkit-overflow-scrolling:touch}.selection-header,.image-grid{width:min(100%,1200px);margin-right:auto;margin-left:auto}.selection-header{margin-bottom:32px;padding-bottom:28px;border-bottom:1px solid var(--line)}.selection-header h1{max-width:800px;font-size:clamp(2.8rem,7vw,6.25rem);line-height:.92}.intro{max-width:650px;margin:20px 0 0;font-size:clamp(.96rem,2vw,1.08rem);line-height:1.65}.selection-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:24px}.selection-status{min-height:1.3em;margin:0;font-size:.9rem}.selection-actions .secondary-button{min-width:174px;min-height:44px}.image-grid{display:grid;grid-template-columns:1fr;gap:16px}.image-card{display:grid;grid-template-columns:112px 1fr;gap:18px;width:100%;min-height:140px;border:1px solid var(--line);border-radius:0;padding:10px;background:transparent;color:inherit;text-align:left;cursor:pointer;touch-action:manipulation;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.image-card:hover{border-color:#211d196b;box-shadow:7px 7px 0 var(--paper-deep);transform:translate(-2px,-2px)}.image-card:active{transform:translate(0)}.image-card:focus-visible,.unlock-button:focus-visible,.secondary-button:focus-visible,.continue-button:focus-visible,.back-button:focus-visible{outline:2px solid var(--ink);outline-offset:4px}.image-card.is-locked{color:#211d19a8}.image-card.is-locked .thumb-wrap img{filter:saturate(.72) sepia(.08) brightness(.88) contrast(.94)}.image-card.is-locked:hover .thumb-wrap img{filter:saturate(.9) sepia(.04) brightness(.96) contrast(.98)}.thumb-wrap{position:relative;min-height:118px;overflow:hidden;background:var(--paper-deep)}.thumb-wrap img,.thumb-fallback{position:absolute;top:0;right:0;bottom:0;left:0}.thumb-wrap img{z-index:1;width:100%;height:100%;object-fit:cover;transition:transform .45s ease}.image-card:hover .thumb-wrap img{transform:scale(1.025)}.thumb-wrap img.is-missing{opacity:0}.thumb-fallback{display:grid;place-items:center;padding:12px;color:var(--ink-soft);font-family:var(--display-font);font-size:1rem;font-weight:700;line-height:1.1;text-align:center}.lock-badge{position:absolute;right:8px;bottom:8px;z-index:2;padding:6px 8px;border:1px solid rgba(245,241,233,.68);background:#0d0c0bc7;color:var(--paper);font-size:.58rem;letter-spacing:.11em}.image-card:not(.is-locked) .lock-badge{background:#f5f1e9e6;border-color:#211d194d;color:var(--ink)}.card-copy{display:flex;min-width:0;flex-direction:column;justify-content:center;gap:8px;padding-right:8px}.card-title{font-family:var(--display-font);font-size:1.55rem;font-weight:700;line-height:1.05;letter-spacing:-.015em}.card-subtitle{color:var(--ink-soft);font-size:.87rem;line-height:1.48;letter-spacing:.01em}.viewer-screen{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr);width:100%;height:100%;height:var(--app-height);overflow:hidden;background:var(--night)}.viewer-topbar{position:relative;z-index:10;display:flex;align-items:center;gap:16px;min-height:calc(68px + env(safe-area-inset-top));padding:calc(12px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 11px max(16px,env(safe-area-inset-left));border-bottom:1px solid rgba(245,241,233,.18);background:#0d0c0beb;color:var(--paper);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.back-button{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;gap:7px;min-width:104px;min-height:44px;border:1px solid rgba(245,241,233,.52);padding:0 14px;background:transparent;color:var(--paper)}.back-button:hover{background:var(--paper);color:var(--ink)}.back-button span:first-child{font-family:var(--display-font);font-size:1.6rem;font-weight:700;line-height:0}.viewer-title{min-width:0}.viewer-title strong,.viewer-title span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewer-title strong{font-family:var(--display-font);font-size:1.2rem;font-weight:700;letter-spacing:0}.viewer-title span{margin-top:3px;color:#f5f1e994;font-size:.78rem;letter-spacing:.025em}.osd-viewer{position:relative;height:100%;min-height:0;background:linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),#090909;background-size:40px 40px;touch-action:none}.osd-viewer canvas{outline:none}.osd-navigator{position:absolute;right:calc(14px + env(safe-area-inset-right));bottom:calc(20px + env(safe-area-inset-bottom));z-index:20;width:clamp(104px,32vw,220px);height:clamp(78px,24vw,164px);overflow:hidden;border:1px solid rgba(245,241,233,.5);background:#0d0c0bb8;box-shadow:8px 8px #00000042;opacity:.92;touch-action:none}.osd-navigator:hover,.osd-navigator:active{opacity:1}.osd-navigator .displayregion{border:2px solid #d2a774!important;box-shadow:0 0 0 999px #00000029}.viewer-error{position:absolute;top:50%;left:50%;z-index:15;display:flex;width:min(86vw,440px);transform:translate(-50%,-50%);flex-direction:column;gap:8px;border:1px solid rgba(245,241,233,.38);padding:20px;background:#0d0c0bf0;color:#f5f1e9b8;text-align:center}.viewer-error strong{color:var(--paper);font-family:var(--display-font);font-size:1.25rem;font-weight:700}.viewer-error code{color:#d2a774}@media (min-width: 700px){.selection-screen{padding:calc(54px + env(safe-area-inset-top)) max(32px,env(safe-area-inset-right)) calc(60px + env(safe-area-inset-bottom)) max(32px,env(safe-area-inset-left))}.selection-header{margin-bottom:40px;padding-bottom:34px}.image-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 22px}.image-card{grid-template-columns:1fr;min-height:390px;padding:12px}.thumb-wrap{min-height:auto;aspect-ratio:4 / 3}.card-copy{justify-content:flex-start;padding:5px 5px 10px}.card-title{font-size:1.7rem}.viewer-topbar{gap:20px;padding-right:max(24px,env(safe-area-inset-right));padding-left:max(24px,env(safe-area-inset-left))}}@media (min-width: 1100px){.image-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.image-card{min-height:360px}.osd-navigator{right:24px;bottom:24px}}@media (max-width: 699px) and (orientation: portrait){.viewer-topbar{min-height:calc(58px + env(safe-area-inset-top));padding-top:calc(8px + env(safe-area-inset-top));padding-bottom:8px}.back-button{min-width:94px}.viewer-title span{display:none}.osd-navigator{right:calc(10px + env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));width:clamp(108px,36vw,150px);height:clamp(80px,26vw,112px)}}@media (max-width: 390px){.auth-panel{padding:30px 26px;box-shadow:7px 7px 0 var(--paper-deep)}.image-card{grid-template-columns:92px 1fr;gap:14px}.card-title{font-size:1.3rem}.card-subtitle{font-size:.82rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}
