:root{--bg: #f7f4ee;--bg2: #f0ece3;--bg3: #e8e2d6;--bg4: #ddd7c8;--border: rgba(80,65,40,.1);--border2: rgba(80,65,40,.18);--text: #2c2518;--text2: #6b5f48;--text3: #9e9080;--accent: #4a7c3f;--accent2: #3a6030;--accent-bg: #eef5eb;--accent-border: rgba(74,124,63,.25);--font: "DM Sans", sans-serif;--serif: "Lora", serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.5}body{min-height:100vh;max-width:480px;margin:0 auto}::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg4);border-radius:2px}#screen-login{display:flex;flex-direction:column;justify-content:center;padding:3rem 1.75rem 2rem;min-height:100vh}.login-eyebrow{font-family:var(--serif);font-style:italic;font-size:13px;color:var(--text3);margin-bottom:.4rem;letter-spacing:.01em}.login-logo{font-family:var(--serif);font-size:42px;font-weight:400;color:var(--text);margin-bottom:.2rem;letter-spacing:-.01em}.login-logo span{color:var(--accent)}.login-divider{width:40px;height:1px;background:var(--border2);margin:1.75rem 0}.field-lbl{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text3);margin-bottom:5px;font-weight:500}.field-wrap{margin-bottom:1rem}input[type=text],input[type=password]{width:100%;background:#fff;border:1px solid var(--border2);border-radius:8px;padding:10px 13px;color:var(--text);font-family:var(--font);font-size:14px;outline:none;transition:border-color .2s,box-shadow .2s}input[type=text]:focus,input[type=password]:focus{border-color:var(--accent);box-shadow:0 0 0 3px #4a7c3f1a}input::placeholder{color:var(--text3)}.primary-btn{width:100%;padding:11px;border-radius:8px;background:var(--accent);color:#fff;font-size:14px;font-weight:500;border:none;cursor:pointer;font-family:var(--font);transition:background .15s,transform .1s;margin-top:.5rem}.primary-btn:hover:not(:disabled){background:var(--accent2)}.primary-btn:active:not(:disabled){transform:scale(.98)}.primary-btn:disabled{opacity:.6;cursor:default}.switch-lnk{font-size:13px;color:var(--text3);text-align:center;margin-top:1rem;cursor:pointer}.switch-lnk span{color:var(--accent)}.err-msg{font-size:12px;color:#a03030;min-height:16px;margin-top:4px}.ok-msg{font-size:12px;color:var(--accent);margin-top:4px}.forgot-lnk{font-size:12px;color:var(--text3);text-align:center;margin-top:.75rem;cursor:pointer}.forgot-lnk:hover{color:var(--accent)}.header{padding:1rem 1.25rem .875rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--bg);z-index:10}.header-logo{font-family:var(--serif);font-size:22px;font-weight:400;letter-spacing:-.01em;color:var(--text)}.header-logo span{color:var(--accent)}.header-right{display:flex;align-items:center;gap:10px}.header-user{font-size:12px;color:var(--text3)}.ghost-btn{font-size:12px;color:var(--text3);cursor:pointer;padding:4px 10px;border-radius:20px;border:1px solid var(--border2);background:transparent;font-family:var(--font);transition:all .15s}.ghost-btn:hover{color:var(--text2);background:var(--bg2)}.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:1rem 1.25rem}.stat{background:#fff;border:1px solid var(--border);border-radius:10px;padding:12px;text-align:center}.stat-val{font-family:var(--serif);font-size:26px;font-weight:400;color:var(--text);letter-spacing:-.02em}.stat-lbl{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--text3);margin-top:2px}.level-section{padding:0 1.25rem 1.1rem}.level-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px}.level-name{font-size:13px;color:var(--text2)}.level-name strong{color:var(--accent);font-weight:500}.level-xp{font-size:11px;color:var(--text3)}.bar-track{height:3px;background:var(--bg3);border-radius:2px;overflow:hidden}.bar-fill{height:100%;background:var(--accent);border-radius:2px;transition:width .5s ease}.section-label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);padding:0 1.25rem .65rem;font-weight:500}.badges-wrap{display:flex;gap:6px;padding:0 1.25rem 1.25rem;flex-wrap:wrap}.badge{font-size:11px;padding:4px 10px;border-radius:20px;border:1px solid var(--border);color:var(--text3);background:#fff;display:flex;align-items:center;gap:5px;transition:all .2s}.badge-pip{width:5px;height:5px;border-radius:50%;background:var(--bg4);flex-shrink:0;transition:background .2s}.badge.earned{border-color:var(--accent-border);color:var(--accent);background:var(--accent-bg)}.badge.earned .badge-pip{background:var(--accent)}.filter-row{display:flex;gap:5px;padding:0 1.25rem .875rem;overflow-x:auto}.filter-row::-webkit-scrollbar{display:none}.chip{font-size:12px;padding:5px 13px;border-radius:20px;cursor:pointer;border:1px solid var(--border);background:#fff;color:var(--text2);white-space:nowrap;transition:all .15s;font-family:var(--font)}.chip:hover{border-color:var(--border2)}.chip.active{background:var(--accent-bg);color:var(--accent);border-color:var(--accent-border)}.animal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0 1.25rem 2rem}@media(min-width:640px){body{max-width:900px}.animal-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(min-width:1024px){body{max-width:1400px}.animal-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.bottom-nav{max-width:1400px}}.acard{background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 13px;cursor:pointer;position:relative;transition:border-color .15s,box-shadow .15s;animation:fadeUp .2s ease both}.acard:hover{border-color:var(--border2);box-shadow:0 2px 8px #2c25180f}.acard.seen{border-color:var(--accent-border);background:var(--accent-bg)}.acard-name{font-size:13px;font-weight:500;color:var(--text);margin-bottom:2px;line-height:1.3}.acard-latin{font-size:10px;color:var(--text3);font-style:italic;margin-bottom:8px;font-family:var(--serif)}.acard-meta{display:flex;align-items:center;gap:5px}.rdot{width:5px;height:5px;border-radius:50%;flex-shrink:0}.acard-rarity{font-size:11px;color:var(--text3)}.seen-check{position:absolute;top:10px;right:10px;width:16px;height:16px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center}.modal-bg{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#2c251880;z-index:100;align-items:flex-end;justify-content:center}.modal-bg.open{display:flex}.modal{background:var(--bg);border:1px solid var(--border2);border-radius:20px 20px 0 0;width:100%;max-width:480px;padding:1.25rem 1.5rem 2rem;max-height:82vh;overflow-y:auto}.drag-handle{width:32px;height:3px;background:var(--bg4);border-radius:2px;margin:0 auto 1.25rem}.m-name{font-family:var(--serif);font-size:24px;font-weight:400;color:var(--text);margin-bottom:3px;letter-spacing:-.01em}.m-latin{font-family:var(--serif);font-size:13px;font-style:italic;color:var(--text3);margin-bottom:.875rem}.m-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:1rem}.m-tag{font-size:11px;padding:3px 10px;border-radius:20px;background:var(--bg2);color:var(--text3);border:1px solid var(--border)}.m-tag.rarity-tag{background:transparent;border:1px solid}.facts{list-style:none;margin-bottom:1rem}.facts li{padding:8px 0;border-bottom:1px solid var(--border);font-size:13px;color:var(--text2);display:flex;gap:10px;align-items:flex-start;line-height:1.5}.facts li:last-child{border-bottom:none}.fact-dash{color:var(--text3);flex-shrink:0}.ethics-box{background:var(--accent-bg);border:1px solid var(--accent-border);border-radius:10px;padding:11px 13px;margin-bottom:1rem}.ethics-label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);font-weight:500;margin-bottom:4px;opacity:.8}.ethics-text{font-size:13px;color:var(--accent2);line-height:1.55}.log-btn{width:100%;padding:12px;border-radius:10px;background:var(--accent);color:#fff;font-size:14px;font-weight:500;border:none;cursor:pointer;font-family:var(--font);transition:background .15s}.log-btn:hover{background:var(--accent2)}.log-btn.done{background:var(--bg3);color:var(--text3);cursor:default}.log-btn.done:hover{background:var(--bg3)}#toast{position:fixed;top:1rem;left:50%;transform:translate(-50%) translateY(-80px);background:var(--text);color:var(--bg);padding:9px 18px;border-radius:20px;font-size:12px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);z-index:200;white-space:nowrap;pointer-events:none}#toast.show{transform:translate(-50%) translateY(0)}@keyframes fadeUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.settings-screen{min-height:100vh;padding:0 1.5rem 3rem}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 0 .875rem;border-bottom:1px solid var(--border);margin-bottom:1.5rem;position:sticky;top:0;background:var(--bg);z-index:10}.back-btn{background:none;border:none;font-family:var(--font);font-size:13px;color:var(--accent);cursor:pointer;padding:4px 0;width:60px}.settings-title{font-family:var(--serif);font-size:17px;color:var(--text)}.settings-section{margin-bottom:1.5rem}.settings-section-label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);font-weight:500;margin-bottom:.75rem}.settings-textarea{width:100%;background:#fff;border:1px solid var(--border2);border-radius:8px;padding:10px 13px;color:var(--text);font-family:var(--font);font-size:14px;outline:none;resize:none;line-height:1.5;transition:border-color .2s,box-shadow .2s}.settings-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #4a7c3f1a}.settings-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border)}.settings-toggle-row:last-child{border-bottom:none}.settings-toggle-label{font-size:14px;color:var(--text)}.settings-toggle-sub{font-size:11px;color:var(--text3);margin-top:2px}.toggle-btn{width:40px;height:24px;border-radius:12px;border:none;background:var(--bg3);cursor:pointer;position:relative;transition:background .2s;flex-shrink:0}.toggle-btn:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;top:3px;left:3px;transition:transform .2s;box-shadow:0 1px 3px #0003}.toggle-btn.on{background:var(--accent)}.toggle-btn.on:after{transform:translate(16px)}.settings-danger{margin-top:1rem}.danger-btn{width:100%;padding:10px;border-radius:8px;background:transparent;border:1px solid #c0392b;color:#c0392b;font-size:14px;font-weight:500;cursor:pointer;font-family:var(--font);transition:background .15s}.danger-btn:hover{background:#fdf0ef}.delete-confirm{margin-top:.75rem}.delete-confirm-text{font-size:13px;color:var(--text2);margin-bottom:.75rem;line-height:1.5}.loading-species{text-align:center;padding:3rem 1.25rem;font-size:13px;color:var(--text3)}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;background:var(--bg);border-top:1px solid var(--border);display:grid;grid-template-columns:repeat(3,1fr);z-index:50;padding-bottom:env(safe-area-inset-bottom,0)}.nav-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px 0 13px;gap:4px;cursor:pointer;border:none;background:transparent;font-family:var(--font);color:var(--text3);transition:color .15s}.nav-tab:hover{color:var(--text2)}.nav-tab.active{color:var(--accent)}.nav-tab svg{width:21px;height:21px}.nav-tab-label{font-size:10px;letter-spacing:.04em;font-weight:500}#screen-main{padding-bottom:72px}.scroll-sentinel{padding:.5rem 1.25rem 1rem;min-height:1px}.loading-more{font-size:12px;color:var(--text3);text-align:center;padding:.5rem 0}.filter-sep{width:1px;background:var(--border2);flex-shrink:0;margin:4px 3px}.grid-empty{grid-column:1 / -1;text-align:center;padding:3rem 0;font-size:13px;color:var(--text3)}.grid-topbar{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.25rem}.filter-trigger{display:flex;align-items:center;gap:6px;font-size:13px;font-family:var(--font);font-weight:500;color:var(--text2);background:#fff;border:1px solid var(--border2);border-radius:20px;padding:7px 16px;cursor:pointer;transition:all .15s}.filter-trigger:hover{border-color:var(--accent-border);color:var(--accent)}.filter-trigger.active{background:var(--accent-bg);border-color:var(--accent-border);color:var(--accent)}.search-bar{position:relative;display:flex;align-items:center;margin:0 1.25rem .75rem}.search-icon{position:absolute;left:.75rem;color:var(--text3);pointer-events:none}input.search-input{width:100%;background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:.55rem 2.25rem .55rem 2.75rem;font-family:var(--font);font-size:.875rem;color:var(--text);outline:none;transition:border-color .15s;box-shadow:none}input.search-input::placeholder{color:var(--text3)}input.search-input:focus{border-color:var(--border2)}.search-clear{position:absolute;right:.65rem;background:none;border:none;padding:4px;cursor:pointer;color:var(--text3);display:flex;align-items:center}.search-clear:hover{color:var(--text)}.fdrawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#2c251873;z-index:120;display:flex;align-items:flex-end;justify-content:center}.fdrawer-sheet{background:var(--bg);border-radius:20px 20px 0 0;width:100%;max-width:480px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden}@media(min-width:640px){.fdrawer-sheet{max-width:560px}}.fdrawer-handle{width:32px;height:3px;background:var(--bg4);border-radius:2px;margin:1rem auto 0;flex-shrink:0}.fdrawer-header{display:flex;align-items:center;justify-content:space-between;padding:.875rem 1.25rem;border-bottom:1px solid var(--border);flex-shrink:0}.fdrawer-title{font-family:var(--serif);font-size:17px;color:var(--text)}.fdrawer-clear{font-size:12px;color:var(--text3);background:none;border:none;cursor:pointer;font-family:var(--font);padding:4px 0}.fdrawer-clear:hover{color:var(--accent)}.fdrawer-body{overflow-y:auto;padding:.75rem 0 2rem;flex:1}.fdrawer-group{padding:.75rem 1.25rem}.fdrawer-group+.fdrawer-group{border-top:1px solid var(--border)}.fdrawer-group-label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);font-weight:500;margin-bottom:.65rem}.fdrawer-chips{display:flex;flex-wrap:wrap;gap:6px}.country-chip{display:flex;align-items:center;gap:5px;white-space:nowrap}.country-chip-clear{font-size:14px;line-height:1;opacity:.6;margin-left:2px;padding:0 2px}.country-chip-clear:hover{opacity:1}.cpicker-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#2c251873;z-index:120;display:flex;align-items:flex-end;justify-content:center}.cpicker-sheet{background:var(--bg);border-radius:20px 20px 0 0;width:100%;max-width:480px;max-height:72vh;display:flex;flex-direction:column;overflow:hidden}.cpicker-header{padding:1rem 1.25rem .75rem;border-bottom:1px solid var(--border);flex-shrink:0}.cpicker-search{width:100%;background:var(--bg2);border:1px solid var(--border2);border-radius:8px;padding:9px 13px;font-family:var(--font);font-size:14px;color:var(--text);outline:none}.cpicker-search:focus{border-color:var(--accent)}.cpicker-list{overflow-y:auto;flex:1;padding:.4rem 0 2rem}.cpicker-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 1.25rem;border:none;background:transparent;font-family:var(--font);font-size:14px;color:var(--text);cursor:pointer;text-align:left;transition:background .1s}.cpicker-item:hover{background:var(--bg2)}.cpicker-item.selected{color:var(--accent);background:var(--accent-bg)}.cpicker-flag{font-size:18px;flex-shrink:0;width:24px;text-align:center}.cpicker-code{margin-left:auto;font-size:11px;color:var(--text3)}.cpicker-empty{text-align:center;padding:2rem;font-size:13px;color:var(--text3)}