:root{
  --s:1;                 /* stage scale: stage width / 1080 */
  --cream:#FFF8EC; --brown:#5B3B1D; --brown2:#8A5A2B;
  --pink:#FF4FA3; --purple:#8A3FFC; --blue:#3B82F6; --green:#22C55E; --yellow:#FFC400; --orange:#FF7A00; --red:#EF4444; --teal:#14B8A6;
  --font-display:'Fredoka','Nunito','Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic','Hiragino Sans','Noto Sans JP',system-ui,sans-serif;
  --font-body:'Nunito','Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic','Hiragino Sans','Noto Sans JP',system-ui,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none !important}
html,body{height:100%;margin:0;background:#3b1680;overflow:hidden;touch-action:none;overscroll-behavior:none;font-family:var(--font-body);color:var(--brown)}
#page{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(120% 90% at 50% 0%,#8a3ffc 0%,#5b2bd6 45%,#2a0f5e 100%)}
#stage{position:relative;width:100%;height:100%;max-width:min(100vw,calc(100vh * 9 / 16));overflow:hidden;user-select:none;-webkit-user-select:none;box-shadow:0 0 80px rgba(0,0,0,.45)}
@media (min-aspect-ratio: 9/16){ #stage{height:100vh;width:calc(100vh * 9 / 16)} }
@media (min-width:1100px){ #stage{height:min(100vh, 920px);width:calc(min(100vh,920px) * 9 / 16);border-radius:calc(28px * var(--s));} }
canvas#game{position:absolute;inset:0;width:100%;height:100%;display:block}

/* ---------- generic ---------- */
button{font-family:var(--font-display);cursor:pointer;border:0;background:none;color:inherit;padding:0;margin:0}
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:calc(14px*var(--s));
  font-family:var(--font-display);font-weight:700;color:#fff;
  font-size:calc(44px*var(--s));height:calc(112px*var(--s));padding:0 calc(44px*var(--s));
  border-radius:calc(56px*var(--s));
  background:var(--c,#999);
  box-shadow:inset 0 calc(-10px*var(--s)) 0 rgba(0,0,0,.18), inset 0 calc(6px*var(--s)) 0 rgba(255,255,255,.35), 0 calc(8px*var(--s)) calc(18px*var(--s)) rgba(0,0,0,.25);
  text-shadow:0 2px 0 rgba(0,0,0,.25);transition:transform .08s ease, filter .08s ease}
.btn::after{content:"";position:absolute;left:8%;right:8%;top:8%;height:36%;border-radius:999px;background:linear-gradient(#fff,rgba(255,255,255,0));opacity:.55;pointer-events:none}
.btn:active{transform:translateY(calc(4px*var(--s))) scale(.98);filter:brightness(.95)}
.btn:disabled{filter:grayscale(.6) brightness(.85);opacity:.7;cursor:default}
.btn.big{font-size:calc(56px*var(--s));height:calc(136px*var(--s));padding:0 calc(90px*var(--s))}
.btn.small{font-size:calc(28px*var(--s));height:calc(60px*var(--s));padding:0 calc(26px*var(--s))}
.btn.wide{width:calc(620px*var(--s))}
.btn .ic{width:calc(60px*var(--s));height:calc(60px*var(--s));fill:#fff}
.c-pink{--c:var(--pink)} .c-purple{--c:var(--purple)} .c-blue{--c:var(--blue)} .c-green{--c:var(--green)}
.c-yellow{--c:var(--yellow);color:var(--brown);text-shadow:none} .c-orange{--c:var(--orange)} .c-red{--c:var(--red)} .c-teal{--c:var(--teal)} .c-gray{--c:#6b7280}
.icon-btn{width:calc(116px*var(--s));height:calc(116px*var(--s));border-radius:calc(32px*var(--s));background:var(--c,#999);color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:inset 0 calc(-8px*var(--s)) 0 rgba(0,0,0,.18), inset 0 calc(5px*var(--s)) 0 rgba(255,255,255,.35), 0 calc(6px*var(--s)) calc(14px*var(--s)) rgba(0,0,0,.25);
  transition:transform .08s}
.icon-btn:active{transform:scale(.93)}
.icon-btn svg{width:58%;height:58%;fill:#fff;filter:drop-shadow(0 2px 0 rgba(0,0,0,.25))}
.pill{display:inline-flex;align-items:center;gap:calc(10px*var(--s));background:rgba(255,248,236,.95);color:var(--brown);border-radius:999px;
  font-family:var(--font-display);font-weight:700;box-shadow:0 calc(4px*var(--s)) calc(10px*var(--s)) rgba(0,0,0,.2), inset 0 0 0 calc(3px*var(--s)) rgba(91,59,29,.15)}

/* ---------- HUD ---------- */
#hud{position:absolute;inset:0;pointer-events:none}
#hud button{pointer-events:auto}
.topbar{position:absolute;left:calc(20px*var(--s));right:calc(20px*var(--s));top:calc(16px*var(--s));height:calc(150px*var(--s));display:flex;justify-content:space-between;align-items:flex-start}
.tb-left,.tb-right{display:flex;gap:calc(16px*var(--s))}
.tb-center{position:absolute;left:50%;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:calc(6px*var(--s))}
.score{font-family:var(--font-display);font-weight:700;font-size:calc(92px*var(--s));line-height:1;color:#fff;
  text-shadow:0 calc(4px*var(--s)) 0 #5B3B1D, 0 calc(8px*var(--s)) calc(16px*var(--s)) rgba(0,0,0,.35);transition:transform .15s}
.score.punch{transform:scale(1.18)}
.pill.best{height:calc(50px*var(--s));padding:0 calc(22px*var(--s));font-size:calc(34px*var(--s))}
.pill.best .crown{width:calc(38px*var(--s));height:calc(38px*var(--s));fill:#FFB300;stroke:#9c6b00;stroke-width:.8}
.pill.gems{height:calc(58px*var(--s));padding:0 calc(10px*var(--s)) 0 calc(14px*var(--s));font-size:calc(38px*var(--s));pointer-events:auto}
.gem-ic{width:calc(44px*var(--s));height:calc(44px*var(--s))}
.pill.gems .plus{width:calc(52px*var(--s));height:calc(52px*var(--s));border-radius:50%;background:var(--green);color:#fff;font-size:calc(44px*var(--s));font-weight:800;line-height:1;
  box-shadow:inset 0 -4px 0 rgba(0,0,0,.2),inset 0 3px 0 rgba(255,255,255,.4);margin-left:calc(6px*var(--s))}
.row2{position:absolute;left:calc(20px*var(--s));right:calc(20px*var(--s));top:calc(215px*var(--s));height:calc(140px*var(--s));display:flex;justify-content:space-between;align-items:flex-start}
.items{display:flex;gap:calc(16px*var(--s))}
.item{position:relative;width:calc(112px*var(--s));height:calc(112px*var(--s));border-radius:calc(30px*var(--s));background:var(--c);color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:inset 0 calc(-8px*var(--s)) 0 rgba(0,0,0,.18), inset 0 calc(5px*var(--s)) 0 rgba(255,255,255,.35), 0 calc(6px*var(--s)) calc(14px*var(--s)) rgba(0,0,0,.25);transition:transform .08s}
.item:active{transform:scale(.93)} .item:disabled{filter:grayscale(.7);opacity:.6}
.item svg{width:54%;height:54%;fill:#fff;filter:drop-shadow(0 2px 0 rgba(0,0,0,.25))}
.item .cost{position:absolute;left:50%;bottom:calc(-16px*var(--s));transform:translateX(-50%);display:flex;align-items:center;gap:calc(4px*var(--s));
  background:#5B3B1D;color:#fff;border-radius:999px;padding:calc(3px*var(--s)) calc(12px*var(--s));font-size:calc(26px*var(--s));font-family:var(--font-display);white-space:nowrap}
.item .cost img{width:calc(26px*var(--s));height:calc(26px*var(--s))}
.right-tools{display:flex;gap:calc(22px*var(--s));align-items:flex-start}
.tool{display:flex;flex-direction:column;align-items:center;gap:calc(6px*var(--s))}
.tool label{font-family:var(--font-display);font-weight:700;color:#fff;font-size:calc(28px*var(--s));text-shadow:0 2px 0 #5B3B1D}
.auto{width:calc(150px*var(--s));height:calc(64px*var(--s));border-radius:999px;background:#6b7280;color:#fff;font-weight:700;font-size:calc(34px*var(--s));
  box-shadow:inset 0 -6px 0 rgba(0,0,0,.2),inset 0 4px 0 rgba(255,255,255,.35),0 4px 10px rgba(0,0,0,.25);text-shadow:0 2px 0 rgba(0,0,0,.3);transition:background .15s}
.auto.on{background:var(--green)}
.next-circle{width:calc(112px*var(--s));height:calc(112px*var(--s));border-radius:50%;background:rgba(0,0,0,.22);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 calc(4px*var(--s)) rgba(255,255,255,.35)}
.next-circle img{width:72%;height:72%;object-fit:contain;transition:width .15s,height .15s;filter:drop-shadow(0 4px 6px rgba(0,0,0,.3))}
.hint{position:absolute;left:50%;top:calc(420px*var(--s));transform:translateX(-50%);background:rgba(0,0,0,.6);color:#fff;border-radius:calc(28px*var(--s));
  padding:calc(18px*var(--s)) calc(30px*var(--s));display:flex;flex-direction:column;align-items:center;gap:calc(12px*var(--s));font-family:var(--font-display);font-size:calc(40px*var(--s));text-align:center;pointer-events:auto;white-space:nowrap}
.evobar{position:absolute;left:50%;bottom:calc(24px*var(--s));transform:translateX(-50%);width:calc(1000px*var(--s));height:calc(118px*var(--s));
  background:linear-gradient(#3fd6c0,#17a898);border-radius:calc(40px*var(--s));display:flex;align-items:center;justify-content:center;gap:calc(5px*var(--s));padding:0 calc(16px*var(--s));
  box-shadow:inset 0 0 0 calc(10px*var(--s)) rgba(255,255,255,.3), 0 calc(8px*var(--s)) calc(18px*var(--s)) rgba(0,0,0,.3);pointer-events:auto}
.evobar img{object-fit:contain;transition:filter .3s,transform .3s}
.evobar img.locked{filter:brightness(.15) saturate(0) opacity(.75)}
.evobar img.pop{transform:scale(1.35)}

/* ---------- screens / popups ---------- */
.screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column}
#title{background:radial-gradient(90% 70% at 50% 20%,rgba(255,255,255,.18),rgba(0,0,0,0) 60%),rgba(40,10,90,.35)}
.title-card{display:flex;flex-direction:column;align-items:center;gap:calc(26px*var(--s));text-align:center;padding:calc(40px*var(--s))}
.logo-candies{display:flex;gap:calc(10px*var(--s));align-items:flex-end;height:calc(260px*var(--s))}
.logo-candies img{filter:drop-shadow(0 calc(14px*var(--s)) calc(20px*var(--s)) rgba(0,0,0,.4));animation:bob 2.6s ease-in-out infinite}
.logo-candies img:nth-child(2n){animation-delay:-.9s} .logo-candies img:nth-child(3n){animation-delay:-1.7s}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(calc(-18px*var(--s))) rotate(3deg)}}
#title h1{margin:0;font-family:var(--font-display);font-weight:700;font-size:calc(104px*var(--s));line-height:1.02;color:#fff;letter-spacing:-.01em;word-break:keep-all;text-wrap:balance;
  text-shadow:0 calc(5px*var(--s)) 0 #5B3B1D,0 calc(12px*var(--s)) calc(24px*var(--s)) rgba(0,0,0,.4);
  background:linear-gradient(#fff,#ffe8a8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 0 #5B3B1D) drop-shadow(0 10px 18px rgba(0,0,0,.35));text-shadow:none}
.tagline{margin:0;color:#fff;font-size:calc(34px*var(--s));font-weight:700;text-shadow:0 2px 6px rgba(0,0,0,.4);max-width:calc(820px*var(--s));text-wrap:balance}
.title-links{display:flex;gap:calc(40px*var(--s))}
.link{font-family:var(--font-display);font-weight:700;color:#fff;font-size:calc(32px*var(--s));text-decoration:underline;text-underline-offset:4px;opacity:.9}
.title-best{font-family:var(--font-display);color:#ffe8a8;font-size:calc(32px*var(--s));font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.4)}
.home-link{position:absolute;bottom:calc(28px*var(--s));left:50%;transform:translateX(-50%);color:rgba(255,255,255,.75);font-family:var(--font-display);font-weight:700;text-decoration:none;font-size:calc(28px*var(--s))}

#popups{position:absolute;inset:0;pointer-events:none}
.dim{position:absolute;inset:0;background:rgba(10,4,30,.62);display:flex;align-items:center;justify-content:center;pointer-events:auto;animation:fade .18s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
.card{position:relative;width:calc(820px*var(--s));max-height:92%;background:var(--cream);border-radius:calc(56px*var(--s));padding:calc(100px*var(--s)) calc(44px*var(--s)) calc(44px*var(--s));
  box-shadow:0 calc(24px*var(--s)) calc(60px*var(--s)) rgba(0,0,0,.45), inset 0 0 0 calc(10px*var(--s)) rgba(255,255,255,.7);display:flex;flex-direction:column;align-items:center;gap:calc(20px*var(--s));
  animation:popin .22s cubic-bezier(.2,1.4,.4,1);overflow:hidden}
.card.wide{width:calc(940px*var(--s))}
.card .scroll{width:100%;overflow-y:auto;max-height:calc(1100px*var(--s));display:flex;flex-direction:column;align-items:center;gap:calc(16px*var(--s));padding:calc(4px*var(--s))}
@keyframes popin{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}
.ribbon{position:absolute;top:calc(-6px*var(--s));left:50%;transform:translateX(-50%);min-width:calc(440px*var(--s));height:calc(104px*var(--s));padding:0 calc(60px*var(--s));
  display:flex;align-items:center;justify-content:center;border-radius:calc(52px*var(--s));background:var(--c,var(--orange));color:#fff;font-family:var(--font-display);font-weight:700;font-size:calc(50px*var(--s));white-space:nowrap;
  box-shadow:inset 0 calc(-8px*var(--s)) 0 rgba(0,0,0,.18), inset 0 calc(6px*var(--s)) 0 rgba(255,255,255,.35), 0 calc(8px*var(--s)) calc(18px*var(--s)) rgba(0,0,0,.3);text-shadow:0 2px 0 rgba(0,0,0,.3)}
.ribbon::before,.ribbon::after{content:"";position:absolute;top:calc(18px*var(--s));width:calc(50px*var(--s));height:calc(70px*var(--s));background:var(--c,var(--orange));filter:brightness(.75);z-index:-1}
.ribbon::before{left:calc(-28px*var(--s));clip-path:polygon(0 0,100% 0,100% 100%,0 100%,30% 50%)}
.ribbon::after{right:calc(-28px*var(--s));clip-path:polygon(0 0,100% 0,70% 50%,100% 100%,0 100%)}
.close{position:absolute;top:calc(18px*var(--s));right:calc(18px*var(--s));width:calc(92px*var(--s));height:calc(92px*var(--s));border-radius:50%;background:var(--red);color:#fff;font-size:calc(52px*var(--s));font-weight:800;
  display:flex;align-items:center;justify-content:center;box-shadow:inset 0 -6px 0 rgba(0,0,0,.2),inset 0 4px 0 rgba(255,255,255,.4),0 4px 10px rgba(0,0,0,.25);line-height:1}
.card h3{margin:0;font-family:var(--font-display);font-size:calc(40px*var(--s));color:var(--brown)}
.card p{margin:0;font-size:calc(30px*var(--s));line-height:1.45;text-align:center;color:var(--brown2);font-weight:700}
.snap{width:calc(480px*var(--s));height:calc(480px*var(--s));border-radius:calc(28px*var(--s));background:#e8c27a;padding:calc(14px*var(--s));box-shadow:inset 0 0 0 calc(6px*var(--s)) rgba(255,255,255,.5)}
.snap canvas,.snap img{width:100%;height:100%;border-radius:calc(18px*var(--s));display:block;object-fit:cover}
.big-score{font-family:var(--font-display);font-weight:700;font-size:calc(116px*var(--s));line-height:1;color:var(--brown);text-shadow:0 calc(4px*var(--s)) 0 #fff}
.badge-new{display:inline-block;background:var(--red);color:#fff;font-family:var(--font-display);font-weight:700;font-size:calc(28px*var(--s));padding:calc(4px*var(--s)) calc(16px*var(--s));border-radius:999px;transform:rotate(-8deg);box-shadow:0 3px 8px rgba(0,0,0,.3);animation:pulse 1s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:rotate(-8deg) scale(1)}50%{transform:rotate(-8deg) scale(1.12)}}
.row{display:flex;align-items:center;justify-content:center;gap:calc(16px*var(--s));flex-wrap:wrap;width:100%}
.gemrow{display:inline-flex;align-items:center;gap:calc(10px*var(--s));background:#fff;border-radius:999px;padding:calc(8px*var(--s)) calc(26px*var(--s));font-family:var(--font-display);font-weight:700;font-size:calc(36px*var(--s));color:var(--brown);box-shadow:inset 0 0 0 3px rgba(91,59,29,.12)}
.gemrow img{width:calc(44px*var(--s));height:calc(44px*var(--s))}
.list{width:100%;display:flex;flex-direction:column;gap:calc(10px*var(--s))}
.rec{width:100%;display:flex;align-items:center;justify-content:space-between;gap:calc(16px*var(--s));background:rgba(255,255,255,.85);border-radius:calc(22px*var(--s));padding:calc(12px*var(--s)) calc(26px*var(--s));font-family:var(--font-display);font-weight:700;font-size:calc(32px*var(--s));color:var(--brown)}
.rec.top{background:#ffe9a3}
.rec .idx{width:calc(60px*var(--s));flex:none;color:var(--brown2)} .rec .sc{flex:1;text-align:left} .rec .dt{flex:none;font-size:calc(24px*var(--s));color:var(--brown2);font-family:var(--font-body);white-space:nowrap}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(14px*var(--s));width:100%;overflow-y:auto;max-height:calc(1050px*var(--s));padding:calc(4px*var(--s))}
.cell{background:rgba(255,255,255,.85);border-radius:calc(24px*var(--s));padding:calc(14px*var(--s)) calc(8px*var(--s));display:flex;flex-direction:column;align-items:center;gap:calc(6px*var(--s));font-family:var(--font-display);font-weight:700;color:var(--brown);font-size:calc(24px*var(--s));text-align:center}
.cell img{width:calc(140px*var(--s));height:calc(140px*var(--s));object-fit:contain}
.cell img.locked{filter:brightness(.15) saturate(0) opacity(.75)}
.cell small{font-family:var(--font-body);color:var(--brown2);font-size:calc(22px*var(--s))}
.toggle{width:calc(620px*var(--s));justify-content:flex-start;padding-left:calc(40px*var(--s))}
.toggle b{margin-left:auto;background:rgba(0,0,0,.25);border-radius:999px;padding:calc(4px*var(--s)) calc(20px*var(--s));font-size:calc(30px*var(--s))}
.chest{width:calc(260px*var(--s));height:calc(260px*var(--s));object-fit:contain;filter:drop-shadow(0 10px 16px rgba(0,0,0,.35));animation:bob 2s ease-in-out infinite}
.glow{position:absolute;top:calc(60px*var(--s));left:50%;width:calc(520px*var(--s));height:calc(520px*var(--s));transform:translateX(-50%);background:radial-gradient(circle,rgba(255,200,60,.55),rgba(255,200,60,0) 65%);pointer-events:none;animation:spin 8s linear infinite}
@keyframes spin{to{transform:translateX(-50%) rotate(360deg)}}
.timer{font-family:var(--font-display);font-size:calc(40px*var(--s));color:var(--brown)}
.mini-row{display:flex;gap:calc(12px*var(--s));flex-wrap:wrap;justify-content:center}
#toast{position:absolute;left:50%;top:38%;transform:translateX(-50%);background:rgba(0,0,0,.78);color:#fff;border-radius:calc(24px*var(--s));padding:calc(18px*var(--s)) calc(34px*var(--s));font-family:var(--font-display);font-weight:700;font-size:calc(36px*var(--s));white-space:nowrap;pointer-events:none;z-index:50;animation:fade .15s}
.note{font-size:calc(24px*var(--s)) !important;color:var(--brown2) !important;font-weight:600 !important}
.sep{width:70%;height:2px;background:rgba(91,59,29,.12);border-radius:2px}

/* ---------- i18n / polish ---------- */
.result-title{font-family:var(--font-display);font-weight:700;font-size:calc(60px*var(--s));line-height:1;color:var(--brown);text-shadow:0 calc(4px*var(--s)) 0 #fff;letter-spacing:.02em}
:lang(ko) .card p,:lang(ko) .tagline,:lang(ko) .cell,:lang(ko) .hint{word-break:keep-all;overflow-wrap:anywhere}
:lang(ja) .card p{line-break:strict}
.card p{text-wrap:pretty}
:lang(ja){--font-display:'Fredoka','Noto Sans JP','Hiragino Sans','Yu Gothic UI','Meiryo',system-ui,sans-serif;--font-body:'Nunito','Noto Sans JP','Hiragino Sans','Yu Gothic UI','Meiryo',system-ui,sans-serif}

/* ---------- alignment polish ---------- */
.score{transform-origin:50% 100%;transition:none}
.score.punch{transform:none;animation:punch .28s cubic-bezier(.2,1.4,.4,1)}
@keyframes punch{0%{transform:scale(1)}35%{transform:scale(1.16)}100%{transform:scale(1)}}
.tb-center{gap:calc(10px*var(--s))}
.btn,.btn.big{padding-bottom:calc(10px*var(--s))}
.btn.small{padding-bottom:calc(6px*var(--s))}
.icon-btn,.item{padding-bottom:calc(8px*var(--s))}
.auto{padding-bottom:calc(6px*var(--s))}
.toggle{justify-content:center;padding-left:calc(44px*var(--s));padding-right:calc(44px*var(--s))}
.toggle b{position:absolute;right:calc(24px*var(--s));top:50%;transform:translateY(-50%);margin-left:0}
.pill.gems .plus{display:flex;align-items:center;justify-content:center;flex:none;padding:0 0 calc(3px*var(--s))}
.pill.gems .plus svg{width:58%;height:58%;display:block}
.close{padding-bottom:calc(5px*var(--s))}
.close svg{width:44%;height:44%;display:block}
.right-tools{align-items:flex-end}
.tool{height:calc(150px*var(--s));justify-content:flex-end}
.tool .auto{margin-bottom:calc(24px*var(--s))}

/* ---------- spacing polish ---------- */
.card{padding-top:calc(140px*var(--s));padding-bottom:calc(48px*var(--s));gap:calc(24px*var(--s))}
.ribbon{font-size:calc(46px*var(--s));padding:0 calc(52px*var(--s));height:calc(100px*var(--s))}
.close{top:calc(16px*var(--s));right:calc(16px*var(--s));width:calc(84px*var(--s));height:calc(84px*var(--s))}
.card .scroll{max-height:calc(1000px*var(--s))} .grid{max-height:none;overflow:visible}
.card .scroll{scrollbar-width:none} .card .scroll::-webkit-scrollbar{display:none}
.result-title{margin:calc(8px*var(--s)) 0}
.title-card{gap:calc(30px*var(--s))}
.big-score{margin:calc(6px*var(--s)) 0}
.btn small{font-size:.62em;opacity:.8;font-weight:700;margin-left:calc(6px*var(--s))}
.btn.tight{font-size:calc(37px*var(--s))}
#toast{top:calc(385px*var(--s))}