@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;600;700&family=Space+Mono:wght@400;700&display=swap');
:root{--ink:#172c2a;--muted:#71807c;--paper:#f4f0e4;--card:#fffdf7;--green:#176f5d;--mint:#b9ddd0;--line:#d9ded5;--orange:#ee8c51;--shadow:0 12px 30px #233f3720;font-family:'DM Sans',system-ui,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 10% 0,#fff9e9 0,transparent 32%),var(--paper)}button,input{font:inherit;color:inherit}button{cursor:pointer}.app-shell{min-height:100vh;padding-bottom:88px}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1120px)/2));border-bottom:1px solid var(--line);background:#f4f0e4dd;backdrop-filter:blur(12px);position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:10px;border:0;background:none;text-align:left;font:700 10px/1.05 'Space Mono';letter-spacing:1px}.brand b{font-size:14px}.brand-mark{display:grid;place-items:center;width:36px;height:36px;background:var(--green);color:white;border:3px solid var(--ink);box-shadow:3px 3px 0 var(--orange);font:700 20px 'Space Mono'}.user-pill{height:46px;border:1px solid var(--line);border-radius:24px;background:var(--card);padding:4px 13px 4px 5px;display:flex;align-items:center;gap:8px;font-weight:700}.user-pill>span:first-child{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--mint);font:700 11px 'Space Mono'}.page{max-width:1120px;margin:auto;padding:48px 24px 60px}.page-title,.section-head,.dialog-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:28px}.eyebrow{font:700 11px 'Space Mono';letter-spacing:1.8px;color:var(--green)}h1,h2,h3,p{margin:0}h1{font:700 clamp(34px,6vw,52px)/1.05 'Space Mono';letter-spacing:-2px;margin-top:5px}h1 sup{font-size:13px;letter-spacing:0;background:var(--mint);padding:4px 7px;vertical-align:top}.square-button,.icon-button{width:48px;height:48px;background:var(--green);color:white;border:0;font-size:21px}.progress-card{background:var(--green);color:white;min-height:248px;padding:36px clamp(24px,5vw,58px);display:flex;align-items:center;gap:clamp(28px,6vw,80px);box-shadow:var(--shadow);position:relative;overflow:hidden}.progress-card:after{content:'';position:absolute;width:190px;height:190px;border:1px solid #ffffff15;transform:rotate(45deg);right:-55px;top:-80px}.progress-card .eyebrow{color:var(--mint)}.progress-card h2{font:700 52px 'Space Mono';margin-top:10px}.progress-card h2 span{font-size:24px;color:var(--mint)}.progress-card p{color:#d8eae4}.progress-ring{flex:0 0 160px;aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--orange) var(--progress),#ffffff20 0);display:grid;place-items:center;position:relative}.progress-ring:after{content:'';position:absolute;inset:12px;border-radius:50%;background:var(--green)}.progress-ring div{z-index:1;text-align:center}.progress-ring strong{display:block;font:700 34px 'Space Mono'}.progress-ring small{font:700 8px 'Space Mono';letter-spacing:1px}.bar{width:min(340px,100%);height:7px;background:#ffffff25;margin-top:22px}.bar i{height:100%;background:var(--orange);display:block}.section{margin-top:48px}.section-head h2{font:700 25px 'Space Mono';margin-top:5px}.text-button{border:0;background:none;color:var(--green);font-weight:700;min-height:44px}.recent-list{background:var(--card);border:1px solid var(--line)}.recent-row{display:grid;grid-template-columns:64px 1fr auto 20px;align-items:center;width:100%;min-height:86px;padding:10px 18px;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;gap:16px}.recent-row:last-child{border:0}.recent-row b,.recent-row small{display:block}.recent-row small{color:var(--muted);margin-top:3px}.recent-row time{font:400 11px 'Space Mono';color:var(--muted)}.bird-icon{width:62px;height:62px;display:grid;place-items:center;background:linear-gradient(135deg,#dceee5,#b8d9ca);border:1px solid #a8c8ba;position:relative;overflow:hidden}.bird-icon:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 50%,#fff2 50%),linear-gradient(transparent 50%,#17322d08 50%);background-size:8px 8px}.bird-icon span{font-size:35px;filter:saturate(.75);z-index:1}.dex-search-form>label{display:block;font-weight:700;margin-bottom:8px}.search{min-height:58px;background:var(--card);border:2px solid var(--ink);display:flex;align-items:center;padding:6px 10px 6px 16px;gap:12px;box-shadow:4px 4px 0 var(--mint)}.search span{font-size:26px}.search input{border:0;outline:0;background:none;width:100%;font-size:16px;min-width:80px}.search button,.search a{border:0;background:var(--green);color:#fff;padding:10px 13px;font-weight:700;text-decoration:none;white-space:nowrap}.search a{background:transparent;color:var(--green)}.filters{display:flex;gap:8px;margin:22px 0 8px;padding:0;border:0}.filters legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.filters label{min-height:44px;border:1px solid var(--line);background:var(--card);padding:0 18px;font-weight:700;display:flex;align-items:center;cursor:pointer}.filters label.active{color:white;background:var(--green);border-color:var(--green)}.filters input{position:absolute;opacity:0}.filters label:focus-within{outline:2px solid var(--orange);outline-offset:2px}.reset-all{display:inline-block;color:var(--green);font-weight:700;margin-bottom:10px}.result-count{display:flex;justify-content:space-between;margin:30px 0 14px}.result-count span{font:11px 'Space Mono';color:var(--muted)}.species-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.species-card{display:block;color:inherit;text-decoration:none;background:var(--card);border:1px solid var(--line);padding:18px;text-align:left;position:relative;min-height:205px;transition:.15s}.species-card:hover,.species-card:focus-visible{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--green)}.species-card .bird-icon{width:100%;height:112px;margin-bottom:13px}.species-card .bird-icon span{font-size:56px}.species-card b,.species-card small{display:block}.species-card small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.species-card .status{position:absolute;right:25px;top:25px;z-index:2;width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:white;border:1px solid var(--line);font-weight:700}.species-card.seen .status{background:var(--orange);border-color:var(--ink);color:var(--ink)}.species-card.unseen .bird-icon{filter:grayscale(1);opacity:.55}.sighting-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sighting-card{display:grid;grid-template-columns:70px 1fr auto 15px;align-items:center;gap:14px;text-align:left;border:1px solid var(--line);background:var(--card);padding:12px}.sighting-card b,.sighting-card small,.sighting-card i{display:block}.sighting-card small,.sighting-card i,.sighting-card time{font-size:12px;color:var(--muted)}.sighting-card time{font-family:'Space Mono'}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}.metric-grid article{background:var(--card);border:1px solid var(--line);padding:28px;display:grid;gap:12px}.metric-grid strong{font:700 38px 'Space Mono'}.metric-grid small{font:700 10px 'Space Mono';letter-spacing:1px;color:var(--muted)}.metric-icon{font:700 18px 'Space Mono';color:var(--green)}.profile-card{background:var(--card);border:1px solid var(--line);padding:48px;text-align:center;max-width:560px;margin:auto}.avatar{width:100px;height:100px;border-radius:50%;background:var(--mint);display:grid;place-items:center;margin:0 auto 20px;font:700 25px 'Space Mono';border:3px solid var(--green)}.profile-id{font:11px 'Space Mono';color:var(--muted)}.profile-card>div:nth-of-type(2){margin:30px 0}.profile-card>div:nth-of-type(2) b,.profile-card>div:nth-of-type(2) small{display:block}.profile-card>div:nth-of-type(2) b{font:700 40px 'Space Mono'}.primary{min-height:48px;border:0;background:var(--green);color:white;padding:0 22px;font-weight:700}.back{display:inline-flex;align-items:center;text-decoration:none;border:0;background:none;min-height:48px;margin-bottom:16px;color:var(--green);font-weight:700}.detail-card{display:grid;grid-template-columns:1fr 1fr;background:var(--card);border:1px solid var(--line)}.detail-visual{min-height:500px;background:#d8e9df;display:grid;place-items:center;position:relative}.bird-icon.large{width:260px;height:260px;border:3px solid var(--ink);box-shadow:10px 10px 0 #98bead}.bird-icon.large span{font-size:145px}.number{position:absolute;bottom:25px;left:30px;font:700 14px 'Space Mono';color:var(--green)}.detail-copy{padding:clamp(30px,6vw,70px);align-self:center}.detail-copy h1{margin-top:12px}.english{font-size:22px;margin-top:13px}.scientific{font-style:italic;color:var(--muted);margin-top:5px}.divider{height:1px;background:var(--line);margin:35px 0}.seen-toggle{width:100%;min-height:64px;margin-top:14px;border:2px solid var(--green);background:white;display:flex;align-items:center;gap:14px;padding:8px 16px;text-align:left}.seen-toggle span{width:40px;height:40px;background:var(--mint);display:grid;place-items:center;font-size:24px}.seen-toggle.active{background:var(--green);color:white}.seen-toggle.active span{background:var(--orange);color:var(--ink)}.seen-date{display:block;color:var(--muted);margin-top:10px}.empty{text-align:center;border:1px dashed #aab6b0;padding:50px 20px;background:#fff9}.empty>span{font-size:40px;color:var(--green)}.empty p{color:var(--muted);margin:8px 0 20px}.bottom-nav{display:flex;position:fixed;z-index:20;bottom:18px;left:50%;transform:translateX(-50%);height:66px;background:var(--ink);padding:5px;box-shadow:0 10px 35px #14262250}.bottom-nav button,.bottom-nav a{width:100px;border:0;background:none;color:#b7c4c0;display:grid;place-content:center;gap:2px;min-height:54px}.bottom-nav button>span,.bottom-nav a>span{font-size:19px}.bottom-nav small{font-size:10px;font-weight:700}.bottom-nav button.active,.bottom-nav a.active{background:var(--green);color:white}.bottom-nav button.active>span,.bottom-nav a.active>span{color:var(--orange)}dialog{border:0;padding:28px;width:min(440px,calc(100% - 32px));background:var(--paper);box-shadow:0 20px 80px #10201b88}dialog::backdrop{background:#172c2aaa}.dialog-head{align-items:start}.dialog-head h2{font:700 23px 'Space Mono';margin-top:5px}.icon-button{background:none;color:var(--ink);border:1px solid var(--line)}.user-option{display:grid;grid-template-columns:48px 1fr auto 24px;align-items:center;text-align:left;width:100%;min-height:70px;border:1px solid var(--line);background:var(--card);padding:10px;gap:12px;margin-top:8px}.user-option>span{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--mint);font:700 11px 'Space Mono'}.user-option small{color:var(--muted)}.user-option i{font-style:normal;color:var(--green);font-weight:700}.user-option.active{border:2px solid var(--green)}
@media(max-width:760px){.topbar{height:68px;padding:0 16px}.user-pill #user-name{display:none}.page{padding:32px 16px 45px}.page-title{margin-bottom:22px}.progress-card{padding:28px 22px;gap:20px}.progress-ring{flex-basis:118px}.progress-ring strong{font-size:27px}.progress-card h2{font-size:36px}.progress-card h2 span{font-size:17px}.species-grid{grid-template-columns:repeat(2,1fr);gap:10px}.species-card{padding:10px;min-height:180px}.species-card .bird-icon{height:105px}.species-card .status{top:16px;right:16px}.sighting-grid{grid-template-columns:1fr}.metric-grid{grid-template-columns:1fr}.detail-card{grid-template-columns:1fr}.detail-visual{min-height:310px}.bird-icon.large{width:190px;height:190px}.bird-icon.large span{font-size:105px}.detail-copy{padding:30px 22px 38px}.bottom-nav{bottom:0;width:100%;height:72px;padding:4px 4px max(4px,env(safe-area-inset-bottom))}.bottom-nav button,.bottom-nav a{width:20%}.recent-row{grid-template-columns:56px 1fr 14px;padding:8px}.recent-row time{display:none}.search kbd{display:none}}
@media(max-width:380px){.progress-card{display:block}.progress-ring{width:110px;margin-bottom:20px}.species-card small{font-size:11px}.bottom-nav small{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Reduced server-rendered entry screen; the application navigation stays hidden here. */
.login-page{min-height:100vh}.login-shell{min-height:100vh;display:grid;place-items:center;padding:32px 20px}.login-card{width:min(100%,440px);background:var(--card);border:1px solid var(--line);padding:clamp(28px,7vw,48px);box-shadow:var(--shadow)}.login-brand{display:flex;align-items:center;gap:12px;font:700 15px 'Space Mono';letter-spacing:1.4px}.login-brand b{color:var(--green)}.login-heading{margin:48px 0 32px}.login-heading h1{font-size:clamp(32px,9vw,45px);margin:8px 0 12px}.login-heading p{color:var(--muted);line-height:1.5}.login-form{display:grid;gap:20px}.form-field{display:grid;gap:8px}.form-field label{font:700 11px 'Space Mono';letter-spacing:.8px}.form-field input{width:100%;min-height:52px;border:1px solid var(--line);background:white;padding:0 14px;border-radius:0;font-size:16px}.form-field input:focus{outline:2px solid var(--green);outline-offset:2px}.login-message{min-height:21px;color:#9d3d2b;font-size:14px}.login-button{width:100%;min-height:54px}.login-button:hover,.login-button:focus-visible{background:var(--ink)}
@media(max-width:480px){.login-shell{padding:16px}.login-card{padding:28px 22px}.login-heading{margin:38px 0 28px}}

/* Session action in the existing authenticated header. */
.topbar-actions{display:flex;align-items:center;gap:10px}.logout-form{margin:0}.logout-button{min-height:42px;border:1px solid var(--green);background:transparent;color:var(--green);padding:0 14px;font-weight:700}.logout-button:hover,.logout-button:focus-visible{background:var(--green);color:white}@media(max-width:480px){.topbar-actions{gap:6px}.logout-button{padding:0 9px;font-size:13px}}

.localized-name{margin-top:13px}.detail-label,.status-copy{font-weight:700}.taxonomy{margin-top:30px}.taxonomy dl{margin:12px 0 0}.taxonomy dl div{display:grid;grid-template-columns:100px 1fr;padding:9px 0;border-bottom:1px solid var(--line)}.taxonomy dt{font-weight:700}.taxonomy dd{margin:0}.status-copy{margin-top:12px}.bottom-nav a{border:0;background:none;color:#b7c4c0;display:grid;place-content:center;gap:2px;min-height:54px;text-decoration:none;text-align:center}
.topbar a.brand{color:inherit;text-decoration:none}
.progress-card progress{width:min(340px,100%);height:9px;margin-top:22px;accent-color:var(--orange)}.progress-card+.dex-search-form{margin-top:32px}