/* ====== 24 桌牌生成器 · 墨绿席位 + 米金 ====== */
.tsk.dnp{
  --tsk-bg:#eef1ec;
  --tsk-bg-2:#e2e7e0;
  --tsk-card:#ffffff;
  --tsk-card-2:#f4f7f3;
  --tsk-ink:#17251f;
  --tsk-sub:#4f6158;
  --tsk-faint:#84938b;
  --tsk-line:#d7dfd7;
  --tsk-line-2:#e8ede7;
  --tsk-brand:#1c3b33;
  --tsk-brand-2:#2f5d4e;
  --tsk-brand-soft:#e5edea;
  --tsk-brand-ink:#1c3b33;
  --tsk-gold:#a28445;
  --tsk-gold-soft:#f2ebd9;
  --tsk-plate:#fbfaf4;
  background:
    radial-gradient(700px 330px at 94% -12%, rgba(28,59,51,.10), transparent 62%),
    radial-gradient(520px 240px at -8% 10%, rgba(162,132,69,.10), transparent 58%),
    var(--tsk-bg);
}
:root[data-theme="dark"] .tsk.dnp{
  --tsk-bg:#101512;
  --tsk-bg-2:#151b17;
  --tsk-card:#1b231e;
  --tsk-card-2:#202922;
  --tsk-ink:#e9eee9;
  --tsk-sub:#aebbb1;
  --tsk-faint:#7e8b82;
  --tsk-line:#2e3a32;
  --tsk-line-2:#263029;
  --tsk-brand:#8fc7b2;
  --tsk-brand-2:#b2dbcb;
  --tsk-brand-soft:rgba(143,199,178,.12);
  --tsk-brand-ink:#a5d3c1;
  --tsk-gold:#d3b471;
  --tsk-gold-soft:rgba(211,180,113,.12);
  --tsk-plate:#f4f2e9;
}

.dnp-hero{display:grid;grid-template-columns:minmax(0,1fr) 394px;gap:30px;padding:30px 0 24px;align-items:stretch;}
.dnp-hero-l{display:flex;flex-direction:column;}
.dnp-hero-l>.tsk-hs{flex:1 1 auto;}
.dnp-hero-l .tsk-h1 b{color:var(--tsk-brand-ink);border-bottom:4px solid var(--tsk-gold-soft);}
.dnp-hero-r{display:flex;}

/* 控制面板 */
.dnp-panel{width:100%;align-self:start;background:var(--tsk-card);border:1px solid var(--tsk-line);border-radius:13px;box-shadow:var(--tsk-shadow);overflow:hidden;}
.dnp-panel-hd{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:var(--tsk-brand);color:#eef4f0;}
.dnp-panel-hd b{font-size:13.5px;font-weight:800;letter-spacing:.03em;}
.dnp-panel-hd small{font-size:10.5px;opacity:.7;}
.dnp-panel-body{padding:12px 18px 16px;}
.dnp-panel .tsk-label{font-size:11.5px;}
.dnp-panel .tsk-label em{font-style:normal;color:var(--tsk-bad);}
.dnp-names{min-height:104px;font-size:12.5px;line-height:1.8;background:var(--tsk-card-2);}
.dnp-panel .tsk-input,.dnp-panel .tsk-select{font-size:12.5px;padding:7px 10px;border-radius:7px;background:var(--tsk-card-2);}
.dnp-select{width:100%;}
.dnp-err{display:none;margin-top:3px;font-size:10.5px;color:var(--tsk-bad);}
.dnp-err.show{display:block;}
.dnp-range{margin-top:12px;}
.dnp-range-hd{display:flex;justify-content:space-between;align-items:center;}
.dnp-range-hd b{font:800 13px/1 var(--tsk-num);color:var(--tsk-brand-ink);}
.dnp-range input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:4px;margin:12px 0 6px;border-radius:99px;background:linear-gradient(90deg,var(--tsk-brand),var(--tsk-gold));outline:none;}
.dnp-range input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--tsk-card);border:3px solid var(--tsk-brand);box-shadow:0 2px 6px rgba(0,0,0,.2);cursor:pointer;}
.dnp-range input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--tsk-card);border:3px solid var(--tsk-brand);cursor:pointer;}
.dnp-range-scale{display:flex;justify-content:space-between;font-size:10px;color:var(--tsk-faint);}
.dnp-row2{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:11px;}
.dnp-seg{width:100%;}
.dnp-seg button{flex:1 1 0;padding:6px 5px;font-size:11.5px;border-radius:6px;}
.dnp-check{display:flex;align-items:flex-start;gap:8px;margin-top:12px;font-size:11.5px;line-height:1.6;color:var(--tsk-sub);cursor:pointer;}
.dnp-check input{width:15px;height:15px;margin-top:2px;accent-color:var(--tsk-brand);}
.dnp-acts{display:flex;gap:8px;margin-top:14px;}
.dnp-acts .tsk-btn-main{flex:1 1 auto;background:var(--tsk-brand);color:#fff;border-color:var(--tsk-brand);border-radius:8px;}
.dnp-acts .tsk-btn{padding:9px 11px;font-size:12px;border-radius:8px;}
.dnp-note{margin-top:9px;font-size:10.5px;color:var(--tsk-faint);}

/* 预览 */
.dnp-stage{margin:4px 0 30px;background:var(--tsk-bg-2);border:1px solid var(--tsk-line);border-radius:14px;padding:18px 20px 20px;}
.dnp-stage-hd{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:14px;}
.dnp-stage-sub{margin-top:3px;font-size:12px;color:var(--tsk-faint);}
.dnp-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.dnp-tools .tsk-btn{background:var(--tsk-brand);color:#fff;border-color:var(--tsk-brand);border-radius:7px;}
.dnp-hint{font-size:10.5px;color:var(--tsk-faint);}
.dnp-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;align-items:start;}
.dnp-empty{grid-column:1/-1;padding:46px 0;text-align:center;font-size:12.5px;color:var(--tsk-faint);background:var(--tsk-card);border:1px dashed var(--tsk-line);border-radius:10px;}

/* A4 桌牌（屏幕预览） */
.dnp-page{position:relative;}
.dnp-page-tag{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.08em;color:var(--tsk-faint);margin-bottom:6px;}
.dnp-page-tag b{font-weight:700;color:var(--tsk-sub);}
.dnp-sheet{
  --dnp-size:96;
  width:100%;aspect-ratio:297/210;background:var(--tsk-plate);border:1px solid #d9d5c4;
  box-shadow:0 2px 5px rgba(23,37,31,.08),0 14px 34px rgba(23,37,31,.13);
  display:flex;flex-direction:column;overflow:hidden;position:relative;
}
.dnp-zone{position:absolute;left:0;right:0;height:50%;display:flex;align-items:center;justify-content:center;padding:7% 6%;}
.dnp-zone.back{top:0;transform:rotate(180deg);}
.dnp-zone.front{bottom:0;}
.dnp-sheet.is-single .dnp-zone.back{display:none;}
.dnp-sheet.is-single .dnp-zone.front{height:100%;}
.dnp-fold{position:absolute;left:4%;right:4%;top:50%;border-top:1px dashed rgba(162,132,69,.55);z-index:2;pointer-events:none;}
.dnp-fold::after{content:"对折线";position:absolute;right:0;top:-15px;font-size:8px;letter-spacing:.1em;color:rgba(162,132,69,.85);}
.dnp-plate{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5%;}
.dnp-sheet.bd-line .dnp-plate{border:1.2px solid var(--tsk-brand);}
.dnp-sheet.bd-double .dnp-plate{border:3px double var(--tsk-brand);}
.dnp-sheet.bd-none .dnp-plate{border:0;}
.dnp-name{font-family:var(--tsk-serif, "Songti SC","STSong","Noto Serif SC","SimSun",Georgia,serif);font-weight:800;font-size:calc(var(--dnp-size) * .30pt);line-height:1.05;letter-spacing:.05em;color:#17251f;text-align:center;max-width:92%;}
.dnp-role{font-family:var(--tsk-font);font-size:calc(var(--dnp-size) * .11pt);color:#5a6157;letter-spacing:.12em;}
.dnp-org{font-family:var(--tsk-font);font-size:calc(var(--dnp-size) * .095pt);color:#7d8478;letter-spacing:.06em;margin-top:1%;}
.dnp-sheet.is-v .dnp-name{writing-mode:vertical-rl;text-orientation:upright;letter-spacing:.12em;line-height:1.15;max-height:100%;max-width:none;}
.dnp-sheet .dnp-side{display:flex;flex-direction:column;align-items:center;gap:2.5%;min-width:0;}
.dnp-sheet.is-v .dnp-side{flex-direction:row;align-items:center;gap:3%;}
.dnp-sheet.is-v .dnp-plate{flex-direction:row;gap:4%;}

.dnp-fold-note{display:flex;gap:12px;align-items:flex-start;margin-top:16px;padding:13px 16px;background:var(--tsk-card);border:1px solid var(--tsk-line);border-radius:10px;}
.dnp-fold-ico{width:30px;height:30px;flex:0 0 30px;border-radius:50%;background:var(--tsk-gold-soft);color:var(--tsk-gold);font-size:15px;line-height:30px;text-align:center;}
.dnp-fold-note b{font-size:12.5px;font-weight:800;color:var(--tsk-ink);}
.dnp-fold-note p{margin-top:2px;font-size:11.5px;line-height:1.7;color:var(--tsk-sub);}

/* 尺寸表 */
.dnp-table-wrap{overflow-x:auto;border:1px solid var(--tsk-line);border-radius:10px;box-shadow:var(--tsk-shadow-sm);}
.dnp-table{width:100%;min-width:640px;border-collapse:collapse;background:var(--tsk-card);}
.dnp-table th,.dnp-table td{padding:11px 14px;font-size:12.5px;line-height:1.7;text-align:left;border-bottom:1px solid var(--tsk-line-2);}
.dnp-table thead th{background:var(--tsk-card-2);font-size:11px;font-weight:800;color:var(--tsk-brand-ink);letter-spacing:.05em;}
.dnp-table tbody tr:last-child td{border-bottom:0;}
.dnp-table tbody tr:hover td{background:var(--tsk-card-2);}
.dnp-strong{font-weight:800;color:var(--tsk-ink);}
.dnp-mono{font-family:var(--tsk-num);font-size:12px;color:var(--tsk-sub);}

/* 规则 */
.dnp-rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));gap:10px;}
.dnp-rule{display:grid;grid-template-columns:32px 1fr;gap:11px;background:var(--tsk-card);border:1px solid var(--tsk-line);border-radius:10px;padding:15px 16px;box-shadow:var(--tsk-shadow-sm);}
.dnp-rule>span{width:32px;height:32px;border-radius:6px;background:var(--tsk-brand-soft);color:var(--tsk-brand-ink);font:800 11.5px/32px var(--tsk-num);text-align:center;}
.dnp-rule b{font-size:12.5px;font-weight:800;color:var(--tsk-ink);}
.dnp-rule p{margin-top:3px;font-size:11.5px;line-height:1.75;color:var(--tsk-sub);}

/* 打印设置 */
.dnp-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;}
.dnp-steps article{background:var(--tsk-card);border:1px solid var(--tsk-line);border-radius:9px;padding:12px 14px;}
.dnp-steps b{display:block;font-size:10.5px;letter-spacing:.1em;color:var(--tsk-gold);text-transform:uppercase;}
.dnp-steps span{display:block;margin-top:4px;font-size:12px;line-height:1.65;color:var(--tsk-ink);}

@media (max-width:900px){
  .dnp-hero{grid-template-columns:1fr;gap:22px;}
  .dnp-preview{grid-template-columns:1fr;}
  .dnp-stage{padding:14px 14px 16px;}
}
@media (max-width:560px){
  .dnp-row2{grid-template-columns:1fr;}
  .dnp-acts{flex-wrap:wrap;}
  .dnp-acts .tsk-btn-main{flex:1 1 100%;}
}

/* 打印：真 A4 横向，一页一张 */
@media print{
  @page{size:A4 landscape;margin:0;}
  .dnp .tsk-crumb-bar,.dnp .dnp-hero,.dnp .dnp-stage-hd,.dnp .dnp-fold-note,
  .dnp .tsk-sec,.dnp .tskb,.dnp .tsk-foot{display:none !important;}
  .tsk.dnp{background:#fff !important;padding:0 !important;}
  .tsk.dnp .tsk-wrap{max-width:none;padding:0;margin:0;}
  .dnp-stage{border:0;background:#fff;padding:0;margin:0;border-radius:0;}
  .dnp-preview{display:block;}
  .dnp-page{margin:0;page-break-after:always;break-after:page;}
  .dnp-page:last-child{page-break-after:auto;break-after:auto;}
  .dnp-page-tag{display:none;}
  .dnp-sheet{
    width:297mm;height:210mm;aspect-ratio:auto;
    border:0;box-shadow:none;background:#fff;
    -webkit-print-color-adjust:exact;print-color-adjust:exact;
  }
  .dnp-name{font-size:calc(var(--dnp-size) * 1pt);}
  .dnp-role{font-size:calc(var(--dnp-size) * .30pt);}
  .dnp-org{font-size:calc(var(--dnp-size) * .26pt);}
  .dnp-plate{border-color:#17251f !important;}
}

/* ====== 细节层：面板交互 / 纸张质感 ====== */
.dnp-panel .tsk-input:hover,.dnp-panel .tsk-select:hover,.dnp-panel .dnp-names:hover{border-color:var(--tsk-brand-2);}
.dnp-panel .tsk-input.bad,.dnp-panel .tsk-textarea.bad{border-color:var(--tsk-bad);background:var(--tsk-bad-soft);}
.dnp-panel .tsk-input:focus-visible,.dnp-panel .tsk-textarea:focus-visible,.dnp-panel .tsk-select:focus-visible{outline:2px solid var(--tsk-brand);outline-offset:2px;}
.dnp-panel .tsk-label em{font-weight:700;}
.dnp-names{font-family:var(--tsk-num);}
.dnp-panel-hd b::before{content:"▦";margin-right:7px;font-size:13px;opacity:.75;}
.dnp-range input[type=range]:focus-visible{outline:2px solid var(--tsk-gold);outline-offset:5px;}
.dnp-range input[type=range]::-webkit-slider-thumb:hover{border-color:var(--tsk-gold);}
.dnp-check:hover{color:var(--tsk-ink);}
.dnp-check input:focus-visible{outline:2px solid var(--tsk-brand);outline-offset:2px;}
.dnp-acts .tsk-btn,.dnp-tools .tsk-btn{transition:background .15s,border-color .15s,color .15s,transform .12s,box-shadow .15s;}
.dnp-acts .tsk-btn:hover{border-color:var(--tsk-brand);color:var(--tsk-brand-ink);}
.dnp-acts .tsk-btn-main:hover{background:var(--tsk-brand-2);border-color:var(--tsk-brand-2);color:#fff;box-shadow:0 4px 12px rgba(28,59,51,.24);}
.dnp-tools .tsk-btn:hover{background:var(--tsk-brand-2);border-color:var(--tsk-brand-2);box-shadow:0 4px 12px rgba(28,59,51,.22);}
.dnp-acts .tsk-btn:active,.dnp-tools .tsk-btn:active{transform:translateY(1px);}
.dnp-acts .tsk-btn:focus-visible,.dnp-tools .tsk-btn:focus-visible{outline:2px solid var(--tsk-gold);outline-offset:2px;}

/* 桌牌预览质感 */
.dnp-page{transition:transform .16s;}
.dnp-page-tag b{letter-spacing:.04em;}
.dnp-sheet{transition:box-shadow .18s,transform .18s;border-radius:1px;}
.dnp-page:hover .dnp-sheet{box-shadow:0 3px 8px rgba(23,37,31,.1),0 22px 46px rgba(23,37,31,.18);}
.dnp-sheet::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.35),transparent 42%);opacity:.5;z-index:1;}
.dnp-name{text-wrap:balance;}
.dnp-role{letter-spacing:.16em;}
.dnp-org{opacity:.86;}
.dnp-sheet.is-v .dnp-role,.dnp-sheet.is-v .dnp-org{writing-mode:vertical-rl;}
.dnp-sheet.is-single .dnp-fold{display:none;}
.dnp-empty::before{content:"🖨";display:block;font-size:22px;margin-bottom:8px;opacity:.55;}
.dnp-fold-note{transition:border-color .15s;}
.dnp-fold-note:hover{border-color:var(--tsk-gold);}

/* 规则 / 表格 */
.dnp-table tbody tr:nth-child(even) td{background:rgba(0,0,0,.015);}
.dnp-rule{transition:border-color .15s,transform .15s;}
.dnp-rule:hover{border-color:var(--tsk-gold);transform:translateY(-1px);}
.dnp-rule>span{background:var(--tsk-gold-soft);color:var(--tsk-gold);}
.dnp-steps article{transition:border-color .15s;}
.dnp-steps article:hover{border-color:var(--tsk-brand-2);}
.dnp-steps b{padding-bottom:5px;border-bottom:1px solid var(--tsk-line-2);}

/* 深色微调 */
:root[data-theme="dark"] .dnp-empty::before{opacity:.4;}
:root[data-theme="dark"] .dnp-table tbody tr:nth-child(even) td{background:rgba(255,255,255,.02);}
:root[data-theme="dark"] .dnp-sheet::after{background:linear-gradient(115deg,rgba(255,255,255,.22),transparent 46%);}
:root[data-theme="dark"] .dnp-rule>span{background:rgba(211,180,113,.12);}

@media (max-width:1180px){
  .dnp-preview{grid-template-columns:repeat(auto-fill,minmax(262px,1fr));}
  .dnp-name{font-size:calc(var(--dnp-size) * .27pt);}
}
@media (max-width:760px){
  .dnp-panel-body{padding:10px 14px 14px;}
  .dnp-preview{gap:14px;}
  .dnp-stage{padding:12px 12px 14px;}
  .dnp-page-tag{font-size:9.5px;}
}
@media (max-width:480px){
  .dnp-panel-hd{padding:12px 14px;}
  .dnp-name{font-size:calc(var(--dnp-size) * .34pt);}
  .dnp-tools{width:100%;}
  .dnp-tools .tsk-btn{flex:1 1 auto;}
}

@media (prefers-reduced-motion:reduce){
  .dnp-page,.dnp-sheet,.dnp-acts .tsk-btn,.dnp-tools .tsk-btn,.dnp-rule,.dnp-fold-note{transition:none;}
  .dnp-rule:hover{transform:none;}
  .dnp-page:hover .dnp-sheet{box-shadow:0 2px 5px rgba(23,37,31,.08),0 14px 34px rgba(23,37,31,.13);}
}

@media print{
  .dnp-sheet::after{display:none;}
  .dnp-sheet{box-shadow:none;transition:none;}
  .dnp-page{transition:none;}
  .dnp-name{letter-spacing:.06em;}
  .dnp-fold{opacity:.45;}
  .dnp-page .dnp-sheet{page-break-inside:avoid;}
}