:root{--c-primary:#2563eb;--c-primary-dark:#1d4ed8;--c-accent:#f59e0b;--c-bg:#f8fafc;--c-surface:#fff;--c-text:#1e293b;--c-text-muted:#64748b;--c-border:#e2e8f0;--c-success:#16a34a;--c-danger:#dc2626;--tab-height:3.5rem;--header-height:3.5rem;font-family:Segoe UI,system-ui,-apple-system,sans-serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{-webkit-overflow-scrolling:touch;width:100%;height:100%;overflow:auto}body{background:var(--c-bg);color:var(--c-text)}.scrollbar-thin::-webkit-scrollbar{width:4px}.scrollbar-thin::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.tab-bar{height:var(--tab-height);background:var(--c-surface);border-top:1px solid var(--c-border);z-index:50;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -2px 8px #0000000f}.tab-btn{color:var(--c-text-muted);cursor:pointer;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;font-size:.7rem;font-weight:700;transition:all .15s;display:flex;position:relative}.tab-btn.active{color:var(--c-primary)}.tab-btn.active:after{content:"";background:var(--c-primary);border-radius:0 0 4px 4px;height:3px;position:absolute;top:0;left:20%;right:20%}.app-header{min-height:var(--header-height);color:#fff;z-index:50;background:linear-gradient(135deg,#1e3a5f 0%,#2563eb 100%);flex-wrap:wrap;align-items:center;gap:.3rem .75rem;padding:.25rem 1rem;display:flex;position:fixed;top:0;left:0;right:0;box-shadow:0 2px 8px #00000026}.app-header h1{letter-spacing:-.02em;font-size:1.1rem;font-weight:800}.main-content{top:var(--header-height);bottom:var(--tab-height);-webkit-overflow-scrolling:touch;touch-action:pan-y pinch-zoom;overscroll-behavior:contain;position:fixed;left:0;right:0;overflow:hidden auto}.photo-card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:16px;transition:box-shadow .2s;overflow:hidden;box-shadow:0 2px 12px #0000000f}.field-row{border-bottom:1px solid #f1f5f9;align-items:center;gap:.5rem;padding:.5rem .75rem;display:flex}.field-label{color:var(--c-text-muted);align-items:center;gap:.25rem;min-width:3.5rem;font-size:.75rem;font-weight:700;display:flex}.field-input{color:var(--c-text);background:0 0;border:none;outline:none;flex:1;padding:.35rem 0;font-size:.9rem;font-weight:600}.field-input::placeholder{color:#cbd5e1;font-weight:400}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.5rem;padding:.75rem;display:grid}.photo-grid-item{aspect-ratio:1;cursor:pointer;border:2px solid #0000;border-radius:8px;transition:all .15s;position:relative;overflow:hidden}.photo-grid-item.active{border-color:var(--c-primary);box-shadow:0 0 0 2px #2563eb4d}.photo-grid-item img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.photo-grid-item .badge{color:#fff;background:#0009;border-radius:4px;padding:1px 4px;font-size:.6rem;font-weight:700;position:absolute;bottom:2px;right:2px}.btn{cursor:pointer;active:scale(.96);border:none;border-radius:12px;justify-content:center;align-items:center;gap:.4rem;padding:.6rem 1.2rem;font-size:.85rem;font-weight:700;transition:all .15s;display:inline-flex}.btn:active{transform:scale(.96)}.btn-primary{background:var(--c-primary);color:#fff}.btn-primary:hover{background:var(--c-primary-dark)}.btn-secondary{color:var(--c-text);border:1px solid var(--c-border);background:#f1f5f9}.btn-danger{color:var(--c-danger);background:#fef2f2;border:1px solid #fecaca}.btn-success{color:var(--c-success);background:#f0fdf4;border:1px solid #bbf7d0}.empty-state{color:var(--c-text-muted);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:3rem 1rem;display:flex}@media (width>=768px){.main-content{max-width:900px;margin:0 auto}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}.splash-screen{z-index:9999;background:linear-gradient(135deg,#1e3a5f 0%,#0f172a 100%);flex-direction:column;justify-content:center;align-items:center;transition:opacity .5s,transform .5s;display:flex;position:fixed;inset:0}.splash-screen.fade-out{opacity:0;pointer-events:none;transform:scale(1.05)}@keyframes splash-bounce{0%{opacity:0;transform:scale(0)rotate(-15deg)}50%{opacity:1;transform:scale(1.15)rotate(3deg)}70%{transform:scale(.95)rotate(-1deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes splash-title{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes splash-subtitle{0%{opacity:0}to{opacity:.6}}@keyframes splash-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.splash-icon{animation:.5s cubic-bezier(.34,1.56,.64,1) both splash-bounce}.splash-title{opacity:0;color:#fff;letter-spacing:.1em;margin-top:.8rem;font-size:1.8rem;font-weight:800;animation:.3s .2s both splash-title}.splash-subtitle{opacity:0;color:#fff;margin-top:.3rem;font-size:.8rem;animation:.3s .35s both splash-subtitle}.splash-bar{background:#ffffff1a;border-radius:3px;width:120px;height:3px;margin-top:1.5rem;overflow:hidden}.splash-bar-inner{background:linear-gradient(90deg,#0000,#4ade80,#60a5fa,#0000) 0 0/200% 100%;border-radius:3px;width:100%;height:100%;animation:.8s linear .4s infinite splash-shimmer}@keyframes toastIn{0%{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:translateY(0)}}@keyframes toastOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(1rem)}}@keyframes modalBgIn{0%{opacity:0}to{opacity:1}}@keyframes modalIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
