#island-date-chip { z-index:10; right:calc(min(58px, 16%) + min(88px, 24%) + 8px); left:auto; width:44px; justify-content:center; touch-action:manipulation; }
#island-date-chip img { width:66.6667%; }
#island-date-chip:focus-visible { outline:2px solid #d5b879; outline-offset:2px; border-radius:12px; }
#island-date-chip:disabled { cursor:wait; }
#island-date-chip .island-date-badge { position:absolute; top:16px; right:5px; width:9px; height:9px; border:2px solid #fff0cd; border-radius:50%; background:#cc655a; }
#island-date-chip[hidden], #island-date-panel[hidden] { display:none; }
#island-date-panel { position:fixed; inset:0; z-index:160; overflow-y:auto; overscroll-behavior:contain; background:#122824d9; padding:calc(24px + env(safe-area-inset-top)) 16px calc(30px + env(safe-area-inset-bottom)); }
.is-date-open { overflow:hidden; }
.date-paper { max-width:620px; margin:auto; padding:24px; background:#fff8e9; color:#314c46; border:1px solid #d6b878; border-radius:18px; line-height:1.8; }
.date-paper header { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.date-paper h2 { font-size:25px; margin:16px 0 6px; }
.date-paper h3 { margin-bottom:8px; }
.date-paper p, .date-paper blockquote { white-space:pre-wrap; overflow-wrap:anywhere; }
.date-paper button { font:inherit; padding:10px 14px; border:1px solid #9ab1a2; border-radius:10px; background:#f0eadb; color:#244c3e; cursor:pointer; }
.date-paper button:disabled { opacity:.5; cursor:wait; }
.date-paper summary { cursor:pointer; padding:12px 0; }
.date-response { display:grid; gap:10px; }
.date-response button:first-child { color:#fff8e9; background:#315c4e; }
.date-receipt { font-size:13px; color:#64776a; }
.date-wait { padding:12px; background:#e4edde; border-radius:10px; }
.date-error { padding:12px; border-left:3px solid #a86742; background:#faeadd; color:#78472e; }
.date-narrator { display:block; margin-top:12px; letter-spacing:.06em; color:#657e6b; }
.date-chapter { border-top:1px solid #dfd2b3; padding-top:8px; }
.date-options { list-style:none; padding:0; }
.date-options li { padding:12px 0; border-bottom:1px solid #dfd2b3; }
.date-options small { display:block; color:#64776a; }
.date-archive button { display:block; width:100%; margin:8px 0; text-align:left; }
@media (max-width:420px) { .date-paper { padding:18px; } }


.island-float-chip.is-heart {
  --chip-accent: #c45c7a;
  z-index: 10;
  top: env(safe-area-inset-top, 0px);
  /* 总览不显示背包：贴在贝壳音乐钮左边，避免漂到地图正中。 */
  right: calc(min(46px, 13%) + 8px);
  left: auto;
  width: 52px;
  height: 66px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  line-height: 1.15;
  color: #5a3340;
  background: rgba(255, 244, 236, .92);
  border-radius: 14px;
  box-shadow:
    inset 0 0 0 1px rgba(196, 92, 122, .28),
    0 2px 8px rgba(42, 58, 60, .14);
  touch-action: manipulation;
}
.island-root:has(#island-bag-chip:not([hidden])) .island-float-chip.is-heart {
  right: calc(min(58px, 16%) + min(88px, 24%) + 8px);
}
.island-root:has(#island-bag-chip:not([hidden])):has(#island-date-chip:not([hidden])) .island-float-chip.is-heart {
  right: calc(min(58px, 16%) + min(88px, 24%) + 8px + 52px);
}
.island-float-chip.is-heart[hidden],
#island-heart-panel[hidden] {
  display: none !important;
}
.island-float-chip-emoji {
  font-size: 18px;
  line-height: 1;
}
.island-float-chip-label {
  font-size: 10px;
  letter-spacing: .08em;
  line-height: 1.2;
}
.island-float-chip-badge {
  position: absolute;
  top: 6px;
  right: 4px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #cc655a;
  color: #fff8e9;
  font-size: 10px;
  line-height: 16px;
  font-weight: 700;
  text-align: center;
}
#island-heart-panel {
  position: fixed;
  inset: 0;
  z-index: 160;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: #122824d9;
  padding: calc(24px + env(safe-area-inset-top)) 16px calc(30px + env(safe-area-inset-bottom));
}
#island-heart-panel .island-date-panel-inner {
  max-width: 520px;
  margin: auto;
  padding: 22px;
  background: #fff8e9;
  color: #314c46;
  border: 1px solid #d6b878;
  border-radius: 18px;
  line-height: 1.7;
}
#island-heart-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
#island-heart-panel h2 { margin: 0; font-size: 22px; }
#island-heart-panel button {
  font: inherit;
  padding: 8px 12px;
  border: 1px solid #9ab1a2;
  border-radius: 10px;
  background: #f0eadb;
  color: #244c3e;
  cursor: pointer;
}
.island-heart-list { display: grid; gap: 12px; margin: 14px 0; }
.island-heart-list article {
  padding: 12px 0;
  border-top: 1px solid #dfd2b3;
}
.island-heart-list article:first-child { border-top: 0; padding-top: 0; }
.island-heart-list span { display: block; color: #64776a; font-size: 12px; }