*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --primary:#0077B6;--secondary:#90E0EF;--accent:#FFB703;--bg:#F0F9FF;--bg-card:#fff;
  --text:#023047;--text-secondary:#5C7A8A;--border:rgba(0,0,0,.08);
  --nav-h:56px;--header-h:52px;--contact-footer-h:72px;--radius:16px;--font-scale:1;
  --heat-0:#EBEDF0;--heat-1:#C6E48B;--heat-2:#7BC96F;--heat-3:#239A3B;--heat-4:#196127;
}
html{font-size:16px}
body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Helvetica Neue',sans-serif;background:var(--bg);color:var(--text);font-size:calc(1rem * var(--font-scale));line-height:1.5;min-height:100dvh;-webkit-tap-highlight-color:transparent}
body.has-contact-footer.has-bottom-nav{padding-bottom:calc(var(--contact-footer-h) + var(--nav-h) + env(safe-area-inset-bottom))}
#app-main{padding:calc(var(--header-h) + 16px) 16px calc(var(--nav-h) + 16px);max-width:720px;margin:0 auto;min-height:50vh}
.page-title{font-size:1.35rem;font-weight:800;margin-bottom:6px}
.card{background:var(--bg-card);border-radius:var(--radius);padding:16px;margin-bottom:12px;box-shadow:0 4px 16px var(--border)}
.muted{color:var(--text-secondary);font-size:.875em}
.empty-hint{text-align:center;padding:24px 12px}
.btn{border:none;border-radius:999px;padding:.65rem 1.2rem;cursor:pointer;font-size:.9rem;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:600;min-height:44px}
.btn-primary{background:var(--primary);color:#fff}
.btn-secondary{background:var(--bg-card);color:var(--primary);border:2px solid var(--secondary)}
.btn-sm{min-height:36px;padding:.4rem .8rem;font-size:.8rem}
.btn:disabled{opacity:.5;cursor:not-allowed}
.chip{border:2px solid var(--secondary);background:var(--bg-card);border-radius:999px;padding:8px 14px;font-size:.8rem;cursor:pointer;margin:4px;display:inline-flex;align-items:center;gap:4px}
.chip:hover,.chip.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.form-stack{display:flex;flex-direction:column;gap:10px}
.form-stack input,.form-stack select{padding:12px;border:2px solid var(--border);border-radius:12px;font-size:1rem}
.btn-row{display:flex;gap:8px;margin-top:8px}
.fade-in{animation:fadeIn .4s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.reduce-motion *{animation:none!important;transition:none!important}
