:root{--ink:#1F2A37;--soft:#6B7280;--line:#E3E7EC;--red:#C0392B;--bg:#F6F7F9;--card:#FFF;--accent:#2F5D8A}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif}
.top{padding:26px 24px 8px;max-width:1600px;margin:0 auto}
.top h1{margin:0;font-size:23px;font-weight:700}
.top h1 span{font-size:14px;font-weight:400;color:var(--soft);margin-left:12px}
.sub{margin:8px 0 0;color:var(--soft);font-size:13px}
.wrap{max-width:1600px;margin:0 auto;padding:10px 24px 24px;display:grid;gap:20px;grid-template-columns:minmax(330px,420px) 1fr;align-items:start}
@media (max-width:1050px){.wrap{grid-template-columns:1fr}}
.panel{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}
.lbl{display:flex;align-items:center;font-size:13px;font-weight:600;margin-bottom:8px}
.hint{font-weight:400;color:var(--soft);margin-left:8px;font-size:12px}
.zoomlabel{margin-left:auto;font-weight:400;font-size:12px;color:var(--soft)}
textarea{width:100%;height:290px;padding:12px;border:1px solid var(--line);border-radius:8px;resize:vertical;font-size:15px;line-height:1.9;font-family:"Songti SC",serif;color:var(--ink)}
textarea:focus,select:focus,input:focus{outline:2px solid #B7CBDF;border-color:#9FB6CC}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.opts label{display:flex;flex-direction:column;font-size:12px;color:var(--soft);gap:4px}
.opts label:nth-child(3){grid-column:1/-1}
.opts label.check{flex-direction:row;align-items:center;grid-column:1/-1;gap:6px;color:var(--ink);font-size:13px}
.opts input,.opts select{padding:6px 8px;border:1px solid var(--line);border-radius:6px;font-size:13px;color:var(--ink);background:#fff}
.actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px}
button{padding:8px 14px;border:1px solid var(--line);background:#fff;border-radius:8px;font-size:13px;cursor:pointer;color:var(--ink)}
button:hover{background:#F2F5F8}
button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
button.primary:hover{background:#28547C}
button:disabled{opacity:.6;cursor:default}
.count{font-size:12px;color:var(--soft);margin-left:auto}
.save-row{display:flex;gap:8px;margin-top:12px}
.save-row input{flex:1 1 auto;min-width:0;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13px;color:var(--ink);background:#fff}
.savemsg{margin:8px 0 0;font-size:12px;color:#2F7D4F}
.saved{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.saved-head{font-size:12px;font-weight:600;margin-bottom:6px}
.saved-list{display:flex;flex-direction:column;gap:4px;max-height:190px;overflow:auto}
.saved-item{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;font-size:13px;cursor:pointer;background:#fff}
.saved-item:hover{background:#F2F5F8}
.saved-item.active{border-color:#9FB6CC;background:#F3F7FB}
.saved-item .sname{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.saved-item .smeta{font-size:11px;color:var(--soft);white-space:nowrap}
.saved-item .sdel{border:0;background:none;color:#B0B6BE;font-size:14px;line-height:1;padding:2px 4px;cursor:pointer}
.saved-item .sdel:hover{color:#C0392B}
.saved-empty{font-size:12px;color:var(--soft)}
.warn{margin:10px 0 0;padding:8px 10px;background:#FDF3F1;border:1px solid #F0CFC9;border-radius:6px;color:#9B2C1F;font-size:12px;line-height:1.6}
.preview{padding:4px 2px;overflow:auto}
.sheets{display:flex;flex-direction:column;align-items:center;gap:18px;transform-origin:top center}
.empty{color:var(--soft);font-size:13px;padding:24px 0}

/* ---- A4 纸张 ---- */
.sheet{width:21cm;height:29.7cm;background:#fff;box-shadow:0 2px 16px rgba(16,24,40,.14);
  padding:1.4cm 1.6cm 1.2cm;display:flex;flex-direction:column;
  font-family:"Songti SC","STSong","SimSun",serif;color:#1F2A37;line-height:1.35}
.s-head{flex:0 0 auto}
.s-title{font-size:18pt;font-weight:700;letter-spacing:.01em}
.s-title span{font-size:11.5pt;font-weight:400;color:#6B7280;margin-left:.5em}
.s-meta{font-size:9.5pt;color:#6B7280;margin-top:3pt}
.s-rule{border-bottom:.75pt solid #2F3A46;margin:7pt 0 8pt}
.s-legend{font-size:9pt;color:#6B7280}
.s-legend b{color:#C0392B;font-weight:600}
.s-read{font-size:9pt;color:#6B7280;margin-top:2pt}
.s-body{flex:1 1 auto;display:flex;flex-direction:column;justify-content:flex-start;padding:8pt 0 6pt}
.srow{display:flex;align-items:center;min-height:2.5cm}
.cellnum{width:.8cm;flex:0 0 .8cm;text-align:center;font-size:8.5pt;color:#9A9A9A;font-family:"Times New Roman",serif}
.gap{flex:0 0 auto}
.col{display:flex;flex-direction:column;align-items:center}
.syl{font-family:"Times New Roman",serif;white-space:nowrap;line-height:1.15;margin-bottom:2pt}
.syl .hot{color:#C0392B}
img.box{display:block;margin:0 -.005cm}
.s-foot{flex:0 0 auto;font-size:9pt;color:#6B7280}

/* ---- 答案页：左右两栏，每栏「拼音 + 词语」 ---- */
.acols{display:flex;gap:1.2cm;padding-top:4pt}
.acol{flex:1 1 0;min-width:0}
.arow{display:flex;align-items:center;min-height:.95cm;padding:1pt 0;border-bottom:.5pt solid #D6DAE0}
.anum{width:.7cm;flex:0 0 .7cm;text-align:center;font-size:8.5pt;color:#9A9A9A;font-family:"Times New Roman",serif}
.apy{width:3.2cm;flex:0 0 3.2cm;font-family:"Times New Roman",serif;white-space:normal;word-break:break-word;line-height:1.25}
.apy .hot{color:#C0392B}
.awd{flex:1 1 auto;font-size:11pt;white-space:normal;word-break:break-word;line-height:1.25}

.foot{max-width:1600px;margin:0 auto;padding:0 24px 36px;color:var(--soft);font-size:12px;line-height:1.8}
.foot p{margin:2px 0}

@media print{
  @page{size:A4 portrait;margin:0}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  html,body{background:#fff}
  .top,.panel:not(.preview-panel),.foot{display:none!important}
  .wrap{display:block;padding:0;margin:0;max-width:none}
  .preview-panel{border:0;padding:0;background:none;border-radius:0}
  .preview-panel .lbl{display:none}
  .preview{padding:0;overflow:visible}
  .sheets{gap:0;zoom:1!important}
  .sheet{box-shadow:none;page-break-after:always;break-after:page}
  .sheet:last-child{page-break-after:auto;break-after:auto}
}
/* ---- 模式切换 ---- */
.tabs{display:flex;gap:6px;margin-bottom:14px;background:#F1F4F8;padding:4px;border-radius:10px}
.tab{flex:1 1 0;border:0;background:transparent;padding:8px 6px;border-radius:8px;font-size:13px;color:var(--soft);cursor:pointer}
.tab.active{background:#fff;color:var(--ink);font-weight:600;box-shadow:0 1px 3px rgba(16,24,40,.10)}
/* ---- 英语纸 ---- */
.sec-title{font-size:11.5pt;font-weight:700;color:#2F5D8A;margin:10pt 0 4pt}
.sec-title:first-child{margin-top:0}
.en-grid{display:grid;gap:.6cm .6cm;align-items:start}
.en-cell{display:flex;align-items:center}
.en-num{width:.7cm;flex:0 0 .7cm;text-align:center;font-size:8.5pt;color:#9A9A9A;font-family:"Times New Roman",serif}
.en-stack{flex:1 1 auto;min-width:0}
.en-zh{font-family:"Songti SC","STSong","SimSun",serif;line-height:1.3;margin-bottom:1pt}
img.en-write{display:block;width:100%;object-fit:fill}
img.en-write.enwrite-sent{height:1.05cm}
.en-sent{display:flex;align-items:center;margin-bottom:6pt}
.saved-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.backup-btns{margin-left:auto;display:flex;gap:6px}
.backup-btns button{padding:4px 8px;font-size:12px}
.saved-note{margin:8px 0 0;font-size:11.5px;line-height:1.6;color:var(--soft)}
.sync-row{display:flex;gap:6px;margin:8px 0}
.sync-row input{flex:1 1 auto;min-width:0;padding:6px 8px;border:1px solid var(--line);border-radius:8px;font-size:12px;font-family:ui-monospace,Menlo,monospace;color:var(--ink);background:#F8FAFC}
.sync-row button{padding:6px 10px;font-size:12px}
.sync .actions{margin-top:6px}
.sync .actions button{font-size:12px;padding:6px 10px}
.sync-view{margin:8px 0 0;padding:8px 10px;border:1px solid var(--line);border-left:3px solid #9FB6CC;border-radius:6px;background:#F8FAFC;font-size:12px;line-height:1.7;color:var(--ink)}
.sync-view .svinfo{word-break:break-word}
.sync-view .dim{color:var(--soft)}
.cloud-list{margin:8px 0 0}
.cloud-list .dim{color:var(--soft);font-size:12px;margin:4px 0}
.cloud-sec{margin-bottom:8px}
.cloud-sec-title{font-size:12px;font-weight:600;color:var(--soft);margin:4px 0}
.cloud-item{display:flex;align-items:center;gap:8px;padding:5px 8px;border:1px solid var(--line);border-radius:8px;margin-bottom:4px;background:#fff;font-size:13px}
.cloud-item .ci-name{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cloud-item .ci-meta{font-size:11px;color:var(--soft);white-space:nowrap}
.cloud-item .ci-btns{display:flex;gap:4px}
.cloud-item .ci-btns button{padding:3px 8px;font-size:12px}
.cloud-item .ci-del{color:#B0453A}
.cloud-item .ci-del:hover{background:#FDF3F1}
.sync .actions button.danger{color:#B0453A;border-color:#EBCFC9}
.sync .actions button.danger:hover{background:#FDF3F1}
/* ---- 折叠区块 + 工具行 ---- */
.sec{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.sec > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;padding:2px 0}
.sec > summary::-webkit-details-marker{display:none}
.sec > summary::before{content:"▸";color:var(--soft);font-size:11px;transition:transform .12s}
.sec[open] > summary::before{content:"▾"}
.sec-body{padding:8px 0 0}
.tool-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0}
.btn{padding:5px 10px;font-size:12.5px;line-height:1.5;border:1px solid var(--line);background:#fff;border-radius:7px;color:var(--ink);cursor:pointer;white-space:nowrap}
.btn:hover{background:#F4F6F9}
.btn-pri{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.btn-pri:hover{background:#28547C}
.btn.danger{color:#B0453A;border-color:#EBCFC9}
.btn.danger:hover{background:#FDF3F1}
.more{position:relative}
.more > summary.btn{display:inline-block}
.more[open] > summary.btn{background:#F4F6F9}
.menu{position:absolute;right:0;top:calc(100% + 4px);display:none;flex-direction:column;min-width:170px;background:#fff;border:1px solid var(--line);border-radius:9px;box-shadow:0 8px 22px rgba(16,24,40,.12);padding:5px;z-index:20}
.more[open] .menu{display:flex}
.menu button{border:0;background:none;text-align:left;padding:7px 9px;border-radius:6px;font-size:12.5px;color:var(--ink);cursor:pointer;white-space:nowrap}
.menu button:hover{background:#F2F5F8}
.menu button.danger{color:#B0453A}
.cloud-item .ci-btns button{padding:4px 9px;font-size:12px;white-space:nowrap;border:1px solid var(--line);border-radius:6px;background:#fff;cursor:pointer}
.cloud-item .ci-btns button:hover{background:#F4F6F9}
.cloud-item .ci-del{color:#B0453A;border-color:#EBCFC9!important}
/* 左栏跟随滚动，避免滚动时左下角出现大片空背景 */
@media (min-width:1051px){
  .wrap > .panel:first-child{
    position:sticky;
    top:14px;
    min-height:calc(100vh - 28px);
    max-height:calc(100vh - 28px);
    overflow:auto;
  }
}
