:root{
  --bg:#ffffff; --surface:#f8f9fa; --surface-2:#eef1f4;
  --line:#e3e7ec; --line-strong:#cbd2da;
  --accent:#1e5fd0; --accent-deep:#e9f0fc; --accent-line:#b9d0f5;
  --premium:#a86d14; --premium-deep:#fbf3e3; --premium-line:#ead4a6;
  --danger:#c8322a;
  --text:#16181d; --text-mid:#5c626c; --text-dim:#8d939c;
  --font:'Pretendard','Noto Sans KR','Noto Sans CJK KR','Malgun Gothic',sans-serif;
  --mono:'JetBrains Mono','SFMono-Regular',Menlo,Consolas,monospace;
  --w:1280px; --h:720px; --pad:56px;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none !important}
html,body{background:#e9eaec;font-family:var(--font);-webkit-font-smoothing:antialiased}

.slide{
  position:relative; width:var(--w); height:var(--h);
  background:var(--bg); color:var(--text); padding:var(--pad);
  overflow:hidden; margin:0 auto 24px;
  box-shadow:0 1px 3px rgba(0,0,0,.06),0 10px 30px rgba(0,0,0,.08);
  page-break-after:always; break-after:page;
  display:flex; flex-direction:column;
}

/* ── 공통 ── */
.s-title{font-size:34px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.s-title .thin{font-weight:500;color:var(--text-mid);font-size:22px;margin-left:14px;
               letter-spacing:0;vertical-align:2px}
.s-sub{margin-top:7px;font-size:14.5px;color:var(--text-mid)}
.s-sub.glossary{margin-top:3px}
.title-row{display:flex;align-items:center;gap:14px}
.badge{font-size:11.5px;font-weight:700;letter-spacing:.08em;padding:6px 13px;border-radius:6px}
.badge.basic{color:var(--accent);background:var(--accent-deep);border:1px solid var(--accent-line)}
.badge.prem{color:var(--premium);background:var(--premium-deep);border:1px solid var(--premium-line)}

/* 빈 칸 안내 — 화면에서만 보인다 */
[contenteditable]:empty::before{
  content:attr(data-plc); color:var(--text-dim); font-weight:400; opacity:.85;
}
[contenteditable]:focus{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.hint{font-size:11.5px;color:var(--text-dim);line-height:1.5}
.invalid{outline:2px solid var(--danger) !important;outline-offset:3px;border-radius:3px}

/* ── 이미지 자리 ── */
.ph{
  position:relative; overflow:hidden;
  background:var(--surface-2); border:1px dashed var(--line-strong); border-radius:6px;
  display:flex; align-items:center; justify-content:center; text-align:center;
  font-size:11px; color:var(--text-dim); line-height:1.5; padding:8px;
  aspect-ratio:1; width:auto; margin-left:auto; margin-right:auto;
}
.ph .lbl{pointer-events:none}
.ph:not(.filled){cursor:pointer}
.ph:not(.filled):hover{border-color:var(--accent-line)}
.ph:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ph .lbl b{display:block;font-size:12px;font-weight:700;color:var(--text-mid);margin-bottom:3px}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.ph.filled{background:none;border:1px solid var(--line);padding:0}
.ph.filled .lbl{display:none}
.ph.drag{border:1px dashed var(--accent);background:var(--accent-deep);color:var(--accent)}

.iconbtn{
  position:absolute; width:26px; height:26px; border-radius:50%;
  border:0; cursor:pointer; font:inherit; font-size:15px; line-height:1;
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .12s; z-index:3;
}
.ph:hover .iconbtn{opacity:1}
.iconbtn.add{right:7px;bottom:7px;background:var(--accent);color:#fff}
.iconbtn.clr{right:7px;top:7px;background:var(--danger);color:#fff;font-size:14px;display:none}
.ph.filled .iconbtn.clr{display:flex}

/* ── 항목 삭제 ── */
.unit{position:relative}
.unit .rm{
  position:absolute; top:5px; right:5px; width:20px; height:20px; border-radius:50%;
  background:var(--danger); color:#fff; border:0; cursor:pointer;
  font:inherit; font-size:13px; line-height:1; z-index:4;
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .12s;
}
.unit:hover .rm{opacity:1}

/* ── 페이지 도구 (화면 전용 · 우측 상단) ── */
.pagetools{position:absolute;top:12px;right:14px;z-index:8;display:flex;gap:6px;align-items:flex-start}
.pagetools.col{flex-direction:column;align-items:flex-end}
.pagetools button,.addmenu summary{
  font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;border-radius:6px;white-space:nowrap;
  padding:5px 10px;border:1px solid var(--line-strong);background:#fff;color:var(--text-mid);
}
.pagetools button:hover{background:var(--surface)}
.pagetools button.del{color:var(--danger);border-color:#f0c0bc}
.addmenu{position:relative}
.addmenu summary{list-style:none;user-select:none;color:var(--accent);background:var(--accent-deep);
                 border:1px dashed var(--accent-line)}
.addmenu summary::-webkit-details-marker{display:none}
.addmenu summary:hover{background:#dce9fb}
.addmenu .menu{position:absolute;right:0;top:calc(100% + 5px);z-index:9;display:flex;flex-direction:column;
  min-width:170px;background:#fff;border:1px solid var(--line-strong);border-radius:10px;padding:6px;
  box-shadow:0 6px 20px rgba(0,0,0,.12)}
.addmenu .menu button{border:0;background:none;text-align:left;padding:8px 12px;font-size:12.5px;
  font-weight:600;color:var(--text);border-radius:6px}
.addmenu .menu button:hover{background:var(--surface)}

/* ── 개수에 따라 크기가 맞춰지는 격자 ── */
.fitgrid{display:grid;grid-template-columns:repeat(var(--cols,2),minmax(0,1fr));align-content:start;min-height:0}
.fitgrid > .unit{display:flex;flex-direction:column;min-width:0}
.fitgrid > .unit > .ph{flex:none;height:var(--ph,200px)}

/* ══════════════ 첫 페이지 (화면 전용) ══════════════ */
.guide{height:auto;background:#fbfcfd;border:1px solid var(--line)}
.guide h2{font-size:26px;font-weight:800;letter-spacing:-.02em}
.guide .lead{margin-top:10px;font-size:14px;color:var(--text-mid);line-height:1.6;white-space:pre-line}
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}
.gcard{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px 20px}
.gcard .n{font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--accent)}
.gcard h3{margin-top:8px;font-size:15px;font-weight:800}
.gcard p{margin-top:7px;font-size:12.5px;color:var(--text-mid);line-height:1.6}
.guide .brandtype{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:12.5px;font-weight:600;color:var(--text-mid)}
.guide .brandtype .btn-sub{font-size:12px;padding:6px 11px}
.btn-sub{display:inline-block;font:inherit;font-size:13px;font-weight:700;text-decoration:none;cursor:pointer;border-radius:9px;
         padding:9px 14px;border:1px solid var(--line-strong);background:#fff;color:var(--text)}
.btn-sub:hover{background:var(--surface)}
.guide .terms{margin-top:18px;font-size:11px;color:var(--text-dim);line-height:1.6}
.guide .maker{margin-top:2px;font-size:11px;color:var(--text-dim);letter-spacing:.02em}
.guide .maker a{color:inherit;text-decoration:none}
.guide .maker a:hover{color:var(--accent);text-decoration:underline}

/* ══════════════ 표지 ══════════════ */
.cover{align-items:center;justify-content:center;text-align:center}
.cover .logo{aspect-ratio:auto;min-width:220px;height:70px;margin-bottom:26px;
             display:flex;align-items:center;justify-content:center;
             border-radius:8px;padding:0 30px;font-size:12px}
.cover h1{font-size:48px;font-weight:800;letter-spacing:-.03em;line-height:1.2}
.cover .prod{margin-top:8px;font-size:24px;font-weight:600;color:var(--text);line-height:1.4}
.cover .lead{margin-top:12px;font-size:22px;font-weight:400;letter-spacing:.22em;
             color:var(--text-mid);padding-left:.22em}
.cover .shootdate{margin-top:18px;font-size:17px;font-weight:700;color:var(--accent);letter-spacing:-.01em}
.cover .shootdate .k{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--text-dim);
                     display:block;margin-bottom:7px}
.cover .rule{width:48px;height:2px;background:var(--line-strong);margin:24px 0 18px}
.cover .meta{margin-top:18px;font-size:13px;color:var(--text-dim);letter-spacing:.04em}
.cover .meta .sep{margin:0 9px;color:var(--line-strong)}
.cover .meta .ver{font-family:var(--mono);font-weight:700;color:var(--accent)}

/* ══════════════ 제품 구성 및 소개 ══════════════ */
.specline{display:flex;gap:38px;margin-top:20px;padding-right:130px}
.specline .item{display:flex;align-items:baseline;gap:10px}
.specline .k{font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--text-dim);white-space:nowrap}
.specline .v{font-size:17px;font-weight:700}
.pgrid{flex:1;gap:20px;margin-top:14px}
.pitem .kt{flex:none;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--accent);text-align:center;margin-bottom:5px}
.pitem .cap{flex:none;margin-top:8px;font-size:13.5px;font-weight:700;text-align:center;
            white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.4}

/* ══════════════ 촬영 컨셉 ══════════════ */
.mood{margin-top:14px;padding:16px 22px;background:var(--surface);
      border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:10px}
.mood .q{font-size:19px;font-weight:700;line-height:1.4;letter-spacing:-.01em}
.sec-lbl{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--text-dim);
         display:flex;align-items:center;gap:9px}
.sec-lbl::after{content:"";flex:1;height:1px;background:var(--line)}
.tone-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px 30px;margin-top:11px}
.axis{display:flex;align-items:center;gap:10px}
.axis .ak{flex:none;width:52px;font-size:11.5px;color:var(--text-mid)}
.axis .opts{flex:1;display:flex;gap:7px}
.chip{flex:1;text-align:center;font:inherit;font-size:12.5px;font-weight:600;color:var(--text-mid);
      background:var(--bg);border:1px solid var(--line-strong);border-radius:18px;
      padding:7px 4px;cursor:pointer;user-select:none;
      transition:background .12s,color .12s,border-color .12s}
.chip:hover{border-color:var(--accent-line)}
.chip.on{color:var(--accent);background:var(--accent-deep);border-color:var(--accent);font-weight:700}
.hash-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:11px}
.hash{font-size:13px;font-weight:600;color:var(--accent);background:var(--accent-deep);
      border:1px solid var(--accent-line);border-radius:18px;padding:7px 14px;
      min-width:74px;text-align:center}
.hash:empty::before{color:var(--accent);opacity:.55}
.attach-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:11px;flex:1;min-height:0}
.attach{display:flex;flex-direction:column;min-height:0}
.attach .ph{flex:none;height:158px;border-radius:8px}
.attach .cap{flex:none;margin-top:7px;font-size:11.5px;color:var(--text-mid);line-height:1.4}

/* ══════════════ 전체 컷 리스트 ══════════════ */
.scale{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);
       border-radius:10px;display:flex}
.scale .k{font-size:13px;font-weight:700;letter-spacing:-.01em}
.scale .n{margin-left:auto;font-size:26px;font-weight:800;letter-spacing:-.04em;color:var(--accent);line-height:1}
.scale .n small{font-size:12px;font-weight:700;margin-left:3px;letter-spacing:0}
.scale.model,.scale.gif{border-top-color:var(--premium)}
.scale.model .n,.scale.gif .n{color:var(--premium)}
.scale.total{border-top-color:var(--text)}
.scale.total .n{color:var(--text)}
.sum-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:14px}
.sum-grid .scale{padding:11px 16px;flex-direction:row;align-items:baseline;gap:10px}
.cutlist{flex:1;min-height:0;overflow:hidden;margin-top:14px;display:grid;
         grid-template-columns:repeat(var(--tcols,1),minmax(0,1fr));gap:20px;align-content:start;align-items:start}
.cuttable{width:100%;border-collapse:collapse;table-layout:fixed;border:1px solid var(--line)}
.cuttable th{font-size:11.5px;font-weight:700;letter-spacing:-.01em;color:#fff;background:#7b828c;
             padding:10px 9px;border-right:1px solid #fff;text-align:left}
.cuttable th:last-child{border-right:0;text-align:center}
.cuttable td{font-size:12.5px;line-height:1.5;padding:9px 10px;background:var(--bg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
             border-top:1px solid var(--line);border-right:1px solid var(--line);vertical-align:middle}
.cuttable td:last-child{border-right:0;text-align:center}
.cuttable tbody tr:nth-child(even) td{background:var(--surface)}
.cuttable .no{text-align:center;font-family:var(--mono);font-weight:700;color:var(--accent)}
.cuttable td.kd{font-weight:700;color:var(--text-mid)}
.cutlist[data-density="compact"] .cuttable td{padding:5px 10px}
.cutlist[data-density="tight"] .cuttable td{padding:3px 8px;font-size:11.5px}
.cutlist[data-density="tight"] .cuttable th{padding:6px 8px}

/* ══════════════ 컷 페이지 ══════════════ */
.cut-hd{display:flex;align-items:center;gap:13px}
.cut-no{flex:none;width:46px;height:46px;border-radius:9px;
        background:var(--accent-deep);border:1px solid var(--accent-line);
        display:flex;align-items:center;justify-content:center;
        font-size:19px;font-weight:800;color:var(--accent);letter-spacing:-.02em}
.kindtag{flex:none;font-size:12.5px;font-weight:800;padding:6px 12px;border-radius:7px;
         color:var(--accent);background:var(--accent-deep);border:1px solid var(--accent-line)}
.cutslide[data-kind="모델"] .kindtag,.cutslide[data-kind="GIF"] .kindtag{
         color:var(--premium);background:var(--premium-deep);border-color:var(--premium-line)}
.cut-hd h1{flex:1;min-width:0;font-size:28px;font-weight:800;letter-spacing:-.02em;line-height:1.15}
.cnt{margin-left:auto;flex:none;font-size:12px;font-weight:700;color:var(--accent);
     background:var(--accent-deep);border:1px solid var(--accent-line);
     border-radius:20px;padding:6px 15px}
.cut-detail{display:grid;grid-template-columns:minmax(0,62fr) minmax(0,38fr);grid-template-rows:minmax(0,1fr);
            gap:22px;margin-top:18px;flex:1;min-height:0}
.refs{gap:12px;overflow:hidden}
.refs .item .cap{flex:none;font-size:11px;font-weight:700;letter-spacing:.06em;
                 color:var(--accent);margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.refs .item .ph{border-radius:7px;width:var(--ph,200px);height:var(--ph,200px);aspect-ratio:1;margin:0}
.refs .item .ph.filled{background:var(--surface-2);border-color:var(--line)}
.refs .item .memo{flex:none;margin-top:5px;height:34px;overflow:hidden;font-size:11.5px;line-height:1.45;color:var(--text-mid)}
.bgbox{display:flex;flex-direction:column}
.bgbox .k{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--text-dim)}
.bgbox .swatch{margin-top:10px;height:150px;border-radius:8px;aspect-ratio:auto;
               font-size:10.5px;line-height:1.5}
.bgbox .swatch.picked{border:1px solid var(--line);background-clip:padding-box}
.bgbox .swatch.picked .lbl{display:none}
.bgpick{display:flex;align-items:center;gap:8px;margin-top:9px}
.bgpick input[type=color]{width:32px;height:26px;padding:0;border:1px solid var(--line-strong);
                          border-radius:6px;background:none;cursor:pointer}
.bgpick .hex{font-family:var(--mono);font-size:11.5px;color:var(--text-mid);letter-spacing:.02em}
.bgpick .reset{margin-left:auto;font:inherit;font-size:11px;color:var(--text-dim);
               background:none;border:0;cursor:pointer;text-decoration:underline}
.bgbox .v{margin-top:9px;font-size:13.5px;font-weight:700;line-height:1.4}
.bgbox .n{margin-top:5px;font-size:11.5px;color:var(--text-dim);line-height:1.5}
.spectable{width:100%;border-collapse:collapse;table-layout:fixed;
           border:1px solid var(--line);border-radius:9px;overflow:hidden;align-self:start}
.spectable th{width:86px;text-align:center;vertical-align:middle;font-size:12.5px;font-weight:700;
              color:#fff;background:#7b828c;padding:13px 0;border-bottom:1px solid #ffffff}
.spectable td{font-size:13px;line-height:1.55;padding:13px 18px;background:var(--surface);
              border-bottom:1px solid var(--line);vertical-align:top}
.spectable tr:last-child th,.spectable tr:last-child td{border-bottom:0}

.pno{position:absolute;right:var(--pad);bottom:22px;font-size:10.5px;color:var(--text-dim);letter-spacing:.1em}

/* ══════════════ 어디에 쓰나요 부품 ══════════════ */
.opt-tag{font-size:10px;font-weight:700;letter-spacing:0;color:var(--text-dim);
         background:var(--surface-2);border:1px solid var(--line);border-radius:4px;padding:3px 7px}
.chips-multi,.chips-one{display:flex;flex-wrap:wrap;gap:8px;margin-top:11px}
.chips-multi .chip,.chips-one .chip{flex:0 1 auto;min-width:108px;padding:8px 16px}
.order-row{display:flex;gap:12px;margin-top:11px}
.order-row .cell{flex:1;min-width:0;display:flex;align-items:center;gap:10px;
                 background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:11px 14px}
.order-row .cell .n{flex:none;width:22px;height:22px;border-radius:50%;
                    background:var(--accent-deep);border:1px solid var(--accent-line);color:var(--accent);
                    font-size:11.5px;font-weight:800;display:flex;align-items:center;justify-content:center}
.order-row .cell .t{flex:1;min-width:0;font-size:13px;line-height:1.5}
.mood.avoid{border-left-color:var(--danger)}
.mood .m{font-size:15px;font-weight:600;line-height:1.5}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.two-col.fill{flex:1;min-height:0}
.two-col.fill > div{display:flex;flex-direction:column;min-height:0}
.two-col.fill .mood{flex:1;min-height:0}

/* ══════════════ 위쪽 저장 막대 ══════════════ */
.savebar{
  position:sticky; top:0; z-index:100;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  max-width:var(--w); margin:0 auto 20px;
  background:#fff; border:1px solid var(--line-strong); border-top:0; border-radius:0 0 14px 14px;
  padding:10px 13px 10px 16px; box-shadow:0 4px 18px rgba(0,0,0,.10);
}
/* PDF 단추 곁의 상시 안내 — 막대가 wrap 이라 한 줄을 통째로 차지한다.
   문구는 문의 흐름 1단계(`planner.js`)와 한 꼴이어야 한다. */
.savebar .pdf-hint{flex:1 1 100%;margin:1px 2px 0;font-size:12px;color:var(--text-mid);line-height:1.5;text-align:right}
.savebar .fn{flex:1;min-width:0;font-family:var(--mono);font-size:11px;color:var(--text-dim);
             white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.savebar button,.bottombar button,.inq button{font:inherit;font-size:13px;font-weight:700;cursor:pointer;border-radius:9px;
                padding:9px 14px;border:1px solid var(--line-strong);background:#fff;color:var(--text)}
.savebar button:hover,.bottombar button:hover,.inq button:hover{background:var(--surface)}
.savebar button.primary,.bottombar button.primary,.inq button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.savebar button.primary:hover,.bottombar button.primary:hover,.inq button.primary:hover{background:#1a52b6}
.inq button.primary:disabled{background:var(--line-strong);border-color:var(--line-strong);cursor:not-allowed}
.savebar .div{width:1px;height:22px;background:var(--line)}

/* ══════════════ 아래 독립 막대 (컷 추가 · 문의) ══════════════ */
.bottombar{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  max-width:var(--w); margin:8px auto 14px;
  background:#fff; border:1px solid var(--line-strong); border-radius:14px;
  padding:12px 14px; box-shadow:0 1px 3px rgba(0,0,0,.06),0 10px 30px rgba(0,0,0,.08);
}
.bottombar button[data-cut]{color:var(--accent);background:var(--accent-deep);border:1px dashed var(--accent-line)}
.bottombar button[data-cut="모델"],.bottombar button[data-cut="GIF"]{color:var(--premium);background:var(--premium-deep);border-color:var(--premium-line)}
.bottombar .grow{flex:1}

/* ══════════════ 컷 페이지 우측 — 제품 · 배경 · 추가설명 ══════════════ */
.cutside{display:flex;flex-direction:column;gap:10px;min-height:0;min-width:0;overflow:hidden}
.sidebox{flex:none;background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:10px 12px;min-width:0}
.sidebox .k{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--text-dim);margin-bottom:7px}
.sidehd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}
.sidehd .k{margin-bottom:0}
.pickbtn{font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;border-radius:6px;padding:3px 10px;
         color:var(--accent);background:#fff;border:1px solid var(--accent-line)}
.pickbtn:hover{background:var(--accent-deep)}
.prodsel{display:grid;grid-template-columns:repeat(var(--pscols,1),var(--pp,160px));gap:8px 10px;justify-content:center}
.prodsel[data-n="0"]{display:block}
.ps-item{min-width:0}
.ps-img{position:relative;width:var(--pp,160px);height:var(--pp,160px);background:#fff;border:1px solid var(--line);border-radius:7px;overflow:hidden;
        display:flex;align-items:center;justify-content:center}
.ps-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.ps-none{font-size:11px;color:var(--text-dim)}
.ps-name{margin-top:3px;font-size:11px;font-weight:600;color:var(--text-mid);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ps-empty{font-size:11.5px;line-height:1.5}
.prodsel[data-n="0"]{min-height:64px;display:flex;align-items:center;justify-content:center;text-align:center}
.pk-lead{margin-top:4px;font-size:12px;color:var(--text-mid);line-height:1.5}
.cutside .bgbox .swatch{width:var(--bs,160px);height:var(--bs,160px);aspect-ratio:auto;margin:0 auto;border-radius:7px;font-size:10.5px}
.cutside .bgbox .swatch.picked{border:1px solid var(--line)}
.cutside .bgbox .bgmeta{display:flex;align-items:baseline;gap:8px;margin-top:6px;min-width:0}
.cutside .bgbox .v{flex:1;min-width:0;margin-top:0;font-size:12px;font-weight:700;line-height:1.4}
.cutside .bgbox .hex{flex:none;font-family:var(--mono);font-size:10.5px;color:var(--text-mid)}
.cutside .bgbox .bgpick{gap:6px}
.cutside .bgbox .bgpick input[type=color]{width:28px;height:22px}
.side-note .note{min-height:36px;font-size:12px;line-height:1.5;white-space:pre-wrap;word-break:break-all}
.cutleft{display:flex;flex-direction:column;min-height:0;min-width:0}
.refdesc{flex:none;margin-bottom:8px;font-size:12px;line-height:1.5}
.refarea{flex:1;min-height:0;display:flex;gap:12px;align-items:flex-start}
.refmain{flex:none;width:var(--rm,420px)}
.refmain .unit{display:flex;flex-direction:column;width:var(--rm,420px)}
.refmain .ph{flex:none;width:var(--rm,420px);height:var(--rm,420px);border-radius:8px;margin:0}
.refmain .ph.filled{background:var(--surface-2);border-color:var(--line)}
.refmain .cap{font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--accent);margin-bottom:5px}
.refmain .memo{flex:none;margin-top:5px;height:34px;overflow:hidden;font-size:11.5px;line-height:1.45;color:var(--text-mid)}
.refarea .refs{flex:1;min-width:0;align-self:stretch;min-height:0}
.refarea .refs .item .cap{font-size:10px;letter-spacing:.02em}
.refarea .refs .item .caprow{margin-bottom:3px}
.refarea .refs .item .memo{height:17px;margin-top:3px;font-size:10.5px;line-height:1.6;white-space:nowrap;text-overflow:ellipsis}
.anglesel{display:flex;flex-wrap:wrap;gap:5px}
.anglesel[data-n="0"]{min-height:44px;align-items:center;justify-content:center;text-align:center}
.ag-tag{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;color:var(--text);background:#fff;border:1px solid var(--line-strong);border-radius:8px;padding:2px 9px 2px 3px;
        -webkit-print-color-adjust:exact;print-color-adjust:exact}
.ag-tag svg{width:24px;height:24px;flex:none}
.ag-tag > span{white-space:nowrap}
.ag-box{width:min(420px,100%)}
.ag-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.pk-sub{font-size:11.5px;font-weight:500;color:var(--text-dim);margin-left:4px}
.pk-box .ag-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px 8px;white-space:nowrap;border:1.5px solid var(--line-strong);border-radius:10px;background:#fff;font-size:12px;font-weight:600;color:var(--text-mid)}
.ag-card svg{width:58px;height:58px}
.pk-box .ag-card.on{border-color:var(--accent);background:var(--accent-deep);color:var(--accent)}
.ag-card.on::after{content:"✓";position:absolute;top:5px;right:6px;width:18px;height:18px;border-radius:50%;background:var(--accent);color:#fff;font-size:11px;line-height:18px;text-align:center}
.anglebtn{font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;border-radius:6px;padding:3px 10px;color:var(--accent);background:#fff;border:1px solid var(--accent-line)}
.bgmode{display:flex;gap:4px}
.bgmode button{font:inherit;font-size:11px;font-weight:700;cursor:pointer;border-radius:6px;padding:2px 8px;border:1px solid var(--line-strong);background:#fff;color:var(--text-mid)}
.bgmode button.on{color:var(--accent);background:var(--accent-deep);border-color:var(--accent)}
.bgsq{display:flex;justify-content:center}
.bgcolor{width:var(--bs,160px);height:var(--bs,160px);border-radius:7px;border:1px dashed var(--line-strong);background:var(--surface-2);
         display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--text-dim);-webkit-print-color-adjust:exact;print-color-adjust:exact}
.bgcolor.picked{border:1px solid var(--line)}
.bgcolor.picked .lbl{display:none}
.bgbox[data-mode="photo"] .bgcolor,.bgbox[data-mode="photo"] .bgpick,.bgbox[data-mode="photo"] .hex,
.bgbox[data-mode="color"] .bg-photo{display:none !important}
.cutside .bgbox .bgpick{display:flex;justify-content:flex-end;margin-top:5px}
.refs{grid-template-columns:repeat(var(--cols,2),var(--ph,200px));justify-content:start}
.refs > .unit{width:var(--ph,200px)}
.iconbtn.crop{left:7px;top:7px;width:auto;height:22px;padding:0 8px;border-radius:11px;font-size:11px;font-weight:700;
              background:rgba(22,24,29,.78);color:#fff;display:none}
.ph.filled .iconbtn.crop{display:flex}
.crop-overlay{position:fixed;inset:0;z-index:260;background:rgba(22,24,29,.55);display:flex;align-items:center;justify-content:center;padding:20px}
.crop-box{background:#fff;border-radius:14px;padding:18px 20px;box-shadow:0 20px 60px rgba(0,0,0,.25);width:min(520px,100%)}
.crop-hd{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.crop-hd b{font-size:16px}
.crop-hd span{font-size:12px;color:var(--text-mid)}
.crop-frame{position:relative;width:min(440px,100%);aspect-ratio:1;margin:14px auto 0;overflow:hidden;background:var(--surface-2);
            border:1px solid var(--line-strong);border-radius:8px;cursor:grab;touch-action:none}
.crop-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none}
.crop-tools{display:flex;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap}
.crop-tools .grow{flex:1}
.crop-pct{font-family:var(--mono);font-size:11px;color:var(--text-mid);min-width:40px}
.crop-box button,.pk-box button{font:inherit;font-size:13px;font-weight:700;cursor:pointer;border-radius:9px;padding:8px 13px;border:1px solid var(--line-strong);background:#fff;color:var(--text)}
.crop-box button.primary,.pk-box button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.pk-dialog{position:fixed;inset:0;z-index:250;background:rgba(22,24,29,.45);display:flex;align-items:center;justify-content:center;padding:20px}
.pk-box{background:#fff;border-radius:14px;padding:16px 18px;width:min(360px,100%);max-height:calc(100vh - 40px);overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.pk-hd{display:flex;align-items:center;justify-content:space-between}
.pk-hd b{font-size:15px}
.pk-box .pk-x{border:0;font-size:18px;padding:2px 8px;color:var(--text-dim)}
.pk-list{margin-top:10px}
.pk-list .pk-head{margin:10px 0 4px;font-size:11px;font-weight:700;color:var(--text-dim)}
.pk-row{display:flex;align-items:center;gap:9px;padding:6px 4px;border-radius:7px;cursor:pointer;font-size:13px}
.pk-row:hover{background:var(--surface)}
.pk-row img,.pk-row .pk-dot{flex:none;width:36px;height:36px;border-radius:6px;object-fit:cover;background:var(--surface-2)}
.pk-actions{display:flex;justify-content:flex-end;margin-top:12px}

.pk-warn{font-size:11.5px;font-weight:700;color:var(--danger)}

/* ══════════════ 레퍼런스 찾아보기 (화면 전용) ══════════════ */
.refbtn{flex:none;font:inherit;font-size:10.5px;font-weight:700;letter-spacing:0;line-height:1.3;cursor:pointer;
        color:var(--accent);background:#fff;border:1px solid var(--accent-line);border-radius:5px;padding:1px 7px}
.refbtn:hover{background:var(--accent-deep)}
.refs .item .caprow{flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:3px;margin-bottom:5px;min-width:0}
.refs .item .caprow .cap{align-self:stretch;min-width:0;margin-bottom:0}
.sec-lbl .refbtn{order:2}
.toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);z-index:300;background:#16181d;color:#fff;
       font-size:13px;padding:10px 16px;border-radius:9px;box-shadow:0 6px 20px rgba(0,0,0,.2)}

/* ══════════════ 문의 대화창 ══════════════ */
.inq-overlay{position:fixed;inset:0;z-index:200;background:rgba(22,24,29,.45);
             display:flex;align-items:center;justify-content:center;padding:20px}
.inq{width:min(540px,100%);max-height:calc(100vh - 40px);overflow:auto;background:#fff;border-radius:14px;
     padding:22px 24px;box-shadow:0 20px 60px rgba(0,0,0,.25);color:var(--text)}
.inq-hd{display:flex;align-items:center;gap:10px}
.inq-hd h2{flex:1;font-size:18px;font-weight:800;letter-spacing:-.01em}
.inq .inq-x{border:0;background:none;font-size:20px;padding:2px 8px;color:var(--text-dim)}
.inq-ro{display:grid;grid-template-columns:96px 1fr;gap:7px 12px;margin-top:16px;padding:14px 16px;
        background:var(--surface);border:1px solid var(--line);border-radius:10px;font-size:13px}
.inq-ro dt{color:var(--text-dim);font-weight:700}
.inq-ro dd{font-weight:600;word-break:break-all}
.inq-ro dd:empty::before{content:"—";color:var(--text-dim)}
.inq label{display:block;font-size:12.5px;font-weight:700;color:var(--text-mid)}
.inq-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.inq input[type=date],.inq input[type=text],.inq input[type=email],.inq input[type=tel],.inq textarea{display:block;width:100%;margin-top:6px;font:inherit;font-size:13px;font-weight:400;
        color:var(--text);padding:8px 10px;border:1px solid var(--line-strong);border-radius:8px;background:#fff}
.inq textarea{resize:vertical}
.inq-memo{margin-top:12px}
.inq-consent{margin-top:14px;display:flex !important;gap:8px;align-items:flex-start;line-height:1.5}
.inq-consent input{margin-top:3px}
.inq-consent-note{margin-top:14px;font-size:12px;color:var(--text-mid);line-height:1.6}
.inq-consent-note a{color:var(--accent)}
.inq-lead{margin-top:16px;font-size:15px;font-weight:700}
.inq-notes{margin-top:10px;padding-left:18px;font-size:12.5px;color:var(--text-mid);line-height:1.7}
.inq-file{margin-top:14px}
.inq-file input{font:inherit;font-size:13px}
.inq-warn{margin-top:10px;font-size:12px;color:var(--danger);line-height:1.5}
.inq-stage{margin-right:auto;font-size:12.5px;color:var(--text-mid)}
.inq-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}
.inq-result p{margin-top:16px;font-size:14px;line-height:1.6}
.inq-result a{color:var(--accent);font-size:13px;font-weight:700}

/* ══════════════ 터치 기기 ══════════════ */
@media (hover:none){
  .iconbtn{opacity:1}
  .unit .rm{opacity:1}
}

/* ══════════════ 모바일 · 태블릿 ══════════════ */
@media screen and (max-width:1100px){
  html,body{-webkit-text-size-adjust:100%}
  .slide{
    width:100%; height:auto; min-height:0; overflow:visible;
    padding:26px 18px 32px; margin:0 auto 14px; box-shadow:0 1px 4px rgba(0,0,0,.08);
  }
  .pno{display:none}
  .pagetools,.pagetools.col{position:static;flex-direction:row;flex-wrap:wrap;justify-content:flex-end;margin-bottom:10px}

  .s-title{font-size:24px}
  .s-title .thin{display:block;margin:7px 0 0;font-size:15px;vertical-align:0}
  .s-sub{font-size:13px}
  .title-row{flex-wrap:wrap;gap:10px}
  .badge{font-size:10.5px;padding:5px 10px}

  .guide{padding:26px 18px}
  .guide-grid{grid-template-columns:1fr}
  .cover{padding:40px 18px}
  .cover .logo{width:100% !important;max-width:250px;height:62px !important;margin-bottom:22px}
  .cover h1{font-size:30px}
  .cover .prod{font-size:18px}
  .cover .lead{font-size:18px;letter-spacing:.16em;padding-left:.16em}
  .cover .shootdate{margin-top:16px;font-size:15px}
  .cover .meta{font-size:11.5px}

  .specline{gap:20px;margin-top:16px;padding-right:0;flex-wrap:wrap}
  .specline .v{font-size:15px}
  .fitgrid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px}
  .fitgrid > .unit > .ph{height:auto;width:100%}
  .refs .item .ph{aspect-ratio:1;height:auto}
  .refs{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .refs > .unit{width:auto}
  .refarea{flex-direction:column}
  .refmain,.refmain .unit{width:100%}
  .refmain .ph{width:100%;height:auto;aspect-ratio:1}
  .bgcolor{width:100%;height:auto;aspect-ratio:1}
  .prodsel{grid-template-columns:repeat(var(--pscols,1),minmax(0,1fr))}
  .ps-img,.cutside .bgbox .swatch{width:100%;height:auto;aspect-ratio:1}

  .mood{padding:14px 16px}
  .mood .q{font-size:16px}
  .tone-grid{grid-template-columns:1fr;gap:9px}
  .axis .ak{width:42px;font-size:11px}
  .chip{font-size:11.5px;padding:8px 3px}
  .hash{font-size:12px;padding:6px 12px;min-width:0}
  .attach-row{grid-template-columns:1fr 1fr;gap:10px}
  .attach .ph{height:auto;width:100%}

  .sum-grid{grid-template-columns:1fr 1fr;gap:8px}
  .cutlist{grid-template-columns:1fr !important;gap:12px;overflow:visible}
  .cuttable td,.cuttable th{padding:8px 7px;font-size:11.5px}

  .cut-hd{gap:10px;flex-wrap:wrap}
  .cut-hd h1{font-size:21px;flex:1 1 100%}
  .cut-no{width:40px;height:40px;font-size:17px}
  .cnt{font-size:11.5px;padding:5px 12px}
  .cut-detail{grid-template-columns:1fr;grid-template-rows:auto;gap:16px}
  .cutside{overflow:visible}
  .side-note .note{min-height:60px}
  .bgbox .swatch{height:110px}
  .spectable{table-layout:auto}
  .spectable th{width:62px;font-size:11.5px;padding:11px 0}
  .spectable td{font-size:12.5px;padding:11px 13px}

  .chips-multi .chip,.chips-one .chip{min-width:calc(50% - 4px)}
  .order-row{flex-direction:column}
  .two-col{grid-template-columns:1fr;gap:18px}
  .two-col.fill{display:block}
  .two-col.fill .mood{min-height:70px}

  .savebar{padding:10px;gap:7px;border-radius:0 0 12px 12px}
  .savebar .fn{flex:1 1 100%;font-size:10px}
  .savebar .pdf-hint{text-align:left}
  .savebar button,.bottombar button{padding:9px 12px;font-size:12.5px}
  .bottombar{margin:8px 10px 12px}
  .bottombar button{flex:1 1 calc(50% - 5px)}
  .bottombar .grow{display:none}
  .inq-row{grid-template-columns:1fr}
}
@media screen and (max-width:520px){
  .slide{padding:22px 14px 28px}
  .fitgrid{grid-template-columns:1fr !important}
  .attach-row{grid-template-columns:1fr}
  .attach .ph{min-height:150px}
  .sum-grid{grid-template-columns:1fr}
  .cover h1{font-size:25px}
  .cover .lead{font-size:16px}
}

/* ══════════════ 인쇄 ══════════════ */
@page{size:13.333in 7.5in;margin:0}
@media print{
  html,body{background:var(--bg)}
  .slide{margin:0;box-shadow:none}
  .slide.lastslide{page-break-after:auto;break-after:auto}
  .guide,.savebar,.bottombar,.inq-overlay,.toast,.refbtn,.screen-only,.pagetools,.iconbtn,.unit .rm,.hint,.req,
  .bgpick input,.bgpick .reset{display:none !important}
  [contenteditable]:empty::before{content:"" !important}
  .pk-warn,.ps-empty,.pickbtn,.anglebtn,.pk-dialog,.crop-overlay,.cutside .bgpick,.bgmode,.bgcolor:not(.picked) .lbl{display:none !important}
  .sidebox,.cutside .bgbox .swatch,.ps-img{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .cnt:empty{visibility:hidden}
  .badge,.cut-no,.cnt,.kindtag,.scale,.mood,.spectable th,.spectable td,.cuttable th,.cuttable td,
  .ph,.bgbox .swatch,.chip,.chip.on,.hash,.order-row .cell,.order-row .cell .n,.pitem .kt{
    -webkit-print-color-adjust:exact; print-color-adjust:exact;
  }
}

/* ══════════════ 창이 슬라이드보다 좁을 때 — 비율대로 줄임 (화면만 · 인쇄는 원래 크기) ══════════════ */
@media screen and (min-width:1101px){
  .slide{zoom:var(--fit,1)}
}

/* ══════════════ 웹판 — 화면 전환 · 목록 · 저장 표시 · 복구 · 새 판 알림 ══════════════ */
[data-view="home"] .editor-only,[data-view="editor"] .home-only{display:none !important}
.home{max-width:var(--w);margin:0 auto;padding:22px 0 60px}
.maker-bar{display:flex;justify-content:flex-end;margin:0 4px 10px}
.btn-maker{display:inline-block;font-size:12.5px;font-weight:600;text-decoration:none;color:var(--text-mid)}
.btn-maker:hover{color:var(--accent);text-decoration:underline}
/* 첫 방문 / 재방문 — 목록 카드는 재방문 때만 · 소개의 시작 줄은 첫 방문 때만 */
html:not([data-visit="return"]) #plans{display:none}
[data-visit="return"] .guide .start-row{display:none}
.guide .start-row.start-row-top{display:none}
@media screen and (max-width:600px){ html:not([data-visit="return"]) .guide .start-row.start-row-top{display:flex;margin-top:18px} }
.guide .start-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:24px}
.guide .start-row .btn-start{font:inherit;font-size:15px;font-weight:800;cursor:pointer;border-radius:10px;padding:13px 26px;border:1px solid var(--accent);background:var(--accent);color:#fff}
.guide .start-row .btn-start:hover{background:#1a52b6}
.linkbtn{font:inherit;font-size:13px;font-weight:600;cursor:pointer;background:none;border:0;padding:4px 2px;color:var(--text-mid);text-decoration:underline;text-underline-offset:3px}
.linkbtn:hover{color:var(--accent)}
.guide .save-help{margin-top:14px;font-size:12.5px;color:var(--text-mid);line-height:1.65}
.guide .save-help p{margin:0}
.guide .sh-more{margin-top:2px}
.guide .sh-more summary{cursor:pointer;display:inline-block;color:var(--text-dim);font-size:12px;text-decoration:underline;text-underline-offset:3px}
.guide .sh-more[open] summary{margin-bottom:6px}
.guide .sh-more p{padding-left:12px;border-left:2px solid var(--line)}
.guide .save-help .notice-incog{margin-top:6px;font-weight:700;color:var(--accent)}

.plans{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin:0 auto 24px;
       box-shadow:0 1px 3px rgba(0,0,0,.06),0 10px 30px rgba(0,0,0,.06)}
.plans-hd{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.plans-hd h1{flex:1;font-size:22px;font-weight:800;letter-spacing:-.02em}
.plans-hd button,.plan-row button,.updatebar button,.rs-box button{font:inherit;font-size:13px;font-weight:700;cursor:pointer;border-radius:9px;
       padding:9px 14px;border:1px solid var(--line-strong);background:#fff;color:var(--text)}
.plans-hd button.primary,.plan-row button.primary,.rs-box button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.rs-box button:disabled{background:var(--line-strong);border-color:var(--line-strong);color:#fff;cursor:not-allowed}
.install-card{display:flex;align-items:center;gap:14px;margin:16px 0 0;padding:13px 16px;background:var(--accent-deep);border:1px solid var(--accent-line);border-radius:10px}
.install-card .ic-main{flex:1;min-width:0}
.install-card p{margin:0;font-size:13px;line-height:1.6;color:var(--text-mid)}
.install-card .ic-title{font-size:14px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:7px}
.install-card .ic-cam{width:22px;height:22px;flex:none;color:#2f353d}
.install-card .ic-hint{margin-top:4px;font-weight:700;color:var(--accent);display:flex;align-items:center;gap:6px}
.install-card .ic-hint[hidden]{display:none}
.install-card .ic-hint svg{width:20px;height:20px;flex:none}
.install-card .ic-actions{display:flex;gap:8px;flex:none}
.install-card button,.install-nudge button{font:inherit;font-size:13px;font-weight:700;cursor:pointer;border-radius:9px;padding:8px 13px;border:1px solid var(--line-strong);background:#fff;color:var(--text)}
.install-nudge button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
/* 설치는 재방문자용 보조 — 채움 없이 파란 테두리 */
.install-card button.primary{background:#fff;border-color:var(--accent);color:var(--accent)}
.install-nudge{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:300;display:flex;align-items:center;gap:12px;padding:10px 12px 10px 16px;
  background:#16181d;color:#fff;border-radius:11px;box-shadow:0 8px 24px rgba(0,0,0,.25);font-size:13px;max-width:calc(100vw - 24px)}
.install-nudge .in-x{background:none;border:0;color:#aab;padding:4px 8px}
@media screen and (max-width:1100px){ .install-card{flex-direction:column;align-items:stretch} .install-card .ic-actions{justify-content:flex-end} }
@media print{ .install-card,.install-nudge,.maker-bar,.done-block{display:none !important} }
/* 아래 막대 안내 · 작성 완료 블록 */
.bottombar .cut-hint{order:-1;flex:1 1 100%;margin:0 2px 2px;font-size:12.5px;color:var(--text-mid);line-height:1.55}
.done-block{max-width:var(--w);margin:0 auto 120px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;box-shadow:0 1px 3px rgba(0,0,0,.06),0 10px 30px rgba(0,0,0,.06)}
.done-title{flex:1;font-size:16px;font-weight:800;letter-spacing:-.01em}
.done-actions{display:flex;gap:10px;flex-wrap:wrap}
.done-actions button{font:inherit;font-size:13px;font-weight:700;cursor:pointer;border-radius:9px;padding:9px 14px;border:1px solid var(--line-strong);background:#fff;color:var(--text)}
.done-actions button:hover{background:var(--surface)}
.done-actions button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.done-actions button.primary:hover{background:#1a52b6}
@media screen and (max-width:1100px){ .done-block{margin:0 10px 60px;padding:14px} .done-actions{flex:1 1 100%} .done-actions button{flex:1 1 calc(50% - 5px)} }
.plan-list{margin-top:14px;display:flex;flex-direction:column;gap:8px}
.plan-row{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.plan-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.plan-main b{font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plan-main span{font-size:12px;color:var(--text-mid)}
.plan-row .plan-del{color:var(--danger);border-color:#f0c0bc}
.plan-empty{font-size:13px;color:var(--text-dim);padding:10px 2px}
.savebar .lastsave{flex:1;min-width:0;font-size:11.5px;color:var(--text-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.savebar .lastsave.warn{color:var(--danger);font-weight:700}
.filesave{display:inline-flex;align-items:stretch;position:relative}
.filesave .btn-file-save{border-top-right-radius:0;border-bottom-right-radius:0}
.filemenu{position:relative}
.filemenu summary{list-style:none;cursor:pointer;height:100%;display:flex;align-items:center;padding:0 9px;font-size:12px;font-weight:700;
  border:1px solid var(--line-strong);border-left:0;border-radius:0 9px 9px 0;background:#fff;color:var(--text-mid)}
.filemenu summary::-webkit-details-marker{display:none}
.filemenu .menu{position:absolute;right:0;top:calc(100% + 5px);z-index:130;min-width:170px;background:#fff;border:1px solid var(--line-strong);border-radius:10px;padding:6px;box-shadow:0 6px 20px rgba(0,0,0,.12)}
.filemenu .menu button{width:100%;border:0;text-align:left;font-weight:600}
.recent-files{margin-top:14px;padding:10px 12px;border:1px dashed var(--line-strong);border-radius:10px}
.recent-hd{font-size:12px;font-weight:700;color:var(--text-mid);margin-bottom:6px}
.recent-list{display:flex;flex-wrap:wrap;gap:8px}
.recent-row{display:flex;flex-direction:column;align-items:flex-start;gap:2px;font:inherit;font-size:12.5px;cursor:pointer;padding:7px 11px;border:1px solid var(--line);border-radius:8px;background:#fff;text-align:left}
.recent-row span{font-size:11px;color:var(--text-dim)}
.ask-box{width:min(460px,100%)}
.ask-note{margin-top:8px;font-size:13px;color:var(--text-mid);line-height:1.6}
.updatebar{position:sticky;top:0;z-index:120;display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 12px;
           background:var(--accent-deep);border-bottom:1px solid var(--accent-line);font-size:13px;color:var(--accent);font-weight:700}
.updatebar button{padding:5px 12px;font-size:12px}
.rs-overlay{position:fixed;inset:0;z-index:240;background:rgba(22,24,29,.45);display:flex;align-items:center;justify-content:center;padding:20px}
.rs-box{background:#fff;border-radius:14px;padding:16px 18px;width:min(860px,100%);max-height:calc(100vh - 40px);display:flex;flex-direction:column;
        box-shadow:0 20px 60px rgba(0,0,0,.25)}
.rs-body{display:grid;grid-template-columns:280px 1fr;gap:14px;margin-top:12px;min-height:0;flex:1}
.rs-list{display:flex;flex-direction:column;gap:6px;overflow:auto;max-height:60vh}
.rs-box .rs-row{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:8px 10px;border-radius:8px;font-weight:600}
.rs-box .rs-row span{font-size:11.5px;font-weight:500;color:var(--text-mid)}
.rs-box .rs-row.on{border-color:var(--accent);background:var(--accent-deep)}
.rs-preview{overflow:auto;max-height:60vh;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px}
.rs-hint{font-size:12.5px;color:var(--text-dim)}
.rs-actions{display:flex;align-items:center;gap:10px;margin-top:12px}
.rs-actions .grow{flex:1}
.rs-box .rs-delete{color:var(--danger);border-color:#f0c0bc}
@media screen and (max-width:1100px){
  .home{padding:12px 10px 40px}
  .plans{padding:16px 14px}
  .plan-row{flex-wrap:wrap}
  .plan-main{flex:1 1 100%}
  .rs-body{grid-template-columns:1fr}
  .savebar .lastsave{flex:1 1 auto}
}
@media print{
  .home,.updatebar,.rs-overlay{display:none !important}
}