diff --git a/frontend/assets/images/facilities/circuit_boards_facility.jpg b/frontend/assets/images/facilities/circuit_boards_facility.jpg new file mode 100644 index 0000000..0614e4c Binary files /dev/null and b/frontend/assets/images/facilities/circuit_boards_facility.jpg differ diff --git a/frontend/assets/images/facilities/coal_facility.jpg b/frontend/assets/images/facilities/coal_facility.jpg new file mode 100644 index 0000000..67fd191 Binary files /dev/null and b/frontend/assets/images/facilities/coal_facility.jpg differ diff --git a/frontend/assets/images/facilities/commercial_trucks_facility.jpg b/frontend/assets/images/facilities/commercial_trucks_facility.jpg new file mode 100644 index 0000000..a14fff5 Binary files /dev/null and b/frontend/assets/images/facilities/commercial_trucks_facility.jpg differ diff --git a/frontend/assets/images/facilities/crude_oil_facility.jpg b/frontend/assets/images/facilities/crude_oil_facility.jpg new file mode 100644 index 0000000..92ff7b6 Binary files /dev/null and b/frontend/assets/images/facilities/crude_oil_facility.jpg differ diff --git a/frontend/assets/images/facilities/engines_facility.jpg b/frontend/assets/images/facilities/engines_facility.jpg new file mode 100644 index 0000000..7ff401b Binary files /dev/null and b/frontend/assets/images/facilities/engines_facility.jpg differ diff --git a/frontend/assets/images/facilities/flour_facility.jpg b/frontend/assets/images/facilities/flour_facility.jpg new file mode 100644 index 0000000..fee54eb Binary files /dev/null and b/frontend/assets/images/facilities/flour_facility.jpg differ diff --git a/frontend/assets/images/facilities/fresh_bread_facility.jpg b/frontend/assets/images/facilities/fresh_bread_facility.jpg new file mode 100644 index 0000000..e3fa46e Binary files /dev/null and b/frontend/assets/images/facilities/fresh_bread_facility.jpg differ diff --git a/frontend/assets/images/facilities/furniture_facility.jpg b/frontend/assets/images/facilities/furniture_facility.jpg new file mode 100644 index 0000000..883bd3b Binary files /dev/null and b/frontend/assets/images/facilities/furniture_facility.jpg differ diff --git a/frontend/assets/images/facilities/iron_ore_facility.jpg b/frontend/assets/images/facilities/iron_ore_facility.jpg new file mode 100644 index 0000000..9d057d6 Binary files /dev/null and b/frontend/assets/images/facilities/iron_ore_facility.jpg differ diff --git a/frontend/assets/images/facilities/metal_frames_facility.jpg b/frontend/assets/images/facilities/metal_frames_facility.jpg new file mode 100644 index 0000000..1e1270f Binary files /dev/null and b/frontend/assets/images/facilities/metal_frames_facility.jpg differ diff --git a/frontend/assets/images/facilities/microchips_facility.jpg b/frontend/assets/images/facilities/microchips_facility.jpg new file mode 100644 index 0000000..ad8ddf0 Binary files /dev/null and b/frontend/assets/images/facilities/microchips_facility.jpg differ diff --git a/frontend/assets/images/facilities/packaged_meals_facility.jpg b/frontend/assets/images/facilities/packaged_meals_facility.jpg new file mode 100644 index 0000000..1badd68 Binary files /dev/null and b/frontend/assets/images/facilities/packaged_meals_facility.jpg differ diff --git a/frontend/assets/images/facilities/paper_facility.jpg b/frontend/assets/images/facilities/paper_facility.jpg new file mode 100644 index 0000000..02f6344 Binary files /dev/null and b/frontend/assets/images/facilities/paper_facility.jpg differ diff --git a/frontend/assets/images/facilities/planks_facility.jpg b/frontend/assets/images/facilities/planks_facility.jpg new file mode 100644 index 0000000..ac81870 Binary files /dev/null and b/frontend/assets/images/facilities/planks_facility.jpg differ diff --git a/frontend/assets/images/facilities/polymers_facility.jpg b/frontend/assets/images/facilities/polymers_facility.jpg new file mode 100644 index 0000000..5bb7f63 Binary files /dev/null and b/frontend/assets/images/facilities/polymers_facility.jpg differ diff --git a/frontend/assets/images/facilities/refined_sugar_facility.jpg b/frontend/assets/images/facilities/refined_sugar_facility.jpg new file mode 100644 index 0000000..2aaf7a8 Binary files /dev/null and b/frontend/assets/images/facilities/refined_sugar_facility.jpg differ diff --git a/frontend/assets/images/facilities/silica_sand_facility.jpg b/frontend/assets/images/facilities/silica_sand_facility.jpg new file mode 100644 index 0000000..b7d4a64 Binary files /dev/null and b/frontend/assets/images/facilities/silica_sand_facility.jpg differ diff --git a/frontend/assets/images/facilities/silicon_facility.jpg b/frontend/assets/images/facilities/silicon_facility.jpg new file mode 100644 index 0000000..99eb501 Binary files /dev/null and b/frontend/assets/images/facilities/silicon_facility.jpg differ diff --git a/frontend/assets/images/facilities/smartphones_facility.jpg b/frontend/assets/images/facilities/smartphones_facility.jpg new file mode 100644 index 0000000..bea3623 Binary files /dev/null and b/frontend/assets/images/facilities/smartphones_facility.jpg differ diff --git a/frontend/assets/images/facilities/steel_ingots_facility.jpg b/frontend/assets/images/facilities/steel_ingots_facility.jpg new file mode 100644 index 0000000..7bbf0d9 Binary files /dev/null and b/frontend/assets/images/facilities/steel_ingots_facility.jpg differ diff --git a/frontend/assets/images/facilities/sugar_beet_facility.jpg b/frontend/assets/images/facilities/sugar_beet_facility.jpg new file mode 100644 index 0000000..a4e4a57 Binary files /dev/null and b/frontend/assets/images/facilities/sugar_beet_facility.jpg differ diff --git a/frontend/assets/images/facilities/timber_facility.jpg b/frontend/assets/images/facilities/timber_facility.jpg new file mode 100644 index 0000000..67364d5 Binary files /dev/null and b/frontend/assets/images/facilities/timber_facility.jpg differ diff --git a/frontend/assets/images/facilities/wheat_facility.jpg b/frontend/assets/images/facilities/wheat_facility.jpg new file mode 100644 index 0000000..172994e Binary files /dev/null and b/frontend/assets/images/facilities/wheat_facility.jpg differ diff --git a/frontend/assets/images/products/circuit_boards_product.jpg b/frontend/assets/images/products/circuit_boards_product.jpg new file mode 100644 index 0000000..ce1e9e4 Binary files /dev/null and b/frontend/assets/images/products/circuit_boards_product.jpg differ diff --git a/frontend/assets/images/products/coal_product.jpg b/frontend/assets/images/products/coal_product.jpg new file mode 100644 index 0000000..f312a2f Binary files /dev/null and b/frontend/assets/images/products/coal_product.jpg differ diff --git a/frontend/assets/images/products/commercial_trucks_product.jpg b/frontend/assets/images/products/commercial_trucks_product.jpg new file mode 100644 index 0000000..99d9534 Binary files /dev/null and b/frontend/assets/images/products/commercial_trucks_product.jpg differ diff --git a/frontend/assets/images/products/crude_oil_product.jpg b/frontend/assets/images/products/crude_oil_product.jpg new file mode 100644 index 0000000..a817cb6 Binary files /dev/null and b/frontend/assets/images/products/crude_oil_product.jpg differ diff --git a/frontend/assets/images/products/engines_product.jpg b/frontend/assets/images/products/engines_product.jpg new file mode 100644 index 0000000..7e87383 Binary files /dev/null and b/frontend/assets/images/products/engines_product.jpg differ diff --git a/frontend/assets/images/products/flour_product.jpg b/frontend/assets/images/products/flour_product.jpg new file mode 100644 index 0000000..d3ee657 Binary files /dev/null and b/frontend/assets/images/products/flour_product.jpg differ diff --git a/frontend/assets/images/products/fresh_bread_product.jpg b/frontend/assets/images/products/fresh_bread_product.jpg new file mode 100644 index 0000000..88b5e86 Binary files /dev/null and b/frontend/assets/images/products/fresh_bread_product.jpg differ diff --git a/frontend/assets/images/products/furniture_product.jpg b/frontend/assets/images/products/furniture_product.jpg new file mode 100644 index 0000000..1e4e6da Binary files /dev/null and b/frontend/assets/images/products/furniture_product.jpg differ diff --git a/frontend/assets/images/products/iron_ore_product.jpg b/frontend/assets/images/products/iron_ore_product.jpg new file mode 100644 index 0000000..29f5df2 Binary files /dev/null and b/frontend/assets/images/products/iron_ore_product.jpg differ diff --git a/frontend/assets/images/products/metal_frames_product.jpg b/frontend/assets/images/products/metal_frames_product.jpg new file mode 100644 index 0000000..c5a241f Binary files /dev/null and b/frontend/assets/images/products/metal_frames_product.jpg differ diff --git a/frontend/assets/images/products/microchips_product.jpg b/frontend/assets/images/products/microchips_product.jpg new file mode 100644 index 0000000..040b803 Binary files /dev/null and b/frontend/assets/images/products/microchips_product.jpg differ diff --git a/frontend/assets/images/products/packaged_meals_product.jpg b/frontend/assets/images/products/packaged_meals_product.jpg new file mode 100644 index 0000000..cfdcd17 Binary files /dev/null and b/frontend/assets/images/products/packaged_meals_product.jpg differ diff --git a/frontend/assets/images/products/paper_product.jpg b/frontend/assets/images/products/paper_product.jpg new file mode 100644 index 0000000..b54f98f Binary files /dev/null and b/frontend/assets/images/products/paper_product.jpg differ diff --git a/frontend/assets/images/products/planks_product.jpg b/frontend/assets/images/products/planks_product.jpg new file mode 100644 index 0000000..8c8ce74 Binary files /dev/null and b/frontend/assets/images/products/planks_product.jpg differ diff --git a/frontend/assets/images/products/polymers_product.jpg b/frontend/assets/images/products/polymers_product.jpg new file mode 100644 index 0000000..6b28d1f Binary files /dev/null and b/frontend/assets/images/products/polymers_product.jpg differ diff --git a/frontend/assets/images/products/refined_sugar_product.jpg b/frontend/assets/images/products/refined_sugar_product.jpg new file mode 100644 index 0000000..6602bf2 Binary files /dev/null and b/frontend/assets/images/products/refined_sugar_product.jpg differ diff --git a/frontend/assets/images/products/silica_sand_product.jpg b/frontend/assets/images/products/silica_sand_product.jpg new file mode 100644 index 0000000..e6fe3e1 Binary files /dev/null and b/frontend/assets/images/products/silica_sand_product.jpg differ diff --git a/frontend/assets/images/products/silicon_product.jpg b/frontend/assets/images/products/silicon_product.jpg new file mode 100644 index 0000000..307bc22 Binary files /dev/null and b/frontend/assets/images/products/silicon_product.jpg differ diff --git a/frontend/assets/images/products/smartphones_product.jpg b/frontend/assets/images/products/smartphones_product.jpg new file mode 100644 index 0000000..27e51d4 Binary files /dev/null and b/frontend/assets/images/products/smartphones_product.jpg differ diff --git a/frontend/assets/images/products/steel_ingots_product.jpg b/frontend/assets/images/products/steel_ingots_product.jpg new file mode 100644 index 0000000..fc6fc2f Binary files /dev/null and b/frontend/assets/images/products/steel_ingots_product.jpg differ diff --git a/frontend/assets/images/products/sugar_beet_product.jpg b/frontend/assets/images/products/sugar_beet_product.jpg new file mode 100644 index 0000000..16ea08d Binary files /dev/null and b/frontend/assets/images/products/sugar_beet_product.jpg differ diff --git a/frontend/assets/images/products/timber_product.jpg b/frontend/assets/images/products/timber_product.jpg new file mode 100644 index 0000000..4b49b54 Binary files /dev/null and b/frontend/assets/images/products/timber_product.jpg differ diff --git a/frontend/assets/images/products/wheat_product.jpg b/frontend/assets/images/products/wheat_product.jpg new file mode 100644 index 0000000..e9f1d2a Binary files /dev/null and b/frontend/assets/images/products/wheat_product.jpg differ diff --git a/frontend/css/views/unitDetail.css b/frontend/css/views/unitDetail.css index e3078cd..51d0b24 100644 --- a/frontend/css/views/unitDetail.css +++ b/frontend/css/views/unitDetail.css @@ -141,14 +141,15 @@ font-size: 0.88rem; } -/* Dual Photographic Cards Grid */ +/* Asymmetric Visual Showcase (Product Primacy & Architectural Reference) */ .dossier-photo-grid { display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: 1.45fr 1fr; gap: 16px; + align-items: stretch; } -@media (max-width: 900px) { +@media (max-width: 960px) { .dossier-photo-grid { grid-template-columns: 1fr; } @@ -161,8 +162,16 @@ padding: 16px; display: flex; flex-direction: column; + justify-content: space-between; gap: 12px; box-shadow: var(--shadow-sm); + position: relative; + overflow: hidden; +} + +.dossier-photo-card.hero-product-card { + border-color: var(--border-subtle); + box-shadow: var(--shadow-md); } .photo-card-header { @@ -178,20 +187,22 @@ color: var(--text-secondary); display: inline-flex; align-items: center; - gap: 5px; + gap: 6px; + letter-spacing: 0.03em; } .photo-spec { font-size: 0.75rem; + font-weight: 700; color: var(--primary-blue); background: var(--primary-blue-light); - padding: 2px 8px; + padding: 3px 8px; border-radius: 4px; } .photo-wrapper { width: 100%; - height: 220px; + height: 240px; border-radius: var(--radius-md); background: var(--bg-surface-sub); border: 1px solid var(--border-color); @@ -202,6 +213,10 @@ justify-content: center; } +.photo-wrapper.secondary-wrapper { + height: 200px; +} + .dossier-photo-img { width: 100%; height: 100%; @@ -213,33 +228,69 @@ flex-direction: column; align-items: center; justify-content: center; - gap: 8px; + gap: 10px; text-align: center; - padding: 20px; + padding: 24px; } .photo-fallback-icon { - font-size: 3rem; + font-size: 3.2rem; + opacity: 0.9; } .photo-fallback-title { - font-size: 1rem; - font-weight: 700; + font-size: 1.05rem; + font-weight: 800; color: var(--text-primary); } .photo-fallback-sub { - font-size: 0.72rem; + font-size: 0.75rem; + color: var(--text-secondary); + max-width: 320px; + line-height: 1.4; +} + +.product-quick-stats { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 10px; + background: var(--bg-surface-sub); + border: 1px solid var(--border-color); + border-radius: var(--radius-sm); + padding: 10px 14px; +} + +.p-stat-item { + display: flex; + flex-direction: column; +} + +.p-stat-label { + font-size: 0.68rem; + font-weight: 700; color: var(--text-muted); - font-family: var(--font-mono); + text-transform: uppercase; + letter-spacing: 0.03em; +} + +.p-stat-val { + font-size: 0.95rem; + font-weight: 800; + color: var(--text-primary); + margin-top: 2px; } .photo-caption { font-size: 0.78rem; color: var(--text-secondary); - font-style: italic; - border-left: 2px solid var(--border-color); - padding-left: 8px; + border-left: 2px solid var(--primary-blue); + padding-left: 10px; + line-height: 1.4; +} + +.photo-caption.secondary-caption { + border-left-color: var(--border-subtle); } /* Deep Statistical Matrix */ @@ -323,6 +374,38 @@ border-radius: var(--radius-sm); } +.risk-badge { + display: inline-flex; + align-items: center; + gap: 4px; + padding: 2px 8px; + border-radius: 4px; + font-size: 0.70rem; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.03em; +} + +.risk-badge.risk-optimal { + background: var(--emerald-light); + color: var(--emerald-dark); +} + +.risk-badge.risk-low { + background: var(--amber-light); + color: var(--amber-dark); +} + +.risk-badge.risk-bottleneck { + background: #fee2e2; + color: #b91c1c; +} + +[data-theme="dark"] .risk-badge.risk-bottleneck { + background: #450a0a; + color: #f87171; +} + /* Strategic Controls Grid */ .dossier-control-grid { display: grid; diff --git a/frontend/js/ui/unitDetailView.js b/frontend/js/ui/unitDetailView.js index b28a7cd..5a9d893 100644 --- a/frontend/js/ui/unitDetailView.js +++ b/frontend/js/ui/unitDetailView.js @@ -60,17 +60,43 @@ export function mountUnitDetailView(container, state, onAction, engine) { const revPerSec = rates.revRate || 0; const revPerHour = revPerSec * 3600; - // Valuation contribution + // Valuation and Revenue Contribution const facilityValuation = (pState.lines || 0) * product.baseFacilityCost; const inventoryValuation = (pState.stock || 0) * product.basePrice; + const totalCompanyCashRate = engine?.cashRate || 0; + const companyRevShare = totalCompanyCashRate > 0.001 + ? Math.min(100, Math.max(0, (rates.revRate / totalCompanyCashRate) * 100)) + : 0; - // Dual Photographic URLs (with standardized paths) + // Actual Cycle Time adjusted for milestone speed multiplier & throttle + const effectiveCycleTime = product.baseCycleTime / (milestoneMult * Math.max(0.01, currentThrottle)); + const effectiveLines = (pState.lines || 0) * currentThrottle; + + // Upstream Stock & Bottleneck Risk Assessment + let bottleneckStatus = 'optimal'; + let bottleneckLabel = 'Optimal Input Reserves'; + if (product.inputs && product.inputs.length > 0) { + for (const inp of product.inputs) { + const parentState = state.products[inp.id]; + const neededPerBatch = inp.amount * (pState.lines || 1); + if (!parentState || (parentState.stock || 0) < 1) { + bottleneckStatus = 'bottleneck'; + bottleneckLabel = 'Starved: Zero Raw Materials'; + break; + } else if ((parentState.stock || 0) < neededPerBatch) { + bottleneckStatus = 'low'; + bottleneckLabel = 'Low Upstream Reserves'; + } + } + } + + // Photographic Asset Paths const facilityImgPath = `assets/images/facilities/${product.id}_facility.jpg`; const productImgPath = `assets/images/products/${product.id}_product.jpg`; let html = `
${product.description}