*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --gold:#c9a84c;--gold-l:#f0d882;--gold-d:#7a5c1e;--gold-dim:#3d2e0e;
  --bg:#080602;--bg2:#100d05;--panel:#130f05;--panel2:#1c1508;
  --border:rgba(201,168,76,.18);--border-h:rgba(201,168,76,.6);
  --text:#d4c48a;--text-dim:#8a7040;--text-faint:#342810;
  --glow:rgba(201,168,76,.12);--glow-h:rgba(201,168,76,.28);
  --red:#e05555;--green:#4db84d;--blue:#4c7bc9;
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:'Rajdhani',sans-serif;min-height:100vh;overflow-x:hidden}
body::before{content:'';position:fixed;inset:0;z-index:0;
  background:radial-gradient(ellipse 80% 60% at 50% -10%,rgba(201,168,76,.08) 0%,transparent 70%),
  radial-gradient(ellipse 40% 40% at 10% 80%,rgba(201,168,76,.04) 0%,transparent 60%);pointer-events:none}
body::after{content:'';position:fixed;inset:0;z-index:0;
  background-image:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.06) 2px,rgba(0,0,0,.06) 4px);pointer-events:none}
.page{position:relative;z-index:1;padding:14px;max-width:1700px;margin:0 auto}

/* HEADER */
header{text-align:center;padding:22px 20px 12px}
.logo{font-family:'Cinzel Decorative',cursive;font-size:.62rem;letter-spacing:4px;color:var(--gold-d);margin-bottom:5px}
h1{font-family:'Cinzel Decorative',cursive;font-size:clamp(1.6rem,3vw,2.4rem);color:var(--gold-l);text-shadow:0 0 40px rgba(201,168,76,.45);margin-bottom:4px}
.subtitle{font-family:'IM Fell English',serif;font-style:italic;color:var(--text-dim);font-size:.88rem}
.gold-line{width:160px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:10px auto}

/* SETUP */
#setup-screen{display:flex;flex-direction:column;align-items:center;gap:24px;padding:14px 0 32px}
.setup-panel{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:24px 32px;min-width:360px}
.setup-panel h3{font-family:'Cinzel',serif;color:var(--gold);font-size:.82rem;letter-spacing:3px;text-transform:uppercase;margin-bottom:16px;text-align:center}
.rival-btns{display:flex;gap:10px;justify-content:center}
.rival-btn{background:var(--bg2);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:'Rajdhani',sans-serif;font-size:1rem;font-weight:600;padding:12px 24px;cursor:pointer;transition:all .3s}
.rival-btn:hover,.rival-btn.active{border-color:var(--gold);color:var(--gold);background:var(--gold-dim);box-shadow:0 0 14px var(--glow)}
.fgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.fbtn{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:13px 8px;cursor:pointer;text-align:center;transition:all .3s;display:flex;flex-direction:column;align-items:center;gap:5px}
.fbtn:hover,.fbtn.active{border-color:var(--gold);background:var(--gold-dim);box-shadow:0 0 16px var(--glow)}
.fbtn .fi{font-size:1.9rem}.fbtn .fn{font-size:.6rem;letter-spacing:1px;color:var(--text-dim);text-transform:uppercase}
.fbtn.active .fn{color:var(--gold)}
.start-btn{background:linear-gradient(135deg,var(--gold-d),var(--gold));border:none;border-radius:10px;color:var(--bg);font-family:'Cinzel',serif;font-size:.95rem;font-weight:700;letter-spacing:3px;padding:14px 44px;cursor:pointer;transition:all .3s;text-transform:uppercase}
.start-btn:hover{box-shadow:0 0 30px rgba(201,168,76,.4);transform:translateY(-2px)}
.start-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}

/* GAME */
#game-screen{display:none;gap:12px;align-items:start}
#game-screen.active{display:grid;grid-template-columns:195px 1fr 355px}

/* BOARD */
.board-wrap{display:flex;align-items:center;justify-content:center}
#board{
  display:grid;grid-template-columns:repeat(11,1fr);grid-template-rows:repeat(11,1fr);
  width:min(60vw,650px);height:min(60vw,650px);
  border:2px solid var(--gold);border-radius:4px;
  box-shadow:0 0 50px rgba(201,168,76,.2),0 0 100px rgba(0,0,0,.8);
  background:#08060200;position:relative
}
.board-center{grid-column:2/11;grid-row:2/11;
  background:radial-gradient(ellipse at center,#0e0a04,#060401);
  border:1px solid var(--border);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.ct{font-family:'Cinzel Decorative',cursive;font-size:clamp(.85rem,1.8vw,1.4rem);color:var(--gold);text-align:center;line-height:1.3}
.cs{font-family:'IM Fell English',serif;font-style:italic;color:var(--text-dim);font-size:.65rem;text-align:center}

/* SQUARES */
.sq{
  border:1px solid rgba(201,168,76,.15);cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
  padding:2px 1px 1px;position:relative;overflow:hidden;background:#090702;
  min-height:0;min-width:0;transition:background .15s
}
.sq:hover{background:#16110600}
.cbar{width:100%;height:8px;flex-shrink:0}
.cbar-left{width:8px;height:100%;flex-shrink:0;position:absolute;left:0;top:0}
.cbar-right{width:8px;height:100%;flex-shrink:0;position:absolute;right:0;top:0}
/* TEXT — white with thick black stroke for maximum contrast */
.sq-n{
  font-family:'Cinzel',serif;
  font-size:clamp(.5rem,.7vw,.62rem);
  text-align:center;color:#ffffff;line-height:1.25;
  padding:0 2px;word-break:break-word;font-weight:600;
  text-shadow:
    1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,
    0 2px 0 #000,0 -2px 0 #000,2px 0 0 #000,-2px 0 0 #000,
    0 0 6px rgba(0,0,0,.9);
  letter-spacing:.03em
}
.sq-p{
  color:var(--gold-l);font-size:clamp(.44rem,.6vw,.56rem);font-weight:700;line-height:1.1;
  text-shadow:1px 1px 0 #000,-1px -1px 0 #000,0 0 4px rgba(0,0,0,1)
}
.sq-ico{
  font-size:clamp(1rem,1.4vw,1.15rem);line-height:1;
  text-shadow:0 0 5px rgba(0,0,0,1);margin-bottom:1px
}
.sq-corner{background:rgba(201,168,76,.07)!important}
.sq-corner .sq-ico{font-size:clamp(1.3rem,1.8vw,1.65rem)}
.sq-corner .sq-n{font-size:clamp(.52rem,.75vw,.7rem);color:var(--gold-l);font-weight:700}
/* Ownership border */
.owned-0{box-shadow:inset 0 0 0 2px #c9a84c!important}
.owned-1{box-shadow:inset 0 0 0 2px #e05555!important}
.owned-2{box-shadow:inset 0 0 0 2px #4c7bc9!important}
.owned-3{box-shadow:inset 0 0 0 2px #4db84d!important}
.owned-4{box-shadow:inset 0 0 0 2px #c97a4c!important}
/* Pawn presence — tint square with player color */
.pawn-here-0{background:rgba(201,168,76,.20)!important}
.pawn-here-1{background:rgba(224,85,85,.25)!important}
.pawn-here-2{background:rgba(76,123,201,.25)!important}
.pawn-here-3{background:rgba(77,184,77,.25)!important}
.pawn-here-4{background:rgba(201,122,76,.25)!important}
.sq.here{outline:2px solid var(--gold-l);outline-offset:-2px}
.pawn-wrap{position:absolute;inset:0;pointer-events:none;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:flex-start;padding:1px;z-index:10}
.pawn{font-size:clamp(.75rem,1.1vw,.95rem);line-height:1;filter:drop-shadow(0 0 3px rgba(0,0,0,1))}
.hmark{position:absolute;bottom:8px;left:1px;font-size:.48rem;line-height:1;z-index:11;filter:drop-shadow(0 0 2px rgba(0,0,0,1))}

/* LEFT PANEL */
.side-left{display:flex;flex-direction:column;gap:9px}
.player-card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:10px 12px;transition:all .3s}
.player-card.myturn{border-color:var(--gold);box-shadow:0 0 18px var(--glow)}
.player-card.bankrupt{opacity:.3;filter:grayscale(1)}
.ph{display:flex;align-items:center;gap:7px;margin-bottom:6px}
.pf{font-size:1.4rem;filter:drop-shadow(0 0 4px rgba(0,0,0,.9))}
.pname{font-family:'Cinzel',serif;font-size:.72rem;color:var(--gold);line-height:1.2}
.pmoney{font-size:1.15rem;font-weight:700;color:var(--gold-l);line-height:1}
.pstats{font-size:.62rem;color:var(--text-dim);line-height:1.5}
.pbadge{font-size:.52rem;letter-spacing:1px;color:var(--bg);background:var(--gold);border-radius:3px;padding:1px 5px}
.pchips{display:flex;flex-wrap:wrap;gap:3px;margin-top:4px}
.pchip{font-size:.6rem;padding:2px 4px;border-radius:3px;background:rgba(0,0,0,.5);border-width:1px;border-style:solid}

/* RIGHT PANEL */
.side-right{display:flex;flex-direction:column;gap:9px}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:13px 15px}
.ptitle{font-family:'Cinzel',serif;font-size:.7rem;letter-spacing:2px;color:var(--gold);text-transform:uppercase;margin-bottom:10px;border-bottom:1px solid var(--border);padding-bottom:6px;display:flex;align-items:center;gap:5px}

/* DICE */
.dice-row{display:flex;gap:12px;align-items:center;justify-content:center;padding:4px 0 10px}
.die{width:54px;height:54px;background:var(--bg2);border:2px solid var(--gold-d);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:2.2rem;transition:all .3s;box-shadow:inset 0 0 12px rgba(0,0,0,.7);position:relative}
.die.rolling{animation:rollD .7s ease-in-out}
.dv{font-family:'Cinzel Decorative',cursive;font-size:.72rem;color:var(--gold-l);line-height:1;margin-top:1px}
.dtotal{font-family:'Cinzel Decorative',cursive;font-size:1.7rem;color:var(--gold-l);text-align:center;min-width:40px;text-shadow:0 0 16px rgba(201,168,76,.6);line-height:1}
.dlabel{font-size:.58rem;color:var(--gold);text-align:center;letter-spacing:1px;margin-top:2px;min-height:12px}
@keyframes rollD{0%,100%{transform:rotate(0) scale(1)}20%{transform:rotate(-22deg) scale(1.18)}50%{transform:rotate(16deg) scale(1.1)}80%{transform:rotate(-8deg) scale(1.05)}}
.roll-btn{width:100%;background:linear-gradient(135deg,var(--gold-d),var(--gold));border:none;border-radius:8px;color:var(--bg);font-family:'Cinzel',serif;font-size:.8rem;font-weight:700;letter-spacing:2px;padding:11px;cursor:pointer;transition:all .3s;text-transform:uppercase}
.roll-btn:hover:not(:disabled){box-shadow:0 0 22px rgba(201,168,76,.35);transform:translateY(-1px)}
.roll-btn:disabled{opacity:.35;cursor:not-allowed;transform:none}
.btn-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.abtn{flex:1;background:var(--bg2);border:1px solid var(--border);border-radius:7px;color:var(--text-dim);font-family:'Rajdhani',sans-serif;font-size:.7rem;font-weight:600;padding:8px 5px;cursor:pointer;transition:all .2s;text-transform:uppercase;letter-spacing:.8px;text-align:center}
.abtn:hover:not(:disabled){border-color:var(--gold);color:var(--gold)}
.abuy{border-color:var(--green)!important;color:var(--green)!important}
.abuy:hover:not(:disabled){background:rgba(77,184,77,.1)!important}
.abuild{border-color:var(--blue)!important;color:var(--blue)!important}
.amort{border-color:var(--red)!important;color:var(--red)!important}
.aend{border-color:var(--gold-d)!important;color:var(--gold)!important}
.abtn:disabled{opacity:.3;cursor:not-allowed}
.turn-banner{font-family:'Cinzel',serif;font-size:.66rem;letter-spacing:2px;color:var(--gold-l);text-align:center;padding:7px;border:1px solid var(--border);border-radius:7px;background:var(--bg2);text-transform:uppercase}

/* ASSISTANT */
.abox{max-height:280px;overflow-y:auto;display:flex;flex-direction:column;gap:6px}
.abox::-webkit-scrollbar{width:3px}
.abox::-webkit-scrollbar-thumb{background:var(--gold-d);border-radius:2px}
.amsg{background:var(--bg2);border:1px solid var(--border);border-radius:7px;padding:8px 10px;font-size:.78rem;line-height:1.55}
.atip{border-color:rgba(201,168,76,.35)}
.awarn{border-color:rgba(224,85,85,.4)!important;background:rgba(224,85,85,.04)!important}
.agood{border-color:rgba(77,184,77,.35)!important;background:rgba(77,184,77,.04)!important}
.ainfo{border-color:rgba(76,123,201,.35)!important;background:rgba(76,123,201,.04)!important}
.albl{font-family:'Cinzel',serif;font-size:.58rem;letter-spacing:2px;color:var(--gold);margin-bottom:3px;text-transform:uppercase}
.pbar-wrap{margin-top:4px}
.pbar-row{display:flex;justify-content:space-between;font-size:.66rem;color:var(--text-dim);margin-bottom:2px}
.pbar{height:5px;background:rgba(255,255,255,.06);border-radius:3px;overflow:hidden}
.pfill{height:100%;border-radius:3px;transition:width .8s ease}

/* STATS */
.stabs{display:flex;gap:0;margin-bottom:9px}
.stab{flex:1;background:var(--bg2);border:1px solid var(--border);padding:5px;font-family:'Cinzel',serif;font-size:.58rem;letter-spacing:1px;color:var(--text-dim);text-align:center;cursor:pointer;transition:all .2s;text-transform:uppercase}
.stab:first-child{border-radius:6px 0 0 6px}.stab:last-child{border-radius:0 6px 6px 0}
.stab.active{background:var(--gold-dim);color:var(--gold);border-color:var(--gold)}
.srow{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid rgba(201,168,76,.05)}
.srow:last-child{border-bottom:none}
.skey{color:var(--text-dim);font-size:.7rem}.sval{color:var(--gold-l);font-weight:700;font-size:.75rem}
.sval.neg{color:var(--red)}.sval.pos{color:var(--green)}
.wbwrap{margin:6px 0}
.wbl{display:flex;justify-content:space-between;font-size:.66rem;color:var(--text-dim);margin-bottom:2px}
.wb{height:7px;background:rgba(255,255,255,.05);border-radius:3px;overflow:hidden}
.wbf{height:100%;border-radius:3px;transition:width 1s ease}

/* LOG */
.logbox{max-height:110px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}
.logbox::-webkit-scrollbar{width:3px}
.logbox::-webkit-scrollbar-thumb{background:var(--gold-d);border-radius:2px}
.le{font-size:.7rem;padding:3px 0;border-bottom:1px solid rgba(201,168,76,.04);color:var(--text-dim);line-height:1.4}
.lh{color:var(--gold-l)}.lp{color:var(--green)}.ln{color:var(--red)}

/* MODAL / OVERLAY — positioned right so board stays visible */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.50);z-index:200;display:flex;align-items:center;justify-content:flex-end;padding-right:16px;backdrop-filter:blur(1px)}
.mbox{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:22px 26px 22px;min-width:280px;max-width:380px;text-align:center;box-shadow:0 0 60px rgba(0,0,0,.9),0 0 40px rgba(201,168,76,.12);animation:popIn .3s ease both;position:relative;max-height:88vh;overflow-y:auto}
.mbox::-webkit-scrollbar{width:3px}.mbox::-webkit-scrollbar-thumb{background:var(--gold-d);border-radius:2px}
.mclose{position:absolute;top:10px;right:10px;background:none;border:1px solid rgba(201,168,76,.25);border-radius:50%;width:24px;height:24px;cursor:pointer;color:var(--text-dim);font-size:.9rem;line-height:1;display:flex;align-items:center;justify-content:center;transition:all .2s;font-family:sans-serif;flex-shrink:0}
.mclose:hover{border-color:var(--gold);color:var(--gold);background:var(--gold-dim)}
@keyframes popIn{from{opacity:0;transform:scale(.85) translateY(18px) translateX(20px)}to{opacity:1;transform:scale(1) translateY(0) translateX(0)}}
.mbox h2{font-family:'Cinzel Decorative',cursive;color:var(--gold-l);font-size:1.1rem;margin-bottom:5px;padding-right:22px}
.mcity{font-size:2.2rem;margin:6px 0}
.mbox p{color:var(--text-dim);font-size:.82rem;line-height:1.65;margin-bottom:12px}
.mprice{font-size:1.3rem;font-weight:700;color:var(--gold);margin:5px 0}
.mbtns{display:flex;gap:8px;justify-content:center;margin-top:6px;flex-wrap:wrap}
.mbtns button{border-radius:8px;padding:9px 16px;font-family:'Cinzel',serif;font-size:.72rem;font-weight:700;letter-spacing:2px;cursor:pointer;border:none;transition:all .3s;text-transform:uppercase}
.mok{background:linear-gradient(135deg,var(--gold-d),var(--gold));color:var(--bg)}
.myes{background:linear-gradient(135deg,#2a5c2a,#4db84d);color:#fff}
.mno{background:var(--bg2);color:var(--text);border:1px solid var(--border)!important}
.mok:hover,.myes:hover{box-shadow:0 0 18px rgba(201,168,76,.35)}
.gbadge{display:inline-block;padding:3px 10px;border-radius:4px;font-size:.62rem;font-weight:700;letter-spacing:2px;color:#000;margin:5px 0 9px}

/* TURN POPUP */
.tpop{text-align:center;padding:4px 8px 0}
.tpop .tpfig{font-size:3.4rem;margin-bottom:6px;filter:drop-shadow(0 0 12px rgba(201,168,76,.4))}
.tpop .tplbl{font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:3px;color:var(--text-dim);text-transform:uppercase;margin-bottom:5px}
.tpop h3{font-family:'Cinzel Decorative',cursive;font-size:1.35rem;color:var(--gold-l);margin-bottom:7px}
.tpop .tpsub{color:var(--text-dim);font-size:.8rem;margin-bottom:18px;line-height:1.6}

/* CARD */
.cwrap{background:linear-gradient(135deg,#1c1308,#0d0a04);border:2px solid var(--gold-d);border-radius:12px;padding:16px;text-align:center;margin-bottom:12px}
.ctype{font-family:'Cinzel',serif;font-size:.6rem;letter-spacing:3px;color:var(--text-dim);text-transform:uppercase;margin-bottom:5px}
.cico{font-size:2.4rem;margin:7px 0}
.ctxt{font-size:.82rem;line-height:1.55;color:var(--text)}
.ceff{font-size:1.1rem;font-weight:700;color:var(--gold);margin-top:8px}

/* RENT TABLE */
.rtbl{width:100%;border-collapse:collapse;font-size:.76rem;margin-top:9px}
.rtbl th{font-family:'Cinzel',serif;font-size:.6rem;letter-spacing:1px;color:var(--gold);padding:5px;border-bottom:1px solid var(--border);text-transform:uppercase}
.rtbl td{padding:4px 7px;border-bottom:1px solid rgba(201,168,76,.05);color:var(--text-dim);text-align:center}
.rtbl tr.cr td{color:var(--gold-l);font-weight:700;background:rgba(201,168,76,.07)}
.rtbl tr:last-child td{border-bottom:none}

/* TOAST */
.toast{position:fixed;top:18px;left:50%;transform:translateX(-50%) translateY(-70px);background:var(--panel2);border:1px solid var(--gold-d);border-radius:9px;padding:11px 22px;font-family:'Cinzel',serif;font-size:.78rem;letter-spacing:1px;color:var(--gold-l);z-index:400;transition:transform .4s cubic-bezier(.34,1.56,.64,1);box-shadow:0 8px 30px rgba(0,0,0,.6);white-space:nowrap;text-align:center}
.toast.show{transform:translateX(-50%) translateY(0)}

/* RENT FLASH */
.rflash{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:500;font-family:'Cinzel Decorative',cursive;font-size:2.2rem;color:var(--red);text-shadow:0 0 20px rgba(220,50,50,.7);animation:rfpop 1s ease both}
@keyframes rfpop{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}25%{opacity:1;transform:translate(-50%,-60%) scale(1.2)}70%{opacity:1;transform:translate(-50%,-130%) scale(1)}100%{opacity:0;transform:translate(-50%,-200%) scale(.7)}}

/* WINNER */
.wov{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:600;display:flex;align-items:center;justify-content:center}
.wbox{text-align:center;animation:popIn .7s ease both}
.wfig{font-size:5rem;filter:drop-shadow(0 0 20px gold);margin-bottom:8px}
.wbox h1{font-family:'Cinzel Decorative',cursive;font-size:2.6rem;color:var(--gold-l);text-shadow:0 0 50px rgba(201,168,76,.7);margin-bottom:6px}
.wsub{color:var(--text-dim);font-size:.95rem;margin-bottom:20px}
.wstats{display:flex;flex-direction:column;gap:6px;margin-bottom:24px}
.wstat{display:flex;justify-content:space-between;font-size:.82rem;padding:6px 14px;border:1px solid var(--border);border-radius:6px;background:var(--bg2)}

@keyframes fadeIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.fi{animation:fadeIn .5s ease both}
@media(max-width:768px){.game-grid{grid-template-columns:1fr!important;grid-template-rows:auto!important;}.game-grid>*{min-width:0!important;}}