[data-theme="dark"]{
  --bg:#1a1a2e;--bg1:#22223a;--bg2:#2a2a44;--bg3:#32324e;
  --surface:rgba(255,255,255,0.055);--surf-h:rgba(255,255,255,0.10);
  --bdr:rgba(255,255,255,0.08);--bdr2:rgba(255,255,255,0.15);
  --txt:#e0e0f0;--txt1:rgba(224,224,240,0.80);--txt2:#7070a0;--txt3:rgba(112,112,160,0.60);
  --inp:rgba(255,255,255,0.06);--tgl:#32324e;
  --seg:rgba(255,255,255,0.07);--seg-on:rgba(255,255,255,0.15);
  --star-off:rgba(255,255,255,0.18);--sh:none;--del:#FF6060;
}
[data-theme="light"]{
  --bg:#F2F3FA;--bg1:#FFFFFF;--bg2:#ECEDF6;--bg3:#E2E4F0;
  --surface:rgba(255,255,255,0.90);--surf-h:rgba(255,255,255,1);
  --bdr:rgba(20,20,60,0.08);--bdr2:rgba(20,20,60,0.16);
  --txt:#0C0C1E;--txt1:rgba(12,12,30,0.68);--txt2:rgba(12,12,30,0.42);--txt3:rgba(12,12,30,0.26);
  --inp:#FFFFFF;--tgl:#C0C2D8;
  --seg:rgba(20,20,60,0.06);--seg-on:rgba(20,20,60,0.12);
  --star-off:rgba(20,20,60,0.18);--sh:0 2px 20px rgba(20,20,80,0.08);--del:#C01010;
}
:root{
  --acc:#E07838;--acc-rgb:224,120,56;
  --r:clamp(14px,4vw,18px);--r-sm:clamp(10px,3vw,13px);
  --nav:clamp(64px,18vw,76px);
  --safe:env(safe-area-inset-bottom,0px);--itop:env(safe-area-inset-top,0px);
}
*,::before,::after{box-sizing:border-box;margin:0;padding:0}
html{height:100%;user-select:none;}
body{min-height:100%;font-family:'Roboto',sans-serif;background:var(--bg);color:var(--txt);
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;
  overscroll-behavior:none;transition:background .3s,color .3s;}
.ic{font-family:'Material Symbols Outlined';font-size:inherit;line-height:1;
  font-variation-settings:'FILL' 0,'wght' 200,'opsz' 24;
  display:inline-block;user-select:none;font-style:normal;font-weight:normal;}
.ic-fill{font-family:'Material Symbols Outlined';font-size:inherit;line-height:1;
  font-variation-settings:'FILL' 1,'wght' 300,'opsz' 24;
  display:inline-block;user-select:none;font-style:normal;font-weight:normal;}
#app{width:100%;max-width:480px;margin:0 auto;
  height:100dvh;
  height:calc(var(--app-vh, 100dvh));
  background:var(--bg);
  display:flex;flex-direction:column;overflow:hidden;transition:background .3s;}
.screen{display:none;flex-direction:column;flex:1;overflow:hidden}
.screen.active{display:flex}
.scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.scroll::-webkit-scrollbar{display:none}
.pad{padding:clamp(20px,5.5vw,28px) clamp(16px,4.5vw,22px)}

/* PWA Install Modal */
#pwa-install-modal,
#ios-install-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  align-items: flex-end;
  justify-content: center;
}
 
#pwa-install-modal.show,
#ios-install-modal.show {
  display: flex;
}

.pwa-modal-card {
  position: relative;
  z-index: 1;
  background: #fff;
  border-radius: 20px 20px 0 0;
  padding: 28px 24px 36px;
  width: 100%;
  max-width: 480px;
  text-align: center;
  box-shadow: 0 -4px 32px rgba(0,0,0,0.15);
  animation: pwa-slide-up 0.3s ease;
}
 
[data-dark] .pwa-modal-card {
  background: #1e1e2e;
  color: #e0e0e0;
}
 
@keyframes pwa-slide-up {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
 
.pwa-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(2px);
}

.pwa-modal-icon {
  font-size: 48px;
  margin-bottom: 12px;
}
 
.pwa-modal-title {
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 10px;
  color: #1a1a2e;
}
 
[data-dark] .pwa-modal-title {
  color: #fff;
}
 
.pwa-modal-text {
  font-size: 15px;
  color: #555;
  line-height: 1.5;
  margin: 0 0 24px;
}
 
[data-dark] .pwa-modal-text {
  color: #aaa;
}
 
.pwa-btn-install,
#ios-install-modal .pwa-btn-dismiss {
  display: block;
  width: 100%;
  padding: 14px;
  background: #1565C0;
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  margin-bottom: 10px;
  transition: background 0.2s;
}

#pwa-rating-modal .pwa-modal-icon{
  margin-bottom: 0;
}

#pwa-rating-modal .pwa-modal-icon i{
  color: #F0B800;
}
 
.pwa-btn-install:active,
.pwa-btn-dismiss:active {
  background: #0d47a1;
}
 
#pwa-install-modal .pwa-btn-dismiss,
#pwa-rating-modal .pwa-btn-dismiss {
  display: block;
  width: 100%;
  padding: 12px;
  background: transparent;
  color: #888;
  border: none;
  font-size: 14px;
  cursor: pointer;
}

#ios-install-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  align-items: flex-end;
  justify-content: center;
}

#ios-install-modal.show {
  display: flex;
}

.ios-steps {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0 0 24px;
  background: #f5f7fa;
  border-radius: 12px;
  padding: 14px 16px;
}

[data-dark] .ios-steps {
  background: #2a2a3e;
}

.ios-step {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  color: #333;
}

[data-dark] .ios-step {
  color: #ddd;
}

.ios-step-icon {
  width: 32px;
  height: 32px;            
  display: flex;        
  align-items: center;     
  justify-content: center;   
  font-size: 22px;
}

.btn-continue-text-i{
  margin-top: 2px;
}

.ios-step-icon i {
  font-size: 22px;
  color: #AFB0B3;
  line-height: 1;
  display: block;
}

.ios-step-icon i.plusH {
  margin-top: -4px;
}  

/* PWWA */

/* TOPBAR */
.topbar{padding:0 clamp(16px,4.5vw,22px) clamp(14px,4vw,18px);
  padding-top:calc(var(--itop) + clamp(16px,4.5vw,20px));
  background:var(--bg1);border-bottom:1px solid var(--bdr);
  display:flex;align-items:center;gap:clamp(12px,3.5vw,16px);
  flex-shrink:0;transition:background .3s,border-color .3s;}
.t-logo{width:clamp(44px,12.5vw,52px);height:clamp(44px,12.5vw,52px);
  border-radius:clamp(12px,3.5vw,15px);background:var(--acc);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition:background .3s;box-shadow:0 4px 18px rgba(var(--acc-rgb),0.35);}
.t-logo .ic{font-size:clamp(22px,6.2vw,28px);color:#fff;font-variation-settings:'FILL' 1,'wght' 300,'opsz' 24}
.t-info{flex:1;min-width:0}
.t-name{font-family:'Roboto Condensed',sans-serif;font-size:clamp(17px,4.8vw,21px);font-weight:700;
  color:var(--txt);letter-spacing:0.3px;line-height:1.15;}

/* SUB-BAR */
.sub-bar{padding:0 clamp(16px,4.5vw,22px) clamp(14px,4vw,18px);
  padding-top:calc(var(--itop) + clamp(16px,4.5vw,20px));
  background:var(--bg1);border-bottom:1px solid var(--bdr);
  display:flex;align-items:center;gap:clamp(12px,3.5vw,16px);
  flex-shrink:0;transition:background .3s,border-color .3s;}
.back-btn{width:clamp(40px,11.5vw,46px);height:clamp(40px,11.5vw,46px);
  border-radius:clamp(10px,3vw,13px);background:none;border:none;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;flex-shrink:0;-webkit-tap-highlight-color:transparent;}
.back-btn:active{opacity:0.5}
.back-btn .ic{font-size:clamp(26px,7vw,30px);color:var(--txt1)}
.sub-title{font-family:'Roboto Condensed',sans-serif;font-size:clamp(16px,4.5vw,19px);font-weight:700;color:var(--txt);}

/* Стартовый лоадер */
#init-loader{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:opacity .25s ease;
}

#init-loader.theme-light{
  background:#F2F3FA;
}

#init-loader.theme-dark{
  background:#1a1a2e;
}

.loader-spinner{
  font-size:clamp(40px,10vw,52px);
  color:var(--acc);
  animation:spin 1s linear infinite;
}

.empty-loader{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:100%;
}

.empty-loader .ic{
  font-size:clamp(40px,10vw,52px);
  color:var(--acc);
  animation:spin 1s linear infinite;
}

@keyframes spin{
  from{transform:rotate(0)}
  to{transform:rotate(360deg)}
}

/* HELPERS */
.lbl{font-size:clamp(10px,2.8vw,12px);font-weight:500;color:var(--txt2);
  text-transform:uppercase;letter-spacing:1.6px;margin-bottom:clamp(12px,3.5vw,16px);}
.divider{display:none}

/* STARS */
.stars-row{display:flex;gap:clamp(4px,1.5vw,8px);margin-bottom:clamp(8px,2.5vw,12px);justify-content:center}
.star-btn{flex:1;max-width:clamp(52px,14vw,68px);background:none;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:clamp(6px,2vw,10px) 0;
  transition:transform .1s;-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
.star-btn:active{transform:scale(0.88)}
.star-btn .si{font-size:clamp(38px,10.5vw,50px);color:var(--star-off);
  transition:color .18s,transform .15s;font-family:none;font-style:normal;
  display:inline-block;line-height:1;font-variation-settings:unset;}
.star-btn.lit .si{color:#F0B800;transform:scale(1.15);}
.star-btn .sn{display:none}
.r-hint{text-align:center;font-size:clamp(13px,3.8vw,15px);font-weight:400;
  color:var(--txt2);min-height:clamp(20px,5vw,24px);
  margin:clamp(10px,3vw,14px) 0 clamp(18px,5vw,24px);transition:color .2s;}

/* PILLS */
.pills{display:flex;gap:clamp(5px,1.5vw,8px);flex-wrap:wrap;margin-bottom:clamp(18px,5vw,24px)}
.pill{display:flex;align-items:center;gap:clamp(4px,1.2vw,6px);
  padding:clamp(7px,2vw,9px) clamp(8px,2.2vw,11px);border-radius:100px;
  border:1px solid var(--bdr);background:var(--surface);color:var(--txt2);
  font-family:'Roboto',sans-serif;font-size:clamp(11px,2.8vw,13px);font-weight:400;
  cursor:pointer;transition:all .18s;-webkit-tap-highlight-color:transparent;touch-action:manipulation;overflow:hidden;}
.pill-txt{white-space:nowrap;min-width:0}
.pill .ic{font-size:clamp(13px,3.5vw,15px);flex-shrink:0}
.pill:active{transform:scale(0.95)}
.pill.pp{background:rgba(52,199,89,0.10);border-color:rgba(52,199,89,0.32)}
.pill.pc{background:rgba(255,60,50,0.10);border-color:rgba(255,60,50,0.30)}
.pill.ps{background:rgba(10,130,255,0.10);border-color:rgba(10,130,255,0.30)}
[data-theme="dark"] .pill.pp{color:#4DD868}
[data-theme="dark"] .pill.pc{color:#FF6565}
[data-theme="dark"] .pill.ps{color:#5AB4FF}
[data-theme="light"] .pill.pp{color:#1A7530}
[data-theme="light"] .pill.pc{color:#AA1010}
[data-theme="light"] .pill.ps{color:#0045B8}

/* TEXTAREA & INPUTS */
textarea{width:100%;min-height:clamp(72px,18vw,90px);
  background:var(--inp);border:1px solid var(--bdr);border-radius:var(--r);
  padding:clamp(12px,3.5vw,16px);color:var(--txt);
  font-family:'Roboto',sans-serif;font-size:clamp(14px,3.8vw,16px);font-weight:400;
  line-height:1.6;resize:none;outline:none;transition:border-color .2s,background .3s;touch-action:manipulation;}
textarea::placeholder{color:var(--txt3)}
textarea:focus{border-color:rgba(var(--acc-rgb),0.55)}
.char-c{font-size:clamp(11px,3vw,13px);font-weight:400;color:var(--txt3);
  text-align:right;margin-top:6px;margin-bottom:clamp(18px,5vw,24px);}
.inp-row{display:flex;gap:clamp(9px,2.5vw,12px);margin-bottom:clamp(4px,1.5vw,8px);min-width:0}
.inp{flex:1;min-width:0;height:clamp(50px,14vw,58px);background:var(--inp);border:1px solid var(--bdr);
  border-radius:var(--r-sm);padding:0 clamp(14px,4vw,16px);color:var(--txt);
  font-family:'Roboto',sans-serif;font-size:clamp(14px,3.8vw,16px);font-weight:400;outline:none;
  transition:border-color .2s,background .3s;touch-action:manipulation;}
.inp::placeholder{color:var(--txt3)}
.inp:focus{border-color:rgba(var(--acc-rgb),0.50)}

/* FORM FOOTER */
.form-footer{padding:clamp(12px,3.5vw,16px) clamp(16px,4.5vw,22px);
  background:transparent;border-top:none;flex-shrink:0;}
.btn-send{width:100%;height:clamp(52px,14.5vw,62px);border-radius:var(--r);
  background:var(--acc);border:none;color:#fff;font-family:'Roboto',sans-serif;
  font-size:clamp(15px,4.2vw,17px);font-weight:500;letter-spacing:0.5px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;gap:clamp(8px,2.2vw,12px);
  transition:transform .13s,opacity .13s,background .3s,box-shadow .3s;
  box-shadow:0 6px 24px rgba(var(--acc-rgb),0.32);touch-action:manipulation;}
.btn-send:active{transform:scale(0.97);opacity:0.90}
.btn-send .ic{font-size:clamp(18px,5vw,22px);color:#fff}

/* SUCCESS */
.suc-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:clamp(32px,9vw,52px) clamp(24px,7vw,40px);text-align:center;
  background:var(--bg);transition:background .3s;}
.check-ring{width:clamp(96px,27vw,116px);height:clamp(96px,27vw,116px);border-radius:50%;
  background:rgba(52,199,89,0.08);border:1.5px solid rgba(52,199,89,0.28);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:clamp(26px,7vw,36px);animation:pulse 2.4s ease infinite;}
.check-ring .ic{font-size:clamp(46px,13vw,58px);color:rgba(52,199,89,0.88)}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(52,199,89,0.20)}55%{box-shadow:0 0 0 20px rgba(52,199,89,0)}}
.suc-title{font-family:'Roboto Condensed',sans-serif;font-size:clamp(28px,8vw,36px);font-weight:700;
  color:var(--txt);margin-bottom:clamp(10px,3vw,14px);}
.suc-msg{font-size:clamp(14px,3.8vw,16px);font-weight:400;color:var(--txt2);line-height:1.75;
  max-width:min(280px,82vw);margin:0 auto clamp(22px,6vw,30px);}
.suc-stars{display:flex;gap:clamp(6px,1.8vw,10px);justify-content:center;margin-bottom:clamp(28px,8vw,38px)}
.btn-acc{width:100%;max-width:min(320px,88vw);height:clamp(52px,14.5vw,60px);
  border-radius:var(--r);background:var(--acc);border:none;color:#fff;
  font-family:'Roboto',sans-serif;font-size:clamp(14px,4vw,16px);font-weight:500;letter-spacing:0.4px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:transform .13s,background .3s,box-shadow .3s;
  box-shadow:0 6px 24px rgba(var(--acc-rgb),0.30);touch-action:manipulation;}
.btn-acc:active{transform:scale(0.97)}
.btn-ghost{margin-top:clamp(10px,3vw,14px);width:100%;max-width:min(320px,88vw);
  height:clamp(48px,13.5vw,56px);border-radius:var(--r);
  background:var(--surface);border:1px solid var(--bdr);color:var(--txt2);
  font-family:'Roboto',sans-serif;font-size:clamp(13px,3.6vw,15px);font-weight:400;
  cursor:pointer;display:flex;align-items:center;justify-content:center;gap:clamp(7px,2vw,10px);
  transition:background .3s,border-color .3s;touch-action:manipulation;}
.btn-ghost .ic{font-size:clamp(18px,5vw,21px)}

/* HISTORY CARDS */
.r-card{background:var(--surface);border:1px solid var(--bdr);
  border-radius:clamp(14px,4vw,18px);padding:clamp(15px,4.5vw,20px);
  margin-bottom:clamp(10px,3vw,14px);transition:background .3s,border-color .3s;box-shadow:var(--sh);}
.rc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:clamp(10px,3vw,14px)}
.rc-stars{display:flex;gap:3px}
.rc-date{font-size:clamp(11px,3vw,13px);font-weight:400;color:var(--txt3)}
.rc-badge{display:inline-flex;align-items:center;gap:clamp(5px,1.5vw,7px);
  font-size:clamp(11px,3vw,13px);font-weight:500;letter-spacing:0.3px;
  padding:clamp(4px,1.2vw,6px) clamp(10px,2.8vw,13px);border-radius:100px;margin-bottom:clamp(8px,2.5vw,12px);}
.rc-badge .ic{font-size:clamp(14px,3.8vw,16px)}
.rc-text{font-size:clamp(13px,3.6vw,15px);font-weight:400;color:var(--txt2);line-height:1.65}
.rc-name{font-size:clamp(11px,3vw,13px);font-weight:500;color:var(--txt3);margin-top:clamp(8px,2.5vw,12px)}
.empty-s{display:flex;flex-direction:column;align-items:center;justify-content:center;
  height:100%;min-height:50vh;text-align:center;color:var(--txt3);
  font-size:clamp(14px,3.8vw,16px);font-weight:400;}
.empty-s .ic{font-size:clamp(54px,14.5vw,66px);color:var(--txt3);display:block;margin-bottom:clamp(12px,3.5vw,16px)}

/* SETTINGS */
.sg-lbl{font-size:clamp(10px,2.8vw,12px);font-weight:500;color:var(--txt2);
  text-transform:uppercase;letter-spacing:1.6px;
  margin:clamp(24px,6.5vw,30px) 0 clamp(8px,2.5vw,12px) 2px;}
.sg-lbl:first-child{margin-top:0}
.sg-card{background:var(--surface);border:1px solid var(--bdr);
  border-radius:clamp(14px,4vw,18px);overflow:hidden;
  transition:background .3s,border-color .3s;box-shadow:var(--sh);}
.sr{display:flex;align-items:center;gap:clamp(12px,3.5vw,16px);
  padding:clamp(14px,4vw,18px) clamp(15px,4.5vw,20px);
  border-bottom:1px solid var(--bdr);transition:background .18s;cursor:default;}
.sr:last-child{border-bottom:none}
.sr.tap{cursor:pointer;touch-action:manipulation}
.sr.tap:active{background:var(--surf-h)}
.sr-ico{width:clamp(40px,11vw,46px);height:clamp(40px,11vw,46px);
  border-radius:clamp(10px,3vw,12px);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.sr-ico .ic{font-size:clamp(20px,5.5vw,24px);color:#fff}
.ic0{background:#6A50BE}.ic1{background:#3A7ED8}.ic2{background:#28A07A}
.ic3{background:#C87028}.ic4{background:#C83838}.ic5{background:#6464A0}
.sr-b{flex:1;min-width:0}
.sr-title{font-size:clamp(14px,3.8vw,15px);font-weight:500;color:var(--txt)}
.sr-desc{font-size:clamp(11px,3vw,13px);font-weight:400;color:var(--txt2);margin-top:2px}
.sr-r{display:flex;align-items:center;gap:8px;flex-shrink:0}
.sr-val{font-size:clamp(13px,3.5vw,14px);color:var(--txt2);font-weight:400}
.sr-chev .ic{font-size:clamp(20px,5.5vw,24px);color:var(--txt3)}

/* THEME SEGMENT */
.t-seg{display:flex;background:var(--seg);border-radius:clamp(10px,3vw,13px);padding:clamp(3px,1vw,4px);gap:3px;}
.ts-b{flex:1;height:clamp(36px,10vw,42px);border-radius:clamp(8px,2.5vw,10px);border:none;
  background:transparent;color:var(--txt2);font-family:'Roboto',sans-serif;
  font-size:clamp(12px,3.2vw,14px);font-weight:400;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:clamp(4px,1.2vw,7px);
  transition:background .2s,color .2s;white-space:nowrap;touch-action:manipulation;}
.ts-b .ic{font-size:clamp(16px,4.5vw,19px)}
.ts-b.on{background:var(--seg-on);color:var(--txt);font-weight:500}

/* LANG GRID */
.lang-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(6px,1.8vw,9px);padding:clamp(10px,3vw,14px) clamp(15px,4.5vw,20px) clamp(14px,4vw,18px);}
.lang-btn{padding:clamp(9px,2.5vw,12px) clamp(10px,3vw,14px);border-radius:clamp(10px,3vw,13px);
  background:var(--seg);border:1.5px solid transparent;
  color:var(--txt2);font-family:'Roboto',sans-serif;
  font-size:clamp(13px,3.5vw,14px);font-weight:400;cursor:pointer;
  display:flex;align-items:center;gap:8px;transition:all .18s;touch-action:manipulation;}
.lang-btn .flag{font-size:clamp(18px,5vw,22px);line-height:1}
.lang-btn .lname{flex:1;text-align:left}
.lang-btn .lnative{font-size:clamp(10px,2.8vw,12px);color:var(--txt3)}
.lang-btn.on{background:var(--surface);border-color:var(--acc);color:var(--txt)}
.lang-btn.on .lnative{color:var(--txt2)}
.lang-btn:active{transform:scale(0.97)}

/* ACCENT DOTS */
.acc-d{width:clamp(32px,9vw,38px);height:clamp(32px,9vw,38px);border-radius:50%;
  border:3px solid transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:transform .15s,box-shadow .2s;touch-action:manipulation;}
.acc-d.on{box-shadow:0 0 0 2.5px #fff, 0 0 0 4.5px var(--bdr2)}
[data-theme="dark"] .acc-d.on{box-shadow:0 0 0 2.5px rgba(30,30,50,0.9), 0 0 0 4.5px rgba(255,255,255,0.55)}
.acc-d:active{transform:scale(0.82)}
.acc-d .ic{font-size:clamp(15px,4vw,17px);color:#fff;opacity:0;transition:opacity .15s;
  font-variation-settings:'FILL' 1,'wght' 300,'opsz' 24}
.acc-d.on .ic{opacity:1}

/* TOGGLE */
.tog{width:clamp(48px,13.5vw,54px);height:clamp(28px,7.8vw,30px);border-radius:100px;
  background:var(--tgl);border:none;cursor:pointer;position:relative;flex-shrink:0;
  transition:background .25s;touch-action:manipulation;}
.tog.on{background:var(--acc)}
.tog::after{content:'';position:absolute;
  width:calc(clamp(28px,7.8vw,30px) - 8px);height:calc(clamp(28px,7.8vw,30px) - 8px);
  border-radius:50%;background:#fff;top:4px;left:4px;
  transition:transform .22s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 4px rgba(0,0,0,0.16);}
.tog.on::after{transform:translateX(clamp(20px,5.5vw,24px))}
.ver-note{text-align:center;font-size:clamp(12px,3.2vw,13px);font-weight:400;color:var(--txt3);padding:clamp(24px,7vw,32px) 0 8px}

/* BOTTOM NAV */
.nav{height:calc(var(--nav) + var(--safe));background:var(--bg1);border-top:1px solid var(--bdr);
  display:flex;align-items:flex-start;justify-content:space-around;
  padding-top:clamp(12px,3.2vw,15px);flex-shrink:0;transition:background .3s,border-color .3s;}
.ni{display:flex;flex-direction:column;align-items:center;gap:clamp(5px,1.4vw,7px);
  cursor:pointer;opacity:0.30;transition:opacity .2s;padding:0 clamp(10px,3vw,16px);
  touch-action:manipulation;flex:1;}
.ni.on{opacity:1}
.ni .ic{font-size:clamp(28px,7.8vw,32px);transition:font-variation-settings .2s;}
.ni.on .ic{font-variation-settings:'FILL' 1,'wght' 300,'opsz' 24}
.ni-lbl{font-size:clamp(12px,3.2vw,13px);font-weight:500;color:var(--txt2);white-space:nowrap;letter-spacing:0.2px;}

/* TOAST */
#toast{position:fixed;bottom:calc(var(--nav) + clamp(14px,4vw,20px) + var(--safe));
  left:50%;transform:translateX(-50%) translateY(16px);
  background:rgba(8,8,20,0.92);color:#fff;
  font-size:clamp(13px,3.5vw,15px);font-weight:400;letter-spacing:0.2px;
  padding:clamp(10px,3vw,13px) clamp(18px,5vw,24px);border-radius:100px;
  opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;
  white-space:nowrap;display:flex;align-items:center;gap:clamp(7px,2vw,10px);
  border:1px solid rgba(255,255,255,0.10);max-width:90vw;}
[data-theme="light"] #toast{background:rgba(10,10,26,0.90)}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#toast .ic{font-size:clamp(16px,4.5vw,18px)}
.fi{animation:fi .3s ease forwards}
@keyframes fi{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}