/* 门店检测工作台 —— 单店分析报告(A4 可打印) 独立样式表:屏幕上是弹层,打印/另存为 PDF 时只留报告正文。 下载成单文件 HTML 时本文件会被整段内联,所以这里不要引用外部资源。 */ .rp{ --rp-ink:#211a10; --rp-ink2:#5c5241; --rp-ink3:#93876f; --rp-line:#e8dcc0; --rp-line2:#f2e9d6; --rp-gold:#c8952c; --rp-gold-bg:#fbf4e2; --rp-brown:#a4761c; --rp-red:#b5563a; --rp-amber:#cd8a35; --rp-green:#5f8d72; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif; color:var(--rp-ink); font-size:12.5px; line-height:1.7; -webkit-font-smoothing:antialiased; } /* ================= 屏幕:弹层 ================= */ .rpwrap{position:fixed;inset:0;z-index:60;display:none;overflow:auto; background:rgba(38,29,14,.42);backdrop-filter:blur(3px);padding:32px 20px 48px} .rpwrap.on{display:block} .rpcard{width:min(880px,100%);margin:0 auto;background:#fff;border-radius:14px; box-shadow:0 24px 70px rgba(60,44,12,.28);overflow:hidden;animation:rpin .22s ease} @keyframes rpin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}} .rptoolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:10px; padding:12px 20px;background:#fdf8ee;border-bottom:1px solid var(--rp-line)} .rptoolbar .rpname{flex:1;min-width:0;font-size:13px;font-weight:600;color:var(--rp-ink); overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .rptoolbar .rpsub{font-size:11px;color:var(--rp-ink3);font-weight:400;margin-left:8px} .rpbtn{font-family:inherit;font-size:12px;padding:7px 14px;border-radius:8px;cursor:pointer; border:1px solid var(--rp-line);background:#fff;color:var(--rp-ink2);transition:.15s} .rpbtn:hover{border-color:var(--rp-gold);color:var(--rp-brown)} .rpbtn.primary{background:linear-gradient(135deg,#eab94e,#d29a29 48%,#b57e15);color:#fff; border-color:transparent;font-weight:600;box-shadow:0 3px 10px rgba(180,126,21,.26), inset 0 1px 0 rgba(255,255,255,.32)} .rpbtn.primary:hover{filter:brightness(1.04)} .rpbtn.x{width:32px;padding:7px 0;text-align:center;font-size:15px;line-height:1;color:var(--rp-ink3)} /* ================= 报告正文(屏幕 + 打印 + 下载共用) ================= */ .rpdoc{padding:28px 40px 32px;background:#fff} /* 报告头:显式 block,避免被 style.css 里的全局 header{display:flex} 带跑偏 */ .rphead{display:block;padding-bottom:16px;border-bottom:1.5px solid var(--rp-gold);position:relative} .rphead::after{display:none} .rphead .rpbrand{display:inline-block;background:linear-gradient(135deg,#eab94e,#c8952c 55%,#a4761c); color:#fff;font-size:10.5px;letter-spacing:1px;padding:3px 10px;border-radius:5px;font-weight:600} .rphead h1{font-size:20px;font-weight:600;letter-spacing:-.2px;margin:9px 0 6px;line-height:1.3} .rpmeta{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:11px;color:var(--rp-ink3);letter-spacing:.1px} .rpmeta b{font-weight:500;color:var(--rp-ink2)} /* 结论摘要 */ .rpsum{display:flex;flex-wrap:wrap;gap:10px 18px;margin:16px 0 2px;padding:13px 17px; background:var(--rp-gold-bg);border:1px solid #f0e2c2;border-radius:10px} .rpsum .rplead{flex:0 0 auto;min-width:132px} .rpsum .rplead .k{font-size:11px;color:var(--rp-ink3);letter-spacing:.3px} .rpsum .rplead .v{font-size:26px;font-weight:600;line-height:1.2;margin:2px 0 4px;color:var(--rp-ink)} .rpsum .rplead .v .u{font-size:12px;font-weight:400;color:var(--rp-ink3);margin-left:6px} .rpsev{display:inline-block;font-size:11px;padding:2px 9px;border-radius:20px;font-weight:600} .rpsev.s3{background:#f7e0d7;color:#93401f} .rpsev.s2{background:#fae8d4;color:#9a5a1c} .rpsev.s1{background:#f8efd6;color:#8a6a2f} .rpsev.n{background:#efeade;color:#6b6150} .rpsev.s0{background:#e9f1ea;color:#4a7458} .rpstats{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;justify-content:flex-end;flex:1 1 auto} .rpstats div{text-align:center;min-width:62px} .rpstats b{display:block;font-size:17px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--rp-ink)} .rpstats span{font-size:10.5px;color:var(--rp-ink3)} /* 章节 */ .rpdoc h2{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600; margin:24px 0 12px;padding-left:11px;position:relative;letter-spacing:.1px; break-after:avoid;page-break-after:avoid;break-inside:avoid} .rpdoc h2::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:3px; border-radius:2px;background:var(--rp-gold)} .rpdoc h2 .n{color:var(--rp-gold);font-weight:600} /* 指标条 */ .rpmetrics{display:grid;grid-template-columns:1fr 1fr;gap:2px 30px} .rpbar{margin:7px 0;break-inside:avoid} .rpbar .lab{display:flex;justify-content:space-between;font-size:11px;color:var(--rp-ink3)} .rpbar .lab b{font-weight:500;color:var(--rp-ink2);font-variant-numeric:tabular-nums} .rpbar .track{position:relative;height:6px;background:#f5ecda;border-radius:4px;margin-top:6px} .rpbar .fill{height:100%;border-radius:4px} .rpbar .mk{position:absolute;top:-3px;width:1.5px;height:12px;background:#c6b48c} .rpbar .mk.t{background:var(--rp-green)} .rplegend{margin-top:12px;font-size:10.5px;color:var(--rp-ink3)} .rplegend i{display:inline-block;width:1.5px;height:10px;background:#c6b48c;margin:0 4px 0 12px;vertical-align:-1px} .rplegend i.t{background:var(--rp-green)} /* 风险条目(表格样式自带全,不依赖 style.css,保证下载的单文件 HTML 长得一样) */ .rpflags{width:100%;border-collapse:collapse;font-size:11.5px} .rpflags th{text-align:left;font-weight:500;font-size:10.5px;color:#8a7548;letter-spacing:.3px; padding:6px 0 7px;background:#fdf9ee;border-bottom:1px solid #e8d8b2;border-radius:0;white-space:nowrap} .rpflags th:first-child{padding-left:2px} .rpflags th:last-child{padding-left:12px} .rpflags td{padding:7px 0;border-bottom:1px solid var(--rp-line2);vertical-align:top} .rpflags tr:last-child td{border-bottom:0} .rpflags td.no{width:26px;color:var(--rp-ink3);font-variant-numeric:tabular-nums} .rpflags td.act{color:var(--rp-ink2);width:44%;padding-left:12px} .rpdx{margin:0 0 11px;padding:10px 13px;background:#fdfaf3;border-left:3px solid var(--rp-gold); border-radius:0 8px 8px 0;font-size:11.5px;line-height:1.7;color:var(--rp-ink2)} .rpflag{display:inline-block;font-size:9.5px;color:#93401f;background:#f7e0d7; padding:1px 6px;border-radius:4px;margin-left:7px;vertical-align:1px;font-weight:600} .rptag{display:inline-block;padding:1px 7px;border-radius:5px;font-size:10.5px} .rptag.R3{background:#f7e0d7;color:#93401f} .rptag.R2{background:#fae8d4;color:#9a5a1c} .rptag.R1{background:#f8efd6;color:#8a6a2f} .rptag.B{background:#f0e6d0;color:#5f4b28} .rptag.T{background:#efeade;color:#6b6150} /* 数据小卡 */ .rpgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px} .rpgrid div{padding:9px 11px;background:#fdfaf3;border:1px solid var(--rp-line2);border-radius:8px} .rpgrid .k{font-size:10.5px;color:var(--rp-ink3);letter-spacing:.2px} .rpgrid .v{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums;margin-top:2px} .rpgrid .v small{font-size:10.5px;font-weight:400;color:var(--rp-ink3);margin-left:3px} /* 洞察 / 动作 */ .rpol{padding-left:0;margin:0} .rpol li{list-style:none;position:relative;padding:2px 0 6px 24px;font-size:11.5px;line-height:1.75; color:var(--rp-ink2);break-inside:avoid} .rpol li .idx{position:absolute;left:0;top:3px;width:17px;height:17px;border-radius:50%; background:var(--rp-gold-bg);color:var(--rp-brown);font-size:10px;font-weight:600; text-align:center;line-height:17px;font-variant-numeric:tabular-nums} .rpacts{margin:0;padding:0;background:#fdfaf3;border:1px solid var(--rp-line2); border-radius:9px;padding:13px 16px} .rpacts li{list-style:none;position:relative;padding:3px 0 8px 24px;font-size:11.5px;line-height:1.75; color:var(--rp-ink2);break-inside:avoid} .rpacts li:last-child{padding-bottom:2px} .rpacts li .ic{position:absolute;left:0;top:3px;font-size:11px;color:var(--rp-green)} .rpmuted{color:var(--rp-ink3);font-size:11.5px} .rpfoot{margin-top:28px;padding-top:12px;border-top:1px solid var(--rp-line2); font-size:10px;color:var(--rp-ink3);line-height:1.8;letter-spacing:.1px} /* ================= 打印 / 另存为 PDF ================= */ @page{size:A4;margin:14mm} @media print{ html,body{background:#fff !important} body.rp-on .wrap, body.rp-on .rail, body.rp-on .overlay, body.rp-on .drawer, body.rp-on .sidepanel, body.rp-on .toast, body.rp-on .pvwrap, body.rp-on .rptoolbar{display:none !important} body.rp-on .rpwrap{position:static !important;inset:auto;overflow:visible; background:#fff !important;padding:0;backdrop-filter:none;display:block !important} .rpcard{width:auto;max-width:none;box-shadow:none;border-radius:0;margin:0;animation:none} .rpdoc{padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact} .rpdoc h2{margin-top:16px} .rpdoc h2 + *{break-before:avoid;page-break-before:avoid} .rpsum{margin-top:12px} .rpmetrics,.rpgrid{break-inside:avoid} } /* ================= 窄屏(手机上看报告) ================= */ @media (max-width:640px){ .rpwrap{padding:14px 10px 30px} .rpdoc{padding:22px 18px 26px} .rphead h1{font-size:18px} .rpmetrics{grid-template-columns:1fr} .rpgrid{grid-template-columns:1fr 1fr} .rpflags td.act{width:auto} .rptoolbar{padding:10px 12px;flex-wrap:wrap} .rptoolbar .rpname{flex:1 0 100%;margin-bottom:4px} }