/* =============================================================
   卡密工具（qianxun 主题适配）
   颜色/圆角/阴影全部沿用 pc.css 的设计令牌
   ============================================================= */
/* ---- 兜底：部分主题没有全局 box-sizing，避免手机端横向溢出 ---- */
.ct-wrap,.ct-wrap *,.ct-wrap *::before,.ct-wrap *::after,
.ct-page,.ct-page *,.ct-page *::before,.ct-page *::after{box-sizing:border-box;}
.ct-wrap,.ct-page{max-width:100%;overflow-x:hidden;}
.ct-panel,.ct-box,.ct-io,.ct-opts{max-width:100%;}
.ct-box textarea{max-width:100%;}
.ct-box__hd{flex-wrap:wrap;}
.ct-box__meta{overflow:hidden;text-overflow:ellipsis;}

.ct-wrap{padding:26px 0 60px;}

/* ---- 标签栏 ---- */
.ct-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px;}
.ct-tab{
  appearance:none;border:1px solid var(--line-2);background:#fff;color:var(--text-light);
  border-radius:999px;padding:9px 18px;font-size:14px;cursor:pointer;
  transition:all .2s;white-space:nowrap;
}
.ct-tab:hover{border-color:var(--primary);color:var(--primary);}
.ct-tab.is-active{
  background:var(--grad);border-color:transparent;color:#fff;
  box-shadow:var(--shadow-primary);
}

/* ---- 面板 ---- */
.ct-panel{
  display:none;background:#fff;border:1px solid var(--line);border-radius:var(--radius-m);
  padding:22px 24px;box-shadow:var(--shadow-s);
}
.ct-panel.is-active{display:block;}
.ct-hint{
  margin:0 0 16px;font-size:13px;color:#7c8296;line-height:1.75;
  padding:10px 14px;background:var(--primary-soft);border-radius:var(--radius-s);
}
.ct-hint b{color:var(--primary);}

/* ---- 参数区 ---- */
.ct-opts{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:14px 18px;margin-bottom:18px;
}
.ct-field{display:flex;flex-direction:column;gap:7px;font-size:13px;color:var(--text-light);}
.ct-field > span{font-weight:600;color:#5a6079;}
.ct-field--sm{max-width:240px;}
.ct-field input[type="text"]{
  height:40px;border:1px solid var(--line-2);border-radius:var(--radius-s);
  padding:0 12px;font-size:13px;color:var(--text);background:#fff;transition:all .2s;
}
.ct-field input[type="text"]:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(51,102,255,.12);}
.ct-field input::placeholder{color:#b8bcc6;}

/* ---- 单选 / 复选 ---- */
.ct-checks{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;}
.ct-check{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--text-light);cursor:pointer;}
.ct-check input{width:15px;height:15px;accent-color:var(--primary);cursor:pointer;}

/* ---- 输入 / 结果双栏 ---- */
.ct-io{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.ct-box{border:1px solid var(--line-2);border-radius:var(--radius-s);overflow:hidden;background:#fff;}
.ct-box__hd{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 12px;background:#f8f9fc;border-bottom:1px solid var(--line);
}
.ct-box__hd h3{margin:0;font-size:13px;font-weight:600;color:#4a5068;}
.ct-box__act{display:flex;align-items:center;gap:8px;}
.ct-box__meta{font-size:12px;color:var(--muted);white-space:nowrap;}
.ct-mini{
  appearance:none;border:1px solid var(--line-2);background:#fff;color:var(--text-light);
  border-radius:6px;padding:3px 10px;font-size:12px;cursor:pointer;transition:all .18s;
}
.ct-mini:hover{border-color:var(--primary);color:var(--primary);}
.ct-box textarea{
  display:block;width:100%;height:230px;border:0;padding:12px 14px;resize:vertical;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace;
  font-size:13px;line-height:1.7;color:#2f3446;background:#fff;
}
.ct-box textarea::placeholder{color:#b8bcc6;font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;}

/* ---- 底部按钮 ---- */
.ct-foot{display:flex;align-items:center;gap:12px;margin-top:18px;flex-wrap:wrap;}
.ct-btn{
  appearance:none;border:1px solid var(--line-2);background:#fff;color:var(--text);
  border-radius:var(--radius-s);padding:11px 26px;font-size:14px;cursor:pointer;transition:all .2s;
}
.ct-btn:hover{border-color:var(--primary);color:var(--primary);}
.ct-btn--primary{
  background:var(--grad);border-color:transparent;color:#fff;
  box-shadow:var(--shadow-primary);min-width:132px;
}
.ct-btn--primary:hover{color:#fff;transform:translateY(-1px);box-shadow:0 8px 20px rgba(51,102,255,.3);}
.ct-foot__note{margin-left:auto;font-size:12px;color:var(--muted);}

/* ---- 轻提示 ---- */
.ct-toast{
  position:fixed;left:50%;bottom:56px;transform:translate(-50%,12px);
  background:rgba(13,17,41,.92);color:#fff;font-size:13px;padding:10px 20px;border-radius:999px;
  opacity:0;pointer-events:none;transition:all .22s;z-index:9999;max-width:86vw;
}
.ct-toast.is-show{opacity:1;transform:translate(-50%,0);}
.ct-toast.is-err{background:rgba(220,58,58,.95);}

/* ---- 移动端模板 ---- */
.ct-page{padding:14px 12px 28px;}
.ct-page .ct-hero{
  background:var(--grad);border-radius:var(--radius-m);padding:18px;color:#fff;margin-bottom:14px;
}
.ct-page .ct-hero h1{margin:0 0 6px;font-size:19px;}
.ct-page .ct-hero p{margin:0;font-size:12.5px;opacity:.92;line-height:1.65;}
.ct-page .ct-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;padding-bottom:6px;margin-bottom:14px;-webkit-overflow-scrolling:touch;}
.ct-page .ct-tab{padding:7px 14px;font-size:13px;flex:0 0 auto;}
.ct-page .ct-panel{padding:14px;border-radius:var(--radius-m);}
.ct-page .ct-hint{font-size:12.5px;padding:9px 11px;margin-bottom:14px;}
.ct-page .ct-opts{grid-template-columns:1fr;gap:12px;}
.ct-page .ct-io{grid-template-columns:1fr;gap:12px;}
.ct-page .ct-box textarea{height:150px;font-size:13px;}
.ct-page .ct-foot{gap:10px;}
.ct-page .ct-btn{flex:1;padding:11px 0;text-align:center;}
.ct-page .ct-foot__note{display:none;}

/* 平板 */
@media (max-width:991px){
  .ct-io{grid-template-columns:1fr;}
  .ct-box textarea{height:180px;}
}