/* 战场按钮：统一的令牌样式。本文件在 battlefield.css 之后加载，按钮的绘制全部归这里管。 */
:where(button,[role="button"],.opt-card){
  --rim:#b59a61;--ink:#f3dfb1;--glow:#d5ab5240;--face:#30332e;--depth:#111a19;
}
body button{min-width:0;min-height:42px;padding:9px 22px;font-size:21px}
/* 战场令牌：颜色由动作语义决定，装饰不参与点击或按钮名称。 */
#controlPanel{
  border:0;border-radius:0;
  background:radial-gradient(ellipse at center,#11191bd9,transparent 72%);
  box-shadow:none;
}
#controlPanel #promptText{
  font-family:"STKaiti","KaiTi","Kaiti SC","Noto Serif CJK SC",serif;
  color:#e9d6ae;letter-spacing:.16em;font-weight:400;
  text-shadow:0 2px 3px #000;
}
#controlPanel #promptText b{font-weight:600}
#controlPanel .ctrl-btns{gap:12px;max-width:100%}
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card){
  appearance:none;isolation:isolate;
  border:0;border-radius:0;overflow:hidden;
  clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);
  background:linear-gradient(135deg,#fff0ba,var(--rim) 24%,#655034 50%,var(--rim) 78%,#f7dfa0);
  color:var(--ink);font-family:"STKaiti","KaiTi","Kaiti SC","Noto Serif CJK SC",serif;
  font-weight:700;line-height:1.2;letter-spacing:.12em;
  text-indent:.12em;text-shadow:0 2px 2px #000,0 0 12px var(--glow);
  box-shadow:none;filter:none;opacity:1;
  transition:filter .2s,transform .16s;
}
/* 内层切角与蚀刻纹理，避免高光覆盖文字。 */
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card)::before{
  content:"";position:absolute;inset:1px;z-index:-1;pointer-events:none;
  clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);
  background:
    linear-gradient(110deg,transparent 28%,#fff1c20d 46%,transparent 64%),
    repeating-linear-gradient(165deg,#fff1c204 0 1px,transparent 1px 4px),
    radial-gradient(ellipse at 50% 0,var(--glow),transparent 70%),
    linear-gradient(180deg,var(--face),var(--depth));
  box-shadow:inset 0 2px 6px #0009;
  transform:none;transition:none;
}
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card)::after{
  content:"";position:absolute;inset:5px;z-index:-1;pointer-events:none;
  border:1px solid var(--rim);opacity:.65;
  background:
    linear-gradient(45deg,transparent 36%,var(--rim) 38% 45%,transparent 47% 53%,var(--rim) 55% 62%,transparent 64%) left 5px center / 12px 12px no-repeat,
    linear-gradient(45deg,transparent 36%,var(--rim) 38% 45%,transparent 47% 53%,var(--rim) 55% 62%,transparent 64%) right 5px center / 12px 12px no-repeat;
  clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px);
}
#controlPanel #btnEnd:not(:disabled){--face:#733c29;--depth:#2d1714;--rim:#ddba72;--ink:#fff0c9;--glow:#ffb84e45}
#controlPanel #btnOk:not(:disabled){--face:#454333;--depth:#20231b;--rim:#cfb375}
#controlPanel #btnCancel:not(:disabled){--face:#30383c;--depth:#151c22;--rim:#9a9c94;--ink:#e1ded1;--glow:#bec6c02b}
#controlPanel .skill-action:not(:disabled){--face:#214841;--depth:#102b2a;--rim:#83b8a2;--ink:#d9f4da;--glow:#71deb32b}
#controlPanel :is(#btnEnd,.skill-action):not(:disabled),
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card):not(:disabled):hover{
  border:0;background:linear-gradient(135deg,#fff0ba,var(--rim) 24%,#655034 50%,var(--rim) 78%,#f7dfa0);
  color:var(--ink);box-shadow:none;
}
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card):not(:disabled):hover{filter:brightness(1.22);transform:translateY(-2px)}
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card):not(:disabled):hover::before{transform:none}
#controlPanel .skill-action:not(:disabled)::before{background:radial-gradient(ellipse at 50% 0,var(--glow),transparent 70%),repeating-linear-gradient(165deg,#d9fff008 0 1px,transparent 1px 4px),linear-gradient(180deg,var(--face),var(--depth))}
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card):not(:disabled):active{transform:translateY(1px);filter:brightness(.95);box-shadow:none}
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card):focus-visible{outline:none;filter:brightness(1.35)}
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card):focus-visible::after{border:2px solid #fff1c8;opacity:1}
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card):disabled{
  --rim:#68665b;--ink:#a5a397;--face:#282c2a;--depth:#171c1d;--glow:transparent;
  background:#68665b;color:var(--ink);opacity:1;filter:none;text-shadow:0 1px 2px #000;box-shadow:none;cursor:default;
}
#controlPanel #skillActions{gap:8px;padding:3px 0}
#controlPanel .ctrl-btns button{white-space:nowrap}
#controlPanel .skill-action{min-width:138px;font-size:23px}

/* 各处按钮的尺寸：战场令牌最大，开场／选将／弹窗依次收小。 */
body button,#modal .opt-card{position:relative}
body [role="button"]{cursor:pointer}
#controlPanel :is(.ctrl-btns button,.skill-action){min-width:138px;min-height:52px;font-size:25px}
:is(#startScreen,#pickScreen,#overScreen) .btn-primary:not(:disabled){
  --face:#733c29;--depth:#2d1714;--rim:#ddba72;--ink:#fff0c9;--glow:#ffb84e45;
  min-height:52px;font-size:25px;
}
:is(#startScreen,#pickScreen) button.on:not(:disabled){
  --face:#705726;--depth:#382a15;--rim:#e6c57d;--ink:#fff3cf;--glow:#ffcf6850;
}
:is(#startScreen,#pickScreen) button.on::after{border-width:2px;opacity:1}
#startScreen .seg button{padding:8px 12px;font-size:20px;min-height:40px;letter-spacing:.04em}
#startScreen .seg-id button{padding:8px 5px;font-size:18px}
#startScreen .seg button::after{background:none}
#startScreen .btn-ghost{font-size:18px;min-height:38px;--rim:#827555}
#pickScreen .pick-filters button{font-size:18px;min-height:36px;padding:7px 17px}
#pickScreen .pick-filters button::after{background:none}
#modal .modal-foot button{min-width:110px;min-height:50px;font-size:24px;padding:10px 26px}
/* 对局菜单：工具条只有 44px 高，按钮必须比战场上的令牌小一号 */
#btnMenu{min-height:32px;padding:5px 14px;font-size:17px;letter-spacing:.08em}
#menuPanel .seg button{min-height:34px;padding:6px 4px;font-size:16px;letter-spacing:.04em}
#menuPanel .menu-item{min-height:38px;padding:8px 12px;font-size:17px;letter-spacing:.06em}
#menuPanel :is(.seg button,.menu-item)::after{background:none}
#menuPanel .seg button.on:not(:disabled){--face:#705726;--depth:#382a15;--rim:#e6c57d;--ink:#fff3cf;--glow:#ffcf6850}
#menuPanel .seg button.on::after{border-width:2px;opacity:1}
#menuPanel #btnQuit:not(:disabled){--face:#30383c;--depth:#151c22;--rim:#9a9c94;--ink:#e1ded1;--glow:#bec6c02b}
#modal .skill-choice button{--face:#214841;--depth:#102b2a;--rim:#83b8a2;--ink:#d9f4da;--glow:#71deb32b;font-size:17px;letter-spacing:.2em}
#modal :is(.modal-title,.skill-choice h3){font-family:"STKaiti","KaiTi","Kaiti SC",serif;letter-spacing:.12em}
body .identity-menu button{font-size:18px;min-height:36px;padding:7px 13px}
body .identity-note[role="button"]{font-size:12px;min-height:24px;padding:4px 8px;letter-spacing:0}
body :is(.identity-menu button,.identity-note[role="button"])::after{background:none;inset:3px}
@media(max-width:1100px){
  #controlPanel :is(.ctrl-btns button,.skill-action){min-width:100px;padding:10px 23px;font-size:22px}
  #controlPanel .ctrl-btns{gap:8px}
}
@media(max-height:780px){
  #controlPanel :is(.ctrl-btns button,.skill-action){min-height:46px;padding-top:8px;padding-bottom:8px;font-size:22px}
}
@media(prefers-reduced-motion:reduce){
  :is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card){transition:none}
  :is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card):not(:disabled):hover{transform:none}
}

/* 分段选择器和身份小标签太窄，塞不下蚀刻边框，只留切角。 */
:is(body button, body [role="button"], #modal .modal-foot button:first-child, #modal .opt-card):is(.seg button,.pick-filters button,.identity-menu button,.identity-note)::after{background:none}
:is(body button, #modal .modal-foot button:first-child):is(.seg button,.pick-filters button).on::after{border-width:2px;opacity:1}
