:root{--cream:#fffaf0;--paper:#fffdf7;--green:#32765b;--deep:#174c3a;--lime:#9ccc65;--coral:#f0786b;--pink:#f5aaa6;--gold:#e7af45;--ink:#284238;--muted:#718079;--shadow:0 10px 24px #254b3430;--soft:0 4px 0 #0002;font-family:Nunito,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#dfead9}body{overscroll-behavior:none}.screen{display:none;min-height:100dvh;padding-bottom:92px;background:linear-gradient(#f8f2df,#eef6e9)}.screen.active{display:block}.hero{min-height:100dvh;padding:max(28px,env(safe-area-inset-top)) 20px 110px;display:flex;flex-direction:column;align-items:center;background:linear-gradient(#183b2644,#183b2608 24%,#173a2844 72%,#173a28cc),url("../art/floramenta/garden-brain-flower.png") center/cover}.brand{font-family:Georgia,serif;font-size:clamp(35px,10vw,54px);line-height:.72;letter-spacing:.02em;text-align:center;color:#fff8d7;text-shadow:0 3px 0 #225c3c,0 7px 18px #123b29}.brand span{display:block}.brand span+span{font-size:.73em;letter-spacing:.18em;margin-left:.18em}.tagline{margin:14px 0;color:white;font-weight:800;text-shadow:0 2px 8px #173b2d}.hero-spacer{flex:1}.welcome-card{display:flex;align-items:center;gap:12px;width:min(100%,430px);padding:15px;border:2px solid #ffffffaa;border-radius:24px;background:#fffdf1ed;box-shadow:var(--shadow)}.welcome-card small,.topbar small{color:var(--green);font-weight:900;letter-spacing:.11em}.welcome-card p{margin:3px 0 0;font-weight:700;line-height:1.35}.zora-orb{flex:0 0 54px;height:54px;display:grid;place-items:center;border-radius:50%;font:700 29px Georgia;color:white;background:radial-gradient(circle at 35% 25%,#ffc4ba,#dd6d81 55%,#8b4368);border:3px solid white;box-shadow:0 4px 10px #6f394d55}.primary,.secondary{border:0;border-radius:18px;font-family:inherit;font-weight:800;font-size:17px;cursor:pointer}.primary{width:min(100%,430px);margin-top:14px;padding:17px 22px;color:white;background:linear-gradient(#6eae62,#3c8657);box-shadow:0 5px 0 #23613e,0 9px 20px #173c2c55}.primary:active{transform:translateY(3px);box-shadow:0 2px 0 #23613e}.primary span{float:right;font-size:22px}.compact{width:auto;margin:0;padding:13px 22px}.secondary{padding:13px;background:#edf5e8;color:var(--deep);border:2px solid #b8d2ae}.dev-btn{position:absolute;right:12px;top:max(10px,env(safe-area-inset-top));opacity:.25;border:0;background:#fff8;border-radius:7px;font-size:9px}.store-btn{position:absolute;left:12px;top:max(10px,env(safe-area-inset-top));z-index:5;border:0;border-radius:17px;padding:9px 14px;color:#fff;background:linear-gradient(135deg,#3f8657,#2f80ed);box-shadow:0 3px 0 #1c4c2f,0 6px 14px #0004;font:800 13px/1 Nunito,system-ui,-apple-system,"Segoe UI",sans-serif}.store-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #1c4c2f}.dev-reset-btn{position:absolute;z-index:6;right:14px;top:70px;opacity:.55;border:0;border-radius:10px;padding:7px 10px;background:#0008;color:#fff;font:800 10px/1 system-ui,-apple-system,"Segoe UI",sans-serif}.dev-reset-btn:active{opacity:.9}.topbar,.gamebar{position:sticky;top:0;z-index:4;display:flex;align-items:center;gap:12px;min-height:72px;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:#fffaf0ee;backdrop-filter:blur(12px);box-shadow:0 3px 15px #234b3320}.topbar div{flex:1}.topbar b{display:block;font-size:18px}.back,.gamebar button{width:42px;height:42px;border:0;border-radius:14px;background:#e2eedc;color:var(--deep);font-size:28px}.pill{padding:7px 11px;border-radius:999px;background:#e2efdc;color:var(--deep);font-weight:900;white-space:nowrap}.garden-path{padding:20px;max-width:650px;margin:auto}.session-games{display:grid;gap:16px}.session-card,.game-card{position:relative;overflow:hidden;background:var(--paper);border:2px solid white;border-radius:24px;box-shadow:var(--shadow)}.session-card{display:grid;grid-template-columns:84px 1fr;align-items:center;padding:12px}.game-icon{height:76px;display:grid;place-items:center;border-radius:18px;font-size:37px;background:linear-gradient(145deg,var(--c1),var(--c2));box-shadow:inset 0 3px #fff7,0 4px 0 #0002}.session-card h3,.game-card h3{margin:0}.session-card p,.game-card p{margin:5px 0;color:var(--muted);font-weight:650}.level-dots{display:flex;gap:6px;margin-top:8px}.level-dots i{width:18px;height:9px;border-radius:9px;background:#d9e2d5}.level-dots i.done{background:#75a95f}.session-card.current{outline:3px solid #efb85d}.session-card.locked{filter:saturate(.3);opacity:.7}.tip-card,.entries{margin-top:20px;padding:17px;border-radius:20px;background:#e6f0dc;color:#456047;font-weight:650}.game-grid{padding:18px;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:760px;margin:auto}.game-card{padding:12px}.game-card .game-icon{height:105px;margin-bottom:12px}.bottom-nav{position:fixed;z-index:10;bottom:0;left:50%;translate:-50%;display:flex;width:min(100%,680px);padding:8px 10px calc(8px + env(safe-area-inset-bottom));border-radius:23px 23px 0 0;background:#fffdf6ee;box-shadow:0 -5px 25px #244a3228;backdrop-filter:blur(14px)}.bottom-nav button{flex:1;border:0;background:none;color:#758079;font-weight:800}.bottom-nav span{display:block;font-size:25px}.bottom-nav .selected{color:var(--green)}.calendar-controls,.weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;padding:0 14px;max-width:650px;margin:auto}.calendar-controls{grid-template-columns:48px 1fr 48px;align-items:center;padding-top:18px}.calendar-controls p{text-align:center;font-size:13px;color:var(--muted)}.calendar-controls button,.text-btn{border:0;border-radius:13px;background:#e2eedc;color:var(--deep);font-weight:800;font-size:24px}.text-btn{font-size:12px;padding:9px}.weekdays span{text-align:center;padding:8px 0;color:var(--muted);font-size:12px;font-weight:900}.day{aspect-ratio:1;border:0;border-radius:16px;background:#fffdf8;color:var(--ink);font-weight:800;box-shadow:0 2px 5px #234b3320}.day.other{opacity:.34}.day.today{outline:3px solid var(--coral)}.day.has-entry:after{content:"";display:block;width:6px;height:6px;border-radius:50%;background:var(--green);margin:3px auto}.entries{margin:18px}.entry{border-bottom:1px solid #c9d8c1;padding:10px 0}.entry:last-child{border:0}.entry b{color:var(--green)}.fab{position:fixed;right:22px;bottom:102px;width:58px;height:58px;border:0;border-radius:50%;color:white;background:var(--coral);font-size:32px;box-shadow:0 5px 0 #bc554f,0 8px 20px #6f383850}.life-book{max-width:650px;margin:22px auto;padding:26px 22px;background:linear-gradient(90deg,#f4ead1 0 3%,#fffdf7 3% 97%,#eadbb8 97%);border-radius:12px 25px 25px 12px;box-shadow:var(--shadow);min-height:70vh}.chapter{color:var(--coral);font-weight:900;letter-spacing:.1em}.page-number{float:right;color:var(--muted)}.life-book h2{font:700 26px/1.3 Georgia;margin-top:35px}.life-book textarea{width:100%;padding:15px;border:2px solid #d7dfce;border-radius:16px;background:#fffefa;font-family:inherit;font-size:18px;line-height:1.5;resize:vertical}.editor-actions,.page-nav{display:flex;justify-content:space-between;gap:10px;margin-top:14px}.page-nav button{border:0;background:none;color:var(--green);font-weight:900;padding:12px}.game-screen{padding:0;background:#13281e}.gamebar{position:absolute;top:0;left:0;right:auto;min-height:0;height:auto;padding:0;background:none;box-shadow:none;backdrop-filter:none;z-index:6;pointer-events:none}.gamebar #closeGame{pointer-events:auto;margin:calc(6px + env(safe-area-inset-top)) 0 0 8px;width:52px;height:52px;font-size:28px;border-radius:16px;background:#fffdf7e8;box-shadow:0 2px 10px #234b3333,inset 0 0 0 2px #d7e5d1}.gamebar b,.gamebar .pill{display:none}.game-screen iframe{width:100%;height:100dvh;border:0;background:white}.dev-complete{position:fixed;right:5px;bottom:5px;z-index:8;opacity:.18;font-size:9px}dialog{width:min(calc(100% - 28px),560px);max-height:88dvh;border:0;border-radius:28px;padding:26px;background:var(--paper);color:var(--ink);box-shadow:0 25px 80px #102a1c88}dialog::backdrop{background:#183726aa;backdrop-filter:blur(4px)}.dialog-close{float:right;border:0;background:#e7eee1;border-radius:50%;width:35px;height:35px}.dialog-art{text-align:center;font-size:54px}.dialog-content h2{text-align:center;font:700 27px Georgia}.dialog-content p{line-height:1.5}.choice-row{display:flex;gap:10px}.choice-row button{flex:1}.ad-card{padding:15px;border-radius:18px;background:#fff0d4}.hidden{display:none!important}
@media(min-width:700px){.hero{background-size:auto 115%;background-repeat:no-repeat;background-color:#31573d}.game-grid{grid-template-columns:repeat(3,1fr)}}

/* Original 440×900 mobile stage contract (scale.js v5). */
html,body{width:100%;height:100%;overflow:hidden;background:#183d2b}
body::before{content:"";position:fixed;inset:-28px;z-index:0;background-position:center;background-size:cover;filter:blur(18px) brightness(.58) saturate(.9);transform:scale(1.08)}
body[data-screen="home"]::before{background-image:url("../art/floramenta/v2/home-lobby-new.png")}
body[data-screen="session"]::before,body[data-screen="library"]::before{background-image:url("../art/floramenta/v2/screen-session.png")}
body[data-screen="calendar"]::before{background-image:url("../art/floramenta/v2/screen-memory-scroll.png")}
body[data-screen="life"]::before{background-image:url("../art/floramenta/v2/screen-life-scroll.png")}
#app{position:fixed;z-index:1;left:50%;top:50%;width:var(--dw,440px);height:var(--dh,900px);overflow:hidden;transform:translate(-50%,-50%) scale(var(--scale,1));transform-origin:center;background:#eef6e9;box-shadow:0 0 80px #071b1288}
#app>.screen{width:100%;height:100%;min-height:0;overflow-y:auto}
#app .hero{width:100%;height:100%;min-height:0;padding-top:28px}
#app .bottom-nav{position:absolute;left:0;bottom:0;translate:none;width:100%;padding-bottom:10px}
#app .fab{position:absolute}
#app dialog{width:calc(100% - 28px);max-height:790px}
.game-screen{position:fixed;inset:0;z-index:30;width:100%;height:100%;min-height:100dvh;padding:0;overflow:hidden}
html.landscape body::after{content:"Поверніть телефон вертикально";position:fixed;inset:0;z-index:999999;display:grid;place-items:center;padding:30px;color:#fff9dd;background:#183d2b url("../art/floramenta/game-pavilion.png") center/cover;font:800 24px/1.3 Georgia;text-align:center;text-shadow:0 2px 8px #142d21}

/* Floramenta V2 — generated casual-game production art, not system UI. */
#home{overflow:hidden;padding:0}
/* Painted lobby still, beneath every control (the hero's interactive children
   all carry z-index 4-6). 878x1792 is within 0.3% of the 440x900 stage ratio,
   so `cover` crops almost nothing. */
#home .hero{position:relative;padding:0;background-image:url("../art/floramenta/v2/home-lobby-new.png");background-position:center;background-size:cover}
#home .brand{display:none}
#home .tagline{display:none}
#home .dev-btn{z-index:5;top:192px;right:8px;width:24px;height:24px;color:transparent;background:transparent;opacity:.15}
/* Small unobtrusive developer entry point. */
#home #storeBtn.store-btn{position:absolute!important;z-index:6!important;top:max(14px,env(safe-area-inset-top))!important;left:14px!important;right:auto!important;bottom:auto!important;display:inline-flex!important;align-items:center;justify-content:center;visibility:visible!important;opacity:1!important}
#home #devReset.dev-reset-btn{position:absolute!important;z-index:6!important;top:64px!important;left:14px!important;right:auto!important;bottom:auto!important;display:inline-flex!important;visibility:visible!important;opacity:.55!important}
#home #devNextDay.dev-next-day-btn{position:absolute;z-index:6;top:104px;left:14px;border:0;border-radius:10px;padding:8px 11px;color:#fff;background:#0009;font:800 11px/1 system-ui,-apple-system,"Segoe UI",sans-serif;opacity:.7}
#home #devNextDay.dev-next-day-btn:active{opacity:1;transform:translateY(1px)}
#home .hero-spacer{display:none}
#home .welcome-card{display:none}
#home .welcome-card .zora-orb{display:none}
#home .welcome-card small{display:none}
#home .welcome-card p{margin:0;color:#59422d;font-size:12.5px;line-height:1.25;text-shadow:0 1px #fff}
#home #startDay{position:absolute;z-index:4;left:92px;right:92px;bottom:142px;width:auto;height:82px;margin:0;padding:0 20px 5px;border:0;border-radius:0;color:#fff;background:none;box-shadow:none;font-size:20px;text-shadow:0 2px 0 #27612e,0 3px 4px #173d2b88}
#home .day-cooldown{position:absolute;z-index:5;left:78px;right:78px;bottom:226px;padding:9px 12px;border:2px solid #f5d98c;border-radius:14px;color:#fff8dc;background:#173d2bd9;box-shadow:0 5px 14px #102a1c66;font-size:14px;font-weight:900;text-align:center;text-shadow:0 2px 3px #102a1c}
#home.day-complete #startDay{filter:saturate(.7);opacity:.88}
#home #startDay:active{transform:translateY(5px);filter:brightness(.94);box-shadow:none}
#home #startDay span{display:none}
#app .bottom-nav{height:128px;padding:15px 30px 6px;background:none;box-shadow:none;backdrop-filter:none}
#app #bottomNavBackdrop{position:absolute;z-index:0;left:-1.5%;bottom:0;width:103%;height:103%;object-fit:fill;pointer-events:none}
#home #bottomNavBackdrop{display:block}
.layout-editing #home #bottomNavBackdrop{opacity:.58}
#app .bottom-nav button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;padding:0;color:#4a3a27;background:transparent;border:0;filter:none;transition:none}
#app .bottom-nav button img{position:absolute;top:1px;width:92px;height:92px;object-fit:contain;filter:drop-shadow(0 4px 2px #50371955)}
#app .bottom-nav button.selected{color:#285f3c;filter:none;transform:none}
#home~*{} /* keep V2 home rules easy to locate */

/* Generated screen worlds */
#session{position:relative;overflow:hidden;background:url("../art/floramenta/v2/screen-session.png") center/cover}
#calendar{position:relative;background:url("../art/floramenta/v2/screen-memory-scroll.png") center/100% 100% no-repeat}
#life{position:relative;background:url("../art/floramenta/v2/screen-life-scroll.png") center/cover}
#session .topbar,#calendar .topbar,#life .topbar,#library .topbar{height:78px;min-height:78px;margin:8px 12px 0;padding:10px 18px;background:transparent url("../art/floramenta/v2/dialog-panel.png") center/100% 100% no-repeat;box-shadow:none;backdrop-filter:none}
.topbar>div{min-width:0;padding:0 6px}
.topbar>div small{display:none}
.topbar>div b{font-size:17px;line-height:1.12}
#session .topbar>div,#life .topbar>div{padding-right:20px}
#session #sessionCount,#life #lifeProgress{display:none}
.topbar .back{flex:0 0 52px;width:52px;height:52px;color:transparent;background:transparent url("../art/floramenta/v2/button-back-v2.png") center/72px auto no-repeat;box-shadow:none}
.topbar .back:active{transform:translateY(3px);box-shadow:none}
.topbar small{color:#8a5729;text-shadow:0 1px #fff}
.topbar b{color:#4e3825;text-shadow:0 1px #fff}

/* The route header is two independent controls, not one stretched panel. */
#session .topbar{width:58px;height:62px;min-height:62px;margin:14px 0 0 18px;padding:0;background:none}
#session .topbar .back{flex:0 0 58px;width:58px;height:58px;background-size:80px auto;background-position:center}
.category-backbar{width:58px!important;height:62px!important;min-height:62px!important;margin:14px 0 0 18px!important;padding:0!important;background:none!important}
.category-backbar .back{flex:0 0 58px;width:58px;height:58px;background-size:80px auto;background-position:center}
#calendar .memory-actions{height:62px;min-height:62px;margin:14px 18px 0;padding:0;justify-content:space-between;background:none}
#calendar .memory-actions .back{flex:0 0 58px;width:58px;height:58px;background-size:80px auto;background-position:center}
#calendar .memory-actions #todayBtn{align-self:center}

/* Daily route: content sits on the three generated stone pedestals. */
#session .garden-path{position:absolute;inset:80px 0 128px;padding:0}
#session .session-games{position:relative;width:100%;height:100%;display:block}
#session .session-card{position:absolute;width:190px;height:108px;display:block;padding:0;text-align:center;border:0;border-radius:50%;background:transparent;box-shadow:none;outline:0;overflow:visible}
#session .session-card:nth-child(1){left:155px;bottom:103px}
#session .session-card:nth-child(2){left:124px;bottom:271px}
#session .session-card:nth-child(3){left:165px;bottom:398px}
#session .session-card .game-icon{position:absolute;left:50%;bottom:50%;display:block;width:112px;height:112px;margin:0;translate:-50% 0;background:none;box-shadow:none}
#session .session-card .game-icon img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 2px #50371955)}
#session .session-card h3,#session .session-card p,#session .level-dots{display:none}
#session .level-counter{position:absolute;z-index:2;left:50%;bottom:calc(50% + 108px);min-width:54px;padding:5px 10px 6px;translate:-50% 0;border:2px solid #fff1bd;border-radius:15px;color:#5b371d;background:#fff4d9e8;font:900 18px/1 Georgia;text-shadow:0 1px #fff;box-shadow:0 3px 0 #9a6b35,0 5px 12px #50371944}
#session .session-card.available .level-counter{color:#285c3e;background:#f4ffdcea}
#session .session-card.done .level-counter{color:#fff;background:#3f8757e8;border-color:#eaffc8;text-shadow:0 1px #285c3e}
#session .tip-card{display:none}

/* Memory journal: one date and a bounded, scrollable memory list. */
#calendar .memory-day{position:absolute;z-index:2;left:72px;right:72px;top:112px;height:214px;display:grid;place-items:center}
#calendar .memory-day>button{position:absolute;z-index:5;top:50%;width:62px;height:62px;color:transparent;border:0;background-color:transparent;background-position:center 52%;background-size:84px auto;background-repeat:no-repeat;filter:drop-shadow(0 4px 3px #5a3a2166);transform:translateY(-50%)}
#calendar .memory-day>#prevMonth{left:-18px}
#calendar .memory-day>#nextMonth{right:-18px}
#calendar #prevMonth{background-image:url("../art/floramenta/v2/button-prev-v2.png")}
#calendar #nextMonth{background-image:url("../art/floramenta/v2/button-next-v2.png")}
#calendar .memory-date{position:relative;z-index:1;height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#5a3f28;text-align:center;text-shadow:0 1px #fff6cf}
#calendar .memory-date span:first-child{font-weight:900;font-size:16px;color:#8e5932}
#calendar .memory-date strong{font:800 66px/.92 Georgia;color:#684322}
#calendar .memory-date span:last-child{margin-top:7px;font-weight:900;font-size:16px}
#calendar .memory-workspace{position:absolute;z-index:2;left:58px;right:58px;top:344px;bottom:124px;display:flex;flex-direction:column;min-height:0;padding:14px 16px 10px;color:#5a402b}
#calendar .memory-workspace>label{display:block;align-self:flex-start;margin:0 0 7px;padding:0 8px;border-radius:8px;background:#fff2d2;font-weight:900;font-size:18px;line-height:1.25}
#calendar #memoryAnswer{width:100%;height:116px;min-height:116px;padding:13px 14px;border:3px solid #d8a84d;border-radius:16px;background:#fffdf2ed;color:#41392f;font-family:inherit;font-size:18px;line-height:1.4;resize:none;box-shadow:inset 0 3px 8px #7b5d3422}
#calendar .memory-workspace.is-locked #memoryAnswer,
#life .life-book.is-locked #lifeAnswer{background:#f1eee5;color:#625f58;cursor:default}
#calendar .memory-workspace.is-locked .memory-editor-actions button:disabled,
#life .life-book.is-locked .editor-actions button:disabled{opacity:.48;filter:saturate(.35);cursor:not-allowed;transform:none;box-shadow:none}
#calendar .memory-editor-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 0 8px}
#calendar .memory-editor-actions .secondary{min-width:162px;padding-top:11px;padding-bottom:11px}
#calendar .memory-editor-actions .primary{height:54px;min-width:116px;margin:0;padding:0 14px 4px;border:0;border-radius:0;color:#fff;background:transparent url("../art/floramenta/v2/primary-button.png") center/100% 100% no-repeat;box-shadow:none;text-shadow:0 2px #285c34}
#calendar .entries{position:static;z-index:auto;flex:1;min-height:0;width:auto;max-height:none;margin:0;padding:8px;overflow-y:auto;overscroll-behavior:contain;background:#fffdf2d8;border:2px solid #d8a84d;border-radius:14px;box-shadow:inset 0 2px #fff;scrollbar-width:thin;scrollbar-color:#c98a3d transparent}
#calendar .memory-list-title{position:sticky;top:-12px;z-index:1;margin:-12px -10px 10px;padding:12px 14px 9px;color:#76502e;background:#fff0c9f5;border-bottom:2px solid #dfb968;font-weight:900;text-align:center}
#calendar .entry{margin:0 0 10px;padding:12px 13px;border:2px solid #e4c886;border-radius:14px;background:#fffdf2;box-shadow:0 3px 0 #b68b4e33}
#calendar .entry:last-child{margin-bottom:0}
#calendar .entry b{display:block;margin-bottom:5px;color:#8b552d;font-size:17px}
#calendar .entry p{margin:5px 0;color:#4f493b;line-height:1.35}
/* min-height, not height: a centred flex box that is SHORTER than its content
   overflows in both directions and the scroll container cannot reach the top,
   so the heading was clipped above and the last line below. */
#calendar .memory-empty{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 8px;color:#6e5032;text-align:center}
#calendar .memory-empty b{font:800 21px/1.2 Georgia}
#calendar .memory-empty p{margin:10px 0 0;line-height:1.35}
#calendar #todayBtn{min-width:76px;height:42px;padding:0 12px;border:2px solid #d49a35;border-radius:17px;color:#285c3e;background:linear-gradient(#fff8d9,#e8f0d4);box-shadow:inset 0 2px #fff,0 3px 0 #936629,0 5px 9px #4f351f33;text-shadow:0 1px #fff}

/* My Life uses one front-facing scroll with a large functional writing area. */
#life .life-book{position:absolute;left:56px;right:56px;top:126px;height:610px;min-height:0;margin:0;padding:28px 22px 20px;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:hidden}
#life .chapter{color:#9b5b35}
#life .page-number{color:#8f775f}
#life .life-book h2{margin:22px 0 16px;font-size:24px;line-height:1.22;color:#5b402b}
#life .life-book textarea{height:270px;min-height:270px;padding:16px;background:#fffdf2e8!important;border:3px solid #d8b86c;border-radius:18px;font-size:18px;line-height:1.45;box-shadow:inset 0 3px 8px #7b5d3428}
#life .editor-actions{align-items:center;margin-top:14px}
#life .editor-actions .secondary{min-width:168px;padding-top:13px;padding-bottom:13px}
#life .editor-actions .primary{height:54px;min-width:116px;padding:0 14px 4px}
#life .page-nav{margin-top:14px}
#life .page-nav button{padding:9px 12px;border:2px solid #d5aa58;border-radius:14px;color:#5c452f;background:#fff4cde8;text-shadow:0 1px #fff;box-shadow:0 3px 0 #9b6b38}
.mic{position:relative;padding-left:48px!important}
.mic::before{content:"";position:absolute;left:4px;top:50%;width:42px;height:42px;transform:translateY(-50%);background:url("../art/floramenta/v2/button-mic.png") center 52%/50px auto no-repeat}

/* Generated modal frame and button artwork. */
#app dialog{padding:120px 58px 75px;border:0;border-radius:0;background:transparent url("../art/floramenta/v2/modal-panel.png") center/100% 100% no-repeat;box-shadow:none}
#app dialog::backdrop{background:#173d2ba8;backdrop-filter:blur(7px)}
#app .dialog-close{position:absolute;z-index:2;right:22px;top:36px;width:58px;height:58px;color:transparent;border:0;background:transparent url("../art/floramenta/v2/button-close.png") center 52%/68px auto no-repeat;box-shadow:none}
#app .dialog-close:focus{outline:0}
#app dialog .primary,#app .life-book .primary{border:0;background:transparent url("../art/floramenta/v2/primary-button.png") center/100% 100% no-repeat;box-shadow:none;text-shadow:0 2px #285c34}
#app dialog .dialog-art{display:none}
#app dialog .dialog-content h2{margin:6px 0 18px;line-height:1.12}
#app dialog .dialog-content>p{margin:0 0 16px;line-height:1.42}
#app dialog #subscribe{transform:translateY(-10px)}
#app dialog #rewardAd{height:44px!important;margin-top:0!important;padding:8px 12px;transform:translateY(-14px)}
#app dialog .choice-row{align-items:center}
#app dialog .choice-row .secondary{min-height:44px}
#library{padding-bottom:18px}
#library{background:linear-gradient(#173d2b55,#173d2b88),url("../art/floramenta/v2/screen-session.png") center/cover}
#library .topbar{position:sticky;top:8px}
#library .game-grid{padding:18px 18px 34px;gap:14px}
#library .game-card{min-height:186px;padding:9px;border:3px solid #d9aa4c;border-radius:24px;background:#fff8dff2;box-shadow:inset 0 2px #fff,0 6px 0 #8d6238,0 12px 22px #19372555}
#library .game-card .game-icon{position:relative;height:105px;margin-bottom:10px;overflow:hidden;border:3px solid #f6dda0;border-radius:17px;color:#fff8d4;font:800 46px Georgia;text-shadow:0 3px 0 #3f553d88;box-shadow:inset 0 3px #fff8,0 4px 0 #8b653c}
#library .game-card .game-icon img{position:absolute;inset:4px;display:block;width:calc(100% - 8px);height:calc(100% - 8px);object-fit:contain}
#library .game-card h3{font-size:17px;line-height:1.12;color:#493824}
#library .game-card p{font-size:13px;line-height:1.15;color:#6d695b}
#library .game-card{text-align:center}
#library .game-card h3,#library .game-card p{width:100%;margin-left:auto;margin-right:auto;text-align:center}
#library .game-card>div:last-child{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}

/* Startup intro */
body.intro-active{overflow:hidden}
.intro-overlay{position:fixed;z-index:200000;inset:0;display:grid;place-items:center;overflow:hidden;background:#07180f;opacity:1;transition:opacity .28s ease}
.intro-overlay[hidden]{display:grid}
.intro-overlay.finished[hidden]{display:none}
.intro-overlay.closing{opacity:0;pointer-events:none}
/* Same rule as everywhere else: never crop, only paint in the spare space.
   The video is 1080x1920 (9:16), real device viewports are usually taller
   (9:19.5+), so object-fit:cover was cropping the left/right edges — the one
   place that still scaled by cropping instead of letterboxing. Fixed: the
   video itself is `contain` (zero crop), and a blurred still of the same
   shot fills the bars behind it, matching #app's body::before treatment. */
.intro-overlay::before{content:"";position:absolute;inset:-28px;z-index:0;background:url("../intro/loading-poster.jpg") center/cover;filter:blur(22px) brightness(.5) saturate(.9);transform:scale(1.08)}
.intro-overlay video{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;background:transparent}
.intro-skip{display:none!important}
.intro-loading{position:absolute;z-index:2;left:50%;bottom:max(34px,calc(env(safe-area-inset-bottom) + 22px));translate:-50% 0;width:min(78%,340px);padding:7px;border-radius:999px;background:#f7fff0e8;box-shadow:0 5px 18px #062d1a80,inset 0 1px #fff}
.intro-progress{height:16px;overflow:hidden;border-radius:999px;background:#cbe8bf;box-shadow:inset 0 2px 4px #245d303d}
.intro-progress i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(180deg,#69df68 0%,#24a844 58%,#137a31 100%);box-shadow:inset 0 2px #baffad99,0 0 12px #43d76599;transition:width .12s linear}
.intro-skip{position:absolute;z-index:1;right:max(16px,env(safe-area-inset-right));top:max(16px,env(safe-area-inset-top));min-width:0;min-height:40px;padding:8px 16px;border:1px solid #ffffff59;border-radius:20px;color:#fff;background:#00000038;box-shadow:none;font:700 14px/1 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.02em;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:background .15s,translate .15s}
.intro-skip:active{translate:0 1px;background:#00000059}

/* ---------- simple bounce animations: mini-game icons.
   Animates `transform` only (never `translate`/`scale`), so it composes
   cleanly with the per-element `translate`/`scale` !important rules the
   Layout Editor writes into layout-overrides.css instead of fighting them. */
@keyframes iconBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.game-icon img{animation:iconBounce 2.2s ease-in-out infinite;animation-play-state:running}
.game-grid .game-card:nth-child(3n+1) .game-icon img{animation-delay:0s}
.game-grid .game-card:nth-child(3n+2) .game-icon img{animation-delay:.18s}
.game-grid .game-card:nth-child(3n+3) .game-icon img{animation-delay:.36s}
#sessionGames .session-card:nth-child(1) .game-icon img{animation-delay:0s}
#sessionGames .session-card:nth-child(2) .game-icon img{animation-delay:.25s}
#sessionGames .session-card:nth-child(3) .game-icon img{animation-delay:.5s}

/* ---------- category navigation: selected vs unselected.
   No idle loop here. A permanent dock that never stops moving reads as noise
   and gives the eye nothing to land on, so state is carried by SIZE + LIGHT
   (the standard mobile pattern) and motion happens only on change.
   Same `transform`-only rule as above: placement stays owned by the Layout
   Editor's `translate`/`scale` !important declarations. transform-origin sits
   near the object's base so an icon grows up off its painted pedestal instead
   of sinking into it.
   Icon COLOUR is deliberately left alone — no `saturate()` in either state, so
   every category keeps its authored paintwork. State is carried by size,
   opacity and contact shadow only. */
#app .bottom-nav button img{
  transform-origin:50% 88%;
  transform:scale(.9);
  opacity:.84;
  filter:drop-shadow(0 3px 2px #50371944) brightness(.97);
  transition:transform .22s cubic-bezier(.34,1.56,.64,1),opacity .18s ease,filter .18s ease;
  will-change:transform
}
#app .bottom-nav button.selected img{
  transform:scale(1.08);
  opacity:1;
  filter:drop-shadow(0 6px 4px #50371966) brightness(1.03)
}
/* press feedback: one-shot, relative to whichever state the icon is in */
#app .bottom-nav button:active img{transform:scale(.86)}
#app .bottom-nav button.selected:active img{transform:scale(1.01)}

@media(prefers-reduced-motion:reduce){
  .game-icon img{animation:none}
  #app .bottom-nav button img{transition:none}
}