/* The collection lives on the café table; all navigation stays inside the game. */
.shop-view{display:flex;flex-direction:column;overflow:hidden;background:#243f5d}
.shop-room{flex:1;min-height:0;position:relative;background:var(--room) center/cover no-repeat}
.shop-day{position:absolute;left:29px;top:28px;color:#fdf0d3;background:#193d5bd9;padding:9px 19px;border:1px dashed #e9cd9b8a;border-radius:30px;font-size:15px;letter-spacing:.08em}
.shop-note{position:absolute;left:7%;top:18%;width:min(340px,31%);padding:29px 30px 25px;color:#6e4c33;background-color:#f2dfbdeF;background-image:var(--felt-noise);border:3px solid #d2ad7f;outline:1px dashed #bd8f6090;outline-offset:-12px;border-radius:5px 9px 17px 7px;box-shadow:5px 9px 0 #402c2a24,10px 15px 24px #22354e30;transform:rotate(-2deg)}
.shop-note:before{content:'';position:absolute;top:-9px;left:36%;width:28%;height:25px;transform:rotate(4deg);background:#acc3cbce;border-left:2px dashed #70899855;border-right:2px dashed #70899855}
.shop-note>.small{font-size:13px;color:#966d48}.shop-note h2{font-size:clamp(23px,2.2vw,34px);line-height:1.45;margin:13px 0 10px;letter-spacing:.06em}.shop-note p{font-size:15px;line-height:1.8;margin:0}.shop-count{margin-top:15px;border-top:1px dashed #bd976d;display:flex;align-items:center;gap:13px;padding-top:10px}.shop-count strong{color:#285476;font-size:35px}.shop-count strong small{font-size:16px;font-weight:500}.shop-count>span{font-size:13px}.shop-note .shop-next{font-size:12px;margin-top:7px;color:#9b5d32}.shop-memory{background:none;border:0;border-bottom:1px dashed #a37854;padding:6px 0 0;color:#8b623d;font:inherit;font-size:12px;cursor:pointer}.shop-bell{display:none}
.felt-dock{position:relative;display:flex;align-items:center;justify-content:center;gap:20px;padding:15px 24px 20px;flex-shrink:0;min-height:97px;background-color:#1a3d60;background-image:var(--felt-noise);border-top:4px solid #7891a378;box-shadow:0 -5px 18px #15324733}.felt-dock:before{content:'';position:absolute;left:16px;right:16px;top:5px;border-top:1px dashed #c4d2d055;pointer-events:none}.shop-dock .shop-open{min-width:255px;font-size:23px;padding:15px 38px}.shop-dock>.btn:not(.shop-open){min-width:176px}
.collection-view{display:flex;flex-direction:column;background-color:#b57542;background-image:var(--felt-noise),linear-gradient(90deg,#804b2930,transparent 20% 80%,#804b2930);color:#664a32;overflow:hidden}.collection-workspace{flex:1;min-height:0;overflow:auto;padding:22px 20px;display:flex}.emotion-book{margin:auto;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:8%;width:min(1100px,100%);flex-shrink:0;min-height:580px;padding:55px 7% 53px;background:url('assets/relationship-journal.webp') center/100% 100% no-repeat;filter:drop-shadow(0 13px 12px #603c3244)}
.emotion-page{min-width:0;align-self:start}.collection-eyebrow{font-size:13px;color:#9f7145;letter-spacing:.09em}.emotion-page h2{font-size:24px;line-height:1.4;color:#65492f;margin:9px 0 10px}.book-intro{font-size:13px;line-height:1.65;min-height:43px;color:#90704e;margin:0 0 14px}.emotion-shelf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 6px}
.emotion-token{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;border:0;background:transparent;padding:0 2px 5px;color:#775739;font:inherit;cursor:pointer;border-radius:45px 45px 8px 8px;transition:transform .25s,filter .25s}.emotion-token:disabled{opacity:1;cursor:default}.emotion-orb{width:clamp(56px,5.2vw,76px);aspect-ratio:1;position:relative;border-radius:48% 52% 50% 48%;display:grid;place-items:center;background-color:var(--emotion,#d3c1a1);background-image:var(--felt-noise),radial-gradient(ellipse at 32% 23%,#fff4dd55,transparent 70%);border:3px solid #f4e5c066;box-shadow:inset -4px -5px 9px #503c422c,inset 2px 3px 5px #fff3d844,2px 6px 5px #774f2c25;outline:1px dashed #fff4d592;outline-offset:-7px;transition:transform .3s,box-shadow .3s}.emotion-orb b{font-size:clamp(13px,1.15vw,17px);color:#fff7e6;font-weight:700;text-shadow:0 1px 2px #453a3b73;letter-spacing:.04em}.emotion-orb i{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff2d6b3;top:15%;left:24%;filter:blur(.7px)}.emotion-token small{font-size:11px;white-space:nowrap;letter-spacing:0}.emotion-token:not(:disabled):hover{transform:translateY(-4px)}.emotion-token.chosen .emotion-orb{outline:2px dashed #fff9e0;outline-offset:-8px;box-shadow:0 0 0 3px #e9bf83,0 0 0 5px #bb8443,2px 7px 7px #7b502844;transform:translateY(-3px)}.emotion-token.chosen small{color:#a35e2f;font-weight:700}.emotion-token:focus-visible{outline:2px dashed #af6a36;outline-offset:4px}.uncollected{cursor:default;color:#ae9470}.uncollected .emotion-orb{background-color:#ccbda2;background-image:var(--felt-noise);border-color:#b6a38855;box-shadow:inset 1px 3px 4px #7d634424;outline-color:#a88c6270}.uncollected .emotion-orb b{font-family:Georgia,serif;color:#a8906c;text-shadow:none;font-size:23px;font-weight:400}
.mixing-page{text-align:center}.mixing-page>.collection-eyebrow{display:block}.mix-table{display:flex;align-items:center;justify-content:center;margin:22px 0 17px;position:relative;isolation:isolate}.mix-seat{width:112px;height:116px;display:grid;place-items:center;position:relative}.mix-seat:before{content:'';position:absolute;inset:5px 4px 15px;border:2px dashed #bb92656e;border-radius:50%;box-shadow:inset 0 3px 8px #ae804723;z-index:-1}.empty-seat{font-size:12px;color:#b08b66}.placed .emotion-orb{width:82px}.mix-thread{width:32px;height:1px;border-top:2px dashed #c8a179;position:relative}.mix-thread:after{content:'✧';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#b7874f;background:#f1dfbd;padding:3px}.mix-button{font-size:16px;padding:11px 29px}.resonance-result{min-height:145px;margin-top:20px;text-align:left;border-top:1px dashed #c49e71;padding-top:14px}.resonance-stamp{font-size:11px;color:#ab7851}.resonance-result h3{color:#8e5735;font-size:19px;margin:7px 0 6px;line-height:1.4}.resonance-result p{font-size:14px;color:#806246;line-height:1.8;margin:0}.resonance-result .mix-invitation{text-align:center;color:#a88b68;font-size:14px;padding-top:18px}.mix-rule{font-size:11px;color:#a28a67;line-height:1.6;margin:6px 0 0}.resonance-history{border-top:1px dashed #c49e71;margin-top:13px;text-align:left;padding-top:10px}.resonance-history summary{cursor:pointer;font-size:13px;color:#956a42}.resonance-history>button{display:block;width:100%;border:0;border-bottom:1px dashed #bf9d7047;background:none;text-align:left;padding:10px 2px;font:inherit;font-size:14px;color:#785a3c;cursor:pointer}.resonance-history>button small{display:block;font-size:11px;color:#a08969;padding-top:4px}.has-resonance .mix-seat:first-child{animation:emotion-meet-left 1s ease}.has-resonance .mix-seat:last-child{animation:emotion-meet-right 1s ease}.has-resonance .mix-thread:after{animation:thread-glow 1.2s ease}.has-resonance~.resonance-result{animation:ink-appear .9s ease both}.collection-dock{min-height:88px;padding-top:12px;padding-bottom:16px}.collection-dock .btn{font-size:16px;padding:12px 25px}.dock-note{font-size:13px;color:#dbd1b6;line-height:1.6}
.cup-book-space{flex:1;min-height:0;overflow:auto;padding:20px 24px;display:flex;align-items:center;justify-content:center;gap:28px}.cup-book{position:relative;flex-shrink:0;width:min(74%,calc((100dvh - 200px)*1.5));container-type:inline-size;filter:drop-shadow(0 12px 11px #52332950);border-radius:4%}.cup-book>img{display:block;width:100%;height:auto;border-radius:4%;user-select:none}.cup-live-count{position:absolute;left:42.2%;top:15.1%;width:15.9%;height:3.4%;display:flex;align-items:center;justify-content:center;background:#19304e;background-image:var(--felt-noise);border:1px solid #395071;outline:1px dashed #51708d80;outline-offset:-3px;border-radius:8px;color:#fff1d3;font-size:2.25cqw;font-weight:900;white-space:nowrap;line-height:1;letter-spacing:.03em;z-index:2}.cup-cell{position:absolute;padding:0;border:0;background:none;border-radius:7%;cursor:pointer;color:#876747;transition:box-shadow .2s,transform .2s;overflow:hidden}.cup-cell.unlocked:hover,.cup-cell.focused.unlocked{box-shadow:0 0 0 3px #dfa358,0 0 0 5px #fff4d8b5}.cup-cell:focus-visible{outline:3px dashed #214d74;outline-offset:2px;z-index:3}.cup-cell.locked{background-color:#e9d6b5;background-image:var(--felt-noise),linear-gradient(135deg,#f4e3c7,#dcc39d);border:2px solid #d7bb93;outline:1px dashed #c09a6c;outline-offset:-6px;box-shadow:inset 0 0 20px #9d693025}.cup-cell.locked.focused{outline-color:#865d35;outline-width:2px}.cup-seal{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3%;color:#a38967}.cup-seal b{font-size:2cqw;position:absolute;left:7%;top:6%;color:#b59c79;font-weight:700}.cup-seal small{font-size:1.65cqw;letter-spacing:.03em}.lock-shape{display:block;position:relative;width:23px;height:19px;margin-top:11px;margin-bottom:5px;background:#b79a72;border:1px solid #a58866;border-radius:5px;box-shadow:inset 1px 1px #ead3ac50,0 2px #c8af8b}.lock-shape:before{content:'';position:absolute;bottom:14px;left:4px;width:11px;height:12px;border:3px solid #b29570;border-bottom:0;border-radius:8px 8px 0 0}.lock-shape:after{content:'';position:absolute;left:9px;top:6px;width:3px;height:7px;background:#ead7b5;border-radius:3px}.cup-unlocked-mark{position:absolute;right:5%;bottom:5%;font-size:1.15cqw;background:#f5e8cddf;border:1px dashed #b6956b;border-radius:20px;padding:2% 6%;color:#8e6944;opacity:0}.cup-cell.focused .cup-unlocked-mark,.cup-cell:hover .cup-unlocked-mark{opacity:1}.cup-description{width:min(235px,22%);flex-shrink:0;text-align:center;padding:15px 0;color:#fff0d4}.cup-description .collection-eyebrow{color:#efd8b3;font-size:12px}.cup-description h2{font-size:24px;line-height:1.5;margin:8px 0 9px;letter-spacing:.05em;color:#fff1d6}.cup-description p{font-size:14px;line-height:1.9;color:#efd9bc;margin:0}.cup-preview{width:100%;aspect-ratio:1.3825;background-image:url('assets/cups-collection.png');background-size:var(--cup-size-x) var(--cup-size-y);background-position:var(--cup-x) var(--cup-y);background-repeat:no-repeat;border-radius:12%;box-shadow:0 6px 13px #6642262b}.cup-description>.cup-preview{margin-bottom:23px;transform:rotate(3deg);border:2px solid #ebd4ac}.cup-mystery{display:grid;place-items:center;background-color:#dfc69e;background-image:var(--felt-noise);outline:1px dashed #b0885d;outline-offset:-10px}.cup-mystery .lock-shape{transform:scale(1.9)}
.reward-view{background-image:var(--felt-noise),linear-gradient(#183d55bb,#193b56d6),url('assets/morning.webp');background-size:auto,auto,auto,cover;background-position:center;color:#77543a}.reward-table{margin:auto;flex-shrink:0;width:min(820px,calc(100% - 48px));padding:33px 48px 31px;text-align:center;background-color:#f2dfbe;background-image:var(--felt-noise);border:5px solid #d8ba8e;border-radius:18px;outline:1px dashed #c09662;outline-offset:-13px;box-shadow:0 12px 25px #14283e5c;animation:ink-appear .6s ease}.reward-table>h2{font-size:26px;line-height:1.5;margin:8px 0 20px;color:#735132}.reward-pair{display:grid;grid-template-columns:1fr 36px 1fr;gap:14px;align-items:center;max-width:530px;margin:auto}.reward-emotion .emotion-orb{width:100px}.reward-emotion .emotion-orb b{font-size:24px}.reward-emotion .emotion-token small{font-size:13px}.reward-emotion>p{font-size:14px;line-height:1.8;color:#987453;margin:15px 0 0}.reward-connection{font-size:33px;color:#b99161;letter-spacing:.1em}.reward-cup .cup-preview{width:185px;max-width:100%;margin:0 auto 12px;transform:rotate(3deg)}.reward-cup h3{font-size:21px;margin:5px 0 0;color:#87623e}.reward-cup .collection-eyebrow{font-size:11px}.reward-progress{margin:22px 0 7px;color:#3b6880;font-size:17px;letter-spacing:.08em}.reward-progress span{padding:0 12px;color:#c2a478}.reward-next{font-size:12px;color:#a4825c;line-height:1.6;margin:0}.reward-view .collection-dock{margin-top:20px}
/* One compact tray groups the single current brewing action and its controls. */
.felt-brew{background-color:#315273;background-image:var(--felt-noise)}.felt-brew .brew-console{width:min(1130px,calc(100% - 32px));margin:13px auto 17px;min-height:127px;padding:16px 27px;gap:25px;border:3px solid #6e8fa4;border-radius:24px;outline:1px dashed #d0d4bf80;outline-offset:-9px;box-shadow:0 6px 0 #152f46,0 10px 15px #18324b47,inset 0 2px 4px #a8c1c322;background-color:#204563;grid-template-columns:minmax(135px,1fr) minmax(245px,1.3fr) minmax(140px,.8fr)}.felt-brew .brew-main-action>.btn{font-size:22px;min-height:60px;min-width:225px;padding:13px 27px}.felt-brew .brew-navigation>.btn{font-size:19px;min-width:133px}.felt-brew .brew-main-action p{font-size:13px}.brew-meter-area .meter-label:has(output){display:flex;justify-content:space-between;align-items:center;gap:10px}.brew-meter-area .meter-label output{font-weight:700;text-align:right;white-space:nowrap}.brew-meter-area .range{height:24px;cursor:pointer}.brew-meter-area .range:focus-visible{outline:2px dashed #fff1cf;outline-offset:5px}
@keyframes emotion-meet-left{0%,100%{transform:translateX(0)}50%{transform:translateX(14px) rotate(7deg)}}
@keyframes emotion-meet-right{0%,100%{transform:translateX(0)}50%{transform:translateX(-14px) rotate(-7deg)}}
@keyframes thread-glow{0%,100%{color:#b7874f}50%{color:#fbc36a;text-shadow:0 0 18px #ea9b36;scale:1.6}}
@keyframes ink-appear{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
@media(min-width:1450px){.emotion-book{padding-left:78px;padding-right:78px}}
@media(max-width:1000px){.shop-note{left:5%;width:34%;padding:23px}.shop-note h2{font-size:25px}.shop-note p{font-size:13px}.shop-note .shop-next{font-size:11px}.emotion-book{padding:42px 6% 45px;gap:9%;min-height:565px}.emotion-page h2{font-size:21px}.emotion-shelf{gap:16px 4px}.emotion-orb{width:58px}.emotion-token small{font-size:10px}.mix-seat{width:96px}.placed .emotion-orb{width:75px}.mix-thread{width:20px}.cup-book-space{gap:20px;padding:20px 15px}.cup-description h2{font-size:20px}.cup-description p{font-size:12px}.cup-description .collection-eyebrow{font-size:11px}.collection-dock .btn{padding:11px 19px}.dock-note{font-size:12px}.felt-brew .brew-console{gap:18px;padding:16px 20px;grid-template-columns:minmax(125px,1fr) minmax(215px,1.2fr) minmax(110px,.7fr)}.felt-brew .brew-main-action>.btn{font-size:21px;min-width:205px}.felt-brew .brew-navigation>.btn{font-size:17px;min-width:115px;padding:12px 18px}}
@media(max-width:650px) and (orientation:portrait){.shop-room{background-position:61% center}.shop-day{left:15px;top:20px;font-size:12px}.shop-note{width:min(270px,68%);left:7%;top:18%;padding:25px}.shop-note h2{font-size:25px}.shop-count{margin-top:10px}.shop-count strong{font-size:29px}.shop-dock{display:grid;grid-template-columns:1fr 1fr;gap:13px;padding:16px 20px 22px}.shop-dock .shop-open{grid-column:1/-1;grid-row:1;min-width:0;width:100%;font-size:22px}.shop-dock>.btn:not(.shop-open){min-width:0;font-size:16px;padding:12px}.collection-workspace{padding:19px 14px}.emotion-book{grid-template-columns:1fr;background-color:#f3e0bd;background-image:var(--felt-noise);border:7px solid #325d7b;border-radius:19px;outline:1px dashed #94aab4;outline-offset:-5px;padding:25px 22px 30px;gap:32px;box-shadow:5px 5px 0 #c9aa7c,8px 9px 0 #294965;min-height:0}.emotion-page h2{font-size:23px}.emotion-shelf{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 8px}.emotion-orb{width:60px}.emotion-orb b{font-size:14px}.emotion-token small{font-size:10px}.mixing-page{border-top:1px dashed #b59069;padding-top:24px}.mix-seat{width:108px}.placed .emotion-orb{width:78px}.mix-thread{width:35px}.collection-dock{gap:10px;padding:13px 12px 17px;min-height:76px;flex-wrap:wrap}.collection-dock .btn{font-size:13px;padding:11px 13px;border-width:2px;outline-width:1px;outline-offset:-6px;letter-spacing:0}.cup-book-space{flex-direction:column;justify-content:flex-start;padding:20px 12px 24px;gap:20px}.cup-book{width:100%;max-width:620px}.cup-seal .lock-shape{transform:scale(.6);margin-top:6px;margin-bottom:0}.cup-seal small{font-size:1.9cqw}.cup-live-count{border-radius:3px;outline-offset:-2px}.cup-description{width:100%;max-width:430px;display:flex;align-items:center;gap:18px;text-align:left;padding:3px 14px 0}.cup-description>.cup-preview{width:112px;flex-shrink:0;margin:0}.cup-description h2{font-size:19px;margin:5px 0 6px}.cup-description p{font-size:12px}.cup-description .collection-eyebrow{font-size:10px}.cup-mystery .lock-shape{transform:scale(1.2)}.dock-note{flex-basis:100%;text-align:center;font-size:11px}.reward-table{width:calc(100% - 28px);padding:30px 21px;border-width:4px}.reward-table>h2{font-size:21px;margin:10px 0 23px}.reward-pair{gap:8px;grid-template-columns:1fr 15px 1fr}.reward-emotion .emotion-orb{width:82px}.reward-emotion .emotion-orb b{font-size:20px}.reward-emotion>p{font-size:12px}.reward-emotion .emotion-token small{font-size:11px}.reward-cup h3{font-size:17px}.reward-cup .collection-eyebrow{font-size:10px}.reward-progress{font-size:15px;margin-top:25px}.reward-progress span{padding:0 7px}.reward-next{font-size:11px}.reward-view{overflow:auto}.reward-view .collection-dock{margin-top:15px}.reward-view>.reward-table{margin-top:auto;margin-bottom:auto}.felt-brew .brew-console{grid-template-columns:1fr 1fr;min-height:210px;margin:12px auto 17px;padding:16px 18px 20px;gap:15px;width:calc(100% - 24px);border-radius:22px}.felt-brew .brew-main-action{grid-column:1/-1;grid-row:1}.felt-brew .brew-main-action>.btn{font-size:22px;min-height:58px}.felt-brew .brew-navigation{grid-column:2;grid-row:2}.felt-brew .brew-meter-area{grid-column:1;grid-row:2}.felt-brew .brew-navigation>.btn{font-size:16px;min-width:108px}.felt-brew .brew-main-action p{font-size:12px}}
@media(max-height:650px) and (orientation:landscape){.shop-note{top:20%;padding:20px 24px;width:32%}.shop-note h2{font-size:23px;margin:7px 0}.shop-note>p:not(.shop-next){display:none}.shop-day{top:18px;font-size:12px}.shop-count{margin-top:7px;padding-top:5px}.shop-count strong{font-size:26px}.shop-note .small{font-size:11px}.shop-note .shop-next{font-size:11px}.shop-memory{display:none}.felt-dock{min-height:76px;padding:11px 20px 15px}.shop-dock .shop-open{font-size:19px;padding:12px 28px;min-width:220px}.shop-dock>.btn:not(.shop-open){font-size:16px;padding:11px 23px;min-width:160px}.reward-view{overflow:auto}.reward-table{width:min(680px,calc(100% - 40px));margin:17px auto 0;padding:21px 30px}.reward-table>h2{font-size:21px;margin:5px 0 12px}.reward-pair{max-width:470px}.reward-cup .cup-preview{width:125px;margin-bottom:8px}.reward-emotion .emotion-orb{width:76px}.reward-emotion>p{font-size:12px;margin-top:8px}.reward-cup h3{font-size:18px}.reward-progress{margin-top:13px;font-size:14px}.reward-view .collection-dock{margin-top:17px}.felt-brew .brew-console{margin:9px auto 12px;min-height:101px;padding:10px 20px 12px;gap:18px}.felt-brew .brew-main-action>.btn{min-height:48px;font-size:20px;padding:10px 22px}.felt-brew .brew-main-action{gap:7px}.felt-brew .brew-navigation{gap:6px}.felt-brew .brew-navigation>.btn{font-size:16px;padding:10px 18px}.felt-brew .brew-navigation .textbtn{font-size:12px}.cup-book-space{padding-top:12px;padding-bottom:12px}.cup-book{width:min(70%,calc((100dvh - 175px)*1.5))}.cup-description{width:23%}.cup-description>.cup-preview{max-width:125px;margin:0 auto 12px}.cup-description h2{font-size:18px}}
@media(prefers-reduced-motion:reduce){.emotion-token,.emotion-orb,.cup-cell{transition:none}.has-resonance .mix-seat,.has-resonance .mix-thread:after,.has-resonance~.resonance-result,.reward-table{animation:none}}