/* ============================================================
   SEMS — File Manager
   จอใหญ่: 2 คอลัมน์ (แถบประเภทเอกสาร + พื้นที่ไฟล์)
   มือถือ : แบบเว็บเมล — แถบบนกระชับ · รายการ 2 บรรทัด · ปุ่มลอย
   ============================================================ */

:root{
  --fm-acc:#3b9edb;
  --fm-acc-soft:rgba(59,158,219,.13);
}
html[data-theme="light"]{
  --fm-acc:#1565c0;
  --fm-acc-soft:rgba(21,101,192,.10);
}

html.fm-page, html.fm-page body{ height:100%; overflow:hidden; }

.fm{
  position:fixed; inset:0; top:var(--fm-top, 0);
  display:flex; flex-direction:column;
  background:var(--bg); color:var(--ink); font-size:14px;
}
.fm-main{ flex:1; min-height:0; display:flex; }

/* ---------- แถบประเภทเอกสาร ---------- */
.fm-side{
  width:272px; flex:0 0 272px;
  background:var(--bg-panel); border-right:1px solid var(--line);
  display:flex; flex-direction:column; min-height:0;
}
.fm-side .head{
  height:58px; flex:0 0 58px; display:flex; align-items:center;
  justify-content:space-between; padding:0 16px; border-bottom:1px solid var(--line);
}
.fm-side .head h2{ margin:0; font-size:14.5px; font-weight:600; }
.fm-side .head h2 small{ color:var(--ink-faint); font-weight:400; font-size:12.5px; margin-left:5px; }

.fm-side .scroll{ flex:1; overflow-y:auto; }
.fm-side .foot{ border-top:1px solid var(--line); padding:13px 16px; flex:none; }

/* ---------- บริบทงาน (บรรทัดเดียว) ---------- */
.fm-ctx1{
  display:flex; align-items:center; gap:9px; width:100%; flex:none;
  padding:13px 14px; cursor:pointer; text-align:left;
  background:var(--bg-raised); border:none; border-bottom:1px solid var(--line);
  color:var(--ink); font-family:var(--sans); font-size:12.5px;
}
.fm-ctx1:hover{ background:var(--line); }
.fm-ctx1 > svg{ width:16px; height:16px; flex:none; color:var(--fm-acc); }
.fm-ctx1 .v{
  flex:1; min-width:0; font-weight:600;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.fm-ctx1 .v.none{ color:var(--fm-acc); font-weight:400; }
.fm-ctx1 .ar{ flex:none; color:var(--ink-faint); font-size:13px; }

/* ---------- รายการประเภท ---------- */
.fm-folder{
  display:flex; align-items:center; gap:11px; width:100%;
  padding:11px 16px; cursor:pointer; background:none;
  border:none; border-left:3px solid transparent;
  font-family:var(--sans); text-align:left; color:var(--ink);
}
.fm-folder:hover{ background:var(--bg-raised); }
.fm-folder.on{ background:var(--bg-raised); border-left-color:var(--fm-acc); }
.fm-folder.on .f-th{ color:var(--fm-acc); }

.fm-folder .swatch{
  width:17px; height:14px; border-radius:2px 3px 3px 3px; flex:0 0 17px;
  background:var(--ink-faint); position:relative;
}
.fm-folder .swatch::before{
  content:''; position:absolute; top:-4px; left:0; width:8px; height:4px;
  border-radius:2px 2px 0 0; background:inherit;
}
.fm-folder.on .swatch{ background:var(--fm-acc); }
.fm-folder .txt{ flex:1; min-width:0; }
.fm-folder .f-th{ font-size:13px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fm-folder .f-en{ font-size:11.5px; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fm-folder .f-n{ font-size:11.5px; color:var(--ink-faint); font-family:var(--mono); flex:none; }

.fm-bar-lbl{ display:flex; justify-content:space-between; font-size:11.5px; color:var(--ink-dim); margin-bottom:7px; }
.fm-bar{ height:5px; border-radius:3px; background:var(--bg-raised); overflow:hidden; }
.fm-bar i{ display:block; height:100%; background:var(--fm-acc); }

/* ---------- พื้นที่ไฟล์ ---------- */
.fm-body{ flex:1; min-width:0; display:flex; flex-direction:column; background:var(--bg); }

/* แถบบนแบบมือถือ (ซ่อนบนจอใหญ่) */
.fm-mhead{ display:none; }

.fm-crumb{
  height:52px; flex:0 0 52px; display:flex; align-items:center; gap:12px;
  padding:0 16px; border-bottom:1px solid var(--line); overflow:hidden;
}
.fm-crumb .path{
  flex:0 0 auto; max-width:250px; display:flex; align-items:center; gap:6px;
  font-size:13px; color:var(--ink-dim); white-space:nowrap; overflow:hidden;
}
.fm-crumb .path b{ color:var(--ink); font-weight:500; overflow:hidden; text-overflow:ellipsis; }
.fm-crumb .sel{ flex:0 0 auto; font-size:12.5px; color:var(--ink-dim); white-space:nowrap; }
.fm-crumb .grow{ flex:1; }

.fm-find{ flex:0 1 330px; min-width:170px; position:relative; display:flex; align-items:center; }
.fm-find svg.ico{ position:absolute; left:11px; width:14px; height:14px; color:var(--ink-faint); pointer-events:none; }
.fm-find input{
  width:100%; background:var(--bg-raised); border:1px solid var(--line-strong);
  color:var(--ink); border-radius:7px; padding:8px 32px;
  font-family:var(--sans); font-size:13px;
}
.fm-find input:focus{ outline:none; border-color:var(--fm-acc); }
.fm-find .clr{
  position:absolute; right:5px; width:24px; height:24px; padding:0;
  border:none; border-radius:6px; background:none; color:var(--ink-faint); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
}
.fm-find .clr svg{ width:13px; height:13px; }
.fm-find .clr:hover{ color:var(--danger); }

.fm-sort{
  flex:0 0 auto; background:none; border:none; cursor:pointer;
  font-family:var(--sans); font-size:12.5px; color:var(--ink-dim);
  display:inline-flex; align-items:center; gap:5px; white-space:nowrap; padding:6px 4px;
}
.fm-sort:hover{ color:var(--ink); }

.fm-viewsw{
  flex:0 0 auto; display:flex; background:var(--bg-raised);
  border:1px solid var(--line-strong); border-radius:7px; overflow:hidden;
}
.fm-viewsw button{
  padding:6px 9px; border:none; background:none; cursor:pointer;
  color:var(--ink-dim); display:inline-flex; align-items:center;
}
.fm-viewsw button svg{ width:16px; height:16px; }
.fm-viewsw button.on{ background:var(--line-strong); color:var(--ink); }

/* ---------- แถบเครื่องมือ ---------- */
.fm-tools{
  flex:0 0 auto; display:flex; align-items:center; gap:6px;
  padding:9px 16px; border-bottom:1px solid var(--line); overflow-x:auto;
}
.fm-tool{
  flex:none; width:34px; height:34px; padding:0; border-radius:8px;
  background:none; border:1px solid transparent; color:var(--ink-dim);
  cursor:pointer; display:inline-flex; align-items:center; justify-content:center;
}
.fm-tool svg{ width:17px; height:17px; }
.fm-tool:hover:not(:disabled){ background:var(--bg-raised); border-color:var(--line-strong); color:var(--ink); }
.fm-tool:disabled{ opacity:.32; cursor:not-allowed; }
.fm-tool.acc{ color:var(--fm-acc); }
.fm-tool.danger:hover:not(:disabled){ color:var(--danger); border-color:var(--danger); }
.fm-tools .sep{ flex:none; width:1px; height:20px; background:var(--line-strong); margin:0 4px; }

.fm-scroll{ flex:1; overflow-y:auto; min-height:0; position:relative; }

/* ---------- มุมมองรายการ (จอใหญ่) ---------- */
.fm-cols{
  display:grid;
  grid-template-columns:22px 28px minmax(180px,1fr) 118px 92px 154px 132px;
  gap:13px; align-items:center;
}
.fm-hd{
  padding:10px 16px; font-size:11.5px; color:var(--ink-faint);
  border-bottom:1px solid var(--line); position:sticky; top:0;
  background:var(--bg); z-index:2;
}
.fm-hd .s{ cursor:pointer; user-select:none; white-space:nowrap; }
.fm-hd .s:hover{ color:var(--ink); }
.fm-hd .s.on{ color:var(--fm-acc); }

.fm-row{
  padding:10px 16px; border-bottom:1px solid var(--line);
  cursor:pointer; background:none; width:100%; text-align:left;
  font-family:var(--sans); color:var(--ink);
}
.fm-row:hover{ background:var(--bg-raised); }
.fm-row.on{ background:var(--fm-acc-soft); }
.fm-row.on .nm{ color:var(--fm-acc); }
.fm-row .nm{ min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:13px; }
.fm-row .dim{ font-size:12.5px; color:var(--ink-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* แถวแบบเว็บเมลใช้เฉพาะมือถือ — บนจอใหญ่ต้องซ่อน ไม่งั้นจะกลายเป็นช่องเกินในกริด */
.fm-row .m1, .fm-row .m2{ display:none; }

.fm-ck{
  width:15px; height:15px; border-radius:3px; padding:0;
  border:1.5px solid var(--line-strong); background:none; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  color:#fff; font-size:10px; line-height:1;
}
.fm-ck.on{ background:var(--fm-acc); border-color:var(--fm-acc); }
.fm-ck.on::after{ content:'✓'; }

.fm-ext{
  width:24px; height:28px; border-radius:3px; flex:none;
  display:flex; align-items:center; justify-content:center;
  font-size:8.5px; font-weight:700;
}

/* ---------- มุมมองตาราง ---------- */
.fm-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(158px, 1fr));
  gap:14px; padding:16px;
}
.fm-card{
  border:1px solid var(--line-strong); border-radius:9px;
  background:var(--bg-panel); overflow:hidden; cursor:pointer;
  padding:0; text-align:left; font-family:var(--sans); color:var(--ink);
}
.fm-card:hover{ border-color:var(--fm-acc); }
.fm-card.on{ border-color:var(--fm-acc); background:var(--fm-acc-soft); }
.fm-card .top{
  height:100px; position:relative; display:flex;
  align-items:center; justify-content:center;
  background:repeating-linear-gradient(135deg,
    var(--bg-raised), var(--bg-raised) 6px,
    var(--bg-panel) 6px, var(--bg-panel) 12px);
}
.fm-card .top .fm-ck{ position:absolute; top:8px; left:8px; }
.fm-card .top .fm-ext{ width:34px; height:42px; font-size:11px; border-radius:4px; }
.fm-card .bot{ padding:10px 11px 12px; }
.fm-card .nm{ font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fm-card.on .nm{ color:var(--fm-acc); }
.fm-card .sub{ font-size:11.5px; color:var(--ink-faint); margin-top:3px; }

/* ---------- ว่าง / ข้อความ ---------- */
.fm-empty{
  height:100%; min-height:260px; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:14px;
  padding:52px 32px; text-align:center;
}
.fm-empty .box{
  width:74px; height:58px; border-radius:4px 8px 8px 8px;
  border:2px dashed var(--line-strong); position:relative;
}
.fm-empty .box::before{
  content:''; position:absolute; top:-8px; left:0; width:30px; height:8px;
  border-radius:3px 3px 0 0; border:2px dashed var(--line-strong); border-bottom:none;
}
.fm-empty p{ margin:0; color:var(--ink-dim); max-width:330px; line-height:1.65; }
.fm-empty small{ color:var(--ink-faint); font-size:12.5px; }
.fm-empty.bad p{ color:var(--danger); }

/* ---------- แถบล่าง ---------- */
.fm-foot{
  height:44px; flex:0 0 44px; border-top:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; gap:14px;
  color:var(--ink-dim); font-size:12.5px; padding:0 10px;
}
.fm-foot button{
  background:none; border:none; color:var(--ink-dim); cursor:pointer;
  font-size:15px; line-height:1; padding:5px 8px; border-radius:6px;
}
.fm-foot button:hover:not(:disabled){ background:var(--bg-raised); color:var(--ink); }
.fm-foot button:disabled{ opacity:.3; cursor:not-allowed; }
.fm-foot .txt{ white-space:nowrap; }

/* ---------- ปุ่มลอย (มือถือ) ---------- */
.fm-fab{ display:none; }

/* ---------- เมนู ⋮ ---------- */
.fm-menu{
  position:fixed; z-index:70; min-width:210px; padding:6px;
  background:var(--bg-panel); border:1px solid var(--line-strong);
  border-radius:12px; box-shadow:0 18px 44px rgba(0,0,0,.42);
  display:none;
}
.fm-menu.on{ display:block; }
.fm-menu button, .fm-menu a{
  display:flex; align-items:center; gap:11px; width:100%;
  padding:10px 12px; border:none; background:none; border-radius:8px;
  color:var(--ink); font-family:var(--sans); font-size:13.5px;
  cursor:pointer; text-align:left; text-decoration:none;
}
.fm-menu button:hover, .fm-menu a:hover{ background:var(--bg-raised); }
.fm-menu button svg, .fm-menu a svg{ width:17px; height:17px; flex:none; color:var(--ink-dim); }
.fm-menu .div{ height:1px; background:var(--line); margin:5px 8px; }
.fm-menu .danger{ color:var(--danger); }
.fm-menu .danger svg{ color:var(--danger); }


/* ---------- แผงพรีวิวขวามือ ---------- */
.fm-prev{
  width:308px; flex:0 0 308px;
  background:var(--bg-panel); border-left:1px solid var(--line);
  display:flex; flex-direction:column; min-height:0; overflow-y:auto;
}
.fm-prev .ph{
  flex:1; display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:14px; padding:40px 26px; text-align:center;
}
.fm-prev .ph .ico{ width:52px; height:52px; color:var(--line-strong); }
.fm-prev .ph .ico svg{ width:100%; height:100%; }
.fm-prev .ph p{ margin:0; color:var(--ink-faint); font-size:12.5px; line-height:1.7; }

.fm-prev .body{ padding:0 0 20px; }

.fm-prev .thumb{
  height:190px; position:relative; display:flex;
  align-items:center; justify-content:center; overflow:hidden;
  background:repeating-linear-gradient(135deg,
    var(--bg-raised), var(--bg-raised) 6px,
    var(--bg-panel) 6px, var(--bg-panel) 12px);
  border-bottom:1px solid var(--line);
}
.fm-prev .thumb img{ width:100%; height:100%; object-fit:contain; display:block; }
.fm-prev .thumb .big{
  width:62px; height:76px; border-radius:6px;
  display:flex; align-items:center; justify-content:center;
  font-size:16px; font-weight:700;
}
.fm-prev .thumb .zoom{
  position:absolute; right:9px; bottom:9px;
  width:32px; height:32px; border-radius:8px; padding:0; cursor:pointer;
  background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.2); color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
}
.fm-prev .thumb .zoom svg{ width:16px; height:16px; }

.fm-prev .name{
  padding:14px 16px 0; font-size:14.5px; font-weight:600;
  line-height:1.45; word-break:break-word;
}
.fm-prev .sub{ padding:6px 16px 0; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.fm-prev .sub .dim{ font-size:11.5px; color:var(--ink-faint); font-family:var(--mono); }

.fm-prev .acts{
  display:flex; gap:6px; flex-wrap:wrap;
  padding:14px 16px; border-bottom:1px solid var(--line);
}

.fm-prev dl{
  margin:0; padding:14px 16px;
  display:grid; grid-template-columns:auto 1fr; gap:8px 14px; font-size:12.5px;
}
.fm-prev dt{ color:var(--ink-faint); white-space:nowrap; }
.fm-prev dd{ margin:0; color:var(--ink); word-break:break-word; }
.fm-prev dd a{ color:var(--fm-acc); }

.fm-prev h4{
  margin:0; padding:14px 16px 8px; font-size:11px; font-weight:700;
  color:var(--ink-faint); text-transform:uppercase; letter-spacing:.6px;
  border-top:1px solid var(--line);
}

/* ============================================================
   จอกลาง
   ============================================================ */
@media (max-width:1250px){
  .fm-prev{ display:none; }
}

@media (max-width:1100px){
  .fm-side{ width:230px; flex-basis:230px; }
  .fm-cols{ grid-template-columns:22px 28px minmax(150px,1fr) 100px 84px 132px; }
  .fm-cols .c-owner{ display:none; }
}

/* ============================================================
   มือถือ — UI แบบเว็บเมล
   ============================================================ */
@media (max-width:820px){

  /* แถบบนใหญ่ซ่อน ใช้แถบกระชับแทน */
  body > .topbar{ display:none !important; }
  .fm{ top:0 !important; }

  .fm-mhead{
    display:flex; align-items:center; gap:4px; flex:0 0 auto;
    padding:calc(env(safe-area-inset-top, 0px) + 8px) 6px 8px;
    background:var(--bg-panel); border-bottom:1px solid var(--line);
  }
  .fm-mhead .mb{
    width:40px; height:40px; flex:none; padding:0; border:none; background:none;
    color:var(--ink); border-radius:9px; cursor:pointer;
    display:inline-flex; align-items:center; justify-content:center;
  }
  .fm-mhead .mb svg{ width:21px; height:21px; }
  .fm-mhead .mb:active{ background:var(--bg-raised); }
  .fm-mhead .title{
    flex:1; min-width:0; text-align:center; font-size:16px; font-weight:600;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 4px;
  }

  /* แถบค้นหาเป็นแถวเต็ม */
  .fm-crumb{
    height:auto; flex:0 0 auto; padding:8px 10px; gap:8px;
    border-bottom:1px solid var(--line);
  }
  .fm-crumb .path, .fm-crumb .sel, .fm-sort, .fm-crumb .grow{ display:none; }
  .fm-find{ flex:1; min-width:0; }
  .fm-find input{ background:none; border:none; padding:8px 30px 8px 30px; font-size:15px; }
  .fm-find input:focus{ border:none; }
  .fm-find svg.ico{ left:6px; width:17px; height:17px; }
  .fm-viewsw{ flex:none; }

  .fm-tools{ display:none; }
  .fm-tools.on{ display:flex; }

  /* ---------- รายการแบบเว็บเมล ---------- */
  .fm-hd{ display:none; }

  .fm-row{
    display:block !important; padding:11px 14px;
    border-bottom:1px solid var(--line);
  }
  .fm-row .m1{
    display:flex; align-items:center; gap:8px;
    font-size:12.5px; color:var(--ink-dim); margin-bottom:5px;
  }
  .fm-row .m1 .from{ flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .fm-row .m1 .when{ flex:none; font-size:12px; }
  .fm-row .m2{ display:flex; align-items:center; gap:9px; }
  .fm-row .m2 .dot{ width:7px; height:7px; border-radius:50%; flex:none; }
  .fm-row .m2 .nm{ flex:1; min-width:0; font-size:15px; color:var(--ink); }
  .fm-row .m2 .clip{ flex:none; color:var(--ink-faint); }
  .fm-row .m2 .clip svg{ width:16px; height:16px; display:block; }
  .fm-row.on{ background:var(--fm-acc-soft); }
  .fm-row.on .m2 .nm{ color:var(--fm-acc); }

  /* ซ่อนคอลัมน์แบบตารางบนมือถือ */
  .fm-row .c-kind, .fm-row .c-size, .fm-row .c-date,
  .fm-row .c-owner, .fm-row .fm-ext, .fm-row > .fm-ck{ display:none; }

  /* โหมดเลือกหลายรายการ — โผล่ checkbox */
  .fm.picking .fm-row > .fm-ck{ display:inline-flex; float:left; margin:12px 12px 0 0; }

  .fm-grid{ grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); gap:11px; padding:12px; }
  .fm-card .top{ height:86px; }

  /* ---------- ปุ่มลอย ---------- */
  .fm-fab{
    display:inline-flex; position:absolute; right:18px;
    bottom:calc(env(safe-area-inset-bottom, 0px) + 18px); z-index:12;
    width:58px; height:58px; border-radius:50%; border:none; padding:0;
    background:var(--fm-acc); color:#fff; cursor:pointer;
    align-items:center; justify-content:center;
    box-shadow:0 8px 22px rgba(0,0,0,.4);
  }
  .fm-fab svg{ width:24px; height:24px; }
  .fm-fab:active{ transform:scale(.94); }

  /* ---------- แถบล่าง ---------- */
  .fm-foot{
    height:auto; padding:11px 8px calc(env(safe-area-inset-bottom, 0px) + 11px);
    gap:10px; font-size:13px;
  }
  .fm-foot button{ font-size:17px; padding:6px 12px; }

  /* ---------- ลิ้นชักซ้าย ---------- */
  .fm-side{
    position:fixed; top:0; left:0; bottom:0; z-index:60;
    width:min(300px, 84vw); flex-basis:auto;
    transform:translateX(-100%); transition:transform .22s ease;
    box-shadow:14px 0 34px rgba(0,0,0,.42);
  }
  .fm.drawer .fm-side{ transform:none; }
  .fm-side .head{ padding-top:calc(env(safe-area-inset-top, 0px) + 4px); height:auto; min-height:58px; }

  .fm-scrim{
    position:fixed; inset:0; z-index:55; background:rgba(0,0,0,.55);
    opacity:0; pointer-events:none; transition:opacity .2s;
  }
  .fm.drawer .fm-scrim{ opacity:1; pointer-events:auto; }

  /* ---------- ตัวดูเอกสารเต็มจอ ---------- */
  .fm-page .form-overlay#pvOverlay{ padding:0; }
  .fm-page #pvOverlay .form-modal{
    max-width:none !important; width:100%; height:100%;
    max-height:none; border-radius:0; border:none;
  }
  .fm-page #pvOverlay .form-body iframe{ height:100% !important; }
  .fm-page #pvOverlay .form-body{ flex:1; }
}

/* จอเล็กมาก */
@media (max-width:380px){
  .fm-mhead .title{ font-size:15px; }
  .fm-row .m2 .nm{ font-size:14px; }
}

/* ---------- ปุ่มจัดการประเภทเอกสาร ---------- */
.fm-addtype{
  display:flex; align-items:center; gap:10px; width:100%;
  padding:12px 16px; margin-top:4px; cursor:pointer;
  background:none; border:none; border-top:1px dashed var(--line-strong);
  color:var(--ink-faint); font-family:var(--sans); font-size:12.5px; text-align:left;
}
.fm-addtype svg{ width:16px; height:16px; flex:none; }
.fm-addtype:hover{ background:var(--bg-raised); color:var(--fm-acc); }

/* ---------- รายการประเภทในหน้าต่างจัดการ ---------- */
.ty-row{
  display:flex; align-items:center; gap:12px; width:100%;
  padding:13px 18px; border-bottom:1px solid var(--line);
  background:none; border-left:none; border-right:none; border-top:none;
  cursor:pointer; font-family:var(--sans); text-align:left; color:var(--ink);
}
.ty-row:hover{ background:var(--bg-raised); }
.ty-row.off{ opacity:.5; }

.ty-row .sw{
  width:19px; height:16px; border-radius:2px 3px 3px 3px; flex:none;
  background:var(--fm-acc); position:relative;
}
.ty-row .sw::before{
  content:''; position:absolute; top:-4px; left:0; width:9px; height:4px;
  border-radius:2px 2px 0 0; background:inherit;
}
.ty-row.off .sw{ background:var(--ink-faint); }

.ty-row .txt{ flex:1; min-width:0; }
.ty-row .t1{ font-size:13.5px; font-weight:600; }
.ty-row .t1 code{
  font-family:var(--mono); font-size:11px; color:var(--ink-faint);
  font-weight:400; margin-left:7px;
}
.ty-row .t2{
  font-size:11.5px; color:var(--ink-faint); margin-top:3px;
  display:flex; gap:10px; flex-wrap:wrap; align-items:center;
}
.ty-row .t2 .tag{
  border:1px solid var(--line-strong); border-radius:99px; padding:1px 8px;
  font-family:var(--mono); font-size:10px;
}
.ty-row .t2 .ok{ color:var(--ok); border-color:var(--ok); }
.ty-row .t2 .warn{ color:var(--amber); border-color:var(--amber); }
.ty-row .n{ flex:none; font-family:var(--mono); font-size:11.5px; color:var(--ink-faint); }

.ty-empty{ padding:40px 24px; text-align:center; color:var(--ink-faint); font-size:13px; }