@font-face{font-family:"Schäumi Display";src:url("./fonts/baloo2.ttf") format("truetype");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"Schäumi Voice";src:url("./fonts/patrick-hand.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Steuer Mono";src:url("./fonts/ibm-plex-mono-medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
.schaeumi-stage{--mascot-ink:#514267;--mascot-paper:#eeebfa;position:relative;display:block;width:174px;height:150px;flex:0 0 174px;overflow:hidden;border-radius:24px;isolation:isolate}
.schaeumi-play{position:absolute;inset:0;border:0;background:none;color:inherit;padding:0;cursor:pointer;transform-origin:50% 85%;-webkit-tap-highlight-color:transparent}
.schaeumi-play svg{display:block;width:100%;height:100%;overflow:visible}
.schaeumi-play:focus-visible{outline:2px solid var(--mascot-ink);outline-offset:-5px;border-radius:22px}
.schaeumi-eyes{transform-box:fill-box;transform-origin:center;animation:schaeumi-blink 13s infinite}
.schaeumi-crease{opacity:0;transform-origin:80px 35px;transition:opacity .2s ease,transform .3s ease}
.schaeumi-stage[data-mood="thinking"] .schaeumi-crease{opacity:1;transform:rotate(-9deg)}
.schaeumi-stage[data-mood="attention"] .schaeumi-crease{opacity:1;transform:translateY(4px)}
.schaeumi-eyes ellipse{transform-box:fill-box;transform-origin:center;transition:transform .25s ease}
.schaeumi-eyes ellipse:first-child{transform:scaleY(.45) rotate(-16deg)}
.schaeumi-eyes ellipse:last-child{transform:scaleY(.45) rotate(16deg)}
.schaeumi-stage[data-mood="thinking"] .schaeumi-eyes ellipse:first-child{transform:scaleY(.5) rotate(-14deg)}
.schaeumi-stage[data-mood="thinking"] .schaeumi-eyes ellipse:last-child{transform:scaleY(.45) rotate(12deg)}
.schaeumi-stage[data-mood="attention"] .schaeumi-eyes ellipse:first-child{transform:scaleY(.35) rotate(-22deg)}
.schaeumi-stage[data-mood="attention"] .schaeumi-eyes ellipse:last-child{transform:scaleY(.35) rotate(22deg)}
.schaeumi-panic-brows{opacity:0;transition:opacity .2s ease}
.schaeumi-stage[data-mood="confused"] .schaeumi-crease{opacity:1;transform:translate(-2px,2px) rotate(-16deg)}
.schaeumi-stage[data-mood="confused"] .schaeumi-eyes ellipse:first-child{transform:scaleY(.4) rotate(-18deg)}
.schaeumi-stage[data-mood="confused"] .schaeumi-eyes ellipse:last-child{transform:scaleY(.4) rotate(18deg)}
.schaeumi-stage[data-mood="confused"] .schaeumi-head{transform-origin:80px 95px;transform:rotate(-7deg)}
.schaeumi-stage[data-mood="wow"] .schaeumi-crease{opacity:1;transform:translateY(-3px) rotate(-7deg)}
.schaeumi-stage[data-mood="wow"] .schaeumi-eyes ellipse:first-child{transform:scale(1.15,.5) rotate(-18deg)}
.schaeumi-stage[data-mood="wow"] .schaeumi-eyes ellipse:last-child{transform:scale(1.15,.5) rotate(18deg)}
.schaeumi-stage[data-mood="wow"] .schaeumi-head{transform-origin:80px 95px;animation:schaeumi-delight .8s ease both}
.schaeumi-stage[data-mood="panic"] .schaeumi-panic-brows,.schaeumi-stage[data-mood="panic"] .schaeumi-crease{opacity:1}
.schaeumi-stage[data-mood="panic"] .schaeumi-eyes ellipse:first-child{transform:scaleY(.35) rotate(-24deg)}
.schaeumi-stage[data-mood="panic"] .schaeumi-eyes ellipse:last-child{transform:scaleY(.35) rotate(24deg)}
.schaeumi-stage[data-mood="panic"] .schaeumi-head{transform-origin:80px 95px;animation:schaeumi-fluster .8s ease both}
.schaeumi-caption{flex:1;min-width:0;padding:12px 0}
.schaeumi-speech{display:block;position:relative;background:rgba(255,255,255,.72);color:#514267;font-size:14px;line-height:1.4;font-weight:550;border-radius:15px 15px 3px 15px;padding:12px 14px;margin-top:10px;max-width:290px;text-wrap:pretty}
.hero-eyebrow:has(.schaeumi-speech){gap:6px;margin-bottom:0;min-height:150px}
.schaeumi-speech[data-kind="playful"]{font-style:italic}
@keyframes schaeumi-delight{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-7px) rotate(-5deg)}70%{transform:translateY(-2px) rotate(3deg)}}
@keyframes schaeumi-fluster{0%,100%{transform:rotate(0)}20%{transform:rotate(-5deg)}40%{transform:rotate(5deg)}60%{transform:rotate(-3deg)}80%{transform:rotate(2deg)}}
.hero-eyebrow:has(.schaeumi-stage){min-height:140px;margin-top:-22px;margin-bottom:-20px}
.schaeumi-stage[data-move="float"] .schaeumi-play{animation:schaeumi-float 2.2s ease-in-out}
.schaeumi-stage[data-move="tilt"] .schaeumi-play{animation:schaeumi-tilt 2.2s ease-in-out}
.schaeumi-stage[data-move="peek"] .schaeumi-play{animation:schaeumi-peek 2.2s ease-in-out}
.schaeumi-stage[data-move="wiggle"] .schaeumi-play{animation:schaeumi-wiggle .7s ease-in-out}
.schaeumi-stage[data-move="bounce"] .schaeumi-play{animation:schaeumi-bounce 1s ease-in-out}
.login-brand .schaeumi-stage{--mascot-ink:var(--lime);--mascot-paper:var(--deep);width:220px;height:195px;flex-basis:195px}
.brand .schaeumi-stage.schaeumi-logo{--mascot-ink:var(--lime);--mascot-paper:var(--deep);position:relative;inset:auto;width:52px;height:50px;flex:0 0 52px;border-radius:0;overflow:visible}
.sidebar .brand{flex-wrap:wrap;column-gap:8px;row-gap:0}
.sidebar .brand .schaeumi-stage.schaeumi-logo{width:84px;height:72px;flex-basis:100%}
.sidebar .brand .schaeumi-logo .schaeumi-play{width:84px;left:-4px}
.sidebar .brand>span:last-child{padding-top:3px}
.brand .schaeumi-play{cursor:inherit}
@keyframes schaeumi-blink{0%,39%,41%,100%{transform:scaleY(1)}40%{transform:scaleY(.08)}}
@keyframes schaeumi-float{0%,100%{transform:translate(0,0) rotate(0)}45%{transform:translate(-6px,-7px) rotate(-4deg)}75%{transform:translate(4px,-3px) rotate(2deg)}}
@keyframes schaeumi-tilt{0%,100%{transform:rotate(0)}35%,60%{transform:rotate(9deg)}80%{transform:rotate(-3deg)}}
@keyframes schaeumi-peek{0%,100%{transform:translateY(0)}30%{transform:translate(12px,40px) rotate(12deg)}60%{transform:translate(-6px,20px) rotate(-7deg)}}
@keyframes schaeumi-wiggle{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-9deg)}40%,80%{transform:rotate(9deg)}}
@keyframes schaeumi-bounce{0%,100%{transform:translateY(0)}30%{transform:translateY(-10px) rotate(-7deg)}60%{transform:translateY(2px) rotate(5deg)}80%{transform:translateY(-4px)}}
@media(max-width:760px){.schaeumi-stage{width:134px;height:118px;flex-basis:134px}.hero-eyebrow:has(.schaeumi-stage){min-height:110px;margin-top:-16px;margin-bottom:-17px;gap:8px}.hero-eyebrow .kicker{min-width:0;overflow-wrap:anywhere}.login-brand .schaeumi-stage{position:absolute;right:22px;bottom:24px;width:100px;height:95px}.sidebar .brand{flex-wrap:nowrap}.sidebar .brand .schaeumi-stage.schaeumi-logo{width:64px;height:52px;flex-basis:64px}.sidebar .brand .schaeumi-logo .schaeumi-play{width:64px;left:0}.sidebar .brand>span:last-child{padding-top:0}}
@media(prefers-reduced-motion:reduce){.schaeumi-stage *{animation:none!important;transition:none!important}}
@media(max-width:760px){.hero-eyebrow:has(.schaeumi-speech){margin-bottom:0;min-height:135px}.schaeumi-speech{font-size:12px;padding:10px;margin-top:8px}.hero-eyebrow:has(.schaeumi-speech)>.schaeumi-stage{width:110px;flex-basis:110px}}

/* Two voices in one wordmark: orderly accounting, playful Schäumi. */
.brand>span:last-child{display:inline-flex;align-items:baseline;gap:.12em;white-space:nowrap}
.brand strong{font-family:"Steuer Mono",ui-monospace,monospace;font-size:.65em;font-weight:500;letter-spacing:-.045em}
.brand b{font-family:"Schäumi Display",sans-serif;font-size:1em;font-weight:700;letter-spacing:-.035em;line-height:1}
.sidebar .brand,.login-brand .brand{font-size:27px}
.schaeumi-speech{font-family:"Schäumi Voice",sans-serif;font-size:22px;font-weight:400;line-height:1.18;letter-spacing:0}
.schaeumi-speech[data-kind="playful"]{font-style:normal}
.schaeumi-stage[data-mood="done"] .schaeumi-head{transform-origin:80px 95px;animation:schaeumi-nod 1.1s ease both}
@keyframes schaeumi-nod{0%,100%{transform:translateY(0) rotate(-3deg)}35%{transform:translateY(5px) rotate(3deg)}65%{transform:translateY(-2px) rotate(-3deg)}}
.hero-eyebrow:has(.schaeumi-speech){margin-bottom:0}
@media(max-width:1100px) and (min-width:761px){.sidebar .brand{font-size:24px}}
@media(max-width:760px){.schaeumi-speech{font-size:20px}.sidebar .brand{font-size:27px}}

/* Compact speech with a pointer to the speaker, instead of an information card. */
.schaeumi-speech{--bubble-paper:#eeebfa;--bubble-ink:#67577e;background:var(--bubble-paper);color:var(--bubble-ink);border:1.5px solid currentColor;border-radius:22px 24px 20px 16px;padding:10px 15px;box-shadow:none;width:fit-content;max-width:100%;font-size:21px;line-height:1.2}
.schaeumi-speech:after{content:"";position:absolute;width:10px;height:10px;bottom:-6px;left:55%;background:var(--bubble-paper);border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.hero-eyebrow .schaeumi-speech:after{bottom:auto;left:auto;right:-6px;top:50%;transform:rotate(-45deg)}
.schaeumi-speech[hidden]{display:none!important}
.schaeumi-unhappy-brows{opacity:0;transition:opacity .2s}
.schaeumi-stage[data-mood="dissatisfied"] .schaeumi-crease{opacity:1;stroke-width:5;transform:translateY(7px)}
.schaeumi-stage[data-mood="dissatisfied"] .schaeumi-unhappy-brows{opacity:1}
.schaeumi-stage[data-mood="dissatisfied"] .schaeumi-eyes ellipse:first-child{transform:scaleY(.24) rotate(-30deg)}
.schaeumi-stage[data-mood="dissatisfied"] .schaeumi-eyes ellipse:last-child{transform:scaleY(.24) rotate(30deg)}
.schaeumi-stage[data-mood="dissatisfied"] .schaeumi-head{transform-origin:80px 95px;transform:translateY(3px) rotate(-3deg)}
.schaeumi-settings{padding:20px;border:1px solid #dbe2d8;border-radius:16px;background:#fffefa;margin:0 0 24px;display:grid;grid-template-columns:1fr minmax(180px,260px);gap:10px 20px;align-items:center}
.schaeumi-settings label{font:600 16px system-ui;color:#203d34}
.schaeumi-settings select{font:400 14px system-ui;border:1px solid #c6d2c7;border-radius:10px;padding:11px;background:white;color:#203d34;max-width:100%;min-height:44px}
.schaeumi-settings p{font:400 13px/1.5 system-ui;color:#65766f;margin:0}
.schaeumi-settings small{font:400 12px system-ui;color:#65766f;min-height:18px}
.preview-settings{margin:12px 0 24px}.preview-settings summary{cursor:pointer;font-size:14px;padding:10px 0}.preview-settings .schaeumi-settings{margin-top:12px}
@media(max-width:600px){.schaeumi-settings{grid-template-columns:1fr}.schaeumi-speech{font-size:20px}}

/* Dedicated space for play; the document controls remain outside it. */
.overview-grid:has(>.schaeumi-companion-card){grid-template-columns:minmax(0,1.45fr) minmax(260px,1fr);gap:14px;align-items:stretch}
.overview-grid>.month-hero{grid-column:1;grid-row:1}
.overview-grid>.capture-card{grid-column:1;grid-row:2;padding:17px 20px}
.overview-grid>.capture-card .capture-heading h2{font-size:16px}
.overview-grid>.capture-card .capture-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0 8px}
.overview-grid>.capture-card .capture-action{flex-direction:row;gap:9px;min-height:62px;padding:8px}
.overview-grid>.capture-card .capture-action>span{width:36px;height:36px}
.overview-grid>.capture-card .capture-action svg{width:22px;height:22px}
.overview-grid>.capture-card .capture-action strong{font-size:13px}
.overview-grid>.capture-card .watch-link{margin-top:8px}
.schaeumi-companion-card{grid-column:2;grid-row:1/span 2;background:#eee8f6;border:1px solid #e3daee;border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:22px 18px;min-width:0;overflow:hidden;isolation:isolate}
.schaeumi-voice{min-height:92px;display:flex;align-items:center;justify-content:center;width:100%;max-width:310px;padding-bottom:12px}
.schaeumi-companion-card .schaeumi-speech{--bubble-paper:#eee8f6;margin:0;max-width:100%}
.schaeumi-companion-card .schaeumi-stage{width:240px;height:220px;flex:0 0 220px;max-width:100%}
.schaeumi-pull-hint{font:400 12px system-ui;color:#82718f;margin-top:6px}
.schaeumi-speech{display:grid;grid-template-areas:'words'}
.schaeumi-speech-current,.schaeumi-speech-old{grid-area:words;align-self:center}
.schaeumi-speech-old{pointer-events:none}
.schaeumi-stage:not(.schaeumi-logo) .schaeumi-play{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.schaeumi-stage:not(.schaeumi-logo) .schaeumi-play svg{animation:schaeumi-drift 6.5s ease-in-out infinite}
.schaeumi-stage[data-pull] .schaeumi-play{animation:none!important;transform:translate(var(--pull-x,0),var(--pull-y,0)) rotate(var(--pull-angle,0deg)) scale(var(--pull-scale,1));transform-origin:50% 50%}
.schaeumi-stage[data-pull="hold"] .schaeumi-play{cursor:grabbing}
.schaeumi-stage[data-pull] .schaeumi-play svg{animation-play-state:paused}
.schaeumi-stage[data-reaction="rage"] .schaeumi-head{animation:schaeumi-rage 1.3s ease-in-out!important;transform-origin:80px 85px}
.schaeumi-stage[data-reaction="spin"] .schaeumi-head{animation:schaeumi-spin 1.3s cubic-bezier(.3,.1,.2,1)!important;transform-origin:80px 80px}
.schaeumi-stage[data-reaction="dance"] .schaeumi-head{animation:schaeumi-dance 1.3s ease-in-out!important;transform-origin:80px 90px}
@keyframes schaeumi-drift{0%,100%{transform:translateY(2px) rotate(-1deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes schaeumi-rage{0%,100%{transform:rotate(0)}15%,35%,55%,75%{transform:translateY(-3px) rotate(-6deg)}25%,45%,65%,85%{transform:translateY(1px) rotate(6deg)}}
@keyframes schaeumi-spin{0%{transform:rotate(0) scale(1)}45%{transform:rotate(210deg) scale(.8)}100%{transform:rotate(360deg) scale(1)}}
@keyframes schaeumi-dance{0%,100%{transform:translate(0,0) rotate(0)}20%,60%{transform:translate(-8px,-5px) rotate(-8deg)}40%,80%{transform:translate(8px,-2px) rotate(8deg)}}
.login-brand .schaeumi-companion-card{background:#19372d;border-color:#315044;position:relative;z-index:1;width:100%;max-width:440px;padding:18px;margin:12px 0}
.login-brand .schaeumi-companion-card .schaeumi-stage{position:relative;inset:auto;width:250px;height:220px;flex:0 0 220px}
.login-brand .schaeumi-companion-card .schaeumi-speech{--bubble-paper:#19372d;--bubble-ink:var(--lime)}
.login-brand .schaeumi-companion-card .schaeumi-pull-hint{color:#a9b99d;letter-spacing:0;font-weight:400}
@media(max-width:760px){
 .overview-grid:has(>.schaeumi-companion-card){grid-template-columns:1fr}
 .overview-grid>.month-hero{grid-column:1;grid-row:1}
 .overview-grid>.schaeumi-companion-card{grid-column:1;grid-row:2}
 .overview-grid>.capture-card{grid-column:1;grid-row:3;padding:16px}
 .schaeumi-companion-card{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:8px;padding:16px}
 .schaeumi-companion-card .schaeumi-stage{width:160px;height:155px;grid-column:2;grid-row:1/span 2}
 .schaeumi-companion-card .schaeumi-voice{min-height:0;grid-column:1;padding:0}
 .schaeumi-companion-card .schaeumi-pull-hint{grid-column:1;font-size:10px;margin:0}
 .schaeumi-companion-card .schaeumi-speech{font-size:19px;padding:10px}
 .login-brand .schaeumi-companion-card{padding:12px;grid-template-columns:minmax(0,1fr) 150px;margin:8px 0}
 .login-brand .schaeumi-companion-card .schaeumi-stage{width:150px;height:145px}
 .login-brand>p{margin:20px 0 6px}
}
@media(prefers-reduced-motion:reduce){.schaeumi-stage *,.schaeumi-stage[data-reaction] .schaeumi-head{animation:none!important;transition:none!important}}

/* Larger at rest, with room for the elastic pull inside her own card. */
.schaeumi-companion-card .schaeumi-stage{overflow:visible}
.schaeumi-companion-card .schaeumi-play{inset:-12px}
.schaeumi-companion-card .schaeumi-voice{position:relative;z-index:2;pointer-events:none}
.schaeumi-stage[data-mood="skeptical"] .schaeumi-crease{opacity:1;transform:rotate(-18deg)}
.schaeumi-stage[data-mood="skeptical"] .schaeumi-eyes ellipse:first-child{transform:scaleY(.2) rotate(-28deg)}
.schaeumi-stage[data-mood="skeptical"] .schaeumi-eyes ellipse:last-child{transform:scaleY(.55) rotate(12deg)}
.schaeumi-stage[data-mood="cheeky"] .schaeumi-eyes ellipse:first-child{transform:scaleX(1.5) scaleY(.15) rotate(-12deg)}
.schaeumi-stage[data-mood="cheeky"] .schaeumi-head{transform:rotate(6deg);transform-origin:80px 85px}
.schaeumi-stage[data-mood="sleepy"] .schaeumi-eyes ellipse{transform:scaleX(1.3) scaleY(.15)}
.schaeumi-stage[data-mood="sleepy"] .schaeumi-head{transform:rotate(-8deg) translateY(4px);transform-origin:80px 85px}
@media(max-width:760px){.schaeumi-companion-card .schaeumi-stage{grid-row:1}.schaeumi-companion-card .schaeumi-play{inset:-8px}}