:root{--body:#221f1c;--body-2:#2c2825;--film-yellow:#f2c230;--shutter-red:#d64533;--text:#f4efe8;--text-dim:#a89f93;--frame-green:#6fbf4a}*{box-sizing:border-box}body{background:var(--body);color:var(--text);background-image:repeating-linear-gradient(90deg, transparent 0 14px, #000 14px 26px, transparent 26px 40px), repeating-linear-gradient(90deg, transparent 0 14px, #000 14px 26px, transparent 26px 40px), linear-gradient(var(--body), var(--body));background-position:0 6px,0 calc(100% - 20px),0 0;background-repeat:no-repeat;background-size:100% 14px,100% 14px,100% 100%;min-height:100vh;margin:0;font-family:Avenir Next,Segoe UI,system-ui,sans-serif}.camera-body{max-width:430px;padding:44px 20px calc(44px + env(safe-area-inset-bottom));flex-direction:column;gap:16px;min-height:100vh;margin:0 auto;display:flex}.top-bar{justify-content:space-between;align-items:center;display:flex}.brand{align-items:center;gap:10px;display:flex}.brand-dot{background:radial-gradient(circle at 35% 35%,#7fb8d8 0 18%,#123 60%,#000);border-radius:50%;width:22px;height:22px;box-shadow:0 0 0 4px #111,0 0 0 5px #3a3632}.brand h1{letter-spacing:.04em;color:var(--film-yellow);margin:0;font-size:1.5rem;font-weight:800}.tagline{color:var(--text-dim);margin:0;font-size:.95rem}.lang-toggle{border:1px solid #4a453f;border-radius:999px;display:flex;overflow:hidden}.lang-toggle button{color:var(--text-dim);cursor:pointer;background:0 0;border:none;padding:6px 12px;font-size:.8rem;font-weight:700}.lang-toggle button.active{background:var(--film-yellow);color:#221f1c}.counter-window{background:#14120f;border:2px solid #4a453f;border-radius:10px;flex-direction:column;gap:8px;padding:10px 16px;display:flex;box-shadow:inset 0 2px 8px #000}.frames{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.frame{border:2px solid var(--film-yellow);background:0 0;border-radius:3px;width:26px;height:18px}.frame.used{background:var(--film-yellow)}.counter-text{color:var(--film-yellow);white-space:nowrap;align-self:center;font-family:Courier New,monospace;font-size:.95rem;font-weight:700}.shoot-area,.preview-area{flex-direction:column;flex:1;gap:18px;display:flex}.shoot-area{padding-bottom:68px}.group-label{color:var(--text-dim);flex-direction:column;gap:6px;font-size:.9rem;display:flex}.group-label select{background:var(--body-2);color:var(--text);border:1px solid #4a453f;border-radius:10px;padding:12px;font-size:1rem}.shutter{color:var(--text);cursor:pointer;background:0 0;border:none;flex-direction:column;align-items:center;gap:12px;margin:12px auto 0;font-size:1.15rem;font-weight:700;display:flex}.shutter-ring{background:#3a3632;border-radius:50%;place-items:center;width:108px;height:108px;display:grid;box-shadow:0 6px 14px #00000080,inset 0 2px 4px #ffffff1f}.shutter-core{background:radial-gradient(circle at 35% 30%, #e86a56, var(--shutter-red) 60%, #9c2f21);border-radius:50%;width:84px;height:84px;transition:transform 80ms}.shutter:active:not(:disabled) .shutter-core{transform:scale(.92)}.shutter:disabled,.gallery-pick:disabled{opacity:.4;cursor:not-allowed}.gallery-pick{background:var(--body-2);color:var(--text);cursor:pointer;border:1px solid #4a453f;border-radius:999px;margin:0 auto;padding:12px 24px;font-size:1rem}.viewfinder{background:#000;border:3px solid #4a453f;border-radius:12px;overflow:hidden;box-shadow:inset 0 0 24px #000}.viewfinder img{object-fit:contain;width:100%;max-height:60vh;display:block}.preview-actions{gap:12px;display:flex}.preview-actions button{cursor:pointer;border:none;border-radius:12px;flex:1;padding:14px;font-size:1.05rem;font-weight:700}.preview-actions .primary{background:var(--film-yellow);color:#221f1c}.preview-actions .secondary{background:var(--body-2);color:var(--text);border:1px solid #4a453f}.preview-actions button:disabled{opacity:.5;cursor:wait}.film-full{text-align:center;color:var(--text-dim);padding:40px 12px}.film-full-title{color:var(--film-yellow);margin-bottom:8px;font-size:1.4rem;font-weight:800}.success{border:1px solid var(--frame-green);text-align:center;background:#6fbf4a1f;border-radius:12px;padding:12px 16px}.success p{color:var(--text-dim);margin:2px 0}.success-title{font-size:1.05rem;font-weight:700;color:var(--frame-green)!important}.error{border:1px solid var(--shutter-red);background:#d6453326;border-radius:10px;margin:0;padding:10px 14px;font-size:.95rem}.gallery-link{text-align:center;color:#221f1c;background:var(--film-yellow);border-radius:14px;padding:16px;font-size:1.15rem;font-weight:700;text-decoration:none;display:block}footer{margin-top:8px}.footer-block{text-align:center;flex-direction:column;align-items:center;display:flex}.footer-logos{filter:invert(20%)sepia(20%);justify-content:center;align-items:center;gap:14px;margin-bottom:8px;display:flex}.org-logo{object-fit:contain;width:48px;height:48px;display:block}.org-logo.maki{width:58px}.footer-follow{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.follow-text{color:var(--text-dim);font-size:.76rem;line-height:1.4}.social-links{color:var(--text-dim);justify-content:center;gap:8px;display:flex}.social-links a{background:var(--body-2);width:32px;height:32px;color:var(--text-dim);border:1px solid #4a453f;border-radius:50%;justify-content:center;align-items:center;font-size:.8rem;font-weight:800;text-decoration:none;display:inline-flex}.social-links svg{display:block}.consent-link{color:#d5cabd;text-underline-offset:3px;text-align:center;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;gap:6px;width:100%;margin-bottom:36px;padding:0;font-size:.8rem;text-decoration:underline;display:inline-flex}.consent-link svg{flex-shrink:0;font-size:.75rem}.notice-backdrop{z-index:30;background:#080808b8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.notice-modal{background:var(--body);border:1px solid #4a453f;border-radius:18px;width:min(420px,100%);padding:24px 20px 20px;position:relative;box-shadow:0 18px 40px #00000073}.notice-close{background:var(--body-2);width:34px;height:34px;color:var(--text);cursor:pointer;border:1px solid #4a453f;border-radius:50%;font-size:1.5rem;position:absolute;top:10px;right:10px}.notice-modal h2{color:var(--text);margin:0 0 12px;font-size:1.3rem}.notice-text{color:var(--text-dim);white-space:pre-line;margin:0;font-size:.95rem;line-height:1.6}
