.office-slide-app{--office-slide-backdrop:var(--text, #111827);--office-slide-paper:var(--bg-card,#fff);position:relative;display:flex;flex-direction:column;width:100%;box-sizing:border-box;
  font-family:inherit;color:var(--text,#333);background:var(--bg-card,#fff);
  border:1px solid var(--border,#e5e7eb);border-radius:var(--radius,10px);overflow:hidden}
.office-slide-app *,.office-slide-app *::before,.office-slide-app *::after{box-sizing:border-box}
.office-slide-app button,.office-slide-app select,.office-slide-app input,.office-slide-app textarea{font-family:inherit;font-size:13px;color:var(--text,#333)}

.office-slide-rtabs{display:flex;flex-wrap:wrap;gap:2px;padding:6px 8px 0;
  background:var(--bg-btn,#f3f4f6);border-bottom:1px solid var(--border,#e5e7eb)}
.office-slide-tab-btn{padding:6px 14px;border:1px solid transparent;border-bottom:none;
  border-radius:var(--radius-sm,6px) var(--radius-sm,6px) 0 0;background:transparent;
  color:var(--text-secondary,#6b7280);cursor:pointer}
.office-slide-tab-btn:hover{background:var(--bg-btn-hover,#e5e7eb)}
.office-slide-tab-btn.office-slide-on{background:var(--bg-card,#fff);border-color:var(--border,#e5e7eb);
  color:var(--primary,#2563eb);font-weight:600}

.office-slide-ribbon{padding:8px;border-bottom:1px solid var(--border,#e5e7eb);background:var(--bg-card,#fff)}
.office-slide-pane{display:none;flex-wrap:wrap;gap:8px 12px;align-items:flex-start}
.office-slide-pane.office-slide-on{display:flex}
.office-slide-grp{display:flex;flex-direction:column;gap:5px;padding:2px 10px 4px;min-width:0;
  min-height:88px;
  border-right:1px solid var(--border,#e5e7eb)}
.office-slide-grp:last-child{border-right:none}
.office-slide-glbl{font-size:11px;color:var(--text-secondary,#6b7280);white-space:nowrap}
.office-slide-row{display:flex;flex-wrap:nowrap;gap:6px;align-items:center;height:30px}
.office-slide-row-w{max-width:520px}
.office-slide-btn{padding:4px 6px;min-width:32px;min-height:30px;border:1px solid var(--border,#e5e7eb);border-radius:var(--radius-sm,6px);
  background:var(--bg-btn,#f3f4f6);cursor:pointer;white-space:nowrap}
.office-slide-btn:hover{background:var(--bg-btn-hover,#e5e7eb)}
.office-slide-btn.office-slide-acc{background:var(--primary,#2563eb);border-color:var(--primary,#2563eb);color:var(--bg-card,#fff)}
.office-slide-btn.office-slide-acc:hover{background:var(--primary-hover,#1d4ed8)}
.office-slide-btn.office-slide-on{background:var(--primary,#2563eb);border-color:var(--primary,#2563eb);color:var(--bg-card,#fff)}
.office-slide-btn-s{padding:4px 6px;min-width:30px;min-height:30px;font-size:12px}

/* ---- ribbon icons + hover tooltip ---- */
.office-slide-ic{width:16px;height:16px;flex:0 0 16px;vertical-align:-3px;margin-right:0;opacity:.9}
.office-slide-btn{display:inline-flex;align-items:center;justify-content:center}
.office-slide-btn[data-tip]{position:relative}
.office-slide-btn[data-tip]::after{content:attr(data-tip);position:absolute;top:calc(100% + 5px);left:50%;
  transform:translateX(-50%);background:var(--text,#333);color:var(--bg-card,#fff);
  font-size:12px;font-weight:400;line-height:1.4;letter-spacing:0;padding:4px 8px;
  border-radius:var(--radius-sm,6px);white-space:nowrap;pointer-events:none;
  opacity:0;visibility:hidden;transition:opacity .12s ease}
.office-slide-btn[data-tip]:hover::after{opacity:1;visibility:visible}

.office-slide-ico{min-width:32px;min-height:30px;padding:4px 6px;border:1px solid var(--border,#e5e7eb);
  border-radius:var(--radius-sm,6px);background:var(--bg-btn,#f3f4f6);cursor:pointer}
.office-slide-ico:hover{background:var(--bg-btn-hover,#e5e7eb)}
.office-slide-ico.office-slide-on{background:var(--primary,#2563eb);color:var(--bg-card,#fff)}
.office-slide-sel{padding:5px 6px;border:1px solid var(--border,#e5e7eb);border-radius:var(--radius-sm,6px);
  background:var(--bg-input,#fff);max-width:160px;height:30px}
#office-slide-ff{max-width:112px}
.office-slide-sel-n{max-width:78px}
.office-slide-inp{padding:5px 8px;border:1px solid var(--border,#e5e7eb);border-radius:var(--radius-sm,6px);
  background:var(--bg-input,#fff);min-width:0}
.office-slide-inp-n{width:64px}
.office-slide-cl{display:inline-flex;align-items:center;gap:2px;padding:3px 6px;height:30px;max-height:30px;
  border:1px solid var(--border,#e5e7eb);border-radius:var(--radius-sm,6px);background:var(--bg-btn,#f3f4f6);cursor:pointer}
.office-slide-cl input{width:22px;height:18px;padding:0;border:none;background:none;cursor:pointer}
.office-slide-chk{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--text-secondary,#6b7280);cursor:pointer}
.office-slide-lbl{font-size:12px;color:var(--text-secondary,#6b7280);white-space:nowrap}
.office-slide-kv{font-size:12px;color:var(--text-secondary,#6b7280);gap:12px}

.office-slide-themes{display:flex;gap:6px;flex-wrap:wrap}
.office-slide-thm{width:34px;height:24px;border:1px solid var(--border,#e5e7eb);border-radius:var(--radius-sm,6px);
  cursor:pointer;overflow:hidden;display:flex}
.office-slide-thm.office-slide-on{border-color:var(--primary,#2563eb);border-width:2px}
.office-slide-thm i{flex:1;display:block}
.office-slide-trs{display:flex;gap:6px;flex-wrap:wrap}
.office-slide-tr{padding:5px 8px;min-width:30px;border:1px solid var(--border,#e5e7eb);border-radius:var(--radius-sm,6px);
  background:var(--bg-btn,#f3f4f6);cursor:pointer;font-size:12px;white-space:nowrap;
  display:inline-flex;align-items:center;justify-content:center}
.office-slide-tr:hover{background:var(--bg-btn-hover,#e5e7eb)}
.office-slide-tr.office-slide-on{background:var(--primary,#2563eb);border-color:var(--primary,#2563eb);color:var(--bg-card,#fff)}

.office-slide-body{display:flex;min-height:420px;flex:1;min-width:0}
.office-slide-side{width:150px;flex:0 0 150px;border-right:1px solid var(--border,#e5e7eb);
  background:var(--bg-btn,#f3f4f6);display:flex;flex-direction:column;min-width:0}
.office-slide-side-hd{padding:8px 10px;font-size:12px;font-weight:600;color:var(--text-secondary,#6b7280);
  border-bottom:1px solid var(--border,#e5e7eb)}
.office-slide-thumbs{flex:1;overflow:auto;padding:8px;display:flex;flex-direction:column;gap:8px}
.office-slide-th{position:relative;border:2px solid transparent;border-radius:var(--radius-sm,6px);
  background:var(--bg-card,#fff);cursor:pointer;padding:0;overflow:hidden}
.office-slide-th.office-slide-on{border-color:var(--primary,#2563eb)}
.office-slide-th canvas{display:block;width:100%;height:auto}
.office-slide-th b{position:absolute;left:2px;top:2px;font-size:10px;font-weight:600;
  background:var(--bg-card,#fff);color:var(--text-secondary,#6b7280);
  border-radius:var(--radius-sm,6px);padding:0 3px}
.office-slide-th.office-slide-hidden{opacity:.45}

.office-slide-main{flex:1;min-width:0;display:flex;flex-direction:column}
.office-slide-stage{flex:1;overflow:auto;padding:16px;background:var(--bg-btn,#f3f4f6);
  display:flex;align-items:flex-start;justify-content:center;min-height:0}
.office-slide-stage-in{transform-origin:top center}
.office-slide-slide{position:relative;background:var(--bg-card,#fff);overflow:hidden;
  box-shadow:0 1px 6px rgba(0,0,0,.18);outline:1px solid var(--border,#e5e7eb)}
.office-slide-slide.office-slide-grid{background-image:linear-gradient(var(--border,#e5e7eb) 1px,transparent 1px),
  linear-gradient(90deg,var(--border,#e5e7eb) 1px,transparent 1px)}
.office-slide-els{position:absolute;inset:0}
.office-slide-el{position:absolute;cursor:move}
.office-slide-el.office-slide-sel{outline:2px solid var(--primary,#2563eb);outline-offset:0}
.office-slide-el-txt{width:100%;height:100%;overflow:hidden;white-space:pre-wrap;word-break:break-word;outline:none}
.office-slide-el-svg{width:100%;height:100%;display:block}
.office-slide-el-img{width:100%;height:100%;display:block}
.office-slide-el-tbl{width:100%;height:100%;border-collapse:collapse;table-layout:fixed}
.office-slide-el-tbl td{border:1px solid var(--border,#e5e7eb);padding:4px 6px;
  font-size:14px;background:var(--bg-card,#fff);overflow:hidden;word-break:break-word}
.office-slide-selbox{position:absolute;display:none;pointer-events:none;
  border:1px dashed var(--primary,#2563eb)}
.office-slide-hnd{position:absolute;width:9px;height:9px;background:var(--bg-card,#fff);
  border:1px solid var(--primary,#2563eb);pointer-events:auto}
.office-slide-notesbar{display:flex;align-items:center;gap:8px;padding:6px 10px;
  border-top:1px solid var(--border,#e5e7eb);background:var(--bg-card,#fff)}
.office-slide-noteslb{font-size:12px;color:var(--text-secondary,#6b7280);white-space:nowrap}
.office-slide-notesin{flex:1;min-width:0;padding:5px 8px;border:1px solid var(--border,#e5e7eb);
  border-radius:var(--radius-sm,6px);background:var(--bg-input,#fff)}

.office-slide-outline{width:190px;flex:0 0 190px;border-left:1px solid var(--border,#e5e7eb);
  background:var(--bg-btn,#f3f4f6);display:none;flex-direction:column;min-width:0}
.office-slide-outline.office-slide-on{display:flex}
.office-slide-oltree{flex:1;overflow:auto;padding:8px}
.office-slide-olitem{padding:4px 6px;font-size:12px;color:var(--text,#333);cursor:pointer;
  border-radius:var(--radius-sm,6px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.office-slide-olitem:hover{background:var(--bg-btn-hover,#e5e7eb)}
.office-slide-olitem.office-slide-on{background:var(--primary,#2563eb);color:var(--bg-card,#fff)}

.office-slide-status{display:flex;gap:16px;padding:5px 10px;font-size:12px;
  color:var(--text-secondary,#6b7280);border-top:1px solid var(--border,#e5e7eb);
  background:var(--bg-btn,#f3f4f6)}

.office-slide-modal{position:absolute;inset:0}
.office-slide-modal[hidden]{display:none}
.office-slide-mask{position:absolute;inset:0;background:rgba(0,0,0,.35)}
.office-slide-dlg{position:absolute;left:50%;top:14%;transform:translateX(-50%);
  width:min(440px,92%);background:var(--bg-card,#fff);color:var(--text,#333);
  border:1px solid var(--border,#e5e7eb);border-radius:var(--radius,10px);
  box-shadow:0 6px 24px rgba(0,0,0,.2);display:flex;flex-direction:column}
.office-slide-dlg-hd{padding:10px 14px;font-weight:600;border-bottom:1px solid var(--border,#e5e7eb)}
.office-slide-dlg-bd{padding:12px 14px;display:flex;flex-direction:column;gap:10px;max-height:52vh;overflow:auto}
.office-slide-dlg-ft{padding:10px 14px;display:flex;gap:8px;justify-content:flex-end;
  border-top:1px solid var(--border,#e5e7eb)}
.office-slide-fld{display:flex;flex-direction:column;gap:4px}
.office-slide-fld>span{font-size:12px;color:var(--text-secondary,#6b7280)}
.office-slide-fld input,.office-slide-fld textarea,.office-slide-fld select{padding:6px 8px;border:1px solid var(--border,#e5e7eb);
  border-radius:var(--radius-sm,6px);background:var(--bg-input,#fff);width:100%}
.office-slide-fld textarea{min-height:110px;resize:vertical;font-family:inherit}
.office-slide-dlg-note{font-size:12px;color:var(--text-secondary,#6b7280);line-height:1.6}

.office-slide-show{position:absolute;inset:0;background:var(--office-slide-backdrop,#111827);display:flex;flex-direction:column}
.office-slide-show[hidden]{display:none}
.office-slide-show-stage{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:12px}
.office-slide-show-stage>div{background:var(--bg-input,#fff);box-shadow:0 2px 20px rgba(0,0,0,.5)}
.office-slide-show-bar{display:flex;gap:8px;align-items:center;justify-content:center;padding:8px;
  background:rgba(0,0,0,.55)}
.office-slide-show-bar span{color:var(--bg-card,#fff);font-size:12px}
.office-slide-show-notes{max-height:120px;overflow:auto;padding:8px 12px;background:var(--bg-input,#fff);color:var(--text,#333);font-size:13px}
.office-slide-show-stage.office-slide-black>div{visibility:hidden}
.office-slide-show-stage.office-slide-black{background:var(--office-slide-backdrop,#111827)}
.office-slide-show-stage.office-slide-white{background:var(--bg-card,#fff)}
.office-slide-show-stage.office-slide-white>div{visibility:hidden}

.office-slide-print{display:none}

@media (max-width:900px){
  .office-slide-body{flex-direction:column}
  .office-slide-side{width:100%;flex:0 0 auto;flex-direction:row;overflow:auto;
    border-right:none;border-bottom:1px solid var(--border,#e5e7eb)}
  .office-slide-side-hd{display:none}
  .office-slide-thumbs{flex-direction:row}
  .office-slide-th{width:110px;flex:0 0 110px}
  .office-slide-outline{width:100%;flex:0 0 auto;border-left:none;border-top:1px solid var(--border,#e5e7eb)}
}
@media (max-width:640px){
  .office-slide-grp{border-right:none;border-bottom:1px solid var(--border,#e5e7eb);width:100%}
  .office-slide-row-w{max-width:100%}
  .office-slide-sel{max-width:100%}
}
@media print{
  .office-slide-rtabs,.office-slide-ribbon,.office-slide-side,.office-slide-outline,.office-slide-status,.office-slide-notesbar,.office-slide-modal,.office-slide-show{display:none !important}
  .office-slide-app{border:none;border-radius:0}
  .office-slide-body,.office-slide-main,.office-slide-stage{display:block;overflow:visible;padding:0;background:var(--bg-card,#fff)}
  .office-slide-print{display:block}
  .office-slide-pg{page-break-after:always;break-after:page;padding:6px}
  .office-slide-pg:last-child{page-break-after:auto;break-after:auto}
  .office-slide-pg img{width:100%;height:auto;display:block}
  .office-slide-pgcap{font-size:11px;color:var(--text-secondary,#6b7280);text-align:center;padding:2px 0}
  .office-slide-pgnote{font-size:11px;color:var(--text-secondary,#6b7280);white-space:pre-wrap;border:1px solid var(--border,#e5e7eb);padding:6px;margin-top:4px}
}

/* watermark layer */
.office-slide-wm {
    position: absolute; left: 0; top: 0; right: 0; bottom: 0;
    pointer-events: none; background-repeat: repeat; background-position: center;
}
.office-slide-wm[hidden] { display: none !important; }

/* right-click context menu */
.office-slide-ctx { position: absolute; min-width: 172px; max-width: 260px; padding: 4px;
    background: var(--bg-card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius-sm,6px);
    box-shadow: 0 4px 14px rgba(0,0,0,.16); }
.office-slide-ctx[hidden] { display: none; }
.office-slide-ctxi { display: block; width: 100%; text-align: left; padding: 6px 10px;
    font-family: inherit; font-size: 13px; line-height: 1.4; color: var(--text,#333);
    background: transparent; border: none; border-radius: var(--radius-sm,6px); cursor: pointer; }
.office-slide-ctxi:hover { background: var(--bg-btn-hover,#e5e7eb); }
.office-slide-ctxsep { height: 1px; margin: 4px 6px; background: var(--border,#e5e7eb); }

/* unified ribbon control box */
.office-slide-ribbon button { min-height: 30px; min-width: 32px; }