:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#18283e;background:#f6f8fb;font-synthesis:none}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;min-height:100vh}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid #0867bb;outline-offset:3px}
.skip{position:absolute;left:1rem;top:-4rem;z-index:20;background:#fff;border:2px solid #0867bb;padding:.7rem 1rem;border-radius:8px}
.skip:focus{top:1rem}
.shell{max-width:1100px;margin:auto;padding:0 28px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:34px 0 31px}
.brand{display:inline-flex;align-items:center;gap:11px;font-size:17px;font-weight:850;letter-spacing:.09em;line-height:1.1}
.brand small{display:block;font-size:11px;font-weight:600;letter-spacing:.01em;color:#66758b;margin-top:4px}
.brand-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#0662bd,#b178dc);color:#fff;font-size:13px;letter-spacing:-.04em;box-shadow:0 5px 13px #0662bd2b}
.topnav{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:700}
.topnav a{padding:10px 12px;border-radius:9px;color:#4b5e75}
.topnav a:hover{color:#0756a5;background:#eaf0f8}
.topnav a:last-child{background:#fff;border:1px solid #dce3ec;box-shadow:0 2px 6px #1d30430a}
.heading{margin:20px 0 27px}
.eyebrow{margin:0 0 9px;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:#0756a5}
h1,h2,h3,h4,p{margin-top:0}
h1{font-size:clamp(32px,4.1vw,47px);letter-spacing:-.05em;line-height:1.05;margin-bottom:13px}
.heading>p:last-child,.team-heading p:last-child{font-size:15px;line-height:1.55;color:#627189;max-width:630px;margin:0}
.form-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;align-items:start;gap:22px;margin-bottom:50px}
.card,.help-card{background:#fff;border:1px solid #dce3eb;border-radius:15px;box-shadow:0 6px 20px #1d304309}
.form-card{padding:28px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 18px}
.field{display:grid;align-content:start;gap:8px;min-width:0;font-size:13px;font-weight:700;color:#364b65}
.field b{color:#bb4340}
.field.wide{grid-column:1/-1}
.field input,.field select,.field textarea,.search-field input,.status-filter select{width:100%;border:1px solid #cfd9e4;background:#fff;border-radius:9px;padding:11px 12px;color:#192a40;min-height:44px;box-shadow:0 1px 2px #1d304306}
.field input:focus,.field select:focus,.field textarea:focus,.search-field input:focus,.status-filter select:focus{border-color:#0867bb;outline:3px solid #0867bb24}
.field textarea{resize:vertical;min-height:146px;line-height:1.5}
.field input::placeholder,.field textarea::placeholder,.search-field input::placeholder{color:#8996a7;font-weight:400}
.field small{justify-self:end;color:#8190a3;font-weight:500;font-size:11px}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.privacy-note{font-size:12px;line-height:1.55;color:#738197;margin:20px 0 0}
.privacy-note a,.help-card a:not(.contact-link){color:#0756a5;text-decoration:underline;text-underline-offset:2px}
.form-actions{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-top:23px}
.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:9px;min-height:43px;padding:10px 16px;font-size:13px;font-weight:750}
.primary{border:1px solid #0759a7;background:#0662bd;color:#fff;box-shadow:0 5px 12px #0662bd29}
.primary:hover{background:#0755a1}
.primary:disabled,.secondary:disabled{cursor:progress;opacity:.6}
.secondary{border:1px solid #d2dce7;background:#fff;color:#42566e}
.secondary:hover{border-color:#94b4d0;color:#0756a5}
.form-error{color:#b8322e;background:#fff1ef;border:1px solid #f2c8c3;padding:9px 11px;border-radius:8px;font-size:12px;line-height:1.4;margin:0}
.help-card{padding:24px}
.help-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#e7effa;color:#0756a5;font-weight:800;margin-bottom:16px}
.help-card h2{font-size:17px;letter-spacing:-.02em;margin-bottom:13px}
.help-card ul{padding-left:18px;margin:0;color:#63748a;font-size:13px;line-height:1.6}
.help-card li+li{margin-top:10px}
.contact-link{display:block;border-top:1px solid #e8edf2;margin-top:20px;padding-top:16px;color:#0756a5;font-size:12px;font-weight:700}
.success{text-align:center;padding:30px 16px 35px}
.success-icon{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;margin:0 auto 18px;background:#dff5e9;color:#13804c;font-size:25px;font-weight:800}
.success h2{font-size:25px;letter-spacing:-.04em;margin-bottom:7px}
.success p{font-size:13px;line-height:1.5;color:#65748a;margin-bottom:18px}
.success strong{display:inline-block;background:#edf4fc;color:#0756a5;padding:12px 18px;border-radius:9px;font-size:20px;letter-spacing:.05em;margin-bottom:18px}
.success .secondary{margin-top:7px}
.team-heading{display:flex;align-items:end;justify-content:space-between;gap:20px}
.back-link{font-size:13px;color:#0756a5;font-weight:700;padding:8px 0}
.login-card{max-width:420px;padding:28px;margin:0 auto 55px}
.login-card h2{margin:0 0 8px;font-size:21px;letter-spacing:-.03em}
.login-card>p{font-size:13px;line-height:1.5;color:#6c7b90;margin-bottom:23px}
.login-card form{display:grid;gap:18px}
.login-card button{justify-self:start}
.dashboard{overflow:hidden;margin-bottom:50px}
.dashboard-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:21px 24px;border-bottom:1px solid #e8edf2}
.dashboard-bar h2{font-size:19px;letter-spacing:-.03em;margin:0 0 5px}
.dashboard-bar p{font-size:12px;color:#748198;margin:0}
.dashboard-tools{display:flex;align-items:end;gap:12px;padding:15px 24px;background:#fafbfd;border-bottom:1px solid #e8edf2}
.search-field,.status-filter{display:grid;gap:6px;font-size:11px;color:#64758a;font-weight:700}
.search-field{flex:1;max-width:400px}
.status-filter{width:160px}
.dashboard-tools .secondary{min-height:44px}
.dashboard-error{margin:16px 24px}
.dashboard-layout{display:grid;grid-template-columns:350px minmax(0,1fr);min-height:440px}
.ticket-list{border-right:1px solid #e8edf2;max-height:720px;overflow:auto}
.ticket-item{position:relative;display:grid;gap:5px;width:100%;padding:17px 20px;text-align:left;background:#fff;border:0;border-bottom:1px solid #edf0f4}
.ticket-item:hover{background:#f7faff}
.ticket-item.selected{background:#edf5fd;box-shadow:inset 3px 0 #0867bb}
.ticket-item-ref{font-size:11px;color:#738298}
.ticket-item-subject{font-size:13px;color:#243951;line-height:1.35;padding-right:80px}
.ticket-item-bottom{font-size:11px;color:#78889b}
.badge{display:inline-flex;align-items:center;border-radius:20px;padding:5px 8px;font-size:10px;font-weight:750;width:max-content}
.ticket-item .badge{position:absolute;right:16px;top:39px}
.badge.nouveau{color:#a3511c;background:#fff0e5}
.badge.en_cours{color:#155f9d;background:#e7f2fd}
.badge.en_attente{color:#7951a1;background:#f2ebfa}
.badge.resolu{color:#187450;background:#e7f6ed}
.ticket-detail{padding:24px;min-width:0}
.empty-list,.empty-detail{color:#7a899d;font-size:13px;padding:25px 18px;margin:0;text-align:center}
.detail-ref{font-size:11px;color:#0756a5;font-weight:800;letter-spacing:.06em}
.ticket-detail h3{font-size:21px;line-height:1.25;letter-spacing:-.03em;margin:8px 0 21px;overflow-wrap:anywhere}
.detail-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-bottom:24px;padding:17px;background:#f8fafc;border-radius:10px}
.detail-line{display:grid;gap:4px;min-width:0}
.detail-line>span{font-size:11px;color:#7a899b}
.detail-line strong,.detail-line a{font-size:12px;font-weight:700;overflow-wrap:anywhere}
.email-link{color:#0756a5;text-decoration:underline;text-underline-offset:2px}
.ticket-detail h4{font-size:13px;margin:22px 0 10px}
.ticket-description{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.6;color:#3f5269;margin:0}
.ticket-events{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ticket-events li{border-left:2px solid #c5d9ed;padding:3px 0 3px 12px;font-size:12px}
.ticket-events strong{display:block;color:#3c536e}
.ticket-events time{display:block;color:#8592a3;margin-top:3px}
.ticket-events p{white-space:pre-wrap;margin:7px 0 0;color:#53667e;line-height:1.5}
.update-form{display:grid;gap:14px;border-top:1px solid #e8edf2;padding-top:6px;margin-top:25px}
.update-form h4{margin-bottom:0}
.update-form .primary{justify-self:start}
footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 0 38px;border-top:1px solid #dce3eb;color:#7d8a9b;font-size:11px}
footer nav{display:flex;gap:18px}
footer a:hover{text-decoration:underline}
@media(max-width:800px){.form-layout{grid-template-columns:1fr}.help-card{order:2}.dashboard-layout{grid-template-columns:290px minmax(0,1fr)}}
@media(max-width:650px){.shell{padding:0 16px}.topbar{padding:22px 0}.topnav{gap:3px}.topnav a{font-size:11px;padding:9px 8px}.heading{margin:15px 0 23px}.heading>p:last-child{font-size:14px}.form-card{padding:20px 16px}.form-grid{grid-template-columns:1fr;gap:16px}.field.wide{grid-column:auto}.form-actions{align-items:stretch}.form-actions .primary{width:100%}.team-heading{align-items:start;flex-direction:column;gap:10px}.dashboard-bar,.dashboard-tools{padding:16px}.dashboard-tools{flex-wrap:wrap}.search-field{flex-basis:100%;max-width:none}.status-filter{flex:1}.dashboard-layout{grid-template-columns:1fr}.ticket-list{border-right:0;border-bottom:1px solid #e8edf2;max-height:320px}.ticket-detail{padding:18px}.detail-meta{grid-template-columns:1fr 1fr}footer{align-items:start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}}
