*{box-sizing:border-box}html,body{margin:0;background:#0d1424;color:#fff;font-family:system-ui,-apple-system,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}.hidden{display:none!important}.camera-app{max-width:530px;min-height:100dvh;margin:auto;display:flex;flex-direction:column;background:#111b2b;overflow:hidden}
.camera-head{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 20px;background:#111b2b}.camera-head b{font-size:14px}.camera-head a{font-size:30px;line-height:1}.camera-head button{background:none;border:0;font-size:25px;padding:8px}
.camera-view{height:57dvh;max-height:650px;min-height:300px;position:relative;background:black;overflow:hidden;display:flex;justify-content:center;align-items:center}
#cameraSource{position:absolute;left:-100vw;top:0;width:1px;height:1px;opacity:0}
#cameraCanvas{height:100%;max-width:100%;width:auto;object-fit:cover}
.camera-grid{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 33.25%,#fff5 33.35%,transparent 33.45%,transparent 66.55%,#fff5 66.65%,transparent 66.75%),linear-gradient(transparent 33.25%,#fff5 33.35%,transparent 33.45%,transparent 66.55%,#fff5 66.65%,transparent 66.75%)}
.camera-gate{position:absolute;inset:0;background:#101d34e8;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:26px}
.camera-gate>span{font-size:80px;color:#faac9b}.camera-gate h1{font-size:34px;margin:7px 0}.camera-gate p{font-size:14px;line-height:1.5;color:#c8d2dd;max-width:250px}
.camera-gate button{background:#f56f66;border:0;border-radius:14px;padding:15px 25px;font-size:14px;font-weight:800;margin:9px}
.camera-gate small{font-size:11px;color:#d6d5d7;margin:10px;line-height:1.5}.camera-gate>a{margin:9px 0;font-size:12px;color:#ffa89c}
.countdown{position:absolute;inset:0;display:grid;place-items:center;background:#0f17278a;color:#fff;font-size:120px;font-weight:900}
.camera-toolbar{display:flex;justify-content:space-evenly;gap:8px;padding:6px 16px;background:#19233a}.camera-toolbar button{display:flex;gap:5px;align-items:center;justify-content:center;background:none;border:0;padding:6px;font-size:19px}
.camera-toolbar small{font-size:11px;color:#bbcbdb}
.camera-bottom{padding:10px 14px 5px;flex:1}
.camera-looks{display:flex;gap:10px;overflow-x:auto;padding:6px 4px 11px;scrollbar-width:thin;scroll-snap-type:x proximity}
.camera-look{flex:0 0 56px;min-height:73px;border:2px solid transparent;background:transparent;color:#bdc8d6;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:10px;border-radius:11px;padding:4px 0}
.camera-look.active{border-color:#f79187;color:white;background:#ffffff18}.look-disc{width:44px;height:43px;border-radius:50%;display:grid;place-items:center;background:#c8a398;font-size:25px}
.camera-shutter-row{display:grid;grid-template-columns:1fr 90px 1fr;align-items:center;gap:5px;margin:7px 0}
.camera-shutter{width:79px;height:79px;background:transparent;border:5px solid #fff;border-radius:50%;padding:7px;justify-self:center;display:grid;place-items:center}
.camera-shutter span{display:block;width:100%;height:100%;border-radius:50%;background:#fff}
.camera-shutter:disabled{opacity:.4}.camera-shutter:not(:disabled):active span{background:#f9786a}
.gallery-link{display:flex;align-items:center;flex-direction:column;gap:2px;border:0;background:none;color:#fff;font-size:28px;text-align:center}
.gallery-link small{font-size:10px;color:#bdc7d1}.camera-bottom>p{font-size:11px;color:#aebdcd;line-height:1.45;text-align:center;margin:7px}
