/* Identité partagée et écrans de configuration — téléphone, tablette, ordinateur. */
:root{--pki-ink:#17324d;--pki-teal:#176e7c;--pki-muted:#597087;--pki-border:#d7e4eb;--pki-paper:#fff}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--pki-ink);background:#f4f7fb}
*{box-sizing:border-box}
.container{max-width:1200px;margin-inline:auto;padding:28px 24px 48px}
.topbar{position:sticky;top:0;z-index:30;border-bottom:1px solid var(--pki-border);background:#fffffffa}
.topbar .topbar-inner{max-width:1200px;margin:auto;display:flex;align-items:center;gap:16px;padding:12px 24px}
.topbar .brand{min-width:0;display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--pki-ink);font-weight:750;flex:1}
.topbar .brand .brand-mark{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border-radius:12px;background:var(--pki-ink);color:#fff}
.topbar .brand .name{display:block!important;min-width:0;font-size:15px;line-height:1.3;white-space:normal;overflow-wrap:anywhere;overflow:visible}
.topbar .brand .name>span{display:block;white-space:normal;overflow-wrap:anywhere;overflow:visible}
.topbar .brand small{display:block!important;margin-top:3px;color:var(--pki-muted);font-size:11px}
.topbar svg{width:20px;height:20px;flex-shrink:0}
.topbar .top-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;max-width:65%;margin-left:auto}
.topbar .top-actions .btn{width:auto;min-height:44px;white-space:normal;flex-shrink:0}
.pki-home-hero{border-radius:28px;padding:clamp(24px,5vw,52px);background:linear-gradient(125deg,#17324d,#176e7c);color:#fff;box-shadow:0 20px 55px #18394b16}
.pki-kicker{font-size:11px;font-weight:750;letter-spacing:.1em;line-height:1.7;text-transform:uppercase;overflow-wrap:anywhere;margin:0}
.pki-home-hero .pki-kicker{color:#dbeaf1}
.pki-home-hero h1{font-size:clamp(30px,5.1vw,58px);line-height:1.08;letter-spacing:-.035em;max-width:980px;margin:12px 0 18px;overflow-wrap:anywhere}
.pki-subtitle{font-size:clamp(16px,2.1vw,22px);line-height:1.5;margin:0;overflow-wrap:anywhere}
.pki-byline{font-size:14px;margin:22px 0;color:#e1edf1}
.pki-hero-actions,.pki-card-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.pki-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border:1px solid var(--pki-border);border-radius:11px;padding:11px 16px;font:700 14px/1.4 system-ui;color:var(--pki-ink);background:#fff;text-decoration:none;cursor:pointer;max-width:100%;overflow-wrap:anywhere;touch-action:manipulation;text-align:center}
.pki-button svg{width:19px;height:19px;flex-shrink:0}
.pki-button.primary{background:var(--pki-teal);border-color:var(--pki-teal);color:#fff}
.pki-button.outline{background:transparent;color:#fff;border-color:#a2c2cc}
.pki-button:disabled{cursor:not-allowed;opacity:.5}
.pki-button:hover:not(:disabled){filter:brightness(.96)}
.pki-button:focus-visible,.pki-space:focus-visible,.pki-back:focus-visible{outline:3px solid #cf8731;outline-offset:4px}
.pki-learning-path{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:650px;margin-top:30px}
.pki-learning-path>div{display:grid;justify-items:center;align-content:start;gap:7px;text-align:center;border:1px solid #ffffff40;border-radius:15px;padding:16px 9px;background:#ffffff07;min-width:0}
.pki-learning-path svg{width:25px;height:25px}
.pki-learning-path strong{font-size:14px}
.pki-learning-path span{font-size:12px;color:#e1edf1}
.pki-home-section{margin-top:36px}
.pki-home-section h2{font-size:clamp(23px,3vw,32px);letter-spacing:-.025em;margin:5px 0}
.pki-home-section>p:not(.pki-kicker){margin:0;color:var(--pki-muted);line-height:1.6}
.pki-home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:20px}
.pki-card{min-width:0;border:1px solid var(--pki-border);border-radius:20px;padding:24px;background:var(--pki-paper);box-shadow:0 6px 24px #23425205}
.pki-card h3{margin:12px 0 8px;font-size:20px;line-height:1.3;overflow-wrap:anywhere}
.pki-card p{color:var(--pki-muted);line-height:1.65;margin:8px 0 16px;overflow-wrap:anywhere}
.pki-space{color:var(--pki-ink);display:flex;gap:16px;text-decoration:none;align-items:flex-start;transition:border-color .15s,transform .15s}
.pki-space:hover{border-color:#73a7b7;transform:translateY(-2px)}
.pki-space>div{flex:1;min-width:0}
.pki-space h3{margin-top:0}
.pki-space>span:last-child{align-self:center;color:var(--pki-muted)}
.pki-icon{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;background:#edf6f7;border-radius:13px;color:var(--pki-teal)}
.pki-icon svg{width:24px;height:24px}
.pki-icon.purple,.pki-label.purple{background:#f0edfa;color:#6551a3}
.pki-icon.gold{background:#fff4e8;color:#a95d16}
.pki-label{display:inline-block;border-radius:6px;padding:5px 7px;background:#edf6f7;color:var(--pki-teal);font-size:10px;letter-spacing:.03em;font-weight:800}
.pki-footer{max-width:1200px;margin:auto;padding:24px;display:flex;gap:10px 24px;flex-wrap:wrap;border-top:1px solid var(--pki-border);color:var(--pki-muted);font-size:12px;line-height:1.7;overflow-wrap:anywhere}
.pki-footer>span:first-child{margin-right:auto}
.pki-settings{max-width:1060px;margin:auto}
.pki-back{display:inline-flex;min-height:44px;align-items:center;color:var(--pki-teal);text-decoration:none;font-weight:650}
.pki-heading{display:flex;gap:16px;align-items:center;margin:20px 0}
.pki-heading>div{min-width:0}
.pki-heading h1{font-size:clamp(24px,3.8vw,36px);line-height:1.15;margin:4px 0 10px;overflow-wrap:anywhere}
.pki-heading p{color:var(--pki-muted)}
.pki-settings-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:20px;align-items:start}
.pki-message{border:1px solid #bddbe5;border-radius:13px;background:#edf7fc;color:#2c556c;padding:17px;margin:16px 0;font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.pki-message p{margin:8px 0 12px}
.pki-message.warning{background:#fff8e7;border-color:#ebd7a4;color:#795818}
.pki-form{display:grid;gap:10px}
.pki-form label{font-size:13px;font-weight:750;line-height:1.5;margin-top:5px}
.pki-form input{min-width:0;width:100%;min-height:48px;font:400 16px/1.4 system-ui;color:var(--pki-ink);background:#fff;border:1px solid #b6c9d6;border-radius:10px;padding:10px 12px}
.pki-form input:focus{outline:3px solid #176e7c20;border-color:var(--pki-teal)}
.pki-form input:disabled{background:#f3f6f9;color:#536779}
.pki-help{font-size:12px!important;color:var(--pki-muted);line-height:1.6;margin:8px 0!important}
.pki-help.success{color:#15724d}.pki-help.error{color:#a03434}
.pki-preview h2{font-size:27px;line-height:1.2;overflow-wrap:anywhere;margin:18px 0}
.pki-preview hr{border:0;border-top:1px solid var(--pki-border);margin:20px 0}
/* Also keep modal authentication usable without waiting for optional layout assets. */
.modal-backdrop{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#10213575;padding:12px;overflow-y:auto}
.modal{width:min(500px,100%);max-height:calc(100dvh - 24px);overflow:auto;border-radius:18px;background:#fff;margin:0!important}
.modal-head{padding:18px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--pki-border)}
.modal-head h3{margin:0;flex:1}.modal-body{padding:20px}
.modal .form{display:grid;gap:14px}.modal .field{display:grid;gap:6px}
.modal label{font-size:13px;font-weight:700}.modal input{width:100%;min-width:0;min-height:48px;font-size:16px;border:1px solid var(--pki-border);border-radius:9px;padding:10px}
.modal .btn{min-height:44px}.modal svg{width:18px;height:18px}
@media(max-width:760px){
 .container{padding:20px 14px 32px}.pki-settings-grid,.pki-home-grid{grid-template-columns:1fr}
 .topbar .topbar-inner{padding:10px 14px;flex-wrap:wrap;gap:10px}
 .topbar .brand{flex-basis:100%}.topbar .brand .name{font-size:14px;flex:1}
 .topbar .top-actions{width:100%;max-width:100%;margin-left:0;overflow:visible}
 .topbar .user-chip{max-width:100%;white-space:normal;overflow-wrap:anywhere}
 .pki-home-hero{border-radius:22px}.pki-home-grid{gap:14px}.pki-card{padding:20px}
 .pki-footer{padding:20px 14px;flex-direction:column;gap:4px}.pki-heading{align-items:flex-start}
 .pki-heading .pki-icon{margin-top:6px}.pki-learning-path{gap:9px}
}
@media(max-width:360px){.pki-home-hero{padding:22px 18px}.pki-hero-actions{display:grid;grid-template-columns:1fr}.pki-learning-path{gap:6px}.pki-learning-path strong{font-size:12px}.pki-learning-path span{font-size:11px}.pki-heading{gap:10px}.pki-card{padding:17px}.pki-space{gap:12px}.topbar .top-actions{gap:6px}}
@media(prefers-reduced-motion:reduce){.pki-space{transition:none}.pki-space:hover{transform:none}}
@media print{.topbar,.pki-hero-actions,.pki-card-actions{display:none!important}.pki-home-hero{background:white;color:#17324d;border:1px solid #bbcbd4;box-shadow:none}.pki-home-hero .pki-kicker,.pki-byline{color:#17324d}.pki-footer{font-size:10px}}

@media(max-width:430px){.topbar .user-chip{display:none}}