:root {
  --ink: #f6f0df;
  --muted: #b8c3b5;
  --deep: #06120d;
  --forest: #0a1d15;
  --panel: rgba(11, 28, 21, 0.86);
  --panel-strong: rgba(7, 20, 15, 0.96);
  --line: rgba(235, 224, 187, 0.18);
  --gold: #d7bc78;
  --gold-bright: #f1dda2;
  --copper: #b86f3d;
  --copper-dark: #6e3923;
  --water: #68b5a7;
  --danger: #ee9a8e;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.45);
  --radius: 28px;
  color-scheme: dark;
}

* { box-sizing: border-box; }

html, body { margin: 0; min-height: 100%; background: var(--deep); }
html { scroll-behavior: smooth; }
body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  overflow-x: hidden;
}
button, textarea { font: inherit; }
button { color: inherit; }
button:focus-visible, textarea:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: 3px; }
button:disabled { cursor: not-allowed; opacity: .52; }
[hidden] { display: none !important; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.app-shell {
  min-height: 100svh;
  position: relative;
  background: #06120d;
  isolation: isolate;
}

.ambient-noise {
  position: fixed;
  inset: 0;
  z-index: 30;
  pointer-events: none;
  opacity: .038;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
}

.topbar {
  position: fixed;
  z-index: 40;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: max(14px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) 12px max(18px, env(safe-area-inset-left));
  background: linear-gradient(to bottom, rgba(4, 14, 10, .94), rgba(4, 14, 10, .55), transparent);
}

.brand {
  border: 0;
  padding: 0;
  background: transparent;
  display: flex;
  gap: 10px;
  align-items: center;
  text-align: left;
  cursor: pointer;
}
.brand-mark {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(231, 213, 158, .34);
  border-radius: 50%;
  color: var(--gold-bright);
  font-size: 25px;
  box-shadow: inset 0 0 16px rgba(225, 199, 119, .11);
}
.brand strong {
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px;
  letter-spacing: .015em;
  font-weight: 600;
}
.brand small { display: none; color: var(--muted); font-size: 11px; margin-top: 2px; }
.top-actions { display: flex; align-items: center; gap: 8px; }

.icon-button, .chip-button {
  position: relative;
  min-height: 42px;
  border: 1px solid rgba(232, 219, 181, .2);
  background: rgba(9, 24, 18, .72);
  backdrop-filter: blur(14px);
  border-radius: 999px;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.icon-button:hover, .chip-button:hover { transform: translateY(-1px); background: rgba(18, 40, 30, .86); border-color: rgba(232, 219, 181, .34); }
.icon-button { padding: 0 13px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.icon-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.chip-button { padding: 4px 12px 4px 5px; display: inline-flex; align-items: center; gap: 7px; font-weight: 700; }
.mini-coin {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 27%, #e4a66c 0 8%, #bd7541 30%, #884a2c 72%, #5a2e1d 100%);
  border: 1px solid #d8965c;
  color: #4f2718;
  text-shadow: 0 1px rgba(255,255,255,.25);
  box-shadow: inset -4px -5px 9px rgba(58, 21, 9, .38), 0 4px 12px rgba(0,0,0,.22);
  font-family: Georgia, serif;
  font-size: 12px;
}
.desktop-label { display: none; }
.notification-dot { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #dcb570; top: 1px; right: 4px; box-shadow: 0 0 12px #dcb570; }

.experience, .sky-scene { min-height: 100svh; }
.sky-scene {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 84px 18px 36px;
  background:
    radial-gradient(circle at 73% 14%, rgba(224, 220, 170, .10), transparent 17%),
    linear-gradient(to bottom, #07150f 0%, #0a1f18 36%, #0c261d 64%, #07150f 100%);
}

.sky-scene::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at center 58%, transparent 0 22%, rgba(1, 8, 5, .52) 76%);
  z-index: 20;
}
.sky-scene > * { position: relative; z-index: 21; }

.moon {
  position: absolute;
  z-index: 2 !important;
  width: clamp(76px, 18vw, 128px);
  aspect-ratio: 1;
  right: 7vw;
  top: 9vh;
  border-radius: 50%;
  background: #e8dfbb;
  box-shadow: 0 0 30px rgba(223, 214, 167, .35), 0 0 90px rgba(203, 210, 165, .16);
  animation: moonBreath 7s ease-in-out infinite;
}
.moon::before, .moon::after, .moon span {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(119, 124, 101, .13);
}
.moon::before { width: 17%; height: 17%; left: 24%; top: 19%; }
.moon::after { width: 27%; height: 27%; right: 17%; bottom: 21%; }
.moon span { width: 11%; height: 11%; left: 31%; bottom: 20%; }
@keyframes moonBreath { 0%,100% { box-shadow: 0 0 30px rgba(223,214,167,.35),0 0 90px rgba(203,210,165,.16); } 50% { box-shadow: 0 0 42px rgba(223,214,167,.43),0 0 120px rgba(203,210,165,.22); } }

.cloud { position: absolute; z-index: 3 !important; height: 34px; border-radius: 50%; filter: blur(11px); background: rgba(154, 175, 157, .08); }
.cloud-one { width: 220px; top: 15vh; left: -250px; animation: driftCloud 36s linear infinite; }
.cloud-two { width: 160px; top: 27vh; left: -190px; opacity: .7; animation: driftCloud 48s linear 12s infinite; }
@keyframes driftCloud { to { transform: translateX(calc(100vw + 520px)); } }

.stars { position: absolute; inset: 0 0 42%; z-index: 1 !important; pointer-events: none; }
.star { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: rgba(245,236,199,.8); box-shadow: 0 0 5px rgba(245,236,199,.75); animation: twinkle var(--duration, 4s) ease-in-out infinite var(--delay, 0s); }
@keyframes twinkle { 0%,100% { opacity: .2; transform: scale(.65); } 50% { opacity: .95; transform: scale(1.35); } }

.distant-hills, .tree-line, .ground-glow { position: absolute; z-index: 4 !important; left: -5%; right: -5%; pointer-events: none; }
.distant-hills { bottom: 33%; height: 34%; opacity: .9; background: #0a1d17; clip-path: polygon(0 52%, 10% 35%, 22% 48%, 34% 27%, 49% 51%, 63% 22%, 76% 46%, 88% 29%, 100% 51%, 100% 100%, 0 100%); }
.tree-line { bottom: 24%; height: 25%; background: #06130f; clip-path: polygon(0 42%,3% 18%,6% 43%,9% 8%,12% 44%,16% 22%,19% 48%,23% 5%,27% 45%,31% 16%,35% 48%,39% 12%,42% 44%,47% 0,51% 46%,55% 19%,59% 49%,63% 9%,67% 43%,71% 16%,75% 48%,80% 4%,84% 45%,88% 15%,92% 44%,96% 6%,100% 40%,100% 100%,0 100%); }
.ground-glow { bottom: -12%; height: 47%; background: radial-gradient(ellipse at center top, rgba(77, 128, 92, .14), transparent 56%), #07140f; }

.intro-copy {
  width: min(620px, 100%);
  margin-top: 1vh;
  text-align: center;
  transition: opacity .4s ease, transform .4s ease;
}
.eyebrow { margin: 0 0 10px; text-transform: uppercase; letter-spacing: .18em; font-size: 10px; font-weight: 800; color: var(--gold); }
.intro-copy h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(37px, 10vw, 72px);
  line-height: .96;
  letter-spacing: -.035em;
  font-weight: 500;
  text-wrap: balance;
  text-shadow: 0 3px 28px rgba(0,0,0,.38);
}
.intro-copy > p:last-child { max-width: 510px; margin: 15px auto 0; color: #c3cec2; line-height: 1.55; font-size: 14px; }

.well-stage {
  order: 3;
  width: min(420px, 88vw);
  height: clamp(260px, 35vh, 370px);
  display: flex;
  justify-content: center;
  align-items: flex-end;
  z-index: 12 !important;
  margin-top: -2px;
  pointer-events: none;
}
.well {
  position: relative;
  width: min(300px, 74vw);
  height: 230px;
  transform-style: preserve-3d;
  animation: wellFloat 8s ease-in-out infinite;
}
@keyframes wellFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
.well-shadow { position: absolute; bottom: 0; width: 330px; max-width: 84vw; height: 45px; border-radius: 50%; background: rgba(0,0,0,.55); filter: blur(12px); }
.well-opening {
  position: absolute;
  z-index: 8;
  left: 4%;
  top: 39px;
  width: 92%;
  height: 86px;
  border-radius: 50%;
  background: #0a0d0b;
  box-shadow: inset 0 9px 16px rgba(0,0,0,.88), inset 0 -3px 6px rgba(210,194,151,.12), 0 4px 11px rgba(0,0,0,.35);
  overflow: hidden;
}
.water-surface {
  position: absolute;
  left: 8%;
  right: 8%;
  top: 23%;
  bottom: 10%;
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 43%, #325d58 0%, #173d38 35%, #071b1a 72%);
  overflow: visible;
  transition: box-shadow .5s ease;
}
.water-surface.active { box-shadow: 0 0 30px rgba(101, 197, 177, .38), inset 0 0 26px rgba(99, 191, 176, .15); }
.water-shimmer { position: absolute; left: 25%; top: 34%; width: 50%; height: 7px; border-top: 1px solid rgba(184, 234, 218, .25); border-radius: 50%; opacity: .5; animation: waterMove 3.8s ease-in-out infinite; }
.shimmer-two { left: 37%; top: 54%; width: 28%; animation-delay: -1.8s; }
@keyframes waterMove { 0%,100% { transform: scaleX(.65); opacity:.2; } 50% { transform: scaleX(1.1); opacity:.7; } }
.ripple { position: absolute; left: 50%; top: 50%; width: 18px; height: 8px; border: 2px solid rgba(198, 239, 228, .72); border-radius: 50%; transform: translate(-50%,-50%) scale(.1); opacity: 0; }
.water-surface.splashing .ripple-one { animation: rippleOut 1.25s ease-out; }
.water-surface.splashing .ripple-two { animation: rippleOut 1.45s ease-out .18s; }
@keyframes rippleOut { 0% { transform:translate(-50%,-50%) scale(.2); opacity:.9; } 100% { transform:translate(-50%,-50%) scale(6.7); opacity:0; } }
.splash { position: absolute; width: 8px; height: 18px; border-radius: 50% 50% 45% 45%; background: rgba(130,207,190,.72); left: 50%; top: 42%; opacity: 0; transform-origin: 50% 100%; }
.water-surface.splashing .splash-one { animation: splashUp .55s ease-out; }
.water-surface.splashing .splash-two { animation: splashUp .65s ease-out .06s; margin-left: 12px; }
@keyframes splashUp { 0% { transform:translate(-50%,0) scale(.3);opacity:0; } 30% { opacity:1; } 100% { transform:translate(-50%,-48px) rotate(18deg) scale(.1);opacity:0; } }
.well-light { position:absolute; inset:-70%; border-radius:50%; background:radial-gradient(circle,rgba(103,201,182,.30),rgba(77,149,137,.08) 24%,transparent 57%); opacity:0; transform:scale(.4); transition:opacity .7s ease,transform 1.2s ease; }
.water-surface.listening .well-light { opacity:1; transform:scale(1); animation:wellPulse 2.4s ease-in-out infinite; }
@keyframes wellPulse { 0%,100% { opacity:.55; } 50% { opacity:1; } }

.well-rim { position:absolute; z-index:10; top:20px; left:0; width:100%; height:89px; border-radius:50%; display:flex; overflow:hidden; border:5px solid #51483c; box-shadow:0 12px 12px rgba(0,0,0,.28), inset 0 -8px 10px rgba(32,29,24,.42); }
.well-rim span { flex:1; background:linear-gradient(145deg,#867966,#625746 60%,#4a4135); border-right:2px solid #41392f; transform:skewX(-7deg); }
.well-rim span:nth-child(even){ background:linear-gradient(145deg,#776a58,#554a3d 60%,#443b31); }
.well-rim::after { content:"";position:absolute;left:7%;right:7%;top:18%;bottom:20%;border-radius:50%;border:5px solid rgba(35,30,25,.62);box-shadow:inset 0 5px 10px rgba(0,0,0,.65); }
.well-body { position:absolute; z-index:5; top:75px; left:7%; width:86%; height:142px; overflow:hidden; border-radius:0 0 35% 35% / 0 0 16% 16%; background:#5b5143; border:4px solid #3d362d; box-shadow:inset 0 -25px 30px rgba(22,20,17,.38),0 14px 23px rgba(0,0,0,.3); }
.stone { position:absolute; height:43px; border:1px solid rgba(42,37,31,.75); border-radius:9px; background:linear-gradient(145deg,#756a58,#554b3e); box-shadow:inset 1px 2px rgba(255,255,255,.06); }
.s1{left:-4%;top:-5px;width:36%}.s2{left:32%;top:-5px;width:38%}.s3{right:-5%;top:-5px;width:36%}
.s4{left:-12%;top:39px;width:38%}.s5{left:26%;top:39px;width:43%}.s6{right:-12%;top:39px;width:43%}
.s7{left:-3%;top:82px;width:34%}.s8{left:31%;top:82px;width:39%}.s9{right:-5%;top:82px;width:35%}
.s10{left:-10%;top:124px;width:40%}.s11{left:30%;top:124px;width:43%}.s12{right:-10%;top:124px;width:38%}
.moss { position:absolute; z-index:12; top:52px; width:88px; height:27px; background:#36543a; filter:drop-shadow(0 4px 3px rgba(0,0,0,.25)); clip-path:polygon(0 15%,20% 0,37% 30%,51% 8%,63% 33%,78% 5%,100% 25%,90% 72%,76% 54%,65% 100%,48% 59%,30% 85%,18% 45%,4% 67%); opacity:.76; }
.moss-left { left:5px; transform:rotate(-7deg); }.moss-right { right:7px; transform:rotate(10deg) scaleX(-1); }
.well-back { position:absolute; z-index:3; left:12%; right:12%; top:36px; height:69px; border-radius:50%; background:#40392f; }
.well-rope { position:absolute; z-index:2; width:3px; height:90px; background:#695c46; top:0; left:50%; box-shadow:1px 0 #382f25; opacity:.65; }
.well-rope span { position:absolute; width:32px; height:21px; border:3px solid #5a4c39; border-top:0; left:-15px; bottom:-7px; border-radius:0 0 14px 14px; }

.garden { position:absolute; z-index:10 !important; width:min(580px,100vw); height:330px; bottom:2vh; left:50%; transform:translateX(-50%); pointer-events:none; }
.garden > * { opacity:0; transition:opacity 1s ease,transform 1s ease; }
.garden.level-1 .fireflies,.garden.level-2 .fireflies,.garden.level-3 .fireflies,.garden.level-4 .fireflies { opacity:1; }
.garden.level-2 .flower-a,.garden.level-2 .flower-b,.garden.level-3 .flower-a,.garden.level-3 .flower-b,.garden.level-4 .flower-a,.garden.level-4 .flower-b { opacity:1; transform:translateY(0) scale(1); }
.garden.level-3 .flower-c,.garden.level-3 .lily-a,.garden.level-3 .garden-vines,.garden.level-4 .flower-c,.garden.level-4 .lily-a,.garden.level-4 .garden-vines { opacity:1; transform:translateY(0) scale(1); }
.garden.level-4 .lily-b,.garden.level-4 .lantern { opacity:1; transform:translateY(0) scale(1); }
.fireflies { position:absolute;inset:0; }
.firefly { position:absolute;width:4px;height:4px;border-radius:50%;background:#f0d987;box-shadow:0 0 9px #eace77;animation:fireflyMove var(--dur) ease-in-out infinite var(--delay); }
@keyframes fireflyMove { 0%,100%{transform:translate(0,0);opacity:.2}25%{transform:translate(18px,-13px);opacity:1}55%{transform:translate(-8px,-31px);opacity:.45}80%{transform:translate(25px,-46px);opacity:.9} }
.flower { position:absolute;bottom:35px;width:23px;height:23px;border-radius:50%;background:radial-gradient(circle,#e1bf77 0 18%,#b6c79d 19% 35%,#7e9a72 36% 52%,transparent 53%);transform:translateY(15px) scale(.4); }
.flower::after{content:"";position:absolute;width:3px;height:38px;background:#405f3e;left:10px;top:17px;transform:rotate(7deg);transform-origin:top;}
.flower-a{left:17%;}.flower-b{right:17%;bottom:42px;transform:translateY(15px) scale(.4) rotate(24deg)}.flower-c{left:24%;bottom:18px;transform:translateY(15px) scale(.4) rotate(-16deg)}
.lily { position:absolute;bottom:9px;width:54px;height:19px;border-radius:50%;background:#314f39;transform:translateY(10px) scale(.6);box-shadow:0 4px 7px rgba(0,0,0,.3); }
.lily::after{content:"";position:absolute;width:14px;height:14px;border-radius:50% 50% 40% 50%;background:#d6c9b1;left:19px;top:-7px;transform:rotate(45deg);}
.lily-a{left:8%}.lily-b{right:7%;bottom:21px}
.garden-vines { position:absolute;width:310px;height:90px;bottom:35px;left:50%;transform:translate(-50%,12px) scale(.8);border-bottom:4px solid #335039;border-radius:50%; }
.garden-vines::before,.garden-vines::after{content:"";position:absolute;width:32px;height:14px;background:#3f6041;border-radius:100% 0 100% 0;}
.garden-vines::before{left:55px;bottom:-3px;transform:rotate(24deg)}.garden-vines::after{right:61px;bottom:4px;transform:scaleX(-1) rotate(18deg)}
.lantern { position:absolute;right:7%;bottom:65px;width:40px;height:58px;border:3px solid #5f5139;border-radius:8px;transform:translateY(16px) scale(.7);background:rgba(231,196,102,.07);box-shadow:inset 0 0 17px rgba(228,188,84,.15); }
.lantern::before{content:"";position:absolute;width:23px;height:13px;border:3px solid #5f5139;border-bottom:0;border-radius:20px 20px 0 0;left:5px;top:-15px}.lantern span{position:absolute;inset:10px;border-radius:50%;background:#e0bd68;box-shadow:0 0 20px #d6ad58;animation:lanternGlow 2s ease-in-out infinite}@keyframes lanternGlow{50%{opacity:.55;transform:scale(.85)}}

.glass-panel { background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow),inset 0 1px rgba(255,255,255,.035);backdrop-filter:blur(22px); }
.wish-composer {
  order: 4;
  width:min(570px,100%);
  margin-top:-9px;
  padding:19px;
  border-radius:var(--radius);
  z-index:23 !important;
  transition:opacity .4s ease,transform .4s ease;
}
.composer-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px; }
.step-label { margin:0 0 4px;color:var(--gold);font-size:11px;font-weight:700; }
.composer-heading h2 { margin:0;font-family:Georgia,serif;font-size:20px;font-weight:500; }
.privacy-mark { display:flex;align-items:center;gap:5px;color:#9eafa3;font-size:10px;white-space:nowrap; }
.privacy-mark svg { width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.7; }
#wishInput { width:100%;resize:none;border:0;border-radius:18px;background:rgba(3,13,9,.58);color:var(--ink);padding:15px 16px;line-height:1.48;font-size:16px;box-shadow:inset 0 0 0 1px rgba(236,223,183,.12); }
#wishInput::placeholder { color:#72857a; }
.composer-footer { display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:12px; }
#characterCount { color:#82958a;font-size:10px; }
.primary-button,.secondary-button { border-radius:999px;min-height:45px;padding:0 18px;border:1px solid transparent;font-weight:800;font-size:13px;cursor:pointer;transition:transform .2s ease,filter .2s ease,background .2s ease; }
.primary-button { color:#1d241b;background:linear-gradient(180deg,#eadcae,#c9ad6e);box-shadow:0 8px 22px rgba(185,150,82,.2),inset 0 1px rgba(255,255,255,.5); }
.primary-button:hover,.secondary-button:hover { transform:translateY(-1px);filter:brightness(1.06); }
.secondary-button { background:rgba(222,208,165,.07);border-color:rgba(232,218,177,.25);color:var(--ink); }
.text-button { border:0;background:none;color:#b7c3b8;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(183,195,184,.28);cursor:pointer;padding:8px;font-size:12px; }
.text-button:hover { color:var(--ink); }
.text-button.centered { display:block;margin:8px auto -5px; }
.text-button.danger { color:var(--danger); }

.coin-dock { order:4;width:min(570px,100%);display:flex;flex-direction:column;align-items:center;margin-top:-25px;z-index:25 !important;animation:fadeUp .55s ease both; }
.coin-dock p { color:#d8ded6;font-size:13px;margin:0 0 10px;text-shadow:0 2px 10px rgba(0,0,0,.7); }
.penny { position:relative;width:92px;height:92px;padding:0;border:0;border-radius:50%;background:transparent;cursor:grab;perspective:650px;filter:drop-shadow(0 13px 11px rgba(0,0,0,.38));touch-action:none;animation:coinReady 2.8s ease-in-out infinite; }
.penny:active { cursor:grabbing; }
.penny-face { position:absolute;inset:0;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;backface-visibility:hidden;border:3px solid #df9d60;background:radial-gradient(circle at 36% 28%,#e5a66b 0 8%,#c87944 27%,#a35a34 58%,#6b3522 100%);box-shadow:inset 4px 4px 8px rgba(255,208,153,.22),inset -8px -8px 13px rgba(68,24,11,.4),0 0 0 2px #7d4129; }
.penny-face::before { content:"";position:absolute;inset:8px;border:1px dashed rgba(86,43,25,.55);border-radius:50%; }
.penny-face b { font-family:Georgia,serif;font-size:36px;line-height:.9;color:#5f2f1e;text-shadow:0 1px rgba(255,197,136,.25); }
.penny-face small { font-size:8px;letter-spacing:.18em;font-weight:900;color:#5e2f1e;margin-top:5px; }
.penny-back { transform:rotateY(180deg); }

.deep-water-penny .penny-face,
.flying-penny.deep-water-penny .penny-face {
  border-color:#f2d37f;
  background:radial-gradient(circle at 34% 26%,#fff0b0 0 8%,#e2ba5b 28%,#a97a25 62%,#5d3b12 100%);
  box-shadow:inset 4px 4px 8px rgba(255,244,184,.3),inset -8px -8px 13px rgba(69,39,6,.48),0 0 0 2px #8d641f,0 0 28px rgba(239,204,108,.28);
}
.deep-water-penny .penny-face::before { border-color:rgba(92,58,11,.58); }
.deep-water-penny .penny-face b,.deep-water-penny .penny-face small { color:#65420e; }

@keyframes coinReady { 0%,100%{transform:translateY(0) rotateY(0)}50%{transform:translateY(-8px) rotateY(14deg)} }
.flying-penny { position:fixed;z-index:1000;width:92px;height:92px;pointer-events:none;transform-style:preserve-3d;filter:drop-shadow(0 12px 8px rgba(0,0,0,.4)); }
.flying-penny .penny-face { animation:coinSpin .34s linear infinite; }
@keyframes coinSpin { to { transform:rotateY(360deg); } }

.listening-state { order:4;display:flex;flex-direction:column;align-items:center;margin-top:-5px;z-index:25 !important;animation:fadeUp .4s ease both; }
.listening-state p { color:#e2e6df;font-family:Georgia,serif;font-size:17px;margin:8px 0 0; }
.listening-rings { width:72px;height:35px;position:relative;display:block; }
.listening-rings i { position:absolute;left:50%;top:50%;width:20px;height:8px;border:1px solid rgba(142,211,195,.65);border-radius:50%;transform:translate(-50%,-50%) scale(.25);animation:listeningRipple 1.8s ease-out infinite; }
.listening-rings i:nth-child(2){animation-delay:.55s}.listening-rings i:nth-child(3){animation-delay:1.1s}@keyframes listeningRipple{0%{opacity:.9;transform:translate(-50%,-50%) scale(.3)}100%{opacity:0;transform:translate(-50%,-50%) scale(3.6)}}
.thinking-dots i{font-style:normal;animation:dotFade 1.3s ease-in-out infinite}.thinking-dots i:nth-child(2){animation-delay:.2s}.thinking-dots i:nth-child(3){animation-delay:.4s}@keyframes dotFade{0%,100%{opacity:.2}50%{opacity:1}}

.response-card { order:4;width:min(620px,100%);margin-top:-32px;padding:25px 20px 20px;border-radius:31px;z-index:28 !important;animation:responseRise .75s cubic-bezier(.18,.8,.2,1) both; }
@keyframes responseRise { from{opacity:0;transform:translateY(50px) scale(.96);filter:blur(7px)}to{opacity:1;transform:none;filter:none} }
.close-response { position:absolute;top:12px;right:13px;width:36px;height:36px;border-radius:50%;border:1px solid rgba(237,224,184,.16);background:rgba(255,255,255,.03);font-size:23px;cursor:pointer; }
.response-mark { width:46px;height:46px;display:grid;place-items:center;margin:-5px auto 13px;border:1px solid rgba(218,195,128,.35);border-radius:50%;color:var(--gold-bright);font-size:31px;box-shadow:inset 0 0 20px rgba(209,177,94,.1),0 0 20px rgba(209,177,94,.06); }
.response-card > .eyebrow{text-align:center}.response-card blockquote { margin:0 auto;max-width:540px;text-align:center;font-family:Georgia,serif;font-size:clamp(20px,5.5vw,28px);line-height:1.3;color:#fbf4df; }
.response-divider { width:100%;display:flex;align-items:center;justify-content:center;margin:22px 0; }
.response-divider span { width:80px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.response-section h3,.carry-card span { margin:0 0 6px;color:var(--gold);font-size:10px;text-transform:uppercase;letter-spacing:.14em; }
.response-section p { margin:0;color:#c6d0c6;line-height:1.55;font-size:14px; }
.carry-card { margin-top:16px;padding:15px;border-radius:18px;background:rgba(220,198,132,.07);border:1px solid rgba(220,198,132,.18); }
.carry-card p { margin:0;line-height:1.5;font-size:14px;font-weight:650; }
.response-actions { display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:17px; }
.upgrade-offer { position:relative;overflow:hidden;margin-top:17px;padding:18px;border-radius:22px;text-align:center;background:linear-gradient(145deg,rgba(216,187,111,.13),rgba(255,255,255,.025));border:1px solid rgba(230,201,121,.28);box-shadow:inset 0 1px rgba(255,255,255,.035); }
.upgrade-offer[hidden] { display:none; }
.upgrade-glow { position:absolute;inset:-70% 10% auto;height:170px;background:radial-gradient(circle,rgba(244,211,119,.2),transparent 68%);pointer-events:none; }
.upgrade-offer h3 { position:relative;margin:0;font-family:Georgia,serif;font-size:21px;font-weight:500;color:#fff2c9; }
.upgrade-offer > p:not(.eyebrow) { position:relative;margin:8px auto 0;max-width:470px;color:#b9c5ba;font-size:12px;line-height:1.5; }
.upgrade-benefits { position:relative;display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin:13px 0; }
.upgrade-benefits span { padding:6px 9px;border-radius:999px;background:rgba(4,16,11,.32);border:1px solid rgba(235,209,139,.17);color:#d8dfd5;font-size:9px;font-weight:750;letter-spacing:.02em; }
.upgrade-actions { position:relative;display:grid;grid-template-columns:1.35fr .85fr;gap:8px; }
.gold-button,.quiet-button { min-height:45px;border-radius:999px;padding:10px 14px;font-weight:850;font-size:11px;cursor:pointer; }
.gold-button { color:#2a1b06;border:1px solid #f3d88b;background:linear-gradient(180deg,#f3d98a,#c79537);box-shadow:0 10px 28px rgba(190,139,42,.2); }
.gold-button:hover { filter:brightness(1.05);transform:translateY(-1px); }
.quiet-button { color:#d5ddd4;border:1px solid rgba(232,218,177,.18);background:rgba(4,15,10,.28); }
.deep-water-response { border-color:rgba(238,204,112,.32);box-shadow:0 25px 80px rgba(0,0,0,.35),inset 0 0 45px rgba(221,179,67,.035); }
.deep-water-response .response-mark { color:#f6d77c;border-color:rgba(243,211,121,.5);box-shadow:inset 0 0 24px rgba(222,177,65,.14),0 0 32px rgba(222,177,65,.11); }
.deep-water-response .carry-card { background:rgba(226,186,77,.095);border-color:rgba(230,195,100,.28); }


.install-prompt { order:5;margin-top:18px;border:1px solid rgba(232,218,177,.18);background:rgba(7,19,14,.68);backdrop-filter:blur(14px);border-radius:999px;padding:10px 16px;color:#c8d1c8;font-size:12px;cursor:pointer;z-index:25 !important; }
.install-prompt span { display:inline-grid;place-items:center;width:20px;height:20px;border:1px solid rgba(232,218,177,.3);border-radius:50%;margin-right:6px; }
.legal-links { order:6;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:16px;color:#71847a;font-size:10px;z-index:25 !important; }
.legal-links a { color:#8fa197;text-decoration:none;border-bottom:1px solid rgba(143,161,151,.24); }
.legal-links a:hover { color:#d8dfd7; }

.drawer,.modal { position:fixed;inset:0;z-index:100;visibility:hidden;pointer-events:none; }
.drawer.open,.modal.open { visibility:visible;pointer-events:auto; }
.drawer-backdrop,.modal-backdrop { position:absolute;inset:0;background:rgba(1,7,4,.66);backdrop-filter:blur(7px);opacity:0;transition:opacity .28s ease; }
.drawer.open .drawer-backdrop,.modal.open .modal-backdrop { opacity:1; }
.drawer-panel { position:absolute;top:0;right:0;width:min(520px,100%);height:100%;overflow-y:auto;background:#091811;border-left:1px solid rgba(232,218,177,.15);box-shadow:-25px 0 80px rgba(0,0,0,.35);padding:max(22px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom));transform:translateX(100%);transition:transform .34s cubic-bezier(.2,.8,.2,1); }
.drawer.open .drawer-panel { transform:none; }
.drawer-header { display:flex;justify-content:space-between;align-items:flex-start;gap:10px; }
.drawer-header h2 { margin:0;font-family:Georgia,serif;font-size:28px;font-weight:500; }
.close-drawer-button { width:42px;padding:0;font-size:25px; }
.stats-row { display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:21px 0 17px; }
.stats-row div { padding:13px 8px;border-radius:16px;background:rgba(255,255,255,.03);border:1px solid rgba(232,218,177,.11);text-align:center; }
.stats-row strong { display:block;font-family:Georgia,serif;font-size:23px;color:var(--gold-bright);font-weight:500; }
.stats-row span { display:block;color:#92a298;font-size:9px;text-transform:uppercase;letter-spacing:.1em;margin-top:4px; }
.return-card { display:flex;align-items:center;gap:11px;padding:13px;border-radius:18px;background:rgba(119,179,151,.1);border:1px solid rgba(119,179,151,.22);margin-bottom:19px; }
.return-icon { width:39px;height:39px;border-radius:50%;display:grid;place-items:center;background:rgba(119,179,151,.12);color:#abd9c4;font-size:22px; }
.return-card div { flex:1; }.return-card strong { font-size:13px; }.return-card p { margin:3px 0 0;color:#9fb0a5;font-size:11px;line-height:1.35; }
.return-card button { border:0;border-radius:999px;padding:8px 11px;background:#b7cfb6;color:#172118;font-weight:800;font-size:11px;cursor:pointer; }
.journal-section { margin-top:18px; }
.section-heading h3 { margin:0;font-family:Georgia,serif;font-size:20px;font-weight:500; }.section-heading p { margin:3px 0 0;color:#83968a;font-size:11px; }
.wish-list { display:grid;gap:9px;margin-top:13px; }
.wish-item { padding:14px;border:1px solid rgba(232,218,177,.12);border-radius:18px;background:rgba(255,255,255,.025);cursor:pointer;transition:background .2s ease,border-color .2s ease; }
.wish-item:hover { background:rgba(255,255,255,.045);border-color:rgba(232,218,177,.22); }
.wish-item-top { display:flex;justify-content:space-between;gap:12px;color:#84968a;font-size:10px; }
.wish-item p { margin:9px 0 0;font-family:Georgia,serif;font-size:15px;line-height:1.4;color:#eee7d6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }
.wish-item .echo-preview { font-family:inherit;color:#aebbb0;font-size:11px; }
.wish-item.sealed p { color:#829187;font-style:italic; }
.wish-item-returned { color:#d8c787 !important;font-weight:800; }
.empty-state { text-align:center;color:#809187;padding:40px 10px; }.empty-state span { display:block;font-size:35px;color:#a79565;margin-bottom:8px; }.empty-state p { margin:0;font-size:12px; }
.monthly-card { margin-top:22px;padding:17px;border-radius:21px;background:radial-gradient(circle at top right,rgba(205,179,105,.11),transparent 40%),rgba(255,255,255,.025);border:1px solid rgba(232,218,177,.13); }
.monthly-card h3 { margin:0;font-family:Georgia,serif;font-size:21px;font-weight:500; }.monthly-card p:not(.eyebrow) { color:#9aaba0;line-height:1.45;font-size:12px; }.monthly-card button { width:100%;margin-top:8px; }
.reflection-history { margin-top:22px; }
.reflection-list { display:grid;gap:9px;margin-top:13px; }
.reflection-item { width:100%;padding:14px;border:1px solid rgba(216,187,111,.18);border-radius:18px;background:linear-gradient(135deg,rgba(216,187,111,.065),rgba(255,255,255,.018));text-align:left;cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease; }
.reflection-item:hover { transform:translateY(-1px);border-color:rgba(216,187,111,.34);background:linear-gradient(135deg,rgba(216,187,111,.1),rgba(255,255,255,.035)); }
.reflection-item-top { display:flex;align-items:center;justify-content:space-between;gap:12px;color:#8fa096;font-size:10px; }
.reflection-item-top strong { color:#d8c787;text-transform:uppercase;letter-spacing:.09em;font-size:8px; }
.reflection-item p { margin:9px 0 0;font-family:Georgia,serif;font-size:14px;line-height:1.45;color:#e8e1d1; }
.drawer-footer { display:flex;justify-content:space-between;gap:10px;margin-top:24px;padding-top:14px;border-top:1px solid rgba(232,218,177,.1); }

.modal { display:grid;place-items:center;padding:18px; }
.modal-card { position:relative;width:min(500px,100%);max-height:min(820px,92svh);overflow-y:auto;background:#0a1a13;border:1px solid rgba(231,217,177,.18);border-radius:29px;box-shadow:0 30px 100px rgba(0,0,0,.55);padding:27px 20px 20px;text-align:center;opacity:0;transform:translateY(18px) scale(.97);transition:opacity .26s ease,transform .26s ease; }
.modal.open .modal-card { opacity:1;transform:none; }
.modal-close { position:absolute;right:12px;top:11px;width:36px;height:36px;border-radius:50%;border:1px solid rgba(232,218,177,.13);background:rgba(255,255,255,.025);font-size:23px;cursor:pointer; }
.modal-card h2 { margin:0;font-family:Georgia,serif;font-size:29px;font-weight:500; }.modal-lead { color:#9fb0a4;line-height:1.48;font-size:13px;max-width:410px;margin:11px auto 19px; }
.modal-coin { width:70px;height:70px;display:grid;place-items:center;margin:0 auto 15px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#e5a66b,#af6338 55%,#67331f);border:3px solid #d88d55;box-shadow:inset -7px -7px 12px rgba(64,22,10,.36),0 15px 28px rgba(0,0,0,.28);font-family:Georgia,serif;font-size:19px;color:#5a2b1a;font-weight:700; }

.purchase-trust { display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin:-7px 0 14px; }
.purchase-trust span { padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.025);border:1px solid rgba(232,218,177,.11);color:#8fa096;font-size:8px;font-weight:750; }

.price-options,.seal-options { display:grid;gap:9px; }
.price-card { position:relative;display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;padding:14px;border:1px solid rgba(232,218,177,.14);border-radius:18px;background:rgba(255,255,255,.026);cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease; }
.price-card:hover { transform:translateY(-1px);border-color:rgba(232,218,177,.28);background:rgba(255,255,255,.045); }
.price-card span { display:block; }.price-card strong { display:block;font-size:14px; }.price-card small { display:block;color:#8fa096;font-size:10px;margin-top:3px;font-weight:500; }.price-card > b { white-space:nowrap;color:var(--gold-bright);font-family:Georgia,serif;font-size:19px; }.price-card > b small { display:inline;font-size:9px;color:#9cac9f; }
.price-card.featured { border-color:rgba(216,187,111,.38);background:rgba(216,187,111,.065);padding-top:21px; }.price-card em { position:absolute;top:4px;left:14px;color:#d9bd76;font-style:normal;text-transform:uppercase;letter-spacing:.12em;font-size:7px;font-weight:900; }
.gift-button { width:100%;margin-top:12px;min-height:44px;border-radius:999px;border:1px solid rgba(232,218,177,.18);background:rgba(255,255,255,.025);color:#c8d2c9;font-weight:750;font-size:12px;cursor:pointer; }
.gift-button:hover { background:rgba(255,255,255,.05);border-color:rgba(232,218,177,.3); }
.payment-note { color:#75897d;font-size:10px;margin:14px 0 0; }
.small-modal { width:min(430px,100%); }.seal-symbol { font-size:50px;color:var(--gold);height:58px; }
.seal-options button { border:1px solid rgba(232,218,177,.14);background:rgba(255,255,255,.026);border-radius:17px;padding:14px;text-align:left;cursor:pointer; }.seal-options button:hover{background:rgba(255,255,255,.05)}.seal-options strong{display:block;font-size:14px}.seal-options span{display:block;color:#8fa096;font-size:10px;margin-top:3px}
.share-modal-card { width:min(490px,100%); }.share-modal-card canvas { width:min(100%,320px);height:auto;border-radius:20px;box-shadow:0 14px 40px rgba(0,0,0,.32);background:#071610; }.share-actions { display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px; }

.toast { position:fixed;z-index:1000;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translate(-50%,20px);opacity:0;pointer-events:none;background:rgba(10,27,20,.95);border:1px solid rgba(232,218,177,.19);box-shadow:0 14px 45px rgba(0,0,0,.4);border-radius:999px;padding:10px 15px;font-size:12px;color:#e9e5d8;transition:opacity .25s ease,transform .25s ease;max-width:calc(100vw - 36px);text-align:center; }
.toast.show { opacity:1;transform:translate(-50%,0); }

@keyframes fadeUp { from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none} }
body.locked { overflow:hidden; }
.app-shell.tossing .intro-copy,.app-shell.tossing .wish-composer { opacity:0;transform:translateY(-10px);pointer-events:none; }
.app-shell.responded .intro-copy { opacity:0;transform:translateY(-10px);position:absolute;pointer-events:none; }
.app-shell.responded .well-stage { height:285px; }
.app-shell.responded .well { transform:scale(.89) translateY(13px);animation:none; }
.app-shell.responded .garden { opacity:.8; }
.app-shell.crisis-mode .response-card { border-color:rgba(238,154,142,.35); }
.app-shell.deep-water-mode .well-light { opacity:.9;filter:drop-shadow(0 0 22px rgba(240,201,93,.48)); }

@media (min-width: 760px) {
  .topbar { padding-left:30px;padding-right:30px; }
  .brand small,.desktop-label { display:block; }
  .icon-button { padding:0 15px; }
  .sky-scene { padding-top:105px; }
  .intro-copy { margin-top:2vh; }
  .well-stage { height:360px;margin-top:-15px; }
  .wish-composer { margin-top:-34px;padding:22px; }
  .composer-heading h2 { font-size:23px; }
  .response-card { padding:29px 28px 23px;margin-top:-56px; }
  .garden { bottom:1vh;height:390px; }
}

@media (min-width: 1100px) and (min-height: 760px) {
  .sky-scene { display:grid;grid-template-columns:minmax(520px,620px) minmax(450px,560px);grid-template-rows:1fr auto auto;align-items:center;justify-content:center;column-gap:4vw;padding:100px 5vw 28px; }
  .intro-copy { grid-column:1;grid-row:1;text-align:left;margin:0;align-self:center; }
  .intro-copy h1 { font-size:clamp(58px,5vw,76px); }.intro-copy > p:last-child { margin:20px 0 0; }
  .well-stage { grid-column:2;grid-row:1;width:600px;height:470px;align-self:end;margin:0; }
  .well { transform:scale(1.42); }.well-shadow{transform:scale(1.38)}
  .wish-composer,.coin-dock,.listening-state,.response-card { grid-column:1 / -1;grid-row:2;justify-self:center;margin-top:-15px; }
  .legal-links { grid-column:1 / -1;grid-row:3;margin-top:12px; }
  .response-card { width:min(720px,90vw); }
  .garden { width:720px;height:500px;left:70%;bottom:4vh; }
  .app-shell.responded .well-stage { height:440px; }.app-shell.responded .well{transform:scale(1.12) translateY(10px)}
}

@media (max-width: 520px) {
  .upgrade-actions { grid-template-columns:1fr; }
}

@media (max-height: 690px) and (max-width: 759px) {
  .intro-copy { margin-top:-6px; }.intro-copy h1{font-size:36px}.intro-copy>p:last-child{display:none}.well-stage{height:250px}.wish-composer{margin-top:-26px}.well{transform:scale(.9)}.app-shell.responded .well-stage{height:220px}.response-card{margin-top:-45px}
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto !important;animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important; }
}

/* Distinct daily, copper, and moon penny wallet */
.coin-choice{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;margin:0 0 12px;padding:7px;border:1px solid rgba(232,218,177,.13);border-radius:18px;background:rgba(4,15,10,.48);backdrop-filter:blur(12px)}
.coin-choice button{display:grid;grid-template-columns:28px auto;grid-template-rows:auto auto;column-gap:8px;align-items:center;min-width:104px;padding:8px 10px;border:1px solid transparent;border-radius:13px;background:transparent;color:#dbe2dc;text-align:left;cursor:pointer}
.coin-choice button:hover{background:rgba(255,255,255,.04)}
.coin-choice button.selected{border-color:rgba(232,218,177,.28);background:rgba(255,255,255,.06)}
.coin-choice button:disabled{opacity:.34;cursor:not-allowed}
.choice-dot{grid-row:1/3;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font:700 12px Georgia,serif}
.daily-dot{background:linear-gradient(145deg,#dfa16b,#8f4d2c);color:#522819;border:1px solid #d18a54}
.copper-dot{background:linear-gradient(145deg,#f0a56e,#9f4e2e);color:#512516;border:1px solid #dd8755}
.moon-dot{background:radial-gradient(circle at 34% 28%,#eef9fb,#a7ccd4 55%,#557f8a);color:#183a42;border:1px solid #d7edf1;box-shadow:0 0 12px rgba(165,217,229,.23)}
.coin-choice b{font-size:11px;line-height:1.1}.coin-choice small{font-size:8px;color:#8fa096;margin-top:3px}

.copper-penny .penny-face,.flying-penny.copper-penny .penny-face{border-color:#f0a36c;background:radial-gradient(circle at 34% 26%,#ffc08e 0 7%,#db824f 28%,#a94f31 62%,#572718 100%);box-shadow:inset 4px 4px 8px rgba(255,209,169,.29),inset -8px -8px 13px rgba(69,25,12,.48),0 0 0 2px #8d452b,0 0 25px rgba(211,105,61,.2)}
.copper-penny .penny-face::before{border-color:rgba(91,40,21,.57)}
.copper-penny .penny-face b,.copper-penny .penny-face small{color:#632d1c}
.moon-penny .penny-face,.flying-penny.moon-penny .penny-face{border-color:#e1f1f4;background:radial-gradient(circle at 32% 24%,#ffffff 0 7%,#c6e1e6 27%,#7faab4 60%,#355d67 100%);box-shadow:inset 4px 4px 9px rgba(255,255,255,.48),inset -8px -8px 14px rgba(22,57,65,.47),0 0 0 2px #6c9aa5,0 0 34px rgba(167,220,231,.38)}
.moon-penny .penny-face::before{border-color:rgba(38,78,87,.48)}
.moon-penny .penny-face b,.moon-penny .penny-face small{color:#244d57;text-shadow:0 1px rgba(255,255,255,.3)}

.copper-water-response{border-color:rgba(223,132,83,.34);box-shadow:0 25px 80px rgba(0,0,0,.35),inset 0 0 45px rgba(212,105,60,.04)}
.copper-water-response .response-mark{color:#efaa78;border-color:rgba(235,143,88,.5);box-shadow:inset 0 0 24px rgba(214,103,55,.14),0 0 32px rgba(214,103,55,.1)}
.copper-water-response .carry-card{background:rgba(210,102,55,.08);border-color:rgba(224,136,87,.25)}
.moon-water-response{border-color:rgba(180,224,233,.38);box-shadow:0 25px 85px rgba(0,0,0,.4),inset 0 0 65px rgba(128,198,213,.055)}
.moon-water-response .response-mark{color:#d9f1f5;border-color:rgba(189,230,238,.54);box-shadow:inset 0 0 25px rgba(160,218,230,.17),0 0 38px rgba(160,218,230,.16)}
.moon-water-response .carry-card{background:rgba(130,198,212,.09);border-color:rgba(177,222,231,.28)}
.app-shell.copper-water-mode .well-light{opacity:.92;filter:drop-shadow(0 0 24px rgba(226,126,72,.45))}
.app-shell.moon-water-mode .well-light{opacity:1;filter:drop-shadow(0 0 30px rgba(163,222,234,.64))}
.app-shell.moon-water-mode .water-surface{box-shadow:inset 0 0 25px rgba(185,232,240,.18),0 0 28px rgba(130,202,217,.18)}

.wallet-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:-5px 0 15px}
.wallet-summary>div{display:grid;grid-template-columns:32px auto;grid-template-rows:auto auto;align-items:center;text-align:left;padding:9px;border:1px solid rgba(232,218,177,.12);border-radius:14px;background:rgba(255,255,255,.025)}
.wallet-coin{grid-row:1/3;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;margin-right:7px;font:700 11px Georgia,serif}
.daily-wallet,.copper-wallet{background:linear-gradient(145deg,#e7a36e,#944b2d);color:#502617;border:1px solid #d88754}
.moon-wallet{background:radial-gradient(circle at 35% 28%,#f4fdff,#a7ccd5 60%,#507985);color:#1b414a;border:1px solid #d7edf1}
.wallet-summary b{font:500 18px Georgia,serif}.wallet-summary small{font-size:8px;color:#8fa096;text-transform:uppercase;letter-spacing:.08em}

@media(max-width:520px){.coin-choice{width:min(100%,360px)}.coin-choice button{min-width:94px;padding:7px}.wallet-summary>div{grid-template-columns:27px auto;padding:8px}.wallet-coin{width:24px;height:24px}}