/* ─── Feishu Style for ZRXpdf ─── */
:root{
  --canvas:        #ffffff;
  --canvas-soft:   #fafbfc;
  --canvas-tile:   #f5f6f7;
  --canvas-deep:   #eef0f3;
  --blue:          #3370ff;
  --blue-hover:    #2a5fe6;
  --blue-press:    #1d4ed8;
  --blue-light:    #e8f0ff;
  --blue-tint:     #f0f5ff;
  --green:         #00ba88;
  --green-light:   #e6f9f2;
  --orange:        #ff6f39;
  --orange-light:  #fff0e8;
  --purple:        #7b5bff;
  --purple-light:  #efebff;
  --ink:           #1f2329;
  --ink-2:         #2b3038;
  --ink-body:      #51565e;
  --ink-mute:      #8a9099;
  --ink-soft:      #a8acb5;
  --hairline:      #dcdfe5;
  --hairline-soft: #ebedf0;
  --font: "Inter","PingFang SC","Source Han Sans CN","Noto Sans SC","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --r-sm:  6px;
  --r:     8px;
  --r-md:  12px;
  --r-lg:  16px;
  --shadow-sm: 0 1px 2px rgba(31,35,41,.05);
  --shadow:    0 2px 8px rgba(31,35,41,.06);
  --shadow-md: 0 4px 16px rgba(31,35,41,.08);
  --ease: cubic-bezier(.4,.0,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:var(--font);
  background:var(--canvas-soft);
  color:var(--ink);
  font-size:14px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
a{color:inherit;text-decoration:none}

/* Feishu-style Nav */
.feishu-nav{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--hairline-soft);
}
.feishu-nav-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:56px;max-width:1200px;margin:0 auto;padding:0 24px;
}
.feishu-brand{display:flex;align-items:center;gap:8px;font-weight:600;font-size:16px;letter-spacing:-.3px;color:var(--ink)}
.feishu-brand-mark{
  width:28px;height:28px;border-radius:6px;
  background:linear-gradient(135deg,var(--blue),var(--blue-press));
  display:grid;place-items:center;color:#fff;font-weight:700;font-size:14px;
  box-shadow:0 2px 6px rgba(51,112,255,.30);
}
.feishu-nav-links{display:flex;gap:4px}
.feishu-nav-links a{
  font-size:13px;color:var(--ink-mute);padding:6px 12px;
  border-radius:6px;font-weight:500;transition:all .15s var(--ease);
  text-decoration:none;
}
.feishu-nav-links a:hover{color:var(--blue);background:var(--blue-tint)}

/* Hero */
.hero{
  text-align:center;padding:48px 24px 28px;max-width:640px;margin:0 auto;
}
.hero h1{font-size:26px;font-weight:700;color:var(--ink);letter-spacing:-.4px;margin-bottom:8px}
.hero p{font-size:14px;color:var(--ink-mute)}

/* Filters */
.filters{
  display:flex;gap:6px;max-width:1200px;margin:0 auto;
  padding:0 24px 20px;flex-wrap:wrap;justify-content:center;
}
.filter-btn{
  padding:6px 16px;border:1px solid var(--hairline);border-radius:9999px;
  background:var(--canvas);color:var(--ink-mute);
  font-family:var(--font);font-size:12px;cursor:pointer;font-weight:500;
  transition:all .15s var(--ease);
}
.filter-btn:hover{border-color:var(--blue);color:var(--blue)}
.filter-btn.active{background:var(--blue);border-color:var(--blue);color:#fff}

/* Tool Grid */
.tool-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:12px;max-width:1200px;margin:0 auto;padding:0 24px 40px;
}
@media (max-width:480px){
  .tool-grid{grid-template-columns:repeat(2,1fr);gap:8px}
}
.tool-card{
  background:var(--canvas);border:1px solid var(--hairline-soft);
  border-radius:var(--r);padding:24px 12px;text-align:center;
  cursor:pointer;transition:all .15s var(--ease);
}
.tool-card:hover{border-color:var(--blue);box-shadow:var(--shadow);background:var(--blue-tint)}
.tool-card:active{transform:scale(.98)}
.tool-card .icon{font-size:28px;margin-bottom:8px;display:block}
.tool-card .name{font-size:13px;font-weight:600;color:var(--ink)}
.tool-card .desc{font-size:11px;color:var(--ink-mute);margin-top:2px}

/* Panel */
.panel-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(31,35,41,.5);z-index:1000;
  align-items:flex-start;justify-content:center;
  padding:40px 16px;overflow-y:auto;
}
.panel-overlay.open{display:flex}
.tool-panel{
  background:var(--canvas);border-radius:var(--r-lg);
  max-width:640px;width:100%;padding:28px 24px;
  position:relative;animation:slideUp .25s var(--ease);
  box-shadow:var(--shadow-md);
}
@keyframes slideUp{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:translateY(0)}
}
.panel-close{
  position:absolute;top:12px;right:16px;
  background:none;border:none;color:var(--ink-soft);
  font-size:24px;cursor:pointer;line-height:1;
}
.panel-close:hover{color:var(--ink)}
.panel-title{font-size:20px;font-weight:700;color:var(--ink);margin-bottom:4px}
.panel-desc{font-size:13px;color:var(--ink-mute);margin-bottom:20px}

/* Upload */
.upload-zone{
  border:2px dashed var(--hairline);border-radius:var(--r);
  padding:32px 20px;text-align:center;cursor:pointer;
  transition:all .2s;margin-bottom:12px;
}
.upload-zone:hover,.upload-zone.dragover{border-color:var(--blue);background:var(--blue-tint)}
.upload-zone .icon{font-size:32px;margin-bottom:6px;display:block}
.upload-zone .label{font-size:14px;color:var(--ink-body)}
.upload-zone .hint{font-size:12px;color:var(--ink-soft);margin-top:2px}

/* File List */
.file-list{margin:10px 0;display:flex;flex-direction:column;gap:6px}
.file-item{
  display:flex;align-items:center;justify-content:space-between;
  background:var(--canvas-tile);border:1px solid var(--hairline-soft);
  border-radius:var(--r-sm);padding:8px 12px;font-size:13px;
}
.file-item .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-item .size{color:var(--ink-mute);margin:0 12px;white-space:nowrap}
.file-item .remove{color:var(--ink-soft);cursor:pointer;background:none;border:none;font-size:18px}
.file-item .remove:hover{color:var(--danger)}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:10px 24px;border:1px solid transparent;border-radius:var(--r);
  font-family:var(--font);font-size:14px;font-weight:500;cursor:pointer;
  transition:all .15s var(--ease);
}
.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-primary:hover{background:var(--blue-hover);border-color:var(--blue-hover)}
.btn-primary:disabled{opacity:.5;cursor:not-allowed}
.btn-secondary{
  background:var(--canvas);color:var(--ink-body);
  border-color:var(--hairline);
}
.btn-secondary:hover{border-color:var(--blue);color:var(--blue)}

/* Options */
.options{margin:14px 0;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.option-group{display:flex;align-items:center;gap:6px;font-size:13px}
.option-group label{color:var(--ink-mute)}
.option-group input[type="text"],
.option-group input[type="number"],
.option-group input[type="password"],
.option-group select{
  padding:6px 10px;border:1px solid var(--hairline);border-radius:4px;
  background:var(--canvas);color:var(--ink);font-size:13px;outline:none;
  font-family:var(--font);
}
.option-group input:focus{border-color:var(--blue)}
.option-group input[type="checkbox"]{accent-color:var(--blue);width:16px;height:16px}

/* Progress */
.progress-bar{width:100%;height:6px;background:var(--hairline-soft);border-radius:3px;overflow:hidden;margin:12px 0;display:none}
.progress-bar .fill{height:100%;background:var(--blue);width:0%;transition:width .3s}
.progress-text{font-size:12px;color:var(--ink-soft);text-align:center;display:none}

/* Result */
.result-area{margin-top:14px;padding:14px;background:var(--green-light);border-radius:var(--r);display:none;text-align:center}
.result-area .msg{font-size:14px;color:var(--green);margin-bottom:4px}

/* Footer */
.footer{text-align:center;padding:24px;color:var(--ink-soft);font-size:12px;border-top:1px solid var(--hairline-soft)}