/* ============================================================
   hud.cut.css — 切角五模板 + 边线双层法 + 打印降级
   禁止在业务里手写 polygon。
   ============================================================ */

:root {
  --c: var(--hud-cut);

  /* ① 对角双切：左上 + 右下（默认） */
  --cut-tl-br: polygon(
    var(--c) 0, 100% 0,
    100% calc(100% - var(--c)), calc(100% - var(--c)) 100%,
    0 100%, 0 var(--c));

  /* ② 对角双切：右上 + 左下 */
  --cut-tr-bl: polygon(
    0 0, calc(100% - var(--c)) 0, 100% var(--c),
    100% 100%, var(--c) 100%, 0 calc(100% - var(--c)));

  /* ③ 四角全切（8 点，主面板专用） */
  --cut-all: polygon(
    var(--c) 0, calc(100% - var(--c)) 0, 100% var(--c),
    100% calc(100% - var(--c)), calc(100% - var(--c)) 100%,
    var(--c) 100%, 0 calc(100% - var(--c)), 0 var(--c));

  /* ④ 单角切：右上 */
  --cut-tr: polygon(
    0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%);

  /* ⑤ 条形件：左直角 + 右下斜切（固定 5px） */
  --cut-bar: polygon(
    0 0, 100% 0, 100% calc(100% - 5px), calc(100% - 5px) 100%, 0 100%);
}

/* ---------- 应用类 ---------- */
.cut-tl-br { clip-path: var(--cut-tl-br); }
.cut-tr-bl { clip-path: var(--cut-tr-bl); }
.cut-all   { clip-path: var(--cut-all); }
.cut-tr    { clip-path: var(--cut-tr); }
.cut-bar   { clip-path: var(--cut-bar); }

/* ---------- 边线双层法：让斜边也有描边 ----------
   用法：
   <div class="cut-edge cut-tl-br"><div class="cut-edge__in">内容</div></div>
   ---------------------------------------------------- */
.cut-edge {
  background: var(--hud-line-a);
  clip-path: var(--cut-tl-br);
  padding: 1px;
}
.cut-edge__in {
  background: var(--hud-bg-2);
  clip-path: var(--cut-tl-br);
  height: 100%;
}

/* ---------- 发光：clip-path 会裁掉 box-shadow，用 drop-shadow ---------- */
.cut-glow {
  filter: drop-shadow(0 0 10px var(--hud-a18));
}

/* ---------- 形状纪律 ---------- */
[class*="cut-"], .hud-panel, .hud-kpi, .hud-chip, .hud-btn, .hud-bar, .hud-seg {
  border-radius: 0;
}

/* ---------- 打印：切角裁正文，必须降级 ---------- */
@media print {
  [class*="cut-"], .hud-panel, .hud-kpi, .hud-chip, .hud-btn, .hud-bar, .hud-seg {
    clip-path: none !important;
  }
}