:root{
  --gold:#d4af37; --gold2:#f5d97a; --gold3:#9a7d1f;
  --bg:#0a0a0a; --bg2:#121212; --panel:#1a1a1a;
  --line:#2a2a2a; --text:#f0e6c8; --text-dim:#a8996f;
  --green:#0b4a2e; --green2:#0e5a36; --red:#c0392b;
  --safe-top:env(safe-area-inset-top, 0px); --safe-bot:env(safe-area-inset-bottom, 0px);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{font-family:'PingFang SC','Microsoft YaHei',system-ui,-apple-system,sans-serif;background:radial-gradient(circle at 50% -10%,#2a2417 0%,var(--bg) 60%);color:var(--text);overflow-x:hidden}
.gold-line{height:3px;background:linear-gradient(90deg,transparent,var(--gold),var(--gold2),var(--gold),transparent)}
.app{max-width:1100px;margin:0 auto;padding:calc(10px + var(--safe-top)) calc(12px + var(--safe-bot)) calc(20px + var(--safe-bot));min-height:100dvh}

/* 通用 */
.hidden{display:none!important}
.gold-btn{background:linear-gradient(180deg,var(--gold2),var(--gold));border:1px solid var(--gold3);color:#1a1205;border-radius:10px;padding:8px 14px;font-weight:700;cursor:pointer;font-size:14px;box-shadow:0 2px 10px rgba(212,175,55,.25);transition:.15s}
.gold-btn:active{transform:scale(.96)}
.gold-btn.sm{padding:6px 10px;font-size:12px}
.gold-btn.big{padding:12px 22px;font-size:16px}
.gold-btn.ghost{background:transparent;color:var(--gold);border:1px solid var(--gold3)}
.gold-btn:disabled{opacity:.5;cursor:not-allowed}
.gold-input{background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--text);font-size:14px;outline:none;min-width:0}
.gold-input:focus{border-color:var(--gold)}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:50;padding:20px}
.gold-card{background:linear-gradient(180deg,#1d1a10,#14100a);border:1px solid var(--gold3);border-radius:16px;box-shadow:0 0 30px rgba(212,175,55,.18),inset 0 1px 0 rgba(255,255,255,.06);padding:24px;max-width:420px;width:100%;text-align:center;color:var(--text)}
.gold-card.wide{max-width:640px}
.modal{text-align:left}

/* 登录 */
.logo{font-size:52px;margin-bottom:8px}
.brand{font-size:24px;color:var(--gold2);letter-spacing:2px;margin-bottom:4px}
.sub{color:var(--text-dim);font-size:13px;margin-bottom:18px}
.avatar-row{display:flex;gap:8px;justify-content:center;margin:14px 0;flex-wrap:wrap}
.avatar-item{font-size:26px;width:46px;height:46px;line-height:46px;border:1px solid var(--line);border-radius:50%;cursor:pointer;background:var(--bg2)}
.avatar-item.sel{border-color:var(--gold);box-shadow:0 0 10px rgba(212,175,55,.6)}
#loginBtn{margin-top:8px;width:100%}

/* 顶栏 */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 0 14px;flex-wrap:wrap;gap:8px}
.brand-mini{font-size:16px;color:var(--gold2);font-weight:700;letter-spacing:1px}
.topbar-right{display:flex;gap:6px;flex-wrap:wrap}
.table-top{position:sticky;top:0;background:rgba(10,10,10,.9);z-index:10;padding-top:calc(var(--safe-top) + 8px)}

/* 营业横幅 */
.status-banner{padding:12px 16px;border-radius:12px;margin-bottom:12px;font-weight:700;text-align:center;border:1px solid}
.status-banner.open{background:linear-gradient(90deg,#0e5a36,#0b4a2e);border-color:#1a7a4a;color:#a8f0c8;box-shadow:0 0 20px rgba(20,200,120,.2)}
.status-banner.closed{background:linear-gradient(90deg,#3a1a16,#2a120e);border-color:#7a2a1a;color:#f0b8a8}
.status-banner .banner-title{font-size:17px}
.status-banner .banner-sub{font-size:12px;font-weight:400;margin-top:4px;color:inherit;opacity:.85}

/* 场次条 */
.schedule-strip{display:flex;gap:8px;overflow-x:auto;padding-bottom:12px;margin-bottom:12px;scrollbar-width:thin}
.sched-card{flex:0 0 auto;min-width:120px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:12px}
.sched-card.active{border-color:var(--gold);background:#221b0d}
.sched-card .n{color:var(--gold2);font-weight:700}
.sched-card .t{color:var(--text-dim);margin-top:2px}

/* 操作栏 */
.action-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.action-bar .gold-btn{flex:1;min-width:120px}
.filter{flex:0 0 auto}
.filter .gold-input{width:110px}

/* 多桌网格 */
.room-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.room-card{background:linear-gradient(180deg,#1d1a10,#14100a);border:1px solid var(--gold3);border-radius:14px;padding:14px;cursor:pointer;transition:.15s;box-shadow:0 3px 12px rgba(0,0,0,.5)}
.room-card:active{transform:scale(.98)}
.room-card.playing{border-color:var(--red)}
.room-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.room-no{font-size:16px;color:var(--gold2);font-weight:700}
.room-status{padding:3px 8px;border-radius:20px;font-size:11px;font-weight:700}
.room-status.waiting{background:rgba(20,200,120,.15);color:#5fe0a0;border:1px solid rgba(20,200,120,.4)}
.room-status.playing{background:rgba(200,60,50,.15);color:#f08070;border:1px solid rgba(200,60,50,.4)}
.room-bet{color:var(--text-dim);font-size:13px;margin-bottom:10px}
.seat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mini-seat{display:flex;align-items:center;gap:8px;background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:6px}
.mini-seat.free{justify-content:center;color:var(--text-dim);font-size:12px;border-style:dashed;cursor:pointer}
.mini-seat.free:hover{border-color:var(--gold)}
.mini-seat .av{font-size:18px}
.mini-seat .nm{font-size:12px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-seat .chips{font-size:10px;color:var(--gold)}

/* 牌桌 */
.table-stage{position:relative;padding-bottom:20px}
.seat{position:absolute;z-index:5}
.seat-box{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:6px 10px;min-width:110px;text-align:center}
.seat-box.self{border-color:var(--gold);box-shadow:0 0 12px rgba(212,175,55,.4)}
.seat-box .sname{font-size:13px;color:var(--gold2);font-weight:700}
.seat-box .schip{font-size:11px;color:var(--text-dim)}
.seat-box .smark{font-size:10px;color:#5fe0a0;margin-top:2px}
.top-seat{top:0;left:50%;transform:translateX(-50%)}
.bottom-seat{bottom:70px;left:50%;transform:translateX(-50%)}
.left-seat{left:0;top:50%;transform:translateY(-50%)}
.right-seat{right:0;top:50%;transform:translateY(-50%)}

.center-table{display:flex;align-items:center;justify-content:center;padding:70px 70px 70px}
.table-felt{position:relative;width:min(560px,72vw);aspect-ratio:4/3;background:radial-gradient(ellipse at center,var(--green2),var(--green));border:8px solid #6b4f2a;border-radius:48% 48% 44% 44% / 40% 40%;box-shadow:0 0 40px rgba(0,0,0,.6),inset 0 0 40px rgba(0,0,0,.5);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.wild-tile{font-size:22px;color:var(--gold2);font-weight:700;text-shadow:0 0 8px rgba(212,175,55,.8);display:flex;align-items:center;gap:8px}
.wall{font-size:13px;color:rgba(240,230,200,.8)}
.last-discard{font-size:26px;min-height:34px}
.discard-pool{font-size:12px;color:rgba(240,230,200,.7);max-width:80%;text-align:center;line-height:1.6;max-height:64px;overflow:hidden}
.pot-info{font-size:12px;color:var(--gold2);margin-top:4px}

/* 手牌区 */
.hand-area{display:flex;justify-content:center;flex-wrap:wrap;gap:3px;min-height:56px;padding:0 10px;align-items:flex-end}
.tile{width:40px;height:54px;background:linear-gradient(180deg,#fdf6e6,#ece0c6);border:1px solid #cbb98a;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,.4);transition:.12s;position:relative;user-select:none}
.tile:active{transform:translateY(-8px)}
.tile.suit-w{color:#c0392b}
.tile.suit-s{color:#0a7a4a}
.tile.suit-p{color:#2050a0}
.tile.wild-glow{box-shadow:0 0 12px rgba(245,217,122,.9);border-color:var(--gold2)}
.tile.wild-tag::after{content:'宝';position:absolute;top:-6px;right:-4px;background:var(--gold);color:#1a1205;font-size:9px;border-radius:4px;padding:0 3px}
.tile.stand-glow{box-shadow:0 0 12px rgba(80,200,255,.8)}

/* 操作面板 */
.action-panel{position:fixed;bottom:calc(var(--safe-bot) + 14px);left:0;right:0;display:flex;justify-content:center;gap:10px;padding:12px;z-index:20;background:rgba(10,10,10,.85);backdrop-filter:blur(6px);border-top:1px solid var(--gold3)}
.action-panel .gold-btn{font-size:15px;padding:12px 20px}
.action-btn-hu{background:linear-gradient(180deg,#ffd9a0,#ffb74d);color:#5a2000}
.action-btn-hu{box-shadow:0 0 16px rgba(255,183,77,.7)}

/* 提示 & 结算 */
.toast{position:fixed;top:calc(var(--safe-top) + 60px);left:50%;transform:translateX(-50%);background:rgba(0,0,0,.85);border:1px solid var(--gold);color:var(--gold2);padding:10px 20px;border-radius:10px;z-index:60;font-weight:700}
.result-card .res-title{font-size:26px;color:var(--gold2);margin-bottom:8px}
.result-card .res-fan{font-size:15px;color:var(--text-dim);margin-bottom:12px}
.result-card .res-nets{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;text-align:left}
.res-net{display:flex;justify-content:space-between;padding:6px 10px;background:var(--bg2);border-radius:8px}
.res-net .win{color:#5fe0a0;font-weight:700}
.res-net .lose{color:#f08070;font-weight:700}

/* 弹窗内 */
.modal h2{color:var(--gold2);font-size:18px;margin-bottom:14px}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stat-item{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:12px}
.stat-item .v{font-size:22px;color:var(--gold2);font-weight:700}
.stat-item .l{font-size:12px;color:var(--text-dim);margin-top:2px}
.sched-row{display:flex;align-items:center;gap:10px;background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin-bottom:8px;flex-wrap:wrap;font-size:13px}
.sched-row input{width:90px;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:6px;color:var(--text);font-size:12px}
.sched-row label{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--text-dim)}
.close-x{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--gold);font-size:22px;cursor:pointer}
.rec-row{display:flex;justify-content:space-between;padding:8px;border-bottom:1px solid var(--line);font-size:13px}
.rec-row .w{color:#5fe0a0}.rec-row .l{color:#f08070}
.modal{position:relative}
@media(max-width:560px){
  .center-table{padding:56px 40px 56px}
  .table-felt{border-width:5px}
  .tile{width:34px;height:46px;font-size:15px}
  .seat-box{min-width:84px;padding:4px 8px}
  .left-seat{left:-6px}.right-seat{right:-6px}
  .top-seat{top:-2px}.bottom-seat{bottom:58px}
}
/* ---------- 苹果 iPhone / iOS 专项适配 ---------- */
body{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
.overlay,.action-panel{ -webkit-backdrop-filter:blur(6px); }
/* 刘海屏：登录卡片上移避开顶部 & 底部操作条再让位 Home 指示条 */
@media (pointer:coarse) and (max-width:560px){
  .overlay{ align-items:flex-start; padding-top:calc(var(--safe-top) + 60px); }
  .gold-card{ padding:20px; }
  .logo{ font-size:44px; }
  .brand{ font-size:20px; }
  .action-panel{ padding:10px 12px calc(10px + var(--safe-bot)); }
  .topbar{ padding-top:calc(4px + var(--safe-top)); }
  .table-top{ padding-top:calc(var(--safe-top) + 6px); }
  .bottom-seat{ bottom:calc(58px + var(--safe-bot)); }
  .tile{ width:30px; height:40px; font-size:13px; }
}
/* iPhone SE / 320~375 小屏：进一步收窄避免横向挤压 */
@media (pointer:coarse) and (max-width:380px){
  .action-panel .gold-btn{ padding:10px 14px; font-size:13px; gap:8px; }
  .room-card{ padding:10px; }
  .left-seat{ left:-10px }.right-seat{ right:-10px }
}