/* shell.css — 酒桌平台公共外壳：牌匾 + 底部LED滚动条（手机竖版优先） */
:root{ --led-color:#ffcf4d; }

/* 接入外壳的页面：给顶部牌匾和底部LED让出空间 */
body.dj-shell{ padding-top:84px !important; padding-bottom:78px !important; }

/* ===== 牌匾 ===== */
#plaque{
  display:none; position:fixed; top:0; left:0; right:0; z-index:30;
  padding:8px 12px 10px; text-align:center; pointer-events:none;
}
#plaque .plaque-board{
  max-width:480px; margin:0 auto; position:relative;
  padding:10px 26px 12px; border-radius:12px;
  background:
    repeating-linear-gradient(90deg, rgba(0,0,0,.06) 0 6px, transparent 6px 12px),
    linear-gradient(180deg,#7a5326,#4a2f14 60%,#3a2410);
  border:3px solid #d8b25a;
  box-shadow:
    inset 0 2px 6px rgba(255,255,255,.18),
    inset 0 -8px 12px rgba(0,0,0,.55),
    0 8px 16px rgba(0,0,0,.5);
}
#plaque .plaque-board::before,#plaque .plaque-board::after{
  content:""; position:absolute; top:-9px; width:12px; height:12px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #ffe9b0, #a9781f);
  box-shadow:0 1px 2px rgba(0,0,0,.6);
}
#plaque .plaque-board::before{ left:16px; }
#plaque .plaque-board::after{ right:16px; }
#plaque .plaque-name{
  font-size:26px; font-weight:900; color:#ffe6a8; letter-spacing:4px; line-height:1.2;
  text-shadow:0 1px 0 #2a1a08, 0 2px 3px rgba(0,0,0,.7), 0 0 12px rgba(255,214,120,.35);
}
#plaque .plaque-sub{ font-size:12px; color:#e9c88a; opacity:.92; letter-spacing:3px; margin-top:3px; }

/* ===== 底部 LED ===== */
#led{ display:none; position:fixed; left:0; right:0; bottom:0; z-index:30; pointer-events:none; }

.led{
  max-width:480px; margin:0 auto; background:#000; overflow:hidden;
  border-top:2px solid #241a06; box-shadow:inset 0 0 22px rgba(0,0,0,.95);
  padding:4px 0; font-family:"Courier New",ui-monospace,monospace;
}
.led-track{ display:flex; width:max-content; will-change:transform; }
.led-track span{
  white-space:nowrap; color:var(--led-color); font-size:16px; font-weight:bold;
  text-shadow:0 0 7px var(--led-color); padding-right:6ch; line-height:1.5;
}
.led-left  .led-track{ animation-name:marqueeL; animation-timing-function:linear; animation-iteration-count:infinite; }
.led-right .led-track{ animation-name:marqueeR; animation-timing-function:linear; animation-iteration-count:infinite; }
@keyframes marqueeL{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
@keyframes marqueeR{ from{transform:translateX(-50%);} to{transform:translateX(0);} }

/* 竖向滚动 */
.led-v{
  max-width:480px; margin:0 auto; height:46px; overflow:hidden; background:#000;
  border-top:2px solid #241a06; box-shadow:inset 0 0 22px rgba(0,0,0,.95);
  font-family:"Courier New",ui-monospace,monospace;
}
.led-vtrack{ will-change:transform; text-align:center; }
.led-vtrack div{
  color:var(--led-color); font-size:18px; font-weight:bold; line-height:46px;
  text-shadow:0 0 7px var(--led-color); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 8px;
}
.led-up   .led-vtrack{ animation-name:marqueeU; animation-timing-function:linear; animation-iteration-count:infinite; }
.led-down .led-vtrack{ animation-name:marqueeD; animation-timing-function:linear; animation-iteration-count:infinite; }
@keyframes marqueeU{ from{transform:translateY(0);} to{transform:translateY(-50%);} }
@keyframes marqueeD{ from{transform:translateY(-50%);} to{transform:translateY(0);} }

/* ===== 共用：店铺编辑表单（系统后台 + 商家后台） ===== */
.ed{ --line:#3a5a48; --gold:#f5cf6a; --blue:#5bb8ff; }
.ed .erow{ margin-bottom:12px; }
.ed .egrid{ display:flex; gap:10px; flex-wrap:wrap; }
.ed .egrid > div{ flex:1; min-width:130px; }
.ed label{ display:block; font-size:13px; opacity:.85; margin-bottom:4px; }
.ed input, .ed select{ width:100%; padding:10px; border-radius:9px; border:1px solid var(--line); background:#0b1811; color:#e8f0ea; font-size:15px; }
.ed input[type=color]{ padding:2px; height:44px; }
.ed .codebadge{ display:inline-block; padding:10px 14px; border-radius:9px; background:#0b1811; border:1px solid var(--line); color:var(--gold); font-weight:bold; font-size:18px; letter-spacing:2px; }
.ed .imgpv{ margin-top:8px; max-width:100%; border-radius:10px; border:1px solid var(--line); display:none; }
.ed .spec{ font-size:12px; opacity:.7; margin:2px 0 6px; }
.ed .spec b{ color:var(--gold); }
.ed .games .grow{ display:flex; gap:6px; align-items:center; margin-bottom:8px; }
.ed .games .grow input{ flex:1; }
.ed .games .grow .ico{ max-width:60px; text-align:center; }
.ed .btn{ border:0; border-radius:10px; padding:10px 14px; font-size:14px; font-weight:bold; cursor:pointer; background:var(--gold); color:#4a3600; }
.ed .btn.ghost{ background:transparent; color:#e8f0ea; border:1px solid var(--line); }
.ed .btn.danger{ background:#ff5b4d; color:#fff; }
.ed .btn.small{ padding:7px 10px; font-size:13px; }
.ed .linkline{ font-size:12px; word-break:break-all; background:#0b1811; border:1px solid var(--line); border-radius:8px; padding:8px; margin-top:8px; }
.ed .linkline a{ color:var(--blue); }