feat(plotly): implement line-loss-training (#6650)

## Implementation: `line-loss-training` - python/plotly

Implements the **python/plotly** version of `line-loss-training`.

**File:** `plots/line-loss-training/implementations/python/plotly.py`

**Parent Issue:** #2860

---
:robot: *[impl-generate
workflow](https://github.com/MarkusNeusinger/anyplot/actions/runs/25843729734)*

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Markus Neusinger <2921697+MarkusNeusinger@users.noreply.github.com>

Author: github-actions[bot]

plots/line-loss-training/implementations/python/plotly.py

@@ -1,31 +1,46 @@
-""" pyplots.ai
+""" anyplot.ai
 line-loss-training: Training Loss Curve
-Library: plotly 6.5.0 | Python 3.13.11
-Quality: 92/100 | Created: 2025-12-31
+Library: plotly 6.7.0 | Python 3.13.13
+Quality: 91/100 | Updated: 2026-05-14
 """
 
+import os
+
 import numpy as np
 import plotly.graph_objects as go
 
 
-# Data - Simulated neural network training history
+# Theme tokens
+THEME = os.getenv("ANYPLOT_THEME", "light")
+PAGE_BG = "#FAF8F1" if THEME == "light" else "#1A1A17"
+ELEVATED_BG = "#FFFDF6" if THEME == "light" else "#242420"
+INK = "#1A1A17" if THEME == "light" else "#F0EFE8"
+INK_SOFT = "#4A4A44" if THEME == "light" else "#B8B7B0"
+GRID = "rgba(26,26,23,0.10)" if THEME == "light" else "rgba(240,239,232,0.10)"
+
+# Okabe-Ito palette
+TRAIN_COLOR = "#009E73"  # Position 1 - bluish green (brand)
+VAL_COLOR = "#D55E00"  # Position 2 - vermillion
+
+# Data - Simulated neural network training with different trajectory
 np.random.seed(42)
-epochs = np.arange(1, 101)
+epochs = np.arange(1, 71)  # 70 epochs (differentiate from 100-epoch letsplot)
 
-# Training loss: starts high, decreases with noise, eventually plateaus
-train_loss = 2.5 * np.exp(-0.05 * epochs) + 0.15 + np.random.normal(0, 0.02, len(epochs))
-train_loss = np.maximum(train_loss, 0.1)  # Ensure positive
+# Training loss: linear-like decay with small noise, flattens near end
+train_base = 2.0 - 0.025 * epochs + np.random.normal(0, 0.025, len(epochs))
+train_loss = np.maximum(train_base, 0.1)
 
-# Validation loss: follows training initially, then diverges (overfitting after epoch ~60)
-val_loss = 2.5 * np.exp(-0.045 * epochs) + 0.25 + np.random.normal(0, 0.03, len(epochs))
-# Add overfitting effect: validation loss starts increasing after epoch 60
-overfitting_effect = np.where(epochs > 60, 0.008 * (epochs - 60), 0)
-val_loss = val_loss + overfitting_effect
+# Validation loss: similar pattern but with larger noise and divergence after epoch ~45
+val_base = 2.0 - 0.020 * epochs + np.random.normal(0, 0.04, len(epochs))
+# Add gentle divergence effect
+divergence_effect = np.where(epochs > 45, 0.015 * np.sqrt(np.maximum(epochs - 45, 0)), 0)
+val_loss = val_base + divergence_effect
 val_loss = np.maximum(val_loss, 0.15)
 
-# Find minimum validation loss epoch for annotation
-min_val_epoch = epochs[np.argmin(val_loss)]
-min_val_loss = np.min(val_loss)
+# Find minimum validation loss epoch
+min_val_idx = np.argmin(val_loss)
+min_val_epoch = epochs[min_val_idx]
+min_val_loss = val_loss[min_val_idx]
 
 # Create figure
 fig = go.Figure()
@@ -37,8 +52,8 @@
         y=train_loss,
         mode="lines",
         name="Training Loss",
-        line=dict(color="#306998", width=3),
-        hovertemplate="Epoch %{x}<br>Training Loss: %{y:.4f}<extra></extra>",
+        line=dict(color=TRAIN_COLOR, width=4),
+        hovertemplate="Epoch %{x}<br>Training Loss: %{y:.3f}<extra></extra>",
     )
 )
 
@@ -49,57 +64,66 @@
         y=val_loss,
         mode="lines",
         name="Validation Loss",
-        line=dict(color="#FFD43B", width=3),
-        hovertemplate="Epoch %{x}<br>Validation Loss: %{y:.4f}<extra></extra>",
+        line=dict(color=VAL_COLOR, width=4),
+        hovertemplate="Epoch %{x}<br>Validation Loss: %{y:.3f}<extra></extra>",
     )
 )
 
-# Mark minimum validation loss point
+# Optimal stopping point marker
 fig.add_trace(
     go.Scatter(
         x=[min_val_epoch],
         y=[min_val_loss],
-        mode="markers+text",
-        name="Best Epoch",
-        marker=dict(color="#E74C3C", size=16, symbol="star"),
-        text=[f"Best: Epoch {min_val_epoch}"],
-        textposition="top center",
-        textfont=dict(size=16, color="#E74C3C"),
-        hovertemplate="Best Epoch: %{x}<br>Min Val Loss: %{y:.4f}<extra></extra>",
+        mode="markers",
+        name="Optimal Epoch",
+        marker=dict(color=VAL_COLOR, size=20, symbol="diamond", line=dict(color=INK, width=2)),
+        hovertemplate="Optimal Epoch: %{x}<br>Min Validation Loss: %{y:.3f}<extra></extra>",
     )
 )
 
-# Update layout
+# Add vertical line at optimal epoch using shape
+fig.add_shape(
+    type="line",
+    x0=min_val_epoch,
+    x1=min_val_epoch,
+    y0=0,
+    y1=max(train_loss.max(), val_loss.max()),
+    line=dict(color=VAL_COLOR, width=1.5, dash="dash"),
+    opacity=0.3,
+)
+
+# Update layout with theme-adaptive styling
 fig.update_layout(
-    title=dict(text="line-loss-training · plotly · pyplots.ai", font=dict(size=28), x=0.5, xanchor="center"),
+    title=dict(text="line-loss-training · plotly · anyplot.ai", font=dict(size=28, color=INK), x=0.5, xanchor="center"),
     xaxis=dict(
-        title=dict(text="Epoch", font=dict(size=22)),
-        tickfont=dict(size=18),
-        gridcolor="rgba(128, 128, 128, 0.3)",
+        title=dict(text="Epoch", font=dict(size=22, color=INK)),
+        tickfont=dict(size=18, color=INK_SOFT),
+        gridcolor=GRID,
         gridwidth=1,
-        showgrid=True,
-        range=[0, 105],
+        linecolor=INK_SOFT,
+        linewidth=1.5,
+        zerolinecolor=INK_SOFT,
+        zerolinewidth=0,
     ),
     yaxis=dict(
-        title=dict(text="Cross-Entropy Loss", font=dict(size=22)),
-        tickfont=dict(size=18),
-        gridcolor="rgba(128, 128, 128, 0.3)",
+        title=dict(text="Cross-Entropy Loss", font=dict(size=22, color=INK)),
+        tickfont=dict(size=18, color=INK_SOFT),
+        gridcolor=GRID,
         gridwidth=1,
-        showgrid=True,
+        linecolor=INK_SOFT,
+        linewidth=1.5,
+        zerolinecolor=INK_SOFT,
+        zerolinewidth=0,
     ),
     legend=dict(
-        font=dict(size=18),
-        x=0.75,
-        y=0.95,
-        bgcolor="rgba(255, 255, 255, 0.8)",
-        bordercolor="rgba(128, 128, 128, 0.3)",
-        borderwidth=1,
+        font=dict(size=18, color=INK_SOFT), bgcolor=ELEVATED_BG, bordercolor=INK_SOFT, borderwidth=1.5, x=0.72, y=0.97
     ),
-    template="plotly_white",
-    margin=dict(l=100, r=80, t=100, b=100),
-    plot_bgcolor="white",
+    paper_bgcolor=PAGE_BG,
+    plot_bgcolor=PAGE_BG,
+    margin=dict(l=120, r=100, t=110, b=110),
+    hovermode="x unified",
 )
 
-# Save as PNG and HTML
-fig.write_image("plot.png", width=1600, height=900, scale=3)
-fig.write_html("plot.html", include_plotlyjs="cdn")
+# Save outputs
+fig.write_image(f"plot-{THEME}.png", width=1600, height=900, scale=3)
+fig.write_html(f"plot-{THEME}.html", include_plotlyjs="cdn")