:root {
    --blue: #00A3E0;
    --green: #73C92D;
    --grey: #91999F;
    --text: #24313a;
    --muted: #66737c;
    --border: rgba(145, 153, 159, .24);
    --surface: rgba(255, 255, 255, .94);
    --shadow: 0 18px 45px rgba(37, 61, 72, .10);
    --shadow-soft: 0 8px 24px rgba(37, 61, 72, .08);
    --radius-lg: 24px;
    --radius-md: 16px;
    --radius-sm: 11px;
}

* { box-sizing: border-box; }
html { min-height: 100%; }
body {
    min-height: 100vh;
    margin: 0;
    padding: 28px 18px;
    overflow-x: hidden;
    color: var(--text);
    font-family: "Trebuchet MS", Arial, sans-serif;
    background:
        radial-gradient(circle at 12% 10%, rgba(0, 163, 224, .34) 0, rgba(0, 163, 224, 0) 32%),
        radial-gradient(circle at 88% 12%, rgba(115, 201, 45, .26) 0, rgba(115, 201, 45, 0) 29%),
        radial-gradient(circle at 82% 86%, rgba(0, 163, 224, .17) 0, rgba(0, 163, 224, 0) 27%),
        radial-gradient(circle at 18% 88%, rgba(115, 201, 45, .13) 0, rgba(115, 201, 45, 0) 24%),
        linear-gradient(145deg, #EEF9FC 0%, #F8FBFC 42%, #F1F8F1 100%);
    background-attachment: fixed;
}

body::before,
body::after {
    position: fixed;
    z-index: -1;
    border-radius: 50%;
    filter: blur(12px);
    pointer-events: none;
    content: "";
    will-change: transform, opacity;
}
body::before {
    top: 11vh;
    left: -90px;
    width: 260px;
    height: 260px;
    background: rgba(0, 163, 224, .12);
    animation: ambientBlueFloat 18s cubic-bezier(.45, 0, .55, 1) infinite alternate;
}
body::after {
    right: -80px;
    bottom: 8vh;
    width: 220px;
    height: 220px;
    background: rgba(115, 201, 45, .12);
    animation: ambientGreenFloat 21s cubic-bezier(.45, 0, .55, 1) -6s infinite alternate;
}
@keyframes ambientBlueFloat {
    0% { transform: translate3d(-30px, -25px, 0) scale(.82); opacity: .72; }
    25% { transform: translate3d(70px, 30px, 0) scale(1.10); opacity: 1; }
    52% { transform: translate3d(165px, -15px, 0) scale(1.30); opacity: .86; }
    76% { transform: translate3d(75px, 85px, 0) scale(.94); opacity: .95; }
    100% { transform: translate3d(210px, 35px, 0) scale(1.22); opacity: .78; }
}
@keyframes ambientGreenFloat {
    0% { transform: translate3d(30px, 25px, 0) scale(.88); opacity: .70; }
    24% { transform: translate3d(-90px, -35px, 0) scale(1.18); opacity: .96; }
    50% { transform: translate3d(-185px, 20px, 0) scale(1.34); opacity: .82; }
    74% { transform: translate3d(-70px, -95px, 0) scale(.92); opacity: 1; }
    100% { transform: translate3d(-225px, -30px, 0) scale(1.24); opacity: .76; }
}

.container { width: min(1180px, 100%); margin: 0 auto; }
.header-panel {
    position: relative;
    overflow: hidden;
    margin: 0 0 20px;
    padding: 24px 26px;
    border: 1px solid rgba(255,255,255,.5);
    border-radius: var(--radius-lg);
    color: #fff;
    background: linear-gradient(120deg, var(--blue) 0%, #27b3ca 52%, var(--green) 100%);
    box-shadow: 0 20px 48px rgba(0, 163, 224, .20);
}
.header-panel::after {
    position: absolute;
    right: -55px;
    top: -80px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(255,255,255,.12);
    content: "";
}
.header-top { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.hero-copy { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: center; }
.hero-copy h2 { margin: 0; font-size: clamp(25px, 3vw, 34px); line-height: 1.1; }
.hero-copy p { grid-column: 2; margin: 5px 0 0; color: rgba(255,255,255,.88); font-size: 14px; }
.hero-icon { grid-row: 1 / span 2; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 16px; background: rgba(255,255,255,.18); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); font-size: 21px; }
.header-actions a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 13px; border: 1px solid rgba(255,255,255,.42); border-radius: 999px; color: #fff; background: rgba(255,255,255,.12); text-decoration: none; font-weight: 700; font-size: 13px; transition: .2s ease; }
.header-actions a:hover { background: rgba(255,255,255,.22); transform: translateY(-1px); }

.tabs-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; padding: 8px; border: 1px solid rgba(145,153,159,.22); border-radius: 18px; background: rgba(255,255,255,.82); box-shadow: var(--shadow-soft); backdrop-filter: blur(12px); }
.tabs-nav-mobile { display: none; margin-bottom: 20px; }
.tab-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 9px 13px; border: 0; border-radius: 12px; color: #66737c; background: transparent; font: 700 13px/1 "Trebuchet MS", Arial, sans-serif; text-decoration: none; cursor: pointer; transition: .2s ease; }
.tab-btn:hover { color: var(--blue); background: rgba(0,163,224,.07); }
.tab-btn.active { color: #fff; background: linear-gradient(135deg, var(--blue), #23b1ce); box-shadow: 0 7px 18px rgba(0,163,224,.20); }

.panel-box { margin-bottom: 22px; padding: 22px; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-soft); backdrop-filter: blur(8px); }
.border-blue { border-top: 4px solid var(--blue); }
.border-green { border-top: 4px solid var(--green); }
.border-grey { border-top: 4px solid var(--grey); }
.panel-soft-blue { background: rgba(255,255,255,.94); }
.panel-soft-grey { background: rgba(255,255,255,.88); }
.section-title { display: flex; align-items: center; gap: 9px; margin: 0 0 18px; padding-bottom: 12px; border-bottom: 1px solid rgba(145,153,159,.18); font-size: 18px; }
.section-title-blue { color: var(--blue); }
.section-title-green { color: #5aa91f; }
.section-title-grey { color: #6f787e; }
.list-title { margin: 8px 0 14px; color: #68747c; font-size: 18px; }

.form-row { display: flex; gap: 14px; margin-bottom: 14px; }
.form-row-top { align-items: flex-start; margin-top: 15px; }
.form-group { flex: 1; min-width: 0; }
label { display: block; margin-bottom: 6px; color: #39474f; font-size: 13px; font-weight: 700; }
input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="file"], textarea, select {
    width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid rgba(145,153,159,.34); border-radius: var(--radius-sm); color: var(--text); background: #fff; font: 14px/1.35 "Trebuchet MS", Arial, sans-serif; outline: none; transition: border-color .18s ease, box-shadow .18s ease;
}
textarea { min-height: 92px; resize: vertical; }
input:focus, textarea:focus, select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0,163,224,.10); }
.helper { margin-top: 4px; color: #7a868d; font-size: 12px; font-style: italic; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 44px; padding: 11px 16px; border: 0; border-radius: 11px; color: #fff; font: 700 14px/1 "Trebuchet MS", Arial, sans-serif; text-align: center; text-decoration: none; cursor: pointer; transition: transform .18s ease, filter .18s ease, box-shadow .18s ease; }
.btn:hover { transform: translateY(-1px); filter: brightness(.98); }
.btn-blue { background: var(--blue); box-shadow: 0 8px 18px rgba(0,163,224,.17); }
.btn-green { background: var(--green); box-shadow: 0 8px 18px rgba(115,201,45,.18); }
.btn-grey { background: var(--grey); }
.btn-action { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 34px; padding: 6px 10px; border: 1px solid rgba(145,153,159,.28); border-radius: 9px; color: #435159; background: #f7fafb; font: 700 12px/1 "Trebuchet MS", Arial, sans-serif; text-decoration: none; cursor: pointer; transition: .18s ease; }
.btn-action:hover { border-color: rgba(0,163,224,.35); color: var(--blue); background: #eefaff; }
.btn-delete { color: #b83c3c; border-color: rgba(210,70,70,.20); background: #fff7f7; }
.btn-delete:hover { color: #9e2d2d; background: #ffeded; }
.icon-action { width: 38px; height: 38px; padding: 0; font-size: 15px; }
.action-search { color: #1565c0; }
.action-go { color: var(--green); }
.btn-action[data-status="1"] { color: var(--green); }
.btn-action[data-status="0"] { color: var(--grey); }
.button-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.btn-compact, .btn-compact-wide { width: auto; margin: 0; font-size: 13px; }

.card { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 10px; padding: 15px 16px; border: 1px solid rgba(145,153,159,.18); border-left: 4px solid transparent; border-radius: 13px; background: rgba(255,255,255,.93); box-shadow: 0 5px 14px rgba(37,61,72,.05); transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.card:hover { border-left-color: var(--blue); transform: translateY(-1px); box-shadow: 0 9px 20px rgba(37,61,72,.08); }
.card-content { flex: 1; min-width: 0; }
.actions-cell { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.tag { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.tag-fete { color: #4d8d1d; background: rgba(115,201,45,.12); }
.tag-journee { color: #0879a3; background: rgba(0,163,224,.10); }
.quote-text { margin: 0 0 5px; color: #39464d; font-size: 14px; font-style: italic; }
.quote-author { color: #707b82; font-size: 12px; font-weight: 700; }

.year-accordion { overflow: hidden; margin-bottom: 10px; border: 1px solid rgba(145,153,159,.20); border-radius: 13px; background: rgba(255,255,255,.93); box-shadow: 0 4px 13px rgba(37,61,72,.04); }
.year-summary { display: flex; align-items: center; gap: 8px; padding: 13px 15px; color: #087eaa; background: rgba(0,163,224,.045); font-size: 14px; font-weight: 700; cursor: pointer; }
.year-content { padding: 12px 12px 2px; }

.audit-row { border-bottom: 1px solid #e2e8f0; }
.audit-row.status-correct { background: #f0fdf4; }
.audit-row.status-incorrect { background: #fef2f2; }
.audit-row.status-uncertain { background: #fffbeb; }
.audit-status { padding: 10px; font-weight: 700; }
.audit-status.status-correct { color: #16a34a; }
.audit-status.status-incorrect { color: #dc2626; }
.audit-status.status-uncertain { color: #d97706; }
.cell-pad { padding: 10px; }

.modal { display: none; position: fixed; inset: 0; z-index: 10000; align-items: center; justify-content: center; padding: 18px; background: rgba(18,31,37,.52); backdrop-filter: blur(6px); }
.modal-content { width: min(640px, 100%); max-height: 88vh; overflow: auto; padding: 22px; border: 1px solid rgba(145,153,159,.22); border-radius: 20px; background: #fff; box-shadow: 0 24px 70px rgba(0,0,0,.22); }
.loading-overlay { display: none; position: fixed; inset: 0; z-index: 200000; align-items: center; justify-content: center; flex-direction: column; gap: 12px; padding: 20px; background: rgba(248,251,252,.90); backdrop-filter: blur(8px); text-align: center; }
.loading-spinner { color: var(--blue); font-size: 46px; }

.login-box { width: min(390px, 100%); margin: 16vh auto 0; padding: 30px; border: 1px solid rgba(145,153,159,.22); border-top: 5px solid var(--blue); border-radius: 22px; background: rgba(255,255,255,.94); box-shadow: var(--shadow); text-align: center; backdrop-filter: blur(12px); }
.login-box h2 { margin: 0 0 8px; color: var(--blue); font-size: 25px; }
.login-box input { margin: 14px 0; text-align: center; }
.login-box .btn { margin-top: 8px; }

.site-footer { width: min(1180px,100%); margin: 24px auto 6px; padding: 14px 18px; color: #6f7b82; text-align: center; font-size: 12px; }
.site-footer p { margin: 0; }
.site-footer a { color: var(--blue); text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }
.is-search-hidden { display: none !important; }

.mb-10 { margin-bottom: 10px; }
.gap-5 { gap: 5px; }
.file-input-compact { font-size: 13px; }

@media (max-width: 820px) {
    body { padding: 16px 11px; }
    .header-panel { padding: 20px; border-radius: 20px; }
    .header-top { align-items: flex-start; }
    .hero-copy { grid-template-columns: 40px 1fr; }
    .hero-icon { width: 40px; height: 40px; border-radius: 13px; }
    .header-actions a { width: 40px; height: 40px; padding: 0; border-radius: 12px; font-size: 0; }
    .header-actions a i { font-size: 15px; }
    .tabs-nav { display: none; }
    .tabs-nav-mobile { display: block; padding: 14px; border: 1px solid rgba(145,153,159,.22); border-radius: 15px; background: rgba(255,255,255,.90); box-shadow: var(--shadow-soft); }
    .form-row { flex-direction: column; gap: 11px; }
    .card { align-items: flex-start; flex-direction: column; }
    .actions-cell { width: 100%; }
    .panel-box { padding: 17px; }
}

@media (prefers-reduced-motion: reduce) {
    body::before, body::after { animation: none; }
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}


/* Classes extraites des anciens styles inline */
.u-s001 { margin: 20vh auto; background: white; padding: 30px; border-radius: 10px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); text-align: center; width: 100%; max-width: 350px; }
.u-s002 { color:#00A3E0; margin-top:0; }
.u-s003 { width: 100%; padding: 12px; margin: 15px 0; border: 1px solid #ddd; border-radius: 6px; box-sizing: border-box; text-align: center; font-size: 16px; }
.u-s004 { margin-top:10px; }
.u-s005 { color: #333; font-size: 18px; }
.u-s006 { margin:0; font-size:24px; }
.u-s007 { background: white; color: #333; padding: 12px; border-radius: 6px; margin-top: 15px; font-weight: bold; border-left: 4px solid var(--green); }
.u-s008 { margin-bottom:6px; font-weight:bold; color:var(--blue); }
.u-s009 { border-right: 1px solid #eee; padding-right: 15px; }
.u-s010 { padding-left: 15px; }
.u-s011 { display: inline-flex; gap: 10px; align-items: center; }
.u-s012 { padding: 8px; border-radius: 6px; border: 1px solid #ddd; font-size: 14px; }
.u-s013 { padding: 8px; border-radius: 6px; border: 1px solid #ddd; font-size: 14px; width: 80px; display: none; }
.u-s014 { flex:0 0 120px; }
.u-s015 { font-size: 18px; color: var(--blue); display: block; margin-bottom: 4px; }
.u-s016 { flex: 0 0 150px; }
.u-s017 { display:none; width:100%; margin-top:10px; }
.u-s018 { color: var(--blue); font-size:16px; }
.u-s019 { margin: 5px 0 0 0; color: #444; }
.u-s020 { flex:0 0 140px; }
.u-s021 { flex: 2; }
.u-s022 { flex: 1; }
.u-s023 { color: var(--grey); font-weight: normal; font-size:14px; }
.u-s024 { margin: 5px 0 0 0; font-weight: bold; color:#111; }
.u-s025 { font-weight: bold; color:var(--grey); }
.u-s026 { padding: 12px; font-size:14px; width:200px; }
.u-s027 { display:none; width:100%; margin-top:10px; padding:10px; }
.u-s028 { padding: 10px 14px; font-size: 14px; margin-top:10px; }
.u-s029 { display: flex; gap: 8px; margin-bottom: 25px; border-bottom: 2px solid #ddd; padding-bottom: 5px; flex-wrap: wrap; }
.u-s030 { margin-bottom: 20px; font-size:13px; color:#555; }
.u-s031 { background: #fafafa; padding: 15px; border-radius: 8px; margin-bottom: 15px; border: 1px solid #eaeaea; }
.u-s032 { margin-bottom: 10px; }
.u-s033 { margin-bottom: 0; }
.u-s034 { min-height: 120px; font-family: monospace; font-size: 13px; }
.u-s035 { display: flex; gap: 12px; flex-wrap: wrap; }
.u-s036 { flex: 1; min-width: 220px; padding: 12px; font-size: 15px; margin: 0; }
.u-s037 { background: #fffdf5; border-left-color: #f59e0b; }
.u-s038 { display: flex; justify-content: space-between; align-items: center; border-bottom:1px solid #fef3c7; padding-bottom:10px; margin-bottom: 15px; }
.u-s039 { margin:0; color:#d97706; }
.u-s040 { padding: 6px 12px; text-decoration: none; }
.u-s041 { overflow-x: auto; }
.u-s042 { width: 100%; border-collapse: collapse; background: white; font-size: 14px; text-align: left; }
.u-s043 { background: #f8fafc; border-bottom: 2px solid #e2e8f0; }
.u-s044 { padding: 10px; width: 50px; }
.u-s045 { padding: 10px; width: 140px; }
.u-s046 { padding: 10px; width: 100px; text-align: center; }
.u-s047 { padding: 10px; font-weight: bold; color: #64748b; text-align: center; }
.u-s048 { margin:0; font-family:inherit; font-size:13px; white-space: pre-wrap; word-break: break-all; }
.u-s049 { font-size: 11px; background: #91999F; color: white; padding: 2px 6px; border-radius: 4px; font-weight: normal; display: inline-block; margin-top: 4px; }
.u-s050 { padding: 10px; font-style: italic; color: #475569; }
.u-s051 { padding: 10px; text-align: center; white-space: nowrap; }
.u-s052 { align-items: flex-end; }
.u-s053 { flex: 0 0 120px; }
.u-s054 { flex: 0 0 180px; }
.u-s055 { padding: 12px 25px; }
.u-s056 { margin-top: 25px; border-top: 1px solid #f1f5f9; padding-top: 15px; }
.u-s057 { color: var(--blue); font-size: 15px; margin-bottom: 6px; }
.u-s058 { min-height: 140px; background: #fafafa; font-family: monospace; font-size: 13px; }
.u-s059 { margin-top: 6px; padding: 8px 16px; width: auto; font-size: 14px; }
.u-s060 { font-style: italic; color: #777; margin: 10px 0 0 0; }
.u-s061 { width: auto; padding: 10px 20px; }
.u-s062 { flex: 0 0 250px; }
.u-s063 { margin-bottom: 20px; }
.u-s064 { display:flex; flex-direction:column; gap:10px; margin-top: 15px; }
.u-s065 { display:flex; justify-content:space-between; align-items:center; padding: 12px; background:#fff; border-radius:6px; border:1px solid #e2e8f0; }
.u-s066 { margin-right:8px; }
.u-s067 { color:#444; }
.u-s068 { font-size: 12px; color: var(--grey); margin-top: 4px; font-style: italic; }
.u-s069 { font-size: 10px; }
.u-s070 { display:flex; justify-content:space-between; align-items:center; padding: 10px 12px; background:#f8fafc; border-radius:6px; border:1px dashed #cbd5e1; color: #64748b; font-size: 13px; }
.u-s071 { margin-right: 5px; opacity: 0.7; }
.u-s072 { background:#fef3c7; color:#d97706; margin-right:8px; }
.u-s073 { background:#f3e8ff; color:#7e22ce; margin-right:8px; }
.u-s074 { background:#f1f5f9; color:#475569; margin-right:8px; }
.u-s075 { background:#ffe4e6; color:#e11d48; margin-right:8px; }
.u-s076 { text-align: center; margin-top: 30px; margin-bottom: 20px; }
.u-s077 { margin-right: 8px; }
.u-s078 { font-weight: normal; font-style: italic; color: #666; }
.u-s079 { color: var(--blue); font-size:15px; display:block; margin-bottom:5px; font-weight: bold; }
.u-s080 { font-style: normal; color: #444; margin-top: 5px; border-left: 3px solid #eee; padding-left: 10px; }
.u-s081 { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eee; padding-bottom: 10px; margin-bottom: 15px; }
.u-s082 { margin: 0; color: var(--blue); }
.u-s083 { color: #aaa; font-size: 28px; font-weight: bold; cursor: pointer; }
.u-s084 { width: 100%; min-height: 250px; font-family: monospace; font-size: 13px; padding: 10px; box-sizing: border-box; border-radius: 8px; border: 1px solid #ddd; }
.u-s085 { display: flex; gap: 10px; margin-top: 15px; justify-content: flex-end; }
.u-s086 { width: auto; padding: 10px 20px; margin: 0; }
.u-s087 { background: #fffdf5; border-left-color: #f59e0b; margin-bottom: 30px; }
.u-s088 { margin-top:0; color:#d97706; border-bottom:1px solid #fef3c7; padding-bottom:10px; }
.u-s089 { overflow-x: auto; margin-bottom: 15px; }
.u-s090 { padding: 10px; width: 40px; }
.u-s091 { padding: 10px; width: 100px; }
.u-s092 { padding: 10px; white-space: nowrap; }
.u-s093 { display: flex; gap: 10px; justify-content: flex-end; }
.u-s094 { width: auto; padding: 12px 20px; margin: 0; }
.u-s095 { width: auto; padding: 12px 25px; margin: 0; }
.u-s096 { display: flex; gap: 15px; align-items: flex-end; flex-wrap: wrap; margin-top:15px; }
.u-s097 { flex: 1; min-width: 80px; }
.u-s098 { flex: 1; min-width: 120px; }
.u-s099 { padding-bottom: 12px; font-weight: bold; color: var(--grey); }
.u-s100 { flex: 1; min-width: 110px; }
.u-s101 { flex: 1; min-width: 140px; }
.u-s102 { flex: 1; min-width: 130px; }
.u-s103 { display:flex; gap:10px; min-width:180px; }
.u-s104 { padding: 11px 20px; font-size: 15px; }
.u-s105 { margin-top: 15px; border-top: 1px dashed #ddd; padding-top: 15px; }
.u-s106 { padding: 10px 14px; font-size: 14px; }


/* Normalisation des éléments qui utilisaient encore des styles inline dans l'ancienne version */
.actions-cell .btn-action { flex: 0 0 auto; }
.card { border-left-color: rgba(0, 163, 224, .22); }
.tabs-nav + .panel-box { margin-top: 2px; }
table { width: 100%; border-collapse: collapse; background: #fff; font-size: 13px; text-align: left; }
th, td { padding: 10px; border-bottom: 1px solid rgba(145,153,159,.17); vertical-align: top; }
thead th { background: #f7fafb; color: #526068; font-weight: 700; }
.panel-box table .btn-action { min-width: 34px; padding: 6px 8px; }
.panel-box form .btn-action { text-align: center; }
a[href*="limit="][class~="btn"] { width: auto; padding-inline: 28px; }

/* ===== Tableau de bord TextoFlash ===== */
.dashboard-hero,
.control-hero {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 22px;
    background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(244,251,253,.96));
}
.dashboard-hero-copy,
.control-hero > div:first-child { flex: 1; }
.dashboard-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 8px;
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.dashboard-hero h3,
.control-hero h3 { margin: 0 0 8px; font-size: clamp(22px, 2.5vw, 30px); }
.dashboard-hero p,
.control-hero p { max-width: 760px; margin: 0; color: var(--muted); line-height: 1.55; }
.today-publication-card {
    flex: 0 0 280px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 6px;
    padding: 18px;
    border: 1px solid rgba(145,153,159,.18);
    border-left: 5px solid var(--grey);
    border-radius: 16px;
    background: #fff;
    box-shadow: var(--shadow-soft);
}
.today-publication-card .today-label { color: var(--muted); font-size: 12px; font-weight: 700; }
.today-publication-card > strong { font-size: 20px; }
.today-publication-card > span:not(.today-label) { color: var(--muted); font-size: 12px; }
.today-publication-card .btn-action { margin-top: 6px; }

.kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}
.kpi-card {
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 120px;
    padding: 17px;
    border: 1px solid rgba(145,153,159,.18);
    border-radius: 16px;
    background: rgba(255,255,255,.94);
    box-shadow: var(--shadow-soft);
}
.kpi-icon {
    display: grid;
    place-items: center;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    font-size: 18px;
}
.kpi-card > div { min-width: 0; }
.kpi-label,
.kpi-card small { display: block; color: var(--muted); font-size: 11px; line-height: 1.35; }
.kpi-card strong { display: block; margin: 3px 0; font-size: 24px; line-height: 1.05; }
.kpi-blue .kpi-icon { color: var(--blue); background: rgba(0,163,224,.10); }
.kpi-green .kpi-icon { color: var(--green); background: rgba(115,201,45,.12); }
.kpi-grey .kpi-icon { color: var(--grey); background: rgba(145,153,159,.13); }
.kpi-orange .kpi-icon { color: #c98000; background: rgba(201,128,0,.10); }
.kpi-red .kpi-icon { color: #c44747; background: rgba(196,71,71,.10); }

.dashboard-columns {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(280px, .8fr);
    gap: 22px;
}
.panel-heading-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}
.panel-heading-row .section-title { margin-bottom: 5px; }
.timeliness-summary { display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 22px; align-items: center; margin-top: 18px; }
.timeliness-number {
    display: grid;
    place-items: center;
    min-height: 150px;
    padding: 20px;
    border: 1px solid rgba(115,201,45,.24);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(115,201,45,.12), rgba(255,255,255,.92) 70%);
    text-align: center;
}
.timeliness-number strong { color: var(--green); font-size: 34px; }
.timeliness-number span { color: var(--muted); font-size: 12px; font-weight: 700; }
.timeliness-bars { display: grid; gap: 12px; }
.progress-line { display: grid; grid-template-columns: 155px 1fr 34px; gap: 10px; align-items: center; font-size: 12px; }
.progress-line > span { color: #45535b; font-weight: 700; }
.progress-line b { text-align: right; }
.progress-track { height: 8px; overflow: hidden; border-radius: 999px; background: rgba(145,153,159,.14); }
.progress-fill { display: block; width: 0; height: 100%; border-radius: inherit; transition: width .5s ease; }
.progress-green { background: var(--green); }
.progress-orange { background: #d28a11; }
.progress-red { background: #c84c4c; }
.progress-grey { background: var(--grey); }
.dashboard-note { display: flex; gap: 9px; margin-top: 18px; padding: 11px 13px; border-radius: 11px; color: #617078; background: rgba(0,163,224,.06); font-size: 12px; line-height: 1.45; }
.dashboard-note i { margin-top: 2px; color: var(--blue); }
.content-count-list { display: grid; gap: 7px; }
.content-count-list a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 12px; border-radius: 11px; color: #44525a; background: #f8fbfc; text-decoration: none; transition: .18s ease; }
.content-count-list a:hover { color: var(--blue); background: rgba(0,163,224,.07); transform: translateX(2px); }
.content-count-list span { display: flex; align-items: center; gap: 8px; }
.content-count-list i { width: 18px; color: var(--blue); text-align: center; }
.publication-timeline { display: grid; grid-template-columns: repeat(7, minmax(100px,1fr)); gap: 9px; overflow-x: auto; padding: 5px 1px 4px; }
.publication-day {
    min-width: 100px;
    padding: 12px 10px;
    border: 1px solid rgba(145,153,159,.18);
    border-bottom: 4px solid var(--grey);
    border-radius: 13px;
    color: #344149;
    background: #fff;
    text-align: center;
    text-decoration: none;
}
.publication-day:hover { transform: translateY(-1px); box-shadow: var(--shadow-soft); }
.publication-day > span { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; }
.publication-day > strong { display: inline-block; margin: 4px 2px 1px; font-size: 22px; }
.publication-day > small { color: var(--muted); }
.publication-day > em { display: block; min-height: 26px; margin-top: 6px; font-size: 10px; font-style: normal; line-height: 1.2; }
.status-dot { display: block; width: 7px; height: 7px; margin: 5px auto 0; border-radius: 50%; background: var(--grey); }
.publication-day.is-today { outline: 2px solid rgba(0,163,224,.23); outline-offset: 2px; }

/* ===== États de publication ===== */
.status-tone-green { --status-color: var(--green); --status-bg: rgba(115,201,45,.09); }
.status-tone-blue { --status-color: var(--blue); --status-bg: rgba(0,163,224,.08); }
.status-tone-grey { --status-color: var(--grey); --status-bg: rgba(145,153,159,.09); }
.status-tone-orange { --status-color: #cf8610; --status-bg: rgba(207,134,16,.09); }
.status-tone-red { --status-color: #c94d4d; --status-bg: rgba(201,77,77,.08); }
.today-publication-card[class*="status-tone-"],
.publication-day[class*="status-tone-"],
.control-day-card[class*="status-tone-"] { border-color: color-mix(in srgb, var(--status-color) 35%, transparent); }
.today-publication-card[class*="status-tone-"] { border-left-color: var(--status-color); }
.publication-day[class*="status-tone-"] { border-bottom-color: var(--status-color); }
.publication-day[class*="status-tone-"] .status-dot { background: var(--status-color); }
.publication-day[class*="status-tone-"] > em { color: var(--status-color); font-weight: 700; }

/* ===== Cockpit Contrôle ===== */
.control-hero { align-items: center; }
.control-legend { flex: 0 0 310px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.legend-item { display: flex; align-items: center; gap: 7px; padding: 8px 9px; border-radius: 9px; background: var(--status-bg); color: #526068; font-size: 11px; font-weight: 700; }
.legend-item i { width: 8px; height: 8px; border-radius: 50%; background: var(--status-color); }
.control-toolbar { display: grid; grid-template-columns: minmax(190px,1fr) auto; gap: 13px 18px; align-items: center; }
.control-toolbar-copy strong,
.control-toolbar-copy span { display: block; }
.control-toolbar-copy strong { margin-bottom: 3px; }
.control-toolbar-copy span { color: var(--muted); font-size: 12px; }
.control-toolbar-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.status-filters { grid-column: 1 / -1; padding-top: 12px; border-top: 1px solid rgba(145,153,159,.15); }
.filter-chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; border: 1px solid rgba(145,153,159,.22); border-radius: 999px; color: #5e6a72; background: #fff; font-size: 11px; font-weight: 700; text-decoration: none; }
.filter-chip:hover { color: var(--blue); border-color: rgba(0,163,224,.30); }
.filter-chip.active { color: #fff; border-color: transparent; background: var(--blue); }
.control-list { display: grid; gap: 12px; }
.control-day-card { overflow: hidden; border: 1px solid rgba(145,153,159,.20); border-left: 5px solid var(--status-color); border-radius: 15px; background: rgba(255,255,255,.96); box-shadow: var(--shadow-soft); }
.control-day-card.is-today { box-shadow: 0 0 0 3px rgba(0,163,224,.10), var(--shadow-soft); }
.control-day-card > summary { display: grid; grid-template-columns: 110px minmax(0,1fr) 140px; gap: 16px; align-items: center; padding: 15px 17px; cursor: pointer; list-style: none; background: linear-gradient(90deg, var(--status-bg), rgba(255,255,255,.96) 30%); }
.control-day-card > summary::-webkit-details-marker { display: none; }
.control-date-block { padding-right: 15px; border-right: 1px solid rgba(145,153,159,.17); }
.control-date-block span { display: block; color: var(--status-color); font-size: 21px; font-weight: 800; }
.control-date-block strong { color: var(--muted); font-size: 11px; }
.control-title-row { display: flex; align-items: center; gap: 8px; }
.control-title-row > strong { color: var(--status-color); font-size: 16px; }
.today-chip { padding: 4px 7px; border-radius: 999px; color: #fff; background: var(--blue); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.control-deadline { display: block; margin-top: 3px; color: #55636b; font-size: 11px; }
.control-mini-status { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.control-mini-status span { display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; border-radius: 999px; background: rgba(145,153,159,.08); font-size: 9px; font-weight: 700; }
.control-mini-status .is-ok { color: #5c9e28; background: rgba(115,201,45,.10); }
.control-mini-status .is-ko { color: #7a858c; }
.control-summary-side { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 10px; text-align: right; }
.control-summary-side small { grid-column: 1; color: var(--muted); font-size: 9px; }
.control-summary-side strong { grid-column: 1; font-size: 12px; }
.summary-chevron { grid-column: 2; grid-row: 1 / span 2; color: var(--grey); transition: transform .18s ease; }
.control-day-card[open] .summary-chevron { transform: rotate(180deg); }
.control-day-details { padding: 16px 17px 17px; border-top: 1px solid rgba(145,153,159,.14); background: #fbfdfd; }
.control-detail-grid { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(270px,.8fr); gap: 14px; }
.control-detail-card { padding: 13px; border: 1px solid rgba(145,153,159,.16); border-radius: 12px; background: #fff; }
.control-detail-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; color: #46545c; font-size: 12px; font-weight: 800; }
.control-detail-title span { display: flex; align-items: center; gap: 7px; }
.control-detail-title i { color: var(--blue); }
.control-data-line { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid rgba(145,153,159,.10); }
.control-data-line:first-of-type { border-top: 0; }
.control-data-line > div { min-width: 0; }
.control-data-line b,
.control-data-line span { display: block; }
.control-data-line b { margin-bottom: 2px; font-size: 11px; }
.control-data-line span { overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.empty-control-data { padding: 12px; border-radius: 9px; color: #7b6868; background: rgba(201,77,77,.06); font-size: 11px; }
.empty-control-data a { color: var(--blue); font-weight: 700; }
.enrichment-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.enrichment-stats a { display: grid; grid-template-columns: 30px 1fr; align-items: center; padding: 9px; border-radius: 10px; color: #44525a; background: #f7fafb; text-decoration: none; }
.enrichment-stats i { grid-row: 1 / span 2; color: var(--blue); }
.enrichment-stats strong { font-size: 16px; }
.enrichment-stats span { color: var(--muted); font-size: 9px; }
.control-secondary-list { display: grid; gap: 5px; margin-top: 12px; }
.control-secondary-list > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border: 1px solid rgba(145,153,159,.12); border-radius: 9px; background: #fff; font-size: 10px; }
.control-secondary-list > div > span { display: flex; align-items: center; gap: 6px; min-width: 0; }
.control-secondary-list > div > span i { color: var(--grey); }
.empty-control-result { display: flex; align-items: center; justify-content: center; gap: 9px; color: var(--green); text-align: center; }

/* ===== Supervision cron / app.ceg.gy ===== */
.monitoring-status { display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border-radius: 999px; color: #579822; background: rgba(115,201,45,.10); font-size: 10px; font-weight: 800; white-space: nowrap; }
.monitoring-form { margin-top: 14px; }
.monitoring-days-field { flex: 0 0 330px; }
.copy-field-row { display: flex; gap: 7px; }
.copy-field-row input { flex: 1; }
.monitoring-endpoint-box { margin-top: 16px; padding: 14px; border: 1px solid rgba(0,163,224,.16); border-radius: 12px; background: rgba(0,163,224,.04); }
.api-contract-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; margin-top: 10px; color: var(--muted); font-size: 10px; }
.api-contract-grid span { padding: 6px 7px; border-radius: 7px; background: rgba(255,255,255,.70); }
.api-contract-grid b { display: block; color: #46545c; }
.regenerate-token-form { margin-top: 10px; }

@media (max-width: 1000px) {
    .kpi-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .dashboard-columns { grid-template-columns: 1fr; }
    .publication-timeline { grid-template-columns: repeat(4, minmax(100px,1fr)); }
    .control-hero { align-items: flex-start; flex-direction: column; }
    .control-legend { width: 100%; flex-basis: auto; }
    .control-day-card > summary { grid-template-columns: 90px minmax(0,1fr); }
    .control-summary-side { grid-column: 1 / -1; grid-template-columns: auto auto 1fr; padding-top: 9px; border-top: 1px solid rgba(145,153,159,.12); text-align: left; }
    .control-summary-side small,
    .control-summary-side strong { grid-column: auto; }
    .summary-chevron { grid-column: 3; grid-row: 1; justify-self: end; }
}

@media (max-width: 720px) {
    .dashboard-hero { flex-direction: column; }
    .today-publication-card { flex-basis: auto; width: 100%; }
    .kpi-grid { grid-template-columns: 1fr; }
    .timeliness-summary { grid-template-columns: 1fr; }
    .timeliness-number { width: 150px; min-height: 150px; margin: 0 auto; }
    .progress-line { grid-template-columns: 125px 1fr 30px; }
    .publication-timeline { grid-template-columns: repeat(3, minmax(96px,1fr)); }
    .control-toolbar { grid-template-columns: 1fr; }
    .control-toolbar-actions { justify-content: flex-start; }
    .control-day-card > summary { grid-template-columns: 1fr; gap: 10px; }
    .control-date-block { display: flex; align-items: baseline; gap: 8px; padding: 0 0 9px; border-right: 0; border-bottom: 1px solid rgba(145,153,159,.14); }
    .control-date-block span { font-size: 18px; }
    .control-detail-grid { grid-template-columns: 1fr; }
    .monitoring-days-field { flex-basis: auto; }
    .api-contract-grid { grid-template-columns: 1fr; }
}
.content-count-list a > span > span { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; }
.content-count-list a > span > span small { color: var(--muted); font-size: 9px; font-weight: 400; }