.phone-camera[hidden],.phone-launch[hidden],.phone-photo[hidden]{display:none!important}
.phone-launch{position:fixed;right:22px;bottom:76px;z-index:46;border:1px solid #ffffff65;border-radius:13px;padding:12px 18px;background:#102126dd;color:white;font:14px system-ui;cursor:pointer}
.phone-camera{position:fixed;inset:0;z-index:840;pointer-events:none;color:white;font:14px system-ui;box-shadow:inset 0 0 0 8px #111}
.phone-camera header,.phone-camera footer{position:absolute;left:0;right:0;background:#07090dcc;display:flex;align-items:center;justify-content:space-between;padding:18px 24px;gap:12px}
.phone-camera header{top:0;padding-top:max(18px,env(safe-area-inset-top))}.phone-camera header span{text-align:center}.phone-camera header b{display:block;color:#ffd85b;font-size:11px;letter-spacing:.2em;margin-top:4px}
.phone-camera button,.phone-camera a{pointer-events:auto;border:1px solid #ffffff4a;border-radius:12px;background:#222b;color:white;padding:12px;font:inherit;cursor:pointer;text-decoration:none}.phone-camera button:disabled{opacity:.4;cursor:default}
.phone-camera footer{bottom:0;flex-wrap:wrap;justify-content:center;gap:16px;padding-bottom:max(16px,env(safe-area-inset-bottom))}.phone-camera footer p,.phone-camera output{flex-basis:100%;text-align:center;margin:0;font-size:12px}.phone-camera output{color:#ffdf8a;min-height:16px}
.phone-camera .phone-shutter{width:66px;height:66px;border-radius:50%;border:5px double #151515;background:#fff;outline:2px solid #fff;padding:0}.phone-facing{width:105px;font-size:12px}.phone-camera [data-action=gallery]{width:105px;background-size:cover;background-position:center;text-shadow:0 1px 3px black}
.phone-grid{position:absolute;inset:86px 8px 168px;border:1px solid #ffffff28;background:linear-gradient(to right,transparent 33.2%,#ffffff30 33.3%,transparent 33.5%,transparent 66.5%,#ffffff30 66.6%,transparent 66.8%),linear-gradient(to bottom,transparent 33.2%,#ffffff30 33.3%,transparent 33.5%,transparent 66.5%,#ffffff30 66.6%,transparent 66.8%)}
.phone-photo{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#080a0fee;pointer-events:auto;padding:20px}.phone-photo img{max-width:100%;max-height:80vh;object-fit:contain}.phone-photo>div{display:flex;gap:16px;margin-top:14px}
.phone-camera-open #crosshair,.phone-camera-open #prompt,.phone-camera-open #touchControls,.phone-camera-open .item-controls,.phone-camera-open .desktop-action{visibility:hidden}
@media(pointer:coarse){.phone-launch{right:18px;bottom:145px}.phone-camera header{padding-left:12px;padding-right:12px}.phone-camera footer{gap:10px}.phone-camera footer p{font-size:10px}}

.phone-photo [hidden]{display:none!important}
.phone-camera.viewing-gallery>header,.phone-camera.viewing-gallery>footer,.phone-camera.viewing-gallery>.phone-grid{visibility:hidden}
.phone-photo h2{margin:0;font-size:20px}.phone-gallery-count{margin:8px 0 12px;color:#cad4df}
.phone-photo .phone-gallery-stage{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;width:100%;flex:1;min-height:0;gap:12px;margin:0}
.phone-gallery-stage img{width:100%;height:100%;max-height:calc(100dvh - 205px);min-height:0;object-fit:contain}
.phone-gallery-stage button{font-size:24px;padding:14px 6px;min-height:52px}.phone-gallery-empty{text-align:center;color:#bdc9d6}
.phone-gallery-note{text-align:center;color:#a5b3c3;font-size:12px;margin:12px 0 0}.phone-photo{padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));background:#080a0f}
@media(max-width:600px){.phone-photo .phone-gallery-stage{grid-template-columns:40px minmax(0,1fr) 40px;gap:4px}.phone-gallery-note{font-size:11px}}

/* Portrait camera frame and capture share the same 3:4 crop on every screen. */
.phone-camera>.phone-grid{inset:auto;top:86px;left:50%;transform:translateX(-50%);width:min(calc(100vw - 24px),calc((100dvh - 254px)*.75));height:auto;aspect-ratio:3/4;box-sizing:border-box;box-shadow:0 0 0 100vmax #080a0f}
.phone-camera>header,.phone-camera>footer{z-index:1}

/* Keep the photo unobscured while giving the portrait view more screen space. */
.phone-camera{--camera-top:calc(58px + env(safe-area-inset-top,0px));--camera-bottom:calc(98px + env(safe-area-inset-bottom,0px))}
.phone-camera>.phone-grid{top:var(--camera-top);width:min(calc(100vw - 12px),calc((100dvh - var(--camera-top) - var(--camera-bottom))*.75))}
.phone-camera>header{height:var(--camera-top);box-sizing:border-box;padding:6px 12px;padding-top:calc(6px + env(safe-area-inset-top,0px))}
.phone-camera>header button{padding:9px 12px;min-height:42px}
.phone-camera>footer{height:var(--camera-bottom);box-sizing:border-box;padding:6px 12px;padding-bottom:calc(6px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:minmax(60px,100px) 58px minmax(60px,100px);grid-template-rows:58px 18px;column-gap:12px;row-gap:4px;align-content:center}
.phone-camera .phone-shutter{width:56px;height:56px}
.phone-camera [data-action=gallery],.phone-camera .phone-facing{width:100%;box-sizing:border-box;text-align:center}
.phone-camera>footer p{display:none}
.phone-camera>footer output{grid-column:1/-1;grid-row:2;font-size:11px;line-height:18px;min-height:18px}

.phone-shell[hidden],.phone-shell [hidden]{display:none!important}
.phone-shell{position:fixed;right:max(22px,env(safe-area-inset-right));bottom:max(22px,env(safe-area-inset-bottom));height:min(610px,calc(100dvh - 40px));aspect-ratio:9/19.5;box-sizing:border-box;z-index:840;border:7px solid #181b20;border-radius:42px;color:#fff;background:radial-gradient(ellipse at 12% 75%,#cd9d84 0,transparent 50%),radial-gradient(ellipse at 100% 0,#72b7c3 0,transparent 60%),linear-gradient(160deg,#123b4e,#23415b 55%,#513348);box-shadow:0 18px 60px #0009,inset 0 0 0 1px #ffffff50;overflow:hidden;font:14px system-ui;animation:phone-rise .22s ease-out}
@keyframes phone-rise{from{transform:translateY(110%);opacity:0}to{transform:translateY(0);opacity:1}}
.phone-status{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 17px;font-size:12px;font-weight:650;position:relative;z-index:3;pointer-events:none}
.phone-island{position:absolute;left:50%;top:11px;transform:translateX(-50%);width:77px;height:24px;border-radius:20px;background:#07080a;box-shadow:inset -9px 0 0 #0f141b}
.phone-dismiss{position:absolute;right:12px;top:51px;z-index:4;border:0;border-radius:50%;width:32px;height:32px;background:#142532b0;color:white;font:24px system-ui;cursor:pointer}
.phone-home{padding:45px 18px 18px}.phone-brand{font-size:11px;font-weight:700;letter-spacing:.28em;color:#c9e7eb;margin:0 0 12px}.phone-home h2{font-size:29px;line-height:1.16;font-weight:550;letter-spacing:-1px;margin:0 0 36px}
.phone-apps{display:grid;grid-template-columns:1fr 1fr;gap:12px}.phone-apps button{border:0;border-radius:18px;padding:9px 4px;background:transparent;color:#fff;font:12px system-ui;cursor:pointer}.phone-apps button.selected,.phone-apps button:focus-visible{background:#ffffff25;outline:1px solid #ffffff65}.phone-app-icon{display:grid;place-items:center;width:60px;height:60px;margin:0 auto 8px;border-radius:16px;font:44px system-ui;box-shadow:0 4px 8px #0003}.camera-icon{color:#252b36;background:linear-gradient(#f2f5f7,#aab3bf)}.gallery-icon{background:#fff;color:#e7608b}
.phone-home-tip{position:absolute;bottom:42px;left:14px;right:14px;text-align:center;font-size:10px;opacity:.8}.phone-homebar{position:absolute;bottom:6px;left:25%;width:50%;height:20px;border:0;background:transparent;z-index:5;cursor:pointer}.phone-homebar:after{content:'';position:absolute;left:0;right:0;bottom:4px;height:4px;border-radius:4px;background:#fff}
.phone-shell .phone-photo{inset:46px 0 27px;padding:40px 8px 6px;background:#0b1119}.phone-shell .phone-gallery-stage{grid-template-columns:28px minmax(0,1fr) 28px;gap:2px}.phone-shell .phone-gallery-stage img{max-height:100%}.phone-shell .phone-gallery-stage button{font-size:16px;padding:8px 0;min-height:44px}.phone-shell .phone-photo button,.phone-shell .phone-photo a{border:1px solid #ffffff35;border-radius:10px;background:#ffffff12;color:white;padding:9px;font:11px system-ui;text-decoration:none;cursor:pointer}.phone-shell .phone-photo button:disabled{opacity:.35}.phone-shell .phone-gallery-count{font-size:10px}.phone-shell .phone-gallery-note{font-size:9px;margin:7px 0 0}.phone-shell .phone-gallery-actions{gap:6px;margin-top:8px}.phone-shell .phone-gallery-empty{font-size:12px}
.phone-open #crosshair,.phone-open #prompt,.phone-open #touchControls,.phone-open .item-controls,.phone-open .desktop-action{visibility:hidden}
@media(max-height:550px){.phone-home{padding-top:20px}.phone-home h2{font-size:23px;margin-bottom:15px}.phone-app-icon{width:46px;height:46px;font-size:34px}.phone-home-tip{display:none}.phone-shell{border-radius:30px;right:12px;bottom:10px;height:calc(100dvh - 20px)}}
@media(prefers-reduced-motion:reduce){.phone-shell{animation:none}}
