.foto { max-width: 760px; margin: 0 auto; padding: 24px 16px 64px; }
.foto h1 { font: 700 clamp(26px, 6vw, 40px)/1.1 var(--mono); margin: 4px 0 8px; }
.etykieta { font: 13px var(--mono); color: var(--szary); margin: 0; }
.mala { font-size: 14px; color: var(--szary); }
.zrodlo { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.zrodlo .pa-btn { margin: 0; }
.pa-btn.jasny { background: var(--papier); color: var(--tusz); display: inline-flex; align-items: center; }
.aparat { display: grid; gap: 8px; margin-bottom: 16px; }
.aparat video { width: 100%; max-height: 50vh; background: var(--tusz); border: 2px solid var(--tusz); }
.ustawienia { display: flex; flex-wrap: wrap; gap: 12px 24px; padding: 12px 0; border-top: 1px solid var(--linia); border-bottom: 1px solid var(--linia); font: 14px var(--mono); }
.ustawienia label { display: flex; align-items: center; gap: 8px; }
.scena-foto { position: relative; margin-top: 16px; border: 2px solid var(--tusz); background: #efe4cf; aspect-ratio: 36 / 27; display: grid; place-items: center; overflow: hidden; padding-top: 22px; }
.scena-foto canvas { touch-action: none; }
.scena-foto .pa-hud { top: 6px; color: var(--tusz); text-shadow: 1px 0 var(--papier), -1px 0 var(--papier), 0 1px var(--papier), 0 -1px var(--papier); }
.aparat[hidden] { display: none; }
.etykieta a { color: inherit; }
.ustawienia input { accent-color: var(--rdza); }
.ustawienia select { min-height: 32px; font: 14px var(--mono); border: 2px solid var(--tusz); background: var(--papier); color: var(--tusz); }
.foto-ladowanie { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); background: #fff; border: 2px dashed currentColor; padding: 4px 10px; z-index: 2; }
