/* Tangled Valley app. Same palette and fonts as tangledvalley.com. */
:root{
  --navy:#13254a; --red:#c4262e; --gold:#b9863a; --moss:#2c4a2f;
  --bg:#f3f4ee; --surface:#ffffff; --surface-2:#e8eadf; --fg:#13254a; --muted:#56607a; --line:#cfd3c4;
  --accent:#c4262e; --accent-ink:#ffffff; --gold-ink:#8a5e1c; --gold-soft:#f3e6cc; --chip:#e6e9df;
  --map-ground:#1d3220; --map-canopy:#2a4a2c; --map-canopy-2:#33573a; --map-fairway:#7f9b62; --map-ink:#f3ead8; --map-line:#e9dcb8;
  --display:"Alfa Slab One","Rockwell","Roboto Slab",Georgia,serif;
  --body:"Barlow","Segoe UI",system-ui,sans-serif;
  --label:"Barlow Condensed","Arial Narrow","Barlow",sans-serif;
  --r:14px; --tabh:64px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#0b1428; --surface:#13203d; --surface-2:#1a2a4b; --fg:#f1e9d8; --muted:#a9b2c8; --line:#2a3a5e;
  --accent:#e2464a; --gold-ink:#e2b468; --gold-soft:#2f2a22; --chip:#1c2c4e; color-scheme:dark}}

*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--fg);font:400 16px/1.45 var(--body);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.05;margin:0;letter-spacing:.005em}
h2{font-size:1.45rem}
h3{font-size:1.1rem}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
[hidden]{display:none!important}
.label{font:600 .74rem/1.1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0}
.muted{color:var(--muted)}
.small{font-size:.88rem}

/* top bar */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;padding:calc(env(safe-area-inset-top) + 8px) 16px 8px;background:var(--navy);color:#f3ead8}
.top img{width:30px;height:30px;object-fit:contain}
.top h1{font-size:1.15rem;color:#f3ead8;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top .back{background:none;border:0;color:#f3ead8;font:700 1rem/1 var(--label);letter-spacing:.08em;text-transform:uppercase;padding:8px 4px}
.top .sync{font:600 .7rem/1 var(--label);letter-spacing:.1em;text-transform:uppercase;padding:5px 8px;border-radius:99px;background:rgba(255,255,255,.12)}

main{padding:16px 16px calc(var(--tabh) + env(safe-area-inset-bottom) + 24px);max-width:720px;margin:0 auto}
.view{display:none}
.view.on{display:block;animation:fade .18s ease}
@keyframes fade{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}

/* bottom tabs */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:repeat(5,1fr);height:calc(var(--tabh) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--surface);border-top:1px solid var(--line)}
.tabbar a{display:grid;place-items:center;align-content:center;gap:3px;text-decoration:none;color:var(--muted);font:700 .7rem/1 var(--label);letter-spacing:.1em;text-transform:uppercase}
.tabbar svg{width:24px;height:24px}
.tabbar a[aria-current="page"]{color:var(--accent)}

/* cards */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin:0 0 14px}
.card.hero{background:var(--navy) url(../img/header-woods.webp) center/cover;color:#f3ead8;border:0;position:relative;overflow:hidden;padding:20px}
.card.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(19,37,74,.55),rgba(19,37,74,.92))}
.card.hero>*{position:relative}
.card.hero .label{color:#e9dcb8}
.hero-row{display:flex;gap:14px;align-items:center}
.hero-row img{width:74px;height:74px;object-fit:contain;flex:none}
.hero h2{font-size:1.6rem;color:#fff}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 14px}
.grid2 .card{margin:0}
.stat{font:2rem/1 var(--display);margin:6px 0 2px}
.stat.gold{color:var(--gold-ink)}
.stat.red{color:var(--accent)}
.sec-h{display:flex;justify-content:space-between;align-items:baseline;margin:22px 2px 10px}
.sec-h a{font:700 .8rem/1 var(--label);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);text-decoration:none}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 18px;border-radius:12px;border:0;background:var(--accent);color:var(--accent-ink);font:700 1rem/1 var(--label);letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.btn.ghost{background:transparent;color:var(--fg);border:1.5px solid var(--line)}
.btn.navy{background:var(--navy);color:#f3ead8}
.btn.block{width:100%}
.btn:disabled{opacity:.45}
.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 14px}
.act{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);text-decoration:none;color:var(--fg);text-align:left}
.act svg{width:26px;height:26px;color:var(--accent)}
.act b{font:700 1.02rem/1.1 var(--label);letter-spacing:.06em;text-transform:uppercase}
.act span{font-size:.84rem;color:var(--muted)}

.list{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.list>li{border-top:1px solid var(--line)}
.list>li:first-child{border-top:0}
.list a,.list .row{display:flex;align-items:center;gap:12px;padding:14px 16px;text-decoration:none;color:var(--fg)}
.list svg.ico{width:22px;height:22px;color:var(--accent);flex:none}
.list .grow{flex:1;min-width:0}
.list .grow span{display:block;color:var(--muted);font-size:.86rem}
.list .chev{color:var(--muted)}

.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:none}
.chips button{flex:none;padding:8px 14px;border-radius:99px;border:1px solid var(--line);background:var(--surface);font:700 .85rem/1 var(--label);letter-spacing:.08em;text-transform:uppercase}
.chips button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#f3ead8}
@media (prefers-color-scheme:dark){.chips button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent)}}

/* standings */
table{border-collapse:collapse;width:100%}
.stand td,.stand th{padding:10px 8px;text-align:right;border-top:1px solid var(--line)}
.stand th{font:600 .72rem/1 var(--label);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-top:0}
.stand td:nth-child(2),.stand th:nth-child(2){text-align:left}
.pl{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--chip);font:700 .9rem/1 var(--label)}
.r1 .pl{background:#d4a64a;color:#2b1d05}.r2 .pl{background:#b9bec8;color:#1d2230}.r3 .pl{background:#c58a5a;color:#2a1608}
.pts{display:inline-block;min-width:40px;padding:4px 8px;border-radius:99px;background:var(--gold-soft);color:var(--gold-ink);font:700 .95rem/1 var(--label);text-align:center}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.sc{font-size:.85rem}
.sc th,.sc td{padding:6px 5px;text-align:center;border-top:1px solid var(--line);white-space:nowrap}
.sc td:first-child,.sc th:first-child{text-align:left;position:sticky;left:0;background:var(--surface);padding-right:10px}
.s-bird{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#2f7a45;color:#fff}
.s-ace{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#d4a64a;color:#2b1d05;font-weight:700}
.s-bog{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:4px;border:1.5px solid var(--accent)}
.s-dbl{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:4px;background:var(--accent);color:#fff}
details.wk{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);margin:0 0 10px;overflow:hidden}
details.wk summary{list-style:none;display:flex;gap:12px;align-items:center;padding:12px 14px;cursor:pointer}
details.wk summary::-webkit-details-marker{display:none}
details.wk .wkn{font:1.1rem/1 var(--display);color:var(--accent);min-width:34px}
details.wk .body{padding:0 10px 12px}

.person{display:flex;gap:12px;align-items:center}
.ini{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--navy);color:#f3ead8;font:700 .95rem/1 var(--label);letter-spacing:.04em;flex:none}

/* play: setup */
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;padding:4px;border-radius:12px;background:var(--chip);margin:6px 0 14px}
.seg button{border:0;background:transparent;padding:10px 6px;border-radius:9px;font:700 .9rem/1 var(--label);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--fg);box-shadow:0 1px 3px rgba(0,0,0,.15)}
.roster{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}
.roster button{padding:9px 13px;border-radius:99px;border:1.5px solid var(--line);background:var(--surface);font:600 .95rem/1 var(--body)}
.roster button[aria-pressed="true"]{border-color:var(--accent);background:var(--accent);color:#fff}
.addp{display:flex;gap:8px}
.addp input{flex:1;min-width:0;min-height:46px;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface)}
.startpick{display:grid;grid-template-columns:repeat(9,1fr);gap:4px;margin:6px 0 14px}
.startpick button{aspect-ratio:1;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);font:700 1rem/1 var(--label)}
.startpick button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#f3ead8}

/* play: hole */
.holehead{display:flex;align-items:stretch;gap:12px;margin:0 0 12px}
.holenum{display:grid;place-items:center;min-width:84px;border-radius:var(--r);background:var(--navy);color:#f3ead8;padding:8px}
.holenum b{font:2.6rem/1 var(--display)}
.holenum span{font:600 .7rem/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:#e9dcb8}
.holemeta{flex:1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
.holemeta div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:8px;text-align:center}
.holemeta b{display:block;font:1.35rem/1.1 var(--display)}
.acebar{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:var(--gold-soft);color:var(--gold-ink);font:700 .9rem/1.2 var(--label);letter-spacing:.06em;text-transform:uppercase;margin:0 0 12px}
.note{padding:10px 12px;border-left:3px solid var(--accent);background:var(--surface);border-radius:0 10px 10px 0;margin:0 0 12px;font-size:.95rem}
.map{border-radius:var(--r);overflow:hidden;background:var(--map-ground);margin:0 0 12px}
.map svg{display:block;width:100%;height:auto}
.prow{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);margin:0 0 8px}
.prow .nm{flex:1;min-width:0}
.prow .nm b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prow .nm span{font-size:.82rem;color:var(--muted)}
.step{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);font:700 1.6rem/1 var(--label);display:grid;place-items:center;padding:0}
.val{width:52px;height:52px;border-radius:14px;border:0;background:var(--chip);font:1.7rem/1 var(--display);display:grid;place-items:center;padding:0}
.val.unset{color:var(--muted);opacity:.55}
.val.bird{background:#2f7a45;color:#fff}
.val.ace{background:#d4a64a;color:#2b1d05}
.val.bog{background:#f2d6d6;color:#8c1b20}
.val.dbl{background:var(--accent);color:#fff}
.holenav{position:sticky;bottom:calc(var(--tabh) + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr 1.4fr;gap:10px;margin:14px -16px 0;padding:14px 16px 10px;background:linear-gradient(rgba(0,0,0,0),var(--bg) 22%)}
.holenav .btn.ghost{background:var(--surface)}
.dots{display:flex;gap:4px;overflow-x:auto;padding:4px 0 10px;scrollbar-width:none}
.dots button{flex:none;width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--surface);font:700 .8rem/1 var(--label)}
.dots button.done{background:var(--chip)}
.dots button.cur{background:var(--navy);color:#f3ead8;border-color:var(--navy)}

/* live */
.live td,.live th{padding:10px 8px;border-top:1px solid var(--line);text-align:right}
.live th{font:600 .72rem/1 var(--label);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-top:0}
.live td:nth-child(2),.live th:nth-child(2){text-align:left}
.rel{font-weight:700}
.rel.under{color:#2f7a45}
.rel.over{color:var(--accent)}
.pulse{display:inline-block;width:9px;height:9px;border-radius:50%;background:#2fbf55;margin-right:6px;animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(47,191,85,.6)}70%{box-shadow:0 0 0 9px rgba(47,191,85,0)}100%{box-shadow:0 0 0 0 rgba(47,191,85,0)}}

/* ace celebration */
.celebrate{position:fixed;inset:0;z-index:60;display:grid;place-items:center;background:rgba(11,20,40,.88);color:#fff;text-align:center;padding:24px}
.celebrate h2{font-size:3rem;color:#d4a64a}
.celebrate p{font-size:1.1rem;max-width:30ch;margin:10px auto 20px}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:61}

/* reused site modules (tee times, loaners, form check) */
.band{padding:0}
.wrap{padding:0}
.head{margin:0 0 10px}
.head h2{font-size:1.45rem}
#teetimes .tt-form,#loaners .lb-bar{gap:10px}
#loaners .lb-steps{margin:12px 0}
#formcheck .fc-box{padding:0;border:0;background:none}

.install{display:flex;gap:12px;align-items:center}
.install img{width:52px;height:52px;border-radius:12px;flex:none}
.empty{padding:22px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:var(--r)}
.toast{position:fixed;left:50%;bottom:calc(var(--tabh) + env(safe-area-inset-bottom) + 16px);transform:translateX(-50%);z-index:70;background:var(--navy);color:#f3ead8;padding:10px 16px;border-radius:99px;font:600 .95rem/1.2 var(--body);box-shadow:0 6px 20px rgba(0,0,0,.25);max-width:90vw}
.news{display:flex;gap:12px;align-items:flex-start}
.news img{width:76px;height:76px;object-fit:cover;border-radius:10px;flex:none}
.news b{display:block;line-height:1.2}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0}
.kv dt{font:600 .78rem/1.5 var(--label);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.kv dd{margin:0}
@media (prefers-color-scheme:dark){.btn.navy{background:var(--accent);color:#fff}}
@keyframes bob{from{transform:translate(-50%,0)}to{transform:translate(-50%,10px)}}

/* v3 additions */
.alertbar{padding:12px 14px;border-radius:12px;background:#d4a64a;color:#2b1d05;font:700 .95rem/1.25 var(--label);letter-spacing:.06em;text-transform:uppercase;margin:0 0 14px}
.cond{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);margin:0 0 14px;text-decoration:none;color:var(--fg)}
.cond .grow{flex:1;min-width:0}.cond .grow b{display:block}.cond .grow span{display:block;font-size:.86rem;color:var(--muted)}
.cond .dot{width:12px;height:12px;border-radius:50%;background:#2fbf55;flex:none}
.cond.warn .dot{background:#d4a64a}.cond.bad .dot{background:var(--accent)}
.cond .chev{color:var(--muted)}
.closedbar{padding:10px 12px;border-radius:12px;background:var(--accent);color:#fff;font:700 .9rem/1.2 var(--label);letter-spacing:.06em;text-transform:uppercase;margin:0 0 12px}
.sponsor{margin:-4px 0 12px;font-size:.88rem;color:var(--muted)}
.sponsor a,.sponsor b{color:var(--gold-ink);font-weight:700}
.holeacts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.holeacts .btn{min-height:40px;font-size:.85rem;padding:8px 10px}
.payrow .btn{min-height:40px;padding:8px 14px;white-space:nowrap}
.tog{display:flex;align-items:center;gap:12px;padding:12px;border:1.5px solid var(--line);border-radius:12px;margin:8px 0 0;cursor:pointer}
.tog input{width:22px;height:22px;accent-color:var(--accent);flex:none}
.tog .grow{flex:1;min-width:0}.tog .grow b{display:block}.tog .grow span{font-size:.86rem;color:var(--muted)}
.okline{margin:8px 0 0;font:700 1rem/1.3 var(--label);letter-spacing:.06em;text-transform:uppercase;color:#2f7a45}
.outline{margin:8px 0 10px;font:700 1rem/1.3 var(--label);letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.paid{font:700 .78rem/1 var(--label);letter-spacing:.08em;text-transform:uppercase;color:#2f7a45}
.field{display:grid;gap:5px;margin:0 0 12px}
.field label{font:600 .74rem/1.1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea,.simloan select{width:100%;min-height:46px;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hp{position:absolute;left:-9999px;width:1px;height:1px}
#lf-prev{margin-top:10px;max-height:220px;border-radius:12px;object-fit:cover}
.lfitem{display:flex;gap:12px;align-items:flex-start;padding:10px}
.lfitem img{width:84px;height:84px;object-fit:cover;border-radius:10px;flex:none}
.memcard{position:relative;border-radius:20px;padding:22px;margin:0 0 14px;color:#f3ead8;background:linear-gradient(135deg,#13254a 0%,#1e3a6e 55%,#2c4a2f 130%);box-shadow:0 12px 30px rgba(10,20,40,.3);overflow:hidden}
.memcard::after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;border:24px solid rgba(212,166,74,.18)}
.memcard .label{color:#e9dcb8}
.mc-top{display:flex;gap:12px;align-items:center}
.mc-top img{width:56px;height:56px}
.mc-kind{margin:2px 0 0;font:1.1rem/1 var(--display);color:#d4a64a}
.mc-name{font:2rem/1.05 var(--display);margin:22px 0 2px;color:#fff}
.mc-status{margin:0 0 16px;color:#e9dcb8}
.mc-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mc-grid b{display:block;font:700 1.2rem/1.2 var(--label);letter-spacing:.04em}
.mc-badge{margin:16px 0 0;font:700 .85rem/1 var(--label);letter-spacing:.12em;text-transform:uppercase;color:#7fe39a}
.memcard.lapsed .mc-badge{color:#ff9a9a}
.rec{border:1.5px solid var(--accent)}
.rec .btn{cursor:pointer}
.simloan{margin-bottom:14px}
#flightsim .fs{margin-top:0}
.borrow,.scanhint{display:flex;gap:12px;align-items:center}
.borrow .grow,.scanhint .grow{flex:1;min-width:0}.borrow .grow b,.scanhint .grow b{display:block}.borrow .grow span,.scanhint .grow span{font-size:.86rem;color:var(--muted)}
.myloan{display:flex;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.myloan:first-of-type{border-top:0}
.myloan img{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none}
.myloan .grow{flex:1;min-width:0}.myloan .grow b{display:block}.myloan .grow span{font-size:.86rem;color:var(--muted)}
.myloan .btn{min-height:38px}
.discv{text-align:center}
.discv img{width:min(260px,70vw);aspect-ratio:1;object-fit:cover;border-radius:50%;margin:4px auto 12px;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.discv h2{font-size:2rem;margin:4px 0}
.fl4{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.fl4 div{border:1px solid var(--line);border-radius:10px;padding:8px 0}
.fl4 b{display:block;font:700 1.4rem/1 var(--label)}
.fl4 span{font:600 .66rem/1 var(--label);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.linkbtn{display:block;margin:10px auto 0;background:none;border:0;color:var(--muted);text-decoration:underline;font-size:.9rem}
.actions .act:nth-child(n){min-height:100%}
#flightsim .fs-two{grid-template-columns:minmax(0,1fr)}
#flightsim select{width:100%;max-width:100%;min-height:44px}
#flightsim,#sim-loan{scroll-margin-top:70px}
#flightsim .fs-plot{min-height:420px}
.holeacts .btn{font-size:.78rem;letter-spacing:.05em}

/* Order of the Bogey Knights */
.bk-hero{background:linear-gradient(160deg,#2b2320,#1a1614 70%);color:#f3ead8;border:0}
.bk-hero .label{color:#d9a679}
.bk-hero h2{font-family:var(--display);font-weight:400;font-size:1.45rem;line-height:1.1;margin:6px 0 12px;color:#fff}
.bk-st{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.bk-st div{background:rgb(255 255 255 / .07);border-radius:10px;padding:10px;text-align:center}
.bk-st b{display:block;font:1.5rem/1 var(--display);color:#e0a36d}
.bk-st span{font:700 .7rem/1.2 var(--label);letter-spacing:.12em;text-transform:uppercase;color:#cdbfa8}
.bk-fd{border-left:4px solid #a6542a}
.bk-fd .label{color:#a6542a}
.bk-fd b{font-family:var(--display);font-weight:400;font-size:1.2rem}
.bk-go{background:#a6542a;border-color:#a6542a;color:#fff}
