/* Xuân Thu · Anna 19/10: ĐẶT MAY THEO TUẦN (#dm-tuan, tab Đặt may của Phân tích sản phẩm). Nạp sau app.css, cùng layer screens.
   19/10 chiều (Anna "so xấu"): vẽ lại theo design v2. Nhịp khoảng cách 4/8/12/16/24; chữ 12/13/14/16/20; số canh phải, tabular.
   Ngữ pháp trạng thái: ▲ vàng = nên làm gì đó (hết hàng, hết size, ngoài dải size); ● xám = để biết; không dùng đỏ (không có lỗi, không có trễ ở màn này). */
@layer screens {
  .dmw{min-width:0;max-width:960px;display:flex;flex-direction:column;gap:var(--s-24)}
  .dmw.dmw-mo{opacity:.55;pointer-events:none;transition:opacity var(--t-fast,.15s)}
  .dmw p{margin:0}

  /* đầu màn: chọn tuần + giờ tính */
  .dmw-dau{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-8) var(--s-16)}
  .dmw-tuan{display:flex;align-items:center;gap:var(--s-6);flex:1 1 320px;max-width:440px;min-width:0}
  .dmw-tuan select{flex:1;min-width:0;min-height:44px;font-size:var(--fs-14);font-weight:600;border-color:var(--border-default);background:var(--bg-surface);color:var(--fg-primary)}
  .dmw-tuan .btn{min-width:44px;min-height:44px;padding:0;justify-content:center}
  .dmw-luc{font-size:var(--fs-12);color:var(--fg-muted);line-height:1.4;flex:1 1 240px}

  /* 3 ô số gọn */
  .dmw-dem{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-8)}
  .dmw-o{border:1px solid var(--border-subtle);border-radius:var(--v2-card-r,var(--r-lg));box-shadow:var(--v2-shadow,none);padding:var(--s-12) var(--s-16);background:var(--bg-surface);display:flex;flex-direction:column;gap:2px;min-width:0;text-align:left;font:inherit;color:inherit}
  button.dmw-o{cursor:pointer}
  button.dmw-o:hover{background:var(--bg-hover)}
  .dmw-o b{font-size:var(--fs-24);line-height:1.15;font-weight:700;color:var(--fg-primary);font-variant-numeric:tabular-nums;letter-spacing:var(--ls-tight,0)}
  .dmw-o span{font-size:var(--fs-13);color:var(--fg-secondary);line-height:1.3}
  .dmw-o small{font-size:var(--fs-12);color:var(--fg-muted);line-height:1.3}
  .dmw-o.chua small::before{content:"● "}
  .dmw-o[aria-pressed="true"]{border-color:var(--border-focus);background:var(--bg-selected)}
  .dmw-ch{font-size:var(--fs-13);color:var(--fg-secondary);margin-top:calc(-1 * var(--s-16)) !important;font-variant-numeric:tabular-nums}
  .dmw-ch b{color:var(--fg-primary);font-weight:600}

  /* đầu mục */
  .dmw-k{min-width:0}
  .dmw-h{font-size:var(--fs-16);font-weight:700;line-height:1.3;margin:0 0 var(--s-12);display:flex;flex-wrap:wrap;align-items:baseline;gap:2px var(--s-8)}
  .dmw-hp{font-size:var(--fs-12);font-weight:400;color:var(--fg-muted)}
  .dmw-the-k{border:1px solid var(--border-subtle);border-radius:var(--v2-card-r,var(--r-lg));background:var(--bg-surface);box-shadow:var(--v2-shadow,none);padding:var(--s-12) var(--s-16);display:flex;flex-direction:column;gap:var(--s-8)}

  /* Tuần này thấy gì: thẻ, điều thấy + một việc */
  .dmw-hero .dmw-hp{font-size:var(--fs-13);color:var(--fg-secondary)}
  .dmw-tt{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:var(--s-8)}
  .dmw-the{display:flex;gap:var(--s-12);align-items:flex-start;padding:var(--s-12) var(--s-16);border:1px solid var(--border-subtle);border-radius:var(--v2-card-r,var(--r-lg));background:var(--bg-surface);box-shadow:var(--v2-shadow,none)}
  .dmw-the.canh{background:var(--status-warn-bg);border-color:var(--status-warn-line)}
  .dmw-the>.dmw-g{font-size:var(--fs-14);line-height:1.45}
  .dmw-the-c{display:flex;flex-direction:column;gap:var(--s-4);min-width:0}
  .dmw-thay{font-size:var(--fs-14);line-height:1.45;color:var(--fg-primary);overflow-wrap:anywhere}
  .dmw-viec{display:flex;gap:var(--s-6);align-items:baseline;font-size:var(--fs-14);font-weight:600;line-height:1.4;color:var(--fg-primary)}
  .dmw-viec .ti{color:var(--fg-muted);font-size:var(--fs-13);flex:none}
  .dmw-g{font-style:normal;color:var(--fg-muted);flex:none}
  .dmw-g.canh,.dmw-the.canh>.dmw-g,.dmw-canh{color:var(--status-warn)}

  /* Vì sao: thanh ngang, số phải, vạch mờ = TB 4 tuần */
  .dmw-lh{display:grid;grid-template-columns:minmax(140px,200px) minmax(0,1fr) 88px;gap:var(--s-16);padding:0 var(--s-8);font-size:var(--fs-11);color:var(--fg-muted)}
  .dmw-lh span:last-child{text-align:right}
  .dmw-lh s{display:inline-block;width:2px;height:10px;background:var(--fg-muted);vertical-align:-1px;margin-right:2px}
  .dmw-ly{display:flex;flex-direction:column}
  .dmw-lr{display:grid;grid-template-columns:minmax(140px,200px) minmax(0,1fr) 88px;align-items:center;gap:var(--s-16);min-height:40px;padding:var(--s-4) var(--s-8);border:1px solid transparent;border-radius:var(--r-md);background:none;font:inherit;color:inherit;text-align:left;cursor:pointer}
  .dmw-lr:hover{background:var(--bg-hover)}
  .dmw-lr.on{border-color:var(--border-focus);background:var(--bg-selected)}
  .dmw-lr.rong{color:var(--fg-muted)}
  .dmw-ln{font-size:var(--fs-14);font-weight:500;display:flex;gap:var(--s-6);align-items:baseline;min-width:0}
  .dmw-ln .dmw-g{font-size:var(--fs-12)}
  .dmw-bar{position:relative;display:block;height:8px;border-radius:4px;background:var(--bg-sunken)}
  .dmw-bar i{position:absolute;inset:0 auto 0 0;border-radius:4px;background:var(--fg-secondary);opacity:.55}
  .dmw-lr.canh .dmw-bar i{background:var(--status-warn);opacity:.85}
  .dmw-lr.on .dmw-bar i{background:var(--accent);opacity:1}
  .dmw-bar s{position:absolute;top:-4px;bottom:-4px;width:2px;margin-left:-1px;border-radius:1px;background:var(--fg-primary);opacity:.35}
  .dmw-lv{display:flex;align-items:baseline;justify-content:flex-end;gap:var(--s-6);font-variant-numeric:tabular-nums;white-space:nowrap}
  .dmw-lv b{font-size:var(--fs-16);font-weight:700;min-width:2ch;text-align:right}
  .dmw-lv small{font-size:var(--fs-11);color:var(--fg-muted);order:-1}
  .dmw-lr.rong .dmw-lv b{color:var(--fg-muted);font-weight:500}
  .dmw-ghi{font-size:var(--fs-13);color:var(--fg-secondary);line-height:1.45;overflow-wrap:anywhere}
  .dmw-ghi b{color:var(--fg-primary);font-weight:600}
  .dmw-khong{color:var(--fg-muted)}

  /* loại: một thanh nhiều phần */
  .dmw-seg{display:flex;height:12px;border-radius:6px;overflow:hidden;background:var(--bg-sunken);gap:2px}
  .dmw-seg i{display:block;min-width:4px}
  .dmw-s-size_mau .dmw-sw,.dmw-seg .dmw-s-size_mau{background:var(--accent)}
  .dmw-s-cau_truc .dmw-sw,.dmw-seg .dmw-s-cau_truc{background:var(--status-info)}
  .dmw-s-chua_ro .dmw-sw,.dmw-seg .dmw-s-chua_ro{background:var(--fg-muted);opacity:.45}
  .dmw-lg{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-4) var(--s-20)}
  .dmw-lg li{display:flex;align-items:baseline;gap:var(--s-6);font-size:var(--fs-13);color:var(--fg-secondary);font-variant-numeric:tabular-nums}
  .dmw-lg li b{font-size:var(--fs-14);color:var(--fg-primary)}
  .dmw-lg li small{font-size:var(--fs-11);color:var(--fg-muted)}
  .dmw-lg li.rong b{color:var(--fg-muted);font-weight:500}
  .dmw-sw{display:inline-block;width:10px;height:10px;border-radius:3px;align-self:center}

  /* Theo mã hàng: danh sách xếp hạng, chi tiết gấp lại */
  .dmw-loc{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-8);margin:0 0 var(--s-8) !important;padding:var(--s-8) var(--s-12);border-radius:var(--r-md);background:var(--bg-selected);font-size:var(--fs-13)}
  .dmw-loc .btn{margin-left:auto}
  .dmw-dsma{border:1px solid var(--border-subtle);border-radius:var(--v2-card-r,var(--r-lg));background:var(--bg-surface);box-shadow:var(--v2-shadow,none);overflow:hidden}
  .dmw-ma+.dmw-ma{border-top:1px solid var(--border-subtle)}
  .dmw-ma>summary{list-style:none;display:grid;grid-template-columns:24px minmax(0,1fr) auto 20px;grid-template-areas:"rk mt ms ic" ". mp mp mp";align-items:center;column-gap:var(--s-12);row-gap:var(--s-4);min-height:56px;padding:var(--s-12) var(--s-16);cursor:pointer}
  .dmw-ma>summary:hover{background:var(--bg-hover)}
  .dmw-ma>summary::-webkit-details-marker{display:none}
  .dmw-ma>summary>.ti{grid-area:ic;color:var(--fg-muted);transition:transform .15s;justify-self:end}
  .dmw-ma[open]>summary>.ti{transform:rotate(180deg)}
  .dmw-ma[open]>summary{background:var(--bg-hover)}
  .dmw-rk{grid-area:rk;font-size:var(--fs-12);font-weight:600;color:var(--fg-muted);font-variant-numeric:tabular-nums;text-align:right}
  .dmw-mt{grid-area:mt;display:flex;align-items:baseline;gap:var(--s-8);min-width:0}
  .dmw-mt b{font-size:var(--fs-16);font-weight:700;flex:none}
  .dmw-mt small{font-size:var(--fs-12);color:var(--fg-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .dmw-ms{grid-area:ms;display:flex;align-items:baseline;gap:4px;font-variant-numeric:tabular-nums}
  .dmw-ms b{font-size:var(--fs-16);font-weight:700}
  .dmw-ms small{font-size:var(--fs-12);color:var(--fg-muted)}
  .dmw-mp{grid-area:mp;display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-4) var(--s-8);min-width:0}
  .dmw-mp>small{font-size:var(--fs-12);color:var(--fg-secondary)}
  .dmw-chips{display:flex;flex-wrap:wrap;gap:4px}
  .dmw-chip{font-style:normal;font-size:var(--fs-11);line-height:1.2;padding:2px 8px;border-radius:var(--r-pill);background:var(--status-neutral-bg);color:var(--fg-secondary);border:1px solid var(--border-subtle);white-space:nowrap}
  .dmw-chip.canh{background:var(--status-warn-bg);border-color:var(--status-warn-line);color:var(--fg-primary)}
  .dmw-chip.canh::before{content:"▲ ";color:var(--status-warn)}
  .dmw-chip.chua::before{content:"● "}
  .dmw-chip.dmw-loai{background:none}
  .dmw-ma-c{border-top:1px solid var(--border-subtle);background:var(--bg-app)}
  .dmw-mon{padding:var(--s-12) var(--s-16) var(--s-12) calc(var(--s-16) + 36px)}
  .dmw-mon+.dmw-mon{border-top:1px dashed var(--border-subtle)}
  .dmw-m1{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px var(--s-12);font-size:var(--fs-14)}
  .dmw-m1 b{font-weight:600}
  .dmw-m1 a{margin-left:auto;font-size:var(--fs-13)}
  .dmw-m2{font-size:var(--fs-12);color:var(--fg-muted);margin:2px 0 var(--s-6) !important}
  .dmw-bc{margin:0;padding:0 0 0 18px;font-size:var(--fs-13);line-height:1.45}
  .dmw-bc li{margin:2px 0;overflow-wrap:anywhere}
  .dmw-ng{font-size:var(--fs-12);color:var(--fg-muted);font-weight:500}
  .dmw-lech{display:block;margin-top:2px;color:var(--status-warn);font-size:var(--fs-13);overflow-wrap:anywhere}
  .dmw-bc .dmw-ghi{display:block}
  .dmw-mon>.dmw-ghi{margin-top:var(--s-4) !important}
  .dmw-yc{margin-top:var(--s-4);font-size:var(--fs-13)}
  .dmw-yc summary{cursor:pointer;color:var(--fg-secondary);min-height:32px;display:flex;align-items:center}
  .dmw-yc p{margin:4px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}

  /* gấp ở cuối: 5 tuần, Cách tính */
  .dmw-fold{border-top:1px solid var(--border-subtle)}
  .dmw-fold+.dmw-fold{margin-top:calc(-1 * var(--s-24))}
  .dmw-fold>summary{list-style:none;display:flex;align-items:baseline;flex-wrap:wrap;gap:2px var(--s-8);min-height:44px;padding:var(--s-12) 0;cursor:pointer;font-size:var(--fs-14);font-weight:600;color:var(--fg-secondary)}
  .dmw-fold>summary::-webkit-details-marker{display:none}
  .dmw-fold>summary small{font-size:var(--fs-12);font-weight:400;color:var(--fg-muted)}
  .dmw-fold>summary .ti{margin-left:auto;align-self:center;color:var(--fg-muted);transition:transform .15s}
  .dmw-fold[open]>summary .ti{transform:rotate(180deg)}
  .dmw-cach-c{font-size:var(--fs-13);color:var(--fg-secondary);line-height:1.5;padding:0 0 var(--s-12)}
  .dmw-bang-w{overflow-x:auto;margin-bottom:var(--s-12);border:1px solid var(--border-subtle);border-radius:var(--r-md);background:var(--bg-surface)}
  .dmw-bang{border-collapse:collapse;font-size:var(--fs-13);font-variant-numeric:tabular-nums;min-width:100%}
  .dmw-bang th,.dmw-bang td{padding:6px 10px;border-bottom:1px solid var(--border-subtle);text-align:right;white-space:nowrap}
  .dmw-bang th[scope="row"]{text-align:left;font-weight:500;position:sticky;left:0;background:var(--bg-surface)}
  .dmw-bang thead th{font-weight:600;color:var(--fg-secondary)}
  .dmw-bang thead th:first-child{text-align:left}
  .dmw-bang .nay{background:var(--bg-selected);font-weight:600}
  .dmw-bang tr.tong th,.dmw-bang tr.tong td{font-weight:700}
  .dmw-bang tr.dau th,.dmw-bang tr.dau td{border-top:2px solid var(--border-default)}
  .dmw-bang tbody tr:last-child th,.dmw-bang tbody tr:last-child td{border-bottom:0}

  /* tuần không có đơn */
  .dmw-rong{display:flex;flex-direction:column;align-items:center;gap:var(--s-8);text-align:center;padding:var(--s-40) var(--s-16);border:1px dashed var(--border-default);border-radius:var(--v2-card-r,var(--r-lg));color:var(--fg-secondary)}
  .dmw-rong>.ti{font-size:28px;color:var(--fg-muted)}
  .dmw-rong b{font-size:var(--fs-16);color:var(--fg-primary)}
  .dmw-rong p{font-size:var(--fs-13)}

  /* ô trên trang chủ Anna (khối Tình hình) */
  .dmw-home{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;align-items:center;gap:var(--s-12);margin:0 0 var(--s-12);padding:var(--s-12);border:1px solid var(--border-subtle);border-radius:var(--v2-card-r,var(--r-lg));background:var(--bg-surface);box-shadow:var(--v2-shadow,none);color:inherit;text-decoration:none}
  .dmw-home:hover{background:var(--bg-hover)}
  .dmw-hl{display:flex;flex-direction:column;gap:2px;font-size:var(--fs-14);font-weight:600;min-width:0}
  .dmw-hl small{font-size:var(--fs-12);font-weight:400;color:var(--fg-muted)}
  .dmw-hs{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:var(--fs-12);color:var(--fg-secondary);white-space:nowrap}
  .dmw-hs b{font-size:var(--fs-20);font-weight:700;color:var(--fg-primary);font-variant-numeric:tabular-nums}
  .dmw-home>.ti{color:var(--fg-muted)}

  @media (max-width:640px){
    .dmw{gap:var(--s-20)}
    .dmw-tuan{flex-basis:100%;max-width:none}
    .dmw-tuan select{font-size:var(--fs-13)}
    .dmw-dem{gap:var(--s-6)}
    .dmw-o{padding:var(--s-8) var(--s-12)}
    .dmw-o b{font-size:var(--fs-20)}
    .dmw-o span{font-size:var(--fs-12)}
    .dmw-o small{font-size:var(--fs-11)}
    .dmw-ch{margin-top:calc(-1 * var(--s-12)) !important}
    .dmw-tt{grid-template-columns:1fr}
    .dmw-the-k{padding:var(--s-8) var(--s-12)}
    .dmw-lh{grid-template-columns:minmax(0,1fr) auto;padding:0 var(--s-4)}
    .dmw-lh span:first-child{display:none}
    .dmw-lr{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n v" "t t";row-gap:6px;min-height:var(--touch-min,44px);padding:var(--s-6) var(--s-4)}
    .dmw-lr .dmw-ln{grid-area:n}.dmw-lr .dmw-lv{grid-area:v}.dmw-lr .dmw-bar{grid-area:t}
    .dmw-ma>summary{padding:var(--s-12);column-gap:var(--s-8);grid-template-columns:20px minmax(0,1fr) auto 18px}
    .dmw-mt{flex-direction:column;gap:0}
    .dmw-mt small{max-width:100%}
    .dmw-mon{padding:var(--s-12)}
  }
}
