/* vip0.info — Plaster & void. Dhaka modernist concrete: tie-hole grid, marble inlay bands, circle / triangle / square voids. */
:root{
 --ground:#e6e1d8;--plaster:#f5f2ec;--stone:#d6cfc3;--line:#c3bbad;--marble:#fbf9f4;
 --ink:#1e1c19;--ink-2:#3a3631;--muted:#5b554d;
 --shadow:#2b2825;--shadow-2:#37332e;--on-dark:#ddd6ca;
 --brick:#9a3c24;--brick-2:#b3482b;--sun:#e0a445;--sun-2:#f0bd62;--lake:#23534e;
 --f-d:"Unbounded","Baloo Da 2","Noto Sans Bengali",system-ui,sans-serif;
 --f-bn-d:"Baloo Da 2","Unbounded","Noto Sans Bengali",system-ui,sans-serif;
 --f-b:"Albert Sans","Noto Sans Bengali",system-ui,-apple-system,"Segoe UI",sans-serif;
 --ties:radial-gradient(circle at 50% 50%,rgba(70,60,48,.2) 0 2px,transparent 2.6px) 0 0/48px 48px;
 --inlay:linear-gradient(180deg,transparent calc(100% - 3px),var(--marble) calc(100% - 3px)) 0 0/100% 192px;
 --ties-dark:radial-gradient(circle at 50% 50%,rgba(251,249,244,.08) 0 2px,transparent 2.6px) 0 0/48px 48px;
 --hd-h:68px;
 /* game runtime hooks */
 --surface:var(--plaster);--surface-2:var(--ground);--border:var(--line);--heading:var(--ink);--text:var(--ink);--primary:var(--brick);--primary-contrast:#fff;--accent:var(--sun);
 --font-head:var(--f-d);--font-body:var(--f-b);
 color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--hd-h) + 16px)}
body{margin:0;background:var(--plaster);color:var(--ink);font:400 17px/1.7 var(--f-b);overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
:lang(bn) body,body:lang(bn){line-height:1.8}
img,svg{max-width:100%}
a{color:var(--brick)}
h1,h2,h3{font-family:var(--f-d);color:var(--ink);margin:0;font-weight:700;text-wrap:balance}
:lang(bn) h1,:lang(bn) h2,:lang(bn) h3{font-family:var(--f-bn-d);line-height:1.45;letter-spacing:0}
:lang(en) h1,:lang(en) h2,:lang(en) h3{line-height:1.15;letter-spacing:-.015em}
.wrap{width:100%;max-width:1280px;margin-inline:auto;padding-inline:16px}
@media (min-width:600px){.wrap{padding-inline:28px}}
@media (min-width:1100px){.wrap{padding-inline:40px}}
:focus-visible{outline:3px solid var(--lake);outline-offset:3px}
.hd :focus-visible,.nv :focus-visible,.recess :focus-visible,.lightwell :focus-visible,.ft :focus-visible{outline-color:var(--sun)}
.skip{position:absolute;left:12px;top:-80px;z-index:100;background:var(--ink);color:var(--marble);padding:12px 18px;font-weight:600;text-decoration:none}
.skip:focus{top:12px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:12px 22px;border:2px solid transparent;border-radius:2px;font:600 16px/1.2 var(--f-b);text-decoration:none;cursor:pointer;transition:background-color .18s,color .18s,border-color .18s,transform .18s}
.btn:active{transform:translateY(1px)}
.btn-brick{background:var(--brick);color:#fff}
.btn-brick:hover{background:var(--brick-2)}
.btn-line{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-line:hover{background:var(--ink);color:var(--plaster)}
.btn-sun{background:var(--sun);color:var(--ink)}
.btn-sun:hover{background:var(--sun-2)}

/* glyphs: circle ring / triangle / pierced square */
.gl{display:inline-block;flex:none;width:22px;height:22px}
.gl-o{border-radius:50%;border:5px solid var(--brick)}
.gl-t{background:var(--sun);clip-path:polygon(50% 4%,100% 96%,0 96%)}
.gl-s{background:radial-gradient(circle,transparent 0 5px,var(--lake) 5.6px)}

/* header */
.hd{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--plaster) 94%,transparent);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.hd-row{display:flex;align-items:center;gap:12px;min-height:var(--hd-h)}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;min-height:44px;margin-right:auto}
.mk{display:inline-flex;color:var(--shadow)}
.mk svg{width:38px;height:38px}
.wm{display:flex;flex-direction:column;line-height:1}
.wm b{font:800 21px/1 var(--f-d);letter-spacing:-.02em}
.wm small{font:500 12px/1.3 var(--f-b);color:var(--muted);margin-top:4px}
.hd-tools{display:flex;align-items:center;gap:10px}
.lsw{display:inline-flex;border:1.5px solid var(--ink);border-radius:2px}
.lsw a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;min-width:44px;padding:0 11px;font:600 14px/1 var(--f-b);color:var(--ink);text-decoration:none}
.lsw a[aria-current]{background:var(--ink);color:var(--plaster)}
.lsw a:not([aria-current]):hover{background:var(--stone)}
.hd-cta{display:none}
.tg{display:inline-flex;align-items:center;gap:10px;min-height:44px;min-width:44px;padding:0 11px;background:transparent;color:var(--ink);border:1.5px solid var(--ink);border-radius:2px;font:600 15px/1 var(--f-b);cursor:pointer}
.tg-ic{position:relative;width:18px;height:12px}
.tg-ic i{position:absolute;left:0;right:0;height:2px;background:currentColor;transition:transform .2s,top .2s}
.tg-ic i:first-child{top:1px}.tg-ic i:last-child{top:9px}
.tg[aria-expanded=true]{background:var(--ink);color:var(--plaster)}
.tg[aria-expanded=true] .tg-ic i:first-child{top:5px;transform:rotate(45deg)}
.tg[aria-expanded=true] .tg-ic i:last-child{top:5px;transform:rotate(-45deg)}
.tg-l{display:none}
@media (min-width:430px){.tg-l{display:inline}}
@media (min-width:640px){.hd-cta{display:inline-flex;min-height:44px;padding:8px 16px;font-size:15px}}

/* nav: formwork band */
.nv{display:none;background:var(--shadow);background-image:var(--ties-dark);color:var(--marble)}
.nav-open .nv{display:block;max-height:calc(100dvh - var(--hd-h));overflow-y:auto;border-top:3px solid var(--sun)}
.nv-in{display:grid;grid-template-columns:1fr;padding-block:8px}
@media (min-width:600px){.nv-in{grid-template-columns:1fr 1fr;column-gap:24px}}
.nv a{display:flex;align-items:center;gap:14px;min-height:52px;padding:8px 4px;color:var(--marble);text-decoration:none;border-bottom:1px solid rgba(251,249,244,.12);font:500 16px/1.35 var(--f-b)}
.nv .nn{font:600 11px/1 var(--f-d);color:var(--sun);letter-spacing:.04em;min-width:20px}
.nv a:hover .nl{text-decoration:underline;text-underline-offset:4px}
.nv a[aria-current] .nl{color:var(--sun-2)}
@media (min-width:980px){
 .tg{display:none}
 .nv{display:block}
 .nv-in{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);grid-template-columns:none;padding-block:0}
 .nv a{flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;min-height:60px;padding:10px 14px;border-bottom:0;border-left:1px solid rgba(251,249,244,.14);font-size:14.5px;line-height:1.3}
 .nv a:last-child{border-right:1px solid rgba(251,249,244,.14)}
 .nv a:hover{background:var(--shadow-2)}
 .nv a[aria-current]{box-shadow:inset 0 -4px 0 var(--sun);background:var(--shadow-2)}
 .nv a[aria-current] .nl{color:var(--marble)}
}

/* home facade */
.facade{position:relative;background:var(--inlay),var(--ties),var(--ground);border-bottom:1px solid var(--line);overflow:hidden}
.facade::after{content:"";position:absolute;width:min(62vw,720px);aspect-ratio:1;right:-14vw;top:-18%;border-radius:50%;border:2px solid var(--marble);box-shadow:0 0 0 38px rgba(251,249,244,.22);pointer-events:none}
.facade-grid{position:relative;z-index:1;display:grid;gap:32px;padding-block:36px 44px}
@media (min-width:980px){.facade-grid{grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:56px;align-items:start;padding-block:64px 72px}}
.kick{display:flex;align-items:center;gap:10px;margin:0 0 18px;font:500 14px/1.4 var(--f-b);color:var(--ink-2)}
.kick .gl{width:16px;height:16px}
:lang(en) .kick{font:600 12px/1.4 var(--f-d);letter-spacing:.08em;text-transform:uppercase}
.facade h1{font-size:clamp(30px,6.4vw,58px);font-weight:800;max-width:17ch}
:lang(bn) .facade h1{font-size:clamp(32px,6.6vw,60px);font-weight:800;max-width:15em;line-height:1.35}
.lead{margin-top:20px;font-size:clamp(17px,1.9vw,19.5px);color:var(--ink-2);max-width:62ch}
.lead p{margin:0 0 .8em}
.lead p:last-child{margin-bottom:0}
.acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.plaques{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.plaques li{background:var(--plaster);border-left:4px solid var(--brick);padding:10px 14px;font-size:15px;line-height:1.5;box-shadow:0 1px 0 var(--line)}
.plaques li:nth-child(2){border-left-color:var(--sun)}
.plaques li:nth-child(3){border-left-color:var(--lake)}

/* recess: the game sits in a deep concrete bay */
.recess{position:relative;background:var(--shadow);background-image:var(--ties-dark);color:var(--marble);box-shadow:0 0 0 1px rgba(0,0,0,.25),16px 16px 0 rgba(43,40,37,.16);overflow:hidden;scroll-margin-top:calc(var(--hd-h) + 70px)}
.recess::before{content:"";position:absolute;right:-70px;top:-70px;width:210px;height:210px;border-radius:50%;background:radial-gradient(circle,rgba(224,164,69,.28),rgba(224,164,69,0) 70%);pointer-events:none}
.rc-head{position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:3px solid rgba(251,249,244,.12)}
.rc-void{width:18px;height:18px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 4px rgba(224,164,69,.18)}
.rc-t{font:600 16px/1.3 var(--f-b);margin-right:auto}
:lang(en) .rc-t{font:600 13px/1.3 var(--f-d);letter-spacing:.06em;text-transform:uppercase}
.rc-tag{font:600 12px/1 var(--f-d);padding:7px 9px;border:1.5px solid var(--sun);color:var(--sun)}
@media (max-width:399px){.recess{margin-inline:-16px;box-shadow:none}}

/* inner slab */
.slab{background:var(--inlay),var(--ties),var(--ground);border-bottom:1px solid var(--line)}
.slab-grid{display:grid;gap:28px;padding-block:22px 40px}
@media (min-width:860px){.slab-grid{grid-template-columns:minmax(0,1fr) 240px;align-items:end;gap:56px;padding-block:28px 56px}}
.crumbs ol{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-wrap:wrap;align-items:center;font-size:15px}
.crumbs li{display:inline-flex;align-items:center}
.crumbs li+li::before{content:"";width:8px;height:8px;margin:0 12px;background:var(--brick);clip-path:polygon(0 0,100% 50%,0 100%)}
.crumbs a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-2);text-underline-offset:4px}
.crumbs span{color:var(--muted)}
.slab h1{font-size:clamp(28px,5vw,50px);font-weight:800;max-width:24ch}
:lang(bn) .slab h1{font-size:clamp(28px,5.2vw,50px);max-width:20em}
.slab-void{display:none}
@media (min-width:860px){
 .slab-void{display:block;aspect-ratio:1;background:var(--shadow);position:relative;overflow:hidden;box-shadow:12px 12px 0 rgba(43,40,37,.14)}
 .slab-void span{position:absolute;inset:18%;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--sun-2),var(--sun) 45%,#b77a28);box-shadow:inset 0 0 0 10px var(--shadow)}
 .slab-void::after{content:"";position:absolute;left:0;right:0;bottom:22%;height:3px;background:var(--marble);opacity:.7}
 .slab-legal .slab-void span{border-radius:0;clip-path:polygon(50% 8%,96% 92%,4% 92%);inset:16%;box-shadow:none;background:var(--brick)}
}

/* floor: plan + bays */
.floor{padding-block:36px 56px;display:grid;gap:36px}
@media (min-width:1180px){.floor{grid-template-columns:250px minmax(0,1fr);gap:48px;padding-block:56px 80px}.plan{position:sticky;top:calc(var(--hd-h) + 80px);align-self:start;max-height:calc(100vh - var(--hd-h) - 100px);overflow:auto}}
.plan{background:var(--ground);padding:18px 18px 12px;border-top:4px solid var(--shadow)}
.plan-t{margin:0 0 6px;font:600 15px/1.4 var(--f-b);color:var(--muted)}
:lang(en) .plan-t{font:600 12px/1.4 var(--f-d);letter-spacing:.08em;text-transform:uppercase}
.plan ol{list-style:none;margin:0;padding:0;display:grid;column-gap:24px}
@media (min-width:700px) and (max-width:1179px){.plan ol{grid-template-columns:1fr 1fr}}
.plan a{display:flex;align-items:center;gap:12px;min-height:44px;padding:6px 0;color:var(--ink);text-decoration:none;font-size:15px;line-height:1.45;border-bottom:1px solid var(--line)}
.plan li:last-child a{border-bottom:0}
.plan .gl{width:14px;height:14px}
.plan .gl-o{border-width:3.5px}
.plan .gl-s{background:radial-gradient(circle,transparent 0 3px,var(--lake) 3.6px)}
.plan a:hover span:last-child,.plan a[aria-current] span:last-child{text-decoration:underline;text-decoration-color:var(--brick);text-decoration-thickness:2px;text-underline-offset:4px}
.bays{container:bays/inline-size;min-width:0}
.bay{position:relative;display:grid;gap:14px;padding-block:34px 30px}
.bay::before{content:"";position:absolute;left:0;right:0;top:0;height:9px;background:linear-gradient(180deg,var(--stone) 0 3px,var(--marble) 3px 6px,var(--stone) 6px);transform-origin:left}
.bays>.bay:first-child{padding-top:0}
.bays>.bay:first-child::before{display:none}
.pier{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px 12px;align-content:start}
.pier .no{font:600 12px/1 var(--f-d);color:var(--muted);letter-spacing:.06em}
.pier h2{grid-column:1/-1;font-size:clamp(22px,3.4vw,30px);font-weight:700;scroll-margin-top:calc(var(--hd-h) + 80px)}
:lang(bn) .pier h2{font-size:clamp(23px,3.4vw,30px)}
.bay-plain{padding-top:0}
.bay-plain::before{display:none}
@container bays (min-width:740px){
 .bay{grid-template-columns:230px minmax(0,1fr);gap:40px;padding-block:46px 40px}
 .bay.bay-plain{display:block;padding-top:0}
 .bay-plain .bay-body{margin-left:270px}
 .pier{position:sticky;top:calc(var(--hd-h) + 80px);align-self:start}
 .pier h2{font-size:23px}
 :lang(bn) .pier h2{font-size:24px}
}
@container bays (min-width:900px){.bay{grid-template-columns:270px minmax(0,1fr);gap:48px}.bay-plain .bay-body{margin-left:318px}.pier h2{font-size:25px}}

/* prose */
.prose{max-width:70ch;min-width:0}
.prose>:first-child{margin-top:0}
.prose p{margin:0 0 1em}
.prose h3{font-size:19px;margin:1.6em 0 .5em}
.prose ul,.prose ol{margin:0 0 1.1em;padding-left:0;list-style:none}
.prose li{position:relative;padding-left:28px;margin-bottom:.55em}
.prose ul>li::before{content:"";position:absolute;left:4px;top:.72em;width:9px;height:9px;background:var(--brick)}
.prose ul>li:nth-child(3n+2)::before{background:var(--sun);clip-path:polygon(50% 0,100% 100%,0 100%)}
.prose ul>li:nth-child(3n)::before{background:none;border:2px solid var(--lake);border-radius:50%}
.prose ol{counter-reset:o}
.prose ol>li{counter-increment:o}
.prose ol>li::before{content:counter(o);position:absolute;left:0;top:.28em;width:20px;height:20px;display:grid;place-items:center;background:var(--shadow);color:var(--sun);font:600 11px/1 var(--f-d)}
.prose strong{font-weight:700;color:var(--ink)}
.prose a{text-decoration-thickness:1px;text-underline-offset:3px}
.prose a:hover{text-decoration-thickness:2px}
.prose blockquote{margin:0 0 1em;padding:12px 18px;border-left:4px solid var(--sun);background:var(--ground)}
.prose table{display:block;overflow-x:auto;border-collapse:collapse;margin:0 0 1.2em;font-size:15.5px;max-width:100%}
.prose th,.prose td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.prose th{background:var(--ground);font-weight:700}
.preface{border-left:4px solid var(--shadow);padding-left:18px;color:var(--ink-2)}

/* faq */
.qa{border-bottom:1px solid var(--line)}
.qa:first-child{border-top:1px solid var(--line)}
.qa summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:12px 0;cursor:pointer;list-style:none;font:600 17px/1.5 var(--f-b)}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover .q{text-decoration:underline;text-decoration-color:var(--brick);text-underline-offset:4px}
.pm{position:relative;flex:none;width:32px;height:32px;border-radius:50%;border:2px solid var(--ink);transition:transform .2s,background-color .2s}
.pm::before,.pm::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--ink)}
.pm::after{transform:rotate(90deg)}
.qa[open] .pm{transform:rotate(45deg);background:var(--brick);border-color:var(--brick)}
.qa[open] .pm::before,.qa[open] .pm::after{background:#fff}
.qa .a{padding:0 0 18px;max-width:70ch}

/* lightwell cta */
.lightwell{background:var(--shadow);background-image:var(--ties-dark);color:var(--marble);overflow:hidden}
.lw-in{position:relative;display:grid;gap:20px;padding-block:40px;align-items:center}
@media (min-width:760px){.lw-in{grid-template-columns:120px minmax(0,1fr) auto;gap:36px}}
.lw-sun{display:block;width:88px;height:88px;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--sun-2),var(--sun) 50%,#b77a28)}
@media (min-width:760px){.lw-sun{width:120px;height:120px}}
.lw-t{margin:0 0 4px;font:700 22px/1.35 var(--f-d)}
:lang(bn) .lw-t{font-family:var(--f-bn-d);font-size:24px}
.lw-p{margin:0;color:var(--on-dark);max-width:60ch}

/* related: windows */
.rel{background:var(--inlay),var(--ties),var(--ground);padding-block:48px 56px;border-top:1px solid var(--line)}
.rel-h{font-size:clamp(22px,3vw,30px);margin-bottom:24px}
.wins{container:wins/inline-size;list-style:none;margin:0;padding:0;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr))}
.win{display:flex;flex-direction:column;gap:10px;height:100%;padding:20px 20px 22px;background:var(--plaster);border:1px solid var(--line);border-top:6px solid var(--shadow);color:var(--ink);text-decoration:none;transition:transform .2s,border-color .2s,box-shadow .2s}
.win strong{font:700 17px/1.4 var(--f-d)}
:lang(bn) .win strong{font-family:var(--f-bn-d);font-size:19px;line-height:1.5}
.win-d{font-size:15.5px;line-height:1.6;color:var(--muted)}
.win:hover{transform:translateY(-3px);border-color:var(--brick);border-top-color:var(--brick);box-shadow:8px 8px 0 rgba(43,40,37,.1)}

/* footer */
.ft{background:var(--shadow);background-image:var(--ties-dark);color:var(--on-dark);padding-top:48px;border-top:6px solid var(--sun)}
.ft-grid{display:grid;gap:32px}
@media (min-width:760px){.ft-grid{grid-template-columns:1.4fr 1fr 1fr;gap:48px}}
.brand-inv{color:var(--marble)}
.brand-inv .mk{color:#4a453e}
.brand-inv .wm small{color:var(--on-dark)}
.ft-brand p{margin:16px 0 0;font-size:15.5px;max-width:48ch}
.ft-h{font:600 15px/1.4 var(--f-b);color:var(--sun);margin:0 0 8px}
:lang(en) .ft-h{font:600 12px/1.4 var(--f-d);letter-spacing:.1em;text-transform:uppercase}
.ft-l{list-style:none;margin:0;padding:0}
.ft-l a{display:flex;align-items:center;min-height:44px;color:var(--marble);text-decoration:none;border-bottom:1px solid rgba(251,249,244,.1);font-size:15.5px}
.ft-l a:hover{color:var(--sun-2)}
.ft-base{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:36px;padding-block:22px 28px;border-top:3px solid rgba(251,249,244,.14);font-size:14.5px}
.age{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:2px solid var(--sun);color:var(--sun);font:700 14px/1 var(--f-d)}
.ft-base .lsw{margin-left:auto;border-color:rgba(251,249,244,.5)}
.ft-base .lsw a{color:var(--marble)}
.ft-base .lsw a[aria-current]{background:var(--marble);color:var(--ink)}
.ft-base .lsw a:not([aria-current]):hover{background:var(--shadow-2)}

/* 404 */
.nf{padding-block:80px 100px;display:grid;gap:18px;justify-items:start}
.nf-void{width:120px;height:120px;border-radius:50%;background:var(--shadow);box-shadow:inset 0 0 0 26px var(--ground)}
.nf h1{font-size:clamp(28px,5vw,46px)}

/* motion (decorative only, never hides content) */
@media (prefers-reduced-motion:no-preference){
 .slab-void span{animation:sunpass 18s ease-in-out infinite alternate}
 .lw-sun{animation:sunpass 14s ease-in-out infinite alternate}
 @keyframes sunpass{from{transform:translate(-6%,4%)}to{transform:translate(6%,-4%)}}
 @supports (animation-timeline:view()){
  .bay::before{animation:joint linear both;animation-timeline:view();animation-range:entry 0% entry 80%}
  @keyframes joint{from{transform:scaleX(.18)}to{transform:scaleX(1)}}
 }
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.hd,.nv,.lightwell,.rel,.recess,.plan{display:none}.ft{background:none;color:#000}}