.al-stamps{
  position: fixed;
  top: 29px;
  right: 53px;
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px 6px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.al-stamps-icon{
  width: 56px;
  height: 56px;
  display: block;
  will-change: transform;
}
.al-stamps-num{
  font-family: var(--font-read);
  font-size: 26px;
  font-weight: 800;
  color: #ffc400;
  text-shadow:
    -2px -2px 0 #000,  0 -2px 0 #000,  2px -2px 0 #000,
    -2px  0   0 #000,                  2px  0   0 #000,
    -2px  2px 0 #000,  0  2px 0 #000,  2px  2px 0 #000;
  min-width: 2ch;
  text-align: left;
  will-change: transform;
}
.al-stamps{ position: fixed; }
.al-stamps-run,
.al-stamps-bonus{
  position: absolute;
  right: 14px;
  font-family: var(--font-read);
  font-weight: 800;
  font-size: 72px;                 
  line-height: 1;
  color: #ffc400;                  
  white-space: nowrap;
  text-align: right;
  text-shadow:
    -3px -3px 0 #000,  0 -3px 0 #000,  3px -3px 0 #000,
    -3px  0   0 #000,                  3px  0   0 #000,
    -3px  3px 0 #000,  0  3px 0 #000,  3px  3px 0 #000,
     0    2px 10px rgba(0,0,0,.5);
  pointer-events: none;
}
.al-stamps-run{   top: calc(100% + 8px); }
.al-stamps-bonus{ top: calc(100% + 88px); }
.al-stamps-fly{
  position: fixed;
  width: 56px;
  height: 56px;
  z-index: 61;
  pointer-events: none;
  will-change: transform, opacity;
}
body[data-mode="passport"] .al-stamps{ display:none; }
.al-power {
  position: fixed;
  z-index: 61;                      
  pointer-events: none;             
}
.al-power-track,
.al-power-keybar {
  position: relative;
  height: var(--pw-h, 15px);
  border-radius: 999px;
  background: rgba(0,0,0,.38);
  border: 3px solid rgba(255,255,255,.92);          
  box-shadow: inset 0 2px 0 rgba(0,0,0,.28);
}
.al-power-keybar {
  width: calc(100% - 14px);
  flex: 0 0 auto;
}
.al-power-clip {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  overflow: hidden;
}
.al-power-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--pw-c1, #d96fb0), var(--pw-c2, #ffdc6b));
  transition: width .5s cubic-bezier(.65,0,.35,1), background .5s linear;
}
.al-power-glow {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  pointer-events: none;
  opacity: 0;
  box-shadow: 0 0 8px 3px var(--pw-glow, rgba(255,201,77,.9)),
              0 0 20px 8px var(--pw-glow, rgba(255,201,77,.9)),
              0 0 40px 18px var(--pw-glow2, rgba(255,201,77,.45));
  will-change: opacity;
}
.is-full .al-power-glow {
  animation: alPowerBreathe var(--pw-shine, 2400ms) ease-in-out infinite;
}
@keyframes alPowerBreathe { 0%, 100% { opacity: 0; } 50% { opacity: 1; } }
.al-power-sheen {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  background: linear-gradient(105deg, rgba(255,255,255,0) 35%, rgba(255,255,255,.9) 50%,
                                      rgba(255,255,255,0) 65%);
  transform: translateX(-130%);
  will-change: transform;
}
.is-full .al-power-sheen {
  animation: alPowerShine var(--pw-shine, 2400ms) linear infinite;
}
@keyframes alPowerShine { from { transform: translateX(-130%); } to { transform: translateX(130%); } }
.al-power-twirl {
  position: absolute;
  width: 56px;
  height: 56px;
  transform-origin: 0 0;
  pointer-events: none;
  opacity: 0;
}
.al-power-ready .al-power-twirl { opacity: 1; }
.al-power-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2.5px solid #ffd76e;
  opacity: 0;
  will-change: transform, opacity;
}
.al-power-orbit {
  position: absolute;
  inset: -12px;
  will-change: transform;
}
.al-power-spark {
  position: absolute;
  width: 11px;
  height: 11px;
  margin: -5.5px;
  background: #fff6c8;
  clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%,
                     50% 70%, 21% 91%, 32% 57%,  2% 35%, 39% 35%);
}
.al-power-spark:nth-child(1) { left: 50%;  top: 0; }
.al-power-spark:nth-child(2) { left: 100%; top: 50%; }
.al-power-spark:nth-child(3) { left: 50%;  top: 100%; }
.al-power-spark:nth-child(4) { left: 0;    top: 50%; }
.al-power-ready .al-power-ring  { animation: alPowerRing var(--pw-shine, 2400ms) ease-out infinite; }
.al-power-ready .al-power-ring.two { animation-delay: calc(var(--pw-shine, 2400ms) / -2); }
.al-power-ready .al-power-orbit { animation: alPowerOrbit var(--pw-shine, 2400ms) linear infinite; }
@keyframes alPowerRing  { 0% { transform: scale(.55); opacity: .95; } 100% { transform: scale(1.75); opacity: 0; } }
@keyframes alPowerOrbit { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .al-power-ready .al-power-ring, .al-power-ready .al-power-orbit { animation: none; }
}
body.al-tally-open .al-power { z-index: 99600; }
body[data-mode="passport"]:not(.al-tally-open) .al-power { display: none; }
body[data-mode="calendar"]:not(.app-covered):not(.al-tally-open) .al-power { opacity: 0; transition: opacity .4s; }
#menu-drawer .mi-builder { --face: linear-gradient(202deg,#C9F0FF,#79CFF0); --edge: #3E92B8; }
#menu-drawer .mi-builder .menu-item { gap: 3px; padding-top: 5px; padding-bottom: 5px; }
.al-power-keyrow {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.al-power-keyrow img { width: 26px; height: 26px; display: block; }
.al-power-keynum {
  font-family: var(--font-read);
  font-size: 17px;
  font-weight: 800;
  color: #ffc400;
  text-shadow: -1.5px -1.5px 0 #000,  1.5px -1.5px 0 #000,
               -1.5px  1.5px 0 #000,  1.5px  1.5px 0 #000;
}
.al-tally-sparks {
  position: absolute;
  width: 56px;
  height: 56px;
  pointer-events: none;
  z-index: 4;
}
body:not(.menu-open) #mi-builder .al-power-glow,
body:not(.menu-open) #mi-builder .al-power-sheen,
body:not(.menu-open) #mi-builder .al-power-ring,
body:not(.menu-open) #mi-builder .al-power-orbit{ animation-play-state: paused !important; }
:root {
  --star-ink:  #3a2a00;    
  --star-gold: #ffc400;    
  --star-beat: 2900ms;     
}
.al-star {
  position: absolute;
  z-index: 4;
  pointer-events: none;                 
  width: auto;
  height: auto;
}
.al-star .ribbon {
  display: flex;
  align-items: center;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,.4));
  transform: rotate(-8deg);
  animation: alStarBeat var(--star-beat) ease-in-out infinite;
}
.al-star .star-shape {
  position: relative;
  flex: none;
  width: calc(var(--ss, 17px) * 1.4);
  height: calc(var(--ss, 17px) * 1.4);
  background: url(../assets/stamps/stamp-plain-256.png) center / contain no-repeat;
}
.al-star .star-shape + .star-shape { margin-left: calc(var(--ss, 17px) * -.76); }   
.al-star .star-shape:nth-child(1) { z-index: 3; }
.al-star .star-shape:nth-child(2) { z-index: 2; }
.al-star .star-shape:nth-child(3) { z-index: 1; }
.al-star .star-shape::before {
  content: "";
  position: absolute;
  left: 27%; top: 27%; width: 46%; height: 46%;
  background: #ffd21f;
  clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%,
                     50% 70%, 21% 91%, 32% 57%,  2% 35%, 39% 35%);
}
@keyframes alStarBeat {
  0%, 100% { transform: rotate(-8deg) scale(1); }
  50%      { transform: rotate(-8deg) scale(1.09); }
}
.al-star.is-pop {
  transform-origin: 50% 50%;
  animation: alStarPop .42s ease-in both;   
}
@keyframes alStarPop {
  0%   { transform: scale(1);   animation-timing-function: ease-out; }
  30%  { transform: scale(1.45); animation-timing-function: ease-in; }
  100% { transform: scale(0); }
}
@media (prefers-reduced-motion: reduce) { .al-star .ribbon { animation: none; } }
.act-btn { position: relative; }
.act-btn .al-star { --ss: 17px; left: -10px; top: -10px; }
#vp-btn-name, #vp-btn-sound, #vp-btn-sentence { position: relative; }
#vp-btns .al-star { --ss: 17px; left: -10px; top: -10px; }
#mode-calendar .cal-banner .cal-month { position: relative; }
#mode-calendar .cal-month .al-star { --ss: 22px; right: -8px; top: -8px; }
#mode-calendar .cal-wd { position: relative; overflow: visible; }
#mode-calendar .cal-wd .al-star { --ss: 13px; right: -1px; top: -1px; }
.pp-slot.pp-noart::before { content:""; position:absolute; inset:14px; border:4px solid #8a7c5c; border-radius:10px;
  transform:rotate(var(--tilt,0deg)); }
.pp-slot.pp-noart .pp-q { display:none; }
#legend-sheet {
  position:fixed; inset:0; z-index:98000; display:none;
  background-color:#FFF6E3; color:#4a3a1c;   
  -webkit-user-select:none; user-select:none; -webkit-tap-highlight-color:transparent;
}
#legend-sheet { --lg-band:18.5%; --lg-show:5.5; }
#legend-sheet .lg-body {
  position:absolute; left:128px; padding-left:12px; right:calc(2.2vw + 34px); top:var(--lg-band); bottom:0;   
  display:flex; flex-direction:column;
  overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; touch-action:pan-y; scrollbar-width:none;
  padding-bottom:1.6vh; box-sizing:border-box;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 16px, #000 calc(100% - 13vh), rgba(0,0,0,.18) calc(100% - 1.5vh), transparent 100%);
          mask-image:linear-gradient(to bottom, transparent 0, #000 16px, #000 calc(100% - 13vh), rgba(0,0,0,.18) calc(100% - 1.5vh), transparent 100%);
}
#legend-sheet .lg-body::-webkit-scrollbar { display:none; }
#legend-sheet .lg-vtrack {
  position:absolute; right:1.1vw; top:calc(var(--lg-band) + 1.4vh); bottom:2.2vh; width:2.6vh; min-width:18px; z-index:2;
  border-radius:1.3vh; background:#D3F3E1; touch-action:none; overflow:hidden;   
}
#legend-sheet .lg-vtrack i {
  position:absolute; left:0; right:0; top:0; height:30%; border-radius:1.3vh; z-index:1;
  background:linear-gradient(90deg,#62DB9C,#2FB56F); box-shadow:inset -3px 0 0 #1E8F54;
}
#legend-sheet .lg-track b, #legend-sheet .lg-vtrack b { position:absolute; inset:0; pointer-events:none; opacity:.95; }
#legend-sheet .lg-track b { background-repeat:repeat-x; background-size:auto 100%; background-position:left center; }
#legend-sheet .lg-track b.lg-a { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2014%2014%22%3E%3Cpath%20d%3D%22M9%202.5%20L4.5%207%20L9%2011.5%22%20fill%3D%22none%22%20stroke%3D%22%236FA8F5%22%20stroke-width%3D%222.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E"); clip-path:inset(0 100% 0 0); }
#legend-sheet .lg-track b.lg-b { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2014%2014%22%3E%3Cpath%20d%3D%22M5%202.5%20L9.5%207%20L5%2011.5%22%20fill%3D%22none%22%20stroke%3D%22%236FA8F5%22%20stroke-width%3D%222.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E"); clip-path:inset(0 0 0 100%); }
#legend-sheet .lg-vtrack b { background-repeat:repeat-y; background-size:100% auto; background-position:center top; }
#legend-sheet .lg-vtrack b.lg-a { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2014%2014%22%3E%3Cpath%20d%3D%22M2.5%209%20L7%204.5%20L11.5%209%22%20fill%3D%22none%22%20stroke%3D%22%234FBF86%22%20stroke-width%3D%222.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E"); clip-path:inset(0 0 100% 0); }
#legend-sheet .lg-vtrack b.lg-b { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2014%2014%22%3E%3Cpath%20d%3D%22M2.5%205%20L7%209.5%20L11.5%205%22%20fill%3D%22none%22%20stroke%3D%22%234FBF86%22%20stroke-width%3D%222.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E"); clip-path:inset(100% 0 0 0); }
#legend-sheet .lg-views {
  position:absolute; left:140px; right:2.2vw; top:0; height:var(--lg-band); z-index:1;
  display:flex; align-items:center; justify-content:center; gap:7vw; --vk:1; --pair:420px;
  padding-top:6px; box-sizing:border-box;   
}
#legend-sheet .lg-views::before {
  content:''; position:absolute; left:50%; top:3px; bottom:4px; z-index:-1; pointer-events:none;
  width:min(calc(var(--pair) * 1.75), 100%); transform:translateX(-50%);
  border-radius:28px; background:linear-gradient(#E9FBF3,#B9EFD6);
  border:3px solid #fff; box-shadow:0 5px 0 #86D3B1, 0 9px 16px rgba(40,120,90,.18);
}
#legend-sheet .lg-vslot {
  position:relative; flex:0 0 auto; display:flex; flex-direction:column; align-items:stretch; gap:13px;
  transform:scale(var(--vk)); transform-origin:center center;
}
#legend-sheet .lg-vkey,
#legend-sheet .lg-vkey:hover,
#legend-sheet .lg-vkey:active { transform:none; animation:none; }
#legend-sheet .lg-vkey {
  min-width:112px; margin:0; cursor:pointer; touch-action:manipulation;
  transition:box-shadow .2s ease, filter .2s ease, opacity .2s ease;
  filter:saturate(.72); opacity:.86;                 
}
#legend-sheet .lg-vkey.lg-von {                       
  filter:brightness(1.07) saturate(1.08); opacity:1;
  box-shadow:-2.5px 6px 0 var(--edge), 0 0 0 4px #fff, 0 0 0 8px var(--edge), 0 0 20px 10px rgba(255,205,70,.85),
             inset 1px 2px 0 rgba(255,255,255,.8), inset -1px -3px 0 rgba(0,0,0,.10);
}
#legend-sheet .lg-vbar {
  display:block; height:9px; border-radius:5px; background:rgba(120,90,30,.18); overflow:hidden;
  box-shadow:0 0 0 2px rgba(255,255,255,.85);
}
#legend-sheet .lg-vbar b { display:block; height:100%; width:0; border-radius:5px; background:#3DBE7B; transition:width .3s ease; }
#legend-sheet .lg-cbar {
  position:absolute; left:8%; right:8%; top:calc(100% + 8px); height:4px; border-radius:2px;
  background:rgba(120,90,30,.18); overflow:hidden; pointer-events:none; transition:opacity .2s ease;
}
#legend-sheet .lg-cbar b { display:block; height:100%; width:0; background:#3DBE7B; border-radius:2px; transition:width .3s ease; }
#legend-sheet .lg-chip, #legend-sheet .lg-side, #legend-sheet .lg-grid, #legend-sheet .lg-row { transition:opacity .2s ease; }
#legend-sheet .lg-row.lg-na { display:none; }
#legend-sheet.lg-leaving .lg-row.lg-na { display:flex; opacity:0; pointer-events:none; }
#legend-sheet .lg-grid.lg-na { opacity:0; pointer-events:none; }
#legend-sheet .lg-row { flex:0 0 calc(100% / var(--lg-show)); min-height:0; display:flex; align-items:center; gap:1.6vw; padding:.5vh 0; box-sizing:border-box; }
#legend-sheet .lg-chip {
  position:relative; flex:0 0 auto; height:76%; aspect-ratio:1 / 1; border-radius:24%; border:0; margin:0; padding:0;
  background:var(--face); box-shadow:-2px 6px 0 var(--edge);
  display:flex; align-items:center; justify-content:center;
}
#legend-sheet .lg-chip span {
  width:60%; height:60%; border-radius:50%; background:rgba(255,255,255,.92);
  display:flex; align-items:center; justify-content:center; font-size:3.4vh; line-height:1;
}
#legend-sheet .lg-side { flex:1 1 0; min-width:0; height:100%; display:flex; flex-direction:column; }
#legend-sheet .lg-strip {
  flex:1 1 0; min-height:0; display:flex; align-items:center; gap:1.1vw;
  overflow-x:auto; overflow-y:hidden; padding:0 .4vw .9vh .4vw;
  -webkit-overflow-scrolling:touch; scrollbar-width:none; touch-action:pan-x pan-y;   
}
#legend-sheet .lg-strip::-webkit-scrollbar { display:none; }
#legend-sheet .lg-pic {
  position:relative; flex:0 0 auto; height:88%; aspect-ratio:1 / 1; margin:0; padding:0; border:0;
  border-radius:20%; background:#fff; overflow:hidden; font-family:var(--font-read);
  box-shadow:-2px 5px 0 rgba(120,90,30,.24);
  transition:background-color .2s ease, box-shadow .2s ease;   
}
#legend-sheet .lg-pic.lg-held { transform:translateY(4px); box-shadow:-1px 1px 0 rgba(120,90,30,.24); }
#legend-sheet .lg-pic > img { width:100%; height:100%; object-fit:contain; display:block; padding:6%; box-sizing:border-box;
  filter:grayscale(0) opacity(1); transition:filter .2s ease; }
#legend-sheet .lg-pic.lg-todo { background:#F3EAD6; box-shadow:-2px 5px 0 rgba(120,90,30,.12); }
#legend-sheet .lg-pic.lg-todo > img { filter:grayscale(1) opacity(.38); }
#legend-sheet .lg-tick {
  position:absolute; right:5%; bottom:5%; width:30%; height:30%; border-radius:50%;
  background:#3DBE7B; box-shadow:0 0 0 3px #fff; opacity:1; transition:opacity .2s ease;
}
#legend-sheet .lg-tick:after {
  content:""; position:absolute; left:34%; top:16%; width:26%; height:50%;
  border:solid #fff; border-width:0 .55vh .55vh 0; transform:rotate(42deg);
}
#legend-sheet .lg-todo .lg-tick { opacity:0; }
#legend-sheet .lg-num { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; transition:opacity .2s ease; }
#legend-sheet .lg-num b { font-size:3.7vh; font-weight:800; line-height:1; color:#6F4A24; letter-spacing:-.02em; }
#legend-sheet .lg-todo .lg-num { opacity:.38; }
#legend-sheet .lg-paint { position:absolute; inset:17%; border-radius:50%; background:var(--paint);
  box-shadow:inset -.5vh -.6vh 0 rgba(0,0,0,.12), inset .4vh .5vh 0 rgba(255,255,255,.35), 0 0 0 2px rgba(120,90,30,.22);
  filter:grayscale(0) opacity(1); transition:filter .2s ease; }
#legend-sheet .lg-todo .lg-paint { filter:grayscale(.15) opacity(.42); }
#legend-sheet .lg-chip span img { width:74%; height:74%; object-fit:contain; display:block; }
#legend-sheet .lg-grid .lg-num b { font-size:calc(var(--cell) * .5); }
#legend-sheet .lg-cal { position:absolute; inset:0; display:block; }
#legend-sheet .lg-cal:before { content:""; position:absolute; left:0; right:0; top:0; height:26%; background:#E5484D; transition:background-color .2s ease; }
#legend-sheet .lg-cal:after {
  content:""; position:absolute; top:7%; left:22%; width:56%; height:12%;
  background:
    radial-gradient(circle closest-side,#fff 0 88%,transparent 96%) 8% 50% / 21.4% 100% no-repeat,
    radial-gradient(circle closest-side,#fff 0 88%,transparent 96%) 92% 50% / 21.4% 100% no-repeat;
}
#legend-sheet .lg-cal svg { position:absolute; left:22%; top:32%; width:56%; height:56%; filter:grayscale(0); opacity:1; transition:filter .2s ease, opacity .2s ease; }
#legend-sheet .lg-cal b {
  position:absolute; left:0; right:0; top:26%; bottom:26%; display:flex; align-items:center; justify-content:center;
  font-size:2.7vh; font-weight:700; color:#4a3a1c;   
  transition:opacity .2s ease;
}
#legend-sheet .lg-todo .lg-cal:before { background:#C9BFA9; }
#legend-sheet .lg-todo .lg-cal svg { filter:grayscale(1); opacity:.38; }
#legend-sheet .lg-todo .lg-cal b { opacity:.4; }
#legend-sheet .lg-track {
  position:relative; flex:0 0 auto; height:2.4vh; min-height:16px; border-radius:1.2vh;
  background:#D6E8FF; touch-action:none; overflow:hidden;
}
#legend-sheet .lg-track i {
  position:absolute; top:0; bottom:0; left:0; width:30%; border-radius:1.2vh; z-index:1;
  background:linear-gradient(180deg,#5FB0FF,#2F7FF0); box-shadow:inset 0 -3px 0 #1F5FC4;
}
.mi-legend { --face:linear-gradient(202deg,#C9E7A0,#9CCB4A); --edge:#6B9A22 }
#legend-sheet.lg-big-on .lg-side { visibility:hidden; }
#legend-sheet.lg-big-on .lg-side .lg-track { visibility:hidden !important; }
#legend-sheet .lg-chip.lg-on { box-shadow:0 0 0 5px var(--edge); }
#legend-sheet .lg-grid {
  --cell:150px; --gap:18px;
  position:absolute; left:240px; right:0; top:var(--lg-band); bottom:0; padding:1.6vh 0 3vh 0; box-sizing:border-box; scrollbar-width:none;
  display:none; grid-template-columns:repeat(5, var(--cell)); grid-auto-rows:auto; gap:2.4vh var(--gap); align-content:start;
  overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; touch-action:pan-y;
}
#legend-sheet .lg-grid .lg-pic { height:var(--cell); width:100%; aspect-ratio:auto; }
#legend-sheet .lg-grid .lg-cal b { font-size:calc(var(--cell) * .27); }
#legend-sheet .lg-grid .lg-tick:after { border-width:0 1vh 1vh 0; }
#legend-sheet .lg-grid::-webkit-scrollbar { display:none; }
#menu-drawer.has-hello { padding-top: 0; }
#menu-drawer .menu-hello {
  --hello-gap: calc(max(env(safe-area-inset-top, 0px), 20px) + 2px);   
  --hello-yellow: #FFD400; --hello-yellow-edge: #B29400;                
  --hello-mint-a: #5CF2B8; --hello-mint-b: #19C98A;                     
  font-family: var(--font-read);
  font-weight: 800;
  font-size: clamp(20px, 3.4vh, 28px);                                  
  line-height: 1.15;
  color: #FFF6DC;
  text-align: center;
  padding: var(--hello-gap) 8px var(--hello-gap);
  margin: 0;
  white-space: nowrap; min-width: 0;
}
#menu-drawer .menu-hello .mh-plank {
  position: relative; display: inline-block; max-width: 100%; box-sizing: border-box;
  background: linear-gradient(180deg, #D9A066 0, #C98A4B 45%, #B47A3E 100%);
  border: 2px solid #7A4A1C; border-radius: .45em;
  padding: .14em 1.2em .2em;
  box-shadow: 0 4px 0 #6B3F15, 0 7px 8px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.35);
  vertical-align: middle;
}
#menu-drawer .menu-hello .mh-plank::before, #menu-drawer .menu-hello .mh-plank::after {   
  content: ''; position: absolute; top: 50%; width: .32em; height: .32em; border-radius: 50%;
  background: #4A2E06; box-shadow: inset 0 1px 0 #9A7A50; transform: translateY(-50%); z-index: 2;
}
#menu-drawer .menu-hello .mh-plank::before { left: .45em; }
#menu-drawer .menu-hello .mh-plank::after  { right: .45em; }
#menu-drawer .menu-hello .mh-wgrain {      
  position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: repeating-linear-gradient(180deg, rgba(0,0,0,0) 0 .28em, rgba(0,0,0,.06) .28em .34em);
}
#menu-drawer .menu-hello .mh-in { display: block; position: relative; padding: 0 .1em; overflow: hidden; text-overflow: ellipsis; }
#menu-drawer .menu-hello .menu-hello-word {
  color: var(--hello-yellow); paint-order: stroke fill;
  -webkit-text-stroke: 1px var(--hello-yellow-edge); text-shadow: 0 1px 0 rgba(0,0,0,.35);
}
#menu-drawer .menu-hello .menu-hello-name {   
  font-weight: inherit; color: transparent;
  background: linear-gradient(135deg, var(--hello-mint-a), var(--hello-mint-b));
  -webkit-background-clip: text; background-clip: text;
}
#menu-drawer .menu-item.mi-big { padding:calc(var(--tile-h) * .06) 6px; overflow:hidden; }
#menu-drawer .menu-item.mi-big .mi-label { flex:0 0 auto; font-size:calc(var(--tile-h) * .1803); }
.mi-pic {
  --ph:calc(var(--tile-h) * .66);
  position:relative; flex:0 0 auto; display:flex; align-items:center; justify-content:center;
  height:var(--ph); width:calc(var(--ph) * var(--ar,1.3)); max-width:100%; pointer-events:none;
  transform:translate(var(--dx,0%), var(--dy,0%)) scale(var(--sz,1));
}
.mi-pic img, .mi-pic svg { display:block; max-width:100%; max-height:100%; object-fit:contain; }
.mi-pic > svg { height:100%; width:auto; }
.mi-pic .mi-pop { filter:drop-shadow(0 1.5px 1px rgba(0,0,0,.28)); }
.mi-pic.mi-char { --ar:1; font-size:calc(var(--ph) * .84); line-height:1; }
.mi-pic .mi-grp { position:relative; display:block; width:100%; height:100%; }
.mi-pic .mi-grp > img {
  position:absolute; width:auto; max-width:none; max-height:none;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.25));
}
.mi-pic .mi-123 text { font-family:var(--font-read); font-weight:700; font-size:54px; }
.mi-pic .mi-house { display:block; height:100%; filter:drop-shadow(0 2px 1px rgba(0,0,0,.3)); }
.mi-pic .mi-house > span {
  display:block; height:100%; aspect-ratio:1245/778;
  background:url(../assets/images/household/house-base-k10.webp) 52.98% 38.99% / 160.64% auto no-repeat;
  clip-path:polygon(3.2% 98.7%,3.2% 66.6%,0.8% 65.9%,9.6% 55.7%,10% 38.3%,7.1% 36.8%,15.9% 12.9%,
    24.1% 12.3%,31.3% 0.8%,38.6% 8.7%,45% 12.3%,62.5% 12%,62.5% 3.9%,69.6% 3.9%,69.6% 12%,
    74.1% 12.6%,78.6% 33.2%,76.5% 36.8%,76.5% 48.6%,99.4% 62.1%,97.8% 64.3%,97.8% 93.8%,76.5% 98.7%);
}
body.al-sharp-1x .mi-pic .mi-house > span { background-image:url(../assets/sharp/images/household/house-base-k10.webp); }
#menu-drawer .mi-builder .menu-item { padding-top:calc(var(--tile-h) * .06); padding-bottom:calc(var(--tile-h) * .06); }
#menu-drawer .mi-builder .mi-label { font-size:calc(var(--tile-h) * .1803); }
#menu-drawer .al-power-keyrow img { width:calc(var(--tile-h) * .39); height:calc(var(--tile-h) * .39); }
#menu-drawer .al-power-keynum { font-size:calc(var(--tile-h) * .265); line-height:1; }
#menu-drawer .mi-legend  { --face:linear-gradient(202deg,#FFD6EC,#FF94CB); --edge:#C9589A }
#menu-drawer .mi-numbers { --face:linear-gradient(202deg,#FFFFFF,#E6ECF4); --edge:#9AA7B8 }
.mi-animals   .mi-pic { --sz:1.24; }
.mi-household .mi-pic { --sz:1.06; --dy:4%; }
.mi-town      .mi-pic { --sz:1.08; --dy:8%; }
.mi-market    .mi-pic { --sz:1.14; --dy:6%; }
.mi-calendar  .mi-pic { --sz:1.12; --dy:6%; }
.mi-colors    .mi-pic { --sz:1.14; --dy:7%; }
.mi-numbers   .mi-pic { --sz:1.12; --dy:3%; }
.mi-countries .mi-pic { --sz:1.08; --dy:6%; }
.mi-landmarks .mi-pic { --sz:1.08; --dy:4%; }
.mi-passport  .mi-pic { --sz:1.06; --dy:6%; }
.mi-legend    .mi-pic { --sz:1.02; --dy:7%; }
.mi-game      .mi-pic { --sz:1.28; --dy:-2%; }
.mi-settings  .mi-pic { --sz:1.06; --dy:5%; }
.mi-language  .mi-pic { --sz:1.24; --dy:6%; }
.al-unlock {
  position: absolute;
  inset: 0;
  z-index: 90;
  pointer-events: none;          
}
.al-unlock-stamp {
  position: absolute;
  left: 50%;
  top: 96px;
  width: 150px;
  height: 150px;
  transform: translateX(-50%);
  opacity: 0;
  z-index: 4;
}
.al-unlock-stamp img { width: 100%; height: 100%; object-fit: contain; }
.al-unlock-grid {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  gap: 18px;
  justify-items: center;
  align-items: center;
  z-index: 5;
}
.al-unlock-win {
  position: relative;
  width: 120px;
  height: 120px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;                    
  background-image: linear-gradient(202deg, rgba(255,255,255,.62) 0%, rgba(255,255,255,.30) 30%,
                                            rgba(255,255,255,.05) 52%, rgba(255,255,255,0) 64%),
                    linear-gradient(202deg, #FFE9AE, #FFD070);
  box-shadow: -2.5px 6px 0 #C69218, -4px 10px 18px rgba(0,0,0,.3),
              inset 1px 2px 0 rgba(255,255,255,.8);
}
.al-unlock-win img { width: 86%; height: 86%; object-fit: contain; display: block; }
.al-unlock-win.is-drawer {
  background-image: linear-gradient(202deg, rgba(255,255,255,.62) 0%, rgba(255,255,255,.30) 30%,
                                            rgba(255,255,255,.05) 52%, rgba(255,255,255,0) 64%),
                    linear-gradient(202deg, #b6ff5c, #4fe01e);
  box-shadow: -2.5px 6px 0 #2f9a0c, -4px 10px 18px rgba(0,0,0,.3),
              inset 1px 2px 0 rgba(255,255,255,.8);
}
.al-unlock-win.is-dance {
  background-image: linear-gradient(#2b3566, #1b2246);
  border: 2px solid #4de0d8;
  box-shadow: 0 3px 0 #101634, 0 5px 12px rgba(0,0,0,.45);
}
.al-unlock-win .four {
  width: 92%;
  height: 92%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: 1fr;
  gap: 4px;
  place-items: center;
  place-content: center;
}
.al-unlock-win .four img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.al-unlock-win .four.one { grid-template-columns: 1fr; }
.al-unlock-win .four img:nth-child(3):last-child {
  grid-column: 1 / -1;
  width: 50%;
  justify-self: center;
}
.al-unlock-win.glow { animation: alUnlockGlow 1.8s ease-in-out infinite; }
@keyframes alNewRing {
  0%, 100% { box-shadow: 0 3px 0 #101634, 0 0 0 4px #ffc94d, 0 0 14px 2px rgba(255,201,77,.55); }
  50%      { box-shadow: 0 3px 0 #101634, 0 0 0 4px #ffc94d, 0 0 26px 8px rgba(255,201,77,.95); }
}
@keyframes alUnlockGlow {
  0%, 100% { box-shadow: -2.5px 6px 0 #C69218, 0 0 0 4px #ffc94d,
                         0 0 14px 2px rgba(255,201,77,.55); }
  50%      { box-shadow: -2.5px 6px 0 #C69218, 0 0 0 4px #ffc94d,
                         0 0 26px 8px rgba(255,201,77,.95); }
}
.al-unlock-win.is-drawer.glow { animation-name: alUnlockGlowGreen; }
@keyframes alUnlockGlowGreen {
  0%, 100% { box-shadow: -2.5px 6px 0 #2f9a0c, 0 0 0 4px #ffc94d,
                         0 0 14px 2px rgba(255,201,77,.55); }
  50%      { box-shadow: -2.5px 6px 0 #2f9a0c, 0 0 0 4px #ffc94d,
                         0 0 26px 8px rgba(255,201,77,.95); }
}
.al-unlock-win.is-dance.glow { animation-name: alUnlockGlowDance; }
@keyframes alUnlockGlowDance {
  0%, 100% { box-shadow: 0 3px 0 #101634, 0 0 0 4px #ffc94d,
                         0 0 14px 2px rgba(255,201,77,.55); }
  50%      { box-shadow: 0 3px 0 #101634, 0 0 0 4px #ffc94d,
                         0 0 26px 8px rgba(255,201,77,.95); }
}
body.al-unlock-busy .pp-close,
body.al-unlock-busy #passport-stage .al-game-close,
body.al-unlock-busy .al-tally-leave,
body.al-unlock-busy .al-avatar-close,
body.al-unlock-busy #menu-btn {
  opacity: .3;
  pointer-events: none;
}
#passport-stage .al-game-close { transition: opacity .35s cubic-bezier(0.65,0,0.35,1); }
body.al-ceremony #passport-stage .al-game-close {
  opacity: .3;
  pointer-events: none;
}