/* Admin (photographer) page */
.admin{padding-block:clamp(24px,5vh,56px) 64px}

/* Login: a framed "studio" card */
.login{max-width:440px;margin:clamp(24px,8vh,96px) auto 0;display:grid;gap:16px;padding:34px 30px 30px;border-radius:calc(var(--radius) + 6px)}
.login > i{width:24px;height:24px;margin:10px}
.login .chip{justify-self:start}
.login h1{font-size:clamp(40px,8vw,58px)}
.login p{margin:0;font-size:14.5px}

/* Section head, like fmsproduction.com */
.sec-head{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 48px;align-items:end;margin-bottom:44px}
.sec-head h1{font-size:clamp(40px,6vw,72px)}
.sec-head p{margin:0;color:var(--muted);max-width:48ch}
.sec-head::after{content:"";position:absolute;left:0;right:0;bottom:-22px;height:1px;background:linear-gradient(90deg,var(--tungsten),rgba(var(--tungsten-rgb),0) 70%)}
@media (max-width:820px){.sec-head{grid-template-columns:minmax(0,1fr)}}
.warn{margin-bottom:20px}

/* Create form */
.create{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;border-radius:calc(var(--radius) + 6px);padding:clamp(20px,3vw,32px);margin-bottom:48px}
.create .full,.create-head{grid-column:1/-1}
.create-head h2,.list-head h2{margin:0;font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:30px;line-height:1.1;letter-spacing:.02em}
.create-head p{margin:4px 0 0;font-size:14px}
.create-foot{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.create-foot small{font-size:13px;max-width:48ch}
@media (max-width:820px){.create{grid-template-columns:minmax(0,1fr)}.create-foot .btn{width:100%}}

/* Album list */
.list-head{margin-bottom:16px}
.list{display:grid;gap:14px}
.album{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 24px;align-items:center;padding:20px 22px;border-radius:var(--radius);background:linear-gradient(135deg,var(--glass-sheen),transparent 42%),var(--glass);border:1px solid var(--glass-line);box-shadow:inset 0 1px 0 var(--glass-hi),0 24px 60px -34px var(--shadow);transition:border-color .25s}
.album:hover{border-color:rgba(var(--tungsten-rgb),.5)}
.album .title{margin:0 0 8px;font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:26px;line-height:1.12;letter-spacing:.02em;overflow-wrap:anywhere}
.album .meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.album .slug{font:500 13px var(--f-mono);color:var(--muted);text-decoration:underline;text-decoration-color:rgba(var(--tungsten-rgb),.5);text-underline-offset:4px;overflow-wrap:anywhere}
.album .slug:hover{color:var(--daylight)}
.album .tools{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.album .progress{grid-column:1/-1;display:grid;gap:8px;font-size:13.5px;color:var(--muted)}
.album .progress.done .bar > i{background:linear-gradient(90deg,#1d9e6b,var(--ok))}
@media (max-width:900px){.album{grid-template-columns:minmax(0,1fr)}.album .tools{justify-content:flex-start}}
@media (max-width:520px){.album{padding:18px}.album .tools .btn{flex:1 1 auto}}

/* Live scan panel */
.scan{grid-column:1/-1;display:grid;grid-template-columns:112px minmax(0,1fr);gap:18px;align-items:center;padding:14px;border-radius:14px;background:rgba(var(--tungsten-rgb),.07);border:1px solid var(--glass-line)}
.scan .thumb{width:112px;height:112px;padding:7px}
.scan .thumb > i{width:16px;height:16px;border-color:var(--tungsten)}
.scan .shot{position:relative;width:100%;height:100%;border-radius:8px;overflow:hidden;background:rgba(var(--tungsten-rgb),.12) center/cover no-repeat}
.scan .shot i{position:absolute;border:2px solid var(--daylight);border-radius:3px;box-shadow:0 0 6px rgba(0,0,0,.5)}
.scan .info{display:grid;gap:8px;font-size:14px;min-width:0}
.scan .info b{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600}
.scan .stat{font-family:var(--f-mono);font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.scan label{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--muted);cursor:pointer}
.scan label input{margin-top:3px;accent-color:var(--tungsten)}
@media (max-width:520px){.scan{grid-template-columns:84px minmax(0,1fr)}.scan .thumb{width:84px;height:84px}}

.empty{text-align:center;color:var(--muted);padding:44px 16px;border:1px dashed var(--glass-line);border-radius:var(--radius)}
.empty b{display:block;color:var(--fg);font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:24px;letter-spacing:.02em;margin-bottom:4px}

/* QR dialog */
.qr-frame{justify-self:center;padding:12px}
.qr-frame > i{width:22px;height:22px;border-color:var(--tungsten)}
#qr-canvas{display:block;width:220px;height:220px;image-rendering:pixelated;background:#fff;padding:10px;border-radius:10px}
.linkbox{display:flex;gap:8px;align-items:center}
.linkbox .input{font:500 13px var(--f-mono);min-height:44px}
.sheet-actions{display:flex;gap:8px;justify-content:flex-end}
@media (max-width:600px){.sheet-actions .btn{flex:1}}