/* ===================================================================== Roboda CNC — PRINT stylesheet for the owner-gated area. Linked with media="print" from login.html, owner.html, pack.html and margin.html. Nothing here affects the screen. This sheet has one demanding job: the printed assembly manual IS the manual that ships in the box. It has to survive a workbench — every step on paper, no step split across a page break, the acceptance criterion visually louder than the body text, a tick box and a sign-off line, the running clock, and the bag you are meant to open. Print modes, set by pack.js on : data-print="manual" the shop-floor document only, cover page first data-print="pack" every section, each starting on a fresh page (no attribute) whatever the visitor has on screen Marking rules, applied to every mode, deliberately not overridable: - the RESTRICTED band is fixed to the top of every printed page; - a watermark sits behind the content; - every panel closes with a restricted footer line; - the costing section never prints in manual mode, and when it does print it carries its own "must never leave the company" line. ===================================================================== */ @page { margin: 18mm 12mm 15mm; } /* Force a light palette: a dark-mode screen must still print readably. */ :root { --bg: #fff; --surface: #fff; --surface-2: #f1f1f1; --sunken: #fafafa; --ink: #000; --ink-2: #1a1a1a; --muted: #555; --line: #bbb; --line-2: #888; --accent: #000; --accent-ink: #fff; --accent-soft: #f0f0f0; --hazard: #a01000; --hazard-soft: #fff; --hazard-line: #a01000; --warn: #7a4a00; --warn-soft: #fff; --warn-line: #7a4a00; --ok: #0a4a28; --ok-soft: #fff; --ok-line: #0a4a28; --core: #000; --infra: #444; --shadow: none; } body { background: #fff !important; color: #000 !important; font-size: 10.5pt; line-height: 1.4; padding-top: 14mm; /* clearance for the fixed restricted band */ } /* --------------------------------------------------------------------- Chrome that must never reach paper --------------------------------------------------------------------- */ .topbar, .tabs, .toolbar, .filters, .skip, .btn, .no-print, .step-done, .progress, .enq-actions, .sibs, .login-page form { display: none !important; } /* The self-check chips inside the costing panel DO print: a reviewer holding the paper should see that the arithmetic was re-derived. The pack-header chips carry .no-print and are hidden by the rule above. */ .checks { gap: 5pt; } .checks .chip { border-width: .5pt; } .print-only { display: block !important; } .wrap { max-width: none; padding: 0; } .page { padding: 0; } /* --------------------------------------------------------------------- Restricted marking — band, watermark, per-section footer --------------------------------------------------------------------- */ .band { position: fixed; top: 0; left: 0; right: 0; display: flex; gap: 10px; align-items: baseline; background: #fff !important; color: #000 !important; border: 0; border-bottom: 2.5pt solid #a01000 !important; padding: 0 0 2pt; font-size: 8pt; z-index: 10; -webkit-print-color-adjust: exact; print-color-adjust: exact; } .band::before { content: ""; display: block; width: 26px; align-self: stretch; background: repeating-linear-gradient( -45deg, #a01000 0 5px, #fff 5px 10px) !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; } .band-main { color: #a01000 !important; font-size: 8.5pt; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; } .band-sub { color: #333 !important; font-size: 7.5pt; } /* The costing warning band is a second, non-fixed strip that prints in place, immediately above the numbers it is warning about. */ .band-money { position: static; border: 1.5pt solid #a01000 !important; border-bottom-width: 1.5pt !important; margin: 0 0 8pt; padding: 4pt 6pt; z-index: auto; } .band-money::before { display: none; } .watermark { display: block; position: fixed; top: 44%; left: 0; right: 0; text-align: center; transform: rotate(-24deg); font-size: 62pt; font-weight: 900; letter-spacing: .18em; color: rgba(160, 16, 0, .07); z-index: -1; pointer-events: none; -webkit-print-color-adjust: exact; print-color-adjust: exact; } .panel::after, .section::after { content: "RESTRICTED - Roboda internal, not for distribution - robodatech.com"; display: block; margin-top: 8mm; padding-top: 3pt; border-top: .5pt solid #a01000; font-size: 7pt; letter-spacing: .08em; color: #a01000; } .manual-foot { margin-top: 8mm; padding-top: 3pt; border-top: .5pt solid #a01000; font-size: 7.5pt; letter-spacing: .08em; color: #a01000; } /* --------------------------------------------------------------------- Panels: tabs collapse on paper --------------------------------------------------------------------- */ .panel-title { display: block; font-size: 1.2rem; border-bottom: 2px solid #000; padding-bottom: 4px; margin: 0 0 12px; } /* "print the whole pack": every panel, each on a fresh page. */ body[data-print="pack"] .panel[hidden] { display: block !important; } body[data-print="pack"] .panel { break-before: page; page-break-before: always; } body[data-print="pack"] .panel:first-of-type { break-before: auto; page-break-before: auto; } /* "print the manual": the shop-floor document and nothing else. */ body[data-print="manual"] .panel[hidden] { display: none !important; } body[data-print="manual"] #panel-manual { display: block !important; } body[data-print="manual"] .ident, body[data-print="manual"] .panel:not(#panel-manual), body[data-print="manual"] .panel-note { display: none !important; } /* Costing never rides along on a manual. */ body[data-print="manual"] #panel-costing { display: none !important; } .card, .subsys, .step, .gotcha, .calc, .tablewrap, .ident, .plat, .fb, .bag-card { box-shadow: none !important; border-color: #999 !important; } .ident { break-after: avoid; page-break-after: avoid; } .ident-stats { gap: 14px; } a[href]::after { content: ""; } a { color: #000; text-decoration: none; } /* --------------------------------------------------------------------- Design dossier — the worked calculations must stay checkable by eye --------------------------------------------------------------------- */ .subsys { break-inside: auto; } .subsys-head { break-after: avoid; page-break-after: avoid; } .calc { break-inside: avoid; page-break-inside: avoid; background: #fff !important; border: .75pt solid #666 !important; } .calc-work { font-size: 8.6pt; line-height: 1.55; background: #fff !important; border: .5pt solid #999 !important; } .calc-row-result > .calc-k, .calc-row-result > .calc-v { color: #000; font-weight: 800; } .fb { break-inside: avoid; page-break-inside: avoid; } .gotcha { break-inside: avoid; page-break-inside: avoid; background: #fff !important; } .gotcha-hazard { border: 1.25pt solid #a01000 !important; } .gotcha-hazard::before { background: repeating-linear-gradient(-45deg, #a01000 0 6px, #000 6px 12px) !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; } .sev-hazard { background: #a01000 !important; color: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; } /* --------------------------------------------------------------------- ASSEMBLY MANUAL — this is the document in the box --------------------------------------------------------------------- */ .manual-cover { break-after: page; page-break-after: always; } .cover-title { font-size: 20pt; margin: 0 0 2pt; } .cover-code { font-size: 11pt; letter-spacing: .08em; } .cover-eyebrow { font-size: 8pt; } .cover-h { font-size: 10.5pt; border-bottom: .5pt solid #000; padding-bottom: 2pt; margin: 10pt 0 4pt; } .cover-kv { font-size: 9.5pt; } .cover-list { font-size: 9.5pt; } .cover-table { font-size: 8.5pt; } .manual-lede { border: 1.25pt solid #000 !important; background: #fff !important; padding: 6pt 8pt; font-size: 10pt; break-inside: avoid; } .manual-summary { gap: 6pt; } .manual-summary .total-card { border: .5pt solid #999 !important; padding: 4pt 7pt; } .phase-head { break-before: auto; break-after: avoid; page-break-after: avoid; font-size: 9pt; border-bottom: 1pt solid #000; } /* One step, one unbroken block. */ .step { break-inside: avoid; page-break-inside: avoid; border: .75pt solid #666 !important; padding: 8pt 10pt; margin-bottom: 7pt; grid-template-columns: 34px 1fr; } .step-ord { font-size: 13pt; } .step-title { font-size: 11pt; } .step[data-done="1"] { opacity: 1; } .step[data-done="1"] .step-title { text-decoration: none; } .tools li, .bag-pill { border: .5pt solid #000 !important; background: #fff !important; color: #000 !important; font-size: 8pt; } .bag-pill { font-weight: 800; } .step-facts { font-size: 8.5pt; gap: 4pt 14pt; } /* The gate to the next step has to be the loudest thing in the block. */ .accept { border: 1.5pt solid #000 !important; border-left-width: 5pt !important; background: #fff !important; padding: 6pt 8pt; break-inside: avoid; } .accept-k { color: #000; font-size: 7pt; } .accept-v { font-size: 9.5pt; font-weight: 700; } .accept-missing { color: #a01000; } /* Tick box and sign-off, printed on every step of the manual. */ .step::after { content: "checked \25A1 measured value ____________ by ______________ date __________"; display: block; grid-column: 2; margin-top: 5pt; padding-top: 3pt; border-top: .5pt dashed #666; font-family: var(--mono); font-size: 8pt; color: #333; } .manual-end { break-inside: avoid; border: 1.5pt solid #000 !important; padding: 8pt 10pt; } /* --------------------------------------------------------------------- Tables — BOM, packing, margin --------------------------------------------------------------------- */ .tablewrap { overflow: visible; border: 0; } table.grid { font-size: 8.4pt; width: 100%; } table.grid thead { display: table-header-group; } table.grid tfoot { display: table-footer-group; } table.grid thead th { position: static; background: #eee !important; border-bottom: .75pt solid #000; -webkit-print-color-adjust: exact; print-color-adjust: exact; } table.grid th, table.grid td { padding: 2.5pt 4pt; } table.grid tbody tr { break-inside: avoid; page-break-inside: avoid; } table.grid th.sortable::after { content: ""; } tr.group-row td { background: #e8e8e8 !important; border-top: .75pt solid #000; -webkit-print-color-adjust: exact; print-color-adjust: exact; } .row-thin { background: #f0f0f0 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; } .row-off { box-shadow: none !important; } .row-off td:first-child { border-left: 2pt solid #a01000; } .flag-thin { background: #a01000 !important; color: #fff !important; } .delta-bad { color: #a01000 !important; } /* Real boxes to tick with a pen. */ .check input[type="checkbox"] { -webkit-appearance: none; appearance: none; width: 12pt; height: 12pt; border: 1pt solid #000; border-radius: 1pt; background: #fff; flex: none; } .check input[type="checkbox"]:checked::after { content: "X"; display: block; font: 700 9pt/12pt var(--mono); text-align: center; } .check input:checked + .check-t { text-decoration: none; color: #000; } .checklist li { break-inside: avoid; page-break-inside: avoid; } /* --------------------------------------------------------------------- Costing on paper — the one section that carries its own warning --------------------------------------------------------------------- */ #panel-costing .panel-title::after, .margin-page h1::after { content: " — MARGIN DATA, MUST NEVER LEAVE THE COMPANY"; font-size: 8pt; letter-spacing: .06em; color: #a01000; } #panel-costing::after, .margin-page .section::after { content: "RESTRICTED - MARGIN DATA - must never leave the company - robodatech.com"; color: #a01000; font-weight: 700; } /* The margin report is 13 columns wide: give it landscape paper. */ .margin-page { page: margin-landscape; } @page margin-landscape { size: A4 landscape; margin: 14mm 10mm; } /* --------------------------------------------------------------------- Pages that are not worth printing --------------------------------------------------------------------- */ .login-page .login-card::after { content: "This is a sign-in page. There is nothing here worth printing."; display: block; margin-top: 8pt; font-size: 9pt; color: #a01000; }