*{box-sizing:border-box} body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#1f2a3a;background:#f8f9fc;line-height:1.6}
a{text-decoration:none;color:#004f8b} img{max-width:100%;height:auto}
.container{width:90%;max-width:1200px;margin:0 auto;padding:20px 0}
.site-header{background:#004f8b;color:#fff;padding:10px 0;position:sticky;top:0;z-index:1000}
.logo{margin:0;font-size:1.5rem;font-weight:bold}
.site-nav a{margin-left:20px;color:#fff;font-weight:500}
.site-nav a:hover{text-decoration:underline}

.hero{background:#e9f1f8;padding:60px 0;display:flex;align-items:center}
.hero .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between}
.hero-content{flex:1 1 45%} .hero-image{flex:1 1 50%;text-align:center}
.btn-primary{display:inline-block;background:#004f8b;color:#fff;padding:10px 20px;border-radius:4px;font-weight:700}
.btn-primary:hover{background:#003f6b}

.features{background:#fff;padding:60px 0}
.features h2{text-align:center;margin-bottom:40px;font-size:2rem}
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
.feature-item{background:#f0f6fc;padding:18px;border-radius:6px;box-shadow:0 2px 4px rgba(0,0,0,.05)}
.feature-item h3{margin-top:0;color:#004f8b}

.upload{background:#e9f1f8;padding:40px 0;text-align:center}
.upload input[type="file"]{margin:15px 0}
.btn-secondary{background:#0070c0;color:#fff;padding:10px 20px;border-radius:4px;border:none;cursor:pointer}
.btn-secondary:hover{background:#005a99}

.dashboard{padding:60px 0;background:#fff}
#tableContainer{overflow-x:auto}
table{width:100%;border-collapse:collapse;margin-top:20px}
th,td{padding:8px 12px;border-bottom:1px solid #ddd;text-align:left}
th{background:#004f8b;color:#fff}
tr.alert-row{background:#ffe5e5}

.transfer-map{background:#f8f9fc;padding:60px 0}
.map-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap}
.map-filters{display:flex;gap:15px;flex-wrap:wrap}
.map-filters label{display:flex;align-items:center;gap:5px;font-size:0.9rem}
#mapContainer{display:flex;gap:20px;margin:20px 0;min-height:500px}
#mapCanvas{flex:3;background:#fff;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,0.1);position:relative;overflow:hidden}
#mapLegend{flex:1;background:#fff;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,0.1);padding:20px;height:fit-content}
#mapLegend h3{margin-top:0;color:#004f8b;border-bottom:2px solid #e9f1f8;padding-bottom:10px}
.legend-item{display:flex;align-items:center;gap:10px;margin:10px 0;font-size:0.9rem}
.shortage-marker,.surplus-marker,.balanced-marker{width:16px;height:16px;border-radius:50%;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,0.2)}
.shortage-marker{background:#dc3545}
.surplus-marker{background:#28a745}
.balanced-marker{background:#ffc107}
.critical-lane,.standard-lane{width:20px;height:4px;border-radius:2px}
.critical-lane{background:#dc3545}
.standard-lane{background:#0070c0}
#mapLocations{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2}
#mapLanes{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}
.map-location{position:absolute;width:20px;height:20px;border-radius:50%;border:3px solid #fff;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,0.3);transform:translate(-50%,-50%);transition:all 0.3s ease}
.map-location:hover{transform:translate(-50%,-50%) scale(1.2);z-index:10}
.map-location.shortage{background:#dc3545}
.map-location.surplus{background:#28a745}
.map-location.balanced{background:#ffc107}
.location-tooltip{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.8);color:#fff;padding:5px 8px;border-radius:4px;font-size:0.8rem;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity 0.3s}
.map-location:hover .location-tooltip{opacity:1}
.transfer-lane{position:absolute;z-index:1;pointer-events:none}
.lane-line{stroke-width:3;opacity:0.7;transition:all 0.3s ease}
.lane-line.critical{stroke:#dc3545;stroke-width:4}
.lane-line.standard{stroke:#0070c0}
.lane-arrow{fill:#333;opacity:0.8}
#transferSummary{background:#fff;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,0.1);padding:20px;margin-top:20px}
#transferSummary h3{margin-top:0;color:#004f8b;border-bottom:2px solid #e9f1f8;padding-bottom:10px}
.transfer-item{display:grid;grid-template-columns:1fr 100px 80px;gap:15px;padding:12px;border:1px solid #e9f1f8;border-radius:6px;margin:8px 0;transition:all 0.3s ease}
.transfer-item:hover{background:#f0f6fc;border-color:#0070c0}
.transfer-route{font-weight:600;color:#004f8b}
.transfer-details{font-size:0.9rem;color:#666;display:flex;gap:15px}
.transfer-amount{font-weight:700;color:#dc3545;text-align:center}
.transfer-distance{font-size:0.8rem;color:#999;text-align:center}

.prompt-guide{background:#fff;padding:40px 0}
.prompt-guide pre{background:#f0f6fc;border-left:4px solid #0070c0;padding:15px;overflow-x:auto;font-family:Consolas,monospace}

.site-footer{background:#004f8b;color:#fff;text-align:center;padding:20px 0}