/* ============================================================
   Reference UI v120 — premium Arabic board-game presentation
   Built from live DOM/game state; no screenshot-as-interface.
   ============================================================ */
:root{
  --r-sky:#14aef1;
  --r-sky2:#0787d4;
  --r-navy:#031a2d;
  --r-navy2:#072a46;
  --r-navy3:#0c385a;
  --r-gold:#f5bc2e;
  --r-gold2:#ffe78b;
  --r-gold3:#9b6208;
  --r-cyan:#36e8ff;
  --r-cream:#fff4d8;
  --r-ink:#3b280e;
  --r-line:rgba(247,193,58,.72);
  --r-glass:rgba(3,27,47,.94);
  --r-shadow:0 14px 34px rgba(0,30,54,.38);
}
.reference-v120{font-family:"Cairo",sans-serif;background:#079be1}
.reference-v120 .splash,
.reference-v120 .table-screen{
  background:
    radial-gradient(circle at 50% 16%,rgba(255,255,255,.22),transparent 28%),
    linear-gradient(180deg,rgba(22,184,245,.08),rgba(0,104,171,.18)),
    url("../img/sky-cartoon.webp") center/cover fixed !important;
}
.reference-v120 .splash::before,.reference-v120 .table-screen::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.18),transparent 30%),linear-gradient(90deg,rgba(255,255,255,.05),transparent 20% 80%,rgba(255,255,255,.05));
}
.reference-v120 .splash-card{position:relative;z-index:1}

/* ---------------- LOBBY ---------------- */
.ref-lobby-badge,.ref-lobby-actions{display:none}
.reference-v120 .splash-card.lobby-open{
  width:min(1240px,94vw)!important;max-width:none!important;min-height:min(890px,94vh);
  margin:18px auto!important;padding:26px 34px 28px!important;overflow:visible!important;
  border:3px solid var(--r-gold)!important;border-radius:34px!important;
  background:
    linear-gradient(150deg,rgba(15,58,89,.52),transparent 28%),
    linear-gradient(180deg,#082d4beF,#031a2df8 72%,#031522fa)!important;
  box-shadow:0 22px 0 rgba(92,56,5,.34),0 36px 75px rgba(0,26,46,.55),inset 0 0 0 2px rgba(255,241,172,.48),inset 0 0 45px rgba(66,228,255,.06)!important;
  text-align:center;
}
.reference-v120 .splash-card.lobby-open::before{
  content:"";position:absolute;inset:8px;border:1px solid rgba(255,224,122,.36);border-radius:26px;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)
}
.reference-v120 .splash-card.lobby-open::after{
  content:"";position:absolute;left:4%;right:4%;top:0;height:3px;border-radius:50%;background:linear-gradient(90deg,transparent,#fff6bd 30%,#fff 50%,#ffd96b 70%,transparent);filter:blur(.2px);opacity:.9;pointer-events:none
}
.reference-v120 .splash-card.lobby-open .ref-lobby-badge{display:flex;position:absolute;top:26px;left:28px;z-index:5;align-items:center;gap:10px;padding:8px 14px;border:1px solid var(--r-line);border-radius:16px;background:linear-gradient(180deg,#0a3455,#041d33);box-shadow:0 7px 18px #00162a88,inset 0 0 0 1px #ffffff10;text-align:right}
.ref-lobby-badge>span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:2px solid var(--r-gold);color:#ffe47f;font-size:20px;background:#0c3552;box-shadow:0 0 16px #ffd75f33}
.ref-lobby-badge b{display:block;color:#ffe78e;font-size:13px}.ref-lobby-badge small{display:block;color:#d9edf9;font-size:9px;letter-spacing:.04em}
.reference-v120 .splash-card.lobby-open .ref-lobby-actions{display:flex;position:absolute;top:22px;right:28px;z-index:5;gap:18px}
.ref-lobby-actions button{border:0;background:none;color:#fff;font:800 11px Cairo,sans-serif;display:grid;gap:4px;justify-items:center}
.ref-lobby-actions button span{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-size:23px;background:linear-gradient(180deg,#0b4062,#06243c);border:2px solid #ffd85e;box-shadow:0 5px 0 #74470b,0 0 0 3px #18d9ef35,0 10px 18px #00152588;transition:.18s ease}
.ref-lobby-actions button:hover span{transform:translateY(-2px) scale(1.04);filter:brightness(1.12)}

.reference-v120 .splash-card.lobby-open .splash-heroes{margin:0 auto 2px!important;min-height:58px;gap:4px;flex-wrap:nowrap;width:max-content;max-width:55%;position:relative;z-index:3}
.reference-v120 .splash-card.lobby-open .splash-heroes img{width:52px!important;height:52px!important;margin:0 -3px!important;border:2px solid #f3c44e!important;box-shadow:0 4px 0 #75480d,0 8px 14px #001425aa!important;transition:.18s ease}
.reference-v120 .splash-card.lobby-open .splash-heroes img:hover{transform:translateY(-4px);filter:brightness(1.08)}
.reference-v120 .splash-card.lobby-open .kicker{display:none!important}
.reference-v120 .splash-card.lobby-open h1{margin:2px auto 2px!important;font-size:clamp(48px,4.5vw,72px)!important;line-height:.98!important;letter-spacing:-.04em;color:#fdd25a!important;background:linear-gradient(180deg,#fff2aa 0,#ffd45a 33%,#f7b62f 58%,#bd7609 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 5px 0 rgba(125,70,5,.8),0 9px 18px rgba(0,0,0,.48),0 0 22px rgba(255,201,65,.18)!important;filter:drop-shadow(0 1px 0 #fff8c7);width:max-content;max-width:72%}
.reference-v120 .splash-card.lobby-open h1::before{content:"رحلة";display:block;font-size:.34em;line-height:1.05;color:#fff6cc;-webkit-text-fill-color:#fff6cc;text-shadow:0 2px 3px #001c32!important;letter-spacing:0;margin-bottom:5px}
.reference-v120 .splash-card.lobby-open .classic-title-mark{font-size:.34em!important;margin-inline-start:16px!important;vertical-align:middle!important;border-radius:9px!important;padding:5px 16px 7px!important;background:linear-gradient(#ffe97e,#eba925)!important;color:#533100!important;-webkit-text-fill-color:#533100!important;border:1px solid #fff1a2!important;box-shadow:0 4px 0 #8d570d,0 7px 14px #00182766,inset 0 1px #fff8cb!important}
.reference-v120 .splash-card.lobby-open .lead{margin:8px auto!important;max-width:820px!important;font-size:12px!important;line-height:1.65!important;color:#eef8ff!important}
.reference-v120 .splash-card.lobby-open .classic-unofficial{display:none!important}
.reference-v120 .splash-card.lobby-open .hero-badges{display:flex!important;justify-content:center;gap:7px!important;flex-wrap:wrap;margin:8px auto 12px!important;max-width:990px}
.reference-v120 .splash-card.lobby-open .hero-badges span{min-height:32px!important;padding:6px 13px!important;border:1px solid rgba(245,188,46,.63)!important;border-radius:9px!important;background:linear-gradient(180deg,#0a3452,#041d32)!important;color:#f8fbff!important;font-size:10px!important;box-shadow:0 4px 8px #00152655,inset 0 0 12px #3be8ff08!important}

.reference-v120 .splash-card.lobby-open .auth-user{margin:4px 0 8px!important;min-height:70px;padding:10px 16px!important;border:1px solid #f2bd39!important;border-radius:16px!important;background:linear-gradient(90deg,#06253d,#082f4c)!important;box-shadow:inset 0 0 0 1px #ffffff0e,0 7px 15px #00132255!important}
.reference-v120 .splash-card.lobby-open .auth-user>div{display:grid;grid-template-columns:auto auto;column-gap:12px;align-items:center;text-align:right}
.reference-v120 .splash-card.lobby-open .auth-user b{font-size:18px!important;color:#ffe478!important}.reference-v120 .splash-card.lobby-open .auth-user b::after{content:"  ●";color:#22e4a8;font-size:10px}
.reference-v120 .splash-card.lobby-open .auth-user small{font-size:10px!important;color:#d7edf9!important}.reference-v120 .splash-card.lobby-open .auth-user .ghost{min-width:84px;border:1px solid #dcae3c!important;background:#08243b!important;box-shadow:0 4px 0 #63410f!important}
.reference-v120 .splash-card.lobby-open .season-chip{display:none!important}

.reference-v120 .splash-card.lobby-open .lobby-hub{margin:8px 0 12px!important;padding:0!important;background:transparent!important;border:0!important;display:grid!important;grid-template-columns:repeat(9,minmax(0,1fr))!important;gap:7px!important}
.reference-v120 .splash-card.lobby-open .hub-tab{height:42px!important;min-height:42px!important;border-radius:10px!important;border:1px solid #c99a2e!important;background:linear-gradient(180deg,#0b3553,#061f36)!important;color:#f2f7fb!important;font-size:10px!important;box-shadow:0 4px 0 #4f340d,0 6px 11px #00111e55!important;transition:.16s ease!important}
.reference-v120 .splash-card.lobby-open .hub-tab:hover{transform:translateY(-1px);filter:brightness(1.1)}
.reference-v120 .splash-card.lobby-open .hub-tab.on{background:linear-gradient(180deg,#ffe982,#f2b62f 58%,#d4900f)!important;color:#422900!important;border-color:#fff0a0!important;box-shadow:0 4px 0 #8c580c,0 0 18px #ffd95d66!important}
.reference-v120 .splash-card.lobby-open #hubPlay{display:grid!important;grid-template-columns:320px minmax(0,1fr)!important;grid-template-rows:auto auto auto auto auto auto auto!important;gap:8px 18px!important;align-items:start!important;text-align:right}
.reference-v120 .splash-card.lobby-open #hubPlay>.otp-hint{grid-column:2;grid-row:1;margin:2px 0 4px!important;text-align:center;color:#4de8ff!important;font-size:12px!important}
.reference-v120 .splash-card.lobby-open #hubPlay>.char-pick{grid-column:2;grid-row:2/8!important;margin:0!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:9px!important}
.reference-v120 .splash-card.lobby-open .char-card{position:relative!important;min-height:146px!important;height:146px!important;padding:5px 6px 8px!important;overflow:hidden!important;border-radius:11px!important;background:linear-gradient(180deg,#0d3857,#06223a)!important;border:1px solid rgba(234,185,55,.55)!important;box-shadow:0 6px 0 #031525,0 9px 18px #00101e66,inset 0 0 0 1px #ffffff0b!important;text-align:center!important}
.reference-v120 .splash-card.lobby-open .char-card img{display:block!important;width:100%!important;height:103px!important;max-height:none!important;object-fit:cover!important;object-position:center 18%!important;border-radius:8px!important;margin:0!important;background:#08243c!important}
.reference-v120 .splash-card.lobby-open .char-card b{font-size:12px!important;line-height:1.1!important;color:#fff!important;margin:4px 0 2px!important}.reference-v120 .splash-card.lobby-open .char-card span{font-size:8px!important;line-height:1.2!important;color:#c8e6f5!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reference-v120 .splash-card.lobby-open .char-card.on{transform:translateY(-2px) scale(1.015)!important;border-color:#fff0a0!important;box-shadow:0 0 0 2px #ffe57866,0 0 22px #ffd34842,0 7px 0 #60400d!important}.reference-v120 .splash-card.lobby-open .char-card.on::after{content:"";position:absolute;left:22%;right:22%;bottom:0;height:3px;background:#35eaff;box-shadow:0 0 10px #35eaff}
.reference-v120 .splash-card.lobby-open #hubPlay>.field,.reference-v120 .splash-card.lobby-open #hubPlay>.mode-hint,.reference-v120 .splash-card.lobby-open #hubPlay>.lobby-seats,.reference-v120 .splash-card.lobby-open #hubPlay>#resumeBtn,.reference-v120 .splash-card.lobby-open #hubPlay>#startBtn{grid-column:1!important}
.reference-v120 .splash-card.lobby-open #hubPlay>.match-mode-field{grid-row:1!important}.reference-v120 .splash-card.lobby-open #hubPlay>.mode-hint{grid-row:2!important}.reference-v120 .splash-card.lobby-open #hubPlay>.human-count-field{grid-row:3!important}.reference-v120 .splash-card.lobby-open #hubPlay>.cpu-count-field{grid-row:4!important}.reference-v120 .splash-card.lobby-open #hubPlay>.lobby-seats{grid-row:5!important}.reference-v120 .splash-card.lobby-open #hubPlay>#resumeBtn{grid-row:6!important}.reference-v120 .splash-card.lobby-open #hubPlay>#startBtn{grid-row:7!important}
.reference-v120 .splash-card.lobby-open #hubPlay>.field{margin:0!important;color:#5cecff!important;font-size:10px!important;font-weight:900!important}.reference-v120 .splash-card.lobby-open #hubPlay select{height:39px!important;padding:5px 10px!important;border-radius:9px!important;border:1px solid #d2a438!important;background:linear-gradient(180deg,#0a2d47,#061d31)!important;font-size:11px!important}
.reference-v120 .splash-card.lobby-open .mode-hint{font-size:8px!important;color:#9eeaaa!important;line-height:1.45!important}
.reference-v120 .splash-card.lobby-open .lobby-seats{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important}.reference-v120 .splash-card.lobby-open .seat{min-height:42px!important;padding:4px 7px!important;border-radius:9px!important;background:#082b45!important;border:1px solid #b98b27!important}.reference-v120 .splash-card.lobby-open .seat img{width:30px!important;height:30px!important}.reference-v120 .splash-card.lobby-open .seat b{font-size:9px!important}.reference-v120 .splash-card.lobby-open .seat span{font-size:7px!important}
.reference-v120 .splash-card.lobby-open #startBtn{height:56px!important;margin-top:3px!important;font-size:19px!important;border-radius:18px!important;position:relative;overflow:hidden!important;box-shadow:0 6px 0 #8b560b,0 0 22px #ffd44a5c,0 12px 24px #00101f66!important}.reference-v120 .splash-card.lobby-open #startBtn::before{content:"🎲";font-size:25px;margin-inline-end:9px}
.reference-v120 .splash-card.lobby-open #resumeBtn{height:36px!important;font-size:11px!important;padding:5px 10px!important}

/* ---------------- TABLE LAYOUT ---------------- */
.reference-v120 .table-screen{overflow:hidden!important;isolation:isolate}
.reference-v120 .ambient3d-canvas{opacity:.25!important}
.reference-v120 .stage#stage3d{height:100svh!important;min-height:100svh!important;padding:105px 292px 112px!important;display:grid!important;place-items:center!important;z-index:4!important;perspective:1500px!important;pointer-events:none}
.reference-v120 .board-scene{pointer-events:auto;width:min(calc(100svh - 208px),calc(100vw - 600px),820px)!important;--cam-rx:7deg!important;--cam-scale:.98!important;--cam-y:8px!important;filter:drop-shadow(0 28px 22px rgba(0,42,65,.32))}
.reference-v120 .board{border-radius:18px!important;padding:8px!important;background:linear-gradient(145deg,#593718,#2b190b 56%,#4b2c13)!important;box-shadow:0 16px 0 #1b0d05,0 24px 0 #70420f,0 34px 42px #00304b55,inset 0 0 0 3px #fff0a1,inset 0 0 0 9px #f2b62d,inset 0 0 0 14px #805018!important}
.reference-v120 .tile-3d{inset:1px 2px 9px!important;border-radius:7px!important;background:linear-gradient(180deg,#fffdf6 0,#fff0cf 65%,#e5c78a 100%)!important;color:#2d210e!important;box-shadow:0 9px 0 #75501f,0 13px 12px rgba(0,0,0,.32),inset 0 1px 0 #fff!important;border:1px solid rgba(115,76,25,.28)!important}
.reference-v120 .tile:hover .tile-3d{transform:translateZ(5px);filter:brightness(1.05)}
.reference-v120 .tile .plate{font-size:clamp(7px,.68vw,10px)!important;background:linear-gradient(180deg,#fffaf0f2,#f8e6c2f2)!important;border-color:#a97e39!important;color:#35240d!important}
.reference-v120 .tile .plate b{font-size:1em!important}.reference-v120 .tile .ico-img{filter:drop-shadow(0 4px 2px rgba(75,41,8,.28))!important}
.reference-v120 .center.classic-world-center{margin:2.8%!important;border-radius:18px!important;background:url("../img/board-center.webp") center/cover no-repeat!important;box-shadow:inset 0 0 0 4px #fff0a0,inset 0 0 0 10px #f2b52c,inset 0 0 0 15px #7c4b11,0 10px 18px #0005!important;overflow:hidden!important}
.reference-v120 .v82-center-art{display:none!important}.reference-v120 .classic-center-brand{position:absolute!important;top:4%!important;left:50%!important;transform:translateX(-50%)!important;min-width:210px!important;padding:7px 20px!important;border-radius:18px!important;background:linear-gradient(180deg,#0b3858f5,#061f36f7)!important;border:2px solid #f0bf39!important;box-shadow:0 5px 0 #70440c,0 9px 16px #001b2d88!important;z-index:15!important}.reference-v120 .classic-center-brand small,.reference-v120 .classic-center-brand span{display:none!important}.reference-v120 .classic-center-brand b{font-size:20px!important;color:#fff5bd!important;text-shadow:0 2px 2px #001827!important}
.reference-v120 .classic-center-dice{position:absolute!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%) scale(.72)!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;z-index:14!important}.reference-v120 .classic-world-center .banner{display:none!important}

/* Side rails */
.ref-game-rail{position:absolute;top:148px;bottom:130px;z-index:35;width:232px;display:flex;flex-direction:column;gap:14px;pointer-events:auto}.ref-left-rail{left:28px}.ref-right-rail{right:28px}
.ref-glass-panel{background:linear-gradient(180deg,rgba(9,49,77,.96),rgba(3,28,48,.97));border:2px solid rgba(236,187,55,.88);border-radius:20px;box-shadow:0 7px 0 rgba(111,70,12,.78),0 13px 24px rgba(0,31,52,.36),inset 0 0 0 1px rgba(255,255,255,.08);overflow:hidden}
.ref-glass-panel h3{margin:0;padding:10px 12px;color:#ffd85f;font-size:15px;text-align:center;border-bottom:1px solid rgba(239,187,53,.35);background:linear-gradient(180deg,rgba(14,65,99,.75),rgba(4,32,53,.55));text-shadow:0 2px #042038}
.ref-quick-panel{padding-bottom:8px}.ref-quick-panel button{width:calc(100% - 14px);margin:7px 7px 0;min-height:48px;display:grid;grid-template-columns:42px 1fr;align-items:center;border-radius:10px;border:1px solid rgba(231,181,49,.45);background:linear-gradient(180deg,#0e3b5d,#072842);color:#fff;box-shadow:inset 0 1px #ffffff0c,0 3px 0 #032033;text-align:right;font:900 13px Cairo,sans-serif;transition:.15s ease}.ref-quick-panel button i{font-style:normal;font-size:23px;text-align:center}.ref-quick-panel button:hover:not(:disabled){transform:translateY(-1px);border-color:#ffe274;filter:brightness(1.08)}.ref-quick-panel button:disabled{opacity:.42;filter:saturate(.45)}
.ref-events-panel{margin-top:auto}.ref-events-panel #refWorldEvents{padding:5px 7px 9px}.ref-event-row{display:grid;grid-template-columns:42px 1fr;align-items:center;gap:7px;padding:8px 4px;border-bottom:1px solid rgba(255,255,255,.08)}.ref-event-row:last-child{border-bottom:0}.ref-event-row i{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;background:#0a2942;font-style:normal;font-size:22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}.ref-event-row b{display:block;color:#ffe06f;font-size:11px}.ref-event-row span{display:block;color:#d5e7f2;font-size:8px}.ref-event-row.active{background:linear-gradient(90deg,rgba(55,231,255,.12),transparent);border-radius:8px;box-shadow:inset 3px 0 var(--r-cyan)}
.ref-city-panel{flex:0 0 auto}.ref-city-body{padding:10px;display:grid;grid-template-columns:82px 1fr;gap:9px;align-items:start}.ref-city-art{height:106px;border-radius:11px;overflow:hidden;background:linear-gradient(#28c3f1,#e9faff);border:1px solid #ffd963;box-shadow:inset 0 0 12px #fff9,0 5px 12px #00192f66;display:grid;place-items:end center}.ref-city-art img{width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 6px 4px #00334b55)}.ref-city-meta b{display:block;font-size:17px;color:#fff;margin-bottom:6px}.ref-city-meta span{display:block;font-size:10px;color:#e7f3fa;margin:5px 0}.ref-city-meta strong{color:#83f46e}.ref-city-progress{height:7px;border-radius:20px;background:#001d31;margin-top:8px;overflow:hidden;border:1px solid #ffffff16}.ref-city-progress i{display:block;height:100%;background:linear-gradient(90deg,#28e6ff,#ffe15c);box-shadow:0 0 9px #2fe8ff88}
.ref-ranking-panel{flex:1 1 auto;min-height:0}.ref-ranking-panel #refPlayerRanking{padding:6px 8px}.ref-rank-row{display:grid;grid-template-columns:26px 38px 1fr auto;align-items:center;gap:6px;min-height:45px;border-bottom:1px solid rgba(255,255,255,.07)}.ref-rank-row:last-child{border-bottom:0}.ref-rank-row>i:first-child{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--pc,#d99b20);border:1px solid #ffe88e;color:#fff;font-style:normal;font-weight:900;font-size:10px;box-shadow:0 0 7px color-mix(in srgb,var(--pc) 65%,transparent)}.ref-rank-row img{width:35px;height:35px;border-radius:50%;object-fit:cover;border:1px solid #e4b441;background:#062239}.ref-rank-row b{font-size:11px;color:#fff}.ref-rank-row span{font-size:10px;color:#ffe36b;font-weight:900;direction:ltr}.ref-rank-row.current{background:linear-gradient(90deg,transparent,#34e7ff12);border-radius:8px}

/* Top player HUD / center tools */
.reference-v120 .hud-players{top:17px!important;left:24px!important;right:24px!important;z-index:46!important}.reference-v120 .hud-col{width:238px!important;gap:7px!important}.reference-v120 .phud{width:238px!important;min-width:238px!important;max-width:238px!important;height:88px!important;padding:6px 9px!important;border-radius:15px!important;background:linear-gradient(180deg,#0a3655f6,#05243cf8)!important;border:2px solid #f0bd37!important;box-shadow:0 5px 0 #70450d,0 10px 18px #00182b66!important}.reference-v120 .phud>img{width:61px!important;height:72px!important;margin:0!important;border-radius:11px!important}.reference-v120 .phud-meta>b{font-size:14px!important}.reference-v120 .phud .cash-coin{font-size:12px!important}.reference-v120 .phud .worth{font-size:9px!important}.reference-v120 .phud .laps,.reference-v120 .phud .char-lv,.reference-v120 .phud .xp-bar,.reference-v120 .phud .phud-cards,.reference-v120 .phud .phud-dots{display:none!important}
.reference-v120 .classic-top-center{top:10px!important;z-index:47!important;display:flex!important;flex-direction:column!important;align-items:center!important}.reference-v120 .classic-top-center .round-chip{font-size:15px!important;min-width:180px!important;padding:10px 24px!important;border-radius:12px!important;border:2px solid #fff0a1!important;background:linear-gradient(180deg,#ffe88a,#f1b82e 60%,#d78e0c)!important;box-shadow:0 5px 0 #7d4b0b,0 10px 18px #00182c55!important}.reference-v120 .classic-stage-bar{margin-top:6px!important;border-radius:13px!important;padding:3px!important;background:#062641f0!important;border:1px solid #d2a43c!important;box-shadow:0 4px 0 #50350e!important}.reference-v120 .classic-stage-bar b,.reference-v120 .classic-stage-bar span{font-size:9px!important;padding:4px 10px!important}
.ref-top-tools{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:46;width:520px;display:flex;justify-content:space-between;pointer-events:none}.ref-top-tools button{pointer-events:auto;width:62px;height:62px;border-radius:50%;border:2px solid #f3c33f;background:linear-gradient(180deg,#0b3858,#06233b);color:#ffe36d;box-shadow:0 5px 0 #70460d,0 9px 16px #00182766;font:900 9px Cairo,sans-serif;display:grid;place-items:center;padding:5px}.ref-top-tools button i{font-style:normal;font-size:20px;line-height:1}.ref-top-tools button span{font-size:8px;color:#fff}
.reference-v120 .book-btn,.reference-v120 .quit-btn{display:none!important}

/* Bottom control bar */
.reference-v120 .hud-dice{bottom:13px!important;width:min(780px,calc(100vw - 600px))!important;z-index:48!important}.reference-v120 .dice-hud{height:94px!important;width:100%!important;padding:8px 12px!important;gap:10px!important;border-radius:17px!important;border:2px solid #e7b534!important;background:linear-gradient(180deg,#0c3858f8,#051f35fb)!important;box-shadow:0 6px 0 #6c430d,0 11px 22px #00172a77,inset 0 0 0 1px #ffffff0e!important;align-items:center!important}.reference-v120 .classic-dice-caption{display:none!important}.reference-v120 .roll-orb{order:-5;width:155px!important;height:70px!important;border-radius:15px!important;font-size:27px!important;background:linear-gradient(180deg,#fff09b,#ffc948 45%,#e29a12)!important;border:2px solid #fff0a4!important;color:#4b2b05!important;box-shadow:0 6px 0 #86520a,0 0 20px #ffd64a55,inset 0 2px #fff9cb!important}.reference-v120 .roll-orb::after{content:"اضغط لرمي النرد";display:block;font-size:8px;margin-top:1px}.reference-v120 .dice-pair{order:-4;gap:9px!important}.reference-v120 .die3d,.reference-v120 .die{width:57px!important;height:57px!important}.reference-v120 .gauge-wrap{order:-3;width:116px!important;padding:4px 6px;border:1px solid #b7892c;border-radius:11px;background:#05243b}.reference-v120 .gauge{height:14px!important}.reference-v120 .gauge-labels{font-size:7px!important}.reference-v120 .side-items{order:-2;display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important}.reference-v120 .item-btn{height:50px!important;min-width:68px!important;padding:5px 8px!important;border-radius:11px!important;font-size:9px!important;border:1px solid #e4b13b!important;box-shadow:0 4px 0 #48320f!important}.reference-v120 .item-btn.risk{background:linear-gradient(180deg,#ffcf55,#be7c0d)!important;color:#422600!important}.reference-v120 .item-btn:not(.risk){background:linear-gradient(180deg,#174e75,#082d4a)!important;color:#fff!important}.reference-v120 .item-btn.even{background:linear-gradient(180deg,#2198e6,#0b5b99)!important}.reference-v120 .dice-hud>.ghost,.reference-v120 .dice-hud>.bank-loan{height:50px!important;min-width:74px!important;font-size:8px!important;padding:5px 7px!important;border-radius:10px!important}
.ref-bottom-left,.ref-bottom-right{position:absolute;bottom:14px;z-index:48;display:flex;gap:6px}.ref-bottom-left{left:29px}.ref-bottom-right{right:29px}.ref-bottom-left button,.ref-bottom-right button{position:relative;min-width:60px;height:72px;border:1px solid #d9aa35;border-radius:12px;background:linear-gradient(180deg,#0b3857,#051f35);color:#fff;box-shadow:0 4px 0 #51350e,0 8px 14px #00172866;display:grid;place-items:center;padding:4px 7px;font:800 8px Cairo,sans-serif}.ref-bottom-left button i,.ref-bottom-right button i{font-style:normal;font-size:22px;color:#ffe16b}.ref-bottom-left button em{position:absolute;top:-7px;right:-5px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#e53935;color:#fff;font-style:normal;border:2px solid #fff;font-size:9px}.ref-bottom-left button:hover,.ref-bottom-right button:hover{filter:brightness(1.12);transform:translateY(-1px)}
.reference-v120 .classic-chat-shell{display:none!important}.reference-v120 .emote-fab{display:none!important}.reference-v120 .camera-dock{right:28px!important;bottom:94px!important;left:auto!important;transform:none!important;max-width:232px!important;display:none!important;background:#031c2ff4!important;border:1px solid #d5a83b!important;z-index:60!important}.reference-v120.ref-show-camera .camera-dock{display:flex!important;flex-wrap:wrap!important}.reference-v120 .camera-hint3d{display:none!important}
.reference-v120 .city-focus-card{display:none!important}

/* Purchase/build modals close to the requested cream + brown game-card style */
.reference-v120 .popup{z-index:80!important;background:rgba(0,27,44,.66)!important;backdrop-filter:blur(6px) saturate(.9)!important}.reference-v120 .pop{width:min(500px,92vw)!important;border:2px solid #9e6719!important;border-radius:16px!important;background:linear-gradient(180deg,#fff8dc,#f3deb0)!important;color:#4b3314!important;box-shadow:0 22px 70px #00111faa,0 7px 0 #6f4510,inset 0 0 0 2px #fff9e5!important;overflow:hidden!important}.reference-v120 .pop h3{color:#5a3814!important}.reference-v120 .pop p{color:#6d4b20!important}.reference-v120 .classic-buy-title{margin:-1px -1px 0!important;padding:13px 16px!important;background:linear-gradient(180deg,#663818,#3e1e0b)!important;color:#fff5d7!important;font-size:21px!important;border-bottom:2px solid #c8912c!important}.reference-v120 .classic-buy-card{padding:14px 18px 9px!important}.reference-v120 .classic-buy-card .pop-icon{width:74px!important;height:74px!important;border-radius:23px!important;background:#fff7da!important}.reference-v120 .classic-buy-warning{border:1px dashed #c79535!important;border-radius:18px!important;padding:7px 12px!important;background:#fff9e8!important}.reference-v120 .classic-price-row{border-bottom:1px dashed #c9a15d!important;padding:9px 7px!important}.reference-v120 .classic-price-row b{font-size:19px!important}.reference-v120 .classic-price-row.cash{background:#fffaf0!important;border:1px solid #d8ae57!important;border-radius:9px!important;margin-top:7px!important}.reference-v120 .classic-upgrade-track{background:#fff7df!important;border-radius:9px!important;border:1px solid #e0c384!important}.reference-v120 .classic-buy-actions{padding:11px!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;background:#ead2a1!important;border-top:1px solid #bc8b37!important}.reference-v120 .classic-buy-actions .gold{order:2!important;border-radius:10px!important}.reference-v120 .classic-buy-actions .ghost{order:1!important;background:linear-gradient(#3ba5e7,#1575b8)!important;border:2px solid #0a568a!important;color:#fff!important;border-radius:10px!important;box-shadow:0 4px 0 #084e7c!important}

/* Utility popover */
.ref-mini-pop{position:absolute;right:28px;bottom:96px;z-index:70;width:260px;padding:12px;border-radius:14px;border:1px solid #e0ad35;background:linear-gradient(180deg,#0a3654f8,#041d31fb);box-shadow:0 10px 30px #00111f99;color:#fff}.ref-mini-pop h4{margin:0 0 7px;color:#ffe06a}.ref-mini-pop p{margin:4px 0;color:#d9edf7;font-size:10px;line-height:1.55}.ref-mini-pop button{width:100%;margin-top:8px;padding:7px;border-radius:8px;border:1px solid #d5a435;background:#092d47;color:#fff;font:800 10px Cairo}

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:1320px){
  .reference-v120 .stage#stage3d{padding-left:218px!important;padding-right:218px!important}.reference-v120 .board-scene{width:min(calc(100svh - 208px),calc(100vw - 452px),800px)!important}.ref-game-rail{width:188px;top:135px}.ref-left-rail{left:16px}.ref-right-rail{right:16px}.ref-glass-panel h3{font-size:12px}.ref-quick-panel button{min-height:42px;font-size:10px;grid-template-columns:34px 1fr}.ref-quick-panel button i{font-size:18px}.reference-v120 .hud-dice{width:min(700px,calc(100vw - 450px))!important}.ref-bottom-left{left:16px}.ref-bottom-right{right:16px}.ref-bottom-left button,.ref-bottom-right button{min-width:50px;height:63px}.reference-v120 .hud-col{width:200px!important}.reference-v120 .phud{width:200px!important;min-width:200px!important;max-width:200px!important}.reference-v120 .phud>img{width:52px!important}
}
@media (max-width:980px){
  .reference-v120 .splash-card.lobby-open{width:96vw!important;padding:18px 14px 22px!important;min-height:auto}.reference-v120 .splash-card.lobby-open .ref-lobby-badge{position:static;display:flex;width:max-content;margin:0 auto 8px}.reference-v120 .splash-card.lobby-open .ref-lobby-actions{position:static;justify-content:center;margin-bottom:7px}.reference-v120 .splash-card.lobby-open .splash-heroes{max-width:100%}.reference-v120 .splash-card.lobby-open h1{max-width:100%;font-size:46px!important}.reference-v120 .splash-card.lobby-open #hubPlay{grid-template-columns:1fr!important}.reference-v120 .splash-card.lobby-open #hubPlay>*{grid-column:1!important;grid-row:auto!important}.reference-v120 .splash-card.lobby-open #hubPlay>.otp-hint{grid-column:1!important}.reference-v120 .splash-card.lobby-open #hubPlay>.char-pick{grid-column:1!important;grid-row:auto!important;grid-template-columns:repeat(4,1fr)!important}.reference-v120 .splash-card.lobby-open .lobby-hub{grid-template-columns:repeat(3,1fr)!important}
  .ref-game-rail{display:none}.reference-v120 .stage#stage3d{padding:112px 6px 105px!important}.reference-v120 .board-scene{width:min(calc(100svh - 222px),calc(100vw - 12px),760px)!important;--cam-rx:2deg!important}.reference-v120 .hud-players{top:58px!important;left:6px!important;right:6px!important}.reference-v120 .hud-col{width:auto!important;max-width:48vw!important}.reference-v120 .phud{width:calc(50vw - 12px)!important;min-width:0!important;max-width:none!important;height:53px!important;padding:3px 5px!important}.reference-v120 .phud>img{width:37px!important;height:44px!important}.reference-v120 .phud-meta>b{font-size:9px!important}.reference-v120 .phud .cash-coin{font-size:8px!important}.reference-v120 .phud .worth{font-size:7px!important}.reference-v120 .classic-top-center{top:4px!important}.reference-v120 .classic-top-center .round-chip{min-width:118px!important;font-size:10px!important;padding:6px 10px!important}.reference-v120 .classic-stage-bar b,.reference-v120 .classic-stage-bar span{font-size:7px!important;padding:3px 5px!important}.ref-top-tools{display:none}.reference-v120 .hud-dice{width:calc(100vw - 8px)!important;bottom:5px!important}.reference-v120 .dice-hud{height:92px!important;padding:5px!important;gap:5px!important}.reference-v120 .roll-orb{width:94px!important;height:62px!important;font-size:18px!important}.reference-v120 .die3d,.reference-v120 .die{width:39px!important;height:39px!important}.reference-v120 .gauge-wrap{width:82px!important}.reference-v120 .side-items{gap:3px!important}.reference-v120 .item-btn{min-width:50px!important;height:44px!important;font-size:7px!important}.reference-v120 .dice-hud>.ghost,.reference-v120 .dice-hud>.bank-loan{display:none!important}.ref-bottom-left,.ref-bottom-right{display:none!important}
}
@media (max-width:620px){
  .reference-v120 .splash{padding:8px!important}.reference-v120 .splash-card.lobby-open{width:100%!important;border-radius:20px!important;margin:0!important;padding:12px 9px 18px!important}.reference-v120 .splash-card.lobby-open .ref-lobby-actions button span{width:44px;height:44px;font-size:18px}.reference-v120 .splash-card.lobby-open .splash-heroes img{width:42px!important;height:42px!important}.reference-v120 .splash-card.lobby-open h1{font-size:38px!important}.reference-v120 .splash-card.lobby-open .lead{font-size:9px!important}.reference-v120 .splash-card.lobby-open .hero-badges{display:grid!important;grid-template-columns:repeat(2,1fr)!important}.reference-v120 .splash-card.lobby-open .hero-badges span{font-size:8px!important}.reference-v120 .splash-card.lobby-open .auth-user{min-height:58px!important}.reference-v120 .splash-card.lobby-open .auth-user>div{grid-template-columns:1fr!important}.reference-v120 .splash-card.lobby-open .lobby-hub{grid-template-columns:repeat(3,1fr)!important}.reference-v120 .splash-card.lobby-open .hub-tab{font-size:8px!important;height:36px!important;min-height:36px!important}.reference-v120 .splash-card.lobby-open #hubPlay>.char-pick{grid-template-columns:repeat(2,1fr)!important}.reference-v120 .splash-card.lobby-open .char-card{height:132px!important;min-height:132px!important}.reference-v120 .splash-card.lobby-open .char-card img{height:91px!important}
  .reference-v120 .stage#stage3d{padding-top:108px!important;padding-bottom:92px!important}.reference-v120 .board-scene{width:min(calc(100svh - 202px),calc(100vw - 4px))!important}.reference-v120 .hud-dice{width:calc(100vw - 4px)!important}.reference-v120 .dice-hud{height:82px!important;border-radius:11px!important}.reference-v120 .roll-orb{width:78px!important;height:54px!important;font-size:15px!important}.reference-v120 .roll-orb::after{font-size:6px}.reference-v120 .die3d,.reference-v120 .die{width:33px!important;height:33px!important}.reference-v120 .gauge-wrap{display:none!important}.reference-v120 .item-btn{min-width:42px!important;height:39px!important;padding:3px!important;font-size:6px!important}.reference-v120 .classic-center-brand{min-width:120px!important;padding:3px 8px!important}.reference-v120 .classic-center-brand b{font-size:10px!important}
}
/* v120 logo/account refinements */
.reference-v120 .splash-card.lobby-open h1::before{content:none!important}
.reference-v120 .splash-card.lobby-open h1{display:grid!important;grid-template-columns:auto auto!important;grid-template-areas:"trip trip" "badge wealth";align-items:center;justify-content:center;column-gap:14px!important;width:auto!important;background:none!important;-webkit-text-fill-color:initial!important;filter:none!important;text-shadow:none!important}
.reference-v120 .splash-card.lobby-open .logo-trip{grid-area:trip;display:block;font-size:22px;line-height:1;color:#fff6cd;text-shadow:0 2px 3px #001c32;letter-spacing:0}
.reference-v120 .splash-card.lobby-open .logo-wealth{grid-area:wealth;display:block;font-size:72px;line-height:.88;font-weight:900;color:#ffd45a;background:linear-gradient(180deg,#fff3ad 0,#ffd45a 33%,#f5b228 61%,#b66b05 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 5px 0 #7e4805) drop-shadow(0 10px 12px #00162488)}
.reference-v120 .splash-card.lobby-open .classic-title-mark{grid-area:badge;font-size:21px!important;align-self:center!important;margin:0!important;transform:translateY(2px)}
.reference-v120 .splash-card.lobby-open .auth-user{display:grid!important;grid-template-columns:1fr auto auto!important;align-items:center!important;gap:14px!important;text-align:right!important}
.reference-v120 .splash-card.lobby-open .ref-account-main{display:block!important;min-width:230px}
.reference-v120 .splash-card.lobby-open .ref-account-stats{display:flex;gap:5px;justify-content:center;flex-wrap:wrap}
.reference-v120 .splash-card.lobby-open .ref-account-stats span{display:flex;align-items:center;gap:4px;min-height:27px;padding:4px 9px;border-radius:999px;border:1px solid #c6922e;background:#061e32;color:#eef8ff;font-size:8px;font-weight:800;white-space:nowrap}
.reference-v120 .splash-card.lobby-open .ref-account-stats span b{display:inline!important;color:#ffe06d!important;font-size:9px!important}
.reference-v120 .splash-card.lobby-open .hub-tab::before{margin-inline-end:5px;font-size:14px;vertical-align:-1px}.reference-v120 .splash-card.lobby-open .hub-tab[data-hub="play"]::before{content:"🎲"}.reference-v120 .splash-card.lobby-open .hub-tab[data-hub="island"]::before{content:"🌴"}.reference-v120 .splash-card.lobby-open .hub-tab[data-hub="hall"]::before{content:"⛰️"}.reference-v120 .splash-card.lobby-open .hub-tab[data-hub="story"]::before{content:"📖"}.reference-v120 .splash-card.lobby-open .hub-tab[data-hub="arena"]::before{content:"👥"}.reference-v120 .splash-card.lobby-open .hub-tab[data-hub="world"]::before{content:"🌍"}.reference-v120 .splash-card.lobby-open .hub-tab[data-hub="academy"]::before{content:"🎓"}.reference-v120 .splash-card.lobby-open .hub-tab[data-hub="missions"]::before{content:"🎯"}.reference-v120 .splash-card.lobby-open .hub-tab[data-hub="profile"]::before{content:"👤"}
@media(max-width:620px){.reference-v120 .splash-card.lobby-open .logo-wealth{font-size:48px}.reference-v120 .splash-card.lobby-open .logo-trip{font-size:16px}.reference-v120 .splash-card.lobby-open .classic-title-mark{font-size:14px!important}.reference-v120 .splash-card.lobby-open .auth-user{grid-template-columns:1fr auto!important}.reference-v120 .splash-card.lobby-open .ref-account-stats{grid-column:1/-1;order:3}}
@media(min-width:981px){.reference-v120 .hud-col .phud:not(:first-child){display:none!important}}
.reference-v120.ref-show-chat .classic-chat-shell{display:block!important;position:absolute!important;left:28px!important;bottom:96px!important;width:250px!important;z-index:70!important;opacity:1!important;border:1px solid #d7a739!important;border-radius:13px!important;overflow:hidden!important;background:#05213aee!important;box-shadow:0 8px 22px #00111f99!important}.reference-v120.ref-show-chat .classic-chat-shell .ticker{max-height:130px!important;font-size:9px!important}.reference-v120.ref-show-chat .classic-chat-title{font-size:10px!important}