/* The bottle is the progress indicator and stays in sight while answering. */
.star-header{position:sticky;top:0;z-index:10;padding-top:8px;padding-bottom:10px;background:#f7f6f2f5;backdrop-filter:blur(12px);border-radius:0 0 24px 24px}
.star-progress{display:grid;grid-template-columns:minmax(0,1fr) 240px;align-items:center;gap:12px;min-height:150px;padding:4px 18px 4px 24px;border:1px solid #e9e0cc;border-radius:22px;background:linear-gradient(115deg,#fffdf6,#f6f1e5);isolation:isolate}
.star-copy{padding:10px 0;min-width:0}.star-kicker{font-size:10px;color:#a28b5b;letter-spacing:1.4px}.star-copy h2{font-size:19px;font-weight:600;color:#75613e;line-height:1.5;margin:5px 0 6px}.star-encouragement{font-size:12px;line-height:1.8;color:#958770;margin:0 0 8px;max-width:360px}.star-count{display:inline-block;font-size:11px;color:#a18f6a;font-variant-numeric:tabular-nums}.star-count b{font-size:16px;font-weight:600;color:#9b7b38}.star-count>span{font-size:10px}.star-scene{display:block;width:100%;overflow:visible;color:#b69b63}.star-header .flow-tools{margin:8px 3px 0;font-size:11px}.star-header .text-button{font-size:11px}
.star-companion{transform-origin:60px 130px}.toss-paw{transform-origin:73px 119px}.flying-star{opacity:0;transform:translate(83px,105px)}.jar-sparkles{opacity:.4}.star-jar{transform-origin:207px 136px}
.is-milestone .star-copy h2{color:#9b7438}.is-full{background:linear-gradient(115deg,#fff9e9,#f5edda 70%,#eee7f2);border-color:#dfcc9c}
.is-overflowing .star-jar{animation:jar-overflow 2.6s both;animation-delay:var(--overflow-elapsed)}
.overflow-star{opacity:0;animation:star-overflow 2s cubic-bezier(.2,.65,.45,1) both;animation-delay:calc(var(--overflow-elapsed) + var(--particle-delay))}
@keyframes companion-toss{0%,100%{transform:rotate(0) translateY(0)}20%{transform:rotate(-7deg) translateY(3px)}40%{transform:rotate(6deg) translateY(-5px)}60%{transform:rotate(-2deg) translateY(0)}}
@keyframes paw-toss{0%,100%{transform:rotate(0)}22%{transform:rotate(22deg)}38%,52%{transform:rotate(-55deg)}75%{transform:rotate(-8deg)}}
@keyframes jar-catch{0%,62%,100%{transform:rotate(0) scale(1)}74%{transform:rotate(-3deg) scale(1.03,.97)}86%{transform:rotate(2deg)}}
@keyframes jar-twinkle{0%,50%,100%{opacity:.4}75%{opacity:1}}
@keyframes jar-overflow{0%,23%,100%{transform:rotate(0)}32%{transform:rotate(-4deg) scale(1.04,.97)}42%{transform:rotate(4deg)}52%{transform:rotate(-3deg)}63%{transform:rotate(2deg)}76%{transform:rotate(0)}}
@keyframes star-overflow{0%{opacity:0;transform:translate(0,6px) scale(.25)}10%{opacity:1}42%{opacity:1;transform:translate(var(--burst-x),var(--burst-y)) rotate(var(--spin)) scale(1)}82%{opacity:.85}100%{opacity:0;transform:translate(var(--burst-x),var(--fall-y)) rotate(var(--spin)) scale(.5)}}
@media(max-width:720px){.star-header{padding:5px 15px 8px}.star-progress{grid-template-columns:minmax(0,1fr) 132px;gap:0;padding:6px 9px 6px 15px;min-height:130px;border-radius:18px}.star-copy{padding:6px 0}.star-kicker{font-size:9px;letter-spacing:.4px}.star-copy h2{font-size:15px;margin:5px 0}.star-encouragement{font-size:10px;line-height:1.75;margin-bottom:5px}.star-count{font-size:10px}.star-count b{font-size:14px}.star-header .flow-tools,.star-header .text-button{font-size:10px}.star-scene{width:146px;margin-left:-7px}}
@media(prefers-reduced-motion:reduce){.star-progress *{animation:none!important}.flying-star,.overflow-star{display:none}.star-jar,.star-companion,.toss-paw{transform:none}.jar-sparkles{opacity:.65}}
@media print{.star-header{display:none!important}}
/* Rewards respond immediately; each flight keeps its own time during rapid input. */
.star-play{display:block;min-width:0;padding:0 0 5px;background:transparent;border-radius:17px;color:inherit;touch-action:manipulation}.star-play:hover{background:#fff9}.star-play:active .star-scene{filter:brightness(1.04)}.star-play-hint{display:block;font-size:10px;color:#9b8a70;text-align:center;margin-top:-5px}.star-rewards{display:flex;align-items:center;flex-wrap:wrap;gap:3px 9px;margin:0 0 7px;min-height:23px}.star-total{color:#a78338;font-size:11px;white-space:nowrap}.star-total b{font-size:19px;font-weight:650;font-variant-numeric:tabular-nums}.star-reward-note{font-size:11px;color:#948578}.star-reward-note.is-new{color:#9b75b7;animation:reward-pop .32s ease-out both}.star-count b{font-size:12px;color:#88785a}.star-encouragement{margin-bottom:4px}.star-progress{min-height:166px}
.is-tossing .star-companion{animation:companion-toss .62s both;animation-delay:var(--elapsed)}.is-tossing .toss-paw{animation:paw-toss .62s both;animation-delay:var(--elapsed)}.is-tossing .flying-star{animation:star-toss .66s cubic-bezier(.2,.55,.45,1) both;animation-delay:var(--flight-delay)}.is-tossing .star-jar{animation:jar-catch .8s both;animation-delay:var(--elapsed)}.is-tossing .jar-sparkles{animation:jar-twinkle .8s both;animation-delay:var(--elapsed)}.is-overflowing .star-jar{animation:jar-overflow 2.6s both;animation-delay:var(--overflow-elapsed)}
@keyframes star-toss{0%{opacity:1;transform:translate(84px,102px) rotate(-25deg)}25%{opacity:1;transform:translate(119px,43px) rotate(45deg)}50%{opacity:1;transform:translate(169px,calc(19px + var(--arc-lift))) rotate(130deg)}72%{opacity:1;transform:translate(var(--landing-x),43px) rotate(205deg)}92%,100%{opacity:0;transform:translate(var(--landing-x),105px) rotate(260deg) scale(.6)}}
@keyframes reward-pop{0%{opacity:.5;transform:translateY(4px) scale(.94)}65%{transform:translateY(-1px) scale(1.04)}100%{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:720px){.star-progress{min-height:148px}.star-copy h2{font-size:14px}.star-rewards{gap:2px 6px;margin-bottom:4px}.star-total b{font-size:17px}.star-reward-note{font-size:10px}.star-play-hint{font-size:8px;margin:0 -5px}.star-count{font-size:9px}.star-count b{font-size:11px}}
@media(prefers-reduced-motion:reduce){.star-reward-note.is-new{animation:none}.star-progress .flying-star,.star-progress .overflow-star{display:none}.star-progress *{animation:none!important}}
/* A quiet progress companion; only the interview mounts this header. */
.star-progress{grid-template-columns:minmax(0,1fr) 178px;min-height:112px;padding:4px 16px 4px 22px;gap:16px}.star-copy h2{font-size:17px;margin:0 0 9px}.star-count{font-size:12px}.star-rewards{margin:5px 0 0;gap:9px;min-height:21px}.star-total{font-size:12px}.star-total b{font-size:18px}.star-reward-note{font-size:12px}.star-play-hint{font-size:9px}.star-play{padding:0;background:none}.star-play:hover{background:transparent}.star-header .flow-tools{margin-top:6px}
@media(max-width:720px){.star-progress{grid-template-columns:minmax(0,1fr) 112px;min-height:94px;padding:8px 12px;gap:8px}.star-copy{padding:0}.star-copy h2{font-size:14px;margin-bottom:6px}.star-count{font-size:10px}.star-rewards{margin-top:3px;min-height:18px}.star-total b{font-size:16px}.star-scene{width:122px;margin-left:-5px}.star-play-hint{font-size:8px;margin-top:0}.star-header{border-radius:0 0 17px 17px}}

/* Short bursts leave the exact interaction point and land in the visible jar. */
#star-flight-layer{position:fixed;inset:0;pointer-events:none;z-index:10000;overflow:hidden}.interaction-star{position:absolute;display:block;text-shadow:0 0 9px #fff2b8;line-height:1;will-change:transform,opacity}.flight-reward{position:absolute;color:#ad8140;font-size:20px;font-weight:750;white-space:nowrap;animation:flight-number .75s ease-out both;text-shadow:0 1px 5px #fff}.jar-shelf{grid-column:1;display:flex;align-items:center;gap:4px;margin-top:-4px;min-height:15px;color:#b6944b;grid-row:2}.jar-shelf>span{display:grid;place-items:center;border:1px solid #c4ad72;border-radius:3px 3px 6px 6px;width:15px;height:19px;background:#f6deb0;font-size:11px}.jar-shelf small{font-size:10px;color:#a49473;margin-left:3px}.star-copy{grid-column:1;grid-row:1}.star-play{grid-column:2;grid-row:1/3}.star-progress{row-gap:1px;padding-bottom:10px}.star-global-dock{position:fixed;right:16px;bottom:16px;width:235px;z-index:30;filter:drop-shadow(0 5px 13px #58452910)}.star-global-dock .star-progress{grid-template-columns:1fr 90px;min-height:98px;padding:10px;border-radius:17px;gap:3px}.star-global-dock .star-copy h2{font-size:11px;line-height:1.5;margin-bottom:3px}.star-global-dock .star-count{display:none}.star-global-dock .star-total b{font-size:20px}.star-global-dock .star-scene{width:96px;margin-left:-3px}.star-global-dock .star-play-hint{font-size:8px}.star-global-dock .jar-shelf small{font-size:8px}.star-global-dock .jar-shelf>span{width:10px;height:14px;font-size:8px}.star-global-dock .jar-shelf>span:nth-child(n+3){display:none}@keyframes flight-number{0%{opacity:1;transform:translate(-50%,-30%) scale(.7)}25%{opacity:1;transform:translate(-50%,-90%) scale(1.22)}100%{opacity:0;transform:translate(-50%,-180%) scale(1)}}@media(max-width:640px){.star-global-dock{width:186px;right:9px;bottom:9px}.star-global-dock .star-progress{grid-template-columns:1fr 72px;min-height:82px}.star-global-dock .star-scene{width:78px}.star-global-dock .star-copy h2{font-size:10px}.star-global-dock .star-total b{font-size:17px}.star-global-dock .jar-shelf small{font-size:7px}}@media(prefers-reduced-motion:reduce){#star-flight-layer{display:none}.flight-reward{animation:none}}@media print{.star-global-dock,#star-flight-layer{display:none!important}}

.fusion-shelf{flex-wrap:wrap;row-gap:5px;align-items:center}.fusion-shelf .stored-jar{position:relative;display:grid;place-items:center;margin:4px 1px 0;border-radius:4px 4px 7px 7px;box-shadow:inset 0 0 5px #fff9}.fusion-shelf .stored-jar:before{content:'';position:absolute;left:20%;right:20%;height:3px;top:-4px;border:1px solid currentColor;border-radius:2px;background:inherit}.fusion-shelf .jar-small{width:15px;height:19px;background:#f6deb0;color:#b69750;border:1px solid #bca46d;font-size:9px}.fusion-shelf .jar-gold{width:22px;height:25px;background:linear-gradient(130deg,#f9df80,#d6a736);color:#947226;border:1px solid #ad8836;font-size:13px}.fusion-shelf .jar-purple{width:29px;height:31px;background:linear-gradient(130deg,#e0c6f4,#a476cb);color:#73518e;border:1px solid #8f67af;font-size:17px}.fusion-hint{grid-column:1/-1;grid-row:3;margin:6px 0 0;font-size:10px;color:#a28c62}.fusion-shelf small{font-size:10px;line-height:1.6}.star-global-dock .fusion-hint{display:none}.star-global-dock .fusion-shelf .jar-purple{width:19px;height:22px;font-size:12px}.star-global-dock .fusion-shelf .jar-gold{width:16px;height:19px;font-size:10px}.star-global-dock .fusion-shelf small{font-size:8px}.star-global-dock .fusion-shelf .stored-jar:nth-child(n+3){display:none}@media(max-width:640px){.fusion-hint{font-size:9px}.fusion-shelf small{font-size:9px}.star-global-dock .fusion-shelf small{font-size:7px}}
body:has(.star-global-dock) .quiet-footer{padding-bottom:150px}
@media(max-width:400px){.star-header .jar-shelf small{display:none}}