:root{color:#263447;background:#f8fbff;font-family:Inter,Segoe UI,Hiragino Sans,Yu Gothic,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 18% 12%,rgba(236,120,183,.18),transparent 24rem),radial-gradient(circle at 82% 6%,rgba(77,163,226,.18),transparent 22rem),linear-gradient(180deg,#fbfdff,#eef7ff 54%,#fff8fc)}button,a{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}.app-shell{width:min(100%,520px);min-height:100vh;margin:0 auto;position:relative;background:linear-gradient(180deg,#ffffffd6,#ffffff94),radial-gradient(circle at 50% 24%,rgba(151,181,220,.16),transparent 18rem);box-shadow:0 0 80px #5078b41f}.page{min-height:100vh;padding:28px 20px 104px}.app-header{display:grid;gap:8px;padding-top:10px}.brand-mark,.section-heading span{margin:0;color:#65758e;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.app-header h1,.section-heading h2,.section-heading h1{margin:0;color:#172033;letter-spacing:0}.app-header h1{font-size:clamp(2.5rem,12vw,4.5rem);line-height:.96}.app-header p:not(.brand-mark){margin:0;color:#5f6f86;line-height:1.8}.date-text{margin:22px 0 18px;color:#62718a;font-weight:700}.hero-pond-card,.detail-card,.placeholder-card,.notice-card,.completion-card,.modal-card{border:1px solid rgba(198,218,239,.82);border-radius:28px;background:#ffffffad;box-shadow:0 18px 56px #567eae21;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.hero-pond-card{display:grid;place-items:center;gap:20px;padding:30px 18px}.water-copy,.quiet-note{margin:0;color:#52677f;line-height:1.8;text-align:center}.water-pond{--water-gradient: linear-gradient(135deg, #d8ecff, #f8dcf0);--stain-color: #4da3e2;position:relative;display:grid;place-items:center;width:min(100%,330px);aspect-ratio:1.85 / 1;border-radius:50%;background:var(--water-gradient);overflow:hidden;isolation:isolate;filter:drop-shadow(0 24px 28px rgba(99,141,184,.18));transition:background 1.3s ease,filter .8s ease}.water-pond-large{width:min(100%,360px)}.water-pond-medium{width:min(100%,300px)}.water-pond-small{width:var(--history-width, 170px)}.water-layer,.water-stain,.ripple{position:absolute;border-radius:50%;pointer-events:none}.water-layer-one{inset:8% 10%;background:radial-gradient(circle at 30% 38%,rgba(255,255,255,.58),transparent 24%),radial-gradient(circle at 70% 52%,rgba(255,255,255,.28),transparent 28%);filter:blur(10px);opacity:.88}.water-layer-two{inset:16% 14%;border:1px solid rgba(255,255,255,.5);filter:blur(.4px);opacity:.68}.water-stain{width:26%;aspect-ratio:1;background:var(--stain-color);filter:blur(18px);opacity:0;transform:translateY(10px) scale(.2)}.is-rippling .water-stain{animation:stainSpread 1.8s ease forwards}.ripple{width:18%;aspect-ratio:1;border:1px solid rgba(255,255,255,.72);opacity:0}.is-rippling .ripple-one{animation:ripple 1.7s ease-out forwards}.is-rippling .ripple-two{animation:ripple 1.9s .18s ease-out forwards}.is-rippling .ripple-three{animation:ripple 2.1s .36s ease-out forwards}.notice-card{margin:18px 0;padding:16px;color:#52627a;line-height:1.7}.emotion-selector{display:grid;gap:18px;margin-top:26px}.section-heading{display:grid;gap:6px}.section-heading h2,.section-heading h1{font-size:1.35rem;line-height:1.35}.centered{text-align:center}.emotion-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.emotion-button{--emotion-color: #4da3e2;display:grid;min-height:132px;gap:8px;justify-items:start;padding:16px;border:1px solid rgba(198,218,239,.86);border-radius:22px;color:#25364d;background:radial-gradient(circle at 72% 18%,color-mix(in srgb,var(--emotion-color) 30%,transparent),transparent 42%),#ffffffb8;box-shadow:0 14px 34px #5277a21a;text-align:left}.emotion-button:disabled{opacity:.46}.emotion-icon{width:34px;aspect-ratio:1;border-radius:50% 50% 50% 12%;background:var(--emotion-color);transform:rotate(45deg);box-shadow:inset 8px 8px 14px #ffffff61}.emotion-button strong{font-size:1.05rem}.emotion-button small{color:#687990;line-height:1.5}.bottom-nav{position:fixed;left:50%;bottom:14px;z-index:20;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;width:min(calc(100% - 28px),480px);padding:8px;border:1px solid rgba(188,211,236,.9);border-radius:26px;background:#ffffffd1;box-shadow:0 18px 48px #3d5b812e;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);transform:translate(-50%)}.bottom-nav a{display:grid;gap:2px;place-items:center;min-height:54px;border-radius:20px;color:#718097;font-size:.74rem;font-weight:800;text-decoration:none}.bottom-nav a span:first-child{font-size:1.15rem}.bottom-nav a.active{color:#2b64b1;background:#dceeffc7}.drop-page{display:grid;align-items:stretch}.drop-stage{position:relative;display:grid;grid-template-rows:auto 1fr auto;min-height:calc(100vh - 132px);overflow:hidden}.falling-drop{--drop-color: #4da3e2;position:absolute;top:118px;left:50%;z-index:3;width:54px;aspect-ratio:.78 / 1;border-radius:58% 58% 62% 14%;background:radial-gradient(circle at 36% 26%,rgba(255,255,255,.78),transparent 18%),var(--drop-color);box-shadow:0 18px 34px color-mix(in srgb,var(--drop-color) 34%,transparent);transform:translate(-50%) rotate(45deg);animation:dropFall 2.4s ease-in-out forwards}.drop-pond-wrap{align-self:end;display:grid;place-items:center;padding:220px 0 24px}.completion-card{display:grid;gap:10px;justify-items:center;padding:20px;opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease}.completion-card.visible{opacity:1;transform:translateY(0)}.completion-card p{margin:0;color:#52627a;line-height:1.7;text-align:center}.primary-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border:0;border-radius:999px;color:#fff;background:#3b78c7;box-shadow:0 14px 30px #3b78c733;font-weight:800;text-decoration:none}.detail-card,.placeholder-card{display:grid;gap:18px;justify-items:center;padding:24px 18px}.placeholder-card{margin-top:24px;justify-items:start}.placeholder-card h2,.placeholder-card p{margin:0}.placeholder-card p{color:#62718a;line-height:1.8}.total-card{display:flex;align-items:center;justify-content:space-between;width:100%;padding:16px;border-radius:20px;background:#eff7ffdb}.total-card span{color:#65758e;font-weight:800}.total-card strong{color:#172033;font-size:1.6rem}.summary-list{display:grid;width:100%;gap:10px}.summary-row{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:12px;border:1px solid rgba(210,224,240,.76);border-radius:18px;background:#ffffff9e}.summary-row div{display:flex;gap:8px;align-items:center}.summary-dot{width:12px;aspect-ratio:1;border-radius:50%}.summary-bar{grid-column:1 / -1;height:8px;overflow:hidden;border-radius:999px;background:#edf4fb}.summary-bar span{display:block;height:100%;border-radius:inherit}.history-stream{display:flex;flex-direction:column;gap:22px;padding:30px 6px 40px}.history-intro{max-width:24rem;margin:18px 0 0;color:#66748a;line-height:1.8}.history-pond{display:grid;gap:7px;width:var(--history-width);margin-top:-2px;border:0;color:#52627a;background:transparent;text-align:center;transform:translate(var(--history-shift));animation:pondFloat 5.6s ease-in-out var(--float-delay) infinite alternate}.history-pond:before{content:"";grid-area:1 / 1;width:calc(var(--history-width) * .92);aspect-ratio:1.9 / 1;align-self:center;justify-self:center;border-radius:50%;background:#ffffff73;filter:blur(18px);transform:translateY(18px)}.history-pond .water-pond{grid-area:1 / 1;justify-self:center}.history-pond-name,.history-pond-date{position:relative;z-index:1}.history-pond-name{color:#28384e;font-weight:900;line-height:1.35}.history-pond-date{color:#748298;font-size:.82rem;font-weight:800}.history-pond-sunrise{margin-bottom:12px}.history-pond-moonlit,.history-pond-starlit{margin-bottom:26px}.history-pond-rain,.history-pond-deepsea{margin-bottom:18px}.history-detail{position:relative;min-height:100vh;padding:24px 20px 104px;overflow:hidden;color:var(--world-text);background:var(--world-background);isolation:isolate}.history-detail:before,.history-detail:after{content:"";position:absolute;inset:auto -20% -15%;z-index:-1;height:42vh;background:radial-gradient(ellipse at 50% 12%,rgba(255,255,255,.6),transparent 54%),linear-gradient(180deg,transparent,var(--world-ground));pointer-events:none}.history-detail:after{inset:0;z-index:-2;background:var(--world-texture);opacity:.72}.history-detail-close{position:relative;z-index:4;display:grid;place-items:center;width:44px;aspect-ratio:1;border:1px solid rgba(255,255,255,.58);border-radius:50%;color:var(--world-text);background:#ffffff52;box-shadow:0 18px 44px #24385424;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);font-size:1.25rem;font-weight:900}.world-sky{position:absolute;inset:0;z-index:-1;pointer-events:none}.world-orb{position:absolute;top:var(--orb-top);right:var(--orb-right);width:var(--orb-size);aspect-ratio:1;border-radius:50%;background:var(--orb-color);box-shadow:var(--orb-glow);opacity:var(--orb-opacity)}.world-cloud{position:absolute;width:210px;aspect-ratio:2.4 / 1;border-radius:50%;background:#ffffff61;filter:blur(18px);animation:cloudDrift 11s ease-in-out infinite alternate}.world-cloud-one{top:14%;left:-18%}.world-cloud-two{top:26%;right:-22%;animation-duration:14s}.world-stars{position:absolute;inset:0;opacity:var(--star-opacity);background:radial-gradient(circle at 22% 17%,rgba(255,255,255,.96) 0 1px,transparent 2px),radial-gradient(circle at 78% 12%,rgba(255,255,255,.86) 0 1px,transparent 2px),radial-gradient(circle at 64% 34%,rgba(255,255,255,.74) 0 1px,transparent 2px),radial-gradient(circle at 30% 48%,rgba(255,255,255,.64) 0 1px,transparent 2px)}.world-rain{position:absolute;inset:0;opacity:var(--rain-opacity);background-image:linear-gradient(110deg,transparent 0 43%,rgba(255,255,255,.38) 44% 46%,transparent 47%);background-size:28px 74px;animation:rainFall 1.2s linear infinite}.history-detail-content{position:relative;z-index:1;display:grid;justify-items:center;gap:18px;min-height:calc(100vh - 156px);align-content:center;padding:22px 0 0;text-align:center}.history-detail-date,.history-detail-copy{margin:0}.history-detail-date{color:var(--world-muted);font-weight:900}.history-detail h2{max-width:10em;margin:0;color:var(--world-text);font-size:clamp(2rem,11vw,3.8rem);line-height:1.04;text-shadow:0 16px 44px rgba(40,56,84,.16)}.history-detail .water-pond{filter:drop-shadow(0 34px 44px var(--world-shadow))}.history-detail-copy{max-width:28rem;color:var(--world-text);line-height:2}.drop-count{display:inline-grid;gap:3px;min-width:142px;padding:13px 18px;border:1px solid rgba(255,255,255,.58);border-radius:22px;background:#ffffff57;box-shadow:0 18px 54px #2640621f;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.drop-count span{color:var(--world-muted);font-size:.78rem;font-weight:900}.drop-count strong{font-size:1.8rem}.memory-ratios{display:grid;width:min(100%,390px);gap:9px;padding:14px;border:1px solid rgba(255,255,255,.56);border-radius:26px;background:#ffffff47;box-shadow:0 18px 54px #2640621a;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}.memory-ratio{display:grid;grid-template-columns:88px 1fr 44px;gap:10px;align-items:center;color:var(--world-text);font-size:.9rem}.memory-ratio-label{display:flex;gap:7px;align-items:center;font-weight:900}.memory-ratio-water{height:8px;overflow:hidden;border-radius:999px;background:#ffffff6b}.memory-ratio-water span{display:block;height:100%;border-radius:inherit;opacity:.74}.history-detail-sunrise{--world-background: linear-gradient(180deg, #ffe2bd 0%, #f7bad2 45%, #d8efff 100%);--world-text: #5b3755;--world-muted: #836271;--world-ground: rgba(255, 245, 225, .9);--world-shadow: rgba(213, 111, 122, .22);--world-texture: radial-gradient(circle at 18% 18%, rgba(255, 255, 255, .52), transparent 22rem);--orb-top: 13%;--orb-right: 16%;--orb-size: 92px;--orb-color: #fff2b8;--orb-glow: 0 0 72px rgba(255, 194, 111, .68);--orb-opacity: .9;--star-opacity: 0;--rain-opacity: 0}.history-detail-moonlit{--world-background: linear-gradient(180deg, #14213e 0%, #2c3d75 52%, #dfe9ff 100%);--world-text: #f7fbff;--world-muted: #d3def3;--world-ground: rgba(223, 233, 255, .7);--world-shadow: rgba(19, 34, 64, .44);--world-texture: radial-gradient(circle at 30% 30%, rgba(117, 145, 211, .34), transparent 18rem);--orb-top: 11%;--orb-right: 18%;--orb-size: 74px;--orb-color: #fff9df;--orb-glow: 0 0 58px rgba(241, 237, 210, .46);--orb-opacity: .92;--star-opacity: .9;--rain-opacity: 0}.history-detail-sunbeam{--world-background: linear-gradient(180deg, #dff7dd 0%, #bfe5d8 48%, #f8fff4 100%);--world-text: #244d43;--world-muted: #587a69;--world-ground: rgba(242, 255, 237, .86);--world-shadow: rgba(64, 126, 92, .2);--world-texture: linear-gradient(125deg, rgba(255, 255, 255, .55) 0 12%, transparent 13% 26%, rgba(255, 255, 255, .34) 27% 36%, transparent 37%);--orb-top: 12%;--orb-right: 12%;--orb-size: 118px;--orb-color: rgba(255, 249, 202, .74);--orb-glow: 0 0 86px rgba(255, 236, 160, .64);--orb-opacity: .72;--star-opacity: 0;--rain-opacity: 0}.history-detail-rain{--world-background: linear-gradient(180deg, #cad2df 0%, #edf3f8 52%, #d8e7ee 100%);--world-text: #344557;--world-muted: #627386;--world-ground: rgba(235, 245, 250, .82);--world-shadow: rgba(62, 82, 105, .22);--world-texture: radial-gradient(circle at 20% 18%, rgba(255, 255, 255, .36), transparent 16rem);--orb-top: 9%;--orb-right: 20%;--orb-size: 96px;--orb-color: rgba(255, 255, 255, .22);--orb-glow: 0 0 66px rgba(255, 255, 255, .22);--orb-opacity: .44;--star-opacity: 0;--rain-opacity: .9}.history-detail-starlit{--world-background: linear-gradient(180deg, #191645 0%, #4e3d89 46%, #c9d7ff 100%);--world-text: #fbf8ff;--world-muted: #dfd8ff;--world-ground: rgba(214, 223, 255, .72);--world-shadow: rgba(32, 25, 76, .46);--world-texture: radial-gradient(circle at 76% 22%, rgba(236, 120, 183, .24), transparent 16rem);--orb-top: 12%;--orb-right: 14%;--orb-size: 58px;--orb-color: #f8e8ff;--orb-glow: 0 0 58px rgba(236, 120, 183, .5);--orb-opacity: .78;--star-opacity: 1;--rain-opacity: 0}.history-detail-rainbow{--world-background: linear-gradient(160deg, #fbe5bf 0%, #d8f2ff 34%, #f8d7ec 70%, #e6f7d7 100%);--world-text: #455061;--world-muted: #6e7a8a;--world-ground: rgba(255, 255, 255, .74);--world-shadow: rgba(117, 132, 178, .2);--world-texture: radial-gradient(circle at 22% 28%, rgba(255, 255, 255, .46), transparent 18rem);--orb-top: 13%;--orb-right: 14%;--orb-size: 98px;--orb-color: rgba(255, 255, 255, .42);--orb-glow: 0 0 84px rgba(255, 255, 255, .54);--orb-opacity: .8;--star-opacity: .2;--rain-opacity: 0}.history-detail-deepsea{--world-background: linear-gradient(180deg, #0e2546 0%, #1f6585 52%, #b9dce9 100%);--world-text: #f2fbff;--world-muted: #cdeaf2;--world-ground: rgba(190, 222, 233, .72);--world-shadow: rgba(12, 43, 70, .42);--world-texture: radial-gradient(circle at 62% 38%, rgba(80, 184, 203, .24), transparent 18rem);--orb-top: 18%;--orb-right: 22%;--orb-size: 68px;--orb-color: rgba(196, 245, 255, .32);--orb-glow: 0 0 76px rgba(104, 207, 224, .34);--orb-opacity: .62;--star-opacity: .34;--rain-opacity: 0}.history-detail-evening{--world-background: linear-gradient(180deg, #f7a072 0%, #d6738f 45%, #cedcff 100%);--world-text: #fff9fb;--world-muted: #ffe7ee;--world-ground: rgba(236, 222, 255, .74);--world-shadow: rgba(141, 65, 96, .32);--world-texture: radial-gradient(circle at 18% 26%, rgba(255, 244, 205, .38), transparent 18rem);--orb-top: 18%;--orb-right: 16%;--orb-size: 96px;--orb-color: #ffe7a8;--orb-glow: 0 0 76px rgba(255, 178, 98, .54);--orb-opacity: .82;--star-opacity: .18;--rain-opacity: 0}.modal-backdrop{position:fixed;inset:0;z-index:30;display:grid;place-items:end center;padding:20px;background:#23334a3d;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.modal-card{position:relative;display:grid;gap:16px;justify-items:center;width:min(100%,480px);max-height:86vh;padding:26px 18px;overflow:auto}.modal-card h2{margin:0}.close-button{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:38px;aspect-ratio:1;border:0;border-radius:50%;color:#52627a;background:#eef6ff;font-size:1.2rem}.state-view{display:grid;min-height:100vh;place-items:center;gap:16px;padding:28px;color:#52627a;text-align:center}.state-view p{margin:0;line-height:1.7}.loading-water{width:128px;aspect-ratio:1.9 / 1;border-radius:50%;background:linear-gradient(135deg,#4da3e259,#ec78b742);filter:blur(.2px);animation:waterBreath 1.8s ease-in-out infinite alternate}@keyframes waterBreath{0%{transform:scale(.96);opacity:.72}to{transform:scale(1.04);opacity:1}}@keyframes dropFall{0%{opacity:0;transform:translate(-50%,-42px) rotate(45deg) scale(.86)}18%{opacity:1}78%{transform:translate(-50%,260px) rotate(45deg) scale(1)}88%{transform:translate(-50%,238px) rotate(45deg) scale(.94)}to{opacity:0;transform:translate(-50%,266px) rotate(45deg) scale(.74)}}@keyframes ripple{0%{opacity:.82;transform:scale(.3)}to{opacity:0;transform:scale(4.6)}}@keyframes stainSpread{0%{opacity:0;transform:translateY(10px) scale(.2)}30%{opacity:.56}to{opacity:.22;transform:translateY(0) scale(2.8)}}@keyframes pondFloat{0%{transform:translate(var(--history-shift)) translateY(0) rotate(-.8deg)}to{transform:translate(calc(var(--history-shift) + 4px)) translateY(-8px) rotate(.8deg)}}@keyframes cloudDrift{0%{transform:translate(-8px)}to{transform:translate(16px)}}@keyframes rainFall{0%{background-position:0 0}to{background-position:0 74px}}@media(min-width:760px){.app-shell{margin-top:18px;margin-bottom:18px;min-height:calc(100vh - 36px);border-radius:34px;overflow:hidden}.page{min-height:calc(100vh - 36px)}}@media(max-width:390px){.emotion-grid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.falling-drop{opacity:0;animation-name:none}.completion-card{opacity:1;transform:none}}