/* Invoice Assistant demo */
.principle{display:flex;align-items:center;gap:12px;background:rgba(29,158,117,.12);border:1px solid rgba(43,199,149,.35);border-radius:12px;padding:12px 16px;margin:0 0 14px;font-size:16px}
.principle svg{width:24px;height:24px;stroke:#2BC795;fill:none;stroke-width:2;flex:none}
.inbox-grid{display:grid;grid-template-columns:250px minmax(0,1fr);gap:14px;margin-top:14px;align-items:start}
.mail-list{display:flex;flex-direction:column;gap:8px}
.mail{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:5px;padding:12px;min-height:44px;border-radius:12px;border:1px solid #223041;background:#131A23;color:#E6EDF3}
.mail.active{border-color:#2BC795;background:#16222d}
.mail-top{display:flex;justify-content:space-between;gap:8px;font-size:14px}
.mail-top span{color:#8a98a8;font-size:13px}
.mail-sub{font-size:13px;color:#a9b6c4;line-height:1.3}
.mail-detail{padding:16px}
.mail-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.mail-head h2{margin:0 0 4px;font-size:18px}
.mail-head .sub{color:#8a98a8;font-size:13px}
.attach{background:#1b2633;border-radius:8px;padding:6px 10px;font-size:13px;white-space:nowrap}
.mail-body{margin:12px 0;color:#c4cfda;font-size:14px;line-height:1.5}
.work{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
.paper{background:#f7f5ef;color:#1d232b;border-radius:6px;padding:16px;font-size:12px;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.p-head{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;margin-bottom:10px}
.p-co{font-weight:700;font-size:14px}.p-co small{display:block;font-weight:400;color:#667;font-size:10px}
.p-title{font-weight:800;letter-spacing:.08em;color:#456;font-size:15px}
.p-meta{display:flex;gap:20px;margin-bottom:8px}.p-meta div{display:flex;flex-direction:column;color:#667;font-size:10px}.p-meta b{color:#1d232b;font-size:12px}
.p-to{display:flex;flex-direction:column;color:#667;font-size:10px;margin-bottom:8px}.p-to b{color:#1d232b;font-size:12px}.p-to span{color:#1d232b;font-size:12px}
.paper table{width:100%;border-collapse:collapse;margin:6px 0}
.paper th{text-align:left;border-bottom:1px solid #bbb;font-size:10px;color:#667;padding:3px 2px}
.paper td{padding:4px 2px;border-bottom:1px solid #e3e0d6;vertical-align:top}
.paper .n{text-align:right;white-space:nowrap}
.p-tot{margin-left:auto;width:60%;display:flex;flex-direction:column;gap:3px}
.p-tot div{display:flex;justify-content:space-between}.p-tot .grand{font-weight:800;font-size:14px;border-top:1px solid #1d232b;padding-top:3px}
.p-foot{margin-top:10px;color:#667;font-size:10px}
.p-body ul{margin:8px 0;padding-left:18px}.p-body .muted{color:#778}
.fld{transition:background .3s,box-shadow .3s;border-radius:3px}
.fld.hl{background:rgba(43,199,149,.28);box-shadow:0 0 0 2px rgba(43,199,149,.28)}
.fld.bad{background:rgba(234,106,87,.3);box-shadow:0 0 0 2px rgba(234,106,87,.35)}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.step{display:flex;gap:10px;align-items:flex-start}
.step-i{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14px;background:#222d3a;color:#8a98a8}
.step-t{font-weight:600;font-size:14px;padding-top:3px}
.step-d{font-size:13px;color:#b5c1ce;line-height:1.45;margin-top:2px}
.step-d code,.result code,.dl code{font-size:12px;word-break:break-word;color:#9fd8c3}
.step.pend .step-t,.step.skip .step-t{color:#718096;font-weight:500}
.step.ok .step-i{background:#1D9E75;color:#fff}
.step.warn .step-i{background:#E5A93D;color:#1b1500}
.step.ask .step-i{background:#EA6A57;color:#fff}
.step.stop .step-i{background:#6AA6EC;color:#06121f}
.step.run .step-i{background:#222d3a}
.spin{width:14px;height:14px;border:2px solid #2BC795;border-right-color:transparent;border-radius:50%;animation:sp .7s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.sig{margin-top:6px;background:rgba(106,166,236,.14);border-left:3px solid #6AA6EC;padding:6px 10px;border-radius:6px}
.pipe-foot{margin-top:14px}
.btn.big{min-height:52px;font-size:17px;padding:0 20px}
.btn,.chip,.mail{min-height:44px}
.btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;vertical-align:-3px;margin-right:4px}
.btn-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.result{margin-top:14px;border-radius:12px;padding:14px;border:1px solid #223041;background:#101820}
.result.green{border-color:rgba(43,199,149,.5)}.result.amber{border-color:rgba(229,169,61,.55)}.result.red{border-color:rgba(234,106,87,.55)}.result.gray{border-color:#34414f}
.result h3{margin:0}.result p{margin:6px 0;font-size:13px;color:#b5c1ce}
.result-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.notes{margin:6px 0 0;padding-left:18px;font-size:13px;color:#b5c1ce;line-height:1.5}
.box.ask{margin:8px 0}
.box.ask p{margin:6px 0}
tr[data-act]{cursor:pointer}
.tree{padding:16px}
.tf-n{display:flex;align-items:center;gap:8px;min-height:36px;font-size:15px}
.tf-n svg{width:20px;height:20px;stroke:#E5A93D;fill:none;stroke-width:1.8;flex:none}
.tf-c{margin-left:18px;padding-left:14px;border-left:1px solid #2a3846}
.tf.root>.tf-n{font-weight:700;font-size:17px}
.tfile{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:8px;min-height:44px;padding:0 10px;border-radius:8px;font-size:14px;color:#cfd9e3}
.tfile:hover{background:#1b2633}
.tfile svg{width:18px;height:18px;stroke:#6AA6EC;fill:none;stroke-width:1.8;flex:none}
.flow{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px;margin:8px 0 22px}
.flow-box{flex:1 1 140px;min-width:140px;background:#131A23;border:1px solid #223041;border-radius:14px;padding:16px}
.flow-box b{display:block;font-size:20px;margin:6px 0}
.flow-box p{margin:0;font-size:16px;color:#b5c1ce;line-height:1.4}
.flow-n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#1D9E75;color:#fff;font-weight:700}
.arr{align-self:center;font-size:26px;color:#2BC795}
.principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pr{padding:18px}.pr h3{margin:0 0 8px;font-size:22px;color:#2BC795}.pr p{margin:0;font-size:17px;line-height:1.45;color:#cfd9e3}
.draft .d-row{display:flex;gap:12px;padding:8px 0;border-bottom:1px solid #223041;font-size:14px}
.draft .d-row span{width:90px;color:#8a98a8;flex:none}
.d-body{white-space:pre-wrap;font:inherit;font-size:14px;line-height:1.5;margin:12px 0;color:#d6dfe8}
@media (max-width:1000px){
  .inbox-grid{grid-template-columns:1fr}
  .mail-list{flex-direction:row;overflow-x:auto;padding-bottom:4px}
  .mail{min-width:210px;flex:none}
}
@media (max-width:760px){
  .work{grid-template-columns:1fr}
  .principles{grid-template-columns:1fr}
  .arr{display:none}
}
.paper table,.paper tbody,.paper thead,.paper tr{background:transparent}
.paper td,.paper th,.paper div,.paper span,.paper b{color:#1d232b}
.paper th,.paper .p-meta div,.paper .p-to,.paper .p-co small,.paper .p-foot{color:#667}
.paper .p-title{color:#456}
.paper td{border-bottom:1px solid #e3e0d6}
.paper th{border-bottom:1px solid #bbb}
.paper .p-meta div b,.paper .p-to b,.paper .p-to span{color:#1d232b}
.flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.flow .arr{display:none}
@media (max-width:560px){.flow{grid-template-columns:1fr}}