:root{
  --navy:#16223f; --navy-2:#1f3158; --gold:#f0a63c; --gold-dim:rgba(240,166,60,.16);
  --paper:#faf6ec; --card:#ffffff; --line:#e8e0cf;
  --text-hi:#1c2333; --text-mid:#5c6479; --text-low:#9298a6;
}
*{box-sizing:border-box; margin:0; padding:0;}
html,body{height:100%;}
body{
  background:var(--paper); color:var(--text-hi);
  font-family:-apple-system,BlinkMacSystemFont,'Inter',sans-serif;
  min-height:100vh; -webkit-font-smoothing:antialiased;
}
.page-wrap{max-width:900px; margin:0 auto; padding:0 18px 40px;}

header.site-header{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:22px 0 18px; flex-wrap:wrap;
}
.logo{display:flex; align-items:center; gap:12px;}
.logo-mark{
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(155deg, var(--navy-2), var(--navy));
  display:flex; align-items:center; justify-content:center; font-size:20px;
  box-shadow:0 6px 16px rgba(22,34,63,.25); flex-shrink:0;
}
.logo-text{line-height:1.15;}
.logo-title{font-family:Georgia,'Times New Roman',serif; font-weight:700; font-size:21px; color:var(--navy);}
.logo-tag{font-size:11.5px; color:var(--text-mid); font-style:italic; margin-top:2px;}

.header-actions{display:flex; align-items:center; gap:8px; flex-shrink:0;}
.install-btn{
  display:none; align-items:center; gap:6px;
  font-weight:600; font-size:12.5px; padding:9px 14px; border-radius:20px; cursor:pointer;
  background:var(--navy); color:#fff; border:none; box-shadow:0 4px 12px rgba(22,34,63,.25);
  transition:all .15s;
}
.install-btn:hover{background:var(--navy-2); transform:translateY(-1px);}
.install-btn.show{display:flex;}
.info-btn{
  width:34px; height:34px; border-radius:50%; border:1.5px solid var(--line); cursor:pointer;
  background:var(--card); color:var(--text-mid); font-size:14px; font-weight:700;
  display:flex; align-items:center; justify-content:center; transition:all .15s; flex-shrink:0;
  font-family:Georgia,serif;
}
.info-btn:hover{border-color:var(--gold); color:var(--gold);}

.modal-backdrop{
  position:fixed; inset:0; background:rgba(22,34,63,.55); backdrop-filter:blur(3px);
  display:none; align-items:center; justify-content:center; z-index:200; padding:20px;
}
.modal-backdrop.show{display:flex;}
.modal-box{
  background:var(--card); border-radius:20px; padding:28px; max-width:360px; width:100%;
  box-shadow:0 30px 60px rgba(0,0,0,.3);
}
.modal-box h3{font-family:Georgia,serif; font-size:19px; margin-bottom:12px; color:var(--navy); text-align:center;}
.modal-box p{font-size:13.5px; color:var(--text-mid); line-height:1.6;}
.modal-close-btn{
  margin-top:18px; width:100%; font-weight:600; font-size:13px; padding:10px; border-radius:20px;
  background:var(--navy); color:#fff; border:none; cursor:pointer;
}
.im-icon{font-size:32px; text-align:center; margin-bottom:6px;}

.info-list{margin-top:10px; display:flex; flex-direction:column;}
.info-row{display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-bottom:1px solid var(--line); font-size:12.5px;}
.info-row:last-child{border-bottom:none;}
.info-row .k{color:var(--text-mid); font-weight:600; flex-shrink:0;}
.info-row .v{color:var(--text-hi); text-align:right;}
.info-row .v a{color:var(--gold); text-decoration:none;}

footer.site-footer{text-align:center; margin-top:30px; color:var(--text-low); font-size:11.5px;}
footer.site-footer a{color:var(--text-mid);}
