:root{--font-btn: 22px;--font-body: 17px;--font-label: 20px;--font-title: 30px;--tap-min: 44px;--tap-primary: 56px;--tap-gap: 12px;--color-primary: #8a4f22;--color-primary-bright: #a8632c;--color-bg: #f7e7c8;--color-surface: #fbf1dd;--color-text: #3d2412;--color-text-muted: #6b4a2f;--color-success: #35682b;--color-danger: #b5341f;--color-wood: #8a5a2b;--color-wood-dark: #5e3a19;--color-cream: #fdf3e0;--radius-card: 16px;--shadow-card: 0 4px 16px rgba(94, 58, 25, .18);--shell-max-width: 480px;--nav-height: 76px}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100%}body{font-family:Segoe UI,Microsoft JhengHei,PingFang TC,sans-serif;font-size:var(--font-body);color:var(--color-text);background:var(--color-bg) url(/art/bg/home.jpg) center top / cover no-repeat fixed;min-height:100vh;padding:16px 12px}.frame{background-repeat:no-repeat;background-position:center;background-size:100% 100%;box-sizing:border-box}.frame-bar{background-image:url(/art/frame/bar.png);aspect-ratio:732 / 162;padding:18px}.frame-panel{background-image:url(/art/frame/panel.png);aspect-ratio:732 / 760;padding:30px}.frame-card{background-image:url(/art/frame/card.png);aspect-ratio:732 / 218;padding:18px 20px}.frame-page{background-image:url(/art/frame/page.png);aspect-ratio:732 / 540;padding:26px}.frame-result{background-image:url(/art/frame/result.png);aspect-ratio:732 / 952;padding:30px 26px}.frame-form{background-image:url(/art/frame/form.png);aspect-ratio:732 / 642;padding:26px 24px}.frame-panel-sm{background-image:url(/art/frame/panel-sm.png);aspect-ratio:732 / 318;padding:18px 22px}.frame-square{background-image:url(/art/frame/square.png);width:200px;aspect-ratio:1 / 1;padding:18px}.btn-wood{border:none;background:url(/art/btn/primary-normal.png) center / 100% 100% no-repeat;font-family:inherit;font-size:var(--font-btn);font-weight:800;color:var(--color-text);text-shadow:0 1px 1px rgba(255,255,255,.45);min-height:var(--tap-primary);min-width:var(--tap-min);padding:12px 32px;cursor:pointer;transition:transform .1s ease}.btn-wood:active:not(:disabled){background-image:url(/art/btn/primary-pressed.png);transform:translateY(2px)}.btn-wood:disabled{background-image:url(/art/btn/primary-disabled.png);color:var(--color-text);cursor:not-allowed}.btn-wood:focus-visible{outline:3px solid var(--color-text);outline-offset:3px}.progress-bar{position:relative;width:100%;aspect-ratio:1101 / 175;background:url(/art/bar/track.png) center / 100% 100% no-repeat}.progress-bar-fill{position:absolute;top:14.85%;bottom:14.85%;left:0;right:0;background:url(/art/bar/fill.png) center / 100% 100% no-repeat;clip-path:inset(0 100% 0 0);transition:clip-path .3s ease}.lobby-shell{max-width:var(--shell-max-width);margin:0 auto;padding-bottom:calc(var(--nav-height) + env(safe-area-inset-bottom,0px) + 16px)}.lobby-shell-game{padding-bottom:0}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:10;display:flex;justify-content:space-around;align-items:stretch;gap:2px;padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px));background:var(--color-wood);border-top:3px solid var(--color-wood-dark);box-shadow:0 -3px 12px #5e3a194d}.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:var(--tap-min);padding:4px 2px;border:none;border-radius:12px;background:transparent;color:#f3e3c6;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer}.nav-item-icon{width:30px;height:30px;object-fit:contain}.nav-item-active{background:var(--color-cream);border-radius:12px 12px 4px 4px;color:var(--color-primary);box-shadow:inset 0 3px 0 0 var(--color-primary)}.nav-item-active .nav-item-icon{transform:scale(1.12)}.nav-item:focus-visible{outline:3px solid var(--color-cream);outline-offset:-3px}.lobby{margin:0 auto}.lobby-header{text-align:center;margin-bottom:20px}.lobby-title{font-size:34px;font-weight:800;color:var(--color-primary);letter-spacing:2px}.lobby-subtitle{font-size:18px;color:var(--color-text-muted);margin-top:8px}.lobby-mode{display:inline-block;margin-top:10px;font-size:15px;font-weight:700;color:var(--color-primary);background:var(--color-surface);border-radius:999px;padding:4px 14px}.lobby-grid{display:grid;grid-template-columns:1fr;gap:18px}.game-card{background:url(/art/frame/card.png) center / 100% 100% no-repeat;border:none;padding:16px 26px;text-align:left;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;display:flex;align-items:center;gap:16px;min-width:0;overflow:hidden;aspect-ratio:732 / 218}.game-card:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 10px 28px #5e3a1947}.game-card:disabled{opacity:.55;cursor:not-allowed}.game-card-emoji{font-size:44px;line-height:1}.game-card-name{display:block;font-size:22px;font-weight:800;color:var(--color-text)}.game-card-desc{display:block;font-size:clamp(14px,4vw,16px);color:var(--color-text-muted);margin-top:4px}.lobby-loading{text-align:center;font-size:22px;color:var(--color-primary);padding:60px 0}.lobby-error{text-align:center;font-size:18px;color:var(--color-danger);padding:20px}.result-page{margin:0 auto;background:url(/art/frame/result.png) center / 100% 100% no-repeat;padding:40px 34px;min-height:420px;text-align:center}.result-emoji{font-size:64px}.result-title{font-size:30px;font-weight:800;color:var(--color-primary);margin:12px 0 20px}.result-stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:24px}.result-stat{background:var(--color-surface);border-radius:var(--radius-card);padding:16px}.result-stat-label{font-size:16px;color:var(--color-text-muted);font-weight:600}.result-stat-value{font-size:28px;font-weight:800;color:var(--color-text);margin-top:4px}.result-rewards{font-size:20px;color:var(--color-text);margin-bottom:8px}.result-rewards b{color:var(--color-success)}.result-next{font-size:18px;color:var(--color-text-muted);margin-bottom:8px}.result-achievements{font-size:18px;color:var(--color-primary);font-weight:700;margin-bottom:20px}.result-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.result-note{font-size:14px;color:#8d7259;margin-top:18px}.lobby-btn-primary{font-size:var(--font-btn);font-weight:800;color:#fff;background:var(--color-primary);border:none;border-radius:var(--radius-card);padding:14px 36px;min-height:52px;cursor:pointer;box-shadow:var(--shadow-card);transition:transform .15s ease,background .15s ease}.lobby-btn-primary:hover{background:var(--color-primary-bright);transform:translateY(-2px)}.lobby-btn-secondary{font-size:20px;font-weight:800;color:var(--color-primary);background:var(--color-cream);border:2px solid var(--color-primary);border-radius:var(--radius-card);padding:10px 22px;min-height:44px;cursor:pointer}.lobby-btn-secondary:hover{background:var(--color-primary);color:#fff}.auth-page{max-width:460px;margin:0 auto;padding-top:40px}.auth-header{text-align:center;margin-bottom:28px}.auth-tabs{display:flex;gap:8px;margin-bottom:20px}.auth-tab{flex:1;font-size:20px;font-weight:800;font-family:inherit;color:#f3e3c6;background:var(--color-wood);border:none;border-radius:14px 14px 4px 4px;padding:12px 0;min-height:52px;cursor:pointer}.auth-tab-active{color:var(--color-primary);background:var(--color-cream);box-shadow:inset 0 3px 0 0 var(--color-primary)}.auth-tab:focus-visible{outline:3px solid var(--color-cream);outline-offset:-3px}.auth-form{background:url(/art/frame/form.png) center / 100% 100% no-repeat;padding:34px 30px;min-height:300px;display:flex;flex-direction:column}.auth-label{font-size:18px;font-weight:700;margin-bottom:6px}.auth-input{font-size:18px;font-family:inherit;color:var(--color-text);background:var(--color-surface);border:2px solid #d8c3a0;border-radius:12px;padding:12px 14px;min-height:52px;margin-bottom:16px}.auth-input:focus{outline:none;border-color:var(--color-primary)}.auth-input:disabled{color:#8d7259}.auth-error{font-size:17px;font-weight:700;color:var(--color-danger);background:#fbe4de;border-radius:12px;padding:12px 14px;margin-bottom:16px}.auth-notice{font-size:17px;font-weight:700;color:var(--color-text);background:#f6e6c4;border-left:5px solid var(--color-primary);border-radius:12px;padding:12px 14px;margin-bottom:16px}.auth-submit{display:block;margin:8px auto 0;width:82%;aspect-ratio:639 / 404;min-height:0;max-height:88px}.result-cta{aspect-ratio:639 / 404;min-height:0;max-height:84px;width:190px}.resource-bar{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:12px}.resource-item{display:flex;align-items:center;gap:5px;font-size:18px;font-weight:800;color:var(--color-text);white-space:nowrap;min-width:0}.resource-icon{width:30px;height:30px;object-fit:contain}.resource-max{font-size:15px;font-weight:600;color:var(--color-text-muted)}.resource-item-full{color:var(--color-success)}.resource-full-tag{font-size:13px;font-weight:700;color:var(--color-success);background:#e4f0dc;border-radius:999px;padding:2px 7px;white-space:nowrap}.resource-error{font-size:15px;font-weight:700;color:var(--color-danger);background:#fbe4de;border-radius:12px;padding:8px 12px;margin-bottom:12px}.page-placeholder{text-align:center}.page-placeholder-title{font-size:var(--font-title);font-weight:800;color:var(--color-primary);margin-bottom:12px}.page-placeholder-note{font-size:var(--font-label);color:var(--color-text-muted)}.page-actions{margin-top:20px;text-align:center}@media (prefers-reduced-motion: reduce){.game-card,.lobby-btn-primary,.lobby-btn-secondary,.btn-wood,.progress-bar-fill{transition:none}}.home-summary{margin-bottom:20px}.home-summary-title{font-size:22px;font-weight:800;color:var(--color-primary);margin-bottom:12px}.home-summary-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:var(--font-body);margin-bottom:8px}.home-summary-row strong{font-size:20px;font-weight:800}.home-activity{margin-top:14px}.home-chests{display:flex;justify-content:space-between;margin-top:8px}.home-chest{display:flex;flex-direction:column;align-items:center;gap:2px}.home-chest-icon{width:32px;height:32px;object-fit:contain}.home-chest-label{font-size:14px;font-weight:700;color:var(--color-text-muted)}.home-chest-label-reached{font-size:14px;font-weight:800;color:var(--color-success)}.home-summary-cta{display:block;margin:16px auto 0;width:82%;aspect-ratio:639 / 404;min-height:0;max-height:96px}.home-summary-done{margin-top:14px;font-size:var(--font-label);font-weight:800;color:var(--color-success);text-align:center}.home-section-title{font-size:22px;font-weight:800;color:var(--color-text);margin:8px 0 12px;text-shadow:0 1px 3px rgba(253,243,224,.9)}.lobby-grid{grid-template-columns:1fr}.page-tasks{aspect-ratio:auto;height:auto;width:100%}.page-tasks-title{font-size:22px;font-weight:800;color:var(--color-primary);margin-bottom:12px}.page-tasks-activity{margin-bottom:18px}.chest-row{display:flex;justify-content:space-between;align-items:flex-start;margin-top:10px;list-style:none;min-height:108px}.chest{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:0;flex:1}.chest-icon{width:30px;height:30px;object-fit:contain}.chest-tier{font-size:14px;font-weight:800;color:var(--color-text)}.chest-state{font-size:13px;font-weight:700;white-space:nowrap;color:var(--color-text-muted)}.chest-claimable .chest-state{color:var(--color-success)}.chest-claimable .chest-icon{transform:scale(1.12)}.chest-claimed .chest-icon{opacity:.6}.task-list{list-style:none;display:flex;flex-direction:column;gap:6px}.task{display:flex;align-items:center;gap:8px;min-height:44px;padding:6px 10px;border-radius:10px;background:#ffffff73;font-size:16px}.task-check{font-size:18px;font-weight:800;color:var(--color-text-muted);width:20px;text-align:center}.task-done .task-check{color:var(--color-success)}.task-name{flex:1;min-width:0;color:var(--color-text)}.task-activity{font-size:15px;font-weight:800;color:var(--color-primary);white-space:nowrap}.task-state{font-size:12px;font-weight:700;color:var(--color-text-muted);white-space:nowrap;min-width:42px;text-align:right}.task-done .task-state{color:var(--color-success)}.task-done .task-name{color:var(--color-text-muted)}.task-claim,.chest-claim{font-family:inherit;font-weight:800;color:var(--color-text);background:url(/art/btn/primary-normal.png) center / 100% 100% no-repeat;border:none;cursor:pointer;white-space:nowrap}.task-claim{font-size:15px;min-height:44px;min-width:72px;padding:4px 10px}.chest-claim{font-size:12px;min-height:var(--tap-min);min-width:56px;padding:2px 4px;margin-top:2px}.task-claim:active:not(:disabled),.chest-claim:active:not(:disabled){background-image:url(/art/btn/primary-pressed.png);transform:translateY(1px)}.task-claim:disabled,.chest-claim:disabled{background-image:url(/art/btn/primary-disabled.png);cursor:not-allowed}.task-claim:focus-visible,.chest-claim:focus-visible{outline:3px solid var(--color-text);outline-offset:2px}.page-tasks-notice{font-size:16px;font-weight:700;color:var(--color-success);background:#e4f0dc;border-radius:12px;padding:10px 12px;margin-bottom:12px;text-align:center}.page-farm{aspect-ratio:auto;height:auto;width:100%}.page-farm-title{font-size:22px;font-weight:800;color:var(--color-primary);margin-bottom:12px}.page-farm-subtitle{font-size:18px;font-weight:800;color:var(--color-primary);margin-bottom:8px}.plot-grid{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}.plot{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:10px;background:#ffffff73;min-width:0}.plot-no{font-size:12px;font-weight:800;color:var(--color-text-muted)}.plot-icon{width:36px;height:36px;object-fit:contain}.plot-content{font-size:15px;font-weight:700;color:var(--color-text);white-space:nowrap}.plot-state{font-size:13px;font-weight:700;color:var(--color-text-muted);white-space:nowrap}.plot-remaining{font-size:12px;font-weight:700;color:var(--color-text-muted);white-space:nowrap}.plot-ready .plot-state,.plot-animal-ready .plot-state{color:var(--color-success)}.plot-locked{opacity:.55}.plot-btn{font-family:inherit;font-size:14px;font-weight:800;color:var(--color-text);background:url(/art/btn/primary-normal.png) center / 100% 100% no-repeat;border:none;cursor:pointer;white-space:nowrap;min-height:var(--tap-min);min-width:64px;padding:4px 8px;margin-top:2px}.plot-btn:active:not(:disabled){background-image:url(/art/btn/primary-pressed.png);transform:translateY(1px)}.plot-btn:disabled{background-image:url(/art/btn/primary-disabled.png);cursor:not-allowed}.plot-btn:focus-visible,.plot-menu-btn:focus-visible{outline:3px solid var(--color-text);outline-offset:2px}.plot-menu{list-style:none;display:flex;flex-direction:column;gap:4px;margin-top:4px;width:100%}.plot-menu-btn{display:flex;flex-direction:column;align-items:center;width:100%;font-family:inherit;font-size:14px;font-weight:800;color:var(--color-text);background-color:#e4f0dc;background-image:none;border:2px solid var(--color-primary);border-radius:8px;cursor:pointer;min-height:var(--tap-min);padding:6px}.plot-menu-btn:active:not(:disabled){background-color:#d3e5c6;transform:translateY(1px)}.plot-menu-btn:disabled{background-color:#dcdcd2;cursor:not-allowed}.plot-menu-cost{font-size:11px;font-weight:700;color:var(--color-text-muted);white-space:normal}.page-farm-buy{display:block;margin:0 auto 16px;width:56%;aspect-ratio:639 / 404;min-height:0}.inventory-list{list-style:none;display:flex;flex-wrap:wrap;gap:6px}.inventory-item{display:flex;align-items:center;gap:4px;padding:6px 10px;border-radius:10px;background:#ffffff73;font-size:15px}.inventory-name{color:var(--color-text);font-weight:700}.inventory-qty{color:var(--color-primary);font-weight:800}.page-farm-empty{font-size:15px;color:var(--color-text-muted)}.page-shop{aspect-ratio:auto;height:auto;width:100%}.page-shop-title{font-size:22px;font-weight:800;color:var(--color-primary);margin-bottom:12px}.page-shop-subtitle{font-size:18px;font-weight:800;color:var(--color-primary);margin:16px 0 8px}.shop-list,.order-list{list-style:none;display:flex;flex-direction:column;gap:8px}.shop-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:#ffffff73}.shop-item-icon{width:48px;height:48px;object-fit:contain;flex-shrink:0}.shop-item-info{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}.shop-item-name{font-size:17px;font-weight:800;color:var(--color-text)}.shop-item-note{font-size:13px;color:var(--color-text-muted)}.shop-item-limit{font-size:13px;font-weight:700;color:var(--color-text-muted)}.shop-item-buy{display:flex;flex-direction:column;align-items:center;gap:2px;flex-shrink:0}.shop-item-price{font-size:15px;font-weight:800;color:var(--color-primary);white-space:nowrap}.shop-item-hint{font-size:12px;font-weight:700;color:var(--color-danger);white-space:nowrap}.shop-btn{font-family:inherit;font-size:15px;font-weight:800;color:var(--color-text);background:url(/art/btn/primary-normal.png) center / 100% 100% no-repeat;border:none;cursor:pointer;white-space:nowrap;min-height:var(--tap-min);min-width:76px;padding:4px 10px}.shop-btn:active:not(:disabled){background-image:url(/art/btn/primary-pressed.png);transform:translateY(1px)}.shop-btn:disabled{background-image:url(/art/btn/primary-disabled.png);cursor:not-allowed}.shop-btn:focus-visible{outline:3px solid var(--color-text);outline-offset:2px}.order{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:8px 10px;border-radius:10px;background:#ffffff73}.order-main{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}.order-need{font-size:16px;font-weight:800;color:var(--color-text)}.order-reward{font-size:14px;font-weight:700;color:var(--color-primary)}.order-state{font-size:13px;font-weight:700;color:var(--color-text-muted);white-space:nowrap}.order-completed .order-state{color:var(--color-success)}.order-completed .order-need{color:var(--color-text-muted)}.order-missing{font-size:13px;font-weight:700;color:var(--color-danger);width:100%}.basket-box{padding:10px 12px;border-radius:10px;background:#ffffff73}.basket-count{font-size:16px;color:var(--color-text);margin-bottom:8px}.basket-count strong{font-size:20px;font-weight:800;color:var(--color-primary)}.basket-actions{display:flex;gap:var(--tap-gap);flex-wrap:wrap}.page-trophy{aspect-ratio:auto;height:auto;width:100%}.page-trophy-title{font-size:22px;font-weight:800;color:var(--color-primary);margin-bottom:12px}.page-trophy-subtitle{display:flex;align-items:baseline;gap:8px;font-size:18px;font-weight:800;color:var(--color-primary);margin:16px 0 8px}.trophy-group{margin-bottom:18px}.trophy-group-count{font-size:14px;font-weight:700;color:var(--color-text-muted)}.trophy-summary{display:flex;align-items:baseline;justify-content:center;gap:8px;padding:10px 12px;border-radius:12px;background:#ffffff73}.trophy-summary-label{font-size:16px;color:var(--color-text)}.trophy-summary-count{font-size:24px;font-weight:800;color:var(--color-primary)}.trophy-empty{font-size:16px;color:var(--color-text-muted);text-align:center;margin-top:10px}.achv-list{list-style:none;display:flex;flex-direction:column;gap:6px}.achv{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:#ffffff73}.achv-icon{width:36px;height:36px;object-fit:contain;flex-shrink:0;opacity:.45}.achv-unlocked .achv-icon{opacity:1}.achv-main{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.achv-name{font-size:16px;font-weight:700;color:var(--color-text)}.achv-progress{font-size:13px;font-weight:700;color:var(--color-text-muted)}.achv-side{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex-shrink:0}.achv-state{font-size:13px;font-weight:700;color:var(--color-text-muted);white-space:nowrap}.achv-unlocked .achv-state{color:var(--color-success)}.achv-reward{font-size:13px;font-weight:800;color:var(--color-primary);white-space:nowrap}.trophy-more{display:block;margin:8px auto 0;width:62%;aspect-ratio:639 / 404;min-height:0;font-size:16px}.page-settings{aspect-ratio:auto;height:auto;width:100%}.page-settings-title{font-size:22px;font-weight:800;color:var(--color-primary);margin-bottom:12px}.settings-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px;border-radius:12px;background:#ffffff73;margin-bottom:12px}.settings-row-main{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.settings-label{font-size:17px;font-weight:700;color:var(--color-text)}.settings-state{font-size:15px;font-weight:700;color:var(--color-text-muted)}.settings-row-actions{display:flex;gap:var(--tap-gap);flex-shrink:0}.settings-btn{font-size:16px;padding:8px 14px;width:74px;aspect-ratio:639 / 404;min-height:0}
