/* Full-width phone/tablet layout; no fixed 480px phone canvas. */
#app{width:100%;max-width:none;min-height:100vh;min-height:100dvh;box-shadow:none}
.bottom-nav{left:0;transform:none;max-width:none;width:100%}
.content{max-width:1400px;margin:auto;padding-left:clamp(16px,3vw,40px);padding-right:clamp(16px,3vw,40px)}
.login-top,.login-hero,.login-card,.login-footer{max-width:620px;margin-left:auto;margin-right:auto}
.login-card{width:calc(100% - 40px)}
.auto-row{grid-template-columns:101px minmax(0,1fr) 22px}
.auto-name{min-width:0}.auto-name strong,.auto-name small{overflow-wrap:anywhere}
#sheet{top:50%;bottom:auto;left:50%;transform:translate(-50%,-50%);width:calc(100% - 24px);max-width:720px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);border-radius:20px;padding:20px 22px 24px;overscroll-behavior:contain;box-shadow:0 12px 70px #143b3140}
.handle{display:none}.sheet-head{margin:0 0 20px}.panel-row{flex-wrap:wrap}
body.modal-open{overflow:hidden}
#floating{right:16px;bottom:99px;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
#floating.dragging{cursor:grabbing;box-shadow:0 8px 28px #0c352c55}
#floating button{touch-action:none}
.game-target{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.clone-select{flex:1;min-width:150px}.target-note{font-size:11px;color:var(--muted);line-height:1.5;display:block}
.target-refresh{font-size:11px;padding:5px 0;background:none;color:var(--green)}
#toast{max-width:calc(100vw - 24px)}
@media(min-width:700px){
 .auto-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .auto-row{border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:110px}
 .auto-row:nth-child(even){border-right:0}.auto-row:nth-last-child(-n+2){border-bottom:0}
 .stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .stat-group{border-right:1px solid var(--line)}
 .inventory-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(orientation:landscape) and (max-height:600px){
 .login-hero{padding:15px 25px}.farm-art{height:90px}
 #sheet{max-width:820px;padding:16px 22px;max-height:calc(100dvh - 20px)}
 .sheet-head{margin-bottom:12px}.panel{margin:10px 0;padding:12px 16px}
 .topbar{padding:12px 24px}.content{padding-top:16px}
 .bottom-nav{height:62px;padding-top:4px;padding-bottom:4px}
}
@media(max-width:360px){.auto-row{gap:8px;padding:15px 10px;grid-template-columns:90px minmax(0,1fr) 18px}.auto-symbol{width:30px}.auto-name{gap:7px}.auto-name strong{font-size:13px}#sheet{padding:17px 14px}.stat-summary{gap:5px}}

#app.auth-screen{display:flex;align-items:center;justify-content:center;padding:24px 0;min-height:100vh;min-height:100dvh}
.auth-screen .login-card{margin:auto;width:calc(100% - 40px);max-width:460px;padding:28px}
.auth-error{font-size:12px;color:#9b3830;margin:14px 0 0;line-height:1.5}
@media(orientation:landscape) and (max-height:500px){#app.auth-screen{padding:12px 0}.auth-screen .login-card{max-width:560px;padding:20px 26px}.auth-screen .login-card label.field{margin-bottom:10px}.auth-screen .login-links{margin:4px 0 8px}}

body.overlay-host{background:transparent;min-height:100vh}
.overlay-host #app:not(.auth-screen),.overlay-host #backdrop,.overlay-host #floating{display:none!important}
.overlay-host #sheet{position:fixed;inset:0;transform:none;width:100%;height:100%;max-width:none;max-height:none;border-radius:16px;box-shadow:none}
.overlay-host #app.auth-screen{background:var(--bg,#f4f6f2);border-radius:16px}
.overlay-host #toast{bottom:16px}

.execution-buttons{display:flex;gap:10px}.execution-buttons>button{flex:1;text-align:center}.execution-buttons>button[hidden]{display:none}.pause-button{background:#e9c65a;color:#483c17}.auto-tabs{display:flex;gap:8px;overflow:auto;padding-bottom:8px}.auto-tabs button{white-space:nowrap}.auto-tabs .selected{background:#123e37;color:white}

.password-wrap{position:relative;display:flex;align-items:center}.password-wrap input{padding-right:48px!important;width:100%}.password-eye{position:absolute;right:4px;border:0;background:transparent;color:inherit;width:42px;height:42px;display:grid;place-items:center}

/* Settings remain in their original DOM: nested dialogs preserve draft/list listeners. */
.automation-settings[data-as-mode="autopro"] .as-config-body{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;align-content:start}
.automation-settings[data-as-mode="autopro"] .as-config-body>.as-group{margin:0;min-width:0}
.automation-settings[data-as-mode="autopro"] .as-config-body>.as-group>summary{font-size:13px;overflow-wrap:anywhere}
.automation-settings .as-group[open],.automation-settings .as-picker[open]{position:fixed;inset:4%;z-index:var(--as-depth,20);margin:0!important;padding:12px!important;background:var(--bg,#f4f6f2);box-shadow:0 0 0 100vmax #132b2555,0 12px 40px #0004;overflow:auto;overscroll-behavior:contain;max-height:92%;border-radius:14px}
.automation-settings .as-group[open]>summary,.automation-settings .as-picker[open]>summary{position:sticky;top:-12px;z-index:1;background:var(--bg,#f4f6f2);padding:12px 40px 12px 4px!important;border-bottom:1px solid #cbd5cf;font-size:16px!important;list-style:none}
.automation-settings .as-group[open]>summary:after,.automation-settings .as-picker[open]>summary:after{content:'×';position:absolute;right:6px;top:4px;font-size:28px}

/* AutoPro control panel: Chọn farm + Bật tác vụ share the first row, the other
   eight sections and the configuration check form a 3-column grid. */
#sheet .automation-settings[data-as-mode="autopro"] .as-config-body{grid-template-columns:repeat(6,minmax(0,1fr))}
#sheet .automation-settings[data-as-mode="autopro"] .as-config-body>.as-group{grid-column:span 2;margin:0}
#sheet .automation-settings[data-as-mode="autopro"] .as-config-body>.as-group[data-as-group="farm"],#sheet .automation-settings[data-as-mode="autopro"] .as-config-body>.as-group[data-as-group="enabled"]{grid-column:span 3}
#sheet .automation-settings .as-config-body>.as-status{background:transparent;border:1px solid #d5ded8;border-radius:10px;padding:5px 9px}
#sheet .automation-settings .as-config-body>.as-status>summary{font-size:13px;font-weight:650;line-height:28px;min-height:40px;padding:6px 0}
#sheet .automation-settings .as-config-body>.as-status[open]{max-height:92%;background:var(--bg,#f4f6f2);padding:12px}
/* A checkbox and its own setting on one row. */
#sheet .automation-settings .as-row{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap}
#sheet .automation-settings .as-row>.as-check{flex:1 1 auto}
#sheet .automation-settings .as-row>.as-field{flex-direction:row;align-items:center;gap:6px;margin:0;font-size:13px;white-space:nowrap}
#sheet .automation-settings .as-row>.as-field input,#sheet .automation-settings .as-row>.as-field select{width:96px;min-height:40px}
#sheet .automation-settings .as-row>.as-group:not([open]),#sheet .automation-settings .as-row>.as-picker:not([open]){margin:0;padding:0 10px;flex:0 1 auto;background:#fff}
#sheet .automation-settings .as-row>.as-group:not([open])>summary,#sheet .automation-settings .as-row>.as-picker:not([open])>summary{font-size:13px;font-weight:600;list-style:none;min-height:40px;line-height:28px}
#sheet .automation-settings .as-farm-tools select{flex:1 1 150px;width:auto}
#sheet .automation-settings .as-farm-tools button,#sheet .automation-settings .as-farm-tools [data-as-device-files] button{padding:9px 12px;min-height:44px;border:1px solid #b9c8bd;border-radius:8px;background:#fff;color:inherit}
#sheet .automation-settings .as-farm-tools [data-as-device-files]{display:flex;gap:8px}
#sheet .automation-settings .as-farm-all{border-bottom:1px solid #e0e8e2;font-weight:600}
/* Lưu cài đặt / Mặc định keep their width; Bắt đầu (or Tạm dừng + Dừng) fills the rest. */
#sheet .automation-settings .as-actions{flex-wrap:nowrap;align-items:stretch}
#sheet .automation-settings .as-actions>.as-save,#sheet .automation-settings .as-actions>[data-as-reset]{flex:none}
#sheet .automation-settings .as-actions>.execution-buttons{flex:1;min-width:0;display:flex;gap:8px}
#sheet .automation-settings .as-actions>.execution-buttons>button{flex:1;width:auto;min-width:0;border:0;padding:10px}
/* Upload / download this auto's configuration. */
.config-gear{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:#fff;border:1px solid var(--line);color:var(--green);vertical-align:middle;margin-left:6px}
.config-pop{position:fixed;inset:0;z-index:60;background:#132b2540;display:flex;align-items:center;justify-content:center;padding:16px}
.config-card{background:var(--bg,#f4f6f2);border-radius:14px;padding:16px;width:min(360px,100%);box-shadow:0 12px 40px #0004;display:flex;flex-direction:column;gap:10px}
.config-card p{margin:0 0 4px;font-size:14px;line-height:1.5}
.config-card .config-buttons{display:flex;gap:10px}.config-card .config-buttons>button{flex:1}