@media (min-width: 880px){article.svelte-13fi44j .playground{grid-template-columns:minmax(0,1.65fr) minmax(16rem,.85fr);align-items:start}}article.svelte-13fi44j .readout output[data-mood=rising]{color:#16a34a}article.svelte-13fi44j .readout output[data-mood=falling]{color:#dc2626}article.svelte-13fi44j .graph{display:block;width:100%;height:auto;border-radius:.4rem}article.svelte-13fi44j .graph .bg{fill:transparent}article.svelte-13fi44j .graph .grid line{stroke:color-mix(in srgb,var(--ink) 12%,transparent);stroke-width:1;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph .axes line{stroke:color-mix(in srgb,var(--ink) 60%,transparent);stroke-width:1.5;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph .ticks text{fill:color-mix(in srgb,var(--ink) 70%,transparent);font-size:10px;text-anchor:middle;font-family:ui-monospace,monospace}article.svelte-13fi44j .graph .ticks text.ytick{text-anchor:end}article.svelte-13fi44j .graph .overlay{cursor:grab;touch-action:none;fill:transparent}article.svelte-13fi44j .graph .overlay:active{cursor:grabbing}article.svelte-13fi44j .graph :is(.curve,.tangent,.secant,.deriv,.accum,.guide,.guide-dx,.guide-dy,.guide-actual){fill:none;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph .curve{stroke:#2563eb;stroke-width:2.5}article.svelte-13fi44j .graph .contour{fill:none;stroke:#2563eb;stroke-width:1.5;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph .tangent{stroke:#dc2626;stroke-width:2;opacity:.9}article.svelte-13fi44j .graph .secant{stroke:#f59e0b;stroke-width:2;stroke-dasharray:6 5;opacity:.9}article.svelte-13fi44j .graph .deriv{stroke:#16a34a;stroke-width:2;stroke-dasharray:5 4}article.svelte-13fi44j .graph .accum{stroke:#16a34a;stroke-width:2.5}article.svelte-13fi44j .graph .guide{stroke:color-mix(in srgb,var(--ink) 55%,transparent);stroke-width:1.5;stroke-dasharray:3 3}article.svelte-13fi44j .graph .guide-dx{stroke:#0ea5e9;stroke-width:2}article.svelte-13fi44j .graph .guide-dy{stroke:#dc2626;stroke-width:2}article.svelte-13fi44j .graph .guide-actual{stroke:#f59e0b;stroke-width:2;stroke-dasharray:4 3}article.svelte-13fi44j .graph .link{stroke:color-mix(in srgb,var(--ink) 40%,transparent);stroke-width:1;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph .bound{stroke:color-mix(in srgb,var(--ink) 45%,transparent);stroke-width:1.5;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph .area{fill:color-mix(in srgb,#2563eb 22%,transparent);stroke:none}article.svelte-13fi44j .graph .rect-pos{fill:color-mix(in srgb,#2563eb 30%,transparent);stroke:#2563eb;stroke-width:1;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph .rect-neg{fill:color-mix(in srgb,#dc2626 30%,transparent);stroke:#dc2626;stroke-width:1;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph :is(.point,.point-b,.point-d){stroke:var(--paper);stroke-width:1.5;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph .point{fill:#2563eb}article.svelte-13fi44j .graph .point-b{fill:#f59e0b}article.svelte-13fi44j .graph .point-d{fill:#16a34a}article.svelte-13fi44j .graph.surface3d{touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}article.svelte-13fi44j .graph.surface3d:active{cursor:grabbing}article.svelte-13fi44j .graph.surface3d .ground .boundary{fill:none;stroke:color-mix(in srgb,var(--ink) 28%,transparent);stroke-width:1.5;stroke-dasharray:6 4;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph.surface3d .ground .axis{stroke:color-mix(in srgb,var(--ink) 42%,transparent);stroke-width:1.5;vector-effect:non-scaling-stroke}article.svelte-13fi44j .graph.surface3d .net .wire{fill:none;stroke:#2563eb;stroke-width:1;vector-effect:non-scaling-stroke;opacity:.85}article.svelte-13fi44j .graph .contour3d{fill:none;stroke:#2563eb;stroke-width:1.5;stroke-dasharray:5 4;vector-effect:non-scaling-stroke;opacity:.6}article.svelte-13fi44j .graph .grad-head{fill:#dc2626}@media (prefers-color-scheme: dark){article.svelte-13fi44j .graph .curve{stroke:#60a5fa}article.svelte-13fi44j .graph .contour{stroke:#60a5fa}article.svelte-13fi44j .graph .tangent{stroke:#f87171}article.svelte-13fi44j .graph .secant{stroke:#fbbf24}article.svelte-13fi44j .graph .deriv,article.svelte-13fi44j .graph .accum{stroke:#4ade80}article.svelte-13fi44j .graph .guide-dx{stroke:#38bdf8}article.svelte-13fi44j .graph .guide-dy{stroke:#f87171}article.svelte-13fi44j .graph .guide-actual{stroke:#fbbf24}article.svelte-13fi44j .graph .area{fill:color-mix(in srgb,#60a5fa 20%,transparent)}article.svelte-13fi44j .graph .rect-pos{fill:color-mix(in srgb,#60a5fa 30%,transparent);stroke:#60a5fa}article.svelte-13fi44j .graph .rect-neg{fill:color-mix(in srgb,#f87171 30%,transparent);stroke:#f87171}article.svelte-13fi44j .graph .point{fill:#60a5fa}article.svelte-13fi44j .graph .point-b{fill:#fbbf24}article.svelte-13fi44j .graph .point-d{fill:#4ade80}article.svelte-13fi44j .graph.surface3d .net .wire{stroke:#60a5fa}article.svelte-13fi44j .graph .contour3d{stroke:#60a5fa}article.svelte-13fi44j .graph .grad-head{fill:#f87171}article.svelte-13fi44j .readout output[data-mood=rising]{color:#4ade80}article.svelte-13fi44j .readout output[data-mood=falling]{color:#f87171}}
