.first-tools{--ft-bg:#0e1421;--ft-card:#151f31;--ft-line:#2b3850;--ft-ink:#eef4ff;--ft-muted:#a5b5cf;--ft-sky:#84dafa;--ft-gold:#ffd085;color:var(--ft-ink);font-family:Inter,system-ui,sans-serif}
.first-tools *{box-sizing:border-box}
.first-tools .first-muted,.first-tools small{color:var(--ft-muted);line-height:1.5}
.first-tools h1,.first-tools h2,.first-tools h3,.first-tools p{margin:0}
.first-hero{display:flex;gap:20px;align-items:center;padding:24px 28px;background:linear-gradient(115deg,#182a43,#131e31 56%,#25253d);border:1px solid var(--ft-line);border-radius:19px}
.first-hero h1{font-size:clamp(1.65rem,4vw,2.65rem);letter-spacing:-.06em;line-height:1}
.first-kicker{color:var(--ft-sky);letter-spacing:.13em;font-size:11px;font-weight:750;margin-bottom:8px}
.first-mark{display:grid;place-items:center;min-width:57px;height:57px;background:#1c3f55;border:1px solid #427892;border-radius:15px;font-size:17px;font-weight:900;color:#c1edff;letter-spacing:-.09em}
.first-nav{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0 28px}
.first-tools .first-button{display:inline-flex;align-items:center;gap:8px;justify-content:center;border:1px solid var(--ft-line);background:#202d42;color:var(--ft-ink);border-radius:9px;padding:9px 13px;font:inherit;font-weight:680;cursor:pointer;text-align:center}
.first-tools .first-button:hover,.first-tools .first-button:focus-visible{border-color:var(--ft-sky)}
.first-tools .first-button.primary,.first-nav .first-button[aria-pressed=true],.first-tabs .first-button[aria-pressed=true]{color:#0d2130;background:var(--ft-sky);border-color:var(--ft-sky)}
.first-tools button:disabled{opacity:.55;cursor:default}
.first-nav button span{font-family:ui-monospace,monospace;min-width:14px}
.first-workspace{display:grid;gap:14px}
.first-heading{display:flex;align-items:center;gap:13px;margin-bottom:2px}
.first-heading h2{font-size:clamp(1.4rem,3vw,2rem);letter-spacing:-.04em}
.first-tool-icon{display:grid;place-items:center;border-radius:12px;background:#20344c;color:var(--ft-sky);min-width:46px;height:46px;font-weight:800}
.first-card{min-width:0;padding:19px 21px;background:var(--ft-card);border:1px solid var(--ft-line);border-radius:14px}
.first-card h2{font-size:1.12rem;letter-spacing:-.02em;margin-bottom:9px}
.first-card h3{font-size:.95rem;margin:8px 0}
.first-card p{margin:5px 0 10px}
.first-grid,.first-editor-split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(270px,100%),1fr));gap:14px}
.first-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr));gap:11px}
.first-field{display:grid;align-content:start;gap:6px;color:var(--ft-ink);font-size:.88rem;min-width:0}
.first-tools input:not([type=checkbox]):not([type=range]),.first-tools select,.first-tools textarea{min-width:0;width:100%;background:#0e1728;color:var(--ft-ink);border:1px solid #3b4a63;border-radius:8px;padding:8px 10px;font:inherit}
.first-tools input[type=range]{width:100%;accent-color:var(--ft-sky)}
.first-tools input[type=checkbox]{accent-color:var(--ft-sky)}
.first-tools :focus-visible{outline:2px solid var(--ft-sky);outline-offset:2px}
.first-actions,.first-tabs,.first-editor-options{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:10px 0}
.first-editor-options label{margin-right:8px}
.first-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr));gap:10px}
.first-metric{background:#182740;border:1px solid var(--ft-line);border-radius:11px;padding:12px 15px;display:grid;gap:4px}
.first-metric span{color:var(--ft-muted);font-size:.81rem}
.first-metric strong{color:var(--ft-sky);font-size:1.33rem;letter-spacing:-.045em}
.first-metric:nth-child(2n) strong{color:#c5b8ff}
.first-metric:nth-child(3n) strong{color:var(--ft-gold)}
.first-code-pane{position:relative;overflow:hidden;border:1px solid var(--ft-line);border-radius:9px;background:#0e1728}
.first-tools .first-code textarea{display:block;border:0;padding:10px 10px 10px 53px;min-height:200px;resize:vertical;font:13px/22px ui-monospace,Consolas,monospace;color:#c1eafa;background:transparent}
.first-code pre{position:absolute;z-index:1;pointer-events:none;top:0;left:0;width:44px;margin:0;padding:10px 7px 0 0;color:#91a8ca;text-align:right;background:#121f31;font:12px/22px ui-monospace,Consolas,monospace}
.first-code small{display:block;text-align:right;margin-top:3px}
.first-status{font-size:.88rem;color:var(--ft-muted)}
.first-status.is-ok{color:#90e8bd}
.first-status.is-error{color:#ffacaa}
.first-status.is-warning{color:var(--ft-gold)}
.first-timeline{position:relative;margin:14px 0 8px;height:86px;border-radius:10px;background:#1c2c56;isolation:isolate}
.first-timeline .sun{position:absolute;top:0;height:100%;background:linear-gradient(90deg,#473a76,#9c6239 18%,#a97836 65%,#4e3c74);z-index:-1}
.first-timeline .head{position:absolute;top:0;bottom:0;border-left:2px solid #fff}
.first-timeline .head b{position:absolute;top:28px;transform:translateX(-50%);white-space:nowrap;padding:4px 9px;background:#0e1728;border-radius:6px}
.first-scale{display:flex;justify-content:space-between;color:var(--ft-muted);font-size:.76rem}
.first-presets .first-button{flex:1;display:grid;gap:0;min-width:111px}
.first-presets small{font-size:.75rem}
.first-preset-active{border-color:var(--ft-sky)!important;box-shadow:inset 0 -2px var(--ft-sky)}
.first-weather-preview{min-height:124px;border:1px solid var(--ft-line);border-radius:12px;padding:15px;display:flex;align-items:end;gap:14px;justify-content:space-between;background:#203650;margin:8px 0 12px}
.first-weather-preview strong{font-size:1.25rem}
.first-weather-preview span{font-size:2.4rem}
.first-weather-block{background:#121c2c;padding:11px;border-radius:9px;border:1px solid var(--ft-line);margin-bottom:9px}
.first-weather-block h3{margin:0 0 6px}
.first-tools details{color:var(--ft-muted)}
.first-tools summary{cursor:pointer;color:var(--ft-sky);font-weight:700}
@media(max-width:590px){.first-hero{padding:18px}.first-card{padding:14px}.first-nav{margin-bottom:18px}.first-nav .first-button{font-size:.8rem;padding:7px 9px}.first-nav button span{display:none}}
.first-compass{display:grid;place-items:center;position:relative;width:65px;height:65px;margin:0 0 10px;border:1px solid #496481;border-radius:50%;background:#122237;color:var(--ft-sky)}
.first-compass small{position:absolute;top:0;line-height:1.15;font-size:.72rem}
.first-compass span{display:grid;place-items:center;font-size:1.9rem;line-height:1;width:100%;height:100%}
/* Each tool keeps the same controls and uses a distinct accent and workspace. */
.first-tools{
  --ft-bg:#101318;--ft-card:#191d25;--ft-line:#323846;
  --ft-ink:#f6f7fb;--ft-muted:#b6bfce;--ft-sky:#ffcc73;
  --ft-accent-ink:#17171c;--ft-wash:#3e2b20;
}
.first-tools[data-first-theme=xml]{--ft-sky:#9abfff;--ft-wash:#202e55}
.first-tools[data-first-theme=json]{--ft-sky:#80e7b5;--ft-wash:#164036}
.first-tools[data-first-theme=events]{--ft-sky:#eab7ff;--ft-wash:#3b254e}
.first-tools[data-first-theme=weather]{--ft-sky:#91deff;--ft-wash:#173b4d}
.first-hero{padding:0 0 13px;min-height:47px;border:0;border-bottom:1px solid var(--ft-line);border-radius:0;background:none;gap:12px}
.first-hero h1{font-size:1rem;letter-spacing:-.015em}
.first-mark{min-width:35px;height:32px;border:0;border-radius:6px;background:#eef0f6;color:#161821;font-size:13px;letter-spacing:-.1em}
.first-platform{margin-left:auto;color:var(--ft-muted);font-size:.79rem}
.first-nav{margin:12px 0 19px;gap:6px}
.first-nav .first-button{background:transparent;border-color:transparent;color:var(--ft-muted);min-height:40px}
.first-nav .first-button[aria-pressed=true]{background:color-mix(in srgb,var(--ft-sky) 16%,#171b24);border-color:color-mix(in srgb,var(--ft-sky) 45%,#232934);color:var(--ft-sky)}
.first-workspace{gap:17px}
.first-heading{
  position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;
  min-height:158px;margin:0;padding:23px clamp(18px,3vw,34px);
  border-radius:14px;border:1px solid color-mix(in srgb,var(--ft-sky) 25%,var(--ft-line));
  background:radial-gradient(ellipse at 82% 110%,var(--ft-wash),transparent 64%),linear-gradient(110deg,#1c202a,#181c26);
}
.first-heading h2{font-size:clamp(1.9rem,5vw,3.2rem);line-height:1.02;letter-spacing:-.065em;margin-bottom:8px}
.first-heading p{max-width:470px}
.first-heading-art{z-index:-1;position:absolute;right:5%;top:50%;transform:translateY(-50%);width:clamp(145px,25vw,340px);height:240px;display:grid;place-items:center;opacity:.9;mask-image:linear-gradient(90deg,transparent,#000 22%)}
.first-heading-art::before{content:'';position:absolute;inset:0;background:repeating-radial-gradient(ellipse at 54% 51%,transparent 0 13px,color-mix(in srgb,var(--ft-sky) 27%,transparent) 14px 15px,transparent 16px 24px);transform:rotate(-14deg)}
.first-heading-art span{position:relative;color:var(--ft-sky);font:750 clamp(2.4rem,6vw,5.5rem)/1 ui-monospace,monospace;letter-spacing:-.11em;text-shadow:0 0 22px var(--ft-wash)}
[data-first-theme=time] .first-heading-art span{font-size:0;width:84px;height:84px;border-radius:50%;border:1px solid #ffdba6;background:linear-gradient(115deg,#ffe8ae 0 50%,#835039 51% 56%,#211a25 57%);box-shadow:0 0 45px #ffad5a57}
[data-first-theme=xml] .first-heading-art::before{background:repeating-linear-gradient(0deg,transparent 0 17px,#9abfff34 18px 19px,transparent 20px 24px);transform:rotate(-23deg) skewX(11deg)}
[data-first-theme=json] .first-heading-art::before{background:radial-gradient(circle,#80e7b576 1px,transparent 2px) 0 0 / 15px 15px;transform:rotate(-12deg)}
[data-first-theme=events] .first-heading-art::before{background:repeating-linear-gradient(150deg,transparent 0 18px,#eab7ff49 19px 23px,transparent 24px 34px);transform:skewX(15deg)}
[data-first-theme=weather] .first-heading-art::before{background:repeating-radial-gradient(ellipse at 60% 69%,transparent 0 12px,#91deff49 13px 14px,transparent 15px 25px);transform:rotate(-24deg) scaleX(1.2)}
.first-card{padding:clamp(15px,2vw,22px);border-radius:13px;background:var(--ft-card)}
.first-card h2{font-size:1.06rem}
.first-tools .first-button.primary{background:var(--ft-sky);border-color:var(--ft-sky);color:var(--ft-accent-ink)}
.first-tools .first-button.secondary{background:#232936}
.first-nav .first-button.secondary{background:transparent}
.first-tools input:not([type=checkbox]):not([type=range]),.first-tools select,.first-tools textarea{background:#12161e;border-color:#3a4151}
.first-cycle-layout,.first-weather-layout,.first-validation-layout,.first-event-layout{display:grid;gap:14px;min-width:0;align-items:start}
.first-cycle-layout{grid-template-columns:minmax(0,1.02fr) minmax(0,1.15fr)}
.first-cycle-result,.first-weather-sidebar{display:grid;gap:12px;min-width:0}
.first-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.first-presets .first-button{min-width:0;font-size:.83rem}
.first-nitrado-values{background:linear-gradient(128deg,var(--ft-wash),#211f28 70%);border:1px solid #765b49}
.first-nitrado-values .first-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
.first-nitrado-values .first-metric{background:#201c24b8}
.first-nitrado-values .first-metric strong{font-size:clamp(1.05rem,2.8vw,1.9rem);color:var(--ft-sky)}
.first-cycle-preview .first-timeline{height:54px}
.first-cycle-preview .first-timeline .head b{top:14px;font-size:.8rem}
.first-cycle-totals .first-metric{background:#20232d}
.first-import-panel{padding:10px 2px}
.first-validation-layout{grid-template-columns:minmax(0,1fr) minmax(240px,290px)}
.first-diagnostic{border-top:3px solid var(--ft-sky);background:linear-gradient(150deg,var(--ft-wash),var(--ft-card) 50%)}
.first-diagnostic .first-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.first-diagnostic .first-button{font-size:.8rem}
.first-diagnostic .first-button:first-child,.first-diagnostic .first-button:last-child{grid-column:1/-1}
.first-diagnostic ul:empty{display:none}
.first-diagnostic ul{padding-left:19px;overflow-wrap:anywhere}
.first-editor-metrics .first-metrics{grid-template-columns:repeat(auto-fit,minmax(min(120px,100%),1fr))}
.first-metric{background:color-mix(in srgb,var(--ft-sky) 7%,#1c222c)}
.first-metric strong,.first-metric:nth-child(2n) strong,.first-metric:nth-child(3n) strong{color:var(--ft-sky)}
.first-code-pane{background:#10151e}
.first-code pre{background:#171e2b}
.first-remote{margin:0 0 12px}
.first-file-bar input[type=file]{flex:1 1 200px;width:auto!important;max-width:100%}
.first-file-bar small{order:5}
.first-event-layout{grid-template-columns:repeat(2,minmax(0,1fr))}
.first-event-layout .first-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
.first-event-layout>section:nth-child(2){border-top:3px solid var(--ft-sky)}
.first-event-guide .first-grid{grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:7px}
.first-event-guide .first-grid div{padding:9px 12px;background:#222232;border-radius:8px;border:1px solid var(--ft-line)}
.first-event-guide .first-grid p{margin:0;font-family:monospace}
.first-weather-layout{grid-template-columns:minmax(0,1.5fr) minmax(250px,.75fr)}
.first-weather-sidebar .first-grid{grid-template-columns:1fr;gap:5px}
.first-weather-sidebar .first-fields{grid-template-columns:repeat(auto-fit,minmax(min(100px,100%),1fr))}
.first-weather-sidebar .first-actions>.first-field{width:100%}
.first-weather-preview{min-height:161px;margin:0;overflow:hidden;isolation:isolate;position:relative}
.first-weather-preview strong,.first-weather-preview>span{position:relative;z-index:1}
.first-weather-preview strong{text-shadow:0 1px 9px #0a1224;font-size:1.5rem}
.first-weather-scene,.first-weather-scene i{position:absolute;inset:0;pointer-events:none}
.first-weather-scene::before{content:'';position:absolute;right:21%;top:18%;width:48px;height:48px;border-radius:50%;background:#ffe3a8;box-shadow:0 0 48px #ffe3a899}
.first-weather-scene i:nth-child(1){background:#577d99;clip-path:polygon(0 77%,22% 30%,39% 63%,61% 19%,83% 65%,100% 47%,100% 100%,0 100%)}
.first-weather-scene i:nth-child(2){background:#39526e;clip-path:polygon(0 87%,17% 56%,33% 79%,56% 60%,68% 75%,90% 49%,100% 60%,100% 100%,0 100%)}
.first-weather-scene i:nth-child(3){background:#1d3449;clip-path:polygon(0 79%,23% 85%,50% 70%,70% 92%,100% 81%,100% 100%,0 100%)}
.first-weather-preview:not([data-condition="Éclaircies"]) .first-weather-scene::before{opacity:.2}
.first-weather-preview[data-condition="Pluie"] .first-weather-scene::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(117deg,transparent 0 21px,#d0ebff49 22px 23px,transparent 24px 30px)}
.first-weather-preview[data-condition="Neige"] .first-weather-scene::after{content:'';position:absolute;inset:0;background:radial-gradient(circle,#eff8ffe0 1px,transparent 2px) 0 0/22px 18px}
.first-weather-preview[data-condition="Brouillard"] .first-weather-scene::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,transparent,#b5c3d38c,transparent)}
@media(max-width:950px){.first-weather-layout{grid-template-columns:minmax(0,1fr) minmax(220px,.65fr)}.first-event-layout{grid-template-columns:1fr}}
@media(max-width:720px){.first-cycle-layout,.first-weather-layout,.first-validation-layout{grid-template-columns:1fr}.first-weather-sidebar{grid-row:1}.first-heading-art{opacity:.4;right:-10%}.first-heading{min-height:124px}.first-heading p{max-width:calc(100% - 38px)}.first-cycle-totals .first-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
.first-tools .first-tabs .first-button[aria-pressed=true]{background:var(--ft-sky);border-color:var(--ft-sky);color:var(--ft-accent-ink)}
.first-tools input[type=file]::file-selector-button{border:0;border-radius:6px;padding:6px 10px;margin:-3px 9px -3px -4px;background:#293243;color:#f5f7fb;font:inherit;font-weight:650;cursor:pointer}
.first-diagnostic .first-status{border-left:2px solid #75809a;padding-left:9px}
.first-diagnostic .first-status.is-ok{border-color:#90e8bd}
.first-diagnostic .first-status.is-error{border-color:#ffacaa}
.first-diagnostic .first-status.is-warning{border-color:#ffd085}
