Update A4/style_print_a4_landscape.css

A4/style_print_a4_landscape.css

@@ -1,4 +1,4 @@
-/* style_print_a4_landscape.css - A4 Landscape & Enhanced Readability - Revision 3 (Layout & Content Density Adjusted) */
+/* style_print_a4_landscape.css - A4 Landscape & Enhanced Readability - Revision 3 (Layout Optimized) */
 
 /* Basic settings and fonts */
 body {
@@ -9,7 +9,8 @@ body {
     color: #333;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
-    font-size: 9pt; /* Adjusted base font size slightly down for density */
+    font-size: 9.5pt; /* Adjusted base font size for better fit */
+    line-height: 1.45; /* Adjusted line height */
 }
 
 .manual-container {
@@ -54,9 +55,9 @@ body {
 
 /* Content Grid Layout */
 .content-grid {
-    display: flex;
-    flex-direction: row; /* Arrange items horizontally */
-    flex-wrap: nowrap; /* Prevent wrapping */
+    display: flex; /* Use flexbox for screen layout */
+    flex-direction: row;
+    flex-wrap: nowrap;
     gap: 8mm; /* Space between grid items */
     flex-grow: 1; /* Allow grid to take available space */
     height: calc(100% - 25mm); /* Adjusted height considering title and footer */
@@ -71,10 +72,10 @@ body {
     background-color: #fff;
     display: flex;
     flex-direction: column;
-    /* overflow-y: auto; /* Allow internal scroll for overflow - REMOVED for print goal */
+    overflow-y: auto; /* Allow internal scroll for overflow - aiming to avoid this */
     scrollbar-width: thin;
     scrollbar-color: #adb5bd #f8f9fa;
-    line-height: 1.4; /* Adjusted line height further */
+    line-height: 1.45; /* Consistent line height */
 }
 
 /* Grid column definitions */
@@ -93,20 +94,20 @@ body {
 
 /* Section and Titles within grid items */
 .grid-item h4 { /* Main titles within a grid item */
-    margin: 0 0 7px 0; /* Reduced margin */
+    margin: 0 0 8px 0; /* Reduced margin */
     font-size: 1.1em;
     font-weight: 700;
     display: flex;
     align-items: center;
     border-bottom: 1px solid #ccc;
-    padding-bottom: 3px; /* Reduced padding */
+    padding-bottom: 4px;
     color: #0056b3;
     flex-shrink: 0; /* Prevent shrinking */
 }
-.grid-item h4 i { margin-right: 6px; font-size: 1em; color: inherit; }
+.grid-item h4 i { margin-right: 7px; font-size: 1em; color: inherit; }
 
 .grid-item h5 { /* Sub-titles within a section */
-    margin: 5px 0 3px 0; /* Reduced margin */
+    margin: 6px 0 4px 0; /* Reduced margin */
     font-size: 1.0em;
     font-weight: 600;
     display: flex;
@@ -114,11 +115,11 @@ body {
     color: #495057;
     flex-shrink: 0; /* Prevent shrinking */
 }
-.grid-item h5 i { margin-right: 4px; font-size: 0.9em; }
+.grid-item h5 i { margin-right: 5px; font-size: 0.9em; }
 
 .section {
-    padding-bottom: 5px; /* Reduced padding */
-    margin-bottom: 5px; /* Reduced margin */
+    padding-bottom: 6px; /* Reduced padding */
+    margin-bottom: 6px; /* Reduced margin */
     border-bottom: 1px solid #f0f0f0;
 }
 .section:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
@@ -126,12 +127,12 @@ body {
 /* Visual Area */
 .visual-area {
     background-color: #f8f9fa;
-    padding: 7px; /* Reduced padding */
+    padding: 8px; /* Reduced padding */
     border-radius: 5px;
     border: 1px dashed #ced4da;
-    margin-top: 3px; /* Reduced margin */
-    margin-bottom: 7px; /* Reduced margin */
-    min-height: 30px; /* Reduced min-height */
+    margin-top: 4px;
+    margin-bottom: 8px;
+    min-height: 35px;
     color: #6c757d;
     display: flex;
     flex-direction: column;
@@ -140,46 +141,45 @@ body {
     text-align: center;
     flex-shrink: 0; /* Prevent shrinking */
 }
-.visual-area i { color: #adb5bd; margin-bottom: 2px; /* Reduced margin */ }
-.visual-area p { margin: 2px 0; /* Reduced margin */ font-style: italic; font-size: 0.85em; /* Reduced font size */ }
-.visual-area small { font-size: 0.75em; /* Reduced font size */ color: #adb5bd; margin-top: 2px; /* Reduced margin */ }
-.visual-area.small { min-height: 20px; padding: 5px; margin-bottom: 5px; } /* Reduced further */
-.map-placeholder { min-height: 70px; } /* Reduced */
-.unit-placeholder { min-height: 60px; } /* Reduced */
-.equip-placeholder { min-height: 40px; } /* Reduced */
-.disposal-placeholder { min-height: 35px; } /* Reduced */
-.clean-placeholder { min-height: 35px; } /* Reduced */
-.p-ken-placeholder { min-height: 35px; } /* Reduced */
-.tbi-placeholder { min-height: 45px; } /* Reduced */
-
+.visual-area i { color: #adb5bd; margin-bottom: 3px; }
+.visual-area p { margin: 3px 0; font-style: italic; font-size: 0.9em; }
+.visual-area small { font-size: 0.8em; color: #adb5bd; margin-top: 3px; }
+.visual-area.small { min-height: 25px; padding: 6px; margin-bottom: 6px; }
+.map-placeholder { min-height: 80px; }
+.unit-placeholder { min-height: 70px; }
+.equip-placeholder { min-height: 50px; }
+.disposal-placeholder { min-height: 40px; }
+.clean-placeholder { min-height: 40px; }
+.p-ken-placeholder { min-height: 40px; }
+.tbi-placeholder { min-height: 50px; }
 
 /* Staff Info */
 .staff-info {
     display: flex;
     justify-content: space-around;
-    gap: 6px; /* Reduced gap */
-    margin-top: 5px; /* Reduced margin */
-    margin-bottom: 5px; /* Reduced margin */
+    gap: 8px; /* Reduced gap */
+    margin-top: 6px;
+    margin-bottom: 6px;
     flex-wrap: wrap; /* Allow wrapping if needed */
 }
 .staff-item {
     text-align: center;
     border: 1px solid #dee2e6;
-    padding: 5px 4px; /* Reduced padding */
+    padding: 6px 4px; /* Reduced padding */
     border-radius: 5px;
     flex: 1;
     background-color: #fff;
     transition: background-color 0.2s ease;
-    min-width: 75px; /* Reduced min-width */
+    min-width: 80px;
     flex-shrink: 0;
 }
 .staff-item:hover { background-color: #f8f9fa; }
 .face-photo {
-    width: 30px; /* Smaller photo */
-    height: 30px;
+    width: 35px; /* Smaller photo */
+    height: 35px;
     background-color: #e9ecef;
     border-radius: 50%;
-    margin: 0 auto 4px auto; /* Reduced margin */
+    margin: 0 auto 5px auto;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -187,68 +187,68 @@ body {
     border: 1px solid #fff; /* Thinner border */
     box-shadow: 0 1px 2px rgba(0,0,0,0.1);
 }
-.face-photo i { font-size: 1.1em; } /* Reduced icon size */
-.staff-item p { margin: 1px 0; font-size: 0.8em; /* Reduced font size */ line-height: 1.2; /* Reduced line height */ color: #495057; }
-.staff-name { font-weight: 700; font-size: 0.85em; /* Reduced font size */ color: #212529; }
-.highlight { margin-top: 2px; /* Reduced margin */ font-size: 0.7em !important; /* Reduced font size */ padding: 1px 3px; /* Reduced padding */ }
+.face-photo i { font-size: 1.2em; }
+.staff-item p { margin: 1px 0; font-size: 0.85em; line-height: 1.25; color: #495057; }
+.staff-name { font-weight: 700; font-size: 0.9em; color: #212529; }
+.highlight { margin-top: 3px; font-size: 0.75em !important; padding: 2px 4px; }
 
 /* Schedule */
 .schedule-card {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
-    gap: 8px; /* Reduced gap */
+    gap: 10px; /* Reduced gap */
 }
-.schedule-group { flex-basis: 49%; } /* Slightly increased basis */
-.schedule-group h5 { font-size: 1.0em; padding-bottom: 1px; margin-bottom: 3px; /* Reduced margins */ }
-.schedule-group ul { padding-left: 3px; margin: 0; }
-.schedule-group li { font-size: 0.8em; /* Reduced font size */ margin-bottom: 1px; /* Reduced margin */ }
-.time { width: 38px; /* Adjusted width */ margin-right: 3px; font-size: 0.8em; } /* Reduced font size */
+.schedule-group { flex-basis: 48%; }
+.schedule-group h5 { font-size: 1.0em; padding-bottom: 2px; margin-bottom: 4px; }
+.schedule-group ul { padding-left: 4px; margin: 0; }
+.schedule-group li { font-size: 0.85em; margin-bottom: 2px; }
+.time { width: 40px; margin-right: 4px; font-size: 0.85em; }
 
 /* Checklist */
-.checklist ul { padding-left: 3px; margin: 2px 0 0 0; /* Reduced margins */ }
-.checklist li { margin-bottom: 2px; /* Reduced margin */ font-size: 0.85em; /* Reduced font size */ }
-.checklist i.far { margin-right: 4px; /* Reduced margin */ font-size: 0.9em; /* Reduced font size */ width: 12px; /* Adjusted width */ }
-.priority { width: 14px; height: 14px; line-height: 14px; font-size: 0.65em; margin-right: 4px; } /* Adjusted size */
+.checklist ul { padding-left: 4px; margin: 3px 0 0 0; }
+.checklist li { margin-bottom: 3px; font-size: 0.9em; }
+.checklist i.far { margin-right: 5px; font-size: 1.0em; width: 14px; }
+.priority { width: 16px; height: 16px; line-height: 1; font-size: 0.7em; margin-right: 5px; }
 
 /* Compact List & No-Bullet List */
-.compact-list li { margin-bottom: 1.5px; /* Reduced margin */ font-size: 0.85em; /* Reduced font size */ line-height: 1.3; /* Reduced line height */ }
+.compact-list li { margin-bottom: 2px; font-size: 0.9em; line-height: 1.35; }
 .no-bullet { list-style: none; padding-left: 0; margin: 0; }
-.no-bullet li { display: flex; align-items: flex-start; margin-bottom: 2px; /* Reduced margin */ }
-.no-bullet li i { margin-right: 4px; /* Reduced margin */ width: 12px; text-align: center; margin-top: 1px; /* Adjusted margin */ flex-shrink: 0; font-size: 0.9em; /* Reduced font size */ }
-.compact-list.two-column { columns: 2; -webkit-columns: 2; -moz-columns: 2; column-gap: 12px; /* Reduced gap */ padding-left: 0; }
-.compact-list.two-column li { break-inside: avoid-column; padding-bottom: 2px; /* Reduced padding */ }
-.compact-list.two-column-small { columns: 2; -webkit-columns: 2; -moz-columns: 2; column-gap: 6px; /* Reduced gap */ padding-left: 0; }
-.compact-list.two-column-small li { break-inside: avoid-column; padding-bottom: 1.5px; /* Reduced padding */ }
+.no-bullet li { display: flex; align-items: flex-start; margin-bottom: 3px; }
+.no-bullet li i { margin-right: 5px; width: 14px; text-align: center; margin-top: 1.5px; flex-shrink: 0; font-size: 0.95em; }
+.compact-list.two-column { columns: 2; -webkit-columns: 2; -moz-columns: 2; column-gap: 15px; padding-left: 0; }
+.compact-list.two-column li { break-inside: avoid-column; padding-bottom: 3px; }
+.compact-list.two-column-small { columns: 2; -webkit-columns: 2; -moz-columns: 2; column-gap: 8px; padding-left: 0; }
+.compact-list.two-column-small li { break-inside: avoid-column; padding-bottom: 2px; }
 
 
 /* Sublist */
-.sub-list { padding-left: 10px; /* Reduced padding */ margin: 1px 0 3px 3px; /* Reduced margins */ border-left: 1px solid #e0e0e0; }
-.sub-list li { font-size: 0.8em; /* Reduced font size */ margin-bottom: 1px; /* Reduced margin */ position: relative; padding-left: 6px; /* Reduced padding */ }
-.sub-list li::before { content: "-"; position: absolute; left: -3px; top: 0.5px; color: #6c757d; font-size: 0.8em; /* Reduced font size */ }
+.sub-list { padding-left: 12px; margin: 2px 0 4px 4px; border-left: 1px solid #e0e0e0; }
+.sub-list li { font-size: 0.85em; margin-bottom: 1.5px; position: relative; padding-left: 7px; }
+.sub-list li::before { content: "-"; position: absolute; left: -3px; top: 0.5px; color: #6c757d; font-size: 0.9em; }
 
 /* Special Box */
-.special-box { border-radius: 5px; padding: 7px 9px; margin-top: 7px; /* Reduced margins */ }
-.special-box p { margin: 0 0 4px 0; /* Reduced margin */ font-size: 0.9em; /* Reduced font size */ }
-.special-box p i { margin-right: 4px; font-size: 1.0em; }
-.special-box ul { padding-left: 5px; margin: 0; }
-.special-box .compact-list li { font-size: 0.8em; /* Reduced font size */ }
-.special-box.small-box { padding: 5px 7px; margin-top: 5px; /* Reduced margins */ } /* More compact box */
-.special-box.small-box p { margin-bottom: 3px; /* Reduced margin */ font-size: 0.85em; /* Reduced font size */ }
-.special-box.small-box ul { padding-left: 4px; }
-.special-box.small-box .compact-list li { font-size: 0.75em; /* Reduced font size */ }
+.special-box { border-radius: 5px; padding: 8px 10px; margin-top: 8px; }
+.special-box p { margin: 0 0 5px 0; font-size: 0.95em; }
+.special-box p i { margin-right: 5px; font-size: 1.0em; }
+.special-box ul { padding-left: 6px; margin: 0; }
+.special-box .compact-list li { font-size: 0.85em; }
+.special-box.small-box { padding: 6px 8px; margin-top: 6px; } /* More compact box */
+.special-box.small-box p { margin-bottom: 4px; font-size: 0.9em; }
+.special-box.small-box ul { padding-left: 5px; }
+.special-box.small-box .compact-list li { font-size: 0.8em; }
 
 
 /* Note Style */
 .note {
-    font-size: 0.8em; /* Reduced font size */
+    font-size: 0.85em;
     color: #555;
-    margin-top: 5px; /* Reduced margin */
+    margin-top: 6px;
     font-style: italic;
-    line-height: 1.2; /* Reduced line height */
+    line-height: 1.3;
 }
 
-/* Color Themes (Keep as is, adjust colors slightly if needed) */
+/* Color Themes (Keep as is) */
 .normal-bg { background-color: #e7f5ff; border-bottom-color: #cce0ff; }
 .card-header.normal-bg i { color: #0056b3; }
 .card-header.normal-bg h3 { color: #004085; }
@@ -286,15 +286,8 @@ body {
     flex-shrink: 0; /* Prevent footer from shrinking */
 }
 
-/* Guidance Section */
-.guidance-section { display: flex; justify-content: space-between; gap: 10px; }
-.guidance-section > div { flex-basis: 48%; }
-.guidance-section h5 { font-size: 1.0em; margin-bottom: 4px;}
-.guidance-section ul { padding-left: 0; margin-top: 0; }
-.guidance-section li { font-size: 0.85em; margin-bottom: 2.5px; }
-.guidance-section li i { width: 15px; text-align: center; }
-.guidance-section ol.ordered-list { padding-left: 15px; margin: 0; }
-.guidance-section ol.ordered-list li { margin-bottom: 3px; }
+/* Guidance Section (Renamed/Replaced by content-grid) */
+/* Removed this specific section style as content-grid is used universally */
 
 /* Waste Bins */
 .waste-bins { display: flex; justify-content: space-around; text-align: center; gap: 6px; margin-top: 6px; }
@@ -317,23 +310,11 @@ body {
 .glossary ul { margin-bottom: 0; line-height: 1.35; }
 .glossary .term { font-weight: bold; margin-right: 4px; color: #343a40; }
 
-/* Specific Card Adjustments */
-.equipment-card .notes-section { margin-top: 6px; padding-top: 6px; }
-.equipment-card .notes-section li { margin-bottom: 2.5px;}
-.equipment-card .notes-section li i { margin-right: 5px; width: 15px; }
+/* Specific Section Adjustments (Cleaned up - relying more on general styles) */
+/* Removed specific card adjustments */
 
-.recall-card .visual-area { margin-bottom: 5px; }
-.recall-card h4 { margin-top: 6px; margin-bottom: 3px; }
-.recall-card .special-box { margin-top: 6px; }
-.recall-card .no-bullet li { margin-bottom: 2.5px;}
-
-.ask-who-card h4 { margin-bottom: 3px; }
-.ask-who-card .staff-info { margin-top: 6px; }
-.ask-who-card .no-bullet li { margin-bottom: 2.5px;}
-
-/* Special Caution */
-.special-caution { color: #dc3545; font-weight: bold; display: block; margin-top: 4px; font-size: 0.85em; }
-.special-caution i { margin-right: 4px; }
+/* Special Caution (Renamed from special-caution to note.emergency-text for consistency) */
+/* Class is now applied directly to <p> or <li> tags */
 
 /* Simple Flow List */
 ol.simple-flow {
@@ -345,12 +326,6 @@ ol.simple-flow li {
     margin-bottom: 3px;
     font-size: 0.95em;
 }
-ol.simple-flow li i { /* Added style for icons in ordered list */
-    margin-right: 6px;
-    font-size: 0.9em;
-    color: #007bff;
-}
-
 
 /* Flex container for side-by-side elements within a grid item */
 .flex-container {
@@ -367,14 +342,14 @@ ol.simple-flow li i { /* Added style for icons in ordered list */
 @media print {
     @page {
         size: A4 landscape;
-        margin: 8mm; /* Slightly reduced print margin */
+        margin: 10mm;
     }
     body {
         background-color: #fff !important;
-        font-size: 8.5pt; /* Further reduced base font size for print */
+        font-size: 9pt; /* Adjusted base font size for print */
+        line-height: 1.3; /* Adjusted line height for print */
         color-adjust: exact;
         -webkit-print-color-adjust: exact;
-        line-height: 1.2; /* Tighter line height for print */
     }
     .manual-container {
         padding: 0;
@@ -386,9 +361,7 @@ ol.simple-flow li i { /* Added style for icons in ordered list */
         box-shadow: none;
         border: none;
         margin: 0;
-        padding: 0 8mm; /* Apply horizontal padding here instead of .page */
-        padding-top: 8mm; /* Add top padding */
-        padding-bottom: 12mm; /* Add bottom padding to leave space for footer */
+        padding: 10mm; /* Apply print padding here */
         page-break-after: always;
         display: block; /* Block display for better page breaking */
         overflow: visible; /* Show all content */
@@ -397,116 +370,150 @@ ol.simple-flow li i { /* Added style for icons in ordered list */
         page-break-after: avoid;
     }
     .page-title {
-        font-size: 13pt; /* Reduced title size */
-        margin-bottom: 5mm; /* Reduced margin */
-        padding-bottom: 2px; /* Reduced padding */
+        font-size: 14pt;
+        margin-bottom: 6mm;
+        padding-bottom: 3px;
         text-align: left; /* Align title left for print */
         border-bottom: 1px solid #666;
     }
     .content-grid {
-        display: block; /* Use CSS columns for layout in print */
+        display: block; /* Change to block for print to allow natural flow within columns */
         height: auto;
         overflow: visible;
-        column-count: 2; /* Default to 2 columns for grids */
-        column-gap: 6mm; /* Reduced gap for print */
+        /* General setting for most pages */
+        column-count: 2;
+        column-gap: 8mm;
         column-fill: auto; /* Balance columns */
     }
+
+    /* Specific print layout overrides */
+    /* Page 2: Special flex layout for staff/schedule */
+    .page.a4-landscape:nth-child(2) .content-grid {
+        display: flex;
+        flex-wrap: wrap; /* Allow items to wrap */
+        gap: 5mm;
+        column-count: unset; /* Disable column-count */
+    }
+     .page.a4-landscape:nth-child(2) .grid-item {
+        flex-basis: calc(50% - 2.5mm); /* Adjust basis for the flex gap */
+        max-width: calc(50% - 2.5mm);
+        margin-bottom: 0; /* Remove column-based margin */
+        break-inside: avoid-column; /* Prevent item from breaking across columns */
+    }
+
+    /* Page 6: Single column layout for P-ken details */
+    .page.a4-landscape:nth-child(6) .content-grid {
+        column-count: 1;
+        column-gap: unset;
+    }
+    .page.a4-landscape:nth-child(6) .grid-item {
+         width: 100%;
+         max-width: 100%;
+         margin-bottom: 5mm; /* Keep some space below the item */
+         break-inside: avoid-page; /* Try to keep content on one page if possible */
+    }
+    /* Ensure flex-container works within the single column */
+    .page.a4-landscape:nth-child(6) .flex-container {
+        display: flex; /* Keep flex */
+        gap: 5mm; /* Smaller gap for print */
+    }
+     .page.a4-landscape:nth-child(6) .flex-item {
+         flex: 1;
+     }
+
+
+    /* General grid item style for print */
     .grid-item {
         border: 1px solid #ccc;
-        padding: 5px 7px; /* Reduced padding */
-        width: 100%; /* Full width within its column */
+        padding: 6px 8px;
+        width: 100%; /* Full width within its column or flex container */
         max-width: none;
-        margin-bottom: 4mm; /* Space between items vertically */
-        break-inside: avoid-column; /* Try to keep item content together within columns */
+        margin-bottom: 5mm; /* Space between items vertically in column layout */
+        break-inside: avoid; /* Try to keep item content together */
         overflow: visible; /* Show all content */
-        font-size: 8.5pt; /* Base font size for grid items */
-        line-height: 1.2; /* Tighter line height */
-        display: block; /* Ensure block display in print */
-    }
-    .grid-item:last-child {
-         margin-bottom: 0; /* Remove bottom margin on last item in a column */
+        font-size: 9pt;
+        line-height: 1.3;
+        /* Override flex properties for print where block/columns are used */
+        display: block;
     }
-    .grid-item h4 { font-size: 10pt; margin-bottom: 5px; padding-bottom: 2px; }
-    .grid-item h5 { font-size: 9pt; margin: 3px 0 2px 0; }
-
-    .section { padding-bottom: 4px; margin-bottom: 4px; }
-    .section:last-child { margin-bottom: 0; padding-bottom: 0; }
-
-    .visual-area { padding: 4px; min-height: 20px; margin-bottom: 4px; margin-top: 3px;}
-    .visual-area.small { min-height: 15px; padding: 3px; margin-bottom: 3px; }
-    .map-placeholder { min-height: 40px; }
-    .unit-placeholder { min-height: 40px; }
-    .visual-area i { margin-bottom: 1px; font-size: 1.3em;}
-    .visual-area p { font-size: 0.8em; margin: 1px 0; }
-    .visual-area small { font-size: 0.7em; margin-top: 1px; }
-
-
-    .staff-info { gap: 4px; margin-top: 3px; margin-bottom: 3px;}
-    .staff-item { padding: 3px 2px; min-width: 60px;}
-    .face-photo { width: 25px; height: 25px; margin-bottom: 1px; }
-    .face-photo i { font-size: 1.0em; }
-    .staff-item p { font-size: 7pt; line-height: 1.0; }
-    .staff-name { font-size: 7.5pt; }
-    .highlight { font-size: 6pt !important; padding: 0 2px; margin-top: 1px;}
-
-    .schedule-card { gap: 3px; }
-    .schedule-group li { font-size: 7.5pt; margin-bottom: 0.5px; }
-    .time { width: 30px; margin-right: 2px; font-size: 7.5pt; }
-
-    .checklist li { margin-bottom: 1px; font-size: 8pt; }
-    .checklist i.far { font-size: 0.8em; margin-right: 2px; width: 10px;}
-    .priority { width: 12px; height: 12px; line-height: 12px; font-size: 5.5pt; margin-right: 2px;}
-
-    .compact-list li { margin-bottom: 0.5px; font-size: 8pt; line-height: 1.1; }
-    .no-bullet li i { margin-right: 3px; width: 9px; margin-top: 0.5px; font-size: 0.85em;}
-    .compact-list.two-column, .compact-list.two-column-small { column-gap: 5mm; }
-
-    .sub-list { padding-left: 8px; margin-top: 1px; margin-bottom: 2px;}
-    .sub-list li { font-size: 7pt; margin-bottom: 0; padding-left: 4px;}
-    .sub-list li::before { left: -2px; font-size: 0.7em; top: 0;}
-
-    .special-box { padding: 4px 6px; margin-top: 4px; border-radius: 3px;}
-    .special-box p { font-size: 8.5pt; margin-bottom: 1px; }
-    .special-box p i { font-size: 0.8em; margin-right: 2px;}
-    .special-box .compact-list li { font-size: 7pt; }
-    .special-box.small-box { padding: 3px 5px; margin-top: 3px; }
-    .special-box.small-box p { font-size: 8pt; margin-bottom: 1px; }
-    .special-box.small-box .compact-list li { font-size: 7pt; }
-
-    .ordered-list { padding-left: 15px; margin: 4px 0; }
-    .ordered-list li { margin-bottom: 1.5px; font-size: 8pt; }
-     ol.simple-flow { padding-left: 15px; margin: 4px 0; }
-     ol.simple-flow li { margin-bottom: 1.5px; font-size: 8.5pt; }
-     ol.simple-flow li i { margin-right: 4px; font-size: 0.85em;}
-
-
-    .guidance-section { gap: 3mm; }
-    .guidance-section li { font-size: 7.5pt; margin-bottom: 0.5px;}
-
-    .waste-bins { gap: 2px; margin-top: 3px; }
-    .bin { padding: 3px 2px; font-size: 6.5pt; min-height: 25px;}
-    .bin i { font-size: 1.1em; margin-bottom: 0.5px; }
-    .bin small { font-size: 0.7em; line-height: 1.0; }
-
-    .rewritable-area { padding: 3px; margin-top: 4px; }
-    .rewritable-area p { margin-bottom: 1px; font-size: 7.5pt;}
-    .memo-lines { min-height: 2em; line-height: 1.0em;}
-    .memo-lines hr { margin: 0.2em 0; }
-
-    .glossary { padding-top: 3px; margin-top: 3px;}
-    .glossary h4 { font-size: 9pt; margin-bottom: 1px; }
-    .glossary ul { line-height: 1.1; }
-    .glossary .term { font-size: 7.5pt; }
-
-    .note { font-size: 7.5pt; margin-top: 3px; line-height: 1.1;}
-    .special-caution { font-size: 7.5pt; margin-top: 1px; }
-    .special-caution i { margin-right: 2px; }
+
+
+    .grid-item h4 { font-size: 10.5pt; margin: 0 0 6px 0; padding-bottom: 2px; }
+    .grid-item h5 { font-size: 9.5pt; margin: 4px 0 3px 0; }
+
+    .visual-area { padding: 5px; min-height: 25px; margin-bottom: 5px; }
+    .visual-area.small { min-height: 18px; padding: 4px; margin-bottom: 4px; }
+    .map-placeholder { min-height: 50px; }
+    .unit-placeholder { min-height: 50px; }
+
+    .staff-info { gap: 5px; margin-top: 4px; margin-bottom: 4px;}
+    .staff-item { padding: 4px 3px; min-width: 70px;}
+    .face-photo { width: 28px; height: 28px; margin: 0 auto 2px auto; }
+    .face-photo i { font-size: 1.1em; }
+    .staff-item p { font-size: 7.5pt; line-height: 1.1; }
+    .staff-name { font-size: 8pt; }
+    .highlight { font-size: 6.5pt !important; padding: 1px 3px; }
+
+    .schedule-card { gap: 4px; }
+    .schedule-group h5 { margin-bottom: 2px; }
+    .schedule-group ul { margin-top: 2px; }
+    .schedule-group li { font-size: 8pt; margin-bottom: 1px; }
+    .time { width: 35px; margin-right: 3px; font-size: 8pt; flex-shrink: 0; }
+     .schedule-group li span:not(.time) { display: inline; } /* Prevent extra line break */
+
+
+    .checklist li { margin-bottom: 1.5px; font-size: 8pt; }
+    .checklist i.far { font-size: 0.9em; margin-right: 3px; width: 11px;}
+    .priority { width: 13px; height: 13px; line-height: 13px; font-size: 6pt; margin-right: 3px;}
+
+    .compact-list li { margin-bottom: 1px; font-size: 8pt; line-height: 1.2; }
+    .no-bullet li i { margin-right: 3px; width: 10px; margin-top: 1px; font-size: 0.9em;}
+    .compact-list.two-column, .compact-list.two-column-small { column-gap: 6mm; }
+    .compact-list.two-column li, .compact-list.two-column-small li {
+         break-inside: avoid-column; padding-bottom: 1px; /* Reduced padding */
+         margin-bottom: 1px; /* Reduced margin */
+     }
+
+
+    .sub-list { padding-left: 6px; margin: 2px 0 3px 4px; border-left: 1px solid #e0e0e0; } /* Reduced margins */
+    .sub-list li { font-size: 7.5pt; margin-bottom: 0.5px; padding-left: 5px;}
+    .sub-list li::before { left: -2.5px; font-size: 0.8em;}
+
+    .special-box { padding: 5px 7px; margin-top: 5px; border-radius: 3px;}
+    .special-box p { font-size: 9pt; margin-bottom: 2px; }
+    .special-box p i { font-size: 0.9em; margin-right: 3px;}
+    .special-box .compact-list li { font-size: 7.5pt; margin-bottom: 1px; } /* Reduced margin */
+    .special-box.small-box { padding: 4px 6px; margin-top: 4px; }
+    .special-box.small-box p { font-size: 8.5pt; margin-bottom: 2px; }
+    .special-box.small-box .compact-list li { font-size: 7.5pt; margin-bottom: 1px; } /* Reduced margin */
+
+
+    .waste-bins { gap: 3px; margin-top: 3px; }
+    .bin { padding: 4px 3px; font-size: 7pt; min-height: 30px;}
+    .bin i { font-size: 1.2em; margin-bottom: 1px; }
+    .bin small { font-size: 0.75em; line-height: 1.1; }
+
+    .rewritable-area { padding: 4px; margin-top: 4px; }
+    .rewritable-area p { margin-bottom: 2px; font-size: 8pt;}
+    .memo-lines { min-height: 2.5em; line-height: 1.1em;}
+    .memo-lines hr { border: none; border-top: 1px dotted #ced4da; margin: 0.2em 0; } /* Further reduced margin */
+
+    .glossary { padding-top: 4px; margin-top: 4px;}
+    .glossary h4 { font-size: 9.5pt; margin-bottom: 2px; }
+    .glossary ul { line-height: 1.2; }
+    .glossary .term { font-size: 8pt; }
+
+    .note { font-size: 8pt; margin-top: 4px; line-height: 1.2; } /* Reduced line height */
+    .note i { margin-right: 3px; }
+
+    /* Ensure hr fits within print columns */
+    hr { border-top: 1px solid #e0e0e0; margin: 6px 0; }
 
     .page-footer {
         position: absolute;
         bottom: 3mm; /* Position relative to the @page margin */
-        right: 8mm; /* Adjusted position */
-        font-size: 6pt; /* Reduced font size */
+        right: 5mm;
+        font-size: 7pt;
         color: #777;
     }
 
@@ -514,33 +521,4 @@ ol.simple-flow li i { /* Added style for icons in ordered list */
     body > header, body > nav, body > footer, .manual-container > h1 {
         display: none;
     }
-
-     /* Ensure column layout is used and break-inside works */
-    .content-grid {
-        column-count: 2;
-        column-gap: 6mm;
-    }
-    .grid-item {
-        break-inside: avoid-column;
-    }
-    /* Page 5, 6, 7 should also use 2 columns */
-    .page.a4-landscape:nth-child(5) .content-grid,
-    .page.a4-landscape:nth-child(6) .content-grid,
-    .page.a4-landscape:nth-child(7) .content-grid {
-         column-count: 2; /* Explicitly ensure these use 2 columns */
-         column-gap: 6mm;
-    }
-    .page.a4-landscape:nth-child(5) .grid-item,
-    .page.a4-landscape:nth-child(6) .grid-item,
-    .page.a4-landscape:nth-child(7) .grid-item {
-        break-inside: avoid-column; /* Ensure items break correctly */
-        width: 100%; /* Full width within its column */
-        max-width: none;
-        margin-bottom: 4mm; /* Standard margin between items */
-    }
-     .page.a4-landscape:nth-child(5) .grid-item:last-child,
-     .page.a4-landscape:nth-child(6) .grid-item:last-child,
-     .page.a4-landscape:nth-child(7) .grid-item:last-child {
-          margin-bottom: 0; /* Remove margin on last item in the column */
-     }
 }