@font-face{
font-family:'DM Mono';
font-weight:400;
font-style:normal;
font-display:swap;
src:url('/app/fonts/dm-mono-400.woff2') format('woff2');
}
@font-face{
font-family:'DM Mono';
font-weight:500;
font-style:normal;
font-display:swap;
src:url('/app/fonts/dm-mono-500.woff2') format('woff2');
}
@font-face{
font-family:'DM Mono';
font-weight:700;
font-style:normal;
font-display:swap;
src:url('/app/fonts/dm-mono-700.woff2') format('woff2');
}
*, *::before, *::after{box-sizing:border-box;margin:0;padding:0;}
:root{
--bg-base:       #8a7550;
--bg-card:       #1e1a0e;
--bg-card-alt:   #252010;
--bg-toggle:     #2a2412;
--bg-toggle-act: #332d18;

--text-primary:  #f0ead8;
--text-secondary:#c9a97e;
--text-muted:    #8a7a52;
--text-accent:   #b8956a;

--rating-poor:   #c94a2a;
--rating-avg:    #b8956a;
--rating-good:   #7a9440;

--cta-bg:        #647934;
--cta-bg-hover:  #7a9240;
--cta-text:      #f0ead8;

--border:        rgba(184,149,106,0.18);
--border-table:  rgba(184,149,106,0.10);
--border-default:rgba(184,149,106,0.18);
--surface-raised:#2b2415;

--sky:           #3d7a6e;

--bg:       var(--bg-base);
--card:     var(--bg-card);
--text:     var(--text-secondary);
--text-main:var(--text-primary);
--muted:    var(--text-muted);
--excellent:var(--rating-good);
--good:     var(--rating-good);
--average:  var(--rating-avg);
--poor:     var(--rating-poor);
}
html, body{
background:#8a7550;
color:var(--text);
font-family:'IBM Plex Sans', sans-serif;
font-size:16px;
min-height:100vh;
-webkit-font-smoothing:antialiased;
overflow-x:hidden;
overflow-y:auto;
-webkit-overflow-scrolling:touch;
overscroll-behavior:none;
}
#app{
width:100%;
max-width:390px;
overflow-x:hidden;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='200' viewBox='0 0 120 200'%3E%3Cg stroke='%23b8956a' stroke-width='1' fill='none' opacity='0.035'%3E%3Cline x1='15' y1='200' x2='18' y2='60' /%3E%3Cline x1='18' y1='60' x2='22' y2='200' /%3E%3Cellipse cx='18' cy='52' rx='4' ry='12' fill='%23b8956a' /%3E%3Cline x1='55' y1='200' x2='57' y2='80'/%3E%3Cline x1='57' y1='80' x2='60' y2='200'/%3E%3Cellipse cx='57' cy='72' rx='3' ry='10' fill='%23b8956a' /%3E%3Cline x1='95' y1='200' x2='98' y2='50'/%3E%3Cline x1='98' y1='50' x2='102' y2='200'/%3E%3Cellipse cx='98' cy='42' rx='4' ry='11' fill='%23b8956a' /%3E%3Cpath d='M15 130 Q5 115 10 100' /%3E%3Cpath d='M22 110 Q32 95 28 80' /%3E%3C/g%3E%3C/svg%3E");
background-size:120px 200px;
background-repeat:repeat;
margin:0 auto;
padding-bottom:calc(120px + env(safe-area-inset-bottom));
}

.card{
background:var(--card);
border:1px solid var(--border);
border-radius:10px;
padding:16px;
margin:0 16px 12px;
}
.card-label{
font-family:'Barlow Condensed', sans-serif;
font-weight:700;
font-size:13px;
letter-spacing:0.14em;
text-transform:uppercase;
color:#c9a97e;
margin-bottom:8px;
}

.header{
padding:calc(10px + env(safe-area-inset-top)) 16px 14px;
border-bottom:1px solid var(--border);
background:#1a1508;
background:linear-gradient(to bottom, rgba(20,17,8,0.99), rgba(30,26,14,0.97));
position:sticky;
top:0;
z-index:10;
}
.ios .header{
padding-top:max(54px, calc(10px + env(safe-area-inset-top)));
}
.header-top{
display:flex;
justify-content:space-between;
align-items:center;
}
.brand-lockup{
display:flex;
align-items:center;
gap:12px;
}
.logo-mark{
width:54px;
height:54px;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
background:transparent;
border:none;
border-radius:12px;
}
.logo-img{
width:54px;
height:54px;
object-fit:contain;
mix-blend-mode:screen;
background:transparent;
}
.brand{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:26px;
letter-spacing:0.06em;
color:var(--text-accent);
line-height:1;
}
.brand-sub{
font-family:'IBM Plex Mono', monospace;
font-size:9px;
color:var(--text-muted);
letter-spacing:0.14em;
text-transform:uppercase;
margin-top:1px;
}
.menu-btn{
width:38px;
height:38px;
border-radius:10px;
background:var(--bg-toggle-act);
border:1.5px solid rgba(184,149,106,0.35);
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
color:var(--text-secondary);
font-size:18px;
}
.date-row{
display:flex;
justify-content:space-between;
align-items:baseline;
}
.date-label{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:20px;
letter-spacing:0.08em;
color:var(--text-accent);
}
.freshness{
display:flex;
align-items:center;
gap:5px;
font-family:'IBM Plex Mono', monospace;
font-size:10px;
color:var(--text-secondary);
background:#1e1a0e;
border:1px solid rgba(184,149,106,0.35);
border-radius:20px;
padding:3px 8px;
}
.freshness-dot{
width:6px;
height:6px;
border-radius:50%;
background:var(--rating-good);
animation:freshness-pulse 2s infinite;
}
@keyframes freshness-pulse{
0%,100%{opacity:1;}
50%{opacity:0.4;}
}

.dropdown{
display:none;
position:absolute;
top:70px;
right:16px;
background:var(--bg-card-alt);
border:1px solid var(--border);
border-radius:10px;
padding:6px;
min-width:180px;
z-index:100;
box-shadow:0 8px 30px rgba(0,0,0,0.5);
}
.dropdown.open{display:block;}
.dropdown-item{
padding:10px 14px;
font-size:14px;
color:var(--text-secondary);
border-radius:6px;
cursor:pointer;
display:flex;
align-items:center;
gap:8px;
font-family:'IBM Plex Sans', sans-serif;
}
.dropdown-item:hover{background:var(--bg-toggle-act);color:var(--text-primary);}
.dropdown-item.danger{color:#e05c3a;}
.dropdown-item.danger:hover{background:rgba(224,92,58,0.12);}
.dropdown-sep{height:1px;background:var(--border);margin:4px 0;}
.dropdown-email{
padding:8px 14px 6px;
font-family:'IBM Plex Mono', monospace;
font-size:10px;
color:var(--text-muted);
letter-spacing:0.05em;
}
.rating-block{
padding:20px 16px 12px;
}
.rating-card{
background:var(--bg-card);
border:1px solid var(--border);
border-radius:10px;
padding:14px 16px 16px;
margin:0 16px 12px;
}
.rating-text{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:72px;
line-height:0.9;
}
.rating-bar{
width:100%;
height:4px;
background:rgba(255,255,255,0.08);
border-radius:2px;
overflow:hidden;
margin-top:14px;
}
.rating-bar-fill{
height:100%;
border-radius:2px;
transition:width 0.4s ease;
}
.moon-line{
font-size:12px;
color:var(--muted);
margin-top:6px;
}

.session-card{
border-left-width:3px;
border-left-style:solid;
padding-left:14px;
}

.region-summary{
font-size:15px;
line-height:1.65;
color:var(--text);
margin-bottom:12px;
}

.session-rec{
font-size:15px;
line-height:1.5;
color:#b0aa88;
}

.wind-table-wrap{
overflow-x:auto;
-webkit-overflow-scrolling:touch;
-webkit-mask-image:linear-gradient(to right, black 80%, transparent 100%);
mask-image:linear-gradient(to right, black 80%, transparent 100%);
padding:14px 14px 4px;
}
.wind-strip{
display:flex;
gap:6px;
width:max-content;
padding-bottom:10px;
}
.wh-col{
display:flex;
flex-direction:column;
align-items:center;
gap:4px;
background:var(--bg-card);
border:1px solid #3a3a2a;
border-radius:10px;
padding:9px 10px 8px;
min-width:58px;
position:relative;
}
.wh-col.now{
border-color:var(--text-accent);
background:rgba(184,149,106,0.07);
}
.wh-col.now::before{
content:'NOW';
position:absolute;
top:-9px;
left:50%;transform:translateX(-50%);
font-family:'IBM Plex Mono', monospace;
font-size:8px;
letter-spacing:0.1em;
color:var(--text-accent);
background:var(--bg-card);
padding:0 4px;
}
.wh-col.wh-selected{
background:rgba(184,151,90,0.1);
outline:1px solid var(--text-accent);
outline-offset:-1px;
}
.wh-time{font-family:'IBM Plex Mono', monospace;font-size:10px;color:#8a8a68;}
.wh-weather{font-size:18px;line-height:1;}
.wh-arrow{font-size:18px;color:var(--text-accent);display:block;line-height:1;}
.wh-dir{font-family:'IBM Plex Mono', monospace;font-size:10px;color:#a0a078;}
.wh-spd{font-family:'Barlow Condensed', sans-serif;font-size:24px;font-weight:800;color:var(--text-primary);line-height:1;}
.wh-unit{font-family:'IBM Plex Mono', monospace;font-size:8px;color:#6a6a52;margin-top:-2px;}
.wh-gust-row{display:flex;align-items:center;gap:3px;}
.wh-gust-label{font-family:'IBM Plex Mono', monospace;font-size:8px;color:var(--text-muted);}
.wh-gust-val{font-family:'IBM Plex Mono', monospace;font-size:11px;font-weight:500;color:#8a8a68;line-height:1;}
.wh-gust-val.gusty{color:#c87840;}
.wh-gust-val.very-gusty{color:var(--rating-poor);}
.wh-rain{font-family:'IBM Plex Mono', monospace;font-size:9px;color:#6a6a52;margin-top:-1px;}
.wh-rain.dry{color:var(--text-muted);}
.wh-rain.trace{color:#c8c8b0;}
.wh-rain.light{color:#6ab0e8;}
.wh-rain.mod{color:#3a8fd4;}
.wh-rain.heavy{color:#e07030;}
.wh-bar{width:100%;height:3px;background:rgba(255,255,255,0.06);border-radius:2px;overflow:hidden;margin-top:3px;}
.wh-bar-fill{height:100%;border-radius:2px;background:var(--text-accent);}
.wh-bar-fill.bar-agree{background:#4a8c3f;}
.wh-bar-fill.bar-spread{background:#b8860b;}
.wh-bar-fill.bar-wide{background:#c0392b;}
.sig-sustain{background:rgba(34,197,94,0.1);}
.sig-change{background:rgba(249,115,22,0.1);}
.gust-warn{color:#f59e0b;}
.wh-agree-legend{display:flex;align-items:center;gap:12px;margin:6px 0 4px 2px;}
.wh-agree-item{display:flex;align-items:center;gap:5px;font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);}
.wh-agree-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.wh-agree-dot.agree{background:#4a8c3f;}
.wh-agree-dot.spread{background:#b8860b;}
.wh-agree-dot.wide{background:#c0392b;}
.wh-tap-hint{display:flex;align-items:center;gap:6px;font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#7a6840;margin-bottom:8px;transition:opacity .2s;}
.wh-tap-hint.hidden{opacity:0;pointer-events:none;height:0;margin:0;}
.wh-hint-line{flex:1;height:1px;background:var(--border-default);}
.wh-detail-panel{background:var(--surface-raised);border:1px solid #7a6840;border-radius:8px;overflow:hidden;max-height:0;opacity:0;margin-bottom:0;transition:max-height .3s ease,opacity .25s ease,margin-bottom .3s ease;}
.wh-detail-panel.open{max-height:480px;opacity:1;margin-bottom:14px;}
.wh-detail-inner{padding:12px;display:flex;flex-direction:column;gap:10px;}
.wh-panel-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:8px;border-bottom:1px solid var(--border-default);}
.wh-panel-left{display:flex;align-items:center;gap:8px;}
.wh-panel-hour{font-family:'Barlow Condensed',sans-serif;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--text-accent);}
.wh-panel-agree{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;display:flex;align-items:center;gap:5px;padding:2px 8px;border-radius:10px;}
.wh-panel-agree.agree{color:#4a8c3f;background:rgba(74,140,63,.15);border:1px solid rgba(74,140,63,.3);}
.wh-panel-agree.spread{color:#b8860b;background:rgba(184,134,11,.15);border:1px solid rgba(184,134,11,.3);}
.wh-panel-agree.wide{color:#c0392b;background:rgba(192,57,43,.15);border:1px solid rgba(192,57,43,.3);}
.wh-panel-close{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);cursor:pointer;padding:2px 6px;border:1px solid var(--border-default);border-radius:4px;}
.wh-model-row{display:flex;flex-direction:column;gap:6px;}
.wh-model-row-label{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);}
.wh-model-sources{display:flex;flex-wrap:wrap;}
.wh-secondary-section{display:flex;flex-direction:column;gap:6px;padding-bottom:10px;}
.wh-secondary-divider{width:100%;height:1px;background:var(--border-default);margin:6px 0 4px;}
.wh-secondary-label{font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px;}
.wh-model-source{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:0 4px;position:relative;}
.wh-model-source+.wh-model-source::before{content:'';position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--border-default);}
.wh-model-source-name{font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);}
.wh-model-source-val{font-family:'Barlow Condensed',sans-serif;font-size:20px;font-weight:800;line-height:1;}
.wh-model-source-val.lo{color:#7ab8e8;}
.wh-model-source-val.mid{color:var(--text-accent);}
.wh-model-source-val.hi{color:var(--text-main);}
.wh-model-source-unit{font-size:10px;color:var(--text-muted);font-family:'Barlow Condensed',sans-serif;}
.wh-model-note{font-size:11px;color:var(--text-muted);font-style:italic;line-height:1.5;padding-top:6px;border-top:1px solid var(--border-default);}

.water-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:0;
}
.gauge-item{
padding:14px 14px 12px;
display:flex;
flex-direction:column;
gap:4px;
position:relative;
}
.gauge-item:nth-child(odd){border-right:1px solid var(--border-table);}
.gauge-item:nth-child(-n+2){border-bottom:1px solid var(--border-table);}
.gauge-name{
font-family:'IBM Plex Mono', monospace;
font-size:9px;
letter-spacing:0.1em;
text-transform:uppercase;
color:var(--text-muted);
}
.gauge-reading{display:flex;align-items:baseline;gap:3px;margin-top:2px;}
.gauge-num{
font-family:'IBM Plex Mono', monospace;
font-size:22px;
font-weight:500;
color:var(--text-primary);
line-height:1;
}
.gauge-unit{font-family:'IBM Plex Mono', monospace;font-size:11px;color:var(--text-muted);}
.gauge-trend{font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.06em;margin-top:1px;}
.gauge-trend.stable{color:var(--text-muted);}
.gauge-trend.falling{color:var(--sky);}
.gauge-trend.rising{color:var(--rating-avg);}
.gauge-trend.stale{color:var(--text-muted);}
.gauge-bar-track{height:2px;background:rgba(255,255,255,0.06);border-radius:2px;overflow:hidden;margin-top:6px;}
.gauge-bar-fill{height:100%;border-radius:2px;background:var(--text-secondary);}
.gauge-bar-fill.rising-fill{background:var(--rating-good);}
.water-label{
font-size:10px;
color:var(--text-muted);
margin-top:2px;
text-transform:uppercase;
letter-spacing:0.08em;
}

.outlook-day-card{
background:var(--bg-card);
border:1px solid var(--border);
border-radius:10px;
margin-bottom:5px;
overflow:hidden;
}
.outlook-day-header{
display:flex;
align-items:center;
justify-content:space-between;
padding:7px 12px;
border-bottom:1px solid var(--border);
}
.outlook-day-date{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:13px;
text-transform:uppercase;
color:var(--text-primary);
letter-spacing:0.03em;
}
.outlook-day-n{
font-family:'IBM Plex Mono', monospace;
font-size:9px;
color:var(--text-muted);
}
.outlook-region-row{
display:flex;
align-items:flex-start;
gap:8px;
padding:7px 12px;
}
.outlook-region-row + .outlook-region-row{
border-top:1px solid #221e1b;
}
.outlook-region-label{
font-family:'IBM Plex Mono', monospace;
font-size:9px;
letter-spacing:0.12em;
text-transform:uppercase;
color:var(--text-muted);
min-width:68px;
padding-top:2px;
flex-shrink:0;
}
.outlook-region-body{flex:1;min-width:0;}
.outlook-pill{
display:inline-block;
font-size:11px;
padding:2px 8px;
border-radius:20px;
background:var(--border);
white-space:nowrap;
min-width:64px;
text-align:center;
}
.outlook-pill-null{color:var(--text-muted);}
.outlook-region-reason{
font-family:'Barlow', sans-serif;
font-size:12px;
color:var(--text-muted);
line-height:1.4;
margin-top:3px;
}

.bottom-bar{
position:fixed;
bottom:0;
left:0;
right:0;
padding:12px 16px;
padding-bottom:calc(12px + env(safe-area-inset-bottom));
background:var(--bg);
border-top:1px solid var(--border);
z-index:100;
}
.btn-primary{
display:block;
width:100%;
box-sizing:border-box;
padding:18px;
border:none;
border-radius:14px;
font-family:'Barlow Condensed', sans-serif;
font-size:17px;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;
cursor:pointer;
color:#ffffff;
min-height:52px;
}
.btn-primary:disabled{
background:var(--card) !important;
color:var(--muted) !important;
border:1px solid var(--border) !important;
cursor:not-allowed;
}

@keyframes savePulse{
from{opacity:1.0;}
to{opacity:0.4;}
}
.btn-saving{
animation:savePulse 1s ease-in-out infinite alternate;
}

#log-overlay{
position:fixed;
inset:0;
max-width:390px;
margin:0 auto;
overflow-x:hidden;
background:var(--bg-card);
display:flex;
flex-direction:column;
z-index:200;
transform:translateY(100%);
transition:transform 0.35s cubic-bezier(0.32, 0.72, 0, 1);
}
#log-overlay.open{
transform:translateY(0);
pointer-events:all;
}
.log-overlay-scroll{
flex:1;
overflow-y:auto;
}

.log-header{
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
padding:calc(14px + env(safe-area-inset-top)) 16px 13px;
border-bottom:1px solid var(--border);
background:linear-gradient(to bottom, rgba(26,23,16,0.98), rgba(36,32,23,0.95));
flex-shrink:0;
position:sticky;
top:0;
z-index:10;
}
.back-btn{
background:none;
border:none;
color:var(--muted);
font-family:'IBM Plex Mono', monospace;
font-size:14px;
cursor:pointer;
letter-spacing:0.05em;
min-height:44px;
padding:8px 0;
}
.log-title{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:20px;
letter-spacing:3px;
color:var(--text-accent);
text-transform:uppercase;
text-align:center;
}

.log-section{
padding:16px 16px 0;
overflow:hidden;
}

.log-obs-card{
padding:16px;
overflow:hidden;
}
.field-label{
font-size:11px;
letter-spacing:2px;
text-transform:uppercase;
color:var(--muted);
margin-bottom:10px;
}

.toggle-group{
display:flex;
gap:8px;
width:100%;
}
.toggle-btn{
flex:1;
padding:14px 10px;
border:1px solid var(--border);
border-radius:8px;
background:var(--card);
color:var(--muted);
font-family:'IBM Plex Mono', monospace;
font-size:16px;
letter-spacing:0.05em;
cursor:pointer;
text-align:center;
transition:all 0.15s;
min-height:52px;
}

.date-input{
-webkit-appearance:none;
appearance:none;
display:block;
width:100%;
max-width:100%;
min-width:0;
box-sizing:border-box;
background:var(--card);
border:1px solid var(--border);
border-radius:6px;
color:var(--text);
font-family:'IBM Plex Mono', monospace;
font-size:15px;
font-weight:700;
padding:12px 16px;
color-scheme:dark;
min-height:52px;
}

.time-select{
flex:1;
background:var(--card);
border:1px solid var(--border);
border-radius:6px;
color:var(--text);
font-family:'IBM Plex Mono', monospace;
font-size:16px;
font-weight:700;
padding:16px;
color-scheme:dark;
min-height:52px;
}
.time-row{
display:flex;
gap:10px;
align-items:center;
width:100%;
}
.time-sep{color:var(--muted);font-size:16px;}

.result-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:8px;
width:100%;
}
.result-btn{
padding:18px 12px;
border:1px solid var(--border);
border-radius:8px;
background:var(--card);
color:var(--muted);
font-family:'IBM Plex Mono', monospace;
font-size:17px;
letter-spacing:0.05em;
cursor:pointer;
text-align:center;
transition:all 0.15s;
min-height:52px;
}

.bag-row{
display:flex;
align-items:center;
justify-content:space-between;
padding:13px 14px;
border-radius:14px;
background:var(--bg-card-alt);
border:1px solid var(--border);
margin-bottom:8px;
}
.bag-row.has-birds{border-color:rgba(122,138,74,0.5);}
.bag-species{font-size:15px;color:var(--muted);}
.bag-species.has-birds{color:var(--text);}
.bag-count-display{font-size:18px;font-weight:600;min-width:22px;text-align:center;color:var(--text);}
.bag-controls{display:flex;align-items:center;gap:10px;}
.bag-btn{
width:34px;height:34px;
border:1px solid var(--border);
border-radius:10px;
background:var(--bg-toggle);
color:var(--text-accent);
font-size:18px;
line-height:1;
cursor:pointer;
display:flex;align-items:center;justify-content:center;
}
.bag-btn.dec-disabled{color:var(--border);background:var(--card);}

.notes-input{
width:100%;
background:var(--card);
border:1px solid var(--border);
border-radius:12px;
color:var(--text);
font-family:'IBM Plex Mono', monospace;
font-size:14px;
padding:13px 14px;
resize:none;
min-height:80px;
}
.notes-input::placeholder{color:var(--muted);}

.sync-status{
font-family:'IBM Plex Mono', monospace;
font-size:12px;
margin-top:12px;
display:flex;
align-items:center;
gap:6px;
}
.sync-dot{
width:6px;height:6px;
border-radius:50%;
display:inline-block;
}
@keyframes syncPulse{
0%, 100%{opacity:1;}
50%{opacity:0.3;}
}
.sync-dot.syncing{background:#FFB800;animation:syncPulse 1.2s ease-in-out infinite;}
.sync-dot.synced{background:var(--good);}
.sync-dot.failed{background:var(--muted);}

.pending-banner{
font-family:'IBM Plex Mono', monospace;
font-size:12px;
color:#FFB800;
text-align:center;
padding:8px 16px;
}

.offline-banner{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
color:#d4ac0d;
letter-spacing:0.08em;
text-align:center;
padding:6px 16px;
border-bottom:1px solid #d4ac0d30;
margin-bottom:4px;
}

.tab-bar{
display:grid;
grid-template-columns:1fr 1fr;
background:var(--bg-toggle);
border-radius:10px;
padding:3px;
margin:14px 16px 0;
border:1px solid var(--border);
}
.tab-btn{
padding:7px 0 9px;
border:none;
background:transparent;
border-radius:8px;
cursor:pointer;
display:flex;
flex-direction:column;
align-items:center;
gap:2px;
transition:background 0.2s;
font-family:'IBM Plex Mono', monospace;
font-size:12px;
font-weight:500;
letter-spacing:0.08em;
text-transform:uppercase;
color:#5a5040;
}
.tab-btn .tab-day{
font-family:'IBM Plex Sans', sans-serif;
font-size:11px;
font-weight:600;
letter-spacing:0.1em;
text-transform:uppercase;
color:#5a5040;
}
.tab-btn .tab-date{
font-family:'Barlow Condensed', sans-serif;
font-size:20px;
font-weight:800;
letter-spacing:0.06em;
text-transform:uppercase;
line-height:1;
color:#c9a97e;
}
.tab-btn.active{
background:#332d18;
color:#c9a97e;
}
.tab-btn.active .tab-day{color:#c9a97e;}
.tab-btn.active .tab-date{color:#f0ead8;}
.tab-btn:first-child{border-right:none;}
.header .tab-bar{margin-left:0;margin-right:0;}

.hunt-row{
padding:14px 16px;
border-bottom:1px solid var(--border);
}
.hunt-row:last-child{border-bottom:none;}
.hunt-date-line{
display:flex;
justify-content:space-between;
font-size:13px;
color:var(--text);
margin-bottom:6px;
}
.hunt-location{color:var(--muted);}
.hunt-meta-line{
display:flex;
align-items:center;
gap:10px;
font-size:12px;
color:var(--muted);
}
.hunt-pill{
font-size:11px;
padding:2px 8px;
border-radius:20px;
background:var(--border);
white-space:nowrap;
}
.hunt-notes{
margin-top:6px;
font-size:12px;
color:var(--muted);
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
}

.vh-cards{padding:16px;display:flex;flex-direction:column;gap:12px;}
.vh-card{background:var(--bg-card);border-radius:8px;border:1px solid var(--border);overflow:hidden;}
.vh-card-header{padding:12px 14px 10px;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid var(--border);}
.vh-date{font-family:'Barlow Condensed', sans-serif;font-size:18px;font-weight:800;text-transform:uppercase;letter-spacing:0.02em;color:var(--text-primary);line-height:1;}
.vh-loc{font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.08em;color:var(--muted);text-transform:uppercase;margin-top:3px;}
.vh-pills{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end;}
.vh-pill{font-family:'IBM Plex Mono', monospace;font-size:9px;letter-spacing:0.1em;text-transform:uppercase;padding:3px 7px;border-radius:3px;}
.vh-pill-retro{background:var(--bg-card-alt);color:var(--muted);border:1px solid var(--border);}
.vh-pill-live{background:rgba(100,121,52,0.18);color:#a8bc7a;border:1px solid #5d6e3e;}
.vh-pill-bag{background:var(--bg-card-alt);color:var(--text-primary);border:1px solid var(--border);font-weight:500;}
.vh-card-body{padding:10px 14px;display:flex;flex-direction:column;gap:8px;}
.vh-species-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.vh-chip{display:flex;align-items:center;gap:5px;font-family:'IBM Plex Sans', sans-serif;font-size:13px;color:var(--muted);}
.vh-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.vh-cond-row{display:flex;gap:12px;align-items:center;}
.vh-cond{font-family:'IBM Plex Sans', sans-serif;font-size:12px;color:var(--text-muted);opacity:0.7;}
.vh-card-footer{padding:10px 14px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;}
.vh-view-btn{font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:#a8bc7a;background:rgba(100,121,52,0.15);border:1px solid #5d6e3e;border-radius:4px;padding:7px 14px;cursor:pointer;display:flex;align-items:center;gap:6px;}
.vh-pagination{display:flex;align-items:center;justify-content:space-between;padding:12px 16px 4px;}
.vh-page-btn{font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);background:transparent;border:1px solid var(--border);border-radius:4px;padding:7px 14px;cursor:pointer;}
.vh-page-btn:disabled{opacity:0.35;cursor:default;pointer-events:none;}
.vh-page-label{font-family:'IBM Plex Mono', monospace;font-size:10px;color:var(--muted);}

.season-banner{background:#22200f;border:1px solid #3a3620;border-left:3px solid #647934;border-radius:8px;margin:4px 16px 8px;padding:11px 16px;display:flex;align-items:center;justify-content:space-between;}
.season-banner-label{font-family:'Barlow Condensed', sans-serif;font-weight:800;font-size:12px;color:#7a6e52;letter-spacing:0.22em;text-transform:uppercase;line-height:1;margin-bottom:4px;}
.season-banner-stats{font-family:'IBM Plex Mono', monospace;font-weight:500;font-size:14px;line-height:1;}
.season-banner-count{color:#c8b88a;}
.season-banner-sep{color:#7a6e52;}
.season-banner-skeleton{background:#2a2818;border-radius:8px;height:46px;margin:4px 16px 8px;animation:sb-pulse 1.5s ease-in-out infinite;}
@keyframes sb-pulse{0%, 100%{opacity:0.4;}50%{opacity:0.8;}}
@keyframes duck-bob{0%, 100%{transform:translateY(0);}50%{transform:translateY(-3px);}}
.sb-duck{font-size:18px;animation:duck-bob 3s ease-in-out infinite;display:inline-block;}

.vh-header{background:linear-gradient(to bottom, rgba(26,23,16,0.98), rgba(36,32,23,0.95));position:sticky;top:0;z-index:10;flex-shrink:0;}
.vh-header-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:calc(14px + env(safe-area-inset-top)) 16px 13px;border-bottom:1px solid var(--border);}
.vh-subheader{display:flex;align-items:center;padding:8px 16px;border-bottom:1px solid var(--border);min-height:52px;}
.vh-back-pill{flex:1;display:flex;align-items:center;gap:5px;font-family:'Barlow Condensed', sans-serif;font-size:13px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--muted);background:none;border:1px solid var(--border);border-radius:6px;padding:6px 12px;cursor:pointer;white-space:nowrap;width:fit-content;min-height:36px;}
.vh-subheader-centre{flex:2;display:flex;flex-direction:column;align-items:center;gap:1px;}
.vh-subheader-date{font-family:'Barlow Condensed', sans-serif;font-size:15px;font-weight:800;text-transform:uppercase;letter-spacing:0.04em;color:var(--text-primary);}
.vh-subheader-loc{font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);}
.vh-subheader-right{flex:1;display:flex;justify-content:flex-end;align-items:center;gap:6px;position:relative;}
.vh-menu-btn{display:flex;align-items:center;justify-content:center;font-family:'Barlow Condensed', sans-serif;font-size:18px;font-weight:600;color:var(--text-primary);background:none;border:1px solid var(--border);border-radius:6px;padding:5px 10px;cursor:pointer;min-height:36px;letter-spacing:0.03em;line-height:1;}
.vh-menu-btn.active{border-color:var(--moss);background:rgba(93,110,62,0.1);}
.vh-menu-overlay{position:fixed;inset:0;background:rgba(10,8,7,0.55);z-index:200;}
.vh-popover{position:fixed;background:var(--bg-card-alt);border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 20px rgba(0,0,0,0.4);z-index:201;min-width:160px;overflow:hidden;}
.vh-popover-item{display:flex;align-items:center;gap:8px;width:100%;padding:13px 16px;background:none;border:none;cursor:pointer;font-family:'Barlow Condensed', sans-serif;font-size:15px;font-weight:600;letter-spacing:0.04em;text-align:left;}
.vh-popover-item.danger{color:#e05a4a;}
.vh-popover-item.danger:hover{background:rgba(192,57,43,0.10);border:none;outline:none;}
.vh-modal-backdrop{position:fixed;inset:0;background:rgba(10,8,7,0.78);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:300;display:flex;align-items:center;justify-content:center;padding:20px;}
.vh-modal{background:var(--bg2, var(--bg-card-alt));border:1px solid var(--border);border-radius:13px;width:100%;max-width:320px;overflow:hidden;animation:vh-pop-in 160ms ease-out both;}
@keyframes vh-pop-in{from{opacity:0;transform:scale(0.93);}to{opacity:1;transform:scale(1);}}
.vh-modal-body{padding:20px 18px 14px;border-bottom:1px solid var(--border);}
.vh-modal-title{font-family:'Barlow Condensed', sans-serif;font-size:20px;font-weight:800;text-transform:uppercase;letter-spacing:0.04em;color:var(--text-primary);margin-bottom:6px;}
.vh-modal-meta{font-family:'IBM Plex Mono', monospace;font-size:9px;letter-spacing:0.1em;text-transform:uppercase;color:var(--moss);margin-bottom:10px;}
.vh-modal-copy{font-family:'IBM Plex Mono', monospace;font-size:10px;color:var(--muted);line-height:1.6;}
.vh-modal-actions{display:flex;width:100%;}
.vh-modal-btn{flex:1;padding:14px 0;background:none;border:none;cursor:pointer;font-family:'Barlow Condensed', sans-serif;font-size:15px;font-weight:600;letter-spacing:0.04em;}
.vh-modal-btn.cancel{color:var(--muted);border-right:1px solid var(--border);}
.vh-modal-btn.delete{color:#e05a4a;}
.vh-toast{position:fixed;bottom:calc(80px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:10px 18px;font-family:'IBM Plex Mono', monospace;font-size:11px;color:var(--text-primary);white-space:nowrap;z-index:400;box-shadow:0 4px 16px rgba(0,0,0,0.4);pointer-events:none;opacity:0;transition:opacity 0.18s;}
.vh-toast.visible{opacity:1;}
.vh-summary-photo-btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:16px;border:1.5px dashed var(--border);border-radius:8px;cursor:pointer;background:none;width:100%;color:var(--muted);font-family:'IBM Plex Mono', monospace;font-size:11px;letter-spacing:0.08em;}
.vh-summary-photo-btn:active{opacity:0.7;}
.vh-summary-actions{display:flex;gap:8px;}
.vh-photo-pending-badge{display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:6px;background:rgba(184,150,106,0.12);border:1px solid rgba(184,150,106,0.3);color:#b8956a;font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.04em;}
.vh-photo-pending-badge::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:#b8956a;animation:vhPhotoPendingPulse 1.6s ease-in-out infinite;}
@keyframes vhPhotoPendingPulse{0%, 100%{opacity:0.45}50%{opacity:1}}
.vh-summary-action-btn{flex:1;padding:10px;background:transparent;border:1px solid var(--border);border-radius:6px;font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted);cursor:pointer;}
.vh-summary-action-btn.danger{color:#e05a4a;border-color:rgba(224,90,74,0.3);}
.vh-edit-badge{font-family:'IBM Plex Mono', monospace;font-size:9px;letter-spacing:0.12em;text-transform:uppercase;background:rgba(122,92,20,0.3);color:#e8c060;border:1px solid #b8922a;border-radius:3px;padding:3px 8px;}
.vh-scroll{padding:16px;display:flex;flex-direction:column;gap:12px;}
.vh-section{background:var(--bg-card);border-radius:8px;border:1px solid var(--border);overflow:hidden;}
.vh-section-hd{padding:10px 14px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;}
.vh-section-title{font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted);}
.vh-section-bd{padding:12px 14px;display:flex;flex-direction:column;gap:10px;}
.vh-section-bd.flush{padding:0 14px;}
.vh-field{display:flex;flex-direction:column;gap:3px;}
.vh-label{font-family:'IBM Plex Mono', monospace;font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-muted);opacity:0.7;}
.vh-value{font-family:'Barlow', sans-serif;font-size:15px;font-weight:500;color:var(--text-primary);}
.vh-value.mono{font-family:'IBM Plex Mono', monospace;font-size:13px;font-weight:400;}
.vh-value.muted{color:var(--muted);font-size:14px;line-height:1.5;}
.vh-input{font-family:'Barlow', sans-serif;font-size:15px;font-weight:500;color:var(--text-primary);background:var(--bg-toggle);border:1px solid var(--border-default);border-radius:4px;padding:8px 10px;outline:none;width:100%;-webkit-appearance:none;}
.vh-input:focus{border-color:var(--cta-bg);}
.vh-input.mono{font-family:'IBM Plex Mono', monospace;font-size:12px;}
.vh-textarea{font-family:'Barlow', sans-serif;font-size:14px;color:var(--text-primary);background:var(--bg-toggle);border:1px solid var(--border-default);border-radius:4px;padding:8px 10px;outline:none;width:100%;resize:none;min-height:72px;}
.vh-textarea:focus{border-color:var(--cta-bg);}
.vh-2col{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.vh-species-view{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--border);}
.vh-species-view:last-child{border-bottom:none;}
.photo-lightbox{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;}
.photo-lightbox-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.92);cursor:pointer;}
.photo-lightbox-img{position:relative;z-index:1;max-width:92vw;max-height:88vh;border-radius:8px;object-fit:contain;touch-action:pinch-zoom;}
.photo-lightbox-close{position:absolute;top:calc(16px + env(safe-area-inset-top));right:16px;z-index:2;background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.2);color:#fff;font-size:20px;line-height:1;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.photo-lightbox-download{position:absolute;top:calc(16px + env(safe-area-inset-top));left:16px;z-index:2;background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.2);color:#fff;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.vh-species-info{display:flex;align-items:center;gap:10px;}
.vh-species-count{font-family:'IBM Plex Mono', monospace;font-size:18px;font-weight:500;color:var(--text-primary);min-width:28px;text-align:right;}
.vh-species-name{font-family:'Barlow Condensed', sans-serif;font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:0.04em;color:var(--text-primary);}
.vh-stepper-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border);}
.vh-stepper-row:last-child{border-bottom:none;}
.vh-stepper-controls{display:flex;align-items:center;}
.vh-stepper-btn{width:32px;height:32px;background:var(--bg-card-alt);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-size:16px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:'IBM Plex Mono', monospace;line-height:1;}
.vh-stepper-val{font-family:'IBM Plex Mono', monospace;font-size:16px;font-weight:500;color:var(--text-primary);min-width:36px;text-align:center;}
.vh-add-species-btn{font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);background:transparent;border:1px dashed var(--border);border-radius:4px;padding:8px 14px;width:100%;cursor:pointer;margin:8px 0 4px;}
.vh-species-picker{padding:8px 0 4px;display:flex;flex-direction:column;gap:4px;}
.vh-species-pick-btn{font-family:'IBM Plex Mono', monospace;font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-secondary);background:var(--bg-card-alt);border:1px solid var(--border);border-radius:4px;padding:8px 12px;text-align:left;cursor:pointer;}
.vh-cond-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.vh-cond-cell{background:var(--bg-card-alt);border-radius:4px;padding:8px 10px;border:1px solid var(--border);}
.vh-cond-cell-label{font-family:'IBM Plex Mono', monospace;font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-muted);opacity:0.7;margin-bottom:3px;}
.vh-cond-cell-value{font-family:'IBM Plex Mono', monospace;font-size:13px;color:var(--text-primary);font-weight:500;}
.vh-cond-source{font-family:'IBM Plex Mono', monospace;font-size:9px;letter-spacing:0.08em;color:var(--text-muted);opacity:0.6;text-transform:uppercase;margin-top:2px;}
.vh-cond-lock-note{font-family:'IBM Plex Mono', monospace;font-size:9px;letter-spacing:0.06em;color:var(--text-muted);opacity:0.6;text-transform:uppercase;line-height:1.5;margin-top:4px;}
.vh-action-row{display:flex;gap:10px;padding:4px 0 8px;}
.vh-btn-primary{flex:1;background:var(--cta-bg);color:var(--cta-text);border:none;border-radius:6px;font-family:'IBM Plex Mono', monospace;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;padding:14px;cursor:pointer;font-weight:500;display:flex;align-items:center;justify-content:center;gap:8px;}
.vh-btn-secondary{flex:1;background:transparent;color:var(--muted);border:1px solid var(--border);border-radius:6px;font-family:'IBM Plex Mono', monospace;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;padding:14px 18px;cursor:pointer;}

.compass-grid{
display:grid;
grid-template-columns:repeat(4, 1fr);
gap:7px;
}
.compass-btn{
background:var(--card);
border:1px solid var(--border);
border-radius:10px;
color:var(--text-secondary);
font-family:'IBM Plex Mono', monospace;
font-size:12px;
font-weight:600;
letter-spacing:0.06em;
padding:10px 4px;
text-align:center;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.compass-btn.active{
background:rgba(184,149,106,0.15);
border-color:var(--text-accent);
color:var(--text-accent);
}
.activity-grid{
display:grid;
grid-template-columns:repeat(5, 1fr);
gap:6px;
}
.activity-btn{
background:var(--bg-toggle);
border:1px solid var(--border);
border-radius:8px;
color:var(--text-secondary);
font-family:'IBM Plex Sans', sans-serif;
font-size:11px;
font-weight:600;
padding:12px 4px;
text-align:center;
cursor:pointer;
letter-spacing:0.04em;
-webkit-tap-highlight-color:transparent;
}
.activity-btn.active{
background:rgba(122,148,64,0.18);
border-color:var(--rating-good);
color:var(--rating-good);
}
.wind-source-label{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
color:var(--text-muted);
letter-spacing:0.06em;
margin-top:6px;
}
.wind-kmh-input{
background:var(--bg-toggle);
border:1px solid var(--border);
border-radius:8px;
color:var(--text-primary);
font-family:'IBM Plex Mono', monospace;
font-size:16px;
font-weight:500;
padding:10px 12px;
width:100px;
color-scheme:dark;
}

.confirm-view{
display:flex;
flex-direction:column;
align-items:center;
padding:60px 16px calc(100px + env(safe-area-inset-bottom));
text-align:center;
gap:16px;
}
.confirm-card{
background:var(--card);
border:1px solid var(--border);
border-radius:14px;
padding:28px 24px;
width:100%;
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
}
.confirm-duck{font-size:56px;}
.confirm-logged{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:36px;
letter-spacing:0.06em;
}
.confirm-sub{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
letter-spacing:0.14em;
text-transform:uppercase;
color:var(--muted);
margin-bottom:4px;
}
.confirm-stats{
display:flex;
gap:20px;
margin-top:4px;
}
.confirm-stat{
display:flex;
flex-direction:column;
align-items:center;
gap:2px;
}
.confirm-stat-val{
font-family:'IBM Plex Mono', monospace;
font-size:20px;
font-weight:500;
color:var(--text-primary);
}
.confirm-stat-key{
font-family:'IBM Plex Mono', monospace;
font-size:9px;
letter-spacing:0.1em;
color:var(--muted);
}
.confirm-detail{color:var(--muted);font-size:13px;}

.center-view{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
min-height:60vh;
gap:16px;
color:var(--muted);
font-size:13px;
text-align:center;
padding:24px;
}
.error-msg{color:#ff4444;}

@keyframes shimmer{
0%{background-position:200% 0;}
100%{background-position:-200% 0;}
}
.skeleton{
background:linear-gradient(90deg, #2a1c0c 25%, #3a2a18 50%, #2a1c0c 75%);
background-size:200% 100%;
animation:shimmer 1.5s infinite;
border-radius:6px;
}
.skeleton-rating{height:36px;width:120px;margin:0 16px 8px;}
.skeleton-session{height:60px;margin:0 16px 12px;}
.skeleton-region{height:100px;margin:0 16px 12px;}
.skeleton-water{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:0 16px 12px;}
.skeleton-water-col{height:50px;}
.skeleton-outlook-row{height:28px;margin:0 16px 8px;}

.signin-view{
position:relative;
width:100%;
min-height:100svh;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
background:#1E1810;
font-family:'Barlow', sans-serif;
}

.si-bg-layer{
position:fixed;
inset:0;
pointer-events:none;
}
.si-bg-gradient{
background:
radial-gradient(ellipse 80% 60% at 50% 0%, rgba(74,92,47,0.25) 0%, transparent 60%),
radial-gradient(ellipse 60% 40% at 20% 100%, rgba(61,48,32,0.8) 0%, transparent 50%),
radial-gradient(ellipse 60% 40% at 80% 100%, rgba(61,48,32,0.8) 0%, transparent 50%),
linear-gradient(180deg, #1E1810 0%, #2a2010 40%, #1E1810 100%),
radial-gradient(ellipse 120% 50% at 50% 100%, rgba(74,92,47,0.2) 0%, transparent 70%);
}
.si-bg-noise{
opacity:0.035;
background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
background-size:200px 200px;
}
.si-bg-fog{
background:linear-gradient(
180deg,
transparent 0%,
rgba(180,160,100,0.02) 40%,
rgba(180,160,100,0.05) 55%,
transparent 70%
);
animation:siFogDrift 12s ease-in-out infinite alternate;
}
@keyframes siFogDrift{
from{transform:translateY(-8px) scaleX(1);opacity:0.5;}
to{transform:translateY(8px) scaleX(1.02);opacity:1;}
}
.si-bg-reeds{
background:repeating-linear-gradient(
to bottom,
transparent,
transparent 38px,
rgba(74,92,47,0.04) 38px,
rgba(74,92,47,0.04) 39px
);
}

.signin-content{
position:relative;
width:100%;
max-width:390px;
min-height:100svh;
display:flex;
flex-direction:column;
align-items:center;
justify-content:space-between;
padding:0 32px 48px;
z-index:10;
}

.si-brand-section{
flex:1;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
padding-top:80px;
padding-bottom:32px;
gap:0;
}
.si-logo-wrap{
position:relative;
margin-bottom:24px;
animation:siLogoReveal 1s cubic-bezier(0.16,1,0.3,1) both;
}
@keyframes siLogoReveal{
from{opacity:0;transform:translateY(20px) scale(0.92);}
to{opacity:1;transform:translateY(0) scale(1);}
}
.si-logo-ring{
position:absolute;
inset:-12px;
border-radius:50%;
border:1px solid rgba(196,169,106,0.2);
animation:siRingPulse 3s ease-in-out infinite;
pointer-events:none;
}
.si-logo-ring-2{
inset:-24px;
border-color:rgba(196,169,106,0.08);
animation-delay:0.5s;
}
@keyframes siRingPulse{
0%, 100%{opacity:0.4;transform:scale(1);}
50%{opacity:1;transform:scale(1.03);}
}
.si-logo-img{
width:110px;
height:110px;
object-fit:contain;
display:block;
border-radius:22px;
filter:drop-shadow(0 4px 16px rgba(0,0,0,0.6));
}
.si-wordmark{
font-family:'Bebas Neue', sans-serif;
font-size:52px;
letter-spacing:0.08em;
color:#F5EDD6;
line-height:1;
margin-bottom:8px;
animation:siFadeUp 0.8s 0.2s cubic-bezier(0.16,1,0.3,1) both;
text-shadow:0 2px 24px rgba(0,0,0,0.8), 0 1px 4px rgba(0,0,0,0.6);
}
.si-tagline{
font-family:'Barlow Condensed', sans-serif;
font-size:13px;
font-weight:400;
letter-spacing:0.25em;
text-transform:uppercase;
color:#C8B87A;
text-shadow:0 1px 8px rgba(0,0,0,0.7);
animation:siFadeUp 0.8s 0.35s cubic-bezier(0.16,1,0.3,1) both;
}
.si-season-badge{
margin-top:20px;
display:inline-flex;
align-items:center;
gap:6px;
background:rgba(90,122,42,0.15);
border:1px solid rgba(90,122,42,0.35);
border-radius:20px;
padding:5px 14px;
font-family:'Barlow Condensed', sans-serif;
font-size:12px;
font-weight:600;
letter-spacing:0.15em;
text-transform:uppercase;
color:#A8D060;
text-shadow:0 1px 4px rgba(0,0,0,0.5);
animation:siFadeUp 0.8s 0.5s cubic-bezier(0.16,1,0.3,1) both;
}
.si-season-dot{
width:6px;
height:6px;
border-radius:50%;
background:#8BAF4A;
animation:siDotBlink 2s ease-in-out infinite;
flex-shrink:0;
}
@keyframes siDotBlink{
0%, 100%{opacity:1;}
50%{opacity:0.3;}
}

.si-form-section{
width:100%;
animation:siFadeUp 0.8s 0.4s cubic-bezier(0.16,1,0.3,1) both;
}
.si-form-label{
font-family:'Barlow Condensed', sans-serif;
font-size:13px;
font-weight:600;
letter-spacing:0.2em;
text-transform:uppercase;
color:#C8B87A;
margin-bottom:10px;
display:block;
text-shadow:0 1px 6px rgba(0,0,0,0.6);
}
.si-input-wrap{
position:relative;
margin-bottom:12px;
}
.si-input-icon{
position:absolute;
left:16px;
top:50%;
transform:translateY(-50%);
color:#C4A96A;
opacity:0.4;
pointer-events:none;
}
.otp-input{
width:100%;
background:rgba(0,0,0,0.45);
border:1px solid rgba(196,169,106,0.35);
border-radius:10px;
color:#F0E4C0;
font-family:'Barlow', sans-serif;
font-size:18px;
font-weight:400;
outline:none;
transition:border-color 0.2s, background 0.2s, box-shadow 0.2s;
-webkit-appearance:none;
display:block;
}
.otp-input.si-email-input{
padding:18px 16px 18px 48px;
}
.otp-input.si-email-input::placeholder{
color:rgba(240,228,192,0.5);
font-size:18px;
}
.otp-input.si-code-input{
font-family:'Bebas Neue', sans-serif;
font-size:32px;
letter-spacing:0.4em;
text-align:center;
padding:18px 16px;
background:rgba(255,255,255,0.05);
border-color:rgba(196,169,106,0.2);
margin-bottom:0;
}
.otp-input.si-code-input::placeholder{
color:rgba(237,224,196,0.15);
letter-spacing:0.3em;
}
.otp-input:focus{
outline:none;
border-color:rgba(196,169,106,0.5);
background:rgba(255,255,255,0.08);
box-shadow:0 0 0 3px rgba(196,169,106,0.08), 0 0 20px rgba(196,169,106,0.05);
}
.otp-btn{
width:100%;
background:linear-gradient(135deg, #4A6B1F 0%, #3A5518 50%, #2E4412 100%);
border:1px solid rgba(90,122,42,0.5);
border-radius:10px;
padding:17px;
font-family:'Bebas Neue', sans-serif;
font-size:18px;
letter-spacing:0.15em;
color:#C8E060;
cursor:pointer;
position:relative;
overflow:hidden;
transition:transform 0.15s, box-shadow 0.15s;
-webkit-tap-highlight-color:transparent;
box-shadow:0 4px 16px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.08);
display:block;
}
.otp-btn::before{
content:'';
position:absolute;
inset:0;
background:linear-gradient(135deg, rgba(255,255,255,0.06) 0%, transparent 60%);
pointer-events:none;
}
.otp-btn:active{
transform:scale(0.98);
box-shadow:0 2px 8px rgba(0,0,0,0.4);
}
.otp-btn:disabled{
opacity:0.5;
cursor:not-allowed;
}
.otp-back{
background:none;
border:none;
color:rgba(237,224,196,0.5);
font-family:'Barlow Condensed', sans-serif;
font-size:12px;
letter-spacing:0.15em;
text-transform:uppercase;
cursor:pointer;
text-align:center;
padding:8px;
width:100%;
margin-top:4px;
}
.si-otp-hint{
font-family:'Barlow Condensed', sans-serif;
font-size:13px;
font-weight:300;
letter-spacing:0.05em;
color:rgba(237,224,196,0.5);
text-align:center;
margin-bottom:8px;
}
.si-otp-hint span{
color:#C4A96A;
opacity:0.8;
}
.signin-error{
font-family:'Barlow Condensed', sans-serif;
font-size:12px;
letter-spacing:0.05em;
color:#FF6B6B;
text-align:center;
min-height:18px;
}
.si-footer-note{
text-align:center;
font-family:'Barlow Condensed', sans-serif;
font-size:12px;
font-weight:300;
letter-spacing:0.05em;
color:rgba(237,224,196,0.5);
line-height:1.5;
margin-top:24px;
}
.si-footer-note a{
color:#C4A96A;
opacity:0.6;
text-decoration:none;
}
.si-reeds{
position:fixed;
bottom:0;
left:0;
right:0;
height:120px;
pointer-events:none;
z-index:1;
opacity:0.18;
}
@keyframes siFadeUp{
from{opacity:0;transform:translateY(16px);}
to{opacity:1;transform:translateY(0);}
}

.install-hint{
margin-top:24px;
font-family:'Barlow Condensed', sans-serif;
font-size:12px;
font-weight:300;
letter-spacing:0.05em;
color:rgba(237,224,196,0.5);
text-align:center;
line-height:1.6;
}
.btn-install{
margin-top:16px;
width:100%;
background:linear-gradient(135deg, #4A6B1F 0%, #3A5518 50%, #2E4412 100%);
color:#C8E060;
border:1px solid rgba(90,122,42,0.5);
border-radius:10px;
font-family:'Bebas Neue', sans-serif;
font-size:18px;
letter-spacing:0.15em;
cursor:pointer;
padding:17px;
box-shadow:0 4px 16px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.08);
}

#loc-screen{
position:fixed;
top:0;
right:0;
bottom:0;
width:100%;
max-width:390px;
background:var(--bg-base);
display:flex;
flex-direction:column;
z-index:200;
transform:translateX(100%);
transition:transform 0.32s cubic-bezier(0.32, 0.72, 0, 1);
}
#loc-screen.open{
transform:translateX(0);
}
.loc-header{
display:flex;
justify-content:space-between;
align-items:center;
padding:calc(14px + env(safe-area-inset-top)) 16px;
border-bottom:1px solid var(--border);
background:linear-gradient(to bottom, rgba(20,17,8,0.99), rgba(30,26,14,0.97));
flex-shrink:0;
}
.loc-back{
background:none;
border:none;
color:var(--text-muted);
font-family:'IBM Plex Mono', monospace;
font-size:16px;
cursor:pointer;
min-height:44px;
padding:8px 0;
min-width:44px;
}
.loc-title{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:22px;
letter-spacing:0.08em;
color:var(--text-accent);
text-transform:uppercase;
}
.loc-header-right{min-width:44px;}
.loc-body{
flex:1;
overflow-y:auto;
padding:20px 16px;
display:flex;
flex-direction:column;
gap:20px;
}
.loc-intro{
font-size:13px;
color:var(--text-muted);
line-height:1.5;
letter-spacing:0.02em;
}
.loc-region{display:flex;flex-direction:column;gap:8px;}
.loc-region-label{
font-family:'IBM Plex Mono', monospace;
font-size:9px;
letter-spacing:0.14em;
text-transform:uppercase;
color:var(--text-muted);
padding:0 2px;
}
.loc-row{
display:flex;
align-items:center;
justify-content:space-between;
background:var(--bg-card-alt);
border:1px solid var(--border);
border-radius:12px;
padding:14px 16px;
cursor:pointer;
transition:border-color 0.2s, background 0.2s;
user-select:none;
-webkit-tap-highlight-color:transparent;
}
.loc-row.selected{
border-color:var(--text-accent);
background:rgba(184,149,106,0.07);
}
.loc-row:active{transform:scale(0.99);}
.loc-row-left{display:flex;flex-direction:column;gap:3px;}
.loc-name{
font-family:'IBM Plex Sans', sans-serif;
font-size:15px;
font-weight:600;
color:var(--text-primary);
}
.loc-detail{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
color:var(--text-muted);
letter-spacing:0.04em;
}
.loc-check{
width:26px;height:26px;
border-radius:50%;
border:2px solid var(--border);
display:flex;align-items:center;justify-content:center;
font-size:13px;
color:transparent;
transition:background 0.2s, border-color 0.2s, color 0.2s;
flex-shrink:0;
}
.loc-row.selected .loc-check{
background:var(--text-accent);
border-color:var(--text-accent);
color:var(--bg-card);
}
.loc-warning{
font-family:'IBM Plex Mono', monospace;
font-size:11px;
color:var(--rating-avg);
letter-spacing:0.04em;
text-align:center;
padding:4px 8px;
opacity:0;
transition:opacity 0.2s;
}
.loc-warning.visible{opacity:1;}
.loc-save-btn{
display:block;
width:100%;
padding:16px;
background:var(--cta-bg);
color:var(--cta-text);
border:none;
border-radius:8px;
font-family:'Barlow Condensed', sans-serif;
font-size:17px;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;
cursor:pointer;
min-height:52px;
margin-top:4px;
}

#privacy-screen{
position:fixed;
top:0;
right:0;
bottom:0;
width:100%;
max-width:390px;
background:var(--bg-base);
display:flex;
flex-direction:column;
z-index:200;
transform:translateX(100%);
transition:transform 0.32s cubic-bezier(0.32, 0.72, 0, 1);
}
#privacy-screen.open{transform:translateX(0);}
.priv-toggle-row{
display:flex;
align-items:center;
justify-content:space-between;
background:var(--bg-card-alt);
border:1px solid var(--border);
border-radius:12px;
padding:14px 16px;
height:70px;
box-sizing:border-box;
gap:12px;
}
.priv-toggle-label{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0;}
.priv-toggle-name{
font-family:'IBM Plex Sans', sans-serif;
font-size:15px;
font-weight:600;
color:var(--text-primary);
}
.priv-toggle-desc{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
color:var(--text-muted);
letter-spacing:0.04em;
}
.priv-switch{position:relative;width:44px;height:26px;flex-shrink:0;}
.priv-switch input{opacity:0;width:0;height:0;position:absolute;}
.priv-switch-track{
position:absolute;
inset:0;
background:var(--border);
border-radius:13px;
cursor:pointer;
transition:background 0.2s;
}
.priv-switch-track::before{
content:'';
position:absolute;
width:20px;
height:20px;
top:3px;
left:3px;
border-radius:50%;
background:#6a5a42;
transition:transform 0.2s, background 0.2s;
}
.priv-switch input:checked + .priv-switch-track{background:var(--text-accent);}
.priv-switch input:checked + .priv-switch-track::before{
transform:translateX(18px);
background:var(--bg-card);
}

.install-banner{
display:flex;
align-items:center;
justify-content:space-between;
margin:0 16px 12px;
padding:12px 14px;
background:#1e2a0a;
border:1px solid #2d3a15;
border-radius:8px;
gap:12px;
}
.install-banner-text{
font-size:12px;
color:var(--good);
letter-spacing:0.05em;
}
.install-banner-btn{
padding:8px 14px;
background:var(--good);
color:#ffffff;
border:none;
border-radius:6px;
font-family:'IBM Plex Mono', monospace;
font-size:12px;
font-weight:700;
letter-spacing:1px;
cursor:pointer;
white-space:nowrap;
min-height:36px;
}
.observed-strip{
margin:0 0 10px;
background:#252519;
border:1px solid #3a3a28;
border-radius:8px;
overflow:hidden;
}
.observed-header{
display:flex;
align-items:center;
gap:8px;
padding:7px 12px 6px;
border-bottom:1px solid #2a3520;
}
.observed-dot{
width:6px;
height:6px;
background:#d4b96a;
border-radius:50%;
flex-shrink:0;
animation:observedPulse 2s infinite;
}
@keyframes observedPulse{
0%, 100%{opacity:1;}
50%{opacity:0.4;}
}
@media (prefers-reduced-motion:reduce){
.observed-dot{animation:none;opacity:1;}
}
.observed-dot--green{background:#7a9440;}
.observed-dot--grey{background:#6a6858;animation:none;}
.observed-live-label--stale{color:#5e5a4e;}
.observed-badge{
font-family:'DM Mono', monospace;
font-size:9px;
font-weight:500;
letter-spacing:2px;
color:#d4b96a;
background:rgba(212,185,106,0.08);
border:1px solid #7a6a3a;
border-radius:3px;
padding:2px 6px;
}
.observed-live-label{
font-family:'DM Mono', monospace;
font-size:10px;
color:#8a8060;
margin-left:auto;
}
.observed-data{
padding:8px 12px 4px;
display:flex;
align-items:baseline;
gap:6px;
flex-wrap:wrap;
}
.obs-wind-dir{
font-family:'Barlow Condensed', sans-serif;
font-size:20px;
font-weight:700;
color:#e8e0c0;
letter-spacing:0.5px;
}
.obs-wind-speed{
font-family:'Barlow Condensed', sans-serif;
font-size:20px;
font-weight:600;
color:#e8e0c0;
}
.obs-unit{
font-family:'DM Mono', monospace;
font-size:11px;
color:#9a9070;
}
.obs-gust{
font-family:'DM Mono', monospace;
font-size:12px;
color:#b0a878;
margin-left:2px;
}
.obs-temp{
font-family:'DM Mono', monospace;
font-size:12px;
color:#b0a878;
margin-left:4px;
}
.observed-meta{
padding:0 12px 8px;
font-family:'DM Mono', monospace;
font-size:10px;
color:#8a8060;
letter-spacing:0.3px;
}
.forecast-label-row{
display:flex;
align-items:center;
gap:8px;
padding:0 0 8px;
}
.forecast-badge{
font-family:'DM Mono', monospace;
font-size:9px;
font-weight:500;
letter-spacing:2px;
color:#8a8a68;
background:rgba(184,149,106,0.08);
border:1px solid #4a4a38;
border-radius:3px;
padding:2px 6px;
}
.forecast-rule{
flex:1;
height:1px;
background:#3a3a2a;
}

.location-strip{
display:flex;
align-items:center;
gap:10px;
padding:12px 16px;
background:#1a1508;
border-bottom:1px solid rgba(180,150,90,0.18);
}
.location-strip-stack{
flex:1;
min-width:0;
}
.location-strip-eyebrow{
font-size:10px;
color:#a8987a;
letter-spacing:0.16em;
font-weight:600;
text-transform:uppercase;
font-family:-apple-system, 'SF Pro Text', system-ui, sans-serif;
}
.location-strip-place{
font-size:14px;
color:#f0e8d4;
letter-spacing:-0.01em;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
font-family:-apple-system, 'SF Pro Text', system-ui, sans-serif;
}
.location-strip-badge{
font-size:10px;
color:#8db278;
letter-spacing:0.16em;
font-weight:600;
text-transform:uppercase;
white-space:nowrap;
font-family:-apple-system, 'SF Pro Text', system-ui, sans-serif;
}

@keyframes chatTypingBounce{
0%, 60%, 100%{transform:translateY(0);opacity:0.4;}
30%{transform:translateY(-4px);opacity:1;}
}
@keyframes chatFadeUp{
from{opacity:0;transform:translateY(8px);}
to{opacity:1;transform:translateY(0);}
}
#chat-overlay{
position:fixed;
inset:0 0 calc(72px + env(safe-area-inset-bottom)) 0;
max-width:390px;
margin:0 auto;
background:#15110b;
display:flex;
flex-direction:column;
z-index:210;
transform:translateY(100%);
transition:transform 0.35s cubic-bezier(0.32, 0.72, 0, 1);
font-family:-apple-system, BlinkMacSystemFont, sans-serif;
}
#chat-overlay.open{
transform:translateY(0);
}
.chat-header{
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
padding:calc(14px + env(safe-area-inset-top)) 16px 13px;
border-bottom:1px solid rgba(180,150,90,0.12);
flex-shrink:0;
}
.chat-title{
font-family:'Bebas Neue', 'Barlow Condensed', sans-serif;
font-size:22px;
letter-spacing:0.18em;
color:#c9a85a;
text-transform:uppercase;
line-height:1.1;
}
.chat-header-right{
display:flex;
flex-direction:column;
align-items:flex-end;
gap:5px;
justify-self:end;
}
.chat-header-meta{
font-size:12px;
color:#9a8e72;
text-align:right;
line-height:1.4;
letter-spacing:0.02em;
cursor:pointer;
}
.chat-silent-toggle{
font-size:11px;
padding:2px 8px;
border-radius:20px;
border:1px solid rgba(180,150,90,0.25);
background:transparent;
color:#9a8e72;
cursor:pointer;
letter-spacing:0.03em;
line-height:1.6;
transition:background 0.15s, color 0.15s, border-color 0.15s;
}
.chat-silent-toggle.active{
background:rgba(200,60,50,0.15);
border-color:rgba(220,80,60,0.4);
color:#e05040;
}
.chat-tts-banner{
font-size:12px;
color:#9a8e72;
background:rgba(180,150,90,0.08);
border:1px solid rgba(180,150,90,0.18);
border-radius:6px;
padding:7px 10px;
margin:8px 0 0;
text-align:center;
}
.chat-messages-wrap{
flex:1;
position:relative;
overflow:hidden;
}
.chat-messages{
position:absolute;
inset:0;
overflow-y:auto;
padding:13px 16px 24px;
display:flex;
flex-direction:column;
scrollbar-width:thin;
scrollbar-color:rgba(143,173,106,0.2) transparent;
}
.chat-messages::-webkit-scrollbar{width:2px;}
.chat-messages::-webkit-scrollbar-thumb{background:rgba(143,173,106,0.2);border-radius:2px;}
.chat-messages-fade{
position:absolute;
left:0;right:0;bottom:0;
height:32px;
background:linear-gradient(to bottom, rgba(21,17,11,0), #15110b);
pointer-events:none;
}
.chat-welcome{
flex:1;
display:flex;
flex-direction:column;
justify-content:flex-end;
padding-bottom:4px;
animation:chatFadeUp 0.3s ease;
}
.chat-welcome-intro{
display:flex;
align-items:flex-start;
gap:12px;
margin-bottom:20px;
}
.chat-welcome-avatar{
width:32px;
height:32px;
border-radius:50%;
background:rgba(180,150,90,0.1);
display:flex;
align-items:center;
justify-content:center;
font-size:16px;
flex-shrink:0;
margin-top:2px;
}
.chat-welcome-text{
flex:1;
font-size:17px;
color:#e8dfc8;
line-height:1.4;
}
.chat-loc-highlight{
color:#7fa372;
text-decoration:underline;
cursor:pointer;
}
.chat-prompt-list{display:flex;flex-direction:column;gap:8px;}
.chat-prompt-card{
display:flex;
align-items:center;
gap:12px;
padding:16px 14px;
background:#1f1a12;
border:1px solid rgba(180,150,90,0.12);
border-radius:12px;
cursor:pointer;
text-align:left;
width:100%;
animation:chatFadeUp 0.3s ease both;
min-height:44px;
}
.chat-prompt-card:nth-child(1){animation-delay:0.05s;}
.chat-prompt-card:nth-child(2){animation-delay:0.10s;}
.chat-prompt-card:nth-child(3){animation-delay:0.16s;}
.chat-prompt-card:nth-child(4){animation-delay:0.21s;}
.chat-prompt-card:active{background:#2a2318;border-color:rgba(180,150,90,0.22);}
.chat-prompt-emoji-tile{
width:36px;
height:36px;
border-radius:8px;
background:rgba(180,150,90,0.08);
display:flex;
align-items:center;
justify-content:center;
font-size:18px;
flex-shrink:0;
}
.chat-prompt-text{
flex:1;
font-size:17px;
color:#e8dfc8;
line-height:1.3;
letter-spacing:-0.2px;
}
.chat-prompt-chevron{
font-size:18px;
color:rgba(232,223,200,0.45);
flex-shrink:0;
line-height:1;
}
.chat-msg-row{animation:chatFadeUp 0.2s ease;}
.chat-msg-user-wrap{display:flex;justify-content:flex-end;margin-bottom:12px;}
.chat-msg-user{
max-width:72%;
padding:9px 13px;
border-radius:18px 18px 3px 18px;
background:linear-gradient(145deg, #3a5830, #537a40);
color:#eae2cc;
font-size:13px;
line-height:1.5;
word-break:break-word;
}
.chat-msg-ai-wrap{display:flex;align-items:flex-start;gap:9px;margin-bottom:12px;}
.chat-ai-avatar{
width:28px;
height:28px;
border-radius:50%;
flex-shrink:0;
background:linear-gradient(135deg, #2a3e25, #4e6e38);
border:1px solid rgba(143,173,106,0.25);
display:flex;
align-items:center;
justify-content:center;
font-size:13px;
margin-top:2px;
}
.chat-msg-assistant{
flex:1;
padding:10px 13px;
border-radius:3px 14px 14px 14px;
background:var(--bg-base);
color:var(--text-main);
font-size:13px;
line-height:1.55;
word-break:break-word;
border:1px solid var(--border);
}
.chat-typing-wrap{display:flex;align-items:flex-start;gap:9px;margin-bottom:12px;}
.chat-typing-bubble{
padding:12px 14px;
border-radius:3px 14px 14px 14px;
background:var(--bg-base);
border:1px solid var(--border);
display:flex;
align-items:center;
gap:5px;
}
.chat-typing-dot{
width:6px;
height:6px;
border-radius:50%;
background:#8fad6a;
animation:chatTypingBounce 1.3s ease-in-out infinite;
}
.chat-typing-dot:nth-child(2){animation-delay:0.18s;}
.chat-typing-dot:nth-child(3){animation-delay:0.36s;}
.chat-input-area{
border-top:1px solid rgba(180,150,90,0.12);
background:#15110b;
padding:8px 14px 12px;
flex-shrink:0;
}
.chat-chips{
display:flex;
gap:5px;
margin-bottom:7px;
overflow-x:auto;
scrollbar-width:none;
}
.chat-chips::-webkit-scrollbar{display:none;}
.chat-chip{
flex-shrink:0;
padding:4px 10px;
background:rgba(143,173,106,0.07);
border:1px solid rgba(143,173,106,0.15);
border-radius:20px;
color:rgba(143,173,106,0.8);
font-size:11px;
cursor:pointer;
white-space:nowrap;
}
.chat-chip:active{background:rgba(143,173,106,0.15);}
.chat-input-row{display:flex;gap:10px;align-items:center;}
.chat-input-wrap{
flex:1;
background:#3a2f1f;
border:1px solid rgba(180,150,90,0.25);
border-radius:27px;
height:54px;
display:flex;
align-items:center;
padding:0 14px;
gap:8px;
transition:border-color 0.18s;
}
.chat-input-wrap:focus-within{border-color:#c9a85a;}
.chat-input-lead{
color:#e8dfc8;
opacity:0.55;
font-size:16px;
flex-shrink:0;
line-height:1;
pointer-events:none;
}
.chat-input{
flex:1;
border:none;
background:transparent;
color:#e8dfc8;
font-size:17px;
letter-spacing:-0.2px;
line-height:1.4;
resize:none;
padding:0;
max-height:100px;
overflow-y:auto;
-webkit-appearance:none;
}
.chat-input:focus{outline:none;}
.chat-input::placeholder{color:rgba(232,223,200,0.78);}
.chat-action-btn{
width:50px;
height:50px;
border-radius:25px;
flex-shrink:0;
border:1px solid rgba(180,150,90,0.12);
background:rgba(255,255,255,0.02);
display:flex;
align-items:center;
justify-content:center;
cursor:not-allowed;
transition:background 0.15s, box-shadow 0.15s, border-color 0.15s;
}
.chat-action-btn .chat-send-icon{display:none;}
.chat-action-btn .chat-mic-icon{display:flex;opacity:0.4;}
.chat-action-btn.has-text{
background:#c9a85a;
border:none;
box-shadow:0 4px 14px rgba(201,168,90,0.25);
color:#15110b;
cursor:pointer;
}
.chat-action-btn.has-text .chat-send-icon{display:flex;}
.chat-action-btn.has-text .chat-mic-icon{display:none;}
.chat-action-btn.voice-enabled{
cursor:pointer;
}
.chat-action-btn.voice-enabled .chat-mic-icon{opacity:1;}
.chat-action-btn.recording{
background:rgba(200,60,50,0.18);
border-color:rgba(220,80,60,0.5);
cursor:pointer;
}
.chat-action-btn.recording .chat-mic-icon svg{stroke:#e05040;}
@keyframes mic-pulse{0%,100%{box-shadow:0 0 0 0 rgba(220,80,60,0.4);}60%{box-shadow:0 0 0 7px rgba(220,80,60,0);}}
.chat-action-btn.recording{animation:mic-pulse 1.1s ease-out infinite;}
.chat-action-btn.uploading{cursor:default;opacity:0.6;}
.chat-action-btn .chat-stop-icon{display:none;}
.chat-action-btn.tts-playing{
background:rgba(200,60,50,0.18);
border-color:rgba(220,80,60,0.5);
cursor:pointer;
color:#e05040;
}
.chat-action-btn.tts-playing .chat-mic-icon{display:none;}
.chat-action-btn.tts-playing .chat-send-icon{display:none;}
.chat-action-btn.tts-playing .chat-stop-icon{display:flex;}
.voice-level-bar{
position:absolute;
bottom:-6px;
left:50%;
transform:translateX(-50%);
width:30px;
height:3px;
border-radius:2px;
background:rgba(220,80,60,0.7);
transform-origin:center;
transition:scaleX 0.05s;
display:none;
}
.chat-action-btn.recording + .voice-level-bar,
.chat-action-btn-wrap.recording .voice-level-bar{display:block;}
.discuss-btn{
display:block;
width:100%;
margin-top:10px;
padding:10px 14px;
background:transparent;
border:1px solid #4a5c2a;
border-radius:6px;
color:#9aaa6a;
font-family:'IBM Plex Mono', monospace;
font-size:12px;
letter-spacing:0.06em;
text-transform:uppercase;
cursor:pointer;
text-align:center;
}
.discuss-btn:active{
background:rgba(74,92,42,0.15);
}

#bottom-nav{
position:fixed;
bottom:0;
left:0;
right:0;
display:flex;
align-items:stretch;
height:calc(72px + env(safe-area-inset-bottom));
padding-bottom:env(safe-area-inset-bottom);
background:#15110b;
border-top:0.5px solid rgba(180,150,90,0.12);
z-index:300;
}
.nav-tab{
flex:1;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:5px;
padding:10px 0 4px;
border:none;
background:none;
cursor:pointer;
position:relative;
color:#8a7a60;
transition:color 0.2s ease;
-webkit-tap-highlight-color:transparent;
}
.nav-tab.active[data-tab="forecast"]{color:#6ab0e8;}
.nav-tab.active[data-tab="log"]{color:#8fad6a;}
.nav-tab.active[data-tab="plan"]{color:#c9a85a;}
.nav-tab.active[data-tab="log-hunt"]{color:#c0d0a0;}
.nav-indicator{
position:absolute;
top:0;
left:50%;
transform:translateX(-50%);
width:28px;
height:2px;
border-radius:0 0 2px 2px;
background:currentColor;
}
.nav-label{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
font-weight:600;
letter-spacing:0.14em;
text-transform:uppercase;
}

.lh-screen{
background:#1a1614;
min-height:100vh;
padding-bottom:calc(80px + env(safe-area-inset-bottom));
}
.lh-header{padding:calc(16px + env(safe-area-inset-top)) 20px 8px;}
.lh-title{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:26px;
color:#e8dfd0;
text-transform:uppercase;
letter-spacing:0.02em;
line-height:1.1;
margin:0 0 4px;
}
.lh-label{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
letter-spacing:0.12em;
text-transform:uppercase;
color:#8a8078;
}
.lh-pill{
display:inline-flex;
align-items:center;
gap:5px;
font-family:'IBM Plex Mono', monospace;
font-size:10px;
letter-spacing:0.12em;
text-transform:uppercase;
padding:3px 8px;
border-radius:4px;
margin-bottom:6px;
}
.lh-pill-live{color:#5d6e3e;background:rgba(93,110,62,0.15);}
.lh-pill-retro{color:#8a6030;background:rgba(138,96,48,0.15);}
.lh-pill-draft{color:#8a6030;background:rgba(138,96,48,0.15);}
.lh-pill-dot{
width:8px;height:8px;
border-radius:50%;
background:#5d6e3e;
display:inline-block;
}
.lh-entry-cards{padding:8px 16px 16px;display:flex;flex-direction:column;gap:12px;}
.lh-card{
border-radius:12px;
padding:18px 20px;
display:flex;
align-items:center;
gap:14px;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.lh-card-live{background:#5d6e3e;}
.lh-card-retro{background:#24201e;border:1px solid #3a3330;}
.lh-card-icon{
width:36px;height:36px;
border-radius:8px;
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
}
.lh-card-live .lh-card-icon{background:rgba(255,255,255,0.15);}
.lh-card-retro .lh-card-icon{background:#1a1614;}
.lh-card-title{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:18px;
text-transform:uppercase;
color:#e8dfd0;
letter-spacing:0.02em;
}
.lh-card-retro .lh-card-title{color:#b8afa8;}
.lh-card-sub{font-size:12px;color:rgba(232,223,208,0.7);margin-top:2px;}
.lh-card-retro .lh-card-sub{color:#6b6460;}
.lh-last-hunt{
margin:0 16px;
background:#1e1b19;
border-left:3px solid #3a3330;
border-radius:6px;
padding:10px 14px;
font-size:12px;
color:#8a8078;
}
.lh-field{margin:0 16px 12px;}
.lh-field-label{margin-bottom:6px;}
.lh-input-row{
background:#221e1b;
border:1px solid #3a3330;
border-radius:8px;
padding:11px 14px;
display:flex;
align-items:center;
justify-content:space-between;
font-size:14px;
color:#e8dfd0;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.lh-chip-row{display:flex;flex-wrap:wrap;gap:8px;}
.lh-chip{
padding:6px 14px;
border-radius:20px;
font-size:13px;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
border:1px solid #3a3330;
background:#221e1b;
color:#6b6460;
}
.lh-chip.active{background:#1e2818;border:1.5px solid #5d6e3e;color:#c0d0a0;}
.lh-time-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.lh-bag-card{
margin:0 16px 12px;
background:#221e1b;
border:1px solid #3a3330;
border-radius:10px;
overflow:hidden;
}
.lh-bag-row{
display:flex;
align-items:center;
padding:12px 14px;
border-bottom:1px solid #2a2420;
}
.lh-bag-row:last-child{border-bottom:none;}
.lh-bag-species{flex:1;font-size:14px;color:#c0b8b0;}
.lh-stepper{display:flex;align-items:center;gap:8px;}
.lh-step-btn{
width:28px;height:28px;
border:none;
border-radius:6px;
display:flex;align-items:center;justify-content:center;
font-size:18px;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
color:#e8dfd0;
}
.lh-step-btn.minus{background:#1a1614;}
.lh-step-btn.plus{background:#221e1b;}
.lh-step-btn.plus.active{background:#3a4828;}
.lh-step-count{
font-family:'IBM Plex Mono', monospace;
font-size:15px;
color:#4a4540;
min-width:18px;
text-align:center;
}
.lh-step-count.nonzero{color:#e8dfd0;}
.lh-bag-total{
display:flex;
justify-content:space-between;
align-items:center;
padding:10px 14px;
border-top:1px solid #2a2420;
}
.lh-bag-total-count{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:24px;
color:#e8dfd0;
}
.lh-conditions{
background:#1e1b19;
border:1px solid #2a2420;
border-radius:8px;
padding:11px 14px;
display:flex;
align-items:center;
justify-content:space-between;
}
.lh-conditions-hint{
font-size:11px;
color:#3a3330;
margin-top:5px;
}
.lh-source-pill{
font-family:'IBM Plex Mono', monospace;
font-size:9px;
text-transform:uppercase;
letter-spacing:0.1em;
color:#4a5a38;
background:rgba(93,110,62,0.12);
padding:2px 6px;
border-radius:4px;
}
.lh-notes{
background:#221e1b;
border:1px solid #3a3330;
border-radius:8px;
padding:11px 14px;
min-height:64px;
width:100%;
box-sizing:border-box;
color:#e8dfd0;
font-size:14px;
font-family:inherit;
resize:none;
}
.lh-notes::placeholder{color:#4a4540;font-style:italic;}
.lh-voice-banner{
display:flex;align-items:center;gap:10px;
margin:0 16px 12px;
padding:10px 12px;
background:rgba(100,121,52,0.12);
border:1px solid rgba(100,121,52,0.35);
border-radius:10px;
cursor:pointer;
width:calc(100% - 32px);
text-align:left;
color:#8aaa42;
}
.lh-voice-banner-body{flex:1;}
.lh-voice-banner-title{font-size:13px;font-weight:600;color:#a0c050;}
.lh-voice-banner-sub{font-size:11px;color:#647934;margin-top:1px;}
.lh-cta{
display:block;
width:100%;
background:#5d6e3e;
border:none;
border-radius:10px;
padding:15px;
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:18px;
text-transform:uppercase;
color:#e8dfd0;
letter-spacing:0.02em;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.lh-cta-wrap{padding:8px 16px 16px;}
.lh-top-strip{
display:flex;
justify-content:space-between;
align-items:flex-start;
padding:12px 20px 14px;
border-bottom:1px solid #2a2420;
}
.lh-timer{
font-family:'IBM Plex Mono', monospace;
font-size:22px;
color:#e8dfd0;
letter-spacing:0.05em;
}
.lh-gps-row{
display:flex;
align-items:center;
gap:5px;
margin-top:3px;
}
.lh-gps-dot{
width:6px;height:6px;
border-radius:50%;
background:#5d6e3e;
flex-shrink:0;
}
.lh-gps-label{
font-family:'IBM Plex Mono', monospace;
font-size:9px;
text-transform:uppercase;
letter-spacing:0.1em;
color:#5d6e3e;
}
.lh-bag-count-wrap{text-align:center;padding:16px 20px 8px;}
.lh-bag-count-num{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:76px;
color:#e8dfd0;
line-height:1;
}
.lh-bird-btn{
margin:8px 16px;
background:#5d6e3e;
border:none;
border-radius:12px;
padding:0;
width:calc(100% - 32px);
aspect-ratio:2 / 1;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.lh-bird-btn-title{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:28px;
text-transform:uppercase;
color:#e8dfd0;
letter-spacing:0.02em;
}
.lh-bird-btn-sub{font-size:11px;color:rgba(232,223,208,0.6);margin-top:4px;}
.lh-undo{
text-align:center;
padding:10px;
font-size:12px;
color:#4a4540;
text-decoration:underline;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
background:none;
border:none;
width:100%;
}
.lh-session-log{
border-top:1px solid #2a2420;
padding:10px 20px 0;
}
.lh-log-row{
display:flex;
align-items:center;
gap:8px;
padding:5px 0;
}
.lh-log-dot{
width:6px;height:6px;
border-radius:50%;
background:#3a4828;
flex-shrink:0;
}
.lh-log-time{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
color:#6b6460;
flex-shrink:0;
}
.lh-log-species{font-size:12px;color:#8a8078;flex:1;}
.lh-log-photo{
width:14px;height:14px;
display:flex;align-items:center;justify-content:center;
}
.lh-end-btn{
margin:16px 16px 20px;
background:#3d1a14;
border:none;
border-radius:10px;
padding:14px;
text-align:center;
cursor:pointer;
width:calc(100% - 32px);
-webkit-tap-highlight-color:transparent;
}
.lh-end-btn-title{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:15px;
text-transform:uppercase;
color:#f09595;
letter-spacing:0.02em;
}
.lh-sheet-backdrop{
position:fixed;inset:0;
background:rgba(0,0,0,0.6);
z-index:500;
}
.lh-sheet{
position:fixed;
bottom:0;left:0;right:0;
background:#221e1b;
border-top-left-radius:16px;
border-top-right-radius:16px;
border-top:1px solid #3a3330;
z-index:501;
max-height:90vh;
overflow-y:auto;
padding-bottom:calc(16px + env(safe-area-inset-bottom));
}
.lh-sheet-handle-wrap{padding:10px 0 8px;display:flex;justify-content:center;}
.lh-sheet-handle{width:36px;height:4px;background:#3a3330;border-radius:2px;}
.lh-sheet-header{
display:flex;
justify-content:space-between;
align-items:center;
padding:4px 16px 12px;
border-bottom:1px solid #2a2420;
}
.lh-sheet-title{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:20px;
text-transform:uppercase;
color:#e8dfd0;
}
.lh-sheet-cancel{font-size:13px;color:#4a4540;background:none;border:none;cursor:pointer;}
.lh-last-used-card{
margin:12px 16px;
background:#1e2818;
border:1.5px solid #5d6e3e;
border-radius:10px;
padding:10px 14px;
display:flex;
align-items:center;
}
.lh-species-row{
background:#1a1614;
border-radius:8px;
margin:0 16px 4px;
padding:13px 14px;
display:flex;
align-items:center;
}
.lh-species-name{flex:1;font-size:14px;color:#c0b8b0;}
.lh-species-other{color:#4a4540;font-style:italic;}
.lh-sheet-confirm{
margin:12px 16px 4px;
background:#5d6e3e;
border:none;
border-radius:10px;
padding:14px;
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:17px;
text-transform:uppercase;
color:#e8dfd0;
width:calc(100% - 32px);
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.lh-sheet-confirm:disabled{opacity:0.4;}
.lh-confirm-banner{
margin:14px 16px 0;
background:#1e2818;
border:1px solid #3a4828;
border-radius:10px;
padding:12px 14px;
display:flex;
align-items:center;
gap:10px;
}
.lh-confirm-tick{
width:28px;height:28px;
border-radius:50%;
background:#3a4828;
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
color:#5d6e3e;
font-size:14px;
}
.lh-confirm-text{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
text-transform:uppercase;
letter-spacing:0.1em;
color:#5d6e3e;
}
.lh-photo-prompt{text-align:center;padding:28px 20px 20px;}
.lh-photo-prompt-title{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:26px;
text-transform:uppercase;
color:#e8dfd0;
}
.lh-photo-prompt-sub{font-size:13px;color:#4a4540;margin-top:4px;}
.lh-photo-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 16px;}
.lh-photo-btn{
border:none;
border-radius:12px;
padding:20px 12px;
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.lh-photo-btn.take{background:#5d6e3e;}
.lh-photo-btn.skip{background:transparent;border:1.5px solid #3a3330;}
.lh-photo-btn-icon{
width:40px;height:40px;
border-radius:8px;
display:flex;align-items:center;justify-content:center;
font-size:18px;
}
.lh-photo-btn.take .lh-photo-btn-icon{background:rgba(255,255,255,0.15);}
.lh-photo-btn.skip .lh-photo-btn-icon{background:#221e1b;color:#8a8078;}
.lh-photo-btn-label{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:16px;
text-transform:uppercase;
letter-spacing:0.02em;
}
.lh-photo-btn.take .lh-photo-btn-label{color:#e8dfd0;}
.lh-photo-btn.skip .lh-photo-btn-label{color:#8a8078;}
.lh-photo-note{text-align:center;font-size:11px;color:#3a3330;margin:8px 16px 0;}
.lh-bag-strip{
display:flex;
justify-content:space-between;
align-items:center;
border-top:1px solid #2a2420;
padding:10px 20px;
margin-top:16px;
}
.lh-bag-strip-count{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:24px;
color:#e8dfd0;
}
.lh-review-header{
border-bottom:1px solid #2a2420;
padding:14px 20px;
}
.lh-review-meta{
display:flex;
gap:20px;
margin-top:8px;
flex-wrap:wrap;
}
.lh-review-meta-item{}
.lh-review-meta-val{font-size:12px;color:#8a8078;margin-top:2px;}
.lh-review-section{
border-bottom:1px solid #2a2420;
padding:12px 20px;
}
.lh-review-section-hdr{
display:flex;
justify-content:space-between;
align-items:baseline;
margin-bottom:8px;
}
.lh-bag-total-big{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:28px;
color:#e8dfd0;
}
.lh-species-pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;}
.lh-species-pill{
background:#1e2818;
border:1px solid #3a4828;
border-radius:20px;
padding:4px 10px;
font-size:12px;
color:#c0b8b0;
display:flex;
align-items:center;
gap:4px;
}
.lh-species-pill-count{
font-family:'IBM Plex Mono', monospace;
font-size:11px;
color:#5d6e3e;
}
.lh-bird-list-row{
display:flex;
align-items:center;
gap:8px;
padding:4px 0;
border-bottom:1px solid #1e1b19;
}
.lh-bird-list-time{
font-family:'IBM Plex Mono', monospace;
font-size:10px;
color:#4a4540;
flex-shrink:0;
width:40px;
}
.lh-bird-list-species{font-size:12px;color:#8a8078;flex:1;}
.lh-thumb{
width:22px;height:22px;
border-radius:4px;
object-fit:cover;
}
.lh-thumb-placeholder{
width:22px;height:22px;
border-radius:4px;
border:1px dashed #3a3330;
}
.lh-add-bird-btn{
display:block;
width:100%;
background:none;
border:1px dashed #2a2420;
border-radius:8px;
padding:8px 12px;
text-align:center;
font-size:12px;
color:#4a4540;
cursor:pointer;
margin-top:8px;
}
.lh-review-actions{
display:flex;
gap:10px;
padding:12px 16px 20px;
}
.lh-discard-btn{
background:none;
border:1.5px solid #3a3330;
border-radius:10px;
padding:12px 16px;
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:13px;
text-transform:uppercase;
color:#6b6460;
cursor:pointer;
white-space:nowrap;
-webkit-tap-highlight-color:transparent;
}
.lh-save-btn{
flex:1;
background:#5d6e3e;
border:none;
border-radius:10px;
padding:12px 20px;
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:16px;
text-transform:uppercase;
color:#e8dfd0;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.lh-modal-backdrop{
position:fixed;inset:0;
background:rgba(0,0,0,0.7);
z-index:600;
display:flex;
align-items:center;
justify-content:center;
padding:20px;
}
.lh-modal{
background:#221e1b;
border:1px solid #3a3330;
border-radius:12px;
padding:20px;
width:100%;
max-width:320px;
}
.lh-modal-title{
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:20px;
text-transform:uppercase;
color:#e8dfd0;
margin-bottom:8px;
}
.lh-modal-body{font-size:13px;color:#8a8078;margin-bottom:16px;}
.lh-modal-btns{display:flex;gap:10px;}
.lh-modal-resume{
flex:1;
background:#5d6e3e;
border:none;
border-radius:8px;
padding:12px;
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:15px;
text-transform:uppercase;
color:#e8dfd0;
cursor:pointer;
}
.lh-modal-discard{
background:none;
border:1px solid #3a3330;
border-radius:8px;
padding:12px 14px;
font-family:'Barlow Condensed', sans-serif;
font-weight:800;
font-size:13px;
text-transform:uppercase;
color:#6b6460;
cursor:pointer;
}
.vh-location-change{font-family:'IBM Plex Mono', monospace;font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:#8aad5a;background:none;border:none;padding:0;cursor:pointer;}
.vh-location-map-wrap{position:relative;height:140px;overflow:hidden;background:#12110a;isolation:isolate;}
.vh-location-map-inner{width:100%;height:140px;}
.vh-location-overlay{position:absolute;pointer-events:none;z-index:500;}
.vh-location-compass{top:8px;right:8px;}
.vh-location-sat-badge{bottom:8px;left:8px;background:rgba(0,0,0,0.55);color:#fff;font-family:'IBM Plex Mono', monospace;font-size:9px;letter-spacing:0.1em;padding:2px 6px;border-radius:3px;}
.vh-location-scale{bottom:8px;right:8px;display:flex;flex-direction:column;align-items:flex-end;gap:2px;}
.vh-location-scale-bar{width:40px;height:3px;background:#fff;border-left:1px solid #fff;border-right:1px solid #fff;}
.vh-location-scale-label{font-family:'IBM Plex Mono', monospace;font-size:8px;color:#fff;letter-spacing:0.06em;}
.vh-location-map-tap{position:absolute;inset:0;z-index:501;cursor:pointer;background:transparent;border:none;}
.vh-location-meta{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-top:1px solid var(--border);}
.vh-location-meta-left{flex:1;min-width:0;}
.vh-location-name{font-family:'Barlow Condensed', sans-serif;font-size:15px;font-weight:700;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.vh-location-dms{font-family:'IBM Plex Mono', monospace;font-size:10px;color:var(--muted);margin-top:1px;}
.vh-location-meta-actions{display:flex;gap:6px;flex-shrink:0;margin-left:10px;}
.vh-location-empty{display:flex;align-items:center;gap:10px;padding:14px;cursor:pointer;background:none;border:none;width:100%;text-align:left;}
.vh-location-empty-text{font-family:'Barlow', sans-serif;font-size:13px;color:var(--muted);}
.vh-location-denied{padding:10px 14px;font-family:'IBM Plex Mono', monospace;font-size:11px;color:var(--muted);display:flex;align-items:center;justify-content:space-between;gap:10px;}
.vh-location-denied-link{color:#8aad5a;background:none;border:none;font-family:'IBM Plex Mono', monospace;font-size:11px;letter-spacing:0.06em;cursor:pointer;padding:0;flex-shrink:0;}
.vh-pin-wrap{position:relative;display:flex;flex-direction:column;align-items:center;}
.vh-pin-pulse{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:20px;height:20px;border-radius:50%;border:2px solid rgba(220,50,50,0.55);animation:vh-pulse 2s ease-out infinite;}
@keyframes vh-pulse{0%{transform:translateX(-50%) scale(0.7);opacity:1;}100%{transform:translateX(-50%) scale(2.2);opacity:0;}}
.vh-location-picker{position:fixed;inset:0;z-index:800;background:#12110a;display:flex;flex-direction:column;}
.vh-location-picker-header{display:flex;align-items:center;gap:8px;padding:10px 12px;padding-top:calc(10px + env(safe-area-inset-top));background:rgba(0,0,0,0.72);position:absolute;top:0;left:0;right:0;z-index:900;}
.vh-location-picker-close{background:none;border:none;color:#c0b8b0;font-size:18px;cursor:pointer;padding:4px 8px;line-height:1;flex-shrink:0;}
.vh-location-picker-search-wrap{display:flex;flex:1;gap:6px;}
.vh-location-picker-search{flex:1;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);border-radius:6px;color:#f0ead8;font-family:'IBM Plex Mono', monospace;font-size:12px;padding:7px 10px;outline:none;min-width:0;}
.vh-location-picker-search::placeholder{color:rgba(255,255,255,0.35);}
.vh-location-picker-search-btn{background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.2);border-radius:6px;color:#f0ead8;font-family:'IBM Plex Mono', monospace;font-size:11px;letter-spacing:0.08em;padding:7px 12px;cursor:pointer;flex-shrink:0;}
.vh-location-picker-map{flex:1;width:100%;isolation:isolate;}
.vh-location-picker-footer{position:absolute;bottom:0;left:0;right:0;z-index:10;padding:14px 16px;padding-bottom:calc(14px + env(safe-area-inset-bottom));background:rgba(0,0,0,0.72);}
.vh-location-picker-confirm{width:100%;padding:14px;background:var(--cta-bg);color:var(--cta-text);border:none;border-radius:6px;font-family:'IBM Plex Mono', monospace;font-size:12px;letter-spacing:0.12em;text-transform:uppercase;cursor:pointer;}
.vh-location-picker-hint{text-align:center;font-family:'IBM Plex Mono', monospace;font-size:9px;color:rgba(255,255,255,0.4);margin-top:8px;letter-spacing:0.1em;text-transform:uppercase;}
.leaflet-container{background:#12110a !important;}
.vh-location-map-inner .leaflet-control-container{display:none;}