/* 3D stand builder (pure CSS 3D). Colours come from the visitor: --bp primary, --ba accent, --bpt/--bat text on them. */
.bt-sec.sec{padding-top:clamp(76px,8.6vh,112px);padding-bottom:clamp(36px,5vh,64px)}
.booth{display:grid;grid-template-columns:minmax(320px,400px) 1fr;gap:clamp(24px,3vw,50px);align-items:stretch}
#booth{--bp:#111111;--ba:#FFFFFF;--bpt:#fff;--bat:#111}
.bt-panel{display:flex;flex-direction:column;min-height:0}
.bt-panel .h2{font-size:clamp(36px,3.5vw,62px)}
html[lang="ar"] .bt-panel .h2{font-size:clamp(30px,3vw,54px)}
.bt-panel .lead{font-size:14px;line-height:1.55;margin-top:10px}
.bt-grp{margin-top:13px}
.bt-grp > p{margin:0 0 8px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
html[lang="ar"] .bt-grp > p{letter-spacing:0;font-size:13.5px}
.bt-type{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:5px;border-radius:14px;border:1px solid var(--line)}
.bt-type button{height:40px;border-radius:10px;font-size:12.5px;font-weight:600;color:var(--muted);line-height:1.1;transition:background .25s,color .25s}
.bt-type button.on{background:var(--aqua);color:var(--ground)}
.bt-id{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bt-up{position:relative;display:flex;align-items:center;gap:10px;height:42px;padding:0 14px;border-radius:12px;border:1.5px dashed var(--line-2);font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer;overflow:hidden;transition:border-color .2s}
.bt-up:hover{border-color:var(--aqua)}
.bt-up input{position:absolute;inset:0;opacity:0;cursor:pointer}
.bt-up .fa{height:14px;color:var(--aqua);flex:none}
.bt-up span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-name{height:42px;padding:0 14px;border-radius:12px;border:1px solid var(--line-2);background:var(--ground-2);color:var(--ink);font:600 14px var(--body);outline:none;min-width:0}
.bt-name:focus{border-color:var(--aqua)}
.bt-grp > p.bt-note{margin:6px 0 0;font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--dim)}
.bt-cols{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bt-sw{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--p) 0 55%,var(--a) 55%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);transition:transform .2s,box-shadow .2s}
.bt-sw.on{box-shadow:0 0 0 2px var(--ground),0 0 0 4px var(--aqua)}
.bt-sw:hover{transform:scale(1.1)}
.bt-pick{position:relative;width:34px;height:34px;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1.5px rgba(255,255,255,.35)}
.bt-pick input{position:absolute;inset:-8px;width:50px;height:50px;border:0;padding:0;cursor:pointer;background:none}
.bt-pal{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.bt-chip{position:relative;display:flex;flex-direction:row;align-items:center;gap:8px;height:40px;padding:0 9px;border-radius:12px;border:1px solid var(--line);background:var(--ground-2);text-align:start;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;transition:border-color .2s,background .2s}
.bt-chip:hover{border-color:var(--aqua);background:var(--ground-3)}
.bt-chip .ic{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--aqua-soft);color:var(--aqua)}
.bt-chip .ic .fa{height:13px}
.bt-chip b{font-size:12px;font-weight:600;line-height:1.15}
.bt-chip i{position:absolute;right:5px;top:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--aqua);color:var(--ground);font:700 11px/18px var(--body);font-style:normal;text-align:center}
html[dir="rtl"] .bt-chip i{right:auto;left:5px}
.bt-chip.full{opacity:.4;cursor:not-allowed}
.bt-acts{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.bt-acts .btn{height:40px;padding:0 14px;font-size:13px}
.bt-acts .is-off{opacity:.35;pointer-events:none}
.bt-acts #btSpin.on{border-color:var(--aqua);color:var(--aqua)}

/* the 3D view */
.bt-view{position:relative;min-height:min(80vh,800px);border-radius:26px;overflow:hidden;background:radial-gradient(ellipse 60% 46% at 50% 40%,color-mix(in srgb,var(--bp) 12%,#22262B) 0,#141619 55%,#0B0C0E 100%);box-shadow:inset 0 0 0 1px var(--line);perspective:1500px;perspective-origin:50% 22%;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.bt-view.grab{cursor:grabbing}
.bt-cam{position:absolute;left:50%;top:63%;width:0;height:0;transform-style:preserve-3d;will-change:transform}
.bt-scene{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d}
.bt-scene *{transform-style:preserve-3d}
.bx,.grp,.el{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d}
.f{position:absolute;left:0;top:0;display:block;background:var(--fc,#E9EAEC);backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.f::after{content:"";position:absolute;inset:0;pointer-events:none}
.f.fr::after{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(0,0,0,.1))} .f.rt::after{background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.24))} .f.lf::after{background:linear-gradient(180deg,rgba(0,0,0,.22),rgba(0,0,0,.38))} .f.bk::after{background:rgba(0,0,0,.36)} .f.tp::after{background:rgba(255,255,255,.1)} .f.bt::after{background:rgba(0,0,0,.5)}
.pl{position:absolute;left:0;top:0;backface-visibility:visible}
.bt-venue{position:absolute;left:0;top:0;width:1600px;height:1600px;transform:translate(-50%,-50%) rotateX(90deg);background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 80px),repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 80px);-webkit-mask-image:radial-gradient(circle,#000 20%,transparent 62%);mask-image:radial-gradient(circle,#000 20%,transparent 62%)}
.bt-shadow{position:absolute;left:0;top:0;transform:translate(-50%,-50%) rotateX(90deg) translateZ(.5px);background:radial-gradient(ellipse at center,rgba(0,0,0,.55),transparent 68%)}

/* shell */
.plat .f{--fc:color-mix(in srgb,var(--bp) 16%,#191B1F)}
.plat .f.tp{--fc:color-mix(in srgb,var(--bp) 22%,#24272C)}
.carpet{position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.025) 0 2px,transparent 2px 7px)}
.wall .f{--fc:#F1F2F4}
.wall.back .f.fr{--fc:#F4F5F7}
.wallgfx{position:absolute;inset:0;background:linear-gradient(118deg,transparent 0 46%,var(--bp) 46% 72%,color-mix(in srgb,var(--bp) 70%,#000) 72% 78%,transparent 78%),linear-gradient(118deg,transparent 0 80%,var(--ba) 80%)}
.wallgfx.side{background:linear-gradient(180deg,transparent 0 62%,var(--bp) 62% 86%,var(--ba) 86%)}
.bt-logo{display:flex;align-items:center;justify-content:center;font:800 14px/1 'InterV','Plex Arabic',sans-serif;letter-spacing:.06em;text-align:center;white-space:nowrap;overflow:hidden}
.bt-logo img{max-width:100%;max-height:100%;object-fit:contain}
.bt-logo.lg-wm{position:absolute;left:5%;top:7%;width:34%;height:13%;color:#1A1C20;justify-content:flex-start}
.bt-logo.lg-wm img{object-position:left center}
.tower .f{--fc:var(--bp)}
.bt-logo.lg-tw{position:absolute;inset:14% 8%;color:var(--bpt);font-size:11px;writing-mode:vertical-rl}
.bt-logo.lg-tw img{writing-mode:horizontal-tb;max-height:none;max-width:100%}

/* elements */
.counter .f{--fc:var(--bp)}
.counter .f.tp{--fc:#F7F7F8}
.bt-logo.lg-ct{position:absolute;inset:14% 10% 26%;color:var(--bpt);font-size:15px}
.edge{position:absolute;left:0;right:0;bottom:6px;height:3px;background:var(--ba);box-shadow:0 0 10px var(--ba),0 0 22px var(--ba)}
.ctop{position:absolute;inset:0;border-bottom:3px solid var(--ba)}
.fascia .f{--fc:var(--bp)}
.bt-logo.lg-fs{position:absolute;inset:10% 6%;color:var(--bpt);font-size:16px}
.fascia.hang .f{--fc:var(--bp)}
.led{background:#08090B;border:4px solid #15171A;box-sizing:border-box;box-shadow:0 0 34px color-mix(in srgb,var(--bp) 45%,transparent)}
.scr{position:absolute;inset:0;overflow:hidden;background:linear-gradient(120deg,color-mix(in srgb,var(--bp) 70%,#000),#08090B 60%,color-mix(in srgb,var(--ba) 50%,#000))}
.scr .sweep{position:absolute;inset:-40%;background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.22) 50%,transparent 60%);animation:btSweep 3.6s linear infinite}
@keyframes btSweep{from{transform:translateX(-60%)}to{transform:translateX(60%)}}
.bt-logo.lg-led{position:absolute;inset:22% 14%;color:#fff;font-size:20px;text-shadow:0 0 12px rgba(255,255,255,.4)}
.bt-logo.lg-led img{filter:drop-shadow(0 0 8px rgba(255,255,255,.35))}
.live{position:absolute;right:8px;top:7px;width:7px;height:7px;border-radius:50%;background:#FF4D4D;box-shadow:0 0 8px #FF4D4D;animation:btLive 1.2s ease-in-out infinite}
@keyframes btLive{50%{opacity:.3}}
.gfx{background:var(--ba)}
.gfxin{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.bt-logo.lg-gf{width:80%;height:30%;color:var(--bat);font-size:11px}
.bars{display:block;width:60%;height:24px;background:repeating-linear-gradient(180deg,var(--bp) 0 4px,transparent 4px 9px)}
.rbase .f{--fc:#2B2E33}
.roll{background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.rin{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;padding-top:10px;background:linear-gradient(180deg,#fff 0 58%,var(--bp) 58%)}
.bt-logo.lg-rl{width:84%;height:24px;color:#1A1C20;font-size:9px}
.r1,.r2{display:block;width:70%;height:6px;margin-top:10px;border-radius:3px;background:var(--ba)}
.r2{width:46%;margin-top:6px;opacity:.6}
.totem .f{--fc:#1A1C20}
.scr.t .sweep{animation-duration:2.8s}
.bt-logo.lg-tt{position:absolute;inset:30% 8%;color:#fff;font-size:8px;writing-mode:vertical-rl}
.bt-logo.lg-tt img{writing-mode:horizontal-tb}
.chair .f{--fc:#E7E8EA}
.chair.back .f{--fc:color-mix(in srgb,var(--bp) 80%,#fff)}
.cush{position:absolute;inset:3px;border-radius:4px;background:color-mix(in srgb,var(--bp) 80%,#fff)}
.leg .f{--fc:#2A2C30}
.table .f{--fc:#F2F3F5}
.ttop{position:absolute;inset:0;border-radius:50%;background:#fff}
.pot .f{--fc:#E9E9E9}
.leaf{background:radial-gradient(circle at 50% 62%,#3F9E5A 0 30%,transparent 31%),radial-gradient(circle at 30% 45%,#4CB36A 0 22%,transparent 23%),radial-gradient(circle at 70% 42%,#35894E 0 24%,transparent 25%),radial-gradient(circle at 50% 22%,#58BF74 0 20%,transparent 21%)}
.leaf.s{background:radial-gradient(circle at 50% 55%,#46A862 0 34%,transparent 35%),radial-gradient(circle at 35% 30%,#5CC578 0 22%,transparent 23%)}
.spot .f{--fc:#202226}
.cone{background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,0) 80%);clip-path:polygon(44% 0,56% 0,100% 100%,0 100%);mix-blend-mode:screen;pointer-events:none}

/* slots and selection */
.bt-scene .f,.bt-scene .pl,.bt-venue,.bt-shadow{pointer-events:none}
.bt-scene .el .f,.bt-scene .el .pl{pointer-events:auto}
.dragging .bt-scene .el .f,.dragging .bt-scene .el .pl{pointer-events:none}
.bt-slot{position:absolute;left:0;top:0;pointer-events:none;opacity:0;transition:opacity .2s}
.bt-slot span{pointer-events:none}
.bt-slot.floor{width:110px;height:90px}
.bt-slot.head{width:240px;height:80px}
.bt-slot span{position:absolute;inset:0;border-radius:12px;border:2.5px dashed rgba(255,255,255,.85);background:rgba(255,255,255,.08)}
.dragging .bt-slot.ok{opacity:1;pointer-events:auto}
.bt-slot.over span{background:rgba(255,255,255,.32);border-style:solid;box-shadow:0 0 30px rgba(255,255,255,.6)}
.bt-slot.hit{opacity:1}
.bt-slot.hit span{border-style:solid;background:rgba(255,255,255,.4);animation:btHit .5s ease-out forwards}
@keyframes btHit{to{opacity:0;transform:scale(1.25)}}
.el{cursor:grab}
.el.sel .f,.el.sel .pl{outline:2px solid var(--aqua);outline-offset:-2px}
.bt-ui{position:absolute;left:18px;right:18px;bottom:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none;z-index:3}
.bt-ui > *{pointer-events:auto}
.bt-hint{margin:0;padding:9px 14px;border-radius:999px;background:rgba(14,15,17,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:12.5px;color:var(--muted)}
.bt-badge{white-space:nowrap;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;background:rgba(14,15,17,.7);font-size:12.5px;font-weight:600;color:var(--ink)}
.bt-badge b{color:var(--aqua)}
#btGhost{position:fixed;left:0;top:0;z-index:95;display:flex;align-items:center;gap:8px;padding:8px 12px 8px 8px;margin:-24px 0 0 -24px;border-radius:12px;background:var(--aqua);color:var(--ground);font-size:13px;font-weight:700;pointer-events:none;opacity:0;box-shadow:0 20px 40px -10px rgba(255,255,255,.5)}
#btGhost.on{opacity:1}
#btGhost .ic{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(14,15,17,.15)}
#btGhost .fa{height:13px}
#btToast{position:absolute;left:50%;top:18px;z-index:4;transform:translate(-50%,-10px);padding:10px 16px;border-radius:999px;background:var(--ink);color:var(--ground);font-size:13px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
#btToast.on{opacity:1;transform:translate(-50%,0)}

@media (max-width:1100px){
  .booth{grid-template-columns:1fr}
  .bt-view{min-height:62vh;order:-1}
  .bt-panel .h2{font-size:clamp(36px,6vw,60px)}
}
@media (max-width:720px){
  .bt-view{min-height:58vh;border-radius:20px}
  .bt-pal{grid-template-columns:repeat(3,1fr)}
  .bt-hint{display:none}
  .bt-id{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.scr .sweep,.live{animation:none}}

/* WebGL stand (booth3d.js): the canvas fills the view; tools float on top */
.bt-gl{position:absolute;inset:0;width:100%!important;height:100%!important;display:block}
#booth.gl .bt-view{background:#0A0A0A;touch-action:pan-y}
.bt-load{position:absolute;left:50%;top:50%;margin:0;transform:translate(-50%,-50%);font-size:13px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#6E6E6E;white-space:nowrap}
html[lang="ar"] .bt-load{letter-spacing:0}
#booth.gl .bt-load{display:none}
.bt-tools{position:absolute;left:16px;right:16px;top:14px;z-index:3;display:flex;flex-wrap:wrap;align-items:center;gap:8px;pointer-events:none}
#booth:not(.gl) .bt-tools{display:none}
.bt-tools > *{pointer-events:auto}
.bt-views{display:inline-flex;gap:3px;padding:4px;border-radius:999px;background:rgba(14,15,17,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.bt-views button{height:32px;padding:0 14px;border-radius:999px;font-size:12.5px;font-weight:600;color:#A6A6A6;transition:background .25s,color .25s}
.bt-views button.on{background:#fff;color:#0A0A0A}
.bt-tool{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 15px;border-radius:999px;background:rgba(14,15,17,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);font-size:12.5px;font-weight:600;color:#D9D9D9;transition:background .25s,color .25s}
.bt-tool .fa{height:13px}
.bt-tool:hover{color:#fff}
.bt-tool.on{background:#fff;color:#0A0A0A}
#btShot{margin-inline-start:auto}
@media (max-width:720px){
  .bt-tools{left:10px;right:10px;top:10px;gap:6px}
  .bt-views button{padding:0 10px;font-size:12px}
  .bt-tool{width:40px;padding:0;justify-content:center}
  .bt-tool span:last-child{display:none}
}
@media (max-width:720px){
  .bt-tools{gap:5px;flex-wrap:nowrap}
  .bt-views{padding:3px;gap:2px}
  .bt-views button{height:30px;padding:0 8px;font-size:11.5px}
  .bt-tool{width:36px;height:36px}
}