#hprofile, #hprofile *{box-sizing:border-box}
#hprofile{
  --surface-1:#f3f8f7; --surface-2:#fff; --border:#dfe8e6; --border-strong:#bcd0cc;
  --text-primary:#1a1a1a; --text-secondary:#3d4445; --text-muted:#7c8886; --accent:#48bca2; --accent-dark:#35a08a;
  font-family:'Open Sans',sans-serif; font-weight:400; color:var(--text-primary); background:var(--surface-1);
  max-width:900px; width:100%; margin:24px auto; border:1px solid var(--border); border-radius:10px; overflow:hidden;
}
#hprofile .hp-wrap{padding:20px}
#hprofile .hp-header{background:var(--surface-2);padding:20px 22px;border-bottom:1px solid var(--border)}
#hprofile .hp-eyebrow{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-dark);font-weight:700;margin-bottom:8px;font-family:'Outfit',sans-serif}
#hprofile .hp-htitle{font-size:22px;font-weight:700;color:var(--text-primary);margin:0 0 14px;font-family:'Outfit',sans-serif}
#hprofile .hp-three-q{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
#hprofile .hp-q{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:8px;background:var(--surface-1);border:1px solid var(--border)}
#hprofile .hp-q--primary{background:#eafaf6;border:1px solid var(--accent);border-left:3px solid var(--accent)}
#hprofile .hp-q-icon{font-size:20px;flex-shrink:0;margin-top:1px}
#hprofile .hp-q-title{font-size:18px;font-weight:700;color:var(--text-primary);margin:0 0 3px;line-height:1.3;font-family:'Outfit',sans-serif}
#hprofile .hp-q-sub{font-size:14px;color:var(--text-muted);margin:0;line-height:1.4}
#hprofile .hp-cta-hint{font-size:13px;color:var(--text-secondary);margin:0 0 10px;font-style:italic}
#hprofile .hp-seo-summary{font-size:16px;color:var(--text-secondary);margin:0;line-height:1.55}
#hprofile .hp-seo-summary strong{color:var(--text-primary)}
#hprofile .hp-seo-example{font-size:16px;color:var(--text-secondary);margin:10px 0 0;padding:10px 12px;background:var(--surface-1);border-radius:6px;border-left:3px solid var(--accent);line-height:1.5}
#hprofile .hp-seo-example strong{color:var(--text-primary)}
#hprofile select,#hprofile input[type=range]{font-family:'Open Sans',sans-serif}
#hprofile .hp-label{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-secondary);margin-bottom:5px}
#hprofile .hp-card{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:16px 18px;margin-bottom:12px}
#hprofile .hp-card-accent{border-left:3px solid var(--accent)}
#hprofile .hp-card-dark{background:var(--surface-1)}
#hprofile .hp-row{display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap}
#hprofile .hp-col{flex:1;min-width:120px}
#hprofile .hp-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin-bottom:12px}
#hprofile .hp-stat{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:12px 12px;text-align:center}
#hprofile .hp-stat-val{font-size:28px;font-weight:800;color:var(--text-primary);line-height:1;font-family:'Outfit',sans-serif}
#hprofile .hp-stat-unit{font-size:14px;color:var(--text-secondary);margin-top:1px}
#hprofile .hp-stat-lbl{font-size:13px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-top:4px}
#hprofile .hp-hiker-btns{display:flex;gap:6px;flex-wrap:wrap}
#hprofile .hp-hk-btn{border:1px solid var(--border);border-radius:5px;padding:7px 13px;font-size:13px;font-weight:700;cursor:pointer;background:var(--surface-2);color:var(--text-secondary);font-family:'Open Sans',sans-serif;transition:all .12s;text-transform:uppercase;letter-spacing:.04em}
#hprofile .hp-hk-btn.on{border-color:var(--accent);background:var(--accent);color:#fff}
#hprofile .hp-bar-wrap{height:18px;background:var(--surface-1);border:1px solid var(--border);border-radius:5px;display:flex;overflow:hidden;margin:4px 0 10px}
#hprofile .hp-bar-seg{height:100%;transition:width .4s ease}
#hprofile .hp-legend{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
#hprofile .hp-leg-item{display:flex;align-items:center;gap:5px;font-size:14px;color:var(--text-secondary)}
#hprofile .hp-leg-dot{width:10px;height:10px;flex-shrink:0;border-radius:3px}
#hprofile .hp-food-row{display:flex;align-items:center;justify-content:space-between;padding:5px 0;border-bottom:.5px solid var(--border);font-size:15px}
#hprofile .hp-food-row:last-child{border-bottom:none}
#hprofile .hp-food-bar{height:4px;background:var(--surface-1);border-radius:3px;overflow:hidden;margin-top:3px}
#hprofile .hp-food-fill{height:100%;background:var(--accent);border-radius:3px;transition:width .4s}
#hprofile input[type=range]{width:100%;accent-color:var(--accent)}
#hprofile .hp-range-row{display:flex;align-items:center;gap:10px}
#hprofile .hp-range-val{font-size:16px;font-weight:700;min-width:44px;text-align:right;color:var(--accent-dark)}
#hprofile .hp-gradient-info{font-size:12px;color:var(--text-muted);margin-top:6px;line-height:1.5}
#hprofile .hp-gpx-note{font-size:12px;color:var(--text-muted);margin-top:10px;line-height:1.5;border-top:1px solid var(--border);padding-top:10px}
#hprofile .hp-footer{border-top:1px solid var(--border);padding:14px 22px;font-size:12px;color:var(--text-muted);background:var(--surface-2);line-height:1.6}