:root{--brand:#e5484d;--brand-fill:#e5484d;--brand-bright:#e5484d;--tea:#a8c840;--tea-surface:#d9e4a0;--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#a7adba;--text-h:#f2f3f5;--bg:#22242c;--border:#383b46;--code-bg:#2b2e38;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#3a3d4880;--shadow:#00000059 0 10px 15px -3px, #00000038 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}#root{text-align:center;box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}body{margin:0}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}.recorder{flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;min-height:100vh;padding:1.5rem;display:flex}.record-button{background:var(--brand-fill);color:#fff;cursor:pointer;border:none;border-radius:50%;width:9rem;height:9rem;font-size:3rem}.record-button:active{transform:scale(.96)}.record-button.recording{animation:1.6s ease-in-out infinite pulse}@keyframes pulse{0%,to{box-shadow:0 0 0 0 color-mix(in srgb, var(--brand-bright) 50%, transparent)}50%{box-shadow:0 0 0 1.25rem color-mix(in srgb, var(--brand-bright) 0%, transparent)}}.timer{font-variant-numeric:tabular-nums;color:#888;font-size:2rem}.spinner{border:4px solid #8884;border-top-color:var(--brand);border-radius:50%;width:3rem;height:3rem;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.result{text-align:left;flex-direction:column;gap:.5rem;width:100%;max-width:40rem;display:flex}.result h2{color:var(--brand);margin:1rem 0 0;font-size:1rem}.result p{margin:0;line-height:1.7}.result ul{flex-direction:column;gap:.5rem;margin:0;padding-left:1.25rem;display:flex}.result li span{color:#888;font-size:.9rem;display:block}.again-button{border:1px solid var(--brand);color:var(--brand);cursor:pointer;background:0 0;border-radius:2rem;align-self:center;margin-top:1.5rem;padding:.75rem 2rem;font-size:1rem}.error{color:#e5484d}.signin-notice{text-align:center;border:1px solid color-mix(in srgb, var(--brand) 30%, transparent);background:color-mix(in srgb, var(--brand) 7%, transparent);border-radius:.6rem;max-width:22rem;margin:.25rem auto 0;padding:.7rem .9rem;font-size:.9rem;line-height:1.6}.signin-privacy{opacity:.75;font-size:.8rem}.signin-privacy a{color:var(--brand);white-space:nowrap}.app-header{flex-direction:column;gap:.5rem;width:100%;max-width:40rem;display:flex}.app-header-top{justify-content:space-between;align-items:center;display:flex}.app-header h1{margin:0;font-size:1.5rem}.home-button{font:inherit;letter-spacing:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}.home-button:disabled{cursor:default}.app-header nav{justify-content:center;gap:1rem;display:flex}.link-button{color:var(--brand);cursor:pointer;background:0 0;border:none;padding:.25rem 0;font-size:.95rem}.tab-button{color:#888;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;padding:.25rem 0;font-size:.95rem}.tab-button.active{color:var(--brand);border-bottom-color:var(--brand)}.link-button.active{text-underline-offset:3px;font-weight:600;text-decoration:underline}.account{flex-direction:column;align-self:center;width:100%;max-width:32rem;display:flex}.account-heading{margin:.5rem 0 1.25rem;font-size:1.25rem}.account-email-label{color:#888;margin:0;font-size:.85rem}.account-email{word-break:break-all;margin:.15rem 0 1.25rem;font-size:1.05rem}.account-signout{border:1px solid var(--brand);color:var(--brand);cursor:pointer;background:0 0;border-radius:2rem;align-self:flex-start;padding:.6rem 1.6rem;font-size:.95rem}.account-danger{border-top:1px solid #88888859;margin-top:2.5rem;padding-top:1.5rem}.account-danger-title{color:#e5484d;margin:0 0 .5rem;font-size:1rem}.account-danger-desc{margin:0 0 1.1rem;font-size:.9rem;line-height:1.75}.account-delete-open{color:#e5484d;cursor:pointer;background:0 0;border:1px solid #e5484d;border-radius:2rem;align-self:flex-start;padding:.6rem 1.6rem;font-size:.95rem}.account-confirm{flex-direction:column;gap:.7rem;display:flex}.account-confirm-label{font-size:.9rem}.account-confirm-input{max-width:12rem;color:inherit;background:0 0;border:1.5px solid #88888880;border-radius:.5rem;padding:.55rem .75rem;font-size:1rem}.account-confirm-actions{align-items:center;gap:1.25rem;margin-top:.25rem;display:flex}.account-delete-confirm{color:#fff;cursor:pointer;background:#e5484d;border:none;border-radius:2rem;padding:.6rem 1.6rem;font-size:.95rem}.account-delete-confirm:disabled{opacity:.5;cursor:default}.prompt{text-align:center;margin:0;font-size:1.15rem}.hint{color:#888;text-align:center;margin:-1rem 0 0;font-size:.9rem}.prompt-en{color:#888;text-align:center;margin:-1rem 0 0;font-size:.95rem}.collapsible-text{margin:0;line-height:1.7}.collapsible-text.clamped{-webkit-line-clamp:4;line-clamp:4;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.collapsible-text.expandable{cursor:pointer}.collapse-toggle{color:var(--brand);cursor:pointer;background:0 0;border:none;align-self:flex-start;padding:0;font-size:.9rem}.section-guide{color:#888;flex-wrap:wrap;align-items:center;gap:.4rem;font-size:.8rem;display:flex}.section-chip{white-space:nowrap;font:inherit;color:inherit;cursor:pointer;background:0 0;border:1px solid #8884;border-radius:1rem;padding:.1rem .6rem}.jump-flash{animation:1.6s ease-out both jump-flash}@keyframes jump-flash{0%,30%{background:color-mix(in srgb, var(--brand-bright) 16%, transparent);border-radius:4px}}.translation-blocks{flex-direction:column;gap:.9rem;display:flex}.translation-block{border-left:3px solid #8884;flex-direction:column;gap:.2rem;padding-left:.75rem;display:flex}.translation-block .block-ja{color:#888;margin:0;font-size:.85rem;line-height:1.6}.translation-block .block-en{margin:0;line-height:1.7}.expression-mark{background:color-mix(in srgb, var(--brand-bright) 14%, transparent);color:inherit;border-bottom:1.5px dotted var(--brand);cursor:pointer;border-radius:2px;padding:0 .1em}.highlight-legend{color:#888;margin:0 0 .5rem;font-size:.8rem}.block-en-row{align-items:flex-start;gap:.55rem;display:flex}.block-en-row p{flex:1;min-width:0;margin:0}.read-aloud-button{border:1.5px solid var(--brand);background:color-mix(in srgb, var(--brand-bright) 8%, transparent);width:2rem;height:2rem;color:var(--brand);cursor:pointer;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;margin-top:.1rem;font-size:.7rem;line-height:1;display:flex}.read-aloud-button.playing{border-color:var(--brand);color:var(--brand);background:color-mix(in srgb, var(--brand-bright) 10%, transparent)}.read-aloud-button.loading{color:#888;animation:1s ease-in-out infinite read-aloud-pulse}@keyframes read-aloud-pulse{50%{opacity:.4}}.recording-bar{z-index:10;padding:.6rem 1rem calc(.6rem + env(safe-area-inset-bottom));background:var(--bg,#fff);border-top:1px solid var(--border,#8884);text-align:center;justify-content:center;align-items:center;gap:1.5rem;display:flex;position:fixed;bottom:0;left:0;right:0}.recording-bar-label{color:#888;margin:0;font-size:.9rem}.recording-bar .recording-bar-timer{margin:0;font-size:1.5rem}.record-button.compact{flex-shrink:0;width:3.5rem;height:3.5rem;font-size:1.25rem}.recorder.with-recording-bar{padding-bottom:8rem}.otsu-cheer{flex-direction:column;align-self:center;align-items:center;gap:.5rem;margin:1.75rem 0 1.25rem;animation:.4s ease-out otsu-pop;display:flex}.otsu-cheer>svg{width:5.5rem;height:auto;animation:1.8s step-end .4s infinite otsu-bob}svg.mendako.is-tapping{overflow:visible;animation:none!important;transform:none!important}.otsu-cheer p{margin:0}@keyframes otsu-pop{0%{opacity:0;transform:translateY(.6rem)scale(.92)}}@keyframes otsu-bob{0%,49%{transform:translateY(0)}50%,to{transform:translateY(-.25rem)}}.otsu-bubble{border:1.5px solid var(--brand);background:var(--bg,#fff);color:var(--brand);border-radius:1.25rem;padding:.35rem 1rem;font-weight:600;animation:.3s cubic-bezier(.34,1.56,.64,1) both otsu-bubble-pop;position:relative}.otsu-bubble:before{content:"";background:inherit;border-top:1.5px solid var(--brand);border-left:1.5px solid var(--brand);width:.55rem;height:.55rem;position:absolute;top:-.3rem;left:50%;transform:translate(-50%)rotate(45deg)}@keyframes otsu-bubble-pop{0%{opacity:0;transform:scale(.6)}}.otsu-plain-cheer{color:var(--brand);font-weight:600}@media (prefers-reduced-motion:reduce){.otsu-cheer,.otsu-cheer>svg,.otsu-cheer>svg.is-tapping .mendako-body,.mendako-body,.otsu-bubble{animation:none}}.mendako-body{transform-box:fill-box;transform-origin:50% 100%}.mendako-eyes-squint{opacity:0}.is-tapping .mendako-body{animation:1.6s step-end both mendako-tap}.is-tapping .mendako-eyes-open{animation:1.6s step-end both mendako-eyes-open-anim}.is-tapping .mendako-eyes-squint{animation:1.6s step-end both mendako-eyes-squint-anim}@keyframes mendako-tap{0%{transform:scaleY(1)scaleX(1)}10%{transform:scaleY(.78)scaleX(1.13)}40%{transform:scaleY(.8)scaleX(1.1)}60%{transform:scaleY(1.3)scaleX(.82)}80%{transform:scaleY(.95)scaleX(1.04)}to{transform:scaleY(1)scaleX(1)}}@keyframes mendako-eyes-open-anim{0%,8%{opacity:1}12%,50%{opacity:0}56%,to{opacity:1}}@keyframes mendako-eyes-squint-anim{0%,8%{opacity:0}12%,50%{opacity:1}56%,to{opacity:0}}.mendako.expr-happy,.mendako.expr-sad{overflow:visible}.expr-happy .mendako-body{transform:scaleY(1.08)scaleX(.95)}.expr-happy .mendako-eyes-open{opacity:0}.expr-happy .mendako-eyes-squint{opacity:1}.expr-sad .mendako-body{transform:skew(-8deg)scaleY(.82)scaleX(1.06)}.expr-sad .mendako-eyes-open{opacity:0}.a2hs-card{text-align:left;border:1px solid #8884;border-radius:.75rem;flex-direction:column;gap:.6rem;margin-top:1.5rem;padding:.9rem 2.5rem .9rem 1rem;font-size:.9rem;display:flex;position:relative}.a2hs-lead{margin:0;line-height:1.6}.a2hs-lead strong{color:var(--brand)}.a2hs-steps{color:#888;flex-direction:column;gap:.3rem;margin:0;padding-left:1.4rem;display:flex}.a2hs-share-icon{vertical-align:-.2em}.a2hs-note{color:#888;margin:0;font-size:.78rem}.a2hs-close{color:#888;cursor:pointer;background:0 0;border:none;padding:.5rem;font-size:.9rem;line-height:1;position:absolute;top:.25rem;right:.25rem}.a2hs-install-button{border:1px solid var(--brand);color:var(--brand);cursor:pointer;background:0 0;border-radius:1.5rem;align-self:flex-start;padding:.5rem 1.25rem;font-size:.9rem}.a2hs-install-button:disabled{opacity:.6;cursor:default}.feedback{border-top:1px solid #8884;flex-direction:column;align-items:center;gap:.75rem;margin-top:1rem;padding-top:1.25rem;display:flex}.feedback-question{color:#888;margin:0;font-size:.95rem}.rating-buttons{gap:2rem;display:flex}.rating-button{cursor:pointer;color:#888;background:0 0;border:none;border-radius:.75rem;flex-direction:column;align-items:center;gap:.35rem;padding:.4rem .6rem;transition:transform .1s;display:flex}.rating-button svg{display:block}.rating-label{font-size:.85rem;line-height:1}.rating-button:hover:enabled{transform:scale(1.1)}.rating-button:disabled{cursor:default;opacity:.4}.rating-button.selected{opacity:1;transform:scale(1.1)}.rating-good.selected{color:var(--tea)}.rating-bad.selected{color:var(--brand)}.feedback-text{flex-direction:column;align-items:flex-end;gap:.25rem;width:100%;max-width:24rem;display:flex}.feedback-text textarea{width:100%;font:inherit;color:inherit;resize:vertical;background:0 0;border:1px solid #8884;border-radius:.75rem;padding:.6rem .8rem}.feedback-text .link-button:disabled{color:#888;cursor:default}.feedback-text-footer{justify-content:space-between;align-items:center;width:100%;display:flex}.feedback-count{color:#888;font-variant-numeric:tabular-nums;font-size:.8rem}.feedback-count.at-limit{color:#e5484d}.feedback-hint{color:#888;text-align:center;margin:0;font-size:.9rem}.signin-button{background:var(--brand-fill);color:#fff;cursor:pointer;border:none;border-radius:2rem;padding:.85rem 2.25rem;font-size:1.05rem}.signin-button:disabled{opacity:.6;cursor:default}.signin-otsu{width:6rem;height:auto;animation:3.6s step-end 3.2s infinite otsu-hop}.signin-otsu-clip{margin-top:-.4rem;padding-top:1.4rem;display:inline-block;overflow:hidden}.signin-otsu-clip:has(.is-tapping){overflow:visible}.signin-otsu-rise{display:inline-block}@keyframes otsu-hop{0%,50%{transform:translateY(0)}55%{transform:translateY(-.4rem)}60%{transform:translateY(-.9rem)}65%,70%{transform:translateY(-1.2rem)}75%{transform:translateY(-.9rem)}80%{transform:translateY(-.4rem)}85%,to{transform:translateY(0)}}.signin-glow{animation:3.6s step-end 3.2s infinite signin-glow}.recorder:has(.is-tapping) .signin-glow{animation:none}@keyframes signin-glow{0%,50%{box-shadow:none}55%{box-shadow:0 0 0 .2rem color-mix(in srgb, var(--brand-bright) 22%, transparent)}60%{box-shadow:0 0 0 .35rem color-mix(in srgb, var(--brand-bright) 32%, transparent)}65%,70%{box-shadow:0 0 0 .5rem color-mix(in srgb, var(--brand-bright) 42%, transparent)}75%{box-shadow:0 0 0 .35rem color-mix(in srgb, var(--brand-bright) 32%, transparent)}80%{box-shadow:0 0 0 .2rem color-mix(in srgb, var(--brand-bright) 22%, transparent)}85%,to{box-shadow:none}}@media (prefers-reduced-motion:reduce){.signin-otsu,.signin-glow{animation:none}}.history{text-align:left;flex-direction:column;gap:.75rem;width:100%;max-width:40rem;display:flex}.history h2{margin:0}.history-entry{border:1px solid #8884;border-radius:.75rem;padding:.75rem 1rem}.history-entry summary{cursor:pointer;align-items:center;gap:.75rem;display:flex}.history-entry summary time{color:#888;white-space:nowrap;margin-left:auto;font-size:.9rem}.history-entry summary .diary-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.history-entry h3{color:var(--brand);margin:1rem 0 .25rem;font-size:.95rem}.history-entry p{margin:0;line-height:1.7}.history-entry ul{flex-direction:column;gap:.5rem;margin:0;padding-left:1.25rem;display:flex}.history-entry li span{color:#888;font-size:.9rem;display:block}.diary-title{flex:1;min-width:0;font-weight:600}.diary-title.is-untitled{color:#888;font-weight:500}.cal-nav{justify-content:center;align-items:center;gap:1rem;margin:.25rem 0 .5rem;display:flex}.cal-title{text-align:center;min-width:7rem;font-weight:600}.cal-arrow{width:2.25rem;height:2.25rem;color:var(--brand);cursor:pointer;background:0 0;border:1px solid #8884;border-radius:.5rem;font-size:1.25rem;line-height:1}.cal-arrow:hover{background:color-mix(in srgb, var(--brand-bright) 10%, transparent)}.cal-grid{grid-template-columns:repeat(7,1fr);gap:.25rem;display:grid}.cal-weekday{text-align:center;color:#888;padding:.25rem 0;font-size:.75rem}.cal-cell{aspect-ratio:1;color:inherit;background:0 0;border:none;border-radius:.6rem;justify-content:center;align-items:center;padding:0;font-size:.9rem;display:flex;position:relative}.cal-cell.empty{visibility:hidden}.cal-cell:disabled{color:#aaa;cursor:default}.cal-daynum{line-height:1}.cal-cell.has-diary{cursor:pointer;background:color-mix(in srgb, var(--tea) 18%, transparent);font-weight:600}.cal-cell.has-diary:hover{background:color-mix(in srgb, var(--tea) 30%, transparent)}.cal-stamp{color:var(--tea);position:absolute;top:.15rem;right:.2rem}.cal-count{color:var(--brand);font-size:.65rem;font-weight:600;position:absolute;bottom:.1rem;right:.25rem}.cal-cell.is-today{box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--brand) 45%, transparent)}.cal-cell.is-selected{box-shadow:inset 0 0 0 2px var(--brand)}.cal-day{flex-direction:column;gap:.6rem;margin-top:.75rem;display:flex}.cal-day-title{color:var(--brand);margin:.25rem 0;font-size:1rem}.title-edit-open{color:var(--brand);cursor:pointer;background:0 0;border:1px solid #8884;border-radius:999px;align-self:flex-start;margin-top:.75rem;padding:.25rem .75rem;font-size:.8rem}.title-edit{flex-direction:column;gap:.5rem;margin-top:.75rem;display:flex}.title-edit-input{box-sizing:border-box;border:1px solid var(--brand);border-radius:.5rem;width:100%;padding:.5rem .6rem;font-size:1rem}.title-edit-actions{align-items:center;gap:.75rem;display:flex}.title-edit-save{background:var(--brand-fill);color:#fff;cursor:pointer;border:none;border-radius:.5rem;padding:.4rem 1rem;font-size:.9rem}.title-edit-save:disabled{opacity:.6;cursor:default}.wordmark{white-space:nowrap}.wordmark-u{aspect-ratio:22/24;height:.58em;margin-left:.06em}.wordmark-u .cup{fill:none;stroke:currentColor;stroke-width:3.4px}.wordmark-u .tea{fill:var(--tea)}.wordmark-u .tea-surface{fill:var(--tea-surface)}.wordmark-u-wrap{vertical-align:baseline;display:inline-flex;position:relative}.wordmark-steam{pointer-events:none;width:.5em;height:.5em;margin-bottom:-.14em;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.wordmark-steam svg{width:100%;height:100%;display:block;overflow:visible}.steam-wisp{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;opacity:.3;transform-box:fill-box;transform-origin:bottom}@media (prefers-reduced-motion:no-preference){.sw1{opacity:0;animation:1s steps(3,end) .6s both steam-in}.sw2{opacity:0;animation:1s steps(3,end) .85s both steam-in}}.signin-h1 .sw1{animation-delay:2.2s}.signin-h1 .sw2{animation-delay:2.45s}@keyframes steam-in{0%{opacity:0;transform:translateY(4px)scaleY(.5)}to{opacity:.3;transform:translateY(0)scaleY(1)}}.signin-h1{position:relative}.pour-scene{width:0;height:0;position:absolute;bottom:.75em;left:100%}.pour-otsu{opacity:0;width:4.2rem;height:auto;position:absolute;bottom:.35rem;left:-1.1rem;transform:rotate(-55deg)}.pour-drop{background:var(--tea);opacity:0;width:.3rem;height:.3rem;position:absolute}.pour-drop.d1{bottom:-.15rem;left:-.85rem}.pour-drop.d2{bottom:-.6rem;left:-.7rem}.pour-drop.d3{bottom:-1.05rem;left:-.9rem}@media (prefers-reduced-motion:no-preference){.pour-otsu{animation:.1s step-end .3s both pour-appear,.6s steps(3,end) 2.1s forwards pour-leave}.pour-drop{animation:.45s steps(2,end) 3 drop-fall}.pour-drop.d1{animation-delay:.7s}.pour-drop.d2{animation-delay:.85s}.pour-drop.d3{animation-delay:1s}.signin-h1 .wordmark-u .tea-1{opacity:0;animation:.1s step-end 1s forwards tea-appear}.signin-h1 .wordmark-u .tea-2{opacity:0;animation:.1s step-end 1.5s forwards tea-appear}.signin-h1 .wordmark-u .tea-3{opacity:0;animation:.1s step-end 2s forwards tea-appear}.signin-otsu-rise{animation:.5s steps(3,end) 2.7s both otsu-rise}}@keyframes pour-appear{to{opacity:1}}@keyframes pour-leave{0%{opacity:1;transform:rotate(-55deg)}60%{opacity:1;transform:translate(2.5rem,-.5rem)rotate(-30deg)}to{opacity:0;transform:translate(5rem,-1rem)rotate(-15deg)}}@keyframes drop-fall{0%{opacity:1;transform:translateY(0)}to{opacity:1;transform:translateY(.9rem)}}@keyframes tea-appear{to{opacity:1}}@keyframes otsu-rise{0%{transform:translateY(105%)}}
