/* V0.1.3A: a quieter version of the existing HUD, not a replacement UI. */
#game{inset:78px 0 96px}
.topbar{left:max(22px,env(safe-area-inset-left));right:max(22px,env(safe-area-inset-right));top:max(15px,env(safe-area-inset-top))}
.brand{gap:10px}.brand-mark{width:44px;height:46px;border-radius:14px;box-shadow:none}
h1{font-size:20px;letter-spacing:1.7px}.brand-sub{font-size:11px}
.wallet{height:44px;padding:8px 13px;box-shadow:none;background:#fff5dcdc}
.wallet strong{font-size:20px}.shop-button{height:44px;padding:0 15px;box-shadow:none;background:#496c4e;border-color:#496c4e}
.bag-button{position:relative;top:auto;right:auto}.top-actions{gap:8px}
#bag-count{position:absolute;top:-3px;right:-4px;min-width:17px;padding:1px 4px;border-radius:6px;background:#eee4bc;border:1px solid #fff7dd;font-size:10px;line-height:15px;font-variant-numeric:tabular-nums}
.basket-card{display:none}
.guide{top:82px;left:22px;max-width:322px;padding:9px 10px;min-height:0;gap:7px;box-shadow:none;background:#fff8e6e8;border-radius:13px}
.guide p{font-size:13px;line-height:1.45;margin-top:2px}.guide .eyebrow{font-size:9px}.guide-icon{width:22px}.guide-dots{display:none}
.guide-dismiss{width:44px;height:44px;flex:none;display:grid;place-items:center;background:transparent;border:0;color:#68815d;border-radius:10px}.guide-dismiss svg{width:16px;height:16px}
.controls-area{height:94px;bottom:max(10px,env(safe-area-inset-bottom));padding:0;gap:0;display:block}
.toolbelt{position:absolute;left:50%;right:auto;bottom:0;transform:translateX(-50%);padding:7px;gap:5px;border-radius:18px;background:#fff9e8eb;border:1px solid #fff9e8;box-shadow:0 4px 16px #3b542b12}
.tool{width:67px;height:69px;border-radius:12px;gap:3px;background:#eeefdcb8}
.tool-icon{height:31px}.tool-icon .crop-art{width:35px;height:35px}.tool-icon svg{width:26px;height:26px}
.tool-name{font-size:12px}.tool-shortcut{font-size:9px}.seed-count{font-size:11px;min-width:19px;height:19px}
.tool.active{background:#52734d;box-shadow:none;border-color:#52734d}.tool.active::after{height:2px;bottom:3px;width:17px}
.joystick-area{display:block;position:absolute;bottom:1px;left:25px}
.joystick{width:94px;height:94px;background:#f4efd72e;border:1px solid #fff4d5b0;box-shadow:none}
.stick-knob{width:39px;height:39px;left:26.5px;top:26.5px;background:#fff5dbe3;box-shadow:0 3px 7px #43613418}
.action-button{position:absolute;right:25px;bottom:1px;width:88px;height:88px;font-size:12px;border-width:2px;box-shadow:none;background:#496c4e}
.action-button.ready{background:#9a773a;border-color:#ffe6a1;box-shadow:none}
.keyboard-hint{display:none}.desktop-hint{display:none}.move-label{display:none}
.selected-tile{position:absolute;bottom:99px;left:50%;right:auto;transform:translateX(-50%);display:block;min-width:240px;max-width:360px;min-height:0;padding:8px 15px;border-radius:12px;background:#fff9e6dc;border:1px solid #f6efd1;box-shadow:none}
.selected-tile .eyebrow{font-size:9px;letter-spacing:1px}.selected-tile strong{font-size:13px;margin-top:2px}
.selected-tile #tile-detail{font-size:11px;margin-top:2px}.selected-tile[data-stage=ready]{background:#fff2d5e6;border-color:#f4dfac}
.crop-progress{height:3px;width:145px;margin:5px auto 2px}
.scene-actions{top:auto;bottom:120px;left:22px;right:auto;gap:5px}
.scene-actions .icon-button{width:44px;height:44px;background:#f5f4df80;border:0;box-shadow:none}
.scene-actions>span{font-size:10px;max-width:100px;color:#567248}.scene-actions svg{width:18px;height:18px}
#toast{bottom:190px;max-width:min(440px,90%);font-size:13px;padding:9px 15px;box-shadow:none}
#save-status.save-error{font-size:12px;max-width:180px}
@media(max-width:1050px) and (min-width:701px){
 .tool{width:61px}.joystick-area{left:18px}.action-button{right:18px}.scene-actions{left:18px}
 .selected-tile{bottom:101px}
}
@media(max-width:700px){
 #game{inset:110px 0 185px}
 .topbar{top:max(12px,env(safe-area-inset-top));left:12px;right:12px;gap:6px}
 .brand{gap:7px}.brand-mark{width:33px;height:37px;border-radius:11px}.brand-mark svg{width:23px;height:23px}
 h1{font-size:15px;letter-spacing:.8px}.brand-sub{font-size:9px}.brand-sub b{font-size:8px;margin-left:2px;padding:2px}
 .wallet{padding:7px 8px;gap:5px}.wallet strong{font-size:18px}.wallet>span{display:none}
 .shop-button{width:44px;height:44px;padding:0;justify-content:center}.shop-button span{display:none}
 .top-actions{gap:5px}.bag-button{position:absolute;right:0;top:51px;width:44px;height:44px}
 .scene-actions{top:63px;bottom:auto;left:12px;right:60px;justify-content:flex-end;gap:4px}
 .scene-actions>span{margin-right:auto;font-size:10px;max-width:105px}
 .scene-actions .icon-button{background:#f4f4df70}
 .guide{top:117px;left:12px;right:12px;max-width:none;padding:7px 9px;min-height:0}.guide p{font-size:12px}.guide .eyebrow{font-size:8px}
 .controls-area{height:180px;bottom:max(9px,env(safe-area-inset-bottom))}
 .toolbelt{left:9px;right:9px;bottom:0;transform:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding:6px;gap:4px;border-radius:17px}
 .tool{width:100%;height:71px;gap:3px;border-radius:12px}.tool-name{font-size:12px;letter-spacing:-.4px}
 .tool-icon{height:31px}.tool-icon .crop-art{width:32px;height:32px}.seed-count{font-size:11px;min-width:18px;height:18px}
 .joystick-area{left:16px;bottom:96px}.joystick{width:84px;height:84px}.stick-knob{width:36px;height:36px;left:23px;top:23px}
 .action-button{right:16px;bottom:96px;width:80px;height:80px;font-size:11px}
 .action-button svg{width:26px;height:26px}
 .selected-tile{bottom:99px;left:109px;right:109px;transform:none;min-width:0;max-width:none;min-height:0;padding:8px 5px;text-align:center}
 .selected-tile .eyebrow{font-size:8px;letter-spacing:.25px}.selected-tile strong{font-size:12px;line-height:1.35}.selected-tile #tile-detail{font-size:10px;line-height:1.4}
 .crop-progress{width:85%;height:3px}.selected-tile[data-stage=ready] #tile-detail{font-size:10px}
 #toast{bottom:207px;min-width:0;max-width:85%;font-size:12px}
}
@media(max-width:370px){
 h1{font-size:14px}.brand-sub{display:none}.scene-actions>span{font-size:9px}
 .toolbelt{left:7px;right:7px;padding:5px;gap:3px}.tool-name{font-size:11px}.tool{height:70px}
 .selected-tile{left:100px;right:100px}.joystick-area{left:10px}.action-button{right:10px}
}
@media(max-height:600px) and (min-width:701px){
 #game{inset:62px 0 86px}.topbar{top:8px}.brand-mark{width:38px;height:39px}
 .guide{top:67px;max-width:290px}.guide p{font-size:11px}
 .controls-area{bottom:6px;height:79px}.tool{height:61px;width:57px}.toolbelt{padding:6px}.tool-name{font-size:11px}
 .joystick{width:76px;height:76px}.stick-knob{width:32px;height:32px;left:21px;top:21px}.action-button{width:72px;height:72px}
 .selected-tile{bottom:82px;padding:5px 10px;min-width:220px}.selected-tile #tile-detail{display:block;font-size:10px}
 .scene-actions{bottom:94px}.scene-actions>span{display:none}#toast{bottom:150px}
}


#game{z-index:1}#ui{z-index:2}

/* Account Profile R2: make account access obvious instead of hiding it behind an icon. */
.account-top-button{height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 15px;border:1px solid #d8ddc7;border-radius:15px;background:#fff8e6ed;color:#315842;font-weight:800;white-space:nowrap;box-shadow:none}
.account-top-button.logged-in{background:#eef6df;border-color:#c8d8ae}
@media(max-width:700px){.account-top-button{position:absolute;right:52px;top:51px;height:44px;padding:0 11px;font-size:12px;z-index:4}.bag-button{z-index:4}}
@media(max-width:390px){.account-top-button{font-size:11px;padding:0 8px}}

/* GAMEPLAY_UX_R2_WAREHOUSE — fixed world warehouse, clear language, focused seed strip. */



.toolbelt{display:flex!important;align-items:stretch;justify-content:center!important;overflow:visible!important;max-width:min(840px,calc(100vw - 280px));width:max-content;min-width:min(620px,calc(100vw - 280px))}
.toolbelt>.tool-utility{flex:0 0 62px;width:62px;min-width:62px}
.seed-strip-wrap{position:relative;min-width:180px;max-width:460px;flex:1 1 420px;overflow:hidden;border-radius:13px}
.seed-strip{height:100%;display:flex;align-items:stretch;gap:5px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x;cursor:grab;padding:0 1px}
.seed-strip::-webkit-scrollbar{display:none}.seed-strip.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}.seed-strip .tool{flex:0 0 64px;width:64px;min-width:64px;height:69px;scroll-snap-align:center}.seed-strip .tool-name{max-width:58px;overflow:hidden;text-overflow:ellipsis}.seed-strip-empty{min-width:220px;height:69px;padding:8px 13px;border:1px dashed #cad6ad;border-radius:12px;background:#f4f2df;color:#456448;display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;align-content:center;text-align:left;gap:0 7px}.seed-strip-empty>span{grid-row:1/3;display:grid;place-items:center}.seed-strip-empty svg{width:25px;height:25px}.seed-strip-empty strong{font-size:12px}.seed-strip-empty small{font-size:9px;color:#7b856d;margin-top:2px}.tool-shortcut{display:none!important}

.warehouse-dialog{width:min(620px,calc(100% - 28px))}.warehouse-summary{display:flex;align-items:center;gap:12px;padding:13px 15px;margin:8px 0 16px;border-radius:15px;background:#eff0d9}.warehouse-summary>span{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#fff7df;color:#55734c}.warehouse-summary svg{width:26px;height:26px}.warehouse-summary>div{display:grid}.warehouse-summary strong{font-size:22px;line-height:1}.warehouse-summary small{font-size:11px;color:#748069;margin-top:4px}.warehouse-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;max-height:45vh;overflow:auto;padding:2px;overscroll-behavior:contain}.warehouse-item{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:9px;padding:10px 11px;border:1px solid #e0e4cd;border-radius:14px;background:#fffdf2}.warehouse-art{width:46px;height:46px;display:grid;place-items:center;border-radius:12px;background:#f1f1df}.warehouse-art .crop-art{width:42px;height:42px}.warehouse-item-copy{display:grid;min-width:0}.warehouse-item-copy strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.warehouse-item-copy span{font-size:10px;color:#7a856c;margin-top:3px}.warehouse-item>b{font-size:20px;font-variant-numeric:tabular-nums}.warehouse-empty{grid-column:1/-1;display:grid;place-items:center;text-align:center;padding:28px 15px;border:1px dashed #d6ddbd;border-radius:16px;background:#faf8e9;color:#63715d}.warehouse-empty>span{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#eef0d8}.warehouse-empty svg{width:28px;height:28px}.warehouse-empty strong{margin-top:10px;font-size:15px}.warehouse-empty p{max-width:330px;margin:6px 0 0;font-size:12px;line-height:1.6}.warehouse-future-note{display:grid;gap:3px;margin:16px 0;padding:12px 14px;border-left:3px solid #7e9e61;border-radius:0 12px 12px 0;background:#f1f0df}.warehouse-future-note strong{font-size:12px}.warehouse-future-note span{font-size:11px;line-height:1.55;color:#717d69}

@media(max-width:1050px) and (min-width:701px){
 .toolbelt{max-width:calc(100vw - 230px);min-width:min(560px,calc(100vw - 230px))}.seed-strip-wrap{max-width:370px}
}
@media(max-width:700px){
 .account-top-button{right:12px!important}
 .toolbelt{left:7px!important;right:7px!important;bottom:0!important;transform:none!important;display:flex!important;max-width:none!important;min-width:0!important;width:auto!important;padding:6px!important;gap:3px!important;overflow:visible!important}
 .toolbelt>.tool-utility{flex:0 0 50px!important;width:50px!important;min-width:50px!important;height:70px!important}
 .seed-strip-wrap{min-width:0;max-width:none;flex:1 1 auto}.seed-strip{gap:3px}.seed-strip .tool{flex:0 0 52px;width:52px;min-width:52px;height:70px}.seed-strip .tool-name{max-width:48px;font-size:10px!important}.seed-strip-empty{min-width:185px;height:70px;padding:7px 9px}.seed-strip-empty strong{font-size:11px}.seed-strip-empty small{font-size:8px}
 .warehouse-grid{grid-template-columns:1fr}.warehouse-dialog{width:min(520px,calc(100% - 20px))}
}
@media(max-width:390px){
 .toolbelt>.tool-utility{flex-basis:46px!important;width:46px!important;min-width:46px!important}.seed-strip .tool{flex-basis:49px;width:49px;min-width:49px}
}

/* R2.2 visual fix — hard-disable legacy floating warehouse shortcut if any cached DOM survives. */
.warehouse-hotspot,#warehouse-open,.warehouse-copy,.warehouse-count,.warehouse-icon{display:none !important;}

/* CORE GAMEPLAY R1 · Kho Nông Sản commerce */
.warehouse-item{grid-template-columns:48px minmax(0,1fr) auto}.warehouse-item-copy small{font-size:9px;color:#8a8f78;margin-top:2px}.warehouse-actions{display:grid;gap:5px;min-width:78px}.warehouse-actions button{border:1px solid #cfd8b8;border-radius:9px;background:#f2f4df;color:#315b43;font:700 10px/1.1 system-ui;padding:8px 9px;cursor:pointer;touch-action:manipulation}.warehouse-actions button:last-child{background:#315b43;color:#fff;border-color:#315b43}.warehouse-actions button:disabled{opacity:.5;cursor:wait}
@media(max-width:700px){.warehouse-item{grid-template-columns:46px minmax(0,1fr) auto}.warehouse-actions{min-width:72px}.warehouse-actions button{padding:8px 7px}}

.warehouse-actions.warehouse-legacy{display:flex;align-items:center;justify-content:center}.warehouse-actions.warehouse-legacy span{display:inline-block;padding:7px 9px;border-radius:9px;background:#f3f0e5;color:#7a715e;font:700 9px/1.2 system-ui;text-transform:uppercase;letter-spacing:.05em}

/* Keep the shared motion control reachable below the mobile account header. */
@media(max-width:700px){
 .scene-actions{top:auto;bottom:calc(186px + env(safe-area-inset-bottom));left:12px;right:12px;justify-content:flex-end}
}