/* Palette, typographie et traitement visuel hérités de la section Météorologie. */
.navier-page .site-header { position: relative; background: var(--night-95); }
.app { min-height: 100vh; padding: clamp(1.5rem, 4vw, 3.5rem) clamp(1.5rem, 7vw, 8rem) clamp(4rem, 8vw, 7rem); background: radial-gradient(circle at 77% 0%, var(--app-aurora) 0, var(--app-aurora-deep) 24%, transparent 48%), linear-gradient(145deg, var(--night-soft), var(--night)); }
.navier-app__back { display: inline-block; margin-bottom: clamp(1.5rem, 4vw, 3rem); color: var(--cyan); font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }.navier-app__back:hover { text-shadow: 0 0 12px var(--cyan-glow); }.intro { max-width: 775px; margin-bottom: 2rem; }.intro .eyebrow { margin: 0 0 .9rem; }.intro h1 { margin: 0 0 1rem; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2.7rem, 5vw, 5.3rem); font-weight: 400; letter-spacing: -.055em; line-height: .96; }.intro h1 span { color: var(--cyan); text-shadow: 0 0 26px var(--cyan-shine); }.intro > p:last-child { margin: 0; color: var(--muted); line-height: 1.65; }.workspace { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(290px, .75fr); gap: clamp(1.5rem, 3vw, 3rem); align-items: start; }.simulation-card { padding: clamp(.6rem, 1.5vw, 1rem); border: 1px solid var(--line); background: var(--night-40); box-shadow: 7px 8px 0 var(--app-shadow); }.canvas-head { display:flex; align-items:center; justify-content:space-between; padding: 0 0 .75rem; color: var(--text); font-size: .82rem; }.canvas-head span { display:flex; align-items:center; gap:.5rem; }.canvas-head i { width:7px;height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }button,select { font: inherit; }.canvas-head button,.reset { min-height:2.3rem;padding:.45rem .75rem;border:1px solid var(--line); color:var(--cyan); background:var(--night-55);font-size:.78rem;cursor:pointer }.canvas-head button:hover,.reset:hover { border-color:var(--cyan);background:var(--cyan-tint) }canvas { display:block;width:100%;height:auto;border:1px solid var(--cyan);background:var(--app-deep);box-shadow:0 0 28px var(--cyan-halo) }.legend { display:flex;align-items:center;gap:10px;padding:13px 0 0;color:var(--muted);font-size:.72rem }.legend b {color:var(--text);font-weight:400}.legend span {font-size:.7rem}#legendBar { height:8px; flex:1; max-width:190px; background:linear-gradient(90deg,#203b92,#28c9c9,#f8e75e,#f44747) }.controls { padding:1.25rem;border:1px solid var(--line);background:linear-gradient(145deg,var(--app-panel-glow),var(--night-soft-90));box-shadow:7px 8px 0 var(--app-shadow) }.controls h2 { margin:0 0 .85rem;font-family:Georgia,'Times New Roman',serif;font-size:1.35rem;font-weight:400;letter-spacing:-.02em }.controls label {display:block;margin:15px 0 4px;color:var(--text);font-size:.82rem}.controls output {float:right;color:var(--cyan);font-size:.82rem}.controls select {width:100%;min-height:2.3rem;margin-top:7px;padding:.4rem .55rem;border:1px solid var(--line);border-radius:0;color:var(--text);background:var(--night-soft)}.controls input {width:100%;margin:11px 0 0;accent-color:var(--cyan);cursor:pointer}.reset {width:100%;margin:22px 0 17px}.controls dl {margin:0;padding:11px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.controls dl div {display:flex;justify-content:space-between;padding:4px 0}.controls dt {color:var(--muted);font-size:.75rem}.controls dd {margin:0;color:var(--cyan);font-size:.78rem}.tip {margin:16px 0 0;color:var(--muted);font-size:.75rem;line-height:1.55}@media(max-width:850px){.workspace{grid-template-columns:1fr}.controls{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.controls h2,.reset,.tip,.controls dl{grid-column:1/-1}}@media(max-width:500px){.controls{display:block}}


