*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f0a1e;--bg2: #1a1030;--bg3: #241848;--card: rgba(255,255,255,.05);--card-border: rgba(155,107,181,.2);--accent: #9b6bb5;--accent-light: #c49ee0;--accent-soft: rgba(155,107,181,.15);--text: #f0e8ff;--text-muted: #9878b8;--text-soft: #5a3878;--green: #4ade80;--red: #f87171;--radius: 14px;--radius-sm: 8px}html{height:100%}body{background:var(--bg);color:var(--text);font-family:Georgia,Times New Roman,serif;min-height:100%;line-height:1.6}#root{min-height:100vh;display:flex;flex-direction:column}button{cursor:pointer;font-family:inherit}input,textarea,select{font-family:inherit}a{color:var(--accent-light);text-decoration:none}.container{max-width:480px;margin:0 auto;padding:1.5rem 1rem;width:100%}.page{flex:1;display:flex;flex-direction:column}.card{background:var(--card);border:.5px solid var(--card-border);border-radius:var(--radius);padding:1.25rem 1.5rem}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:1rem}.label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-family:system-ui,sans-serif}.input{background:var(--bg3);border:.5px solid var(--card-border);border-radius:var(--radius-sm);padding:11px 14px;color:var(--text);font-size:15px;outline:none;transition:border-color .2s;width:100%}.input:focus{border-color:var(--accent)}.input::placeholder{color:var(--text-soft)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border-radius:999px;border:none;font-size:15px;font-weight:500;transition:opacity .2s,transform .1s}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff;width:100%}.btn-primary:hover:not(:disabled){opacity:.9}.btn-ghost{background:transparent;border:.5px solid var(--card-border);color:var(--text-muted);font-size:13px;padding:8px 18px}.btn-ghost:hover{border-color:var(--accent);color:var(--accent-light)}.btn-take{background:var(--accent-soft);border:.5px solid var(--accent);color:var(--accent-light);border-radius:var(--radius-sm);padding:8px 16px;font-size:13px}.btn-taken{background:#4ade801a;border:.5px solid var(--green);color:var(--green);border-radius:var(--radius-sm);padding:8px 16px;font-size:13px}.title{font-size:26px;font-weight:400;color:var(--accent-light);letter-spacing:.02em}.subtitle{font-size:13px;color:var(--text-muted);font-family:system-ui,sans-serif;margin-top:4px}.section-title{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;font-family:system-ui,sans-serif;margin-bottom:12px}.xp-bar-wrap{background:var(--bg3);border-radius:999px;height:4px;margin-top:6px}.xp-bar{background:var(--accent);height:4px;border-radius:999px;transition:width .6s ease}.mood-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mood-chip{background:var(--bg3);border:.5px solid var(--card-border);border-radius:var(--radius-sm);padding:12px;text-align:center;font-size:13px;color:var(--text-muted);transition:all .15s}.mood-chip:hover,.mood-chip.selected{border-color:var(--accent);color:var(--accent-light);background:var(--accent-soft)}.divider{border:none;border-top:.5px solid var(--card-border);margin:1.25rem 0}.dot{width:8px;height:8px;border-radius:50%;display:inline-block}.dot-green{background:var(--green)}.dot-purple{background:var(--accent)}.error-msg{background:#f871711a;border:.5px solid var(--red);color:var(--red);border-radius:var(--radius-sm);padding:10px 14px;font-size:13px;font-family:system-ui,sans-serif;margin-bottom:1rem}.success-msg{background:#4ade801a;border:.5px solid var(--green);color:var(--green);border-radius:var(--radius-sm);padding:10px 14px;font-size:13px;font-family:system-ui,sans-serif;margin-bottom:1rem}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:var(--bg2);border-top:.5px solid var(--card-border);display:flex;justify-content:space-around;padding:10px 0 calc(10px + env(safe-area-inset-bottom));z-index:100}.nav-item{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--text-soft);font-size:10px;font-family:system-ui,sans-serif;padding:4px 16px;transition:color .15s}.nav-item.active{color:var(--accent-light)}.nav-icon{font-size:22px}.pb-nav{padding-bottom:80px}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.fade-in{animation:fadeIn .3s ease}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.pulse{animation:pulse 1.5s ease-in-out infinite}@keyframes medTaken{0%{transform:scale(1)}30%{transform:scale(1.35)}60%{transform:scale(.92)}80%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes bloomPetal{0%{opacity:0;transform:scale(0) rotate(0)}60%{opacity:1;transform:scale(1.2) rotate(180deg)}to{opacity:0;transform:scale(1.6) rotate(360deg)}}@keyframes floatUp{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-40px) scale(.6)}}.med-taken-burst{animation:medTaken .5s cubic-bezier(.36,.07,.19,.97)}.float-up{position:absolute;pointer-events:none;animation:floatUp .8s ease-out forwards;font-size:18px;z-index:10}@keyframes confettiFall{0%{transform:translateY(-20px) rotate(0);opacity:1}to{transform:translateY(60px) rotate(720deg);opacity:0}}.confetti-piece{position:fixed;width:8px;height:8px;border-radius:2px;pointer-events:none;animation:confettiFall .8s ease-out forwards;z-index:1000}@keyframes swipeHintLeft{0%{opacity:0;transform:translate(0)}20%{opacity:.7}80%{opacity:.7;transform:translate(-18px)}to{opacity:0;transform:translate(-22px)}}@keyframes swipeHintRight{0%{opacity:0;transform:translate(0)}20%{opacity:.7}80%{opacity:.7;transform:translate(18px)}to{opacity:0;transform:translate(22px)}}.swipe-hint-left{animation:swipeHintLeft 1.2s ease-in-out 1.5s 1 forwards}.swipe-hint-right{animation:swipeHintRight 1.2s ease-in-out 1.5s 1 forwards}[data-theme=light]{--bg: #f8f4ff;--bg2: #ede6f7;--bg3: #e0d5f0;--card: rgba(155,107,181,.06);--card-border: rgba(155,107,181,.25);--accent: #7b4fa6;--accent-light: #6b3d96;--accent-soft: rgba(155,107,181,.12);--text: #1a0f2e;--text-muted: #6b4d8a;--text-soft: #c4b0d8;--green: #1a7a4a;--red: #c0392b}[data-theme=light] .bottom-nav{background:#ede6f7;border-top-color:#9b6bb533}[data-theme=light] .card{box-shadow:0 1px 4px #9b6bb51a}