@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Source+Serif+4:opsz,wght@8..60,400;8..60,500;8..60,600&display=swap');

#inr-app{
  --paper:#F1ECE0; --paper-dim:#E7E0CE; --ink:#242821; --ink-soft:#5B5A4E;
  --bib:#C8442E; --bib-dark:#A5341F; --trail:#3F6B4F; --gold:#AD8A2E;
  --line:#C9C2A8; --white:#FBF9F2;
  max-width:720px; margin:0 auto; padding:20px 16px 40px;
  background:var(--paper); color:var(--ink);
  font-family:'Source Serif 4', Georgia, serif; line-height:1.5;
}
#inr-app *{box-sizing:border-box;}
#inr-app h1,#inr-app h2,#inr-app h3,#inr-app button,#inr-app .tab,#inr-app .stub-label{
  font-family:'Oswald','Arial Narrow',sans-serif;
}
#inr-app .hero{border-bottom:3px solid var(--ink); padding-bottom:14px; margin-bottom:22px; display:flex; align-items:flex-end; justify-content:space-between; gap:12px;}
#inr-app .hero h1{font-size:30px; font-weight:700; margin:0; line-height:0.95;}
#inr-app .hero-mark{font-weight:700; font-size:12px; color:var(--bib); border:2px solid var(--bib); padding:4px 9px; white-space:nowrap;}
#inr-app .bib-card{background:var(--white); border:2px solid var(--ink); padding:24px 22px 20px; position:relative; box-shadow:5px 5px 0 var(--paper-dim);}
#inr-app .bib-card::before{content:""; position:absolute; left:-1px; right:-1px; top:52px; border-top:2px dashed var(--line);}
#inr-app .stub-label{font-size:12px; letter-spacing:0.08em; color:var(--ink-soft); margin-bottom:12px;}
#inr-app label{display:block; font-family:'Oswald',sans-serif; font-size:12.5px; color:var(--ink-soft); margin:12px 0 5px;}
#inr-app input, #inr-app select, #inr-app textarea{
  width:100%; padding:10px 11px; border:1.5px solid var(--line); background:var(--paper);
  color:var(--ink); font-family:'Source Serif 4',serif; font-size:15px; border-radius:2px;
}
#inr-app input:focus, #inr-app select:focus{outline:2px solid var(--trail); outline-offset:1px; border-color:var(--trail);}
#inr-app button{cursor:pointer; border:none; border-radius:2px; font-size:15px; font-weight:600; padding:11px 16px;}
#inr-app .btn-primary{background:var(--bib); color:var(--white);}
#inr-app .btn-primary:hover{background:var(--bib-dark);}
#inr-app .btn-small{padding:7px 12px; font-size:13px;}
#inr-app .btn-full{width:100%; margin-top:16px;}
#inr-app .err{color:var(--bib-dark); font-size:13.5px; margin-top:9px;}
#inr-app .link-btn{background:none; border:none; color:var(--trail); text-decoration:underline; padding:0; font-family:'Source Serif 4',serif; font-size:14px;}
#inr-app .topbar{display:flex; justify-content:space-between; align-items:center; border-bottom:2px solid var(--ink); padding-bottom:10px; margin-bottom:20px;}
#inr-app .runner-id{font-family:'Oswald',sans-serif; font-size:13px;}
#inr-app .runner-id b{color:var(--bib); font-size:18px;}
#inr-app .signout{font-size:12px; color:var(--ink-soft); background:none; border:none; text-decoration:underline; font-family:'Source Serif 4',serif;}
#inr-app .tabs{display:flex; margin-bottom:20px; border-bottom:1.5px solid var(--line);}
#inr-app .tab{background:none; border:none; padding:9px 4px; margin-right:24px; font-size:14px; color:var(--ink-soft); border-bottom:3px solid transparent;}
#inr-app .tab.active{color:var(--ink); border-bottom-color:var(--bib);}
#inr-app .event-card{background:var(--white); border:1.5px solid var(--ink); padding:15px 17px; border-radius:2px;}
#inr-app .event-card h3{margin:0 0 4px; font-size:19px;}
#inr-app .event-meta{font-size:13px; color:var(--ink-soft); margin-bottom:9px;}
#inr-app .progress-track{background:var(--paper-dim); height:13px; border-radius:7px; overflow:hidden; border:1px solid var(--line);}
#inr-app .progress-fill{background:var(--trail); height:100%; transition:width .4s ease;}
#inr-app .progress-num{font-family:'Oswald',sans-serif; font-size:12.5px; margin-top:6px; color:var(--ink-soft);}
#inr-app .ledger-row{display:flex; align-items:center; gap:11px; padding:10px 0; border-bottom:1px solid var(--line);}
#inr-app .ledger-row .date{width:74px; font-family:'Oswald',sans-serif; font-size:12.5px; color:var(--ink-soft); flex-shrink:0;}
#inr-app .ledger-row .dist{font-family:'Oswald',sans-serif; font-weight:600; font-size:16px; width:66px; flex-shrink:0;}
#inr-app .ledger-row .note{flex:1; font-size:13.5px; color:var(--ink-soft); font-style:italic; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#inr-app .ledger-row .del{background:none; border:none; color:var(--ink-soft); font-size:12px; text-decoration:underline;}
#inr-app .empty-note{color:var(--ink-soft); font-style:italic; padding:13px 0; font-size:14px;}
#inr-app .lb-row{display:flex; align-items:center; gap:13px; padding:11px 0; border-bottom:1px solid var(--line);}
#inr-app .lb-rank{font-family:'Oswald',sans-serif; font-weight:700; font-size:19px; width:28px; color:var(--ink-soft);}
#inr-app .lb-row.top1 .lb-rank{color:var(--gold);}
#inr-app .lb-row.top2 .lb-rank{color:#8B8B8B;}
#inr-app .lb-row.top3 .lb-rank{color:#A9662E;}
#inr-app .lb-name{flex:1; font-family:'Oswald',sans-serif; font-size:15px;}
#inr-app .lb-dist{font-family:'Oswald',sans-serif; font-weight:600; font-size:15px; color:var(--trail);}
#inr-app .section-title{font-size:12.5px; letter-spacing:0.06em; color:var(--ink-soft); margin:0 0 11px; font-family:'Oswald',sans-serif;}
#inr-app .card{background:var(--white); border:1.5px solid var(--ink); padding:17px 17px 19px; border-radius:2px; margin-bottom:18px;}
#inr-app .muted-box{background:var(--paper-dim); border:1px dashed var(--line); padding:13px 15px; font-size:13px; color:var(--ink-soft); border-radius:2px; margin-top:16px;}
#inr-app .loading{color:var(--ink-soft); font-style:italic; padding:26px 0; text-align:center;}
#inr-app .reset-link{font-size:12px; color:var(--ink-soft); margin-top:26px; text-align:center;}
#inr-app .reset-link button{background:none; border:none; text-decoration:underline; color:var(--ink-soft); font-family:'Source Serif 4',serif; font-size:12px;}
#inr-app .btn-ghost{background:transparent; color:var(--ink); border:1.5px solid var(--ink);}
#inr-app .btn-ghost:hover{background:var(--ink); color:var(--white);}
#inr-app .strava-panel{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px;}
#inr-app .strava-status{font-family:'Oswald',sans-serif; font-size:13px; color:var(--trail); border:1.5px solid var(--trail); padding:6px 10px; border-radius:2px;}
#inr-app .strava-hint{font-size:12.5px; color:var(--ink-soft); font-style:italic;}
#inr-app .strava-msg{font-size:13px; color:var(--trail); margin:-6px 0 14px;}

#inr-app .milestone-row{display:flex; gap:14px; padding:16px 0; border-bottom:1px solid var(--line); align-items:flex-start;}
#inr-app .milestone-marker{font-family:'Oswald',sans-serif; font-weight:700; font-size:20px; width:52px; flex-shrink:0; color:var(--ink-soft); line-height:1;}
#inr-app .milestone-row.unlocked .milestone-marker{color:var(--bib);}
#inr-app .milestone-marker span{display:block; font-size:11px; font-weight:400; color:var(--ink-soft);}
#inr-app .milestone-media{width:96px; height:72px; flex-shrink:0; border-radius:2px; overflow:hidden; background:var(--paper-dim); border:1px solid var(--line); display:flex; align-items:center; justify-content:center;}
#inr-app .milestone-photo{width:100%; height:100%; object-fit:cover; display:block;}
#inr-app .milestone-locked{font-family:'Oswald',sans-serif; font-size:12px; color:var(--ink-soft);}
#inr-app .milestone-text h4{margin:0 0 4px; font-size:15.5px; font-family:'Oswald',sans-serif; font-weight:600;}
#inr-app .milestone-text p{margin:0; font-size:13.5px; color:var(--ink-soft);}
#inr-app .milestone-text .locked-copy{font-style:italic;}

#inr-app .milestone-card{background:var(--white); border:1.5px solid var(--ink); border-radius:2px; overflow:hidden; margin-bottom:22px; box-shadow:4px 4px 0 var(--paper-dim);}
#inr-app .milestone-photo-wrap{position:relative; width:100%; height:240px; background:#1c1f1a;}
#inr-app .milestone-card .milestone-photo{width:100%; height:100%; object-fit:cover; display:block;}
#inr-app .milestone-locked-photo{
  width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.03) 0 2px, transparent 2px 14px),
    linear-gradient(180deg, #2a2d24, #14150f);
  color:#cfc9b4; font-family:'Oswald',sans-serif; font-size:13px; letter-spacing:0.04em;
}
#inr-app .milestone-lock{font-size:26px; opacity:0.85;}
#inr-app .milestone-badge{
  position:absolute; top:12px; left:12px; background:var(--bib); color:var(--white);
  font-family:'Oswald',sans-serif; font-weight:700; font-size:13px; letter-spacing:0.02em;
  padding:6px 12px; border-radius:2px; box-shadow:2px 2px 0 rgba(0,0,0,0.25);
}
#inr-app .milestone-card.locked .milestone-badge{background:#4a4c40;}
#inr-app .milestone-body{padding:16px 18px 18px;}
#inr-app .milestone-body h4{margin:0 0 6px; font-size:19px; font-family:'Oswald',sans-serif; font-weight:600; color:var(--ink);}
#inr-app .milestone-body p{margin:0; font-size:14px; line-height:1.55; color:var(--ink-soft);}
#inr-app .milestone-body .locked-copy{font-style:italic;}

#inr-app .join-banner{background:var(--white); border:1.5px dashed var(--bib); border-radius:2px; padding:14px 16px; margin-bottom:18px;}
#inr-app .join-banner p{margin:0 0 10px; font-size:14px; color:var(--ink);}
#inr-app .join-dismiss{background:none; border:none; text-decoration:underline; color:var(--ink-soft); font-size:12px; font-family:'Source Serif 4',serif; padding:0; margin-top:10px;}
#inr-app .finish-share{margin-top:14px; padding-top:14px; border-top:1px dashed var(--line);}
#inr-app .finish-line{margin:0 0 10px; font-family:'Oswald',sans-serif; font-weight:600; font-size:15px; color:var(--trail);}
#inr-app .share-row{display:flex; flex-wrap:wrap; gap:8px;}
#inr-app .share-row .share-btn, #inr-app .share-row .copy-btn{
  font-family:'Oswald',sans-serif; font-size:12.5px; font-weight:500; padding:8px 12px;
  background:var(--ink); color:var(--white); border:none; border-radius:2px; cursor:pointer;
}
#inr-app .share-row .share-link{
  font-family:'Oswald',sans-serif; font-size:12.5px; font-weight:500; padding:8px 12px;
  background:transparent; color:var(--ink); border:1.5px solid var(--ink); border-radius:2px;
  text-decoration:none; display:inline-block;
}
#inr-app .share-row .share-link:hover{background:var(--ink); color:var(--white);}
#inr-app .share-row .copy-btn{background:transparent; color:var(--ink); border:1.5px solid var(--ink);}
#inr-app .share-row .copy-btn:hover{background:var(--ink); color:var(--white);}

#inr-app .powered-by{font-family:'Source Serif 4',serif; font-style:italic; font-size:11.5px; color:var(--ink-soft); margin-top:4px;}
#inr-app .powered-by-strip{text-align:right; font-family:'Source Serif 4',serif; font-style:italic; font-size:11px; color:var(--ink-soft); padding:5px 2px 14px;}

#inr-app .race-org{font-family:'Oswald',sans-serif; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; opacity:0.85; margin-bottom:2px;}

#inr-app .race-banner{
  width:100%; height:180px; border-radius:2px; background-size:cover; background-position:center;
  position:relative; overflow:hidden; border:2px solid var(--ink); margin-bottom:0;
}
#inr-app .race-banner-overlay{
  position:absolute; inset:0; display:flex; align-items:flex-end; gap:12px; padding:16px;
  background:linear-gradient(180deg, rgba(20,21,15,0) 35%, rgba(15,16,11,0.82) 100%);
}
#inr-app .race-logo{
  width:52px; height:52px; border-radius:2px; object-fit:cover; border:2px solid var(--white);
  box-shadow:2px 2px 0 rgba(0,0,0,0.3); flex-shrink:0; background:var(--white);
}
#inr-app .race-banner-text{color:var(--white);}
#inr-app .race-banner-text .race-org{color:#e8e4d4;}
#inr-app .race-title{margin:0; font-size:24px; font-family:'Oswald',sans-serif; font-weight:600; color:var(--white); line-height:1.15; text-shadow:0 1px 3px rgba(0,0,0,0.4);}

#inr-app .hero .race-org{color:var(--ink-soft);}
#inr-app .hero .race-logo{width:36px; height:36px; margin-bottom:6px; border:1.5px solid var(--line);}