:root{
  --bg:#eef7ff;
  --bg2:#f8fcff;
  --card:#ffffff;
  --card2:#f3faff;
  --line:#c8e2f6;
  --line2:#9bd7ff;
  --text:#09172f;
  --muted:#54708f;
  --cyan:#00b7f0;
  --blue:#2176ff;
  --good:#10b981;
  --danger:#e11d48;
  --warn:#d97706;
  --shadow:0 18px 42px rgba(38,77,115,.14);
}

*{box-sizing:border-box}

html,body{
  margin:0;
  min-height:100%;
}

body{
  color:var(--text);
  font-family:Inter, Arial, sans-serif;
  background:
    radial-gradient(circle at 15% 0%, rgba(0,183,240,.18), transparent 34%),
    radial-gradient(circle at 90% 8%, rgba(33,118,255,.12), transparent 30%),
    linear-gradient(180deg,var(--bg),var(--bg2));
  overflow-x:hidden;
}

button,input{
  font:inherit;
}

.hidden{
  display:none!important;
}

.remote-app{
  width:100%;
  min-height:100vh;
  padding:14px;
}

/* LOGIN */
.login-screen{
  min-height:100svh;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px 0;
}

.login-card{
  width:100%;
  max-width:520px;
  padding:24px;
  border-radius:30px;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(239,248,255,.94));
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  text-align:center;
}

.mini-badge{
  width:max-content;
  max-width:100%;
  margin:0 auto 18px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:9px 14px;
  border-radius:999px;
  color:#075985;
  background:rgba(0,183,240,.10);
  border:1px solid rgba(0,130,200,.22);
  font-size:.76rem;
  font-weight:950;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.mini-badge:before{
  content:"";
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 12px rgba(0,183,240,.55);
  flex:0 0 auto;
}

.login-card h1{
  margin:0;
  font-family:Orbitron, Inter, Arial, sans-serif;
  text-transform:uppercase;
  font-size:clamp(2.1rem,7vw,4rem);
  line-height:.95;
  letter-spacing:.02em;
  color:#08162e;
}

.login-card h1 span{
  display:block;
}

.login-subtitle{
  max-width:420px;
  margin:18px auto 0;
  color:#41617f;
  font-size:1rem;
  line-height:1.5;
  font-weight:700;
}

.code-panel{
  margin-top:22px;
  padding:16px;
  border-radius:24px;
  background:linear-gradient(180deg,#ffffff,#edf8ff);
  border:1px solid var(--line);
  box-shadow:0 10px 24px rgba(38,77,115,.10);
}

.code-panel label{
  display:block;
  margin-bottom:10px;
  color:#0b5f85;
  font-size:.78rem;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.05em;
}

#codeInput{
  width:100%;
  height:58px;
  border:1px solid #b9d8ef;
  border-radius:18px;
  background:#fff;
  color:#08162e;
  outline:none;
  text-align:center;
  font-size:1.45rem;
  font-weight:950;
  letter-spacing:.20em;
  text-transform:uppercase;
}

#codeInput:focus{
  border-color:#56c8ff;
  box-shadow:0 0 0 4px rgba(0,183,240,.14);
}

.primary-btn{
  width:100%;
  min-height:54px;
  margin-top:12px;
  border:1px solid rgba(0,130,200,.22);
  border-radius:18px;
  color:#062236;
  font-weight:950;
  cursor:pointer;
  background:linear-gradient(90deg,#8befff,#c9f8ff);
  box-shadow:0 10px 22px rgba(0,130,200,.14);
}

.error{
  margin-top:12px;
  padding:12px;
  border-radius:16px;
  color:#be123c;
  background:#fff1f4;
  border:1px solid rgba(225,29,72,.22);
  font-weight:900;
  line-height:1.35;
}

.language-bar{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  margin-top:16px;
}

.language-bar button{
  min-width:44px;
  min-height:40px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  color:#34506f;
  font-size:.78rem;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 8px 16px rgba(38,77,115,.08);
}

.language-bar button.active{
  color:#062236;
  background:linear-gradient(90deg,#8befff,#d8fbff);
  border-color:#8bdcff;
}

/* DASHBOARD */
.dashboard-screen{
  width:100%;
  max-width:980px;
  margin:0 auto;
  padding:8px 0 32px;
}

.action-panel{
  position:sticky;
  top:8px;
  z-index:20;
  padding:14px;
  border-radius:24px;
  background:rgba(255,255,255,.94);
  border:1px solid var(--line);
  box-shadow:0 14px 32px rgba(38,77,115,.14);
  backdrop-filter:blur(14px);
}

.action-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.action-title{
  color:#08162e;
  font-size:1.05rem;
  font-weight:950;
}

.action-sub{
  margin-top:4px;
  color:var(--muted);
  font-size:.86rem;
  font-weight:850;
}

.action-mini{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.action-mini button,
.refresh-line{
  min-height:38px;
  padding:8px 12px;
  border-radius:14px;
  border:1px solid var(--line);
  background:#fff;
  color:#08162e;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 8px 16px rgba(38,77,115,.08);
}

.action-mini .exit-mini{
  color:#be123c;
  background:#fff1f4;
  border-color:rgba(225,29,72,.22);
}

.action-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}

.action-btn{
  min-height:46px;
  padding:10px 8px;
  border-radius:16px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fff,#f0f9ff);
  color:#08162e;
  font-size:.84rem;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(38,77,115,.08);
}

.action-btn.danger{
  color:#9f1239;
  background:linear-gradient(180deg,#fff8fa,#ffeaf0);
  border-color:rgba(225,29,72,.20);
}

.action-btn.warn{
  color:#92400e;
  background:linear-gradient(180deg,#fffaf0,#fff0cf);
  border-color:rgba(245,158,11,.22);
}

.refresh-line{
  display:block;
  width:100%;
  margin:10px 0;
  background:linear-gradient(90deg,#e5f8ff,#fff);
}

.session-note{
  margin:0 0 10px;
  color:var(--muted);
  font-size:.86rem;
  font-weight:850;
  text-align:center;
}

/* FARM LIST */
.accounts{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}

.farm-card{
  position:relative;
  width:100%;
  padding:14px;
  padding-left:50px;
  border-radius:22px;
  background:linear-gradient(180deg,#ffffff,#f2faff);
  border:1px solid var(--line);
  box-shadow:0 12px 26px rgba(38,77,115,.11);
}

.farm-select{
  position:absolute;
  left:14px;
  top:18px;
  width:24px;
  height:24px;
  accent-color:#00a6e8;
  cursor:pointer;
}

.farm-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:start;
  gap:10px;
  margin-bottom:12px;
}

.farm-name{
  color:#08162e;
  font-family:Orbitron, Inter, Arial, sans-serif;
  font-size:1.05rem;
  line-height:1.2;
  font-weight:900;
  word-break:break-word;
}

.coords{
  justify-self:end;
  padding:8px 10px;
  border-radius:999px;
  color:#075985;
  background:rgba(0,183,240,.10);
  border:1px solid rgba(0,130,200,.20);
  font-size:.82rem;
  font-weight:950;
  white-space:nowrap;
}

.badges{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:12px;
}

.badges .badge{
  margin:0;
  padding:7px 9px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:950;
  color:#075985;
  background:rgba(0,183,240,.10);
  border:1px solid rgba(0,130,200,.18);
}

.badges .badge:before{
  display:none;
}

.badge.online{
  color:#047857;
  background:rgba(16,185,129,.12);
  border-color:rgba(16,185,129,.22);
}

.badge.offline{
  color:#be123c;
  background:rgba(244,63,94,.10);
  border-color:rgba(244,63,94,.20);
}

.res-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:8px;
}

.res{
  min-width:0;
  padding:10px;
  border-radius:16px;
  background:#fff;
  border:1px solid rgba(0,130,200,.12);
  box-shadow:0 8px 16px rgba(38,77,115,.07);
}

.res span{
  display:block;
  color:#496986;
  font-size:.70rem;
  font-weight:950;
  text-transform:uppercase;
}

.res b{
  display:block;
  margin-top:5px;
  color:#08162e;
  font-size:.98rem;
  font-weight:950;
  word-break:break-word;
}

.empty{
  padding:24px;
  text-align:center;
  border-radius:20px;
  background:#fff;
  border:1px dashed var(--line);
  color:var(--muted);
  font-weight:900;
}

html[dir="rtl"] .farm-card{
  padding-left:14px;
  padding-right:50px;
}

html[dir="rtl"] .farm-select{
  left:auto;
  right:14px;
}

html[dir="rtl"] .coords{
  justify-self:start;
}

@media(max-width:760px){
  .remote-app{
    padding:10px;
  }

  .login-card{
    max-width:430px;
    padding:18px;
    border-radius:24px;
  }

  .login-card h1{
    font-size:2.35rem;
  }

  .login-subtitle{
    font-size:.94rem;
  }

  .action-panel{
    top:6px;
    padding:12px;
    border-radius:20px;
  }

  .action-head{
    display:grid;
    grid-template-columns:1fr;
  }

  .action-mini{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    width:100%;
  }

  .action-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .farm-card{
    padding:12px;
    padding-left:46px;
    border-radius:19px;
  }

  .farm-select{
    left:12px;
    top:16px;
  }

  .farm-head{
    grid-template-columns:1fr;
    gap:8px;
  }

  .coords{
    justify-self:start;
    order:-1;
    margin-left:0;
  }

  .farm-name{
    font-size:.98rem;
  }

  .res-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .res{
    padding:9px;
  }
}

@media(max-width:380px){
  .language-bar button{
    min-width:39px;
    min-height:38px;
    font-size:.72rem;
  }

  .action-mini{
    grid-template-columns:1fr;
  }

  .action-grid{
    grid-template-columns:1fr;
  }

  .login-card h1{
    font-size:2rem;
  }
}

/* ===== MOBILE APP COMPACT MODE ===== */
body{
  background:
    radial-gradient(circle at 20% 0%, rgba(0,183,240,.13), transparent 30%),
    linear-gradient(180deg,#f4fbff,#e7f5ff) !important;
}

.remote-app{
  padding:8px !important;
}

.dashboard-screen{
  max-width:720px !important;
}

.action-panel{
  padding:10px !important;
  border-radius:18px !important;
}

.action-title{
  font-size:.92rem !important;
}

.action-sub{
  font-size:.74rem !important;
}

.action-mini button,
.refresh-line{
  min-height:34px !important;
  padding:7px 9px !important;
  border-radius:12px !important;
  font-size:.76rem !important;
}

.action-grid{
  gap:6px !important;
}

.action-btn{
  min-height:40px !important;
  padding:7px 6px !important;
  border-radius:13px !important;
  font-size:.74rem !important;
}

.session-note{
  font-size:.74rem !important;
  margin:6px 0 8px !important;
}

.accounts{
  gap:9px !important;
}

.farm-card{
  padding:10px !important;
  padding-left:42px !important;
  border-radius:17px !important;
}

.farm-select{
  left:10px !important;
  top:14px !important;
  width:22px !important;
  height:22px !important;
}

.farm-head{
  margin-bottom:8px !important;
}

.farm-name{
  font-size:.86rem !important;
}

.coords{
  padding:6px 8px !important;
  font-size:.72rem !important;
}

.badges{
  gap:5px !important;
  margin-bottom:8px !important;
}

.badges .badge{
  padding:5px 7px !important;
  font-size:.62rem !important;
}

.res-grid{
  gap:6px !important;
}

.res{
  padding:8px !important;
  border-radius:13px !important;
}

.res span{
  font-size:.58rem !important;
}

.res b{
  font-size:.82rem !important;
  margin-top:3px !important;
}

/* LOGIN COMPACT */
.login-card{
  max-width:420px !important;
  padding:18px !important;
  border-radius:24px !important;
}

.login-card h1{
  font-size:2.05rem !important;
}

.login-subtitle{
  font-size:.86rem !important;
  margin-top:12px !important;
}

.code-panel{
  margin-top:16px !important;
  padding:12px !important;
  border-radius:20px !important;
}

#codeInput{
  height:50px !important;
  font-size:1.2rem !important;
}

.primary-btn{
  min-height:48px !important;
}

/* ===== LANGUAGE POPUP ===== */
.language-open-btn{
  margin:14px auto 0;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:9px 16px;
  border-radius:999px;
  border:1px solid #b9d8ef;
  background:#ffffff;
  color:#0b1830;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(38,77,115,.10);
}

.language-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  background:rgba(8,23,47,.35);
  backdrop-filter:blur(10px);
}

.language-modal.hidden{
  display:none !important;
}

.language-modal-card{
  width:min(420px,100%);
  border-radius:24px;
  background:linear-gradient(180deg,#ffffff,#edf8ff);
  border:1px solid #c8e2f6;
  box-shadow:0 28px 70px rgba(20,55,90,.28);
  padding:14px;
}

.language-modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
  color:#09172f;
  font-size:1rem;
}

.language-modal-head button{
  width:36px;
  height:36px;
  border-radius:12px;
  border:1px solid #c8e2f6;
  background:#fff;
  color:#09172f;
  font-size:1.3rem;
  font-weight:900;
  cursor:pointer;
}

.language-modal-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.language-modal-grid button{
  min-height:42px;
  border-radius:14px;
  border:1px solid #c8e2f6;
  background:#fff;
  color:#09172f;
  font-size:.82rem;
  font-weight:900;
  cursor:pointer;
}

.language-modal-grid button.active{
  background:linear-gradient(90deg,#8befff,#d8fbff);
  border-color:#8bdcff;
}

html[dir="rtl"] .farm-card{
  padding-left:10px !important;
  padding-right:42px !important;
}

html[dir="rtl"] .farm-select{
  left:auto !important;
  right:10px !important;
}

@media(max-width:480px){
  .remote-app{
    padding:6px !important;
  }

  .action-head{
    gap:8px !important;
  }

  .action-grid{
    grid-template-columns:repeat(2,1fr) !important;
  }

  .farm-card{
    padding-left:40px !important;
  }

  .res-grid{
    grid-template-columns:repeat(2,1fr) !important;
  }

  .language-modal-grid{
    grid-template-columns:1fr !important;
  }
}

/* ===== DASHBOARD LANGUAGE BUTTON ===== */
.action-mini .lang-mini{
  min-width:42px;
  padding-left:10px;
  padding-right:10px;
  color:#075985;
  background:linear-gradient(180deg,#ffffff,#e9f8ff);
  border-color:#9bd7ff;
}

@media(max-width:480px){
  .action-mini{
    grid-template-columns:1fr 1fr 44px 1fr !important;
  }

  .action-mini .lang-mini{
    min-width:44px;
  }
}

/* ===== APP MODAL / RELOCATE FORM ===== */
.app-modal{
  position:fixed;
  inset:0;
  z-index:10000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  background:rgba(8,23,47,.34);
  backdrop-filter:blur(12px);
}

.app-modal.hidden{
  display:none !important;
}

.app-modal-card{
  width:min(430px,100%);
  border-radius:26px;
  background:linear-gradient(180deg,#ffffff,#edf8ff);
  border:1px solid #c8e2f6;
  box-shadow:0 28px 70px rgba(20,55,90,.28);
  padding:16px;
}

.app-modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

.app-modal-head strong{
  display:block;
  color:#09172f;
  font-size:1.05rem;
  font-weight:950;
}

.app-modal-head p{
  margin:4px 0 0;
  color:#54708f;
  font-size:.8rem;
  font-weight:850;
}

.app-modal-head button{
  width:38px;
  height:38px;
  border-radius:14px;
  border:1px solid #c8e2f6;
  background:#fff;
  color:#09172f;
  font-size:1.4rem;
  font-weight:900;
  cursor:pointer;
}

.modal-form{
  display:grid;
  gap:9px;
}

.modal-form label{
  color:#0b5f85;
  font-size:.74rem;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.modal-form input{
  width:100%;
  height:48px;
  border:1px solid #b9d8ef;
  border-radius:16px;
  background:#fff;
  color:#08162e;
  outline:none;
  text-align:center;
  font-size:1.1rem;
  font-weight:950;
}

.modal-form input:focus{
  border-color:#56c8ff;
  box-shadow:0 0 0 4px rgba(0,183,240,.14);
}

.modal-error{
  padding:10px 12px;
  border-radius:14px;
  background:#fff1f4;
  border:1px solid rgba(225,29,72,.22);
  color:#be123c;
  font-size:.82rem;
  font-weight:900;
}

.modal-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:14px;
}

.modal-btn{
  min-height:46px;
  border-radius:16px;
  border:1px solid #c8e2f6;
  font-weight:950;
  cursor:pointer;
}

.modal-btn.secondary{
  background:#fff;
  color:#09172f;
}

.modal-btn.primary{
  color:#062236;
  background:linear-gradient(90deg,#8befff,#c9f8ff);
  border-color:#8bdcff;
}

@media(max-width:420px){
  .app-modal{
    align-items:flex-end;
    padding:10px;
  }

  .app-modal-card{
    border-radius:24px;
  }
}

/* ===== BEAUTIFUL APP NOTIFICATIONS ===== */
.app-toast{
  position:fixed;
  left:50%;
  top:18px;
  z-index:20000;
  transform:translateX(-50%);
  width:min(440px, calc(100vw - 24px));
  padding:14px 16px;
  border-radius:20px;
  background:rgba(255,255,255,.96);
  border:1px solid #c8e2f6;
  box-shadow:0 24px 70px rgba(20,55,90,.22);
  color:#09172f;
  font-size:.9rem;
  font-weight:950;
  line-height:1.35;
  text-align:center;
  backdrop-filter:blur(14px);
}

.app-toast.hidden{
  display:none !important;
}

.app-toast.success{
  color:#047857;
  background:linear-gradient(180deg,#ffffff,#ecfdf5);
  border-color:rgba(16,185,129,.28);
}

.app-toast.error{
  color:#be123c;
  background:linear-gradient(180deg,#ffffff,#fff1f4);
  border-color:rgba(225,29,72,.26);
}

.app-toast.warn{
  color:#92400e;
  background:linear-gradient(180deg,#ffffff,#fff7df);
  border-color:rgba(245,158,11,.28);
}

/* ===== BEAUTIFUL CONFIRM MODAL ===== */
.confirm-modal{
  position:fixed;
  inset:0;
  z-index:19000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  background:rgba(8,23,47,.36);
  backdrop-filter:blur(12px);
}

.confirm-modal.hidden{
  display:none !important;
}

.confirm-card{
  width:min(430px,100%);
  padding:18px;
  border-radius:28px;
  background:linear-gradient(180deg,#ffffff,#edf8ff);
  border:1px solid #c8e2f6;
  box-shadow:0 28px 80px rgba(20,55,90,.30);
  text-align:center;
}

.confirm-icon{
  width:54px;
  height:54px;
  margin:0 auto 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:20px;
  color:#075985;
  background:rgba(0,183,240,.12);
  border:1px solid rgba(0,130,200,.18);
  font-size:1.5rem;
  font-weight:950;
}

.confirm-title{
  color:#09172f;
  font-size:1.12rem;
  font-weight:950;
  margin-bottom:8px;
}

.confirm-text{
  color:#54708f;
  font-size:.9rem;
  font-weight:850;
  line-height:1.45;
  white-space:pre-line;
}

.confirm-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:16px;
}

.confirm-btn{
  min-height:46px;
  border-radius:16px;
  border:1px solid #c8e2f6;
  font-weight:950;
  cursor:pointer;
}

.confirm-btn.cancel{
  background:#fff;
  color:#09172f;
}

.confirm-btn.ok{
  color:#062236;
  background:linear-gradient(90deg,#8befff,#c9f8ff);
  border-color:#8bdcff;
}

@media(max-width:420px){
  .app-toast{
    top:10px;
    border-radius:17px;
    font-size:.82rem;
  }

  .confirm-modal{
    align-items:flex-end;
    padding:10px;
  }

  .confirm-card{
    border-radius:24px;
  }
}

/* ===== SETTING CHOICE BUTTONS ===== */
.setting-choice{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:12px 0;
}

.setting-btn{
  min-height:48px;
  border-radius:16px;
  border:1px solid #c8e2f6;
  background:#ffffff;
  color:#09172f;
  font-weight:950;
  cursor:pointer;
}

.setting-btn.active{
  color:#062236;
  background:linear-gradient(90deg,#8befff,#c9f8ff);
  border-color:#8bdcff;
  box-shadow:0 10px 22px rgba(0,130,200,.14);
}

@media(max-width:420px){
  .setting-choice{
    grid-template-columns:1fr;
  }
}

/* ===== SELECTED FARM CARD HIGHLIGHT ===== */
.farm-card.is-selected{
  background:
    linear-gradient(180deg,#ffffff,#e4f8ff) !important;
  border-color:#47c9ff !important;
  box-shadow:
    0 16px 34px rgba(0,130,200,.18),
    0 0 0 3px rgba(0,183,240,.16) !important;
}

.farm-card.is-selected .coords{
  background:linear-gradient(90deg,#8befff,#d8fbff) !important;
  border-color:#6ed8ff !important;
  color:#06364f !important;
}

.farm-card.is-selected .farm-name{
  color:#064e7a !important;
}

.farm-card.is-selected .res{
  border-color:rgba(0,183,240,.22) !important;
  background:#ffffff !important;
}

.farm-card.is-selected::after{
  content:"✓";
  position:absolute;
  right:14px;
  bottom:14px;
  width:30px;
  height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:linear-gradient(90deg,#8befff,#c9f8ff);
  color:#062236;
  font-weight:950;
  box-shadow:0 10px 20px rgba(0,130,200,.18);
}

html[dir="rtl"] .farm-card.is-selected::after{
  right:auto;
  left:14px;
}

/* ===== FINAL SELECTED CARD VISUAL FIX ===== */
.accounts .farm-card{
  background:linear-gradient(180deg,#ffffff,#f6fbff) !important;
  border-color:#d4e8f7 !important;
  box-shadow:0 10px 22px rgba(38,77,115,.08) !important;
}

.accounts .farm-card:not(.is-selected)::after{
  display:none !important;
}

.accounts .farm-card.is-selected{
  background:linear-gradient(180deg,#e7faff,#ccf3ff) !important;
  border-color:#00aeea !important;
  box-shadow:
    0 16px 34px rgba(0,130,200,.22),
    0 0 0 3px rgba(0,183,240,.22) !important;
}

.accounts .farm-card.is-selected .farm-name{
  color:#045f86 !important;
}

.accounts .farm-card.is-selected .coords{
  background:linear-gradient(90deg,#67e8ff,#c8fbff) !important;
  border-color:#47c9ff !important;
  color:#05384f !important;
}

/* ===== ACTIVE SETTING BUTTON CHECKMARK ===== */
.setting-btn.active{
  position:relative;
  padding-right:34px !important;
}

.setting-btn.active::after{
  content:"✓";
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#ffffff;
  color:#047c9f;
  font-size:.8rem;
  font-weight:950;
  box-shadow:0 6px 14px rgba(0,130,200,.16);
}

html[dir="rtl"] .setting-btn.active{
  padding-right:10px !important;
  padding-left:34px !important;
}

html[dir="rtl"] .setting-btn.active::after{
  right:auto;
  left:12px;
}

/* ===== UPGRADE SELECT ===== */
#upgradeMaxLevel{
  width:100%;
  height:48px;
  border:1px solid #b9d8ef;
  border-radius:16px;
  background:#fff;
  color:#08162e;
  outline:none;
  text-align:center;
  font-size:1rem;
  font-weight:950;
  padding:0 12px;
}

/* ===== WHITELIST MODAL ===== */
.whitelist-card{
  max-height:calc(100vh - 28px);
  overflow:auto;
}

.whitelist-section{
  margin:12px 0;
  padding:12px;
  border-radius:18px;
  background:#f7fbff;
  border:1px solid #d6eafa;
}

.whitelist-title{
  margin-bottom:8px;
  color:#08304d;
  font-size:.86rem;
  font-weight:950;
}

.whitelist-list,
.whitelist-results{
  display:grid;
  gap:8px;
}

.whitelist-item,
.whitelist-result{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 11px;
  border-radius:15px;
  background:#ffffff;
  border:1px solid #d8eaf7;
  color:#0b1f36;
  font-size:.84rem;
  font-weight:850;
}

.whitelist-item small,
.whitelist-result small{
  display:block;
  margin-top:3px;
  color:#60768e;
  font-size:.72rem;
  font-weight:800;
}

.whitelist-search-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px;
}

.whitelist-search-row input{
  min-width:0;
  height:44px;
  border:1px solid #bfdcf1;
  border-radius:15px;
  padding:0 12px;
  background:#fff;
  color:#08162e;
  outline:none;
  font-size:.88rem;
  font-weight:850;
}

.whitelist-search-row button,
.whitelist-add-btn{
  min-height:44px;
  border:0;
  border-radius:15px;
  padding:0 14px;
  cursor:pointer;
  color:#062236;
  font-weight:950;
  background:linear-gradient(90deg,#8befff,#c9f8ff);
  box-shadow:0 8px 18px rgba(0,130,200,.14);
}

.modal-btn.danger{
  color:#fff;
  background:linear-gradient(90deg,#fb7185,#f43f5e);
  border-color:#fb7185;
}

.modal-muted{
  color:#6a7f96;
  font-size:.82rem;
  font-weight:850;
  text-align:center;
  padding:8px;
}

@media(max-width:420px){
  .whitelist-search-row{
    grid-template-columns:1fr;
  }

  .whitelist-item,
  .whitelist-result{
    align-items:flex-start;
    flex-direction:column;
  }

  .whitelist-add-btn{
    width:100%;
  }
}

/* ===== WHITELIST ADD ANIMATION ===== */
.whitelist-add-btn{
  transition:.18s ease;
}

.whitelist-add-btn.is-loading{
  opacity:.78;
  pointer-events:none;
  transform:scale(.96);
}

.whitelist-add-btn.is-success{
  background:linear-gradient(90deg,#86efac,#bbf7d0) !important;
  color:#064e3b !important;
  pointer-events:none;
  animation:whitelistAddPulse .42s ease;
}

@keyframes whitelistAddPulse{
  0%{transform:scale(.96)}
  55%{transform:scale(1.06)}
  100%{transform:scale(1)}
}

.whitelist-result.is-added{
  border-color:#86efac !important;
  background:linear-gradient(180deg,#f0fdf4,#ffffff) !important;
  animation:whitelistCardAdded .5s ease;
}

@keyframes whitelistCardAdded{
  0%{transform:translateY(0); opacity:1}
  45%{transform:translateY(-4px); opacity:1}
  100%{transform:translateY(0); opacity:1}
}

/* ===== WHITELIST SEARCH LOADING / DEDUPE ===== */
.whitelist-loading{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:44px;
  padding:10px;
  border-radius:15px;
  background:#ffffff;
  border:1px solid #d8eaf7;
  color:#5b728c;
  font-size:.84rem;
  font-weight:900;
}

.whitelist-loading::before{
  content:"";
  width:18px;
  height:18px;
  border-radius:999px;
  border:3px solid #d8f6ff;
  border-top-color:#0ea5e9;
  animation:whitelistSpin .75s linear infinite;
}

@keyframes whitelistSpin{
  to{transform:rotate(360deg)}
}

.whitelist-count-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:6px;
  padding:5px 9px;
  border-radius:999px;
  background:#e8f8ff;
  border:1px solid #bfe9fb;
  color:#075985;
  font-size:.72rem;
  font-weight:950;
}

.whitelist-search-row button.is-loading{
  opacity:.75;
  pointer-events:none;
}

/* ===== WHITELIST DELETE ONE ===== */
.whitelist-delete-btn{
  width:36px;
  height:36px;
  min-width:36px;
  border:1px solid #fecdd3;
  border-radius:999px;
  background:linear-gradient(180deg,#fff1f2,#ffe4e6);
  color:#be123c;
  font-size:1.15rem;
  line-height:1;
  font-weight:950;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 8px 18px rgba(190,18,60,.10);
  transition:.18s ease;
}

.whitelist-delete-btn:hover{
  transform:scale(1.04);
}

.whitelist-delete-btn.is-loading{
  pointer-events:none;
  opacity:.7;
  animation:whitelistSpin .75s linear infinite;
}

.whitelist-item.is-removing{
  opacity:.62;
  transform:scale(.98);
  transition:.2s ease;
}

/* ===== MOBILE APP LOOK V1 ===== */
@media(max-width:760px){

  html,
  body{
    background:
      radial-gradient(circle at top left, rgba(109,231,255,.32), transparent 34%),
      linear-gradient(180deg,#eaf8ff 0%,#d8efff 45%,#effaff 100%) !important;
  }

  body.is-dashboard{
    padding:0 !important;
  }

  .app-dashboard{
    width:100% !important;
    max-width:none !important;
    padding:10px 8px 92px !important;
  }

  .action-panel{
    position:sticky !important;
    top:0 !important;
    z-index:50 !important;
    margin:0 0 10px !important;
    padding:12px !important;
    border-radius:0 0 24px 24px !important;
    background:rgba(255,255,255,.86) !important;
    backdrop-filter:blur(18px) saturate(1.25) !important;
    border:1px solid rgba(174,215,242,.82) !important;
    box-shadow:0 14px 32px rgba(22,74,115,.14) !important;
  }

  .action-panel h2,
  .action-title,
  [data-i18n="actionsTitle"]{
    font-size:1.02rem !important;
    line-height:1.12 !important;
    margin:0 0 2px !important;
    letter-spacing:-.02em !important;
  }

  #selectedInfo{
    font-size:.78rem !important;
    margin-bottom:8px !important;
  }

  .action-top,
  .action-controls{
    gap:7px !important;
  }

  .action-grid{
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    gap:7px !important;
  }

  .action-btn,
  .action-panel button{
    min-height:42px !important;
    border-radius:16px !important;
    padding:7px 6px !important;
    font-size:.72rem !important;
    font-weight:950 !important;
    letter-spacing:-.01em !important;
    box-shadow:0 8px 18px rgba(17,74,119,.07) !important;
  }

  #selectAllBtn,
  #clearSelectBtn,
  #langOpenBtn,
  #logoutBtn{
    min-height:39px !important;
  }

  #refreshBtn{
    min-height:42px !important;
    border-radius:16px !important;
    margin:8px 0 4px !important;
    background:rgba(255,255,255,.84) !important;
    backdrop-filter:blur(14px) !important;
  }

  .session-note{
    font-size:.72rem !important;
    margin:6px 0 9px !important;
    opacity:.85 !important;
  }

  .accounts{
    gap:10px !important;
  }

  .farm-card{
    position:relative !important;
    padding:12px 12px 12px 50px !important;
    border-radius:24px !important;
    background:rgba(255,255,255,.92) !important;
    border:1px solid rgba(179,220,247,.95) !important;
    box-shadow:0 14px 28px rgba(32,85,125,.10) !important;
    overflow:hidden !important;
  }

  .farm-card::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(135deg,rgba(139,239,255,.13),transparent 45%);
  }

  .farm-select{
    left:14px !important;
    top:18px !important;
    width:24px !important;
    height:24px !important;
    accent-color:#31c8f5 !important;
  }

  .coords{
    position:absolute !important;
    top:12px !important;
    right:12px !important;
    font-size:.73rem !important;
    padding:6px 10px !important;
    border-radius:999px !important;
    background:#eaf8ff !important;
    color:#075985 !important;
    border:1px solid #bfe6fa !important;
    font-weight:950 !important;
  }

  .farm-head{
    display:block !important;
    margin-bottom:10px !important;
    padding-right:86px !important;
  }

  .farm-name{
    font-size:1rem !important;
    line-height:1.1 !important;
    letter-spacing:-.03em !important;
    margin-bottom:7px !important;
  }

  .badges{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:5px !important;
  }

  .badge{
    min-height:24px !important;
    padding:4px 8px !important;
    border-radius:999px !important;
    font-size:.67rem !important;
    font-weight:950 !important;
  }

  .res-grid{
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    gap:6px !important;
  }

  .res{
    min-height:52px !important;
    padding:8px !important;
    border-radius:16px !important;
    background:#fff !important;
    border:1px solid rgba(205,229,245,.95) !important;
    box-shadow:none !important;
  }

  .res span{
    font-size:.58rem !important;
    line-height:1 !important;
    color:#58708d !important;
    font-weight:950 !important;
  }

  .res b{
    display:block !important;
    margin-top:5px !important;
    font-size:.86rem !important;
    line-height:1 !important;
    letter-spacing:-.03em !important;
  }

  .farm-card.is-selected{
    background:linear-gradient(180deg,#ffffff,#e9fbff) !important;
    border-color:#3fc9f4 !important;
    box-shadow:
      0 16px 32px rgba(0,140,205,.18),
      0 0 0 3px rgba(69,211,255,.18) !important;
  }

  .farm-card.is-selected::after{
    width:26px !important;
    height:26px !important;
    right:12px !important;
    bottom:12px !important;
    font-size:.82rem !important;
  }

  .app-modal{
    align-items:flex-end !important;
    padding:0 !important;
  }

  .app-modal-card{
    width:100% !important;
    max-width:none !important;
    border-radius:28px 28px 0 0 !important;
    padding:18px !important;
    max-height:88vh !important;
    overflow:auto !important;
    animation:mobileSheetUp .22s ease both !important;
  }

  @keyframes mobileSheetUp{
    from{transform:translateY(32px);opacity:.4}
    to{transform:translateY(0);opacity:1}
  }
}

/* ===== MOBILE APP BOTTOM ACTION BAR ===== */
.mobile-action-bar,
.mobile-actions-sheet{
  display:none;
}

@media(max-width:760px){
  .action-panel{
    position:relative !important;
    top:auto !important;
    z-index:1 !important;
    border-radius:24px !important;
    margin:8px 0 10px !important;
  }

  .app-dashboard{
    padding-bottom:96px !important;
  }

  .mobile-action-bar{
    position:fixed;
    left:10px;
    right:10px;
    bottom:10px;
    z-index:9000;
    display:grid;
    grid-template-columns:1fr 1.2fr 1fr;
    gap:8px;
    padding:8px;
    border-radius:24px;
    background:rgba(255,255,255,.86);
    border:1px solid rgba(178,220,247,.95);
    box-shadow:0 18px 46px rgba(15,58,95,.24);
    backdrop-filter:blur(18px) saturate(1.35);
  }

  .mobile-action-bar.hidden{
    display:none !important;
  }

  .mobile-action-bar button{
    min-height:48px;
    border:1px solid #bfe2f8;
    border-radius:18px;
    background:#fff;
    color:#08162e;
    font-size:.78rem;
    font-weight:950;
    cursor:pointer;
  }

  .mobile-bar-main{
    background:linear-gradient(90deg,#7eeaff,#c8f8ff) !important;
    border-color:#7ddcff !important;
    box-shadow:0 10px 22px rgba(0,130,200,.18);
  }

  .mobile-actions-sheet{
    position:fixed;
    inset:0;
    z-index:9500;
    display:block;
  }

  .mobile-actions-sheet.hidden{
    display:none !important;
  }

  .mobile-sheet-backdrop{
    position:absolute;
    inset:0;
    background:rgba(8,23,47,.34);
    backdrop-filter:blur(10px);
  }

  .mobile-sheet-card{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    padding:16px 16px 24px;
    border-radius:28px 28px 0 0;
    background:linear-gradient(180deg,#ffffff,#edf8ff);
    border:1px solid #c4e2f7;
    box-shadow:0 -18px 50px rgba(10,50,90,.24);
    animation:mobileSheetUp .22s ease both;
  }

  .mobile-sheet-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
    margin-bottom:14px;
  }

  .mobile-sheet-head strong{
    display:block;
    color:#08162e;
    font-size:1.05rem;
    font-weight:950;
  }

  .mobile-sheet-head p{
    margin:4px 0 0;
    color:#59718e;
    font-size:.78rem;
    font-weight:900;
  }

  #mobileSheetClose{
    width:44px;
    height:44px;
    border-radius:16px;
    border:1px solid #bfe0f6;
    background:#fff;
    color:#08162e;
    font-size:1.65rem;
    font-weight:950;
    line-height:1;
  }

  .mobile-sheet-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
  }

  .mobile-sheet-grid button{
    min-height:54px;
    border-radius:18px;
    border:1px solid #bfe2f8;
    background:#fff;
    color:#08162e;
    font-size:.86rem;
    font-weight:950;
    cursor:pointer;
  }

  .mobile-sheet-grid button.danger{
    background:#fff1f2;
    border-color:#fecdd3;
    color:#be123c;
  }

  .mobile-sheet-grid button.warn{
    background:#fff7e6;
    border-color:#fed38b;
    color:#9a4a0d;
  }
}

/* ===== MOBILE: USE ONLY BOTTOM ACTION MENU ===== */
@media(max-width:760px){
  body.is-dashboard .action-panel{
    display:none !important;
  }

  body.is-dashboard #refreshBtn{
    display:none !important;
  }

  body.is-dashboard .session-note{
    margin-top:10px !important;
  }

  body.is-dashboard .accounts{
    margin-top:8px !important;
  }

  body.is-dashboard .app-dashboard{
    padding-top:8px !important;
    padding-bottom:104px !important;
  }

  .mobile-action-bar{
    display:grid !important;
  }

  .mobile-action-bar.hidden{
    display:none !important;
  }
}

/* ===== MOBILE ACTION SHEET GROUPED UI ===== */
@media(max-width:760px){
  .mobile-sheet-card{
    padding:16px 14px 22px !important;
  }

  .mobile-action-groups{
    display:grid;
    gap:14px;
  }

  .mobile-action-group{
    padding:11px;
    border-radius:22px;
    background:rgba(247,252,255,.92);
    border:1px solid #d7ecfb;
  }

  .mobile-action-group-title{
    margin:0 0 9px;
    padding:0 2px;
    color:#526c8a;
    font-size:.72rem;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.04em;
  }

  .mobile-sheet-grid{
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    gap:8px !important;
  }

  .mobile-sheet-grid button{
    min-height:78px !important;
    padding:9px 6px !important;
    border-radius:20px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    background:linear-gradient(180deg,#ffffff,#f6fcff) !important;
    border:1px solid #bfe2f8 !important;
    color:#08162e !important;
    box-shadow:0 10px 22px rgba(20,78,120,.08) !important;
    font-size:.72rem !important;
    line-height:1.05 !important;
    text-align:center !important;
  }

  .mobile-sheet-grid button.danger{
    background:linear-gradient(180deg,#fff1f2,#fff7f8) !important;
    border-color:#fecdd3 !important;
    color:#be123c !important;
  }

  .mobile-sheet-grid button.warn{
    background:linear-gradient(180deg,#fff7e6,#fffaf0) !important;
    border-color:#fed38b !important;
    color:#9a4a0d !important;
  }

  .mobile-action-icon{
    width:34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    background:#eaf8ff;
    border:1px solid #c9ebfb;
    font-size:1.05rem;
    line-height:1;
  }

  .mobile-sheet-grid button.danger .mobile-action-icon{
    background:#ffe4e6;
    border-color:#fecdd3;
  }

  .mobile-sheet-grid button.warn .mobile-action-icon{
    background:#fff0d1;
    border-color:#fed38b;
  }

  .mobile-action-bar{
    grid-template-columns:1fr 1.35fr 1fr !important;
  }

  .mobile-bar-main{
    font-size:.82rem !important;
  }

  #mobileSelectedBtn{
    font-size:.7rem !important;
  }

  #mobileRefreshBtn{
    font-size:.72rem !important;
  }
}

/* ===== MOBILE ACTION SHEET 4 COLUMNS ===== */
@media(max-width:760px){
  .mobile-sheet-grid{
    grid-template-columns:repeat(4,1fr) !important;
    gap:7px !important;
  }

  .mobile-sheet-grid button{
    min-height:74px !important;
    padding:8px 4px !important;
    font-size:.64rem !important;
    border-radius:18px !important;
  }

  .mobile-action-icon{
    width:32px !important;
    height:32px !important;
    border-radius:13px !important;
    font-size:1rem !important;
  }

  .mobile-action-group{
    padding:10px !important;
  }

  .mobile-action-group-title{
    font-size:.68rem !important;
  }
}

@media(max-width:380px){
  .mobile-sheet-grid button{
    font-size:.58rem !important;
    min-height:70px !important;
  }

  .mobile-action-icon{
    width:29px !important;
    height:29px !important;
    font-size:.92rem !important;
  }
}

/* ===== MOBILE BOTTOM BAR: 4 BUTTONS WITH LANGUAGE ===== */
@media(max-width:760px){
  .mobile-action-bar{
    grid-template-columns:1fr 1.15fr .82fr .9fr !important;
    gap:7px !important;
  }

  .mobile-action-bar button{
    min-height:48px !important;
    padding:5px 4px !important;
    font-size:.68rem !important;
    line-height:1.05 !important;
  }

  #mobileActionsBtn{
    font-size:.76rem !important;
  }

  #mobileLangBtn{
    background:#ffffff !important;
    border-color:#bfe2f8 !important;
  }
}

@media(max-width:380px){
  .mobile-action-bar{
    left:7px !important;
    right:7px !important;
    gap:5px !important;
    padding:6px !important;
  }

  .mobile-action-bar button{
    font-size:.6rem !important;
    min-height:45px !important;
  }

  #mobileActionsBtn{
    font-size:.66rem !important;
  }
}

/* ===== CUSTOM APP ALERT ===== */
.app-alert-modal{
  position:fixed;
  inset:0;
  z-index:12000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(8,23,47,.38);
  backdrop-filter:blur(12px);
}

.app-alert-modal.hidden{
  display:none !important;
}

.app-alert-card{
  width:min(390px,100%);
  border-radius:28px;
  background:linear-gradient(180deg,#ffffff,#edf8ff);
  border:1px solid #c7e3f7;
  box-shadow:0 26px 70px rgba(10,40,75,.28);
  padding:20px;
  text-align:center;
  animation:appAlertIn .18s ease both;
}

@keyframes appAlertIn{
  from{transform:scale(.94);opacity:.35}
  to{transform:scale(1);opacity:1}
}

.app-alert-icon{
  width:54px;
  height:54px;
  margin:0 auto 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:20px;
  background:#eaf8ff;
  border:1px solid #bfe8fb;
  font-size:1.45rem;
}

.app-alert-title{
  color:#08162e;
  font-size:1.12rem;
  font-weight:950;
  margin-bottom:8px;
}

.app-alert-text{
  color:#526b89;
  font-size:.92rem;
  font-weight:850;
  line-height:1.35;
  margin-bottom:16px;
  white-space:pre-line;
}

.app-alert-ok{
  width:100%;
  min-height:48px;
  border:0;
  border-radius:18px;
  background:linear-gradient(90deg,#7eeaff,#c8f8ff);
  color:#062236;
  font-size:.96rem;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(0,130,200,.16);
}

/* ===== MOBILE BOTTOM BAR: 5 BUTTONS ===== */
@media(max-width:760px){
  .mobile-action-bar{
    grid-template-columns:1.05fr 1.15fr .78fr .82fr .9fr !important;
    gap:6px !important;
  }

  .mobile-action-bar button{
    min-height:46px !important;
    padding:4px 3px !important;
    font-size:.62rem !important;
    line-height:1.05 !important;
  }

  #mobileActionsBtn{
    font-size:.68rem !important;
  }

  #mobileThemeBtn{
    background:#ffffff !important;
    border-color:#bfe2f8 !important;
  }
}

@media(max-width:390px){
  .mobile-action-bar{
    left:6px !important;
    right:6px !important;
    gap:4px !important;
    padding:6px !important;
  }

  .mobile-action-bar button{
    min-height:44px !important;
    font-size:.56rem !important;
  }
}

/* ===== TOP RIGHT THEME TOGGLE ===== */
.theme-corner-btn{
  position:fixed;
  top:12px;
  right:12px;
  z-index:9200;
  width:46px;
  height:46px;
  border-radius:999px;
  border:1px solid rgba(184,222,246,.95);
  background:rgba(255,255,255,.88);
  color:#08162e;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.2rem;
  cursor:pointer;
  box-shadow:0 12px 28px rgba(18,70,110,.14);
  backdrop-filter:blur(16px) saturate(1.2);
  transition:.18s ease;
}

.theme-corner-btn:active{
  transform:scale(.94);
}

html[data-theme="dark"] .theme-corner-btn{
  background:rgba(12,24,42,.9);
  border-color:rgba(94,203,255,.42);
  color:#eaf8ff;
  box-shadow:0 12px 30px rgba(0,0,0,.34), 0 0 24px rgba(77,208,255,.12);
}

@media(max-width:760px){
  .theme-corner-btn{
    top:10px;
    right:10px;
    width:43px;
    height:43px;
    font-size:1.08rem;
  }

  /* возвращаем нижнюю панель к 4 кнопкам */
  .mobile-action-bar{
    grid-template-columns:1fr 1.15fr .82fr .9fr !important;
  }
}

/* ===== FORCE THEME BUTTON VISIBLE ===== */
#themeCornerBtn.theme-corner-btn{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  position:fixed !important;
  top:72px !important;
  right:14px !important;
  z-index:99999 !important;
  width:48px !important;
  height:48px !important;
  border-radius:999px !important;
  border:1px solid #9edcff !important;
  background:#ffffff !important;
  color:#08162e !important;
  box-shadow:0 14px 34px rgba(15,58,95,.24) !important;
}

html[data-theme="dark"] #themeCornerBtn.theme-corner-btn{
  background:#101c2f !important;
  color:#eaf8ff !important;
  border-color:#38bdf8 !important;
}

@media(max-width:760px){
  #themeCornerBtn.theme-corner-btn{
    top:68px !important;
    right:12px !important;
  }
}

/* ===== THEME BUTTON: REAL TOP RIGHT ===== */
#themeCornerBtn.theme-corner-btn{
  top:10px !important;
  right:10px !important;
  width:44px !important;
  height:44px !important;
  z-index:99999 !important;
}

@media(max-width:760px){
  #themeCornerBtn.theme-corner-btn{
    top:8px !important;
    right:8px !important;
    width:42px !important;
    height:42px !important;
  }
}

/* ===== FULL SMART DARK THEME ===== */
html[data-theme="dark"],
html[data-theme="dark"] body{
  background:
    radial-gradient(circle at top left, rgba(0,220,255,.18), transparent 32%),
    radial-gradient(circle at bottom right, rgba(55,90,255,.16), transparent 34%),
    linear-gradient(180deg,#06111f 0%,#0b1728 48%,#07101d 100%) !important;
  color:#eaf8ff !important;
}

html[data-theme="dark"] body::before{
  opacity:.18 !important;
}

html[data-theme="dark"] .app-dashboard,
html[data-theme="dark"] .dashboard,
html[data-theme="dark"] main{
  background:transparent !important;
  color:#eaf8ff !important;
}

/* login / main cards */
html[data-theme="dark"] .login-card,
html[data-theme="dark"] .action-panel,
html[data-theme="dark"] .farm-card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .session-note,
html[data-theme="dark"] .app-modal-card,
html[data-theme="dark"] .language-card,
html[data-theme="dark"] .app-alert-card,
html[data-theme="dark"] .mobile-sheet-card,
html[data-theme="dark"] .mobile-action-bar{
  background:linear-gradient(180deg,rgba(16,31,52,.96),rgba(9,20,36,.96)) !important;
  border-color:rgba(94,203,255,.28) !important;
  color:#eaf8ff !important;
  box-shadow:
    0 18px 46px rgba(0,0,0,.34),
    0 0 26px rgba(56,189,248,.08) !important;
}

/* titles/text */
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] strong,
html[data-theme="dark"] .farm-name,
html[data-theme="dark"] .app-modal-head strong,
html[data-theme="dark"] .mobile-sheet-head strong,
html[data-theme="dark"] .app-alert-title,
html[data-theme="dark"] .login-title,
html[data-theme="dark"] .dashboard-title{
  color:#f4fbff !important;
}

html[data-theme="dark"] p,
html[data-theme="dark"] label,
html[data-theme="dark"] .modal-muted,
html[data-theme="dark"] .app-alert-text,
html[data-theme="dark"] .session-note,
html[data-theme="dark"] #selectedInfo,
html[data-theme="dark"] .mobile-sheet-head p{
  color:#9fb8d2 !important;
}

/* farm cards */
html[data-theme="dark"] .farm-card{
  background:
    linear-gradient(180deg,rgba(17,34,58,.96),rgba(11,25,44,.96)) !important;
}

html[data-theme="dark"] .farm-card::before{
  background:linear-gradient(135deg,rgba(74,222,255,.10),transparent 45%) !important;
}

html[data-theme="dark"] .farm-card.is-selected{
  background:
    linear-gradient(180deg,rgba(17,46,70,.98),rgba(8,34,54,.98)) !important;
  border-color:#38bdf8 !important;
  box-shadow:
    0 18px 38px rgba(0,0,0,.36),
    0 0 0 3px rgba(56,189,248,.22),
    0 0 28px rgba(56,189,248,.14) !important;
}

/* coordinates / badges / resources */
html[data-theme="dark"] .coords,
html[data-theme="dark"] .badge,
html[data-theme="dark"] .res,
html[data-theme="dark"] .whitelist-section,
html[data-theme="dark"] .whitelist-item,
html[data-theme="dark"] .whitelist-result,
html[data-theme="dark"] .mobile-action-group,
html[data-theme="dark"] .mobile-sheet-grid button,
html[data-theme="dark"] .language-options button{
  background:rgba(9,24,42,.88) !important;
  border-color:rgba(94,203,255,.26) !important;
  color:#eaf8ff !important;
  box-shadow:none !important;
}

html[data-theme="dark"] .res span,
html[data-theme="dark"] .whitelist-item small,
html[data-theme="dark"] .whitelist-result small,
html[data-theme="dark"] .mobile-action-group-title{
  color:#8fa9c5 !important;
}

html[data-theme="dark"] .res b,
html[data-theme="dark"] .coords,
html[data-theme="dark"] .badge{
  color:#eaf8ff !important;
}

/* status badges */
html[data-theme="dark"] .online,
html[data-theme="dark"] .badge.online{
  background:rgba(16,185,129,.16) !important;
  border-color:rgba(52,211,153,.38) !important;
  color:#8fffd2 !important;
}

html[data-theme="dark"] .offline,
html[data-theme="dark"] .badge.offline{
  background:rgba(244,63,94,.13) !important;
  border-color:rgba(251,113,133,.35) !important;
  color:#ff9aac !important;
}

/* buttons */
html[data-theme="dark"] button,
html[data-theme="dark"] .action-btn,
html[data-theme="dark"] .modal-btn,
html[data-theme="dark"] .mobile-action-bar button{
  border-color:rgba(94,203,255,.30) !important;
}

html[data-theme="dark"] .mobile-bar-main,
html[data-theme="dark"] .modal-btn.primary,
html[data-theme="dark"] .app-alert-ok,
html[data-theme="dark"] .whitelist-search-row button,
html[data-theme="dark"] .whitelist-add-btn{
  background:linear-gradient(90deg,#0891b2,#67e8f9) !important;
  color:#03121f !important;
  border-color:rgba(103,232,249,.62) !important;
  box-shadow:0 10px 24px rgba(34,211,238,.14) !important;
}

html[data-theme="dark"] .danger,
html[data-theme="dark"] .modal-btn.danger,
html[data-theme="dark"] .mobile-sheet-grid button.danger{
  background:linear-gradient(180deg,rgba(127,29,29,.72),rgba(76,12,28,.72)) !important;
  border-color:rgba(251,113,133,.45) !important;
  color:#ffc4cf !important;
}

html[data-theme="dark"] .warn,
html[data-theme="dark"] .mobile-sheet-grid button.warn{
  background:linear-gradient(180deg,rgba(120,53,15,.72),rgba(67,37,13,.72)) !important;
  border-color:rgba(251,191,36,.45) !important;
  color:#ffe0a3 !important;
}

/* inputs / selects */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] #upgradeMaxLevel,
html[data-theme="dark"] .whitelist-search-row input{
  background:rgba(6,17,31,.92) !important;
  border-color:rgba(94,203,255,.28) !important;
  color:#eaf8ff !important;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{
  color:#6f89a7 !important;
}

/* modal overlays */
html[data-theme="dark"] .app-modal,
html[data-theme="dark"] .language-modal,
html[data-theme="dark"] .app-alert-modal,
html[data-theme="dark"] .mobile-sheet-backdrop{
  background:rgba(1,8,18,.62) !important;
  backdrop-filter:blur(14px) !important;
}

/* close buttons */
html[data-theme="dark"] #mobileSheetClose,
html[data-theme="dark"] .app-modal-head button,
html[data-theme="dark"] .language-close,
html[data-theme="dark"] .whitelist-delete-btn{
  background:rgba(9,24,42,.92) !important;
  border-color:rgba(94,203,255,.30) !important;
  color:#eaf8ff !important;
}

/* theme button icon color */
html[data-theme="dark"] #themeCornerBtn.theme-corner-btn{
  background:rgba(7,18,34,.92) !important;
  border-color:rgba(103,232,249,.48) !important;
  box-shadow:
    0 14px 34px rgba(0,0,0,.38),
    0 0 28px rgba(34,211,238,.16) !important;
}

/* mobile bottom bar */
@media(max-width:760px){
  html[data-theme="dark"] .mobile-action-bar{
    background:rgba(8,20,36,.88) !important;
    border-color:rgba(94,203,255,.28) !important;
  }

  html[data-theme="dark"] .mobile-action-bar button{
    background:rgba(13,30,51,.94) !important;
    color:#eaf8ff !important;
  }

  html[data-theme="dark"] .mobile-bar-main{
    background:linear-gradient(90deg,#0891b2,#67e8f9) !important;
    color:#03121f !important;
  }
}

/* ===== DARK THEME: BOTTOM LANGUAGE BUTTON FIX ===== */
html[data-theme="dark"] #mobileLangBtn,
html[data-theme="dark"] .mobile-action-bar #mobileLangBtn{
  background:rgba(13,30,51,.94) !important;
  color:#eaf8ff !important;
  border-color:rgba(94,203,255,.30) !important;
  box-shadow:none !important;
}

html[data-theme="dark"] #mobileLangBtn:active{
  background:rgba(18,43,72,.98) !important;
}

/* после удаления языка из меню управления можно оставить 3 кнопки красивее */
@media(max-width:760px){
  .mobile-action-group .mobile-sheet-grid{
    grid-template-columns:repeat(3,1fr) !important;
  }

  .mobile-action-group:last-child .mobile-sheet-grid{
    grid-template-columns:repeat(3,1fr) !important;
  }
}

/* ===== BRAND INSTEAD OF NOTE ===== */
.session-note{
  font-size:0 !important;
  text-align:center !important;
  margin:12px 0 14px !important;
  opacity:1 !important;
}

.session-note::before{
  content:"SonicStore";
  display:block;
  color:#061a35;
  font-size:1.05rem;
  line-height:1.1;
  font-weight:950;
  letter-spacing:-.03em;
}

.session-note::after{
  content:"Remote Farm Control";
  display:block;
  margin-top:4px;
  color:#5d7897;
  font-size:.68rem;
  line-height:1;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

html[data-theme="dark"] .session-note::before{
  color:#f4fbff !important;
  text-shadow:0 0 18px rgba(56,189,248,.18);
}

html[data-theme="dark"] .session-note::after{
  color:#8fb4d8 !important;
}

@media(max-width:760px){
  .session-note{
    margin:10px 0 12px !important;
  }

  .session-note::before{
    font-size:1rem !important;
  }

  .session-note::after{
    font-size:.62rem !important;
  }
}

/* ===== DARK THEME STABILITY FIX ===== */
html[data-theme="dark"] body,
html[data-theme="dark"] .app-dashboard{
  background:
    radial-gradient(circle at top left, rgba(0,220,255,.16), transparent 30%),
    linear-gradient(180deg,#06111f 0%,#0b1728 55%,#06111f 100%) !important;
}

/* selected card must stay dark */
html[data-theme="dark"] .farm-card.is-selected,
html[data-theme="dark"] .farm-card.is-selected *{
  color:#eaf8ff;
}

html[data-theme="dark"] .farm-card.is-selected .res,
html[data-theme="dark"] .farm-card.is-selected .res-grid .res{
  background:rgba(7,20,36,.96) !important;
  border-color:rgba(94,203,255,.34) !important;
  color:#eaf8ff !important;
}

html[data-theme="dark"] .farm-card.is-selected .res span{
  color:#94aecb !important;
}

html[data-theme="dark"] .farm-card.is-selected .res b{
  color:#f4fbff !important;
}

html[data-theme="dark"] .farm-card.is-selected .coords{
  background:rgba(11,35,58,.98) !important;
  border-color:rgba(94,203,255,.46) !important;
  color:#dff7ff !important;
}

/* top action panel in dark must not fade text */
html[data-theme="dark"] .action-panel,
html[data-theme="dark"] .action-panel *{
  color:#eaf8ff;
}

html[data-theme="dark"] .action-panel button:not(.danger):not(.warn),
html[data-theme="dark"] #refreshBtn,
html[data-theme="dark"] #mobileLangBtn,
html[data-theme="dark"] #mobileRefreshBtn,
html[data-theme="dark"] #mobileSelectedBtn{
  background:rgba(13,30,51,.94) !important;
  color:#eaf8ff !important;
  border-color:rgba(94,203,255,.30) !important;
}

/* keep main action button visible */
html[data-theme="dark"] #mobileActionsBtn,
html[data-theme="dark"] .mobile-bar-main{
  background:linear-gradient(90deg,#0891b2,#67e8f9) !important;
  color:#03121f !important;
}

/* language button in bottom bar */
html[data-theme="dark"] #mobileLangBtn{
  background:rgba(13,30,51,.94) !important;
  color:#eaf8ff !important;
  border-color:rgba(94,203,255,.30) !important;
}

/* brand strip */
html[data-theme="dark"] .session-note{
  background:linear-gradient(90deg,transparent,rgba(56,189,248,.08),transparent) !important;
}

/* forms and modals */
html[data-theme="dark"] .app-modal-card input,
html[data-theme="dark"] .app-modal-card select,
html[data-theme="dark"] .app-modal-card textarea{
  background:rgba(6,17,31,.94) !important;
  color:#eaf8ff !important;
  border-color:rgba(94,203,255,.32) !important;
}

/* browser autofill / white flashes */
html[data-theme="dark"] input:-webkit-autofill{
  -webkit-text-fill-color:#eaf8ff !important;
  box-shadow:0 0 0 1000px rgba(6,17,31,.94) inset !important;
}

/* ===== REFRESH BUTTON FEEDBACK ===== */
#refreshBtn:disabled,
#mobileRefreshBtn:disabled{
  opacity:.72 !important;
  pointer-events:none !important;
  transform:scale(.98);
}

/* ===== DARK LOGIN SCREEN POLISH ===== */
html[data-theme="dark"] .login-screen{
  background:
    radial-gradient(circle at top left, rgba(0,220,255,.16), transparent 34%),
    linear-gradient(180deg,#06111f 0%,#0b1728 55%,#06111f 100%) !important;
}

html[data-theme="dark"] .login-card{
  background:linear-gradient(180deg,rgba(16,31,52,.96),rgba(9,20,36,.96)) !important;
  border-color:rgba(94,203,255,.30) !important;
  box-shadow:0 22px 60px rgba(0,0,0,.38), 0 0 28px rgba(56,189,248,.08) !important;
}

html[data-theme="dark"] .mini-badge{
  background:rgba(8,31,52,.92) !important;
  border-color:rgba(94,203,255,.30) !important;
  color:#7ddcff !important;
}

html[data-theme="dark"] .login-card h1,
html[data-theme="dark"] .login-card h1 span{
  color:#f4fbff !important;
}

html[data-theme="dark"] .login-subtitle{
  color:#a7bfd9 !important;
}

html[data-theme="dark"] .code-panel{
  background:rgba(236,249,255,.96) !important;
  color:#07162a !important;
}

html[data-theme="dark"] .code-panel label{
  color:#9eb5cf !important;
}

html[data-theme="dark"] #codeInput{
  background:#152234 !important;
  color:#eaf8ff !important;
  border-color:rgba(94,203,255,.42) !important;
  box-shadow:0 0 0 6px rgba(125,220,255,.14) !important;
}

html[data-theme="dark"] #codeInput::placeholder{
  color:#8199b7 !important;
}

html[data-theme="dark"] #loginBtn{
  background:linear-gradient(90deg,#0891b2,#67e8f9) !important;
  color:#06111f !important;
}

html[data-theme="dark"] .language-open-btn{
  background:rgba(13,30,51,.94) !important;
  color:#eaf8ff !important;
  border-color:rgba(94,203,255,.32) !important;
}

html[data-theme="dark"] #loginError{
  background:rgba(127,29,29,.24) !important;
  color:#ffb7c4 !important;
  border-color:rgba(251,113,133,.36) !important;
}