/* FreePDF – Clean Minimal Design System
   FBM-informed, DW dark theme, ad-friendly layout */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+KR:wght@300;400;500;600;700&display=swap');

*{margin:0;padding:0;box-sizing:border-box;font-family:'Inter','Noto Sans KR',-apple-system,sans-serif}
.hidden{display:none!important}

/* ── Theme Variables ── */
:root,[data-theme="dark"]{
  --bg:#0c0c12;--bg2:#14141c;--bg3:#1c1c28;--bg4:#242432;
  --text:#eeeef5;--text2:#9898ac;--text3:#58586e;
  --border:rgba(255,255,255,.06);--border2:rgba(255,255,255,.10);
  --accent-blue:#6ba1f8;--accent-green:#34d399;--accent-amber:#fbbf24;--accent-pink:#f472b6;--accent-purple:#a78bfa;--accent-red:#f87171;
  --card-bg:rgba(255,255,255,.025);--card-hover:rgba(255,255,255,.05);
  --input-bg:rgba(255,255,255,.04);--input-border:rgba(255,255,255,.1);--input-focus:rgba(107,161,248,.3);
  --glow-blue:rgba(107,161,248,.06);--glow-green:rgba(52,211,153,.06);--glow-amber:rgba(251,191,36,.06);--glow-pink:rgba(244,114,182,.06);--glow-purple:rgba(167,139,250,.06)
}
[data-theme="light"]{
  --bg:#f5f6f8;--bg2:#ffffff;--bg3:#eef0f3;--bg4:#e3e5ea;
  --text:#111827;--text2:#6b7280;--text3:#9ca3af;
  --border:rgba(0,0,0,.06);--border2:rgba(0,0,0,.10);
  --accent-blue:#2563eb;--accent-green:#059669;--accent-amber:#d97706;--accent-pink:#db2777;--accent-purple:#7c3aed;--accent-red:#dc2626;
  --card-bg:#ffffff;--card-hover:#ffffff;
  --input-bg:#ffffff;--input-border:rgba(0,0,0,.12);--input-focus:rgba(37,99,235,.3);
  --glow-blue:rgba(37,99,235,.04);--glow-green:rgba(5,150,105,.04);--glow-amber:rgba(217,119,6,.04);--glow-pink:rgba(219,39,119,.04);--glow-purple:rgba(124,58,237,.04)
}
body{background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}

/* ── Header ── */
.sp-header{background:var(--bg2);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50;backdrop-filter:blur(16px)}
.sp-header-inner{max-width:100%;margin:0 auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between}
.sp-logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.sp-logo-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex-shrink:0;background:linear-gradient(135deg,var(--accent-pink),#e05084);box-shadow:0 2px 12px rgba(244,114,182,.18)}
.sp-logo-icon i{font-size:16px;color:#fff}
.sp-logo-text{font-size:16px;font-weight:700;color:var(--text);letter-spacing:-.02em}
.sp-logo-sub{font-size:10px;color:var(--text3);font-weight:500}
.sp-back{font-size:12px;color:var(--text3);text-decoration:none;padding:6px 12px;border-radius:8px;transition:all .2s;display:flex;align-items:center;gap:6px}
.sp-back:hover{color:var(--text);background:var(--card-bg)}
.sp-theme{width:32px;height:32px;border-radius:8px;border:1px solid var(--border);background:var(--card-bg);color:var(--text3);cursor:pointer;display:grid;place-items:center;font-size:13px;transition:all .2s;flex-shrink:0}
.sp-theme:hover{border-color:var(--accent-purple);color:var(--accent-purple)}
.sp-nav-links{display:flex;align-items:center;gap:2px}
.sp-nav-link{font-size:12px;color:var(--text3);text-decoration:none;padding:7px 14px;border-radius:8px;transition:all .2s;font-weight:500}
.sp-nav-link:hover{color:var(--text);background:var(--card-bg)}
.sp-divider{width:1px;height:24px;background:var(--border)}

/* ── Cards ── */
.sp-card{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:28px;margin-bottom:20px;transition:all .3s}
.sp-card:hover{border-color:var(--border2)}
.sp-card-title{font-size:16px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px;margin-bottom:20px}

/* ── Buttons ── */
.sp-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 24px;border-radius:12px;font-size:13px;font-weight:600;cursor:pointer;border:none;transition:all .25s}
.sp-btn:disabled{opacity:.4;cursor:not-allowed}
.sp-btn-primary{background:linear-gradient(135deg,var(--accent-blue),#5b8def);color:#fff;box-shadow:0 2px 12px rgba(107,161,248,.18)}
.sp-btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 20px rgba(107,161,248,.28)}
.sp-btn-pink{background:linear-gradient(135deg,var(--accent-pink),#e05084);color:#fff;box-shadow:0 2px 12px rgba(244,114,182,.18)}
.sp-btn-pink:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 20px rgba(244,114,182,.28)}
.sp-btn-green{background:linear-gradient(135deg,var(--accent-green),#2acd91);color:#fff;box-shadow:0 2px 12px rgba(52,211,153,.18)}
.sp-btn-green:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 20px rgba(52,211,153,.28)}
.sp-btn-amber{background:linear-gradient(135deg,var(--accent-amber),#f59e0b);color:#000;box-shadow:0 2px 12px rgba(251,191,36,.18)}
.sp-btn-outline{background:transparent;border:1px solid var(--border);color:var(--text2)}
.sp-btn-outline:hover{border-color:var(--border2);background:var(--card-bg);color:var(--text)}

/* ── Inputs ── */
.sp-input{width:100%;padding:12px 16px;background:var(--input-bg);border:1px solid var(--input-border);border-radius:12px;color:var(--text);font-size:14px;outline:none;transition:all .2s}
.sp-input:focus{border-color:var(--accent-blue);box-shadow:0 0 0 3px var(--input-focus)}
.sp-input::placeholder{color:var(--text3)}

/* ── Drop Zone (Clean pink accent) ── */
.sp-dropzone{border:2px dashed var(--border2);border-radius:20px;padding:48px 24px;text-align:center;cursor:pointer;transition:all .3s;background:var(--card-bg);position:relative;overflow:hidden}
.sp-dropzone::before{content:'';position:absolute;inset:0;background:radial-gradient(500px circle at var(--mx,50%) var(--my,50%),rgba(244,114,182,.03),transparent 50%);opacity:0;transition:opacity .4s;pointer-events:none}
.sp-dropzone:hover::before,.sp-dropzone.dragover::before{opacity:1}
.sp-dropzone:hover{border-color:var(--accent-pink);box-shadow:0 4px 24px rgba(244,114,182,.06)}
.sp-dropzone.dragover{border-color:var(--accent-pink);background:rgba(244,114,182,.02)}
.sp-dropzone-icon{width:72px;height:72px;border-radius:18px;background:linear-gradient(135deg,rgba(244,114,182,.08),rgba(244,114,182,.02));display:grid;place-items:center;margin:0 auto 18px}
.sp-dropzone-icon i{font-size:28px;color:var(--accent-pink)}
.upload-choose{display:inline-flex;align-items:center;gap:8px;padding:10px 24px;border-radius:12px;background:linear-gradient(135deg,var(--accent-pink),#e05084);color:#fff;font-size:13px;font-weight:600;border:none;cursor:pointer;transition:all .25s;box-shadow:0 2px 12px rgba(244,114,182,.18)}
.upload-choose:hover{transform:translateY(-1px);box-shadow:0 4px 20px rgba(244,114,182,.28)}
.upload-features{display:flex;gap:12px;justify-content:center;margin-top:24px;flex-wrap:wrap}
.upload-feat{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text3);padding:6px 14px;border-radius:10px;background:var(--card-bg);border:1px solid var(--border);transition:all .2s}
.upload-feat:hover{border-color:var(--border2);color:var(--text2)}
.upload-feat i{font-size:13px;color:var(--accent-pink)}

/* ── Tool Cards (Home page) ── */
.tool-card{background:var(--bg2);border:1px solid var(--border);border-radius:14px;padding:18px 14px;text-decoration:none;text-align:center;cursor:pointer;transition:all .25s;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:96px}
.tool-card:hover{border-color:var(--border2);background:var(--card-hover);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.15)}
.tool-card-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;transition:transform .2s}
.tool-card:hover .tool-card-icon{transform:scale(1.1)}
.tool-card-label{font-size:12px;font-weight:600;color:var(--text2);line-height:1.3;transition:color .2s}
.tool-card:hover .tool-card-label{color:var(--text)}

/* ── Section Glow Colors ── */
.sp-section{border-radius:14px;padding:20px;margin-bottom:12px}
.sp-section-blue{background:var(--glow-blue);border:1px solid rgba(107,161,248,.08)}
.sp-section-green{background:var(--glow-green);border:1px solid rgba(52,211,153,.08)}
.sp-section-amber{background:var(--glow-amber);border:1px solid rgba(251,191,36,.08)}
.sp-section-pink{background:var(--glow-pink);border:1px solid rgba(244,114,182,.08)}
.sp-section-purple{background:var(--glow-purple);border:1px solid rgba(167,139,250,.08)}
.sp-section-title{font-size:13px;font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:16px}

/* ── Editor Toolbar ── */
.pdf-toolbar{background:var(--bg2);border-bottom:1px solid var(--border);padding:0 16px;height:48px;display:flex;align-items:center}
.pdf-toolbar-inner{display:flex;align-items:center;gap:6px;width:100%;overflow-x:auto}
.pdf-toolbar-inner::-webkit-scrollbar{height:0}
.tb-group{display:flex;align-items:center;gap:1px;padding:2px 3px;border-radius:8px;background:var(--bg3)}
.tb{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;font-size:11px;font-weight:600;border-radius:6px;border:none;background:transparent;color:var(--text2);cursor:pointer;transition:all .15s;white-space:nowrap}
.tb:hover:not(:disabled){background:var(--card-hover);color:var(--text)}
.tb:disabled{opacity:.3;cursor:not-allowed}
.tb.active{background:rgba(107,161,248,.15);color:var(--accent-blue)}
.tb.danger:hover{color:var(--accent-red);background:rgba(248,113,113,.1)}
.tb.download-btn{background:linear-gradient(135deg,var(--accent-pink),#e05084);color:#fff;padding:7px 18px;border-radius:8px;font-size:12px;box-shadow:0 2px 8px rgba(244,114,182,.15)}
.tb.download-btn:hover{opacity:.9;box-shadow:0 4px 16px rgba(244,114,182,.25)}
.tb-sep{width:1px;height:22px;background:var(--border);margin:0 2px;flex-shrink:0}
.tb[data-tip]:hover::after{content:attr(data-tip);position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);background:var(--bg);color:var(--text);font-size:10px;font-weight:500;padding:4px 10px;border-radius:6px;white-space:nowrap;box-shadow:0 4px 16px rgba(0,0,0,.4);border:1px solid var(--border);z-index:50;pointer-events:none}

/* ── Sidebar Thumbnails ── */
.pdf-sidebar{width:200px;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0}
.pdf-sidebar-head{padding:10px 12px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.pdf-sidebar-head span{font-size:12px;font-weight:600;color:var(--text2);display:flex;align-items:center;gap:6px}
.pg-cnt{font-size:11px;color:var(--text3);background:var(--bg3);padding:2px 8px;border-radius:6px;font-weight:700}
.pdf-thumbs{flex:1;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:6px}
.pdf-thumbs::-webkit-scrollbar{width:4px}.pdf-thumbs::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}
.pg{position:relative;border-radius:8px;overflow:visible;border:2px solid var(--border);background:var(--bg3);cursor:pointer;transition:all .2s;user-select:none}
.pg:hover{border-color:rgba(255,255,255,.12)}
.pg.viewing{border-color:var(--accent-blue);box-shadow:0 0 0 1px rgba(107,161,248,.15)}
.pg .pg-canvas-wrap{overflow:hidden;border-radius:6px 6px 0 0}
.pg canvas{width:100%;display:block}
.pg-footer{display:flex;align-items:center;justify-content:center;padding:4px 8px}
.pg-num{font-size:10px;font-weight:700;color:var(--text3)}
.pg.viewing .pg-num{color:var(--accent-blue)}

/* ── Canvas Area ── */
.pdf-canvas-wrap{flex:1;overflow:auto;display:flex;justify-content:center;align-items:flex-start;padding:20px;background:var(--bg);position:relative}
.pdf-canvas-wrap::-webkit-scrollbar{width:6px;height:6px}.pdf-canvas-wrap::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}
#pdf-canvas{box-shadow:0 4px 32px rgba(0,0,0,.35);border-radius:4px}

/* ── Bottom Bar ── */
.pdf-bar{background:var(--bg2);border-top:1px solid var(--border);padding:6px 16px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:var(--text2);flex-shrink:0}
.pdf-bar button{background:none;border:none;color:var(--text3);cursor:pointer;transition:all .15s;font-size:13px;width:30px;height:30px;border-radius:8px;display:grid;place-items:center}
.pdf-bar button:hover{color:var(--accent-blue);background:var(--card-bg)}
.pdf-bar .bar-sep{width:1px;height:18px;background:var(--border)}
.zoom-slider{-webkit-appearance:none;width:80px;height:4px;background:var(--bg3);border-radius:2px;outline:none;cursor:pointer}
.zoom-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent-blue);cursor:pointer;border:2px solid var(--bg2)}

/* ── Text Annotations (DW-style inline editing) ── */
.text-annotation{position:absolute;cursor:move;border:1.5px dashed transparent;padding:2px 4px;min-width:20px;min-height:16px;line-height:1.3;border-radius:3px;transition:border-color .15s,background .15s;outline:none;font-family:'Inter','Noto Sans KR',sans-serif}
.text-annotation:hover{border-color:var(--accent-blue);background:rgba(107,161,248,.05)}
.text-annotation.editing{border-color:var(--accent-blue);background:rgba(107,161,248,.08);cursor:text;box-shadow:0 0 0 3px rgba(107,161,248,.1)}
.text-annotation.selected-ann{border-color:var(--accent-blue);background:rgba(107,161,248,.06)}
.text-float-bar{position:absolute;z-index:30;background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:5px 10px;display:flex;align-items:center;gap:6px;box-shadow:0 8px 32px rgba(0,0,0,.5);pointer-events:auto}
.text-float-bar .tf{padding:4px 7px;font-size:11px;border:none;background:none;color:var(--text2);cursor:pointer;border-radius:5px;transition:all .15s}
.text-float-bar .tf:hover{background:var(--card-bg);color:var(--text)}
.text-float-bar .tf.active{background:rgba(107,161,248,.12);color:var(--accent-blue)}
.text-float-bar input[type=number]{width:44px;background:var(--input-bg);border:1px solid var(--input-border);border-radius:6px;color:var(--text);font-size:11px;padding:4px 6px;text-align:center;outline:none}
.text-float-bar input[type=number]:focus{border-color:var(--accent-blue)}
.text-float-bar input[type=color]{width:24px;height:24px;border:2px solid var(--border);border-radius:6px;background:none;cursor:pointer;padding:0}
.text-float-bar .tf-sep{width:1px;height:18px;background:var(--border);margin:0 2px}

/* ── Image Annotations (DW-style with resize handles) ── */
.img-annotation{position:absolute;cursor:move;border:2px solid transparent;border-radius:3px;transition:border-color .15s;user-select:none;display:flex;align-items:center;justify-content:center;overflow:visible}
.img-annotation:hover{border-color:var(--accent-green)}
.img-annotation.selected-img{border-color:var(--accent-green);box-shadow:0 0 0 3px rgba(52,211,153,.15)}
.img-annotation img{width:100%;height:100%;object-fit:contain;pointer-events:none;display:block}
.img-resize-handle{position:absolute;width:10px;height:10px;background:var(--accent-green);border:2px solid var(--bg2);border-radius:50%;z-index:10;cursor:nwse-resize;display:none;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.img-annotation.selected-img .img-resize-handle{display:block}
.img-resize-handle.tl{top:-5px;left:-5px;cursor:nwse-resize}
.img-resize-handle.tr{top:-5px;right:-5px;cursor:nesw-resize}
.img-resize-handle.bl{bottom:-5px;left:-5px;cursor:nesw-resize}
.img-resize-handle.br{bottom:-5px;right:-5px;cursor:nwse-resize}
.img-float-bar{position:absolute;z-index:30;background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:5px 10px;display:flex;align-items:center;gap:6px;box-shadow:0 8px 32px rgba(0,0,0,.5);pointer-events:auto}
.img-float-bar .tf{padding:4px 7px;font-size:11px;border:none;background:none;color:var(--text2);cursor:pointer;border-radius:5px;transition:all .15s}
.img-float-bar .tf:hover{background:var(--card-bg);color:var(--text)}
.img-float-bar .tf-sep{width:1px;height:18px;background:var(--border);margin:0 2px}
.img-float-bar .img-size-info{font-size:10px;color:var(--text3);font-weight:500;padding:0 4px}

/* ── Thumbnail Checkbox Selection (DW-style) ── */
.pg-check-wrap{position:absolute;top:6px;left:6px;z-index:5}
.pg-check{width:20px;height:20px;border-radius:6px;border:2px solid rgba(255,255,255,.25);background:rgba(0,0,0,.35);backdrop-filter:blur(4px);display:grid;place-items:center;cursor:pointer;transition:all .2s;flex-shrink:0}
.pg-check:hover{border-color:var(--accent-blue);background:rgba(107,161,248,.15);transform:scale(1.1)}
.pg.sel .pg-check{background:var(--accent-blue);border-color:var(--accent-blue);box-shadow:0 2px 8px rgba(107,161,248,.3)}
.pg.sel .pg-check::after{content:'\f00c';font-family:'Font Awesome 6 Free';font-weight:900;font-size:9px;color:#fff}
.pg:hover .pg-check{border-color:rgba(255,255,255,.45);background:rgba(0,0,0,.5)}
.pg.sel:hover .pg-check{background:var(--accent-blue);border-color:var(--accent-blue)}
.pg.sel{border-color:var(--accent-blue);box-shadow:0 0 0 2px rgba(107,161,248,.2)}
.pg.sel .pg-canvas-wrap::after{content:'';position:absolute;inset:0;background:rgba(107,161,248,.08);pointer-events:none;border-radius:6px 6px 0 0}
.pg .pg-canvas-wrap{position:relative}
.drag-over-top{border-top:3px solid var(--accent-blue)!important}
.drag-over-bottom{border-bottom:3px solid var(--accent-blue)!important}

/* ── Toolbar extras ── */
.tb.active-img{background:rgba(52,211,153,.15);color:var(--accent-green)}
.tb-label{font-size:10px;color:var(--text3);font-weight:500;margin-right:4px;text-transform:uppercase;letter-spacing:.04em}
@keyframes ttFade{from{opacity:0;transform:translateX(-50%) translateY(-4px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}

/* ── Page Input in Bottom Bar ── */
.pdf-bar .page-input{width:36px;text-align:center;background:var(--input-bg);border:1px solid var(--input-border);border-radius:6px;color:var(--text);font-size:11px;font-weight:700;padding:4px 2px;outline:none}
.pdf-bar .page-input:focus{border-color:var(--accent-blue)}

/* ── Undo Badge (DW-style) ── */
.undo-badge{position:fixed;bottom:72px;right:20px;z-index:150;background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:6px 14px;font-size:11px;color:var(--text2);font-weight:600;display:flex;align-items:center;gap:6px;box-shadow:0 4px 16px rgba(0,0,0,.3);animation:toastIn .25s ease;pointer-events:none}
.undo-badge i{color:var(--accent-blue)}

/* ── Thumbnail Overlay ── */
.thumb-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden}

/* ── PDF Preview Container ── */
#pdfPreview{position:relative;display:inline-block;box-shadow:0 4px 32px rgba(0,0,0,.35);border-radius:4px;overflow:visible;transition:transform .1s}

/* ── Toast ── */
.toast-container{position:fixed;bottom:20px;right:20px;z-index:200;display:flex;flex-direction:column-reverse}
.toast-item{display:flex;align-items:center;gap:10px;background:var(--bg2);border:1px solid var(--border);color:var(--text);padding:12px 18px;border-radius:12px;font-size:13px;font-weight:500;box-shadow:0 8px 32px rgba(0,0,0,.4);margin-top:8px;animation:toastIn .35s cubic-bezier(.16,1,.3,1)}
@keyframes toastIn{from{transform:translateX(40px);opacity:0}to{transform:translateX(0);opacity:1}}
.toast-icon{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-size:12px;flex-shrink:0}
.toast-success .toast-icon{background:rgba(52,211,153,.12);color:var(--accent-green)}
.toast-error .toast-icon{background:rgba(248,113,113,.12);color:var(--accent-red)}
.toast-info .toast-icon{background:rgba(107,161,248,.12);color:var(--accent-blue)}

/* ── Modal ── */
.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center}
.modal-box{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:28px;max-width:440px;width:calc(100% - 32px);box-shadow:0 20px 60px rgba(0,0,0,.5);position:relative;z-index:101}

/* ── Loading ── */
.loading-spinner{width:40px;height:40px;border:3px solid var(--border);border-top:3px solid var(--accent-blue);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── Sections ── */
.section-title{font-size:13px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.06em;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.section-title i{font-size:12px}

/* ── FAQ ── */
.faq-item{background:var(--bg2);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:all .2s}
.faq-item:hover{border-color:var(--border2)}
.faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;padding:16px 20px;text-align:left;background:none;border:none;color:var(--text);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}
.faq-question:hover{background:var(--card-bg)}
.faq-answer{padding:0 20px 16px;color:var(--text2);font-size:13px;line-height:1.7}
.faq-icon{color:var(--text3);transition:transform .2s;font-size:12px}
.faq-icon.rotate-180{transform:rotate(180deg)}

/* ── Ad Slots (clean, labeled) ── */
.ad-slot{display:flex;align-items:center;justify-content:center;margin:0 auto;overflow:hidden;min-height:0}
.ad-slot-label{font-size:9px;color:var(--text3);text-align:center;margin-bottom:2px;text-transform:uppercase;letter-spacing:.05em;opacity:.6}
.ad-placeholder{background:var(--bg3);border:1px dashed var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--text3);font-size:11px;font-weight:500}

/* ── Footer ── */
.sp-footer{border-top:1px solid var(--border);padding:20px 0;text-align:center}
.sp-footer-text{font-size:11px;color:var(--text3);display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}

/* ── Steps ── */
.step-num{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:18px;font-weight:800;transition:all .3s}
.step-card{text-align:center;padding:20px 14px}
.step-card h3{font-size:15px;font-weight:700;color:var(--text);margin:12px 0 6px}
.step-card p{font-size:12px;color:var(--text3);line-height:1.6}

/* ── Trust Badges ── */
.trust-badge{background:var(--bg2);border:1px solid var(--border);border-radius:14px;padding:18px;text-align:center;transition:all .2s}
.trust-badge:hover{border-color:var(--border2);transform:translateY(-1px)}
.trust-badge-icon{font-size:22px;margin-bottom:6px}
.trust-badge-text{font-size:12px;color:var(--text3);font-weight:500}

/* ── Translation Promo (Paid add-on) ── */
.translate-promo{background:linear-gradient(135deg,var(--glow-purple),var(--glow-blue));border:1px solid rgba(167,139,250,.12);border-radius:16px;padding:28px;text-align:center;position:relative;overflow:hidden}
.translate-promo::before{content:'';position:absolute;top:-40%;right:-10%;width:200px;height:200px;background:radial-gradient(circle,rgba(167,139,250,.06),transparent 70%);pointer-events:none}
.translate-promo-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 14px;border-radius:20px;background:rgba(167,139,250,.12);border:1px solid rgba(167,139,250,.15);font-size:11px;font-weight:600;color:var(--accent-purple);margin-bottom:14px}
.translate-promo h3{font-size:18px;font-weight:700;color:var(--text);margin-bottom:8px}
.translate-promo p{font-size:13px;color:var(--text2);line-height:1.6;margin-bottom:16px}
.translate-promo-price{font-size:24px;font-weight:800;color:var(--accent-purple);margin-bottom:4px}
.translate-promo-sub{font-size:11px;color:var(--text3);margin-bottom:16px}
.translate-promo-features{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:18px}
.translate-promo-feat{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text2);padding:5px 12px;border-radius:8px;background:var(--card-bg);border:1px solid var(--border)}
.translate-promo-feat i{color:var(--accent-purple);font-size:11px}

/* ── Animations ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.sp-fade{animation:fadeUp .5s ease}
@keyframes slideIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

/* ── Scrollbar ── */
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:4px}
::-webkit-scrollbar-track{background:transparent}

/* ── Responsive ── */
@media(max-width:768px){
  .sp-header-inner{padding:10px 16px}
  .sp-nav-links .sp-nav-link{display:none}
  .pdf-sidebar{width:130px}
  .tool-grid-6{grid-template-columns:repeat(3,1fr)!important}
  .upload-features{gap:8px}
  .upload-feat{padding:4px 10px;font-size:11px}
  .tb span.tb-text{display:none}
  .translate-promo-features{flex-direction:column;align-items:center}
}
@media(max-width:480px){
  .tool-grid-6{grid-template-columns:repeat(2,1fr)!important}
  .pdf-sidebar{display:none}
}

/* ── Print ── */
@media print{.ad-slot,.ad-placeholder,nav,.sp-header{display:none!important}}

/* ── Selection ── */
::selection{background-color:rgba(244,114,182,.2)}