.is-home { background: #f5f5e9; }
.is-home > .top { display: none; }
.world-app { --world-ink:#173d31; --world-sub:#365d4c; position: relative; isolation: isolate; min-height: max(800px, 100svh); overflow: clip; display: flex; flex-direction: column; background: #d8ede4; color: var(--world-ink); }
.world-backdrop { position: absolute; z-index: -3; inset: -22px; background: url(/img/playground/world-sky.webp) center bottom / cover no-repeat; translate: calc(var(--look-x, 0px) * -.5) calc(var(--look-y, 0px) * -.5); transition: filter 1.2s, translate .7s; }
.world-backdrop::after { content:""; position:absolute; inset:0; background: linear-gradient(90deg,#ecf4eabf 0%,#edf5ea55 33%,#ecf4ea00 70%); }
.world-atmosphere { position: absolute; z-index: -1; inset:0; pointer-events:none; overflow:hidden; }
.cloud-near { position:absolute; width:360px; right:-130px; top:16%; opacity:.67; animation:cloud-drift 20s ease-in-out infinite alternate; }
.cloud-far { position:absolute; width:260px; left:34%; top:15%; opacity:.38; animation:cloud-drift 28s ease-in-out infinite alternate-reverse; }
.sun-orb { position:absolute; right:21%; top:3%; width:140px; height:140px; border-radius:50%; background:#fff8d9; opacity:.3; filter:blur(15px); }
.world-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px clamp(24px,5vw,80px) 0; position:relative; z-index:10; }
.world-brand { display:block; width:155px; }.world-brand img { width:100%; height:76px; object-fit:contain; }
.world-header-actions { display:flex; gap:28px; align-items:center; }.world-header-actions a { color:var(--world-ink); font-size:14px; font-weight:650; text-decoration:none; }
.world-language { border-bottom:1px solid currentColor; padding:7px 2px; }
.app-download { display:flex; gap:22px; align-items:center; border:1px solid #31533c33; border-radius:999px; color:#254830; background:#fffceb; box-shadow:0 3px 0 #a4b69b; padding:12px 21px; font-size:14px; font-weight:700; transition:transform .2s,box-shadow .2s; }
.app-download:hover { transform:translateY(-2px);box-shadow:0 5px 0 #a4b69b; }.app-download:active { transform:translateY(2px);box-shadow:0 1px 0 #a4b69b; }
.world-toolbar { position:absolute; z-index:4; top:118px; right:clamp(24px,5vw,80px); display:flex; gap:14px; align-items:center; }
.flower-wallet { display:flex; align-items:center; gap:5px; background:#fffdebe8; color:#294d33; border:1px solid #fffef5; border-radius:999px; padding:4px 17px 4px 5px; box-shadow:0 5px 14px #285c2f10; font-size:12px; }
.flower-wallet img { width:37px;height:37px;object-fit:contain; }.flower-wallet strong { font-size:19px; margin-right:4px; }
.world-settings { display:flex; gap:7px; }.world-settings button { height:39px; border:1px solid #42674935; background:#fffeede0; color:#35563b; border-radius:999px; font-size:12px; font-weight:650; }
.time-toggle { display:flex; align-items:center; gap:8px; padding:0 12px; }.time-orb { width:16px;height:16px;background:#edc05b;border:2px solid #d3a845;border-radius:50%;box-shadow:0 0 0 3px #f4de9855; }
.motion-toggle { width:39px; font-size:17px !important; }
.garden-workspace { width:min(1320px,100% - 2 * clamp(24px,5vw,80px)); margin:0 auto; display:grid; grid-template-columns: minmax(270px,.85fr) minmax(0,1.8fr); gap:25px; flex:1; align-items:center; padding:30px 0 20px; }
.garden-sidebar { position:relative;z-index:5; padding-bottom:30px; }
.world-eyebrow { font-size:10px;letter-spacing:.15em;font-weight:750;color:var(--world-sub);margin-bottom:20px; }
.garden-panel h1 { font-size:clamp(44px,5.3vw,74px);line-height:1.02;letter-spacing:-.035em;font-weight:700;color:var(--world-ink);margin-bottom:23px; }
.garden-panel h1 span { color:#4e7538; }.garden-panel h2 { font-size:42px;color:var(--world-ink);margin-bottom:19px;line-height:1.07; }
.panel-intro { font-size:16px;line-height:1.75;max-width:31ch;color:var(--world-sub);margin-bottom:24px; }
.flower-picker { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:24px -4px 27px; }
.flower-pick { background:transparent;border:1px solid transparent;padding:8px 2px 7px;border-radius:14px;color:var(--world-ink);font-size:11px;font-weight:650;touch-action:none;transition:background .2s,transform .25s;user-select:none; }
.flower-pick img { width:100%;height:65px;object-fit:contain;filter:drop-shadow(0 6px 4px #38583625);transition:transform .3s cubic-bezier(.2,1.5,.5,1); }
.flower-pick span { display:block;margin-top:7px; }.flower-pick:hover img { transform:translateY(-9px) rotate(-6deg); }
.flower-pick[aria-pressed="true"] { background:#fffdebd9;border-color:#78985d88;box-shadow:0 3px 0 #78985d30; }
.garden-play { display:flex;align-items:center;gap:9px;width:100%;border:1px solid #427139;border-radius:13px;padding:12px 15px 12px 9px;background:#315f32;color:#fffce9;box-shadow:0 4px 0 #173e24,0 8px 18px #2a57212a;font-weight:700;font-size:14px;transition:transform .2s,box-shadow .2s; }
.garden-play img { width:37px;height:37px;object-fit:contain; }.garden-play span { margin-left:auto;font-size:20px; }.garden-play:hover { transform:translateY(-3px);box-shadow:0 7px 0 #173e24,0 13px 22px #2a57212a; }.garden-play:active { transform:translateY(3px);box-shadow:0 1px 0 #173e24; }
.garden-tip { font-size:11px;color:var(--world-sub);line-height:1.6;margin:17px 0 0;max-width:38ch; }
.island-stage { position:relative;min-width:0;align-self:center;display:flex;flex-direction:column;align-items:center;padding-top:25px; }
.island-heading { position:relative;z-index:3;text-align:center;margin-bottom:4px;pointer-events:none; }
.island-index { display:block;line-height:1.4;font-size:10px;font-weight:700;letter-spacing:.13em;color:var(--world-sub); }.island-heading h2 { font-size:22px;font-weight:650;letter-spacing:-.02em;color:var(--world-ink);margin:5px 0; }.island-heading p { margin-bottom:0;font-size:12px;color:var(--world-sub); }
.island-float { width:110%;max-width:min(780px,max(560px,calc((100svh - 480px) * 1.428)));translate:var(--look-x,0px) var(--look-y,0px);transition:translate .65s ease-out;animation:island-breathe 7s ease-in-out infinite; }
.island-canvas { position:relative;width:100%;aspect-ratio:1200 / 840;user-select:none;-webkit-user-select:none;isolation:isolate; }
.island-ground { position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 35px 20px #31563130);transition:filter 1s;pointer-events:none; }
.garden-arch { position:absolute;width:22%;height:auto;left:42%;top:0%;pointer-events:none;filter:drop-shadow(0 7px 4px #34591f30); }
.garden-plots { position:absolute;inset:0; }
.plot { position:absolute;transform:translate(-50%,-85%);width:14%;height:23%;padding:0;border:0;background:transparent;cursor:crosshair;border-radius:50%; }
.plot img { width:100%;height:100%;object-fit:contain;object-position:bottom;filter:drop-shadow(0 8px 4px #204f2335);pointer-events:none;transition:filter .2s; }
.plot-ring { position:absolute;width:64%;height:21%;bottom:7%;left:18%;border:2px dashed #fcffdde6;border-radius:50%;background:#38552325;box-shadow:0 0 0 4px #eef3b323;transition:background .2s,scale .2s,opacity .2s; }
.plot-ring::after { content:'+';position:absolute;inset:-3px 0 0;text-align:center;color:#fffce2;font:500 20px/1 var(--sans); }
.plot.planted .plot-ring { opacity:0; }.plot.planted { cursor:pointer; }.plot:hover .plot-ring,.plot:focus-visible .plot-ring,.plot.drop-target .plot-ring { opacity:1;background:#fffcad55;scale:1.15; }.plot.planted:hover .plot-ring::after { content:''; }
.plot.selected img { filter:drop-shadow(0 0 5px #fff9ad) drop-shadow(0 8px 4px #204f2335); }.plot.selected .plot-ring { opacity:1;border-style:solid;border-color:#fff0a0; }.plot.selected .plot-ring::after { content:''; }
.plot-0 { left:28%;top:36%;z-index:2; }.plot-1 { left:65%;top:33%;z-index:1; }.plot-2 { left:80%;top:44%;z-index:3; }.plot-3 { left:50%;top:47%;z-index:4; }.plot-4 { left:20%;top:53%;z-index:5; }.plot-5 { left:37%;top:63%;z-index:7; }.plot-6 { left:68%;top:59%;z-index:6; }.plot-7 { left:53%;top:70%;z-index:8; }
.garden-friend { position:absolute;right:3%;top:7%;width:19%;border:0;background:none;padding:0;z-index:9;filter:drop-shadow(0 12px 9px #26471920);transition:scale .3s cubic-bezier(.2,1.6,.4,1); }.garden-friend:hover { scale:1.12; }.garden-friend img { width:100%; }
.friend-speech { position:absolute;right:2%;top:-4%;z-index:10;max-width:28ch;padding:10px 15px;background:#fffbea;border:1px solid #c3cda6;border-radius:14px 14px 2px 14px;color:#315331;font-size:13px;box-shadow:0 4px 15px #173e2020; }
.garden-edit { display:flex;gap:7px;justify-content:center;position:relative;z-index:5;margin-top:-10px; }
.garden-edit button { border:1px solid #d8dcc2;background:#fffbedec;border-radius:999px;color:#3e5935;padding:7px 13px;font-size:12px; }.garden-edit button span { font-size:18px;margin-right:6px; }.garden-edit button:disabled { opacity:.6; }.garden-edit button:hover:not(:disabled) { background:#fff; }
.garden-feedback { text-align:center;min-height:3em;max-width:46ch;font-size:12px;line-height:1.5;color:var(--world-ink);margin:12px 0 0;background:#fbffe17d;border-radius:7px;padding:5px 9px; }
.world-dock { display:flex;gap:10px;align-items:center;justify-content:center;align-self:center;position:relative;z-index:8;margin:0 auto 18px;padding:7px 19px 10px;border:1px solid #fffce7;border-radius:26px;background:#fffcebdc;box-shadow:0 7px 0 #69855930,0 18px 35px #1b493820;backdrop-filter:blur(14px); }
.world-dock button { width:86px;padding:0 5px 7px;border:0;border-radius:17px;background:transparent;color:#3c583a;font-weight:650;font-size:12px;transition:background .2s,transform .25s; }
.world-dock img { height:61px;width:61px;object-fit:contain;margin:-9px auto 5px;filter:drop-shadow(0 5px 3px #304c3520);transition:transform .35s cubic-bezier(.2,1.6,.5,1); }
.world-dock button:hover img { transform:translateY(-9px) rotate(-6deg); }.world-dock button[aria-pressed="true"] { background:#dce8c4; }.world-dock button[aria-pressed="true"] img { transform:translateY(-5px); }.world-dock .dock-play { border-left:1px solid #bfcda7;border-radius:0 17px 17px 0; }
.island-picker { display:grid;gap:10px; }.island-picker button { display:flex;align-items:center;gap:13px;padding:9px 15px 9px 8px;text-align:left;border:1px solid #829c7460;border-radius:15px;background:#fffceb70;color:#26472f;transition:background .2s,transform .3s; }
.island-picker img { width:92px;filter:drop-shadow(0 5px 4px #3d542922); }.island-picker span { font-size:14px;font-weight:650; }.island-picker small { display:block;font-size:10px;letter-spacing:.12em;margin-bottom:4px;font-weight:500; }.island-picker b { margin-left:auto;font-size:21px;font-weight:400; }.island-picker button:hover { transform:translateX(5px); }.island-picker button[aria-pressed="true"] { background:#fffcece8;border-color:#557542;box-shadow:0 3px 0 #6a7a4130; }
.friend-picker { display:grid;grid-template-columns:1fr 1fr;gap:12px; }.friend-picker button { padding:12px 10px;border:1px solid #b2c4a688;border-radius:17px;background:#fffcef70;color:#26472f;font-size:13px;font-weight:650;transition:background .2s,transform .3s; }.friend-picker img { width:88px;height:88px;object-fit:contain;margin:auto auto 7px; }.friend-picker button[aria-pressed="true"] { background:#fffdece8;border-color:#557542; }.friend-picker button:hover { transform:translateY(-4px); }
.drag-flower { position:fixed;width:100px;height:110px;object-fit:contain;transform:translate(-50%,-75%) rotate(-8deg);z-index:100;pointer-events:none;filter:drop-shadow(0 16px 9px #1d421f40); }.dragging .plot:not(.planted) .plot-ring { background:#fffac640;border-style:solid; }.dragging { cursor:grabbing; }
.world-app.evening { --world-ink:#f3f1d9;--world-sub:#e3ecd4;background:#294b56; }.evening .world-backdrop { filter:brightness(.42) saturate(.7) hue-rotate(22deg); }.evening .world-backdrop::after { background:linear-gradient(90deg,#102d45aa,#173d4733 60%,transparent); }.evening .garden-panel h1 span { color:#d1e6a4; }.evening .island-ground { filter:brightness(.77) drop-shadow(0 30px 20px #10272970); }.evening .island-picker button,.evening .friend-picker button { background:#fffcebd9; }.evening .time-orb { background:#fffbd7;border-color:#d9dca3;box-shadow:inset 5px -2px 0 #6c8290; }.evening .garden-feedback { background:#163a4dca; }.evening .flower-pick[aria-pressed="true"] { color:#284c30; }.evening .sun-orb { background:#f3f5db;opacity:.7;width:75px;height:75px;filter:blur(1px);right:30%;top:10%; }
@keyframes island-breathe { 50% { transform:translateY(-9px); } }
@keyframes cloud-drift { to { transform:translateX(45px); } }
.still *, .still *::before, .still *::after { animation:none !important;transition:none !important; }.still .island-float { translate:0 0; }
.no-js { position:absolute;bottom:160px;background:#fffbe4;padding:18px;left:10%;right:10%;z-index:20; }
.is-home .foot { padding-top:40px; }.is-home .foot .wrap { grid-template-columns:1.3fr 1fr 1fr; }.is-home .foot .fine { margin-top:5px; }
@media (min-width:1500px) { .garden-workspace { max-height:760px; }.island-float { width:115%; }.garden-panel h1 { font-size:78px; } }
@media (max-width:1100px) {
 .garden-workspace { grid-template-columns:minmax(260px,.85fr) minmax(0,1.35fr);gap:15px;padding-top:76px; }.garden-panel h1 { font-size:55px; }.island-float { width:103%; }.island-stage { padding-top:20px; }.island-heading { margin-bottom:10px; }.garden-arch { width:20%;top:3%; }.garden-edit { margin-top:12px; }.garden-feedback { max-width:34ch; }.world-toolbar { top:113px; }.world-header { padding-top:15px; }.world-app { min-height:max(840px,100svh); }
}
@media (max-width:760px) {
 .world-app { min-height:100svh;padding-bottom:115px;overflow:hidden; }.world-header { padding:10px 20px 0;gap:12px; }.world-brand { width:108px; }.world-brand img { height:56px; }.world-header-actions { gap:15px; }.world-support { display:none; }.world-header-actions a { font-size:12px; }.app-download { font-size:12px;padding:9px 13px;gap:10px; }.world-toolbar { position:relative;top:auto;right:auto;margin:12px 20px 0;justify-content:space-between;gap:8px; }.flower-wallet { font-size:11px;padding-right:12px; }.flower-wallet img { width:31px;height:31px; }.flower-wallet strong { font-size:17px; }.world-settings button { height:34px; }.motion-toggle { width:34px; }.time-toggle { font-size:11px!important; }
 .garden-workspace { width:100%;display:flex;flex-direction:column-reverse;gap:0;padding:18px 0 15px;margin:0; }.garden-sidebar { width:calc(100% - 42px);max-width:460px;padding:12px 0 0;scroll-margin-bottom:110px; }.garden-panel { text-align:center; }.garden-panel .world-eyebrow { display:none; }.garden-panel h1 { font-size:36px;line-height:1.1;margin-bottom:12px; }.garden-panel h1 br { display:none; }.garden-panel h1 span::before { content:' '; }.garden-panel h2 { font-size:32px;line-height:1.15;margin-bottom:12px; }.panel-intro { font-size:14px;line-height:1.6;max-width:35ch;margin:0 auto 17px; }.flower-picker { width:min(100%,360px);margin:12px auto 18px;gap:8px; }.flower-pick { font-size:11px;padding:5px 3px; }.flower-pick img { height:60px; }.flower-pick span { margin-top:2px; }.garden-play { max-width:360px;margin:auto;justify-content:center;font-size:14px;padding:9px 15px 9px 9px; }.garden-play span { margin-left:5px; }.garden-play img { width:31px;height:31px; }.garden-tip { font-size:11px;margin:12px auto 0;max-width:38ch; }
 .island-stage { width:100%;max-width:510px;padding:0;margin:auto; }.island-heading { margin-bottom:-2px; }.island-index { display:block;line-height:1.4;font-size:9px; }.island-heading h2 { font-size:18px;margin:2px 0; }.island-heading p { font-size:10px;margin-bottom:0; }.island-float { width:103%; }.garden-arch { width:22%;top:0; }.plot-ring { border-width:1.5px; }.plot-ring::after { font-size:15px; }.garden-edit { margin-top:-15px; }.garden-edit button { padding:4px 10px;font-size:11px; }.garden-edit button span { font-size:14px; }.garden-feedback { min-height:2.5em;max-width:38ch;font-size:11px;margin:8px 15px 0; }.friend-speech { font-size:11px;max-width:23ch;top:-8%;right:5%; }.world-backdrop { background-position:center top;background-size:auto 100%; }.world-backdrop::after { background:linear-gradient(#e7f4e355 20%,#e7f4e366 40%,#e7f4e3f2 90%); }.evening .world-backdrop::after { background:linear-gradient(#193c4433,#17394fd9); }
 .world-dock { position:fixed;bottom:12px;left:50%;transform:translateX(-50%);margin:0;gap:2px;padding:7px 8px 5px;border-radius:23px;width:calc(100% - 24px);max-width:440px; }.world-dock button { width:20%;font-size:10px;padding:0 2px 6px;border-radius:13px; }.world-dock img { width:46px;height:46px;margin:-9px auto 4px; }.world-dock .dock-play { border-radius:0 13px 13px 0; }.is-home .foot { padding-bottom:125px; }.is-home .foot .wrap { grid-template-columns:1fr 1fr; }
 .island-picker { grid-template-columns:repeat(3,minmax(0,1fr));gap:7px; }.island-picker button { flex-direction:column;padding:10px 3px;gap:5px;text-align:center; }.island-picker img { width:100%; }.island-picker span { font-size:11px; }.island-picker small,.island-picker b { display:none; }.friend-picker { grid-template-columns:repeat(4,minmax(0,1fr));gap:6px; }.friend-picker button { padding:9px 3px;font-size:11px; }.friend-picker img { width:100%;height:60px; }
}
@media (max-width:360px) { .world-header-actions { gap:10px; }.app-download { font-size:11px;gap:7px; }.world-brand { width:92px; }.flower-wallet { font-size:10px; }.time-toggle { padding-inline:9px; }.garden-panel h1 { font-size:33px; }.world-toolbar { margin-inline:15px; } }
