:root{
    --acc:#E8641C; --acc-2:#F5872E; --acc-d:#C9530F;
    --acc-bg:#FFF6EE; --acc-bd:#F3E0CB; --acc-tx:#8A5322;
    --ink:#1A1D26; --ink-2:#626878; --ink-3:#9AA0AE; --ink-4:#C3C7D2;
    --line:#E7EAF1; --line-2:#CDD4E2; --line-3:#F1F3F7; --line-in:#A9B2C6;
    --fill:#F4F5F9; --card:#fff; --rail:96px; --panel:356px;
  }*{margin:0;padding:0;box-sizing:border-box}[hidden]{display:none !important}body{background:#fff;color:var(--ink);font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,sans-serif;
       -webkit-font-smoothing:antialiased;overflow:hidden;
       height:100vh;display:flex;flex-direction:column}/* vùng cho _header.php của site — cao bao nhiêu cũng được */
  .site-hd{flex:none}button, input, select{font-family:inherit;color:inherit}.ic{flex:none}/* ══ khung 3 cột toàn màn ══ */
  .app{flex:1;min-height:0;display:grid;grid-template-columns:var(--rail) minmax(0,1fr) var(--panel);overflow:hidden}/* ══ dải chọn loại ══ */
  .rail{background:#fff;border-right:1px solid var(--line);min-height:0;display:flex;flex-direction:column;
        align-items:center;padding:16px 0;overflow-y:auto;gap:4px;
        scrollbar-width:thin;scrollbar-color:transparent transparent}.rail:hover{scrollbar-color:rgba(58,63,76,.35) transparent}/* Chrome/Edge/Safari: giữ nguyên bề rộng 8px để nội dung không xê dịch, con trượt trong suốt, chỉ hiện khi rê chuột vào thanh menu */
  .rail::-webkit-scrollbar{width:8px}.rail::-webkit-scrollbar-track{background:transparent}.rail::-webkit-scrollbar-thumb{background:transparent;border-radius:8px}.rail:hover::-webkit-scrollbar-thumb{background:rgba(58,63,76,.3)}.rail:hover::-webkit-scrollbar-thumb:hover{background:rgba(58,63,76,.5)}.rt{width:80px;padding:10px 5px;border:none;background:none;border-radius:11px;cursor:pointer;
      display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--ink-2);transition:.14s;flex:none}.rt:hover{background:var(--fill);color:var(--ink)}.rt[aria-pressed="true"]{background:var(--acc-bg);color:var(--acc)}.rt span{font-size:11.5px;font-weight:700;line-height:1.25;text-align:center;color:#3A3F4C}.rt[aria-pressed="true"] span{color:var(--acc);font-weight:800}/* ══ vùng giữa ══ */
  .stage{display:flex;flex-direction:column;min-width:0;min-height:0;background:#fff}.sbar{display:flex;align-items:center;justify-content:space-between;padding:16px 26px;
        border-bottom:1px solid var(--line);background:#fff;gap:12px}.sbar h1{font-size:16px;font-weight:800;letter-spacing:-.02em}.sbar .meta{font-size:12.5px;color:var(--ink-3);font-weight:600;margin-top:2px}.sbar-r{display:flex;align-items:center;gap:9px;flex:none}.mode-btn{position:relative;display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:800;
        background:linear-gradient(135deg,#FFF6F1,#FFEDE3);
        border:2px solid var(--acc);color:var(--acc);
        padding:9px 16px;border-radius:11px;cursor:pointer;transition:.16s;
        box-shadow:0 3px 12px -4px rgba(232,100,28,.5)}.mode-btn:hover{background:var(--acc);color:#fff;box-shadow:0 6px 18px -5px rgba(232,100,28,.65)}.mode-btn .ic{color:var(--acc);transition:.16s}.mode-btn:hover .ic{color:#fff}.mode-btn.on{background:var(--acc);border-color:var(--acc);color:#fff;
        box-shadow:0 3px 12px -4px rgba(232,100,28,.5)}.mode-btn.on .ic{color:#fff}/* ── khung vẽ thủ công ── */
  .canvas.draw{cursor:default}.bx{position:absolute;border:2px solid var(--ink-2);background:rgba(26,29,38,.06);
      border-radius:3px;cursor:move;display:flex;align-items:center;justify-content:center;
      padding:3px;text-align:center;overflow:hidden;touch-action:none;user-select:none}.bx.sel{border-color:var(--acc);background:rgba(232,100,28,.10);
          box-shadow:0 0 0 3px rgba(232,100,28,.16);
          overflow:visible}/* mở cắt xén để tay nắm xoay (trên khối 30px) hiện ra */
  .bx span{font-weight:700;line-height:1.1;pointer-events:none;word-break:break-word}.bx-r{position:absolute;left:50%;top:-30px;width:16px;height:16px;margin-left:-8px;
      border:2px solid var(--acc);background:#fff;border-radius:50%;cursor:grab;display:none;z-index:3}.bx-r::after{content:'';position:absolute;left:50%;top:14px;width:2px;height:12px;
      margin-left:-1px;background:var(--acc);opacity:.55}.bx-r:active{cursor:grabbing;background:var(--acc)}.bx.sel .bx-r{display:block}.bx-h{position:absolute;right:-7px;bottom:-7px;width:15px;height:15px;background:#fff;
        border:2px solid var(--acc);border-radius:50%;cursor:nwse-resize;touch-action:none}.bx-x{position:absolute;right:-8px;top:-8px;width:17px;height:17px;border-radius:50%;
        background:#fff;border:1.5px solid var(--line-in);color:var(--ink-2);font-size:11px;
        font-weight:800;line-height:1;cursor:pointer;padding:0}.bx-x:hover{background:#FDECEC;border-color:#F6C9C4;color:#B04A3E}.bx-tag{position:absolute;top:1px;left:1px;font-style:normal;font-size:9px;font-weight:800;
      letter-spacing:.2px;background:rgba(26,29,38,.62);color:#fff;padding:1px 6px;
      border-radius:0 0 6px 0;opacity:.8;pointer-events:none;white-space:nowrap;z-index:2;line-height:1.5}.bx.sel .bx-tag{opacity:1;background:var(--acc)}.bx-edit{position:absolute;inset:0;width:100%;height:100%;box-sizing:border-box;border:none;
      background:rgba(255,255,255,.94);font-family:inherit;font-weight:700;text-align:center;
      resize:none;outline:2px solid var(--acc);border-radius:2px;padding:3px;z-index:3}.draw-tb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center}.draw-tb button{border:2px solid var(--line-in);background:#fff;font-size:11.5px;font-weight:700;
        color:var(--ink-2);padding:6px 12px;border-radius:9px;cursor:pointer}.draw-tb button:hover{border-color:var(--acc);color:var(--acc)}.cv-acts{display:inline-flex;gap:6px}.rot-ctl{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding-left:10px;
      border-left:1.5px solid var(--line-in)}.rot-ctl b{font-size:11px;font-weight:800;color:var(--ink-3)}.rot-b{border:1.5px solid var(--line-in);background:#fff;border-radius:999px;padding:4px 9px;
      font-family:inherit;font-size:10.5px;font-weight:800;color:var(--ink-2);cursor:pointer;transition:.13s}.rot-b:hover{border-color:var(--acc);color:var(--acc)}.rot-b[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:#fff}.draw-tb .cv-mini{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:999px;
        font-size:11px;font-weight:700;border:1.5px solid var(--line-in);color:var(--ink-2);
        background:#fff;line-height:1;transition:.14s}.draw-tb .cv-mini svg{flex:none;opacity:.75}.draw-tb .cv-mini:hover{border-color:var(--acc);color:var(--acc);background:var(--acc-bg)}.draw-tb .cv-mini:hover svg{opacity:1}.coin .ic{color:var(--acc)}/* Lưới 2 cột × 2 hàng: hàng 1 chứa ảnh, hàng 2 chứa chú thích.
     Nhờ dùng CHUNG hàng, khung phác thảo và ảnh kết quả luôn cao bằng nhau
     dù chú thích hai bên dài ngắn khác nhau. */
  .canvas-wrap{flex:1;display:grid;grid-template-columns:minmax(0,1fr);
        grid-template-rows:minmax(0,1fr) auto;column-gap:22px;row-gap:12px;
        padding:22px 26px;background:radial-gradient(circle at 50% 40%,#FCFCFE,#F4F5F9);
        min-height:0;min-width:0;overflow:auto;align-content:safe center}.canvas-wrap.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.pb-a{grid-column:1;grid-row:1}.cap-a{grid-column:1;grid-row:2}.pb-b{grid-column:2;grid-row:1}.cap-b{grid-column:2;grid-row:2}.canvas-wrap:not(.split) .pb-b, .canvas-wrap:not(.split) .cap-b{display:none}.pane-b{min-height:0;min-width:0;display:flex;align-items:center;justify-content:center}.canvas{background:#fff;border-radius:6px;box-shadow:0 18px 46px -22px rgba(26,29,38,.36);
          position:relative;overflow:hidden;max-width:100%;max-height:100%;
          display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4%}/* Phải có chiều cao XÁC ĐỊNH thì max-height:100% của ảnh bên trong
     mới có gì để tham chiếu — nếu không trình duyệt bỏ qua và ảnh tràn khung. */
  .rbox{width:100%;height:100%;display:flex;align-items:center;justify-content:center;
        flex-direction:column;min-width:0;min-height:0;text-align:center}.rbox img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;
        border-radius:6px;box-shadow:0 18px 46px -22px rgba(26,29,38,.36);display:block}.cap{font-size:11.5px;color:#A2A7B4;font-weight:600;display:flex;
       align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;align-self:start}.cap button, .cap .lnk{border:none;background:none;font-size:11.5px;font-weight:700;color:var(--ink-2);
              cursor:pointer;padding:3px 8px;border-radius:7px;text-decoration:none}.cap button:hover, .cap .lnk:hover{background:var(--fill);color:var(--ink)}.cap .lnk{color:var(--acc)}.cap #resActs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center}.cap .dl-big{background:var(--acc);color:#fff;font-size:13px;font-weight:800;padding:9px 16px;
        border-radius:10px;display:inline-flex;align-items:center;gap:7px}.cap .dl-big:hover{background:var(--acc-d);color:#fff}.cap .dl-big .ic{color:#fff}.rbox img{cursor:pointer}.rbox img:hover{box-shadow:0 20px 50px -18px rgba(232,100,28,.55)}.r-wait{display:flex;flex-direction:column;align-items:center;gap:13px;color:var(--ink-2);
          font-size:13px;font-weight:600;padding:30px}.r-err{background:#FDECEC;border:1px solid #F6C9C4;color:#B04A3E;padding:14px 16px;border-radius:12px;
         font-size:12.5px;font-weight:600;line-height:1.5;max-width:320px}.r-err button{margin-top:11px;border:none;background:#B04A3E;color:#fff;padding:8px 15px;
         border-radius:8px;font-weight:700;font-size:12px;cursor:pointer}.pv{text-align:center;line-height:1.15;max-width:92%;word-break:break-word}.pv-big{font-weight:800;letter-spacing:-.01em}.pv-sm{font-weight:600}.pv-store{font-weight:700}.pv-ct{font-weight:600}.empty{color:var(--ink-4);font-size:13px;font-weight:600;text-align:center;line-height:1.6}/* ══ bảng nhập bên phải ══ */
  .panel{background:#fff;border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0;min-width:0}.p-head{padding:18px 22px 14px;border-bottom:1px solid var(--line-3);display:flex;
          align-items:flex-start;justify-content:space-between;gap:12px}.p-head h2{font-size:15px;font-weight:800;letter-spacing:-.01em}.p-head p{font-size:12px;color:var(--ink-3);font-weight:600;margin-top:3px}.p-body{flex:1;overflow-y:auto;padding:6px 0;min-height:0}.grp{border-bottom:1px solid var(--line-3)}.grp-h{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
         padding:15px 22px;background:none;border:none;cursor:pointer;text-align:left}.grp-h:hover{background:#FCFCFE}.grp-l{display:flex;align-items:center;gap:9px;min-width:0}.grp-l .ic{color:var(--ink-3)}.grp-l b{font-size:16px;font-weight:700}.grp-r{display:flex;align-items:center;gap:10px;flex:none}.grp-s{font-size:11.5px;color:var(--ink-3);font-weight:600;max-width:130px;overflow:hidden;
         text-overflow:ellipsis;white-space:nowrap}.grp-c{color:var(--ink-3);transition:transform .18s}.grp.open .grp-c{transform:rotate(180deg)}.grp-b{padding:4px 22px 20px}.lb{display:block;font-size:12px;font-weight:700;color:var(--ink-2);margin-bottom:7px}.lb i{color:var(--acc);font-style:normal}/* ── mỗi ô nhập là một dòng gấp mở ── */
  .fld-hr{border:none;border-top:1.5px solid var(--line);margin:10px 0 4px}.fld{border-bottom:1px solid var(--line-3)}.fld:last-child{border-bottom:none}.fld-h{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
         padding:11px 2px;background:none;border:none;cursor:pointer;text-align:left}.fld-h:hover .fld-lb{color:var(--ink)}.fld-lb{font-size:13px;font-weight:700;color:var(--ink-2);min-width:0;
          overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fld-lb i{color:var(--acc);font-style:normal;margin-left:2px}.fld.open .fld-lb{color:var(--ink)}/* công tắc báo đã nhập */
  .sw{width:36px;height:20px;border-radius:999px;background:#D4DAE6;position:relative;
      flex:none;transition:background .16s}.sw::after{content:'';position:absolute;top:2.5px;left:2.5px;width:15px;height:15px;
      border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.22);transition:transform .16s}.sw.on{background:#22A44E}.sw.on::after{transform:translateX(16px)}.cre-sec{border-bottom:1px solid var(--line-3)}.cre-bar{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;
        gap:11px;padding:13px 22px}.cre-t{flex:1 1 auto;min-width:0}.cre-t b{display:block;font-size:13px;color:var(--ink);margin-bottom:2px}.cre-t small{font-size:11px;color:var(--ink-3);line-height:1.45;display:block}/* nút và công tắc tự chứa hoàn toàn — không mượn .sw, không cho CSS ngoài đè */
  .cre-bar .cre-sw{flex:0 0 auto;width:auto;min-width:0;margin:0;border:none;
        background:none;padding:4px;cursor:pointer;display:inline-flex;line-height:0}.cre-bar .cre-knob{display:inline-block;width:36px;height:20px;border-radius:999px;
        background:#D4DAE6;position:relative;transition:background .16s}.cre-bar .cre-knob::after{content:'';position:absolute;top:2.5px;left:2.5px;
        width:15px;height:15px;border-radius:50%;background:#fff;
        box-shadow:0 1px 3px rgba(0,0,0,.22);transition:transform .16s}.cre-bar .cre-knob.on{background:#22A44E}.cre-bar .cre-knob.on::after{transform:translateX(16px)}.fld-b{padding:2px 0 15px}/* ── danh sách chữ tự thêm ── */
  .ct-row{display:flex;align-items:flex-start;gap:7px;margin-bottom:8px}.ct-row .in{flex:1;min-width:0}.ct-row textarea.in{resize:none;overflow:hidden;min-height:40px;line-height:1.45;
        padding-top:9px;padding-bottom:9px;display:block}.ct-x{width:32px;height:38px;flex:none;border:2px solid var(--line-in);background:#fff;
        border-radius:9px;color:var(--ink-3);font-size:15px;font-weight:800;cursor:pointer;line-height:1}.ct-x:hover{background:#FDECEC;border-color:#F6C9C4;color:#B04A3E}.ct-add{width:100%;padding:10px;border:2px dashed var(--line-in);background:#fff;border-radius:10px;
        color:var(--ink-2);font-size:13px;font-weight:700;cursor:pointer;
        display:flex;align-items:center;justify-content:center;gap:7px;transition:.14s}.ct-add:hover{border-color:var(--acc);color:var(--acc);background:var(--acc-bg)}.ct-add span{font-size:17px;line-height:1}/* ── ô ảnh thật ── */
  .bx.bx-img{background:rgba(232,100,28,.07);border-style:dashed;padding:0}.bx.bx-rd{opacity:.72}.bx.bx-dead::before{content:'Ảnh đã hết hạn — tải lại';position:absolute;inset:0;
        display:flex;align-items:center;justify-content:center;text-align:center;
        font-size:10px;font-weight:700;color:var(--ink-3);padding:4px}.bx.bx-sl{opacity:.45}.bx.bx-sl::after{content:'Ô trống';position:absolute;left:0;right:0;bottom:0;
        background:rgba(98,104,120,.9);color:#fff;font-size:9.5px;font-weight:800;
        text-align:center;padding:2px;pointer-events:none}.bx.bx-rd::after{content:'AI vẽ lại';position:absolute;left:0;right:0;bottom:0;
        background:rgba(232,100,28,.9);color:#fff;font-size:9.5px;font-weight:800;
        text-align:center;padding:2px;pointer-events:none}.bx.bx-img img{width:100%;height:100%;object-fit:cover;border-radius:2px;pointer-events:none;display:block}.pm{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.pm.pm3{grid-template-columns:1fr}.pm button{border:2px solid var(--line-in);background:#fff;border-radius:10px;padding:9px 8px;
        cursor:pointer;text-align:left;transition:.14s}.pm button:hover{border-color:var(--ink-4)}.pm button[aria-pressed="true"]{border-color:var(--acc);background:var(--acc-bg)}.pm b{display:block;font-size:12.5px;font-weight:800;color:var(--ink-2);margin-bottom:2px}.pm button[aria-pressed="true"] b{color:var(--acc)}.pm small{display:block;font-size:10.5px;font-weight:500;color:var(--ink-3);line-height:1.35}.ph-row{display:flex;align-items:center;gap:8px;margin-bottom:9px}.ph-sug{background:var(--acc-bg);border:1px solid #F2CDB3;border-radius:10px;padding:10px 11px;margin:4px 0 8px}.ph-sug .sj{font-size:12px;color:var(--ink-2);margin-bottom:7px}.ph-sug .sj b{color:var(--acc-dark)}.ph-sug .md{font-size:11.5px;color:#8A5A2E;margin-bottom:7px}.ph-sug .row-l{font-size:10.5px;font-weight:700;color:var(--ink-3);margin:6px 0 4px;text-transform:uppercase;letter-spacing:.3px}.ph-sug .chips{display:flex;flex-wrap:wrap;gap:5px}.ph-sug .chips button{border:1px solid #E8C8AE;background:#fff;color:var(--ink-2);font-size:11px;
        padding:4px 9px;border-radius:999px;cursor:pointer;transition:.13s}.ph-sug .chips button:hover{border-color:var(--acc);color:var(--acc)}.ph-sug .pal{display:flex;gap:6px}.ph-sug .pal button{width:26px;height:26px;border-radius:7px;border:1.5px solid rgba(0,0,0,.12);cursor:pointer;padding:0}.ph-sug .pal button:hover{transform:scale(1.12)}.ph-sug .x{float:right;border:none;background:none;color:var(--ink-3);font-size:14px;cursor:pointer;line-height:1;padding:0 0 0 8px}.ph-ana{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--ink-3);padding:8px 4px}.ph-spin{width:13px;height:13px;flex:none;border:2px solid var(--acc-bg);border-top-color:var(--acc);
        border-radius:50%;animation:phspin .8s linear infinite}
  @keyframes phspin{to{transform:rotate(360deg)}}.ph-sug .md-apply{border:1px solid var(--acc);background:#fff;color:var(--acc);font-size:10.5px;
        font-weight:700;padding:2px 9px;border-radius:999px;cursor:pointer;margin-left:4px}.ph-sug .md-apply:hover{background:var(--acc);color:#fff}.gen-free{display:block;font-size:11px;font-weight:800;letter-spacing:.2px;
      opacity:.95;margin-top:2px;line-height:1.2}/* form tải ảnh giữa canvas (Thiết kế từ ảnh) */
  /* Khung tải ảnh giữa canvas — canvas khổ dọc chỉ rộng ~240px nên làm thật gọn:
     nút xếp DỌC, mỗi nút là một hàng icon + chữ, luôn vừa mọi bề ngang. */
  /* Form tải ảnh chỉ hiện ở cấp "Thiết kế nâng cao" */
  body.ui2 .ph-drop{display:none}body.ui2.lv3 .ph-drop{display:block}.ph-drop{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:4;
      background:rgba(255,255,255,.97);border:1.5px dashed var(--acc);border-radius:12px;
      padding:9px;width:170px;max-width:86%;box-sizing:border-box;
      box-shadow:0 8px 22px -10px rgba(26,29,38,.28)}.phd-btns{display:flex;flex-direction:column;gap:5px}.phd-b{display:flex;align-items:center;gap:8px;width:100%;box-sizing:border-box;
      border:1px solid var(--line-in);background:#fff;border-radius:8px;padding:7px 9px;
      font-family:inherit;font-size:11.5px;font-weight:600;color:var(--ink-2);cursor:pointer;
      text-align:left;transition:.13s}.phd-b svg{width:15px;height:15px;flex:none;color:var(--ink-3);transition:.13s}.phd-b:hover{border-color:var(--acc);color:var(--acc);background:var(--acc-bg)}.phd-b:hover svg{color:var(--acc)}.phd-url{display:flex;flex-direction:column;gap:5px;margin-top:6px}.phd-url input{width:100%;box-sizing:border-box;border:1px solid var(--line-in);border-radius:7px;padding:6px 9px;
      font-family:inherit;font-size:12.5px;outline:none}.phd-url input:focus{border-color:var(--acc)}.phd-go{border:none;background:var(--acc);color:#fff;border-radius:9px;padding:8px 15px;
      font-family:inherit;font-size:12.5px;font-weight:800;cursor:pointer}.phd-stt{font-size:11.5px;font-weight:700;color:var(--ink-2);margin-top:9px}/* modal tạo video quảng cáo */
  .vm{position:fixed;inset:0;background:rgba(16,18,24,.6);z-index:70;display:flex;align-items:center;justify-content:center;padding:18px}.vm-b{background:#fff;border-radius:16px;max-width:520px;width:100%;max-height:88vh;overflow:auto;padding:20px 22px}.vm-b h3{margin:0 0 4px;font-size:16.5px}.vm-b .hint{margin:0 0 12px}.vm-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:14px}.vm-c{border:1.5px solid var(--line-in);border-radius:11px;padding:10px 11px;text-align:left;background:#fff;cursor:pointer;font-family:inherit}.vm-c b{display:block;font-size:12.5px;color:var(--ink)}.vm-c small{font-size:10.5px;color:var(--ink-3);line-height:1.35;display:block;margin-top:2px}.vm-c[aria-pressed="true"]{border-color:var(--acc);background:#FFF6EE;box-shadow:0 0 0 2px rgba(232,100,28,.15)}.vm-grid2 .vm-c{min-height:78px}.vm-custom{border-style:dashed}.vm-custom b{color:var(--acc)}.vm-ct{margin:-6px 0 14px}.vm-ct textarea{width:100%;box-sizing:border-box;border:1.5px solid var(--acc);border-radius:11px;
      padding:10px 12px;font-family:inherit;font-size:12.5px;line-height:1.5;resize:vertical;outline:none;
      background:#FFFDFB}.vm-dur{display:flex;gap:8px;align-items:center;margin-bottom:14px;font-size:12px;font-weight:700;color:var(--ink-2)}.vm-d{border:1.5px solid var(--line-in);background:#fff;border-radius:999px;padding:6px 13px;
      font-family:inherit;font-size:12px;font-weight:700;color:var(--ink-2);cursor:pointer;transition:.14s}.vm-d:hover{border-color:var(--acc);color:var(--acc)}.vm-d[aria-pressed="true"]{border-color:var(--acc);background:var(--acc);color:#fff}.vm-foot{display:flex;gap:9px;align-items:center}.vm-go{flex:1;background:var(--acc);color:#fff;border:none;border-radius:11px;padding:12px;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit}.vm-go:disabled{opacity:.55;cursor:default}.vm-x2{border:1.5px solid var(--line-in);background:#fff;border-radius:11px;padding:12px 16px;cursor:pointer;font-family:inherit;font-weight:700}.vm-stt{font-size:12.5px;font-weight:700;color:var(--ink-2);margin:10px 0 0;text-align:center}.vm-load{display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 0 8px;text-align:center}.vm-spin{position:relative;width:74px;height:74px;display:flex;align-items:center;justify-content:center;
      font-size:27px;margin-bottom:4px}.vm-spin2{position:absolute;inset:0;border-radius:50%;border:3.5px solid #F4E3D6;
      border-top-color:var(--acc);animation:vmspin 0.9s linear infinite}
  @keyframes vmspin{to{transform:rotate(360deg)}}.vm-lt{font-size:14px;font-weight:800;color:var(--ink)}.vm-ls{font-size:11.5px;color:var(--ink-3)}.vm-time{font-size:13px;font-weight:800;color:var(--acc);font-variant-numeric:tabular-nums}.vm-vid{width:100%;border-radius:11px;margin-top:12px;background:#000}.vm-dl{display:inline-block;margin-top:10px;background:var(--acc);color:#fff;font-weight:800;font-size:13px;
      padding:10px 18px;border-radius:999px;text-decoration:none;border:none;cursor:pointer;font-family:inherit}.vm-dl:hover{color:#fff;background:#C9520F}.vm-dl:disabled{opacity:.6;cursor:default}.hist-wrap{padding:13px 22px 16px}.hist-h{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--ink);margin-bottom:5px}#histRow{display:grid;grid-template-columns:1fr 1fr;gap:10px}.hi{background:#fff;border:1.5px solid var(--line-in);border-radius:11px;
      overflow:hidden;position:relative;transition:.14s}.hi:hover{border-color:var(--acc)}.hi img{display:block;width:100%;height:96px;object-fit:cover;background:var(--fill)}/* 3 thao tác hiện đè lên ảnh khi rê chuột */
  .hi-ov{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:7px;
      background:rgba(20,24,31,.52);opacity:0;transition:opacity .14s}.hi:hover .hi-ov, .hi:focus-within .hi-ov{opacity:1}.hi-ic{display:flex;align-items:center;justify-content:center;width:31px;height:31px;border:0;
      border-radius:9px;background:rgba(255,255,255,.94);color:var(--ink);cursor:pointer;
      text-decoration:none;transition:.13s;padding:0}.hi-ic:hover{background:var(--acc);color:#fff}.hi-x{position:absolute;top:5px;right:5px;width:20px;height:20px;border:none;border-radius:50%;
      background:rgba(0,0,0,.45);color:#fff;font-size:12px;line-height:1;cursor:pointer;display:none}.hi:hover .hi-x{display:block}.ph-th{width:46px;height:46px;flex:none;border-radius:8px;border:2px solid var(--line-in);
         object-fit:cover;background:var(--fill);display:block}/* Ảnh nháp cũ không tải được (phiên đăng nhập đã hết) */
  .ph-th.ph-dead{border-style:dashed;background:var(--fill) center/16px no-repeat
         url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239AA0AE' stroke-width='2'%3E%3Cpath d='M3 3l18 18M21 15l-5-5L5 21'/%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3C/svg%3E")}.ph-row{align-items:flex-start}.ph-nm{flex:1;min-width:0;font-size:12px;font-weight:600;color:var(--ink-2);
         overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ph-up{position:relative;overflow:hidden;display:block}.ph-up input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}.ph-bar{height:4px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:5px}.ph-bar i{display:block;height:100%;background:var(--acc);width:30%;
            animation:phmove 1s linear infinite}
  @keyframes phmove{0%{margin-left:-30%}100%{margin-left:100%}}.ct-empty{font-size:12px;color:var(--ink-3);font-weight:500;margin-bottom:9px;line-height:1.45}.fld-b[hidden]{display:none}.in, select.in{width:100%;padding:11px 13px;border:2.5px solid var(--line-in);border-radius:10px;
       font-size:14px;font-weight:500;background:#fff;transition:border-color .14s,box-shadow .14s}.in:hover, select.in:hover{border-color:#7D8AA3}.in.big{font-size:15px;font-weight:600}textarea.in{min-height:74px;resize:vertical;line-height:1.45;font-family:inherit}select.in optgroup{font-weight:800;color:var(--ink-3);font-size:12px;font-style:normal}select.in option{font-weight:500;color:var(--ink);padding:4px}.in:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(232,100,28,.13)}select.in{cursor:pointer;font-weight:600}.fg{margin-bottom:16px}.fg:last-child{margin-bottom:0}.g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.chips{display:flex;align-items:center;gap:14px;margin-top:10px;flex-wrap:wrap}/* gợi ý = chữ có gạch chân nét đứt, không khung */
  .chip{border:none;background:none;border-radius:0;color:var(--ink-2);padding:1px 0 2px;
        font-size:12px;font-weight:600;cursor:pointer;transition:.13s;
        border-bottom:1.5px dashed var(--ink-4);
        max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chip:hover{color:var(--acc);border-bottom-color:var(--acc);border-bottom-style:solid}/* khổ in vẫn là nút chọn giá trị nên giữ dạng khung */
  #sizePresets{gap:6px}#sizePresets .chip{border:2px solid var(--line-in);border-radius:9px;padding:5px 10px;
        background:#fff;font-weight:700;font-size:11.5px;color:var(--ink-2)}#sizePresets .chip:hover{border-color:var(--acc);color:var(--acc);background:var(--acc-bg)}.more{border:none;background:none;color:var(--ink-3);cursor:pointer;padding:4px;line-height:0;border-radius:6px}.more:hover{background:var(--fill);color:var(--ink-2)}.cards2{display:grid;grid-template-columns:1fr 1fr;gap:7px}.cd-txt{flex-direction:column;align-items:flex-start;text-align:left;gap:2px;padding:9px 10px}.cd-txt b{font-size:12.5px;font-weight:700;line-height:1.2}.cd-txt small{font-size:10.5px;font-weight:500;color:var(--ink-3);line-height:1.3}.cd-txt[aria-pressed="true"] small{color:var(--acc)}.cards3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px}.cd{position:relative;border:2px solid var(--line-in);border-radius:10px;padding:7px 5px;background:#fff;cursor:pointer;
      text-align:center;transition:.14s;color:var(--ink-3)}.cd-art{display:block;width:100%;border-radius:6px;overflow:hidden;margin-bottom:6px;
      pointer-events:none;border:1px solid rgba(0,0,0,.07);background:#fff}.cd-art svg{display:block;width:100%;height:auto}.cd-new{position:absolute;top:5px;right:5px;z-index:1;background:#E8641C;color:#fff;font-size:8.5px;
      font-weight:800;font-style:normal;padding:2px 6px;border-radius:6px;letter-spacing:.3px;line-height:1.3}.cd:hover{border-color:var(--ink-4)}.cd[aria-pressed="true"]{border-color:var(--acc);background:var(--acc-bg);color:var(--acc)}.cd svg.dg{width:100%;height:auto;display:block;border-radius:4px;background:var(--fill);margin-bottom:5px}.cd .ic{display:block;margin:0 auto 4px}.cd b{font-size:10.5px;font-weight:600;line-height:1.2;color:var(--ink-2);display:block}.cd[aria-pressed="true"] b{color:var(--acc-tx);font-weight:700}.srow{display:flex;align-items:center;gap:7px}.srow .in{width:60px;padding:8px 6px;text-align:center;font-weight:700;font-size:14px}.srow select.in{width:auto;padding:8px}.srow .x{color:var(--ink-3);font-weight:700}.srow .rt2{margin-left:auto;font-size:12.5px;font-weight:700;color:var(--ink-2)}.hint{font-size:12px;color:var(--ink-3);font-weight:500;margin-top:10px;line-height:1.45}.bar-warn{display:flex;gap:7px;background:var(--acc-bg);border:1px solid #F6D9BC;color:#9A5411;
        padding:9px 11px;border-radius:10px;font-size:11.5px;font-weight:600;line-height:1.45;margin-top:12px}.bar-err{display:flex;gap:7px;background:#FDECEC;border:1px solid #F6C9C4;color:#B04A3E;
        padding:9px 11px;border-radius:10px;font-size:11.5px;font-weight:600;line-height:1.45;margin-bottom:10px}.bar-warn .ic, .bar-err .ic{margin-top:1px}.p-foot{padding:16px 22px;border-top:1px solid var(--line-3);background:#FCFCFE}.gen{width:100%;padding:14px;border:none;border-radius:12px;background:var(--acc);color:#fff;
       font-size:15px;font-weight:800;cursor:pointer;display:flex;align-items:center;
       justify-content:center;gap:8px;transition:background .14s}.gen:hover:not(:disabled){background:var(--acc-d)}.gen:disabled{background:var(--ink-4);cursor:not-allowed}/* ══ lớp phủ đang tạo / kết quả ══ */
  .ov{position:fixed;inset:0;background:rgba(26,29,38,.55);backdrop-filter:blur(3px);z-index:60;
      display:flex;align-items:center;justify-content:center;padding:24px}.spin{width:26px;height:26px;border:3px solid var(--line);border-top-color:var(--acc);
        border-radius:50%;animation:sp .7s linear infinite;margin:0 auto 14px}
  @keyframes sp{to{transform:rotate(360deg)}}.acts{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-top:16px}.btn{padding:10px 16px;border-radius:10px;border:2px solid var(--line-in);background:#fff;
       cursor:pointer;font-weight:700;font-size:13px;text-decoration:none;color:var(--ink);
       display:inline-flex;align-items:center;gap:7px}.btn:hover{background:var(--fill);border-color:var(--ink-4)}.btn .ic{color:var(--ink-3)}.btn-d .ic{color:#fff}/* ══ hộp mời đăng nhập ══ */
  .lgm{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;
       padding:24px;background:rgba(26,29,38,.5);backdrop-filter:blur(3px);
       opacity:0;transition:opacity .2s}.lgm.show{opacity:1}.lgm-c{background:#fff;border-radius:18px;padding:30px 28px 26px;max-width:400px;width:100%;
         text-align:center;position:relative;box-shadow:0 30px 70px -20px rgba(26,29,38,.5);
         transform:translateY(10px) scale(.98);transition:transform .22s}.lgm.show .lgm-c{transform:none}.lgm-x{position:absolute;right:12px;top:12px;width:32px;height:32px;border:none;background:none;
         border-radius:9px;color:var(--ink-3);cursor:pointer;display:flex;align-items:center;justify-content:center}.lgm-x:hover{background:var(--fill);color:var(--ink)}.lgf{display:flex;flex-direction:column;gap:9px;margin:16px 0 12px;text-align:left}.lgf-i{width:100%;box-sizing:border-box;height:44px;border:1px solid var(--line-in);border-radius:10px;
      padding:0 14px;font-family:inherit;font-size:14.5px;color:var(--ink);outline:none}.lgf-i:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(234,88,12,.10)}.lgf-r{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-3);cursor:pointer}.lgf-e{background:#FEF2F2;border:1px solid #FCA5A5;color:#B91C1C;border-radius:9px;
      padding:9px 12px;font-size:12.5px;line-height:1.45}.lgf-e[hidden]{display:none}.lgf-go{height:46px;border:0;border-radius:10px;background:var(--acc);color:#fff;font-family:inherit;
      font-size:15px;font-weight:700;cursor:pointer}.lgf-go:hover:not(:disabled){background:var(--acc-d)}.lgf-go:disabled{opacity:.6;cursor:not-allowed}.lgf-gg{display:flex;align-items:center;justify-content:center;gap:9px;height:46px;
      border:1px solid var(--line-in);border-radius:10px;background:#fff;color:var(--ink-2);
      font-size:14.5px;font-weight:600;text-decoration:none;transition:.13s}.lgf-gg:hover{border-color:#C9CFD8;background:#FCFCFD}.lgf-or{display:flex;align-items:center;gap:10px;margin:13px 0 12px;color:var(--ink-4);font-size:11.5px}.lgf-or::before, .lgf-or::after{content:'';flex:1;height:1px;background:var(--line-in)}.lgm-i{width:56px;height:56px;border-radius:16px;margin:0 auto 15px;
         background:linear-gradient(135deg,var(--acc-2),var(--acc));color:#fff;
         display:flex;align-items:center;justify-content:center}.lgm-c h3{font-size:18px;font-weight:700;letter-spacing:-.01em;margin-bottom:7px}.lgm-c p{font-size:13.5px;color:var(--ink-2);font-weight:500;line-height:1.6;margin-bottom:20px}.lgm-b{display:flex;gap:9px}.lgm-b a{flex:1;padding:13px;border-radius:11px;font-size:14px;font-weight:800;
           text-decoration:none;display:flex;align-items:center;justify-content:center;transition:.14s}.lgm-up{background:#fff;color:var(--ink);border:2.5px solid var(--line-in)}.lgm-up:hover{border-color:var(--ink);background:var(--fill)}/* ══ popup nhỏ ══ */
  /* Nền sáng dịu mắt thay cho nền đen — đọc lâu không mỏi */
  .toast{position:fixed;top:78px;left:50%;transform:translateX(-50%) translateY(-8px);
         background:#FFF9F4;color:var(--ink);padding:15px 18px;border-radius:14px;
         border:2px solid #F4CDB2;
         font-size:14.5px;font-weight:600;line-height:1.5;
         display:flex;align-items:flex-start;gap:11px;
         box-shadow:0 18px 44px -16px rgba(232,100,28,.38), 0 2px 10px rgba(26,29,38,.07);
         z-index:80;max-width:min(500px,92vw);
         opacity:0;transition:opacity .22s,transform .22s;pointer-events:none}.toast .ic{color:var(--acc);flex:none;margin-top:1px}.toast #toastTx{flex:1;min-width:0}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.toast:has(.toast-x:not([hidden])){pointer-events:auto}.toast-x{flex:none;margin:-2px -4px 0 2px;width:28px;height:28px;border:none;background:none;
        border-radius:8px;color:var(--ink-3);cursor:pointer;
        display:flex;align-items:center;justify-content:center;pointer-events:auto;transition:.13s}.toast-x:hover{background:rgba(232,100,28,.12);color:var(--acc)}
  @media(max-width:1200px){.toast{font-size:14px;padding:13px 15px;top:70px} }

  /* ══ màn hẹp ══ */
  /* Màn trung bình: thu gọn hai bên, vùng giữa được thở */
  @media(min-width:1201px) and (max-width:1400px){.app{--panel:312px;--rail:88px}.rt{width:74px}.rt span{font-size:11px}
  }

  @media(max-width:1320px){.cap .dl-big{font-size:12px;padding:8px 12px}.cap{gap:8px}.cap #resActs{gap:4px}
  }

  @media(max-width:1200px){body{overflow:auto;height:auto;display:block}.app{height:auto;min-height:0;grid-template-columns:1fr;grid-template-rows:auto auto auto}.rail{flex-direction:row;border-right:none;border-bottom:1px solid var(--line);
          padding:10px 12px;gap:6px;overflow-x:auto;align-items:center}.rt{flex:none;width:72px}.canvas-wrap{padding:24px;min-height:300px;display:flex;flex-direction:column;gap:14px}.pb-a, .pb-b, .cap-a, .cap-b{grid-column:auto;grid-row:auto}.pane-b{min-height:220px;width:100%}.canvas-wrap:not(.split) .pb-b, .canvas-wrap:not(.split) .cap-b{display:none}.panel{border-left:none;border-top:1px solid var(--line)}.p-body{overflow:visible}
  }
  @media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

body.ui2{
  --acc:#EA580C; --acc-2:#F97316; --acc-d:#C2410C;
  --acc-bg:#FFF7ED; --acc-bd:#FBCFA6; --acc-tx:#9A3412;
  --ink:#14181F; --ink-2:#5B6472; --ink-3:#7A828F; --ink-4:#C9CFD8;
  --line:#EEF0F3; --line-2:#D6DAE1; --line-3:#F1F3F6; --line-in:#E3E6EB;
  --fill:#F5F6F8;
  font-family:'Be Vietnam Pro',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}/* ── TỶ TRỌNG CỘT: rail 200 | XEM TRƯỚC chiếm phần còn lại | form ~30% màn hình ── */
/* Cột trái (chọn loại + lịch sử) | canvas | bảng tuỳ chỉnh */
body.ui2 .app{grid-template-columns:186px minmax(0,1fr) calc(30% + 50px)}
@media (max-width:1360px){body.ui2 .app{grid-template-columns:172px minmax(0,1fr) calc(32% + 50px)} }
@media (max-width:1150px){body.ui2 .app{grid-template-columns:160px minmax(0,1fr) 410px} }body.ui2 .lcol{display:flex;flex-direction:column;min-height:0;overflow-y:auto;
  padding:14px 10px;background:#FCFCFD;border-right:1px solid var(--line)}body.ui2 .lcol-h{display:flex;flex-direction:column;min-height:0}/* Lịch sử dời sang cột trái: bỏ viền thẻ, xếp dọc cho vừa cột hẹp */
body.ui2 .lcol #histSec{background:none;border:0;margin:0;padding:0}body.ui2 .lcol #histSec .grp-h, body.ui2 .lcol #histSec .cre-h{padding:2px 4px 8px}body.ui2 .lcol #histSec .hist-wrap{padding:0}body.ui2 .lcol #histRow{display:flex;flex-direction:column;gap:8px;overflow-x:visible}body.ui2 .lcol .hi{width:100%;flex:none}body.ui2 .lcol .hi img{width:100%;height:96px;object-fit:cover}/* Ngăn kéo chọn loại thiết kế */
body.ui2 .rail{position:fixed;top:0;right:0;bottom:0;width:290px;max-width:88vw;z-index:95;
  background:#fff;border-left:1px solid var(--line-in);box-shadow:-18px 0 46px -22px rgba(20,24,31,.34);
  transform:translateX(100%);transition:transform .22s ease;overflow-y:auto;
  display:flex;flex-direction:column;gap:12px;padding:0 12px 16px}body.ui2 .rail.open{transform:none}body.ui2 .rail-h{position:sticky;top:0;background:#fff;display:flex;align-items:center;
  justify-content:space-between;gap:10px;padding:15px 4px 11px;border-bottom:1px solid var(--line-3);
  font-size:14px;font-weight:700;z-index:2}body.ui2 .rail-x{width:30px;height:30px;border:0;background:none;border-radius:50%;font-size:15px;
  color:var(--ink-3);cursor:pointer}body.ui2 .rail-x:hover{background:var(--fill);color:var(--ink)}body.ui2 .rail-bd{position:fixed;inset:0;z-index:94;background:rgba(20,24,31,.34)}body.ui2 .rail-bd[hidden]{display:none}body.ui2 .rg-toggle{display:none}/* Nút hamburger ở đầu cột phải */
/* Tiêu đề "Tuỳ chỉnh" ẩn đi — nút chọn loại đã nói rõ đang làm gì */
body.ui2 .p-head{display:none}body.ui2 .ham{width:calc(100% - 32px);display:flex;align-items:center;gap:10px;flex:none;text-align:left;
  margin:14px 16px 10px;
  border:1px solid var(--line-in);background:#fff;border-radius:11px;padding:10px 12px;cursor:pointer;
  font-family:inherit;transition:.14s}body.ui2 .ham-t{flex:1;min-width:0}body.ui2 .ham-t b{display:block;font-size:13px;font-weight:700;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}body.ui2 .ham-t small{display:block;font-size:11px;color:var(--ink-3);margin-top:1px}body.ui2 .ham:hover{border-color:var(--acc-bd);background:var(--acc-bg)}body.ui2 .ham-i{display:flex;flex-direction:column;justify-content:center;gap:3.5px;width:17px;flex:none}body.ui2 .ham-i i{display:block;height:2px;border-radius:2px;background:var(--ink-2)}body.ui2 .ham:hover .ham-i i{background:var(--acc)}/* form hẹp lại -> ô nhập 2 cột co về 1 cột cho dễ gõ */
body.ui2 .grp-b{padding-left:18px;padding-right:18px}body.ui2 #advHead{padding:14px 18px}/* ── RAIL: nhóm chữ + nút hàng ngang chấm vuông (đúng mockup) ── */
body.ui2 .rail{background:#FCFCFD;padding:12px 8px;gap:12px;align-items:stretch;display:flex;flex-direction:column}body.ui2 .rg{display:flex;flex-direction:column;gap:2px}body.ui2 .rg-l{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#9AA1AC;padding:3px 8px}body.ui2 .rt{width:100%;display:flex;flex-direction:row;align-items:center;gap:8px;
  padding:7px 9px;border:0;border-radius:8px;background:none;cursor:pointer}body.ui2 .rt:hover{background:#F2F4F7}body.ui2 .rt-dot{width:8px;height:8px;border-radius:2px;flex:none;background:#D6DAE1;transition:.14s}body.ui2 .rt span:last-child{font-size:13px;font-weight:500;color:#3F4653;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}body.ui2 .rt[aria-pressed="true"]{background:rgba(234,88,12,.10)}body.ui2 .rt[aria-pressed="true"] .rt-dot{background:var(--acc)}body.ui2 .rt[aria-pressed="true"] span:last-child{color:#C2410C;font-weight:600}/* Hiện đủ toàn bộ nhóm — không gập, không cần nút Mở rộng */
body.ui2 .rg-toggle{display:none}/* ── CỘT XEM TRƯỚC: thẻ trắng trên nền FAFBFC, tiêu đề 20px ── */
body.ui2 .stage{background:#FAFBFC}body.ui2 .sbar h1{font-size:20px;font-weight:700}body.ui2 .sbar .meta{font-size:13px;color:#7A828F}body.ui2 .canvas{border:1px solid var(--line-in);border-radius:8px;
  box-shadow:0 8px 26px -16px rgba(20,24,31,.22)}body.ui2 .mode-btn{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 15px;
  border:1px solid var(--line-in);background:#fff;border-radius:9px;font-family:inherit;
  font-size:13px;font-weight:600;color:#3F4653;cursor:pointer;line-height:1;white-space:nowrap;
  transition:.14s;box-shadow:none}body.ui2 .mode-btn svg{flex:none;display:block}body.ui2 .mode-btn:hover{border-color:var(--acc-bd);color:var(--acc)}body.ui2 .mode-btn[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:#fff}body.ui2 .mode-btn[aria-pressed="true"] svg{color:#fff}/* ── CỘT FORM (nhân vật chính): thẻ trắng 12px, ô nhập 44px/15px ── */
body.ui2 .panel{background:#FAFBFC;border-left:1px solid var(--line)}body.ui2 .p-head{background:transparent;border-bottom:none;padding-bottom:2px}body.ui2 .p-head h2{font-size:16px;font-weight:700}body.ui2 .p-body{padding-top:10px}body.ui2 .grp, body.ui2 .cre-sec{background:#fff;border:1px solid var(--line-in);border-radius:12px;
  margin:0 16px 12px;overflow:hidden}body.ui2 .grp-h{padding:15px 22px}body.ui2 .grp-h b{font-size:16px;font-weight:700}body.ui2 .grp-b, body.ui2 .hist-wrap{padding-left:22px;padding-right:22px}body.ui2 .in{height:44px;border-radius:9px;border-color:var(--line-in);font-size:15px;padding:0 14px}body.ui2 textarea.in{height:auto;padding:12px 14px}body.ui2 .in:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(234,88,12,.10)}body.ui2 .fl{font-size:13px;font-weight:600;color:#3F4653}/* ── THANH ĐÁY: nút Tạo trong dải trắng viền trên như mockup ── */
body.ui2 .gen{border-radius:9px;font-weight:700;font-size:15px;box-shadow:none}body.ui2 .gen:hover:not(:disabled){background:var(--acc-d)}body.ui2 .uiver{font-size:12.5px;font-weight:600;color:var(--ink-3);text-decoration:none;
  border:1px solid var(--line-in);background:#fff;border-radius:8px;padding:7px 12px;margin-right:8px}body.ui2 .uiver:hover{color:var(--acc);border-color:var(--acc-bd)}/* ── THẺ "TUỲ CHỈNH NÂNG CAO": gom mọi cấu hình phụ, gập mặc định ── */
body.ui2 #advCard{background:#fff;border:1px solid var(--line-in);border-radius:12px;margin:0 16px 12px;overflow:hidden}body.ui2 #advHead{width:100%;background:none;border:0;padding:15px 22px;display:flex;align-items:center;
  justify-content:space-between;gap:20px;cursor:pointer;text-align:left;font-family:inherit}body.ui2 #advHead:hover{background:#FCFCFD}body.ui2 #advHead .t{font-size:15px;font-weight:600;color:#14181F;display:block}body.ui2 #advHead .d{font-size:13px;color:#7A828F;display:block;margin-top:3px}body.ui2 #advHead .o{font-size:14px;font-weight:600;color:var(--acc);white-space:nowrap}body.ui2 #advBody{border-top:1px solid #F1F3F6;padding:6px 0 2px}body.ui2 #advBody[hidden]{display:none}body.ui2 #advBody .grp, body.ui2 #advBody .cre-sec{border:none;border-bottom:1px solid #F1F3F6;border-radius:0;margin:0}body.ui2 #advBody > :last-child{border-bottom:none}

/* ══════════ MOBILE (V2): xếp dọc một cột, rail thành dải chip cuộn ngang,
   nút Tạo dính đáy màn hình ══════════ */
@media (max-width: 900px){body.ui2 .app{display:block;grid-template-columns:none}body.ui2 .lcol{flex-direction:row;align-items:flex-start;gap:10px;overflow-x:auto;
    border-right:0;border-bottom:1px solid var(--line);padding:10px 12px}body.ui2 .ham{width:calc(100% - 20px);margin:10px}body.ui2 .lcol-h{flex:1;min-width:220px}body.ui2 .lcol #histRow{flex-direction:row;overflow-x:auto}body.ui2 .lcol .hi{width:130px}/* rail -> dải chip cuộn ngang dưới header */

  /* cột giữa: canvas gọn lại nhường chỗ cho form */
  body.ui2 .stage{padding-bottom:4px}body.ui2 .sbar{padding:12px 14px;flex-wrap:wrap;gap:8px}body.ui2 .sbar h1{font-size:17px}body.ui2 .canvas-wrap{padding:0 14px 8px}body.ui2 .canvas-wrap:not(.fs) .canvas{max-height:46vh}body.ui2 .canvas-wrap.split{grid-template-columns:1fr;gap:14px}/* khung đôi xếp dọc */

  /* form: full bề ngang, thẻ sát mép hơn, chừa đáy cho thanh dính */
  body.ui2 .panel{border-left:none;border-top:1px solid var(--line)}body.ui2 .grp, body.ui2 .cre-sec, body.ui2 #advCard{margin:0 10px 10px}body.ui2 .grp-b, body.ui2 .hist-wrap{padding-left:16px;padding-right:16px}body.ui2 .p-body{padding-bottom:88px}/* nút Tạo: thanh dính đáy màn hình, chừa vùng an toàn iPhone */
  body.ui2 .p-foot{position:fixed;left:0;right:0;bottom:0;z-index:40;
      padding:10px 14px calc(10px + env(safe-area-inset-bottom));
      border-top:1px solid var(--line-in);background:rgba(255,255,255,.97);
      box-shadow:0 -8px 24px -14px rgba(20,24,31,.28)}body.ui2 .gen{width:100%;padding:13px;font-size:15px}/* thanh công cụ canvas + cụm Xoay xuống dòng thoải mái */
  body.ui2 .caps, body.ui2 .draw-tb{flex-wrap:wrap;row-gap:7px}body.ui2 .rot-ctl{margin-left:0;padding-left:0;border-left:none;flex-wrap:wrap;row-gap:6px}/* fullscreen: full màn thật trên mobile */
  body.ui2 #cvWrap.fs{padding:12px 12px calc(12px + env(safe-area-inset-bottom))}body.ui2 #cvWrap.fs .canvas{max-height:none}/* modal video + lightbox thành bottom-sheet */
  body.ui2 .vm{align-items:flex-end;padding:0}body.ui2 .vm-b{max-width:100%;border-radius:16px 16px 0 0;max-height:92vh;
      padding:16px 16px calc(16px + env(safe-area-inset-bottom))}body.ui2 .vm-grid, body.ui2 .vm-grid2{grid-template-columns:1fr}body.ui2 .vm-grid2 .vm-c{min-height:0}body.ui2 .vm-dur{flex-wrap:wrap;row-gap:6px}/* form tải ảnh giữa canvas: canvas dọc trên mobile rất hẹp (~240px)
     -> 3 nút chuyển thành danh sách DỌC icon trái + nhãn phải, luôn vừa khung */
  body.ui2 .ph-drop{width:162px;max-width:88%;padding:8px}body.ui2 .phd-url{flex-direction:column;gap:6px}body.ui2 .phd-url input{width:100%;box-sizing:border-box;font-size:12px}body.ui2 .phd-go{width:100%;box-sizing:border-box}body.ui2 .phd-stt{font-size:10.5px}
}
@media (max-width: 420px){body.ui2 .sbar h1{font-size:15.5px}body.ui2 .canvas-wrap:not(.fs) .canvas{max-height:42vh}
}/* ══════════ 3 CẤP ĐỘ: Sơ cấp / Trung cấp / Cao cấp ══════════ */
body.ui2 .lvbar{display:flex;gap:4px;margin:0 16px 12px;padding:4px;background:#F1F3F6;border-radius:11px}body.ui2 .lvb{flex:1;padding:9px 6px;border:0;background:none;border-radius:8px;cursor:pointer;
  font-family:inherit;font-size:12.5px;font-weight:600;color:#5B6472;line-height:1.25;transition:.14s}body.ui2 .lvb small{display:block;font-size:10.5px;font-weight:500;color:#9AA1AC;margin-top:2px}body.ui2 .lvb:hover{color:var(--acc)}body.ui2 .lvb[aria-pressed="true"]{background:#fff;color:var(--acc);
  box-shadow:0 1px 3px rgba(20,24,31,.10)}body.ui2 .lvb[aria-pressed="true"] small{color:var(--acc-tx)}body.ui2 .lvb-t{display:inline-flex;align-items:center;gap:5px;justify-content:center}body.ui2 .lvi{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;
  border-radius:50%;border:1.2px solid #C3CAD4;color:#8A929E;font-size:10px;font-weight:800;
  line-height:1;cursor:help;flex:none}body.ui2 .lvi:hover{border-color:var(--acc);color:var(--acc);background:var(--acc-bg)}body.ui2 .lvb[aria-pressed="true"] .lvi{border-color:var(--acc);color:var(--acc)}.lvtip{position:fixed;z-index:120;background:#14181F;color:#fff;border-radius:11px;padding:12px 14px;
  font-family:'Be Vietnam Pro',-apple-system,sans-serif;font-size:12.5px;font-weight:500;line-height:1.55;
  box-shadow:0 14px 34px -12px rgba(20,24,31,.5)}.lvtip[hidden]{display:none}/* Bố cục & khổ in: một dải chip nhỏ, không chiếm thêm thẻ trắng */
/* Luôn hiện dưới tiêu đề "Chất lượng", kể cả khi khu đang gập */
/* Đã có tab "Thiết kế nâng cao" -> không cần nút Tự thiết kế trên thanh canvas */
body.ui2 #btnDraw{display:none}/* Ảnh mẫu trong chế độ Thiết kế tự do */
body.ui2 .qkup{margin-top:11px;border-top:1px dashed var(--line-in);padding-top:11px}body.ui2 .qkup-h{display:flex;align-items:center;gap:9px;flex-wrap:wrap}body.ui2 .qkup-b{display:inline-flex;align-items:center;gap:7px;border:1.5px dashed var(--line-2);
  background:#FCFCFD;border-radius:9px;padding:8px 13px;font-family:inherit;font-size:12.5px;
  font-weight:600;color:#3F4653;cursor:pointer}body.ui2 .qkup-b:hover{border-color:var(--acc);color:var(--acc);background:var(--acc-bg)}body.ui2 .qkup-n{font-size:11.5px;color:var(--ink-3);flex:1;min-width:150px;line-height:1.45}body.ui2 .qkup-g{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}body.ui2 .qkup-g figure{margin:0;position:relative;width:62px;height:62px;border-radius:9px;
  overflow:hidden;border:1.5px solid var(--line-in);background:#F5F6F8}body.ui2 .qkup-g img{width:100%;height:100%;object-fit:cover;display:block}body.ui2 .qkup-g button{position:absolute;top:2px;right:2px;width:18px;height:18px;border:0;
  border-radius:50%;background:rgba(20,24,31,.72);color:#fff;font-size:12px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center}body.ui2 .qkup-g button:hover{background:#B91C1C}/* Hai nút gạt chọn kênh: ON xanh, OFF xám */
body.ui2 .qsw{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:13px}body.ui2 .qsw-i{display:flex;align-items:center;gap:8px;border:0;background:none;padding:0;
  cursor:pointer;font-family:inherit}body.ui2 .qsw-t{width:36px;height:21px;border-radius:999px;background:#B4B2A9;position:relative;
  flex:none;transition:background .15s}body.ui2 .qsw-t::after{content:'';position:absolute;top:2.5px;left:2.5px;width:16px;height:16px;
  border-radius:50%;background:#fff;transition:left .15s}body.ui2 .qsw-i.on .qsw-t{background:#1D9E75}body.ui2 .qsw-i.on .qsw-t::after{left:17px}body.ui2 .qsw-l{font-size:13px;font-weight:500;color:var(--ink-3)}body.ui2 .qsw-i.on .qsw-l{color:var(--ink);font-weight:600}/* Hàng mức chi tiết + kích thước */
body.ui2 .qrow{display:flex;align-items:center;gap:8px}body.ui2 .qrow-q{flex:1;min-width:0;height:38px;border-width:1.5px;border-color:var(--line-2)}body.ui2 .qrow-q:disabled{opacity:.55;cursor:not-allowed}body.ui2 .qres{display:flex;gap:3px;background:var(--fill);border:1.5px solid var(--line-2);
  border-radius:9px;padding:2px;flex:none}body.ui2 .qres button{height:30px;padding:0 11px;border:0;border-radius:6px;background:none;
  font-family:inherit;font-size:12px;font-weight:600;color:var(--ink-3);cursor:pointer}body.ui2 .qres button[aria-pressed="true"]{background:var(--ink);color:#fff}body.ui2 .qpx{margin-top:10px;font-size:11.5px;color:var(--ink-3)}body.ui2 .qinfo{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;
  margin-left:6px;border-radius:50%;border:1.2px solid #C3CAD4;color:#8A929E;font-size:10px;
  font-weight:800;font-style:normal;line-height:1;cursor:help;flex:none}body.ui2 .qinfo:hover{border-color:var(--acc);color:var(--acc);background:var(--acc-bg)}.qtip{position:fixed;z-index:120;background:#14181F;color:#fff;border-radius:11px;padding:11px 13px;
  font-family:'Be Vietnam Pro',-apple-system,sans-serif;font-size:12.5px;font-weight:500;line-height:1.55;
  box-shadow:0 14px 34px -12px rgba(20,24,31,.5);max-width:280px}.qtip[hidden]{display:none}/* Kích thước: một hàng ô vuông, icon khối đặc theo tỉ lệ */
body.ui2 #layCard{background:#fff;border:1px solid var(--line-in);border-radius:12px;margin:0 16px 12px;
  padding:10px 12px 11px}body.ui2 #layCard h3{margin:0 0 7px;font-size:12.5px;font-weight:700;color:var(--ink);
  display:flex;align-items:center;gap:6px}body.ui2 #layCard h3 em{font-style:normal;font-weight:600;color:var(--ink-3);font-size:11px}body.ui2 #layCard .d{display:none}/* Xuống dòng khi hết chỗ, không cuộn ngang */
body.ui2 .lay-g{display:flex;flex-wrap:wrap;gap:5px}body.ui2 .lay-b{flex:1 1 auto;min-width:50px;max-width:76px;display:flex;flex-direction:column;
  align-items:center;justify-content:flex-end;gap:5px;border:1.3px solid var(--line-in);background:#fff;
  border-radius:9px;padding:7px 5px 6px;cursor:pointer;font-family:inherit;transition:.13s}body.ui2 .lay-b:hover{border-color:var(--acc-bd)}body.ui2 .lay-b[aria-pressed="true"]{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc)}body.ui2 .lay-b i{display:block;border-radius:2px;background:#D5D9DF;flex:none}body.ui2 .lay-b[aria-pressed="true"] i{background:var(--acc)}body.ui2 .lay-b span{font-size:10px;font-weight:600;color:var(--ink-3);white-space:nowrap;line-height:1}body.ui2 .lay-b[aria-pressed="true"] span{color:var(--acc)}body.ui2 .lay-b.lay-more{border-style:dashed;justify-content:center}body.ui2 .lay-b.lay-more i{background:none;font-style:normal;font-size:13px;color:var(--ink-3);
  line-height:1;height:auto;width:auto}body.ui2:not(.lv1) #layCard{display:none}body.ui2 #qkCard{background:#fff;border:1px solid var(--line-in);border-radius:12px;margin:0 16px 12px;
  padding:18px 20px 16px}body.ui2 #qkCard h3{margin:0 0 3px;font-size:16px;font-weight:700;color:#14181F;
  display:flex;align-items:center;gap:7px}body.ui2 .qk-ic{flex:none;color:var(--acc)}body.ui2 #qkCard .qk-d{margin:0 0 12px;font-size:12px;color:#7A828F;line-height:1.5}body.ui2 #qkTx{width:100%;box-sizing:border-box;min-height:208px;border: 2px solid #898989;;
  border-radius:10px;padding:12px 14px;font-family:inherit;font-size:14.5px;line-height:1.6;resize:vertical;
  outline:none;color:#14181F}body.ui2 #qkTx:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(234,88,12,.10)}body.ui2 .qk-c{border:1px solid var(--line-in);background:#FCFCFD;border-radius:999px;padding:6px 12px;
  font-family:inherit;font-size:12px;color:#3F4653;cursor:pointer;transition:.13s}body.ui2 .qk-c:hover{border-color:var(--acc);color:var(--acc);background:var(--acc-bg)}body.ui2 .qk-note{margin-top:11px;padding:10px 13px;border-radius:9px;background:var(--acc-bg);
  border:1px solid var(--acc-bd);font-size:12.5px;color:var(--acc-tx);line-height:1.5}body.ui2 .qk-note b{font-weight:700}body.ui2 #qkCard.busy{opacity:.65;pointer-events:none}/* Sơ cấp: giấu form chi tiết, chỉ còn ô nhập + nút Tạo */
body.ui2.lv1 .grp[data-grp="content"], body.ui2.lv1 #missBar, body.ui2.lv1 #advCard{display:none}/* Khu Chất lượng vẫn hiện ở chế độ tự do — nằm ngay dưới ô mô tả */
body.ui2:not(.lv1) #qkCard{display:none}
@media (max-width:900px){body.ui2 .lvbar{margin:0 10px 10px}body.ui2 #qkCard{margin:0 10px 12px} }/* ── Lớp phủ trạng thái ngay trên khung xem trước (chế độ Sơ cấp) ── */
body.ui2 #qkOv{position:absolute;inset:0;z-index:20;background:rgba(255,255,255,.96);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;
  border-radius:10px;padding:18px;text-align:center}body.ui2 #qkOv[hidden]{display:none}body.ui2 #qkOv .sp{width:38px;height:38px;border:3px solid var(--line-in);border-top-color:var(--acc);
  border-radius:50%;animation:qkspin .8s linear infinite}
@keyframes qkspin{to{transform:rotate(360deg)}}body.ui2 #qkOv .tt{font-size:15px;font-weight:700;color:var(--ink)}body.ui2 #qkOv .sub{font-size:12.5px;color:var(--ink-3)}body.ui2 #qkOv img{max-width:100%;max-height:100%;border-radius:10px;display:block;
  border:1px solid var(--line-in)}body.ui2 #qkOv .acts{display:flex;gap:7px;flex-wrap:wrap;justify-content:center}body.ui2 #qkOv .acts a, body.ui2 #qkOv .acts button{border:1.5px solid var(--line-in);background:#fff;
  border-radius:9px;padding:8px 13px;font-family:inherit;font-size:12.5px;font-weight:600;color:#3F4653;
  cursor:pointer;text-decoration:none}body.ui2 #qkOv .acts .pri{background:var(--acc);border-color:var(--acc);color:#fff}body.ui2 #qkOv .err{color:#B91C1C;font-size:13px;max-width:340px}/* ── TOÀN MÀN HÌNH cho chỉnh thủ công ── */
body.ui2 .canvas-wrap{position:relative}body.ui2 #btnFs{position:absolute;top:12px;right:12px;z-index:12;width:38px;height:38px;
  border:1px solid var(--line-in);background:rgba(255,255,255,.94);border-radius:9px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;color:#3F4653;transition:.15s;
  box-shadow:0 4px 14px -6px rgba(20,24,31,.25)}body.ui2 #btnFs:hover{color:var(--acc);border-color:var(--acc-bd)}body.ui2 #cvWrap.fs{position:fixed;inset:0;z-index:90;background:#101318;padding:30px 44px 26px;margin:0}body.ui2 #cvWrap.fs .canvas{box-shadow:0 40px 120px -40px rgba(0,0,0,.9)}body.ui2 #cvWrap.fs #btnFs{top:16px;right:18px}body.ui2 #cvWrap.fs .cap{color:#B7BDC8}body.ui2.fs-lock{overflow:hidden}

/* ── PHẦN 8: Không trang trí ảnh minh hoạ (nền trơn) ── */
.pbg{margin-top:14px;border:1px solid var(--line-3);border-radius:12px;background:#FCFCFE;overflow:hidden}
.pbg .pbg-bar{padding:11px 13px}
.pbg-c{padding:0 13px 13px;border-top:1px dashed var(--line-3)}
.pbg-c[hidden]{display:none}
.pbg-row{display:flex;align-items:center;gap:9px;margin-top:11px}
.pbg-row label{font-size:12.5px;font-weight:700;color:var(--ink-2);flex:none}
.pbg-pick{position:relative;width:38px;height:30px;border-radius:8px;border:1px solid var(--line-2,#D4DAE6);overflow:hidden;flex:none;background:#fff}
.pbg-pick input[type=color]{position:absolute;inset:-6px;width:calc(100% + 12px);height:calc(100% + 12px);border:none;padding:0;cursor:pointer;background:none}
.pbg-hex{width:96px !important;padding:7px 8px !important;font-weight:700;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;letter-spacing:.4px;text-transform:uppercase}
.pbg-hex.bad{border-color:#DC2626 !important;color:#DC2626}
.pbg-sw{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pbg-sw button{width:24px;height:24px;border-radius:7px;border:1px solid rgba(0,0,0,.14);cursor:pointer;padding:0;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);transition:transform .12s}
.pbg-sw button:hover{transform:scale(1.12)}
.pbg-sw button[aria-pressed="true"]{outline:2px solid var(--acc);outline-offset:2px}
body.plainbg .grp[data-grp="illust"],body.plainbg .grp[data-grp="scene"]{display:none}
