:root {
        --primary: #002b5c; /* Lincoln Blue */
        --secondary: #008eb5;
        --accent: #facc15;
        --bg-color: #f8fafc;
        --text-main: #1e293b;
        --text-muted: #475569;
        --control-color: #10b981;
        --mp-color: #ef4444;
        --undyed-color: #f59e0b;
        --card-bg: #ffffff;
        --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
      }

      body {
        background: #1e293b;
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        min-height: 100vh;
        font-family: 'Inter', sans-serif;
      }

      .poster-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
      }

      .poster-container {
        flex-shrink: 0;
        transform-origin: center center;
        width: 1050px;
        height: 1485px; /* A4 Portrait */
        background: white;
        padding: 20px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.1);
        display: flex;
        flex-direction: column;
        gap: 12px;
        position: relative;
        overflow: hidden;
        box-sizing: border-box;
      }

      .poster-container::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 12px;
        background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
      }

      header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: var(--card-bg);
        border-radius: 12px;
        padding: 8px 16px;
        margin-bottom: 6px;
        box-shadow: var(--shadow);
        border: 1px solid #e2e8f0;
      }

      .logo-img {
        height: 80px;
        width: auto;
        max-width: 150px;
        object-fit: contain;
      }

      .title-section {
        flex-grow: 1;
        text-align: center;
        padding: 0 30px;
      }

      .title-section h1 {
        font-family: 'Merriweather', serif;
        color: var(--primary);
        font-size: 28px;
        font-weight: 700;
        margin: 0 0 6px 0;
        line-height: 1.2;
      }

      .title-section h1 i {
        color: var(--secondary);
      }

      .title-section h2 {
        color: var(--text-main);
        font-size: 17px;
        font-weight: 600;
        margin: 0 0 5px 0;
      }

      .title-section .affiliations {
        color: var(--text-muted);
        font-size: 13px;
        font-style: italic;
        font-weight: 500;
      }

      .main-content {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 16px;
        flex: 1;
        min-height: 0;
        min-width: 0;
      }

      .poster-column {
        display: flex;
        flex-direction: column;
        gap: 14px;
        height: 100%;
        min-width: 0;
        min-height: 0;
      }

      .section {
        background: var(--card-bg);
        border-radius: 12px;
        padding: 12px 16px;
        box-shadow: var(--shadow);
        display: flex;
        flex-direction: column;
        border: 1px solid #e2e8f0;
        position: relative;
        overflow: hidden;
        min-width: 0;
      }

      .section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 14px;
        width: 30px;
        height: 4px;
        background: var(--secondary);
        border-radius: 0 0 4px 4px;
      }

      .section h3 {
        color: var(--primary);
        margin: 0 0 10px 0;
        font-size: 16px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        flex-shrink: 0;
        border-bottom: 2px solid #f1f5f9;
        padding-bottom: 6px;
      }

      p, li {
        font-size: 11.5px;
        line-height: 1.45;
        color: var(--text-main);
        margin-top: 0;
        margin-bottom: 6px;
        text-align: justify;
      }

      ul {
        padding-left: 18px;
        margin-bottom: 6px;
      }

      .highlight {
        font-weight: 700;
        color: var(--primary);
        background: #f0f9ff;
        padding: 2px 6px;
        border-radius: 4px;
      }

      .chart-box {
        background: #f8fafc;
        border: 1px solid #cbd5e1;
        border-radius: 8px;
        padding: 10px;
        margin-top: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        box-sizing: border-box;
      }

      .chart-container {
        position: relative;
        width: 100%;
        display: flex;
        justify-content: center;
      }
      
      .stacked-charts {
        display: flex;
        flex-direction: column;
        gap: 12px;
        width: 100%;
      }

      .stacked-chart-container {
        position: relative;
        width: 100%;
      }

      .fig-caption {
        font-size: 10px;
        font-weight: 600;
        color: var(--text-muted);
        text-align: center;
        margin-top: 6px;
        line-height: 1.2;
      }

      /* Method Flow */
      .methodology-flow {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        gap: 6px;
        box-sizing: border-box;
      }
      .flow-row {
        display: flex;
        justify-content: center;
        gap: 8px; 
        width: 100%;
        box-sizing: border-box;
      }
      .flow-box {
        background: white;
        border: 2px solid #e2e8f0;
        border-radius: 8px;
        padding: 8px; 
        flex: 1;
        min-width: 0; 
        display: flex;
        flex-direction: column;
        align-items: center;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
        box-sizing: border-box;
      }
      .flow-box-full {
        width: 100%;
        flex: none;
      }
      .flow-title {
        color: var(--primary);
        font-weight: 800;
        font-size: 11.5px;
        margin-bottom: 6px;
        text-align: center;
        width: 100%;
        line-height: 1.2;
      }
      .flow-inner-box {
        border: 1px dashed #cbd5e1;
        background: #f8fafc;
        width: 100%; 
        min-height: 28px;
        height: auto;
        padding: 6px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 4px;
        font-size: 11px;
        color: #64748b;
        font-weight: bold;
        text-align: center;
        line-height: 1.2;
      }
      .flow-arrow {
        color: var(--secondary);
        font-size: 20px; 
        line-height: 1;
        font-weight: 800;
        margin: -4px 0;
      }
      .flow-list {
        margin: 0;
        padding-left: 16px;
        font-size: 10.5px; 
        width: 100%;
        text-align: left;
        color: var(--text-main);
        line-height: 1.4;
        box-sizing: border-box;
      }
      .flow-list li {
        margin-bottom: 3px;
      }

      /* Results Layout */
      .result-subsection {
        background: rgba(248, 250, 252, 0.5);
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        padding: 10px; 
        margin-bottom: 8px; 
        display: flex;
        flex-direction: column;
        min-width: 0;
      }
      .result-subsection h4 {
        color: var(--primary);
        font-size: 14px;
        margin: 0 0 8px 0;
        font-weight: 700;
        border-bottom: 1px dotted #cbd5e1;
        padding-bottom: 4px;
      }
      .desc-text {
        font-size: 11.5px;
        color: var(--text-main);
        line-height: 1.45;
        margin: 6px 0 0 0;
        text-align: justify;
      }
      
      .data-grid {
        display: grid;
        grid-template-columns: 80px minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);
        gap: 1px;
        background: #cbd5e1;
        border: 1px solid #cbd5e1;
        border-radius: 6px;
        overflow: hidden;
        margin-bottom: 8px; 
      }
      .data-grid > div {
        background: white;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5px;
        font-size: 11px; 
      }
      .grid-header { font-weight: 700; background: var(--primary) !important; color: white; }
      .grid-row-label { font-weight: 700; background: #f1f5f9 !important; color: var(--primary); justify-content: flex-start !important; padding-left: 8px !important; }
      .grid-cell { font-family: monospace; color: var(--text-main); font-size: 11px; }

      /* Microscopy CSS Art */
      .micro-grid-horizontal {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        background: #f8fafc;
        border: 1px solid #cbd5e1;
        border-radius: 8px;
        padding: 8px 12px;
        box-sizing: border-box;
        margin-bottom: 6px;
      }
      .micro-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 4px;
      }
      .micro-view {
        width: 60px; 
        height: 60px; 
        background: #0f172a;
        border-radius: 50%;
        position: relative;
        border: 3px solid #334155;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 6px rgba(0,0,0,0.2);
      }
      .micro-plastic {
        width: 32px; 
        height: 42px; 
        background: #e11d48;
        opacity: 0.85;
        border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
        position: absolute;
        filter: blur(0.5px);
        box-shadow: inset -5px -5px 10px rgba(0,0,0,0.3);
      }
      .algae-cell {
        width: 4px; 
        height: 4px; 
        background: #22c55e;
        border-radius: 50%;
        position: absolute;
        box-shadow: 0 0 2px #4ade80;
        z-index: 10;
      }
      
      .temp18 .a1 { top: 40%; left: 35%; }
      .temp18 .a2 { top: 55%; left: 58%; }
      .temp20 .a1 { top: 30%; left: 45%; }
      .temp20 .a2 { top: 50%; left: 30%; }
      .temp20 .a3 { top: 60%; left: 55%; }
      .temp20 .a4 { top: 45%; left: 65%; }
      .temp25 .a1 { top: 35%; left: 45%; width: 5px; height: 5px; box-shadow: 3px 2px 0 #22c55e, -2px 3px 0 #22c55e; }
      .temp25 .a2 { top: 60%; left: 48%; width: 6px; height: 6px; box-shadow: -3px -3px 0 #22c55e, 4px -2px 0 #22c55e; }
      .temp25 .a3 { top: 40%; left: 65%; }
      .temp30 .micro-plastic { filter: blur(1px); }
      .temp30 .algae-cell { width: 5px; height: 5px; }
      .temp30 .a1 { top: 30%; left: 40%; box-shadow: 4px 2px 0 #22c55e, -3px 4px 0 #22c55e, 5px 6px 0 #22c55e; }
      .temp30 .a2 { top: 50%; left: 45%; box-shadow: -4px -4px 0 #22c55e, 4px -3px 0 #22c55e, -2px 5px 0 #22c55e, 6px 4px 0 #22c55e; }
      .temp30 .a3 { top: 65%; left: 55%; box-shadow: -4px 2px 0 #22c55e, 3px 3px 0 #22c55e; }
      .temp30 .a4 { top: 35%; left: 60%; box-shadow: -3px 4px 0 #22c55e, 2px 5px 0 #22c55e; }
      .temp30 .a5 { top: 50%; left: 30%; box-shadow: 3px 3px 0 #22c55e; }

      .micro-label { font-size: 11px; font-weight: 600; color: var(--text-main); margin-top: 4px; }

      @media print {
        @page { size: A4 portrait; margin: 0; }
        body { background: white !important; display: block !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
        .poster-wrapper { display: block !important; width: 100% !important; height: auto !important; }
        .poster-container { box-shadow: none !important; transform: none !important; margin: 0 !important; width: 1050px !important; height: 1485px !important; }
      }