/* ============ 字帖工坊 · 东方美学主题 ============ */
/* 配色：宣纸底、墨黑字、朱砂红、靛青、赭石 */
/* 不强制改字体，保留系统默认 */

:root{
  --paper:#f7f2e8;
  --paper-dark:#efe8d8;
  --ink:#2c2416;
  --ink-light:#5a4d3a;
  --cinnabar:#9a2a1a;
  --cinnabar-light:#b8403a;
  --indigo:#2c4a6e;
  --ochre:#a67c52;
  --gold:#c9a961;
  --line:#d4c5a9;
  --line-light:#e8dfc9;
}

/* 全局背景 */
body{
  background:var(--paper);
  background-image:
    radial-gradient(ellipse at 20% 30%, rgba(166,124,82,.04) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(154,42,26,.03) 0%, transparent 50%);
  color:var(--ink);
}

/* 顶部导航 */
.header{background:linear-gradient(180deg,#fdfaf3 0%,var(--paper) 100%);border-bottom:2px solid var(--cinnabar);box-shadow:0 2px 12px rgba(44,36,22,.08)}
.topnav{padding:12px 14px}
#sitelogo{color:var(--cinnabar)}
#sitelogo small{color:var(--ochre)}
.navmenu a{color:var(--ink-light);font-size:14px;letter-spacing:1px;position:relative;transition:color .2s}
.navmenu a:hover{color:var(--cinnabar)}
.navmenu a.on,.navmenu a.cur{color:var(--cinnabar)}
/* 已去掉当前栏目下方的指示短横线（各页 .on 标注不一致会出现“不跟随”）；仅保留橙色文字高亮 */
.navright .navlink{color:var(--cinnabar);font-size:13px}
#btnLang{background:var(--paper);border:1px solid var(--cinnabar);color:var(--cinnabar);border-radius:2px}
#btnLang:hover{background:var(--cinnabar);color:#fff}

/* Hero */
.hero{padding:28px 0 20px;position:relative}
.hero::before{
  content:"";position:absolute;top:10px;left:50%;transform:translateX(-50%);
  width:60px;height:3px;background:var(--cinnabar);opacity:.3;
}
.hero h1{font-size:26px;color:var(--ink);letter-spacing:4px;margin:14px 0 10px}
.hero p{font-size:15px;color:var(--ink-light);line-height:1.9}
.hero .ok{color:var(--cinnabar)}

/* 分类标题 */
.catbar{
  background:linear-gradient(90deg,var(--cinnabar) 0%,var(--cinnabar-light) 100%) !important;
  color:#fff !important;font-size:16px;letter-spacing:6px;padding:12px;
  position:relative;overflow:hidden;
}
.catbar::before{
  content:"❖";position:absolute;left:14px;top:50%;transform:translateY(-50%);
  color:rgba(255,255,255,.4);font-size:12px;
}
.catbar::after{
  content:"❖";position:absolute;right:14px;top:50%;transform:translateY(-50%);
  color:rgba(255,255,255,.4);font-size:12px;
}

/* 卡片 */
.listn .itme{background:#fdfaf3;border:1px solid var(--line-light);border-radius:4px;transition:all .3s}
.listn .itme:hover{border-color:var(--cinnabar);box-shadow:0 6px 20px rgba(154,42,26,.12);transform:translateY(-2px)}
.listn .itme a{color:var(--ink)}
.listn .itme span{font-size:14px;color:var(--ink);padding:10px 0;display:block;letter-spacing:1px}
.thumb{background:#fdfaf3;border-bottom:1px dashed var(--line-light)}

/* 按钮 */
.layui-btn{border-radius:2px;letter-spacing:2px}
.layui-btn-normal{background:var(--cinnabar)}
.layui-btn-normal:hover{background:var(--cinnabar-light)}
.layui-btn-primary{background:transparent;border:1px solid var(--cinnabar);color:var(--cinnabar)}
.layui-btn-primary:hover{background:var(--cinnabar);color:#fff;border-color:var(--cinnabar)}
#btnGen{background:var(--cinnabar) !important;border-color:var(--cinnabar) !important}
#btnGen:hover{background:var(--cinnabar-light) !important}
#btnPrint{background:var(--indigo) !important;border-color:var(--indigo) !important}
#btnPrint:hover{background:#3a5d8a !important}
#btnPdf{background:var(--ochre) !important;border-color:var(--ochre) !important}
#btnPdf:hover{background:#b88d62 !important}
#btnReset{background:transparent !important;border:1px solid var(--cinnabar) !important;color:var(--cinnabar) !important}
#btnReset:hover{background:var(--cinnabar) !important;color:#fff !important}

/* 设置面板 */
#parsbox{background:#fdfaf3;border-right:1px solid var(--line-light)}
.setblock{border-bottom:1px solid var(--line-light)}
.setblock h4{color:var(--cinnabar);font-size:14px;letter-spacing:2px;border-left:3px solid var(--cinnabar);padding-left:8px}
.topcon{background:var(--paper-dark);border-bottom:1px solid var(--line-light)}
.tlabel{color:var(--ink-light);font-size:13px}
.formitem>label{color:var(--ink-light);font-size:13px;min-width:72px}

/* 输入框 */
.layui-input,.layui-textarea{
  background:#fff;border:1px solid var(--line);border-radius:2px;color:var(--ink);
}
.layui-input:focus,.layui-textarea:focus{border-color:var(--cinnabar);box-shadow:0 0 0 2px rgba(154,42,26,.1)}

/* 单选/多选 */
.rr .rp{border:1px solid var(--line);background:#fff;border-radius:2px;transition:all .2s}
.rr .rp:hover{border-color:var(--ochre)}
.rr .rp.sel{border-color:var(--cinnabar);background:rgba(154,42,26,.05);color:var(--cinnabar)}

/* 预览区 */
#yulianbox{background:var(--paper-dark)}
#yulianbox .paper{background:#fffdf8;border:1px solid var(--line);box-shadow:0 4px 16px rgba(44,36,22,.1)}

/* 底部 */
.footer{background:linear-gradient(180deg,var(--paper) 0%,var(--paper-dark) 100%);border-top:2px solid var(--cinnabar)}
.foot{color:var(--ink-light)}
.foot a{color:var(--ink-light)}
.foot a:hover{color:var(--cinnabar)}

/* 滚动条 */
::-webkit-scrollbar-thumb{background:var(--ochre);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--cinnabar)}

/* 印章装饰 */
.seal{
  display:inline-block;background:var(--cinnabar);color:#fff;padding:2px 8px;
  font-size:12px;border-radius:2px;letter-spacing:2px;
  transform:rotate(-3deg);
}
