@font-face{font-family:'Newsreader';font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/newsreader-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-weight:500;font-style:normal;font-display:swap;src:url(../fonts/newsreader-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-weight:400;font-style:italic;font-display:swap;src:url(../fonts/newsreader-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-weight:500;font-style:italic;font-display:swap;src:url(../fonts/newsreader-latin-500-italic.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-weight:400;font-display:swap;src:url(../fonts/instrument-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-weight:500;font-display:swap;src:url(../fonts/instrument-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-weight:600;font-display:swap;src:url(../fonts/instrument-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2')}

:root{--serif:'Newsreader',Georgia,serif;--sans:'Instrument Sans',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace}
.dark{--bg:#0E0F13;--fg:#ECE9E1;--mute:#A9ABB3;--line:rgba(236,233,225,.14);--accent:#E4684C;--panel:#15161C;--ink-on:#0E0F13;--bar:#14151A;--ok:#7BC59A;--bad:#E4684C}
.light{--bg:#F6F4EE;--fg:#16161C;--mute:#5E5F68;--line:rgba(22,22,28,.14);--accent:#A8402B;--panel:#FFFFFF;--ink-on:#F6F4EE;--bar:#16161C;--ok:#1E7A4A;--bad:#A8402B}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
[hidden]{display:none!important}
.wrap{max-width:1240px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.mono{font:500 12px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.h2{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.4vw,60px);line-height:1.05;letter-spacing:-.025em;text-wrap:balance}
.lead{margin:0;font-size:18px;line-height:1.6;color:var(--mute);text-wrap:pretty}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:4px;background:var(--fg);color:var(--ink-on);font:500 16px/1 var(--sans);text-decoration:none;border:1px solid var(--fg);cursor:pointer;transition:background .25s,color .25s,transform .25s,border-color .25s}
.btn:hover:not(:disabled){background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-2px)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--fg);border-color:var(--line)}
.btn.ghost:hover:not(:disabled){background:var(--fg);color:var(--ink-on);border-color:var(--fg)}
.btn.sm{min-height:44px;padding:0 18px;font-size:15px}
.tlink{display:inline-flex;align-items:center;min-height:44px;font-weight:500;text-decoration:none;border-bottom:1px solid currentColor;background:none;border-top:0;border-left:0;border-right:0;color:inherit;font-family:inherit;font-size:inherit;cursor:pointer;padding:0}
.tlink:hover{color:var(--accent)}
input,select,textarea{font:400 16px/1.4 var(--sans);color:var(--fg);background:var(--panel);border:1px solid var(--line);border-radius:4px;min-height:48px;padding:0 14px;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--mute)}
.err{color:var(--bad);font-size:14px;min-height:20px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:6px}
.logo-lgt{transform-box:fill-box;transform-origin:center top;animation:lg-tab .7s cubic-bezier(.7,0,.2,1) both;animation-delay:var(--d)}
@keyframes lg-tab{from{transform:scaleY(0)}to{transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
.spin{animation:spin .9s linear infinite}
@keyframes pop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.pop{animation:pop .5s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
.in{animation:rise .9s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d,0s)}
.rv{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.rv.on{opacity:1;transform:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}.rv{opacity:1;transform:none}}

/* Animations d'interface */
@keyframes shake{0%,100%{transform:none}18%{transform:translateX(-9px)}36%{transform:translateX(8px)}54%{transform:translateX(-5px)}72%{transform:translateX(3px)}}
.shake{animation:shake .45s cubic-bezier(.36,.07,.19,.97)}
input.bad{border-color:var(--bad);transition:border-color .25s}
@keyframes errin{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.err:not(:empty){animation:errin .3s ease both}
.okview{display:flex;flex-direction:column;align-items:center;gap:16px;padding:28px 0;text-align:center;font-family:var(--serif);font-size:24px;letter-spacing:-.01em}
.okview svg{width:72px;height:72px}
.okview circle{fill:none;stroke:var(--ok);stroke-width:3;stroke-dasharray:166;stroke-dashoffset:166;animation:okdraw .6s cubic-bezier(.65,0,.45,1) forwards}
.okview path{fill:none;stroke:var(--ok);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:48;stroke-dashoffset:48;animation:okdraw .35s .5s cubic-bezier(.65,0,.45,1) forwards}
@keyframes okdraw{to{stroke-dashoffset:0}}
.okview span{opacity:0;animation:pop .5s .75s both}
.theme-btn{position:fixed;left:16px;bottom:16px;z-index:60;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--fg);font:500 14px/1 var(--sans);cursor:pointer;transition:transform .25s,border-color .25s}
.theme-btn:hover{transform:translateY(-2px);border-color:var(--fg)}
body{transition:background .35s,color .35s}