/* Cockpit — coque de l'application : barre, connexion, vue agence */
[hidden]{display:none!important}
html,body{margin:0}
body{padding-bottom:env(safe-area-inset-bottom,0px)}
img{max-width:100%}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.screen{min-height:70vh;display:grid;place-items:center;padding:24px 16px}
.loading{color:var(--ink-soft)}

/* barre */
.appbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--surface);border-bottom:1px solid var(--line)}
.appbar-in{max-width:1120px;margin:0 auto;padding:10px 20px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.applogo{font-family:var(--f-title);font-weight:600;font-size:1.05rem;text-decoration:none;color:var(--ink);display:inline-flex;gap:8px;align-items:center}
.appnav{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
.appnav-link{font-size:.86rem;font-weight:600;color:var(--ink-soft);text-decoration:none;padding:6px 10px;border-radius:8px}
.appnav-link:hover,.appnav-link[aria-current="page"]{color:var(--ink);background:var(--surface-2)}
.brandpick select{font:inherit;font-size:.88rem;font-weight:600;padding:7px 30px 7px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface-2);color:var(--ink);max-width:100%}
.appuser{display:flex;align-items:center;gap:10px;font-size:.8rem;color:var(--ink-soft);min-width:0}
.appuser span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:26ch}
.appuser .btn{padding:6px 11px;font-size:.8rem}
@media(max-width:640px){.appbar-in{padding:8px 16px}.appuser span{display:none}.appnav{order:3;flex-basis:100%}}

/* connexion */
.login{width:100%;max-width:400px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:30px 26px;box-shadow:var(--shadow)}
.login-mark{font-size:2rem;margin:0}
.login h1{font-family:var(--f-title);font-weight:600;font-size:1.7rem;margin:6px 0 8px}
.login-lead{color:var(--ink-soft);font-size:.92rem;margin:0 0 20px}
.login form{display:flex;flex-direction:column;gap:10px}
.login label{font-size:.8rem;font-weight:600;color:var(--ink-soft)}
.login input{font:inherit;font-size:1rem;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);color:var(--ink)}
.login input:focus{outline:2px solid var(--accent);outline-offset:1px}
#login-code{letter-spacing:.3em;font-variant-numeric:tabular-nums;font-size:1.2rem}
.btn.big{padding:11px 16px;font-size:.95rem;margin-top:4px}
.linkbtn{appearance:none;background:none;border:0;color:var(--accent);font:inherit;font-size:.85rem;font-weight:600;cursor:pointer;padding:4px 0;align-self:flex-start}
.login-sent{font-size:.9rem;margin:0 0 4px}
.login-msg{font-size:.86rem;margin:14px 0 0;color:var(--ink-soft);min-height:1.2em}
.login-msg.err{color:var(--crit)}

/* vue agence */
.ag-hd{padding:28px 0 18px}
.ag-hd h1{font-family:var(--f-title);font-weight:600;font-size:1.6rem;margin:0}
.ag-hd p{margin:4px 0 0;color:var(--ink-soft);font-size:.9rem}
.ag-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 26px}
@media(max-width:820px){.ag-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ag-tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}
.ag-tile .n{font-family:var(--f-title);font-weight:900;font-size:1.9rem;line-height:1.05;font-variant-numeric:tabular-nums}
.ag-tile .l{font-size:.8rem;color:var(--ink-soft);margin-top:4px}
.ag-tile.you .n{color:var(--st-approuve)}
.ag-tile.them .n{color:var(--st-avalider)}
.ag-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}
.ag-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;display:flex;flex-direction:column;gap:12px;min-width:0}
.ag-card-hd{display:flex;align-items:center;gap:12px;min-width:0}
.ag-em{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;font-family:var(--f-title);font-weight:900;font-size:1.2rem;flex:none}
.ag-card-hd b{font-family:var(--f-title);font-weight:600;font-size:1.08rem;display:block}
.ag-card-hd small{color:var(--ink-soft);font-size:.78rem}
.ag-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ag-stat{background:var(--surface-2);border-radius:10px;padding:8px 10px}
.ag-stat .n{font-weight:600;font-size:1.15rem;font-variant-numeric:tabular-nums}
.ag-stat .l{font-size:.7rem;color:var(--ink-soft);line-height:1.3}
.ag-stat.hot-you .n{color:var(--st-approuve)}
.ag-stat.hot-them .n{color:var(--st-avalider)}
.ag-todo{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:.84rem}
.ag-todo li{display:flex;gap:8px;align-items:baseline}
.ag-todo li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--st-approuve);flex:none;transform:translateY(-1px)}
.ag-todo li.them::before{background:var(--st-avalider)}
.ag-todo li.ok::before{background:var(--st-publie)}
.ag-card .btn{align-self:flex-start;text-decoration:none}
.ag-sec{font-family:var(--f-title);font-weight:600;font-size:1.1rem;margin:30px 0 10px}
.ag-agenda{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.ag-row{display:grid;grid-template-columns:110px 150px 1fr auto;gap:12px;align-items:center;padding:10px 16px;border-top:1px solid var(--line);font-size:.87rem}
.ag-row:first-child{border-top:0}
.ag-row .d{font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink-soft)}
.ag-row .m{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ag-row .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:640px){.ag-row{grid-template-columns:1fr auto}.ag-row .d{grid-column:1/-1}.ag-row .m{grid-column:1/-1}}
