:root{color-scheme:light;--ink:#4f5944;--muted:#91927d;--sage:#7d9270;--sage-light:#e7ecdc;--cream:#fffaf0;--peach:#e8b391;--gold:#c4a166;--serif:"STKaiti","KaiTi","Songti SC",Georgia,serif;--sans:"Microsoft YaHei","PingFang SC",sans-serif}
*{box-sizing:border-box}body{margin:0;font-family:var(--sans);color:var(--ink);background:radial-gradient(ellipse at 15% 18%,#fffaf0,transparent 46%),radial-gradient(ellipse at 90% 70%,#e7ebd9,transparent 44%),repeating-linear-gradient(90deg,#ffffff0a 0 1px,transparent 1px 4px),#f3efe4}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:0;cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #759476;outline-offset:3px}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.svg-library{position:absolute;inline-size:0;block-size:0;overflow:hidden}.picnic-layout{min-height:100svh;display:grid;grid-template-columns:245px auto 250px;align-items:center;justify-content:center;gap:clamp(32px,4.5vw,80px);padding:18px 28px}.back-link{display:inline-block;text-decoration:none;color:#9a9985;font-size:11px;margin-bottom:30px}.club-mark{display:flex;align-items:center;gap:9px}.club-mark>.spirit-art{width:67px;height:73px}.club-mark small{font:8px Georgia,serif;letter-spacing:.17em;color:#999a83}.club-mark h1{font:31px/1.4 var(--serif);margin:6px 0 0;color:#5c7153}.club-description{font-size:12px;color:#92927e;line-height:2.1;margin:20px 0 29px}.section-label{display:flex;justify-content:space-between;align-items:center;font-size:11px;margin-bottom:13px}.section-label>span:last-child{font:8px Georgia,serif;letter-spacing:.14em;color:#a3a18b}.theme-picker{display:grid;gap:10px}.theme-card{position:relative;display:flex;align-items:center;text-align:left;gap:10px;padding:9px 12px;border:1px solid #d7d7c5;background:#fffdf462;border-radius:18px;transition:background .2s,border-color .2s}.theme-card[aria-pressed=true]{background:#e5ebd8;border-color:#a3b194;box-shadow:inset 0 0 0 3px #f9fbf03d}.theme-card[data-theme=food][aria-pressed=true]{background:#f3e3d2;border-color:#d4b596}.theme-card .spirit-art{width:53px;height:57px}.theme-card b{display:block;font-size:13px;font-weight:500;margin-bottom:7px}.theme-card small{display:block;font-size:9px;color:#91917c}.theme-card>i{font-style:normal;margin-left:auto;font-size:13px;color:#9da28a}.chapter-heading{display:flex;justify-content:space-between;align-items:center;margin:28px 0 13px;font-size:11px}.chapter-heading button{padding:0;background:transparent;font-size:10px;color:#92977c}.chapter-path{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.path-step{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;aspect-ratio:1.13;background:#fffaf057;border:1px dashed #c9cbb7;border-radius:13px;font:17px Georgia,serif;color:#a0a18b}.path-step.active{background:#7f9470;border-color:#7f9470;color:#fff8e8}.path-step.complete:not(.active){background:#e7eddc;border:1px solid #c2ceaf;color:#6e8961}.path-step small{font-size:8px;letter-spacing:1px}.sidebar-profile{display:flex;align-items:center;gap:12px;padding-top:24px;border-top:1px solid #d9d7c5;margin-top:26px}.sidebar-profile b{display:block;font-size:12px;font-weight:500;margin-bottom:6px}.sidebar-profile small{display:block;font-size:9px;color:#a09b85}.profile-picture{position:relative;display:block;width:53px;height:53px;flex-shrink:0;padding:2px;background:#fff9eabb;border:1px solid #d7d2b9;border-radius:18px;box-shadow:0 3px 0 #b8b59428}.profile-picture .spirit-art{width:100%;height:100%}.profile-picture>i{font-style:normal;display:grid;place-items:center;position:absolute;right:-3px;bottom:-2px;width:16px;height:16px;border-radius:6px;background:#839371;color:#fffdf0;font-size:13px;border:1px solid #f8f5e8}.local-note{font-size:9px;color:#a5a18b;margin:14px 0 0;line-height:1.8}
.spirit-art{display:block;background-image:var(--spirit-sheet,none);background-size:400% 200%;background-position:var(--sx,0%) var(--sy,0%);background-repeat:no-repeat;background-color:transparent;flex-shrink:0}.theme-art[data-art-source=animals],.avatar-choice[data-source=animals] .spirit-art{background-image:var(--animals-sheet,none)}.theme-art[data-art-source=food]{background-image:var(--food-sheet,none)}.avatar-art{background-image:var(--avatar-sheet,none)}.avatar-choice[data-source=classic] .spirit-art{background-image:var(--classic-sheet,none)}
.game-room{position:relative;isolation:isolate;container-type:inline-size;width:min(480px,calc((100svh - 36px)*.6153846));aspect-ratio:480/780;overflow:hidden;border:5px solid #d7debf;border-radius:31px;background:#f4ecd9 url('assets/picnic-garden.png') center/100% 100%;box-shadow:0 0 0 1px #b7c39f,0 0 0 5px #f9f5e7,0 25px 65px #7781632c,0 5px 12px #8f917720;animation:arrive .6s ease-out}.game-room:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:6;box-shadow:inset 0 0 0 2px #fffced66;border-radius:24px}#board{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none;cursor:crosshair;outline-offset:-5px}.room-header{position:absolute;left:4%;right:4%;top:2.1%;height:7.5%;display:flex;align-items:center;gap:2.1cqw}.room-header .profile-picture{width:11cqw;height:11cqw;border-radius:3.5cqw;padding:.4cqw}.room-header .profile-picture i{width:3.5cqw;height:3.5cqw;font-size:3cqw;right:-.7cqw;border-radius:1.2cqw}.room-brand{flex:1;text-shadow:0 1px 5px #fffaf0}.room-brand small{font:1.7cqw Georgia,serif;letter-spacing:.17em;color:#71825f}.room-brand h2{font:5.7cqw/1.25 var(--serif);margin:.9cqw 0 0;letter-spacing:.055em;color:#5d7452}.icon-button{position:relative;display:grid;place-items:center;width:7.5cqw;height:7.5cqw;padding:1.5cqw;border-radius:2.8cqw;background:#fff8e8e6;color:#78886b;border:1px solid #d2d5b5;box-shadow:0 2px 0 #929a7126;flex-shrink:0}.icon-button svg{width:4cqw;height:4cqw}.icon-button[aria-pressed=false]:after{content:"";position:absolute;width:4.5cqw;height:1px;background:currentColor;transform:rotate(-45deg)}
.room-themes{position:absolute;left:6%;right:6%;top:11.1%;height:6.1%;display:flex;gap:2cqw}.room-themes button{display:flex;align-items:center;justify-content:center;gap:1cqw;flex:1;min-width:0;background:#fffaeced;border:1px solid #c9cfb1;border-radius:3.3cqw;color:#849170;box-shadow:0 3px 0 #bec3a43d;font-size:2.75cqw;letter-spacing:.035em}.room-themes button[aria-pressed=true]{background:#829970;color:#fffdeb;border-color:#829970}.room-themes button[data-theme=food][aria-pressed=true]{background:#c09775;border-color:#c09775}.room-themes .spirit-art{width:8.3cqw;height:8.5cqw}.mission-card{position:absolute;top:19.3%;left:9%;right:9%;height:13.5%;padding:0 3.5cqw 2.3cqw;background:linear-gradient(115deg,#fffcefef,#f9f2dfef);border:1px solid #d8caab;border-radius:3.5cqw;box-shadow:0 4px 0 #baa78236,0 6px 18px #777d4d18}.mission-card:before,.mission-card:after{content:"";position:absolute;top:-1.8cqw;width:6.5cqw;height:3.2cqw;background:#d7bf8eb0;transform:rotate(-12deg)}.mission-card:before{left:6%}.mission-card:after{right:6%;transform:rotate(12deg)}.mission-ribbon{display:flex;align-items:center;justify-content:space-between;height:6.3cqw;border-bottom:1px dashed #d2c5a6;font-size:2cqw;color:#a09071}.mission-ribbon button{display:flex;align-items:center;gap:1.3cqw;background:transparent;padding:0;color:#7a8965;font-size:2.3cqw}.mission-ribbon svg{width:2.8cqw;height:2.8cqw}.mission-body{display:flex;align-items:center;gap:1.7cqw;padding-top:1.1cqw}.mission-body>.spirit-art{width:14cqw;height:13.5cqw}.mission-body>div{flex:1;min-width:0}.mission-body small{font-size:2cqw;color:#a0997f}.mission-body strong{display:block;font-size:2.9cqw;font-weight:600;margin:1.2cqw 0 1.6cqw;line-height:1.4}.goal-line{display:flex;gap:2cqw;align-items:center}.goal-track{height:1.6cqw;border-radius:10px;background:#e7e1c9;overflow:hidden;flex:1}.goal-track>i{display:block;height:100%;width:0;border-radius:inherit;background:#91a57a;transition:width .3s}.goal-line>span{font:2.2cqw Georgia,serif;color:#8e9678}.play-stats{position:absolute;top:33.7%;left:11%;right:11%;display:flex;justify-content:space-between;align-items:center;font-size:2.2cqw;color:#8a8b70;pointer-events:none}.play-stats>span{display:flex;align-items:center;gap:1cqw}.play-stats svg{width:3.7cqw;height:3.7cqw;fill:#d8b777;stroke:#b69a5e;stroke-width:1.1}.play-stats strong{font:3.3cqw Georgia,serif;color:#968052}.play-stats small{font-size:2cqw}.play-stats b{font:3.3cqw Georgia,serif;color:#70825c}
.launch-hint{position:absolute;top:82.8%;left:27%;right:27%;font-size:2.1cqw;color:#a39472;text-align:center;padding:.7cqw .5cqw;margin:0;border-radius:8px;background:#fffbedb8;pointer-events:none}.launcher-tools{position:absolute;inset:85.7% 6% 8%;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.launcher-tools button{pointer-events:auto}.tool-button{display:flex;align-items:center;gap:1.5cqw;background:#fff9e9df;border:1px solid #d5c9a9;padding:1.6cqw 2.6cqw;border-radius:3cqw;box-shadow:0 2px 0 #b3a78a32}.tool-button svg{width:4cqw;height:4cqw;color:#a49b79}.tool-button>span{font-size:2.35cqw}.tool-button small{display:block;text-align:center;font-size:1.9cqw;color:#a89f83;margin-top:.6cqw}.current-caption{position:absolute;left:0;top:-2.2cqw;font-size:1.65cqw;color:#a4997d;pointer-events:none}.next-button{display:flex;align-items:center;gap:1cqw;background:transparent;padding:0}.next-button>span:first-child{display:flex;align-items:center;flex-direction:column;gap:1.2cqw;color:#a09577}.next-button small{font-size:2cqw}.next-button svg{width:3cqw;height:3cqw}.next-button>.spirit-art{width:12cqw;height:12cqw}.album-shelf{position:absolute;left:4%;right:4%;bottom:1.9%;height:6.1%;display:flex;align-items:center;gap:1cqw;padding:.8cqw 1.5cqw;border:1px solid #d4caaa;border-radius:3cqw;background:#fffbedeb;box-shadow:0 3px 0 #c0b99b3b}.mini-album{display:flex;align-items:center;justify-content:space-between;flex:1;min-width:0}.mini-item{position:relative}.mini-item>.spirit-art{width:7.6cqw;height:7.6cqw}.mini-item.locked{opacity:.34;filter:grayscale(.8)}.mini-item small{position:absolute;bottom:-.6cqw;right:.4cqw;font:1.8cqw Georgia,serif;color:#a1a085}.album-tab{display:flex;flex-direction:column;align-items:center;gap:.3cqw;border-left:1px solid #d7d1b7;padding-left:1.8cqw;color:#859578}.album-tab svg{width:3.5cqw;height:3.5cqw}.album-tab small{font-size:1.6cqw}.toast{position:absolute;top:55%;left:10%;right:10%;padding:2.3cqw 2cqw;background:#fffaf0f2;border:1px solid #d6d2b6;border-radius:3cqw;box-shadow:0 4px 16px #83846420;text-align:center;font-size:2.6cqw;line-height:1.6;pointer-events:none;opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s;z-index:5}.toast.show{opacity:1;transform:none}.loading-label{position:absolute;inset:38% 16%;background:#fffaf0ed;border:1px solid #d7d5b8;border-radius:25px;display:flex;align-items:center;justify-content:center;gap:14px;flex-direction:column;font-size:13px;color:#919578;text-align:center;padding:15px;z-index:7}.loading-label[hidden]{display:none}.loading-flower{font-size:30px;color:#b5ba8c;animation:spin 6s linear infinite}
.collection-heading{display:flex;align-items:center;gap:14px}.small-flower{font:38px Georgia,serif;color:#c5ac73}.collection-heading small{font:8px Georgia,serif;letter-spacing:.15em;color:#9ba084}.collection-heading h2{font:24px var(--serif);margin:9px 0 0;color:#6d805d}.collection-sidebar>p{font-size:10px;line-height:1.9;color:#999981;margin:20px 0}.side-album{display:grid;grid-template-columns:repeat(4,1fr);gap:21px 8px;margin-top:26px}.side-entry{text-align:center;position:relative}.side-entry .spirit-art{width:100%;aspect-ratio:1}.side-entry.locked .spirit-art{opacity:.4;filter:grayscale(.55)}.side-entry small{display:block;font-size:8px;color:#a4a18b;margin:5px 0}.side-entry b{font-weight:400;font-size:9px;line-height:1.7;display:block}.mini-recipe{display:flex;justify-content:center;gap:14px;padding:16px 0;margin:25px 0;border-top:1px dashed #ccd0b8;border-bottom:1px dashed #ccd0b8;font-size:10px;color:#999b80}.mini-recipe i{font-style:normal;color:#acb496}.club-record{display:flex;justify-content:space-around}.club-record span{text-align:center}.club-record small{display:block;font-size:9px;color:#a09d83;margin-bottom:10px}.club-record b{font:25px Georgia,serif;color:#80906b}.help-link{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:28px;background:transparent;color:#8b957b;font-size:10px}.help-link svg{width:15px;height:15px}.collection-sidebar .keyboard-note{text-align:center;font-size:9px;line-height:2.1;color:#aaa58d;margin-top:13px}
dialog{width:min(460px,calc(100vw - 30px));max-height:90svh;border:1px solid #bfc5a7;border-radius:26px;color:var(--ink);padding:28px;background:radial-gradient(at top,#fffdf3,#f4efdf);box-shadow:0 24px 80px #4b54303b}dialog::backdrop{background:#41493666;backdrop-filter:blur(6px)}.dialog-close{float:right;background:transparent;padding:0;color:#a0a18a}.dialog-close svg{width:21px;height:21px}.eyebrow{font:9px Georgia,serif;letter-spacing:.17em;color:#a19c7f;line-height:1.8}dialog h2{font:29px/1.4 var(--serif);margin:12px 0 15px}dialog p{font-size:12px;color:#95927a;line-height:1.9}.dialog-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.dialog-actions button{background:#829570;color:#fffbed;border-radius:13px;padding:12px 18px;font-size:12px}.dialog-actions .secondary{background:#e8e7d7;color:#849072}.dialog-actions button:disabled{opacity:.45}.result-hero{width:120px;height:120px;margin:14px auto 0}.result-stars{display:flex;justify-content:center;gap:14px;margin:12px 0 18px}.result-stars svg{width:34px;height:34px;fill:#e3bb6e;stroke:#c49c52;stroke-width:1.2}.result-stars svg.dim{fill:#e1decb;stroke:#d2cbb3}.result-metrics{display:flex;justify-content:center;gap:30px;text-align:center;background:#e9eddf88;border-radius:15px;padding:16px}.result-metrics b{font:24px Georgia,serif;display:block;color:#879467}.result-metrics small{display:block;font-size:10px;color:#a09b7e;margin-top:5px}.album-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 10px}.album-entry{text-align:center}.album-entry .spirit-art{width:100%;aspect-ratio:1}.album-entry.locked .spirit-art{opacity:.4;filter:grayscale(.7)}.album-entry small{font-size:9px;display:block;color:#a09b83;margin-top:5px}.album-entry b{font-size:10px;line-height:1.7;display:block;font-weight:400;margin-top:4px}.map-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:23px 0}.map-grid .path-step{aspect-ratio:.95;font-size:24px}.map-grid .path-step small{font-size:9px}.avatar-group-title{font-size:11px;margin:20px 0 10px;color:#969b80;font-weight:400}.avatar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.avatar-choice{position:relative;background:#fffaf077;border:1px solid #dedcc6;border-radius:15px;aspect-ratio:1;padding:5px}.avatar-choice[aria-pressed=true]{background:#e3ebd7;border-color:#90a279;box-shadow:inset 0 0 0 2px #cad9b9}.avatar-choice .spirit-art{width:100%;height:100%}.avatar-choice small{position:absolute;bottom:3px;right:6px;color:#718b5e;font-size:10px}.dialog-status{font-size:11px!important;color:#8d9a77!important;min-height:21px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@keyframes arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:1220px){.picnic-layout{grid-template-columns:225px auto;gap:45px}.collection-sidebar{display:none}.club-sidebar{max-width:225px}}@media(max-width:800px){.picnic-layout{display:flex;padding:12px;justify-content:center}.club-sidebar,.collection-sidebar{display:none}.game-room{width:min(480px,calc((100svh - 24px)*.6153846))}}@media(max-width:480px){body{background:#e8e9d2}.picnic-layout{padding:0}.game-room{width:min(100%,calc(100svh*.6153846));border-width:3px;border-radius:15px;box-shadow:none}.game-room:after{border-radius:10px}dialog{padding:23px}.avatar-grid{gap:8px}.avatar-choice{border-radius:12px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* Title screen and menu flow; uses this game's own garden and character sheets. */
[hidden]{display:none!important}
.title-screen{min-height:100svh;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);background:linear-gradient(90deg,#fbf8eb18,#fbf8eb40 53%,#f7f4e9ed 68%),url('assets/picnic-garden.png') center 40%/cover;position:relative;isolation:isolate}
.title-illustration{position:relative;min-height:650px;padding:clamp(28px,5vw,76px);display:flex;flex-direction:column;align-items:flex-start;overflow:hidden}
.title-edition{font:11px/1.8 Georgia,serif;letter-spacing:.2em;color:#526745;background:#fff9e2b8;padding:8px 13px;border-radius:5px}
.title-illustration h1{position:relative;z-index:1;margin:28px 0 0;font:clamp(60px,7vw,104px)/1.12 var(--serif);letter-spacing:.1em;color:#45613d;text-shadow:0 2px 0 #fff8e8,0 5px 26px #fffcdf}
.title-illustration h1>span{display:block;font:15px/1.8 var(--sans);letter-spacing:.15em;margin:23px 0;color:#65784d}
.title-friends{position:relative;width:100%;height:235px;margin-top:auto;filter:drop-shadow(0 14px 12px #75653720)}
.title-friends>.spirit-art{position:absolute;aspect-ratio:1;width:43%;max-width:245px;animation:picnic-bob 6s ease-in-out infinite}
.friend-cat{left:0;bottom:5%;transform:rotate(-9deg)}.friend-dog{left:28%;bottom:0;animation-delay:-2s!important}.friend-cake{right:0;bottom:4%;animation-delay:-4s!important}
.title-note{position:relative;font-size:13px;line-height:2;color:#5c6748;background:#fff9e4ba;padding:10px 15px;border-radius:5px;margin:10px 0 0}
.title-menu{align-self:center;padding:35px clamp(26px,4vw,64px) 35px 28px;max-width:540px;width:100%;position:relative}
.title-nav{display:flex;gap:24px;margin-bottom:52px;padding-bottom:15px;border-bottom:1px solid #b9bea16b}
.title-nav button{background:none;padding:8px 0;font-size:13px;color:#576b49;min-height:40px}
.title-nav button:hover{text-decoration:underline;text-underline-offset:6px}
.title-menu>.eyebrow{color:#7e896b;letter-spacing:.15em}.title-menu h2{font:30px/1.4 var(--serif);margin:14px 0 26px;color:#4f6645}
.title-themes{display:grid;gap:12px}.title-themes button{display:flex;align-items:center;gap:15px;text-align:left;padding:12px 16px;background:#fff9ebaa;border:1px solid #cbd0b6;border-radius:19px;transition:background .25s,transform .25s;min-height:88px}
.title-themes button[aria-pressed=true]{background:#dfe8d1;border-color:#829b70;box-shadow:inset 0 0 0 2px #f7faed}
.title-themes button[data-theme=food][aria-pressed=true]{background:#f2dfca;border-color:#be9878}
.title-themes button:hover{transform:translateX(4px)}.title-themes .spirit-art{width:65px;height:65px}.title-themes b{font-size:17px;font-weight:500;display:block}.title-themes small{display:block;font-size:11px;color:#7d836a;margin-top:8px}
.home-progress{min-height:38px;font-size:12px;line-height:1.8;color:#6c7c58;margin:22px 0 12px}
.home-start{width:100%;display:flex;justify-content:space-between;align-items:center;background:#647f52;color:#fffae9;border-radius:15px;padding:17px 23px;font-size:19px;border:1px solid #5d754e;box-shadow:0 5px 0 #43583a;transition:transform .2s}
.home-start:hover:not(:disabled){transform:translateY(-2px)}.home-start>span{font-size:25px}.home-restart{display:block;margin:17px auto 0;background:none;border-bottom:1px solid #98a387;font-size:12px;padding:7px;color:#6c765f}
.home-save-note{font-size:11px;color:#85876f;text-align:center;line-height:1.8;margin:21px 0}.home-exit{display:block;background:none;color:#677454;padding:10px 0;font-size:12px;margin-top:22px;min-height:40px}
.menu-button{font-size:2.3cqw;padding:.7cqw}
html[data-embedded=true] .club-sidebar,html[data-embedded=true] .collection-sidebar{display:none}
html[data-embedded=true] .picnic-layout{display:flex;justify-content:center;padding:10px;min-height:100svh}
html[data-embedded=true] .game-room{width:min(480px,calc((100svh - 20px)*.6153846));max-width:100%}
@keyframes picnic-bob{0%,100%{translate:0 0;rotate:-3deg}50%{translate:0 -10px;rotate:3deg}}
@media(max-height:650px) and (min-width:761px){.title-illustration{min-height:100svh;padding:24px 45px}.title-illustration h1{font-size:65px;margin-top:15px}.title-illustration h1>span{margin:12px 0}.title-friends{height:160px;max-width:430px}.title-friends>.spirit-art{max-width:170px}.title-note{font-size:11px}.title-menu{padding-top:18px;padding-bottom:18px}.title-nav{margin-bottom:20px}.title-menu h2{font-size:26px;margin:10px 0 15px}.title-themes button{min-height:64px;padding:7px 12px}.title-themes .spirit-art{width:50px;height:50px}.home-progress{margin:12px 0 7px;min-height:24px}.home-start{padding:12px 20px}.home-save-note{margin:13px 0}.home-exit{margin-top:5px}}
@media(max-width:760px){.title-screen{grid-template-columns:1fr;background-position:center top;background-size:auto 100%}.title-illustration{min-height:300px;padding:22px 28px 0}.title-edition{font-size:9px;margin:0}.title-illustration h1{font-size:55px;margin:15px 0}.title-illustration h1>span{font-size:12px;margin:12px 0}.title-friends{position:absolute;right:12px;bottom:10px;width:55%;height:140px}.title-friends>.spirit-art{width:52%;max-width:130px}.friend-dog{left:29%}.friend-cake{right:-6%;bottom:42%}.title-note{display:none}.title-menu{max-width:520px;justify-self:center;padding:24px;background:#fcf8edeb;border-radius:30px 30px 0 0;box-shadow:0 -10px 40px #6d774417}.title-nav{margin-bottom:22px;justify-content:space-between}.title-menu h2{font-size:27px}.title-themes button{min-height:78px}.title-themes .spirit-art{width:56px;height:56px}.home-exit{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.title-friends>.spirit-art{animation:none}.title-themes button,.home-start{transition:none}}


/* Portfolio theatre tuning: larger, tighter title cast and a fuller play area. */
@media (min-width: 1400px) and (min-height: 850px) {
  .title-illustration .title-friends {
    width: 780px;
    height: 270px;
    margin-inline: auto;
  }

  .title-illustration .title-friends .friend-cat,
  .title-illustration .title-friends .friend-dog,
  .title-illustration .title-friends .friend-cake {
    width: 290px;
    height: 290px;
    bottom: 0;
  }

  .title-illustration .title-friends .friend-cat {
    left: 4%;
    right: auto;
  }

  .title-illustration .title-friends .friend-dog {
    left: calc(50% - 145px);
    right: auto;
  }

  .title-illustration .title-friends .friend-cake {
    left: auto;
    right: 4%;
  }

  #play-screen.picnic-layout {
    overflow: hidden;
  }

  #play-screen.picnic-layout .game-room {
    transform: scale(1.24);
    transform-origin: 50% 50%;
  }
}



/* Portfolio cover cast and full-height play room, 2026-09-10. */
@media (min-width: 1200px) and (min-height: 760px) {
  .title-illustration .title-friends {
    width: min(900px, 94%);
    height: 290px;
    margin-inline: auto;
  }

  .title-illustration .title-friends > .spirit-art {
    width: 260px;
    height: 260px;
    max-width: none;
    bottom: 0;
    transform-origin: 50% 86%;
  }

  .title-illustration .title-friends .friend-cat {
    left: 0;
    right: auto;
    bottom: 1%;
    z-index: 1;
  }

  .title-illustration .title-friends .friend-dog {
    left: 20%;
    right: auto;
    bottom: -2%;
    z-index: 2;
  }

  .title-illustration .title-friends .friend-rabbit {
    width: 290px;
    height: 290px;
    left: calc(50% - 145px);
    right: auto;
    bottom: -4%;
    z-index: 5;
    animation-delay: -1s !important;
  }

  .title-illustration .title-friends .friend-berry {
    left: auto;
    right: 20%;
    bottom: -2%;
    z-index: 3;
    animation-delay: -3s !important;
  }

  .title-illustration .title-friends .friend-cake {
    left: auto;
    right: 0;
    bottom: 1%;
    z-index: 1;
  }

  html[data-embedded="true"] .picnic-layout {
    min-height: 100svh;
    padding: 10px;
    overflow: hidden;
  }

  html[data-embedded="true"] .picnic-layout .game-room {
    width: min(680px, calc((100svh - 34px) * .6153846));
    max-width: calc(100vw - 28px);
    transform: none;
    transform-origin: 50% 50%;
  }
}

@media (max-width: 1199px) {
  .title-friends .friend-rabbit,
  .title-friends .friend-berry {
    display: none;
  }
}

/* Portfolio theatre layout: fill the wide frame with useful game context
   instead of magnifying the portrait board. Standalone/mobile stay unchanged. */
@media (min-width: 1280px) and (min-height: 760px) {
  html[data-embedded="true"] #play-screen.picnic-layout {
    display: grid;
    grid-template-columns: minmax(220px, 270px) minmax(0, 590px) minmax(230px, 285px);
    justify-content: center;
    align-items: center;
    gap: clamp(20px, 2.2vw, 38px);
    min-height: 100svh;
    padding: 18px 24px;
    overflow: hidden;
  }

  html[data-embedded="true"] #play-screen .club-sidebar,
  html[data-embedded="true"] #play-screen .collection-sidebar {
    display: flex;
    width: 100%;
    max-width: none;
    max-height: calc(100svh - 42px);
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(112, 126, 91, .32) transparent;
  }

  html[data-embedded="true"] #play-screen .game-room {
    width: min(590px, calc((100svh - 36px) * .6153846));
    max-width: 590px;
    transform: none !important;
    transform-origin: 50% 50%;
  }

  html[data-embedded="true"] #play-screen .club-sidebar {
    justify-self: end;
  }

  html[data-embedded="true"] #play-screen .collection-sidebar {
    justify-self: start;
  }
}

@media (min-width: 1280px) and (min-height: 760px) {
  html[data-embedded="true"] #play-screen .club-sidebar,
  html[data-embedded="true"] #play-screen .collection-sidebar {
    display: block;
  }
}

/* Embedded theatre: cover the complete portfolio frame at every stage. */
html[data-embedded="true"],
html[data-embedded="true"] body {
  width: 100%;
  height: 100%;
  min-height: 100%;
  background: #f3efe4;
}

html[data-embedded="true"] body {
  overflow: hidden;
}

html[data-embedded="true"] #title-screen,
html[data-embedded="true"] #play-screen.picnic-layout {
  width: 100%;
  height: 100%;
  min-height: 100%;
}