*{box-sizing:border-box}
:root{--bg:#07100c;--bg2:#0b1811;--line:rgba(255,255,255,.09);--text:#f6f7f2;--muted:#9faea3;--gold:#e5b75d;--gold2:#ffd98d;--felt:#0e5c38;--felt2:#0a462c;--red:#b52336;--green:#43d18f}
html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif;background:radial-gradient(circle at 20% 0,rgba(229,183,93,.12),transparent 28%),linear-gradient(180deg,var(--bg2),var(--bg));color:var(--text)}
button,a{font:inherit}a{text-decoration:none;color:inherit}.hidden{display:none!important}
.topbar{height:76px;padding:0 max(22px,calc((100vw - 1180px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(4,10,7,.76);backdrop-filter:blur(14px);position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:11px}.logo{width:43px;height:43px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--gold2),var(--gold));color:#1b1407;font-weight:900}.brand>span:last-child{display:flex;flex-direction:column}.brand strong{letter-spacing:.12em}.brand small{font-size:11px;color:var(--muted);margin-top:2px}.back-link{font-size:13px;font-weight:700}
.page-shell{width:min(1180px,calc(100% - 28px));margin:0 auto;padding:45px 0 70px}
.lobby{min-height:690px;display:grid;grid-template-columns:1fr .9fr;align-items:center;gap:70px}.lobby-card{padding:45px;border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.022));border:1px solid var(--line);box-shadow:0 35px 90px rgba(0,0,0,.32)}.kicker,.action-kicker{font-size:11px;font-weight:800;letter-spacing:.18em;color:var(--gold2)}
h1{font-family:Georgia,serif;font-size:72px;line-height:.95;margin:15px 0 18px}.lobby-card p{color:var(--muted);font-size:17px;line-height:1.7}
.player-select{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:30px 0 14px}.player-count,.start-btn,.small-btn,.action-btn{cursor:pointer;border:0}.player-count{min-height:52px;border-radius:13px;background:rgba(255,255,255,.04);border:1px solid var(--line);color:#dce4de;font-weight:700}.player-count:hover,.player-count.active{border-color:rgba(229,183,93,.55);background:rgba(229,183,93,.10);color:var(--gold2)}.start-btn{width:100%;min-height:56px;border-radius:14px;background:linear-gradient(135deg,var(--gold2),var(--gold));font-weight:900;color:#1a1307}.rules-mini{margin-top:22px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:5px}.rules-mini span{font-size:12px;color:var(--muted)}
.lobby-art{min-height:520px;position:relative;display:grid;place-items:center}.card-demo{position:absolute;width:165px;height:235px;border-radius:20px;background:#f5efe2;color:#151515;padding:20px;font:900 36px Georgia,serif;box-shadow:0 35px 70px rgba(0,0,0,.4);display:flex;flex-direction:column}.card-demo span{font-size:70px;align-self:flex-end;margin-top:auto}.c1{transform:translateX(-120px) rotate(-14deg);color:var(--red)}.c2{z-index:2}.c3{transform:translateX(120px) rotate(14deg);color:var(--red)}
.game-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px;padding:14px 18px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.03)}.game-toolbar>div:first-child{display:flex;flex-direction:column;gap:3px}.toolbar-label{font-size:10px;letter-spacing:.14em;color:var(--muted);font-weight:800}.small-btn{padding:10px 15px;border-radius:10px;background:rgba(255,255,255,.055);border:1px solid var(--line);color:#fff;font-size:12px;font-weight:800}
.scoreboard{display:flex;gap:9px;align-items:center;justify-content:center;flex-wrap:wrap}.score-pill{padding:7px 10px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.035);font-size:11px;color:var(--muted)}.score-pill strong{color:#fff;font-size:15px;margin-left:5px}.score-pill.you{border-color:rgba(229,183,93,.35)}
.table-wrap{overflow:hidden;border-radius:28px;border:1px solid rgba(255,255,255,.08);box-shadow:0 35px 85px rgba(0,0,0,.32)}.game-table{height:720px;position:relative;background:radial-gradient(circle at center,rgba(255,255,255,.045),transparent 42%),linear-gradient(145deg,var(--felt),var(--felt2));border:14px solid #5a3a1f;box-shadow:inset 0 0 60px rgba(0,0,0,.35)}.game-table:after{content:"";position:absolute;inset:18px;border:1px solid rgba(255,218,141,.18);border-radius:22px;pointer-events:none}
.player-seat{position:absolute;z-index:4;display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:14px;background:rgba(4,12,8,.76);border:1px solid rgba(255,255,255,.09);backdrop-filter:blur(8px);min-width:160px}.player-seat>div:nth-child(2){display:flex;flex-direction:column}.player-seat strong{font-size:13px}.cards-left{font-size:10px;color:var(--muted);margin-top:2px}.player-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#203c2c;color:var(--gold2);font-size:10px;font-weight:900}.active-player{box-shadow:0 0 0 2px rgba(229,183,93,.48)}.bid-mark{margin-left:auto;font-size:11px;color:var(--gold2);font-weight:900}.seat-top{top:28px;left:50%;transform:translateX(-50%)}.seat-left{left:28px;top:45%;transform:translateY(-50%)}.seat-right{right:28px;top:45%;transform:translateY(-50%)}.seat-bottom{bottom:128px;left:50%;transform:translateX(-50%)}
.center-area{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);z-index:2;text-align:center}.round-info{display:flex;justify-content:center;gap:8px;margin-bottom:14px}.round-info>span{padding:7px 10px;border-radius:999px;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.09);font-size:10px;color:var(--muted)}.round-info strong{color:var(--gold2);font-size:13px;margin-left:4px}.played-cards{width:310px;height:220px;position:relative;display:grid;place-items:center}.table-message{color:rgba(255,255,255,.63);font-size:12px}
.hand{position:absolute;left:50%;bottom:15px;transform:translateX(-50%);width:min(96%,820px);height:115px;display:flex;align-items:flex-end;justify-content:center;z-index:5}.game-card{width:78px;height:108px;border-radius:9px;background:#f4efe5;border:1px solid #d9d0be;margin-left:-15px;box-shadow:0 10px 22px rgba(0,0,0,.28);padding:8px;color:#111;font:900 20px Georgia,serif;cursor:pointer;transition:.16s;display:flex;flex-direction:column}.game-card:first-child{margin-left:0}.game-card:hover:not(:disabled),.game-card.selectable{transform:translateY(-16px)}.game-card:disabled{opacity:.52;cursor:not-allowed}.game-card.red{color:var(--red)}.game-card .suit{margin-top:auto;align-self:flex-end;font-size:30px}
.play-card{position:absolute;width:70px;height:98px;border-radius:8px;background:#f4efe5;border:1px solid #d9d0be;padding:7px;color:#111;font:900 18px Georgia,serif;display:flex;flex-direction:column;box-shadow:0 9px 20px rgba(0,0,0,.25)}.play-card.red{color:var(--red)}.play-card span{align-self:flex-end;margin-top:auto;font-size:27px}.play-pos-0{bottom:0;left:50%;transform:translateX(-50%)}.play-pos-1{left:15px;top:50%;transform:translateY(-50%) rotate(-90deg)}.play-pos-2{top:0;left:50%;transform:translateX(-50%)}.play-pos-3{right:15px;top:50%;transform:translateY(-50%) rotate(90deg)}
.action-panel{margin-top:18px;padding:18px;border:1px solid rgba(229,183,93,.23);border-radius:17px;background:rgba(229,183,93,.055);display:flex;align-items:center;justify-content:space-between;gap:20px}.action-panel>div:first-child{max-width:520px}.action-panel strong{display:block;font-size:17px;margin-top:4px}.action-panel p{margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.5}.action-buttons{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.action-btn{min-width:48px;padding:11px 13px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:#fff;font-weight:800}.action-btn.primary{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#1a1307;border-color:transparent}.action-btn:disabled{opacity:.35;cursor:not-allowed}
.game-status{margin-top:18px;display:grid;grid-template-columns:1fr auto auto;gap:14px}.game-status>div{padding:14px 17px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.028);display:flex;flex-direction:column;gap:4px}.game-status span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.game-status strong{font-size:13px}
.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:rgba(2,7,4,.78);backdrop-filter:blur(10px)}.modal-card{width:min(560px,100%);padding:32px;border-radius:24px;background:#102017;border:1px solid var(--line);box-shadow:0 35px 90px rgba(0,0,0,.5)}.modal-card h2{font:700 34px Georgia,serif;margin:10px 0 20px}.round-results{display:grid;gap:9px;margin-bottom:22px}.result-row{display:flex;justify-content:space-between;gap:15px;padding:12px;border-radius:11px;background:rgba(255,255,255,.04);font-size:13px}.result-row span{color:var(--muted)}.result-row strong{color:#fff}.final-win{color:var(--green)!important}
@media(max-width:850px){.lobby{grid-template-columns:1fr}.lobby-art{display:none}.game-table{height:650px}.seat-left{left:10px}.seat-right{right:10px}.player-seat{min-width:120px;padding:7px}.game-toolbar{flex-wrap:wrap}.scoreboard{order:3;width:100%}}
@media(max-width:600px){.back-link{font-size:0}.back-link:after{content:"← Jocuri";font-size:12px}.page-shell{padding-top:25px}.lobby-card{padding:27px 20px}h1{font-size:55px}.player-select{grid-template-columns:1fr}.game-table{height:600px;border-width:9px}.player-seat strong{font-size:11px}.player-avatar{width:29px;height:29px}.seat-top{top:15px}.seat-bottom{bottom:119px}.played-cards{width:230px}.hand{height:105px}.game-card{width:65px;height:94px;margin-left:-23px;font-size:17px}.game-card .suit{font-size:26px}.game-status{grid-template-columns:1fr 1fr}.game-status>div:first-child{grid-column:1/-1}.action-panel{align-items:flex-start;flex-direction:column}.action-buttons{justify-content:flex-start}}


/* =========================================================
   CRUCE LOCAL v1.2.1 — design modern aliniat cu multiplayer
   ========================================================= */

.game-area{
  position:relative;
}

.game-toolbar{
  max-width:1120px;
  margin:0 auto 12px;
  padding:10px 14px;
}

.table-wrap{
  max-width:1120px;
  margin:0 auto;
  overflow:visible;
  border:0;
  box-shadow:none;
}

.game-table{
  width:min(980px,calc(100vw - 80px));
  height:min(680px,calc(100vh - 190px));
  min-height:580px;
  margin:0 auto;
  border:14px solid #65401f;
  border-radius:50%;
  overflow:visible;
  background:
    radial-gradient(circle at 50% 43%,rgba(255,255,255,.06),transparent 32%),
    radial-gradient(ellipse at center,#167044 0%,#0e5d39 60%,#084329 100%);
  box-shadow:
    inset 0 0 0 4px rgba(236,190,94,.18),
    inset 0 0 80px rgba(0,0,0,.42),
    0 25px 70px rgba(0,0,0,.48);
}

.game-table:before{
  content:"CRUCE";
  position:absolute;
  left:50%;
  top:49%;
  transform:translate(-50%,-50%);
  font:900 58px Georgia,serif;
  letter-spacing:.12em;
  color:rgba(255,255,255,.035);
  pointer-events:none;
}

.game-table:after{
  inset:12px;
  border-radius:50%;
}

.player-seat{
  min-width:145px;
  padding:8px 10px;
  background:rgba(4,13,8,.88);
  z-index:20;
}

.seat-top{
  top:-26px;
}

.seat-left{
  left:-48px;
  top:43%;
}

.seat-right{
  right:-48px;
  top:43%;
}

.seat-bottom{
  bottom:134px;
}

/* Duel: adversarul este sus, nu în stânga */
.game-table.players-2 .seat-left{
  left:50%;
  top:-26px;
  transform:translateX(-50%);
}

.local-card-backs{
  position:absolute;
  left:50%;
  top:100%;
  transform:translateX(-50%);
  display:flex;
  margin-top:5px;
}

.local-card-back{
  width:24px;
  height:34px;
  margin-left:-13px;
  border:2px solid #eee4d2;
  border-radius:4px;
  background:
    linear-gradient(45deg,rgba(255,255,255,.12) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.12) 75%),
    #1a4f84;
  background-size:8px 8px;
  box-shadow:0 2px 5px rgba(0,0,0,.35);
}

.local-card-back:first-child{
  margin-left:0;
}

.center-area{
  top:43%;
  width:430px;
  height:300px;
  z-index:10;
}

.round-info{
  position:absolute;
  top:-105px;
  left:50%;
  transform:translateX(-50%);
  margin:0;
  z-index:25;
}

.played-cards{
  position:absolute;
  inset:0;
  width:auto;
  height:auto;
}

.hand{
  width:92%;
  height:150px;
  bottom:8px;
}

.game-card{
  width:104px;
  height:144px;
  margin-left:-18px;
  padding:0!important;
  overflow:hidden;
  border-radius:10px;
  background:#fff;
}

.game-card img,
.play-card img{
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  pointer-events:none;
  user-select:none;
}

.game-card:not(:disabled):hover,
.game-card.selectable{
  transform:translateY(-17px);
  z-index:30;
}

.play-card{
  width:90px;
  height:126px;
  padding:0!important;
  overflow:hidden;
  border-radius:10px;
  background:#fff;
}

.play-pos-0{bottom:0}
.play-pos-1{left:5px}
.play-pos-2{top:0}
.play-pos-3{right:5px}

/* Licitația locală direct în centrul mesei */
.local-table-action{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:370px;
  margin:0!important;
  padding:18px!important;
  display:block;
  z-index:60;
  border:1px solid rgba(232,190,99,.32);
  border-radius:18px;
  background:rgba(5,20,12,.95);
  box-shadow:0 18px 45px rgba(0,0,0,.46);
  text-align:center;
}

.local-table-action.hidden{
  display:none!important;
}

.local-table-action>div:first-child{
  max-width:none;
}

.local-table-action .action-kicker{
  display:block;
}

.local-table-action .action-buttons{
  margin-top:13px;
  justify-content:center;
}

.local-table-action .action-btn{
  min-width:58px;
  min-height:54px;
  border-color:rgba(232,190,99,.32);
}

.local-stock-visual{
  position:absolute;
  left:10%;
  top:43%;
  transform:translateY(-50%);
  z-index:25;
  min-width:110px;
  padding:9px;
  border-radius:13px;
  background:rgba(4,13,8,.86);
  border:1px solid rgba(255,255,255,.11);
  text-align:center;
}

.local-stock-visual:empty{
  display:none;
}

.local-stock-visual>span{
  display:block;
  color:var(--gold2);
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
}

.local-stock-visual>strong{
  display:block;
  margin-top:3px;
  font-size:23px;
}

.local-stock-visual>small{
  display:block;
  margin-top:3px;
  color:#aebcb2;
  font-size:9px;
  line-height:1.3;
}

.local-stock-stack{
  position:relative;
  width:70px;
  height:95px;
  margin:0 auto 7px;
}

.local-stock-card{
  --i:0;
  position:absolute;
  left:calc(var(--i) * 2px);
  top:calc(var(--i) * -2px);
  width:62px;
  height:88px;
  border:2px solid #eee4d2;
  border-radius:6px;
  background:
    linear-gradient(45deg,rgba(255,255,255,.12) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.12) 75%),
    #1a4f84;
  background-size:9px 9px;
}

.game-status{
  max-width:1120px;
  margin:14px auto 0;
}

/* Rezultatul rundei rămâne central, ca overlay */
.modal{
  background:rgba(2,7,4,.50);
}

.modal-card{
  width:min(500px,calc(100% - 30px));
  border:2px solid rgba(255,216,139,.36);
  background:rgba(7,24,15,.97);
}

@media(max-width:850px){
  .game-table{
    width:100%;
    height:610px;
    min-height:610px;
    border-radius:34px;
  }

  .game-table:after{
    border-radius:26px;
  }

  .game-table.players-2 .seat-left{
    top:8px;
  }

  .seat-top{
    top:8px;
  }

  .seat-left{left:5px}
  .seat-right{right:5px}

  .hand{
    width:98%;
    height:110px;
  }

  .game-card{
    width:75px;
    height:104px;
    margin-left:-24px;
  }

  .center-area{
    width:280px;
    height:220px;
  }

  .play-card{
    width:66px;
    height:93px;
  }

  .local-table-action{
    width:290px;
    padding:14px!important;
  }

  .local-stock-visual{
    left:3%;
    transform:translateY(-50%) scale(.85);
  }
}
/* =========================================================
   CRUCE LOCAL MOBILE — pozițiile cărților jucate
   ========================================================= */
@media (max-width:700px){

  .local-mobile-played{
    position:absolute!important;
    width:70px!important;
    height:98px!important;
    margin:0!important;
    padding:0!important;
    border-radius:9px!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:0 8px 20px rgba(0,0,0,.38)!important;
    z-index:55!important;
    pointer-events:none!important;
  }

  .local-mobile-played img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:fill!important;
  }

  /* adversarul de sus */
  .local-mobile-played-top{
    left:50%!important;
    top:108px!important;
    right:auto!important;
    bottom:auto!important;
    transform:translateX(-50%)!important;
  }

  /* cartea ta */
  .local-mobile-played-bottom{
    left:50%!important;
    bottom:226px!important;
    right:auto!important;
    top:auto!important;
    transform:translateX(-50%)!important;
  }

  /* adversar stânga */
  .local-mobile-played-left{
    left:24%!important;
    top:43%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translate(-50%,-50%) rotate(-90deg)!important;
  }

  /* adversar dreapta */
  .local-mobile-played-right{
    right:24%!important;
    top:43%!important;
    left:auto!important;
    bottom:auto!important;
    transform:translate(50%,-50%) rotate(90deg)!important;
  }
}
/* =========================================================
   CRUCE LOCAL MOBILE v1.3.4
   Licitație compactă pe telefon
   ========================================================= */
@media (max-width:700px){

    .local-auction-box,
    .table-auction-card{
        width:260px !important;
        max-width:calc(100vw - 90px) !important;
        padding:10px 9px !important;
        border-radius:14px !important;
    }

    .local-auction-box h2,
    .local-auction-box h3,
    .table-auction-card h2,
    .table-auction-card h3{
        margin:3px 0 5px !important;
        font-size:20px !important;
        line-height:1.05 !important;
    }

    .local-auction-box p,
    .table-auction-card p{
        margin:4px 0 7px !important;
        font-size:11px !important;
        line-height:1.25 !important;
    }

    .local-auction-box .auction-actions,
    .local-auction-box .table-auction-actions,
    .table-auction-card .auction-actions,
    .table-auction-card .table-auction-actions{
        gap:5px !important;
        margin-top:6px !important;
    }

    .local-auction-box button,
    .table-auction-card button{
        min-width:58px !important;
        min-height:44px !important;
        padding:6px 7px !important;
        font-size:12px !important;
    }
}
/* CRUCE LOCAL — licitatia trebuie sa fie peste talon */
@media (max-width:700px){

    .local-table-action{
        z-index:100 !important;
    }

    .local-stock-visual{
        z-index:30 !important;
    }

    .player-seat{
        z-index:65 !important;
    }

    .hand{
        z-index:60 !important;
    }
}
\n\n/* ===== MOBILE TABLE LAYOUT v1.3.0 — LOCAL ===== */\n@media (max-width:700px){\n  .center-area{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;left:0!important;top:0!important;transform:none!important;pointer-events:none!important;}\n  .played-cards{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;}\n  .play-card{position:absolute!important;width:76px!important;height:106px!important;padding:0!important;z-index:55!important;}\n  .play-card img{width:100%!important;height:100%!important;object-fit:fill!important;}\n  .play-pos-0{left:50%!important;bottom:154px!important;top:auto!important;right:auto!important;transform:translateX(-50%)!important;}\n  .players-2 .play-pos-1{left:50%!important;top:118px!important;right:auto!important;bottom:auto!important;transform:translateX(-50%)!important;}\n  .players-3 .play-pos-1,.players-4 .play-pos-1{left:82px!important;top:42%!important;right:auto!important;bottom:auto!important;transform:translateY(-50%) rotate(-10deg)!important;}\n  .players-3 .play-pos-2,.players-4 .play-pos-2{left:50%!important;top:118px!important;right:auto!important;bottom:auto!important;transform:translateX(-50%)!important;}\n  .players-4 .play-pos-3{right:82px!important;top:42%!important;left:auto!important;bottom:auto!important;transform:translateY(-50%) rotate(10deg)!important;}\n  .local-stock-visual{z-index:30!important;}\n  .play-card{z-index:55!important;}\n  .player-seat{z-index:65!important;}\n  .hand{z-index:60!important;}\n}\n