:root,[data-theme=dark]{--brand-purple: #8169c5;--brand-lavender: #a794e0;--brand-orange: #e8944a;--color-bg: #0f0d17;--color-surface: #1c1830;--color-surface-2: #262040;--color-border: #3b3556;--color-text: #f2eefb;--color-text-muted: #a9a2c4;--color-accent: #8169c5;--color-accent-hover: #a794e0;--color-on-accent: #ffffff;--color-error: #ff6b6b;--color-success: #3ddc84;--color-on-success: #000000;--color-warning: #e6a700;--shadow-card: 0 1px 2px rgba(129, 105, 197, .1), 0 6px 18px rgba(129, 105, 197, .18), 0 2px 6px rgba(0, 0, 0, .2);--focus-ring: 0 0 0 3px rgba(167, 148, 224, .6)}[data-theme=light]{--color-bg: #f5ede3;--color-surface: #ede5d8;--color-surface-2: #e4d9cb;--color-border: #c9b89e;--color-text: #2c1a0e;--color-text-muted: #6b5540;--color-accent: #6b3fae;--color-accent-hover: #8a5ed0;--color-on-accent: #ffffff;--color-error: #a3324f;--color-success: #2f7d5e;--color-on-success: #ffffff;--color-warning: #b8860b;--shadow-card: 0 2px 8px rgba(107, 63, 174, .1), 0 6px 20px rgba(139, 90, 43, .12);--focus-ring: 0 0 0 3px rgba(107, 63, 174, .45)}*{margin:0;padding:0;box-sizing:border-box}html{font-size:18px}body{font-family:var(--font-body);background:var(--color-bg);background-image:radial-gradient(ellipse at 20% 50%,rgba(15,169,104,.04) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(124,58,237,.03) 0%,transparent 40%),radial-gradient(ellipse at 60% 80%,rgba(230,59,122,.02) 0%,transparent 45%);color:var(--color-text);min-height:100vh;line-height:1.6;-webkit-text-size-adjust:100%;font-size:17px}.shimmer{background-image:var(--shimmer-gradient);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 3s linear infinite}.iridescent-border{position:relative}.iridescent-border:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:inherit;background:var(--shimmer-gradient);background-size:200% auto;animation:shimmer 4s linear infinite;z-index:-1;opacity:0;transition:opacity .3s ease}.iridescent-border:hover:before{opacity:1}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:6px}button,input,select,textarea{font-family:inherit;font-size:1rem;color:var(--color-text)}button{min-height:44px;cursor:pointer}input,select,textarea{min-height:48px;padding:.5rem .6rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:6px}.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:1rem}.login-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:14px;padding:2rem;width:100%;max-width:420px;box-shadow:var(--shadow-card)}.login-card h1{margin-bottom:1.25rem;font-size:1.6rem}.login-card label{display:block;margin-bottom:.3rem;color:var(--color-text-muted);font-size:.95rem}.login-card input{display:block;width:100%;margin-bottom:1rem}.login-card button[type=submit],.login-card>button{width:100%;padding:.85rem;background:var(--color-accent);color:var(--color-on-accent);border:none;border-radius:8px;font-size:1.05rem;box-shadow:inset 0 1px #ffffff26}.login-card button:hover:not(:disabled){background:var(--color-accent-hover)}.login-card button:disabled{opacity:.6;cursor:not-allowed}.error{color:var(--color-error);font-size:.95rem;margin-bottom:1rem}.app-layout{min-height:100vh;display:flex;flex-direction:column}.app-header{display:flex;align-items:center;gap:.35rem;padding:.25rem .6rem;background:var(--color-surface);border-bottom:1px solid var(--color-border);box-shadow:0 1px 6px #0000000f;position:sticky;top:0;z-index:20;flex-wrap:wrap}.app-header nav{display:flex;align-items:center;gap:.15rem;flex-wrap:wrap}.brand{display:inline-flex;align-items:center;gap:.35rem;font-weight:700;font-size:1rem;color:var(--color-accent);text-decoration:none;white-space:nowrap;margin-right:.5rem}.brand .brand-mark{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;background:var(--color-accent);color:var(--color-on-accent);border-radius:8px;font-size:.9rem}.navlink{color:var(--color-text);text-decoration:none;font-size:.88rem;padding:.3rem .55rem;border-radius:6px;min-height:44px;display:inline-flex;align-items:center;border:1px solid transparent}.navlink:hover{background:var(--color-accent);color:var(--color-on-accent);border-color:var(--color-accent)}.navlink.active{background:var(--color-accent);color:var(--color-on-accent);border-color:var(--color-accent);box-shadow:0 2px 8px #6b3fae40}.icon-btn{background:transparent;border:1px solid var(--color-border);border-radius:8px;padding:.4rem .6rem;color:var(--color-text);font-size:1.1rem}.icon-btn:hover{background:var(--color-accent);color:var(--color-on-accent);border-color:var(--color-accent)}.sign-out-btn{padding:.35rem .65rem;background:transparent;color:var(--color-text);border:1px solid var(--color-border);border-radius:6px;font-size:.85rem}.sign-out-btn:hover{background:var(--color-surface-2);border-color:var(--color-accent)}.user-email{color:var(--color-text-muted);font-size:.8rem;max-width:30vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-main{flex:1;padding:.75rem .75rem 2rem}.photos-container{max-width:1600px;margin:0 auto}.btn-primary{background:var(--color-accent);color:var(--color-on-accent);border:none;border-radius:6px;padding:.55rem 1.1rem;font-size:.95rem;box-shadow:inset 0 1px #ffffff26}.btn-primary:hover:not(:disabled){background:var(--color-accent-hover)}.btn-danger{background:transparent;color:var(--color-error);border:1px solid var(--color-error);border-radius:6px;padding:.4rem .75rem;font-size:.85rem}.btn-danger:hover:not(:disabled){background:var(--color-error);color:#fff}@media(prefers-reduced-motion:no-preference){.navlink,.sign-out-btn,.btn-primary,button{transition:background .15s ease,box-shadow .15s ease,transform .15s cubic-bezier(.22,1,.36,1)}}@media(max-width:640px){html{font-size:17px}.app-header{padding:.3rem .6rem}.user-email{display:none}.navlink{font-size:.88rem;padding:.3rem .5rem}}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:10px;padding:.7rem .85rem;box-shadow:var(--shadow-card);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0fa9681f,0 12px 32px #0fa9682e;border-color:var(--color-accent)}.card+.card{margin-top:.6rem}.card-title{font-family:var(--font-display);font-size:.92rem;font-weight:700;margin-bottom:.35rem}.card-hint{font-size:.8rem;color:var(--color-text-muted);margin-bottom:.4rem}.chip-row{display:flex;flex-wrap:wrap;gap:.3rem}.chip{padding:.35rem .65rem;background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);border-radius:999px;cursor:pointer;font-size:.82rem;min-height:36px;transition:all .2s ease}.chip:hover:not(:disabled){border-color:var(--color-accent);background:var(--color-surface-2);transform:translateY(-1px);box-shadow:0 2px 8px #0fa96833}.tag-layout{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:.75rem;align-items:start}.tag-photo-card{padding:.35rem;display:flex;justify-content:center}.tag-controls{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.5rem;align-items:center}@media(max-width:860px){.tag-layout{grid-template-columns:1fr}}.progress-ribbon{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-bottom:.4rem}.progress-track{flex:1;min-width:100px;height:6px;background:var(--color-surface-2);border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--brand-purple),var(--brand-orange));border-radius:999px;transition:width .4s cubic-bezier(.22,1,.36,1)}.momentum{font-weight:700;white-space:nowrap}.momentum .flame{filter:saturate(1.2)}.stat-pill{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:999px;padding:.15rem .55rem;font-size:.78rem;white-space:nowrap}.swipe-hint{position:absolute;top:1rem;padding:.35rem .8rem;border-radius:8px;font-weight:800;font-size:1.1rem;letter-spacing:.04em;text-transform:uppercase;border:3px solid;opacity:0;transition:opacity .1s linear;pointer-events:none}.swipe-hint.left{left:1rem;color:#ffb020;border-color:#ffb020;transform:rotate(-12deg)}.swipe-hint.right{right:1rem;color:var(--color-success);border-color:var(--color-success);transform:rotate(12deg)}@keyframes celebratePulse{0%{transform:scale(.6);opacity:0}40%{transform:scale(1.15);opacity:1}to{transform:scale(1);opacity:0}}.celebrate{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:60}.celebrate span{font-size:5rem;animation:celebratePulse .8s ease-out forwards}@media(prefers-reduced-motion:reduce){.progress-fill{transition:none}.celebrate span{animation-duration:.01s}}.picker-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:50;padding:1rem;animation:overlayFade .18s ease}.picker-card{display:flex;flex-direction:column;max-width:420px;max-height:min(560px,calc(100dvh - 2rem));overflow:hidden;animation:pickerIn .22s cubic-bezier(.22,1,.36,1)}.picker-list{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;margin:.5rem 0}@media(max-width:640px){.picker-overlay{align-items:flex-start;padding:.6rem}.picker-card{max-height:calc(100dvh - 1.2rem);padding:1.25rem}}@keyframes overlayFade{0%{opacity:0}to{opacity:1}}@keyframes pickerIn{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:no-preference){.card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-card)}button{transition:transform .12s ease,filter .15s ease,background .15s ease,border-color .15s ease}button:not(:disabled):hover{filter:brightness(1.06)}button:not(:disabled):active{transform:scale(.97)}.chip{transition:transform .12s ease,background .15s ease,border-color .15s ease}.chip:hover{transform:translateY(-1px)}.photo-grid img,.picker-list button{animation:fadeIn .25s ease both}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}a:focus-visible,button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:6px}@media(prefers-reduced-motion:reduce){.picker-overlay,.picker-card,.photo-grid img,.picker-list button{animation:none}}@media(min-width:1200px){.photo-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))!important}}
