/* ==========================================================
   takaba.cyou — mobile shell stylesheet
   file   : css/canvas-native-b08349.css
   prefix : shellb0834-
   palette: #273746 base dark / #FDF5E6 #FFE4B5 #FAFAD2 #FFEFD5
   voice  : low-radius zoned plates, outlined tile cards,
            question-driven rhythm, mono accents, light press
   ========================================================== */

:root{
  --shellb0834-ink:#273746;
  --shellb0834-inkDeep:#1A2530;
  --shellb0834-paper:#FDF5E6;
  --shellb0834-mist:#FFE4B5;
  --shellb0834-linen:#FAFAD2;
  --shellb0834-cream:#FFEFD5;
  --shellb0834-line:rgba(255,228,181,.28);
  --shellb0834-lineSoft:rgba(253,245,230,.14);
  --shellb0834-panel:rgba(253,245,230,.05);
  --shellb0834-panelHot:rgba(255,228,181,.10);
  --shellb0834-dim:rgba(253,245,230,.72);
  --shellb0834-mono:"Cascadia Mono","JetBrains Mono","Fira Mono",Consolas,"Courier New",monospace;
  --shellb0834-body:"Hind Siliguri","Noto Sans Bengali","SolaimanLipi","Kalpurush",system-ui,-apple-system,"Segoe UI",sans-serif;
  --shellb0834-r:6px;
  --shellb0834-rBig:10px;
  --shellb0834-mastH:97px;
  --shellb0834-dockH:64px;
  --shellb0834-gap:12px;
}

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}

body{
  margin:0;
  background:var(--shellb0834-inkDeep);
  color:var(--shellb0834-paper);
  font-family:var(--shellb0834-body);
  font-size:15px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%;display:block;}

a{color:var(--shellb0834-mist);text-decoration:none;}
a:hover,a:focus-visible{color:var(--shellb0834-linen);text-decoration:underline;}

:focus-visible{outline:2px solid var(--shellb0834-linen);outline-offset:2px;border-radius:3px;}

button{font-family:inherit;cursor:pointer;}

/* ---------- phone canvas frame ---------- */
.shellb0834-page{
  position:relative;
  width:100%;
  max-width:430px;             /* literal mobile canvas bound */
  margin:0 auto;
  min-height:100vh;
  background:var(--shellb0834-ink);
  overflow-x:clip;
  box-shadow:0 0 44px rgba(0,0,0,.5);
}

.shellb0834-main{
  padding:calc(var(--shellb0834-mastH) + 12px) var(--shellb0834-gap) calc(var(--shellb0834-dockH) + 34px);
}

.shellb0834-visuallyHidden{
  position:absolute;width:1px;height:1px;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;
}

/* ---------- press feedback (shared micro-interaction) ---------- */
.shellb0834-press{
  transition:transform .16s ease,background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
  -webkit-tap-highlight-color:transparent;
}
.shellb0834-press:active{transform:scale(.962);}
@media (prefers-reduced-motion:reduce){
  .shellb0834-press{transition:none;}
  .shellb0834-press:active{transform:none;}
}

/* ---------- mast : brand layer + action layer ---------- */
.shellb0834-mast{
  position:fixed;
  top:0;left:0;right:0;
  margin-inline:auto;
  width:100%;
  max-width:430px;
  z-index:60;
  background:rgba(39,55,70,.97);
  border-bottom:1px solid var(--shellb0834-line);
  backdrop-filter:blur(6px);
}

.shellb0834-mastBrand{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:50px;
  padding:8px var(--shellb0834-gap) 6px;
  border-bottom:1px dashed var(--shellb0834-lineSoft);
}

.shellb0834-mastMark{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;height:36px;
  border:1px solid var(--shellb0834-line);
  border-radius:var(--shellb0834-r);
  background:var(--shellb0834-panelHot);
  overflow:hidden;
}
.shellb0834-mastMark img{width:30px;height:30px;object-fit:contain;}

.shellb0834-mastName{
  font-size:19px;
  font-weight:700;
  letter-spacing:.14em;
  font-family:var(--shellb0834-mono);
  color:var(--shellb0834-paper);
  text-transform:lowercase;
}

.shellb0834-mastActs{
  display:flex;
  align-items:center;
  gap:8px;
  padding:7px var(--shellb0834-gap);
}

.shellb0834-mastBtn{
  flex:1 1 0;
  min-height:44px;
  border-radius:var(--shellb0834-r);
  border:1px solid var(--shellb0834-line);
  background:transparent;
  color:var(--shellb0834-cream);
  font-size:14.5px;
  font-weight:600;
  letter-spacing:.02em;
}
.shellb0834-mastBtn:hover{background:var(--shellb0834-panelHot);text-decoration:none;}

.shellb0834-mastBtnMain{
  background:var(--shellb0834-mist);
  border-color:var(--shellb0834-mist);
  color:var(--shellb0834-ink);
  font-weight:700;
}
.shellb0834-mastBtnMain:hover{background:var(--shellb0834-linen);border-color:var(--shellb0834-linen);color:var(--shellb0834-ink);}

.shellb0834-burger{
  flex:0 0 46px;
  width:46px;min-height:44px;
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  border:1px solid var(--shellb0834-line);
  border-radius:var(--shellb0834-r);
  background:var(--shellb0834-panel);
}
.shellb0834-burgerBar{
  width:18px;height:2px;
  background:var(--shellb0834-paper);
  border-radius:1px;
  transition:transform .22s ease,opacity .18s ease;
}
.shellb0834-burger.shellb0834-isOpen .shellb0834-burgerBar:nth-child(1){transform:translateY(6px) rotate(45deg);}
.shellb0834-burger.shellb0834-isOpen .shellb0834-burgerBar:nth-child(2){opacity:0;}
.shellb0834-burger.shellb0834-isOpen .shellb0834-burgerBar:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

/* ---------- compact route panel (expandable menu) ---------- */
.shellb0834-routes{
  max-height:0;
  overflow:hidden;
  transition:max-height .28s ease;
  background:rgba(26,37,48,.98);
  border-bottom:1px solid var(--shellb0834-lineSoft);
}
.shellb0834-routes.shellb0834-isOpen{max-height:420px;}

.shellb0834-routesGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  padding:10px var(--shellb0834-gap) 12px;
}

.shellb0834-routeLink{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:44px;
  padding:8px 10px;
  border:1px solid var(--shellb0834-lineSoft);
  border-radius:var(--shellb0834-r);
  background:var(--shellb0834-panel);
  color:var(--shellb0834-cream);
  font-size:13.5px;
  line-height:1.3;
}
.shellb0834-routeLink::before{
  content:"";
  flex:0 0 auto;
  width:6px;height:6px;
  border:1px solid var(--shellb0834-mist);
  border-radius:2px;
}
.shellb0834-routeLink:hover{border-color:var(--shellb0834-line);background:var(--shellb0834-panelHot);text-decoration:none;}
.shellb0834-routeLink.shellb0834-isOn{
  background:var(--shellb0834-paper);
  border-color:var(--shellb0834-paper);
  color:var(--shellb0834-ink);
  font-weight:700;
}
.shellb0834-routeLink.shellb0834-isOn::before{border-color:var(--shellb0834-ink);}

/* ---------- hero carousel ---------- */
.shellb0834-hero{
  position:relative;
  margin:2px 0 6px;
  border:1px solid var(--shellb0834-line);
  border-radius:var(--shellb0834-rBig);
  overflow:hidden;
  background:var(--shellb0834-inkDeep);
}

.shellb0834-heroView{overflow:hidden;}

.shellb0834-heroTrack{
  display:flex;
  transition:transform .34s cubic-bezier(.22,.68,.36,1);
}
@media (prefers-reduced-motion:reduce){.shellb0834-heroTrack{transition:none;}}

.shellb0834-heroSlide{
  position:relative;
  flex:0 0 100%;
  aspect-ratio:16/9;
  min-height:200px;
}
.shellb0834-heroSlide img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
}

.shellb0834-heroCopy{
  position:absolute;inset:auto 0 0 0;
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:34px 14px 12px;
  background:linear-gradient(180deg,rgba(39,55,70,0) 0%,rgba(26,37,48,.86) 46%,rgba(26,37,48,.96) 100%);
  text-align:left;
}
.shellb0834-heroKick{
  font-family:var(--shellb0834-mono);
  font-size:10.5px;
  letter-spacing:.22em;
  color:var(--shellb0834-mist);
  text-transform:uppercase;
}
.shellb0834-heroTitle{
  margin:0;
  font-size:17.5px;
  line-height:1.35;
  font-weight:700;
  color:var(--shellb0834-paper);
}
.shellb0834-heroText{
  margin:0;
  font-size:12.5px;
  line-height:1.55;
  color:var(--shellb0834-dim);
}
.shellb0834-heroCta{
  align-self:flex-start;
  min-height:38px;
  padding:7px 16px;
  border-radius:var(--shellb0834-r);
  border:1px solid var(--shellb0834-mist);
  background:var(--shellb0834-mist);
  color:var(--shellb0834-ink);
  font-size:13.5px;
  font-weight:700;
}
.shellb0834-heroCta:hover{background:var(--shellb0834-linen);border-color:var(--shellb0834-linen);}

.shellb0834-heroNav{
  position:absolute;
  top:12px;right:10px;
  display:flex;
  gap:6px;
}
.shellb0834-heroArrow{
  width:34px;height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--shellb0834-line);
  border-radius:var(--shellb0834-r);
  background:rgba(26,37,48,.72);
  color:var(--shellb0834-paper);
  font-family:var(--shellb0834-mono);
  font-size:14px;
  line-height:1;
}
.shellb0834-heroArrow:hover{background:var(--shellb0834-paper);color:var(--shellb0834-ink);}

.shellb0834-heroDots{
  position:absolute;
  left:14px;bottom:10px;
  display:flex;
  gap:5px;
}
.shellb0834-heroDot{
  width:16px;height:7px;
  padding:0;
  border:1px solid var(--shellb0834-line);
  border-radius:3px;
  background:rgba(26,37,48,.65);
  transition:background-color .2s ease,border-color .2s ease;
}
.shellb0834-heroDot.shellb0834-isOn{background:var(--shellb0834-mist);border-color:var(--shellb0834-mist);}

/* ---------- plates (zoned sections) ---------- */
.shellb0834-plate{
  margin:0 0 16px;
  padding:14px 12px 15px;
  border:1px solid var(--shellb0834-lineSoft);
  border-left:3px solid var(--shellb0834-mist);
  border-radius:var(--shellb0834-r);
  background:var(--shellb0834-panel);
}
.shellb0834-plateTint{
  border-left-color:var(--shellb0834-linen);
  background:var(--shellb0834-panelHot);
}

.shellb0834-plateHead{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  margin:0 0 4px;
}
.shellb0834-plateKick{
  font-family:var(--shellb0834-mono);
  font-size:10.5px;
  letter-spacing:.18em;
  color:var(--shellb0834-mist);
  white-space:nowrap;
}
.shellb0834-plateCount{
  margin-left:auto;
  font-family:var(--shellb0834-mono);
  font-size:10.5px;
  letter-spacing:.08em;
  color:var(--shellb0834-dim);
  border:1px solid var(--shellb0834-lineSoft);
  border-radius:3px;
  padding:1px 6px;
}

.shellb0834-plateTitle{
  flex-basis:100%;
  margin:2px 0 8px;
  font-size:18px;
  line-height:1.42;
  font-weight:700;
  color:var(--shellb0834-paper);
}

.shellb0834-lede{
  margin:0 0 10px;
  font-size:14.5px;
  color:var(--shellb0834-cream);
}
.shellb0834-copy{margin:0 0 10px;font-size:14px;color:var(--shellb0834-dim);}
.shellb0834-copy strong,.shellb0834-lede strong{color:var(--shellb0834-paper);font-weight:700;}
.shellb0834-copy a,.shellb0834-lede a{
  color:var(--shellb0834-linen);
  text-decoration:underline;
  text-decoration-color:rgba(250,250,210,.5);
  text-underline-offset:3px;
}

/* ---------- question-driven ask blocks ---------- */
.shellb0834-ask{
  margin:10px 0 0;
  padding:10px 11px 11px;
  border:1px dashed var(--shellb0834-line);
  border-radius:var(--shellb0834-r);
  background:rgba(26,37,48,.45);
}
.shellb0834-askQ{
  margin:0 0 6px;
  font-size:14px;
  font-weight:700;
  color:var(--shellb0834-mist);
  line-height:1.5;
}
.shellb0834-askA{margin:0;font-size:13.5px;color:var(--shellb0834-dim);}

/* ---------- game grid + outlined tile cards ---------- */
.shellb0834-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:12px 0 4px;
}
@media (min-width:375px){.shellb0834-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;}}

.shellb0834-tile{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:5px 5px 7px;
  border:1px solid var(--shellb0834-line);
  border-radius:var(--shellb0834-r);
  background:rgba(26,37,48,.5);
  text-align:center;
}
.shellb0834-tile:hover{border-color:var(--shellb0834-mist);background:var(--shellb0834-panelHot);}

.shellb0834-tileArt{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  border:1px solid var(--shellb0834-lineSoft);
  border-radius:4px;
  overflow:hidden;
  background:var(--shellb0834-inkDeep);
}
.shellb0834-tileArt img{width:100%;height:100%;object-fit:cover;}

.shellb0834-tileName{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  font-size:11px;
  line-height:1.4;
  font-weight:600;
  color:var(--shellb0834-cream);
  overflow-wrap:break-word;
  word-break:break-word;
}
.shellb0834-tile:hover .shellb0834-tileName{color:var(--shellb0834-paper);}

/* ---------- CTA : light-radius text button group ---------- */
.shellb0834-ctaRow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:12px 0 2px;
}
.shellb0834-cta{
  min-height:44px;
  padding:9px 16px;
  border:1px solid var(--shellb0834-line);
  border-radius:var(--shellb0834-r);
  background:transparent;
  color:var(--shellb0834-cream);
  font-size:13.5px;
  font-weight:600;
}
.shellb0834-cta:hover{background:var(--shellb0834-panelHot);border-color:var(--shellb0834-mist);}
.shellb0834-ctaMain{
  background:var(--shellb0834-paper);
  border-color:var(--shellb0834-paper);
  color:var(--shellb0834-ink);
  font-weight:700;
}
.shellb0834-ctaMain:hover{background:var(--shellb0834-linen);border-color:var(--shellb0834-linen);color:var(--shellb0834-ink);}
a.shellb0834-cta:hover{text-decoration:none;}

/* ---------- FAQ (native disclosure) ---------- */
.shellb0834-qa{
  border:1px solid var(--shellb0834-lineSoft);
  border-radius:var(--shellb0834-r);
  background:rgba(26,37,48,.45);
  margin:0 0 8px;
  overflow:hidden;
}
.shellb0834-qa summary{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:46px;
  padding:10px 12px;
  cursor:pointer;
  list-style:none;
  font-size:14px;
  font-weight:700;
  color:var(--shellb0834-paper);
  transition:background-color .18s ease;
}
.shellb0834-qa summary::-webkit-details-marker{display:none;}
.shellb0834-qa summary::before{
  content:"+";
  flex:0 0 auto;
  width:20px;height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--shellb0834-mist);
  border-radius:4px;
  font-family:var(--shellb0834-mono);
  font-size:13px;
  color:var(--shellb0834-mist);
  transition:transform .2s ease;
}
.shellb0834-qa[open] summary::before{content:"−";}
.shellb0834-qa summary:hover{background:var(--shellb0834-panelHot);}
.shellb0834-qaBody{
  padding:0 12px 12px 41px;
  font-size:13.5px;
  color:var(--shellb0834-dim);
}
.shellb0834-qaBody p{margin:0 0 8px;}
.shellb0834-qaBody p:last-child{margin:0;}

/* ---------- selection guide rails ---------- */
.shellb0834-rail{
  display:grid;
  gap:7px;
  margin:11px 0 0;
}
.shellb0834-railRow{
  display:grid;
  grid-template-columns:88px 1fr;
  gap:8px;
  align-items:start;
  padding:9px 10px;
  border:1px solid var(--shellb0834-lineSoft);
  border-radius:var(--shellb0834-r);
  background:rgba(26,37,48,.4);
}
.shellb0834-railKey{
  font-family:var(--shellb0834-mono);
  font-size:11px;
  letter-spacing:.05em;
  line-height:1.5;
  color:var(--shellb0834-mist);
  border:1px dashed var(--shellb0834-line);
  border-radius:4px;
  padding:4px 6px;
  text-align:center;
}
.shellb0834-railVal{font-size:13px;line-height:1.6;color:var(--shellb0834-cream);}

/* ---------- achievements ladder ---------- */
.shellb0834-ladder{
  list-style:none;
  margin:11px 0 0;
  padding:0;
  display:grid;
  gap:0;
}
.shellb0834-ladder li{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:10px;
  padding:10px 4px;
  border-bottom:1px dashed var(--shellb0834-lineSoft);
}
.shellb0834-ladder li:last-child{border-bottom:0;}
.shellb0834-ladderNo{
  font-family:var(--shellb0834-mono);
  font-size:12px;
  color:var(--shellb0834-ink);
  background:var(--shellb0834-mist);
  border-radius:4px;
  height:fit-content;
  padding:3px 6px;
  text-align:center;
}
.shellb0834-ladder b{display:block;font-size:13.5px;color:var(--shellb0834-paper);}
.shellb0834-ladder span{font-size:12.5px;color:var(--shellb0834-dim);line-height:1.6;}

/* ---------- fact rows ---------- */
.shellb0834-facts{
  margin:11px 0 0;
  border:1px solid var(--shellb0834-lineSoft);
  border-radius:var(--shellb0834-r);
  overflow:hidden;
}
.shellb0834-factRow{
  display:grid;
  grid-template-columns:112px 1fr;
  border-bottom:1px solid var(--shellb0834-lineSoft);
}
.shellb0834-factRow:last-child{border-bottom:0;}
.shellb0834-factKey{
  padding:8px 10px;
  font-family:var(--shellb0834-mono);
  font-size:11px;
  letter-spacing:.04em;
  color:var(--shellb0834-mist);
  background:var(--shellb0834-panelHot);
  border-right:1px solid var(--shellb0834-lineSoft);
}
.shellb0834-factVal{
  padding:8px 10px;
  font-size:13px;
  color:var(--shellb0834-cream);
  line-height:1.6;
}

/* ---------- checklist ---------- */
.shellb0834-checks{
  list-style:none;
  margin:11px 0 0;
  padding:0;
  display:grid;
  gap:6px;
}
.shellb0834-checks li{
  position:relative;
  padding:9px 10px 9px 34px;
  border:1px solid var(--shellb0834-lineSoft);
  border-radius:var(--shellb0834-r);
  background:rgba(26,37,48,.4);
  font-size:13px;
  color:var(--shellb0834-cream);
  line-height:1.6;
}
.shellb0834-checks li::before{
  content:"✓";
  position:absolute;
  left:9px;top:8px;
  width:18px;height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--shellb0834-linen);
  border-radius:4px;
  color:var(--shellb0834-linen);
  font-family:var(--shellb0834-mono);
  font-size:11px;
}

/* ---------- extended footer zone ---------- */
.shellb0834-xfoot{
  margin:6px 0 14px;
  border:1px solid var(--shellb0834-line);
  border-radius:var(--shellb0834-rBig);
  background:rgba(26,37,48,.6);
  padding:13px 11px;
}

.shellb0834-xfootTitle{
  margin:0 0 9px;
  font-size:15.5px;
  font-weight:700;
  color:var(--shellb0834-paper);
}
.shellb0834-xfootTitle small{
  display:block;
  font-family:var(--shellb0834-mono);
  font-size:10px;
  letter-spacing:.2em;
  color:var(--shellb0834-mist);
  margin-bottom:3px;
  font-weight:400;
}

.shellb0834-directory{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  margin:0 0 12px;
}
.shellb0834-directory a{
  display:flex;
  align-items:center;
  min-height:44px;
  padding:8px 9px;
  border:1px solid var(--shellb0834-lineSoft);
  border-radius:var(--shellb0834-r);
  background:var(--shellb0834-panel);
  color:var(--shellb0834-cream);
  font-size:12.5px;
  line-height:1.35;
}
.shellb0834-directory a:hover{border-color:var(--shellb0834-mist);text-decoration:none;background:var(--shellb0834-panelHot);}
.shellb0834-directory a::before{
  content:"»";
  margin-right:6px;
  color:var(--shellb0834-mist);
  font-family:var(--shellb0834-mono);
}

.shellb0834-xfootBrand{
  margin:0 0 12px;
  padding:10px;
  border-left:3px solid var(--shellb0834-mist);
  background:var(--shellb0834-panel);
  border-radius:var(--shellb0834-r);
  font-size:12.5px;
  color:var(--shellb0834-dim);
  line-height:1.7;
}

.shellb0834-xfootPromos{
  display:flex;
  gap:8px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  padding-bottom:6px;
  margin:0 0 12px;
  -webkit-overflow-scrolling:touch;
}
.shellb0834-shortcut{
  flex:0 0 148px;
  scroll-snap-align:start;
  display:flex;
  flex-direction:column;
  gap:4px;
  min-height:62px;
  padding:9px 10px;
  border:1px solid var(--shellb0834-line);
  border-radius:var(--shellb0834-r);
  background:var(--shellb0834-panelHot);
  color:var(--shellb0834-paper);
  text-align:left;
}
.shellb0834-shortcut:hover{border-color:var(--shellb0834-mist);background:var(--shellb0834-mist);color:var(--shellb0834-ink);}
.shellb0834-shortcut b{font-size:12.5px;line-height:1.35;}
.shellb0834-shortcut span{font-size:10.5px;line-height:1.4;color:inherit;opacity:.82;font-family:var(--shellb0834-mono);letter-spacing:.04em;}

.shellb0834-xfootNote{
  font-size:11.5px;
  line-height:1.7;
  color:var(--shellb0834-dim);
  border-top:1px dashed var(--shellb0834-lineSoft);
  padding-top:9px;
}

/* ---------- common footer ---------- */
.shellb0834-foot{
  padding:4px 0 10px;
  text-align:center;
}
.shellb0834-footCopy{
  margin:0;
  font-family:var(--shellb0834-mono);
  font-size:11px;
  letter-spacing:.06em;
  color:var(--shellb0834-dim);
}

/* ---------- fixed bottom dock : compact icon rack ---------- */
.shellb0834-dock{
  position:fixed;
  bottom:0;left:0;right:0;
  margin-inline:auto;
  width:100%;
  max-width:430px;
  z-index:60;
  display:flex;
  background:rgba(26,37,48,.98);
  border-top:1px solid var(--shellb0834-line);
  backdrop-filter:blur(6px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}

.shellb0834-dockItem{
  position:relative;
  flex:1 1 20%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  min-height:var(--shellb0834-dockH);
  padding:7px 2px 8px;
  border:0;
  background:transparent;
  color:var(--shellb0834-cream);
  font-family:var(--shellb0834-body);
}
.shellb0834-dockItem::before{
  /* sliding indicator */
  content:"";
  position:absolute;
  top:0;left:50%;
  width:30px;height:3px;
  border-radius:0 0 3px 3px;
  background:var(--shellb0834-mist);
  transform:translateX(-50%) scaleY(0);
  transform-origin:top center;
  transition:transform .24s cubic-bezier(.3,.8,.4,1);
}
.shellb0834-dockItem:hover{color:var(--shellb0834-linen);text-decoration:none;}

.shellb0834-dockItem.shellb0834-isOn{
  background:var(--shellb0834-paper);
  color:var(--shellb0834-ink);
  font-weight:700;
}
.shellb0834-dockItem.shellb0834-isOn::before{
  background:var(--shellb0834-mist);
  transform:translateX(-50%) scaleY(1);
}

.shellb0834-dockIco{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;height:22px;
}
.shellb0834-dockIco svg{width:21px;height:21px;display:block;}

.shellb0834-dockLbl{
  font-size:10.5px;
  line-height:1.25;
  letter-spacing:.02em;
}

/* ---------- wide-screen note : keep the phone canvas ---------- */
@media (min-width:431px){
  .shellb0834-page::after{
    content:"মোবাইল ক্যানভাস";
    position:absolute;
    top:50%;right:-8px;
    transform:translateY(-50%) rotate(90deg);
    transform-origin:right center;
    font-family:var(--shellb0834-mono);
    font-size:10px;
    letter-spacing:.4em;
    color:rgba(253,245,230,.16);
    pointer-events:none;
  }
}

/* ---------- tiny helpers ---------- */
.shellb0834-note{
  margin:8px 0 0;
  padding:8px 10px;
  border-left:3px solid var(--shellb0834-linen);
  background:rgba(250,250,210,.06);
  border-radius:4px;
  font-size:12px;
  line-height:1.65;
  color:var(--shellb0834-dim);
}
.shellb0834-tag{
  display:inline-block;
  font-family:var(--shellb0834-mono);
  font-size:10px;
  letter-spacing:.1em;
  color:var(--shellb0834-mist);
  border:1px solid var(--shellb0834-line);
  border-radius:3px;
  padding:1px 7px;
  margin:0 4px 4px 0;
}