:root { --editor-topbar-height:64px; }
.app-topbar { height:64px; grid-template-columns:auto minmax(90px,1fr) auto; }
.autosave-wrap { min-width:0; justify-self:center; max-width:100%; }
.cv-name-input { min-width:0; max-width:100%; }
.topbar-right { gap:8px; }
.editor-icon-button, #btn-translate {
  min-height:44px; border:1px solid #17213b1a; border-radius:12px;
  background:#f7f7f6; color:var(--ink); display:flex; align-items:center;
  justify-content:center; gap:8px; cursor:pointer; font:inherit;
}
.editor-icon-button, #btn-undo { width:44px; height:44px; padding:0; flex:none; }
#btn-undo { border-radius:12px; }
.editor-icon-button[aria-disabled="true"] { opacity:.4; cursor:default; }
.editor-icon-button:focus-visible, #btn-translate:focus-visible,
.editor-notification-close:focus-visible, #translation-menu button:focus-visible {
  outline:3px solid var(--brand); outline-offset:3px;
}
.editor-language { position:relative; flex:none; }
.editor-language[hidden], #translation-menu[hidden], .editor-notification[hidden] { display:none; }
#btn-translate { padding:0 12px; font-weight:700; min-width:88px; }
#btn-translate:disabled { opacity:.6; cursor:wait; }
#btn-download-pdf { min-height:44px; }
.topbar-right > button, #btn-translate { transition:filter .12s ease,box-shadow .12s ease,transform .12s ease; }
.topbar-right > button:not(:disabled):not([aria-disabled="true"]):active,
#btn-translate:not(:disabled):active,
.topbar-right > button.is-pressed, #btn-translate.is-pressed {
  filter:brightness(.9); box-shadow:inset 0 2px 5px #18233b26; transform:translateY(1px);
}
#btn-translate[aria-expanded="true"] { border-color:#303f9b66; background:#eef0fc; color:var(--brand); }
#translation-menu, .editor-notification {
  background:#fcfcfb; border:1px solid #fff; color:var(--ink);
  box-shadow:0 12px 36px #18233b18, inset 0 1px 0 #ffffffd9;
}
@supports ((backdrop-filter:blur(20px)) or (-webkit-backdrop-filter:blur(20px))) {
  #translation-menu, .editor-notification {
    background:rgba(252,252,251,.78);
    -webkit-backdrop-filter:blur(20px) saturate(145%);
    backdrop-filter:blur(20px) saturate(145%);
  }
}
#translation-menu {
  position:absolute; top:calc(100% + 10px); right:0; z-index:80;
  width:288px; max-width:calc(100vw - 24px); padding:18px; border-radius:20px;
  max-height:calc(100dvh - var(--editor-topbar-height) - 32px); overflow-y:auto;
}
#translation-menu strong { display:block; margin:0 28px 14px; font-size:14px; line-height:1.4; text-align:center; }
#translation-menu button {
  display:flex; align-items:center; justify-content:space-between; width:100%;
  min-height:48px; padding:12px; border:0; border-radius:10px;
  background:transparent; color:var(--ink); font:inherit; cursor:pointer; text-align:left;
}
#translation-menu button:hover, #translation-menu button:focus-visible,
#translation-menu button[aria-pressed="true"] { background:#303f9b0d; }
#translation-menu button span { color:var(--ink-soft); font-size:13px; }
#translation-menu .translation-menu-close {
  position:absolute; right:6px; top:6px; width:44px; height:44px;
  min-height:44px; padding:0; justify-content:center; font-size:25px;
}
#translation-menu p { margin:14px 0 0; font-size:12px; line-height:1.5; text-align:center; color:var(--ink-soft); }
#editor-notifications {
  position:fixed; z-index:110; top:var(--editor-floating-offset,calc(var(--editor-topbar-height) + 10px));
  left:50%; transform:translateX(-50%); display:grid; gap:10px;
  width:min(480px,calc(100vw - 24px)); pointer-events:none;
  max-height:calc(100dvh - var(--editor-floating-offset,var(--editor-topbar-height)) - 14px); overflow-y:auto;
  padding:4px;
}
.editor-notification {
  display:grid; grid-template-columns:24px minmax(0,1fr) 32px;
  align-items:start; gap:10px; padding:14px 10px 14px 16px;
  border-radius:18px; pointer-events:auto;
}
#status-message, #editor-translation-status {
  position:static; font:inherit; font-size:14px; line-height:1.5;
  white-space:normal; overflow:visible; overflow-wrap:anywhere;
  text-overflow:clip; color:var(--ink); min-width:0;
}
.editor-notification-icon {
  display:grid; place-items:center; width:24px; height:24px;
  border-radius:50%; color:#087b60; background:#087b6014; font-weight:700;
}
.editor-notification[data-tone="error"] .editor-notification-icon { color:#a12e38; background:#a12e3812; }
.editor-notification[data-tone="error"] { border-color:#a12e3830; }
.editor-notification[data-tone="busy"] .editor-notification-icon {
  background:transparent; border:2px solid #303f9b24; border-top-color:var(--brand);
  animation:editor-notice-spin 1s linear infinite;
}
.editor-notification-close {
  width:32px; height:32px; margin-top:-4px; padding:0; border:0;
  border-radius:8px; background:transparent; color:var(--ink-soft); font-size:24px; cursor:pointer;
}
.editor-notification-close:hover { background:#17213b0a; }
.app { height:calc(100vh - var(--editor-topbar-height)); }
@keyframes editor-notice-spin { to { transform:rotate(360deg); } }
@media(max-width:1000px) { .app-topbar .brand-text { display:none; } }
@media(max-width:760px) {
  .app-topbar { height:auto; min-height:98px; padding:8px 12px; gap:8px 12px; grid-template-columns:28px minmax(0,1fr) 28px; }
  .topbar-left { grid-column:1; grid-row:1; }
  .autosave-wrap { grid-column:2; grid-row:1; justify-self:center; justify-content:center; }
  #cv-nom-input { flex:0 1 auto; width:180px; min-width:100px; text-align:center; }
  .topbar-right { grid-column:1 / -1; grid-row:2; justify-self:stretch; justify-content:space-between; gap:6px; }
  .app { height:auto; min-height:calc(100vh - var(--editor-topbar-height)); }
  .topbar-right > button, #btn-translate { position:relative; min-height:36px; height:36px; border-radius:10px; }
  .topbar-right > button::after, #btn-translate::after { content:''; position:absolute; inset:-4px 0; }
  .editor-icon-button, #btn-undo { width:36px; height:36px; min-height:36px; }
  .topbar-right svg:not(.translation-caret) { width:18px; height:18px; }
  #btn-download-pdf { height:36px; min-height:36px; min-width:36px; padding:7px 10px; font-size:12px; justify-content:center; }
  #btn-translate { min-width:76px; padding:0 8px; gap:5px; font-size:14px; }
  #translation-menu { position:fixed; top:calc(var(--editor-topbar-height) + 8px); right:12px; }
  #editor-notifications { width:min(480px,calc(100vw - 32px)); }
  .editor-notification { grid-template-columns:44px minmax(0,1fr) 44px; gap:6px; padding:14px 8px; }
  .editor-notification-icon { justify-self:center; margin-top:2px; }
  #status-message, #editor-translation-status { text-align:center; }
  .editor-notification-close { width:44px; height:44px; margin-top:-10px; }
}
@supports(field-sizing:content) {
  @media(max-width:760px) { #cv-nom-input { field-sizing:content; width:auto; } }
}
@media(min-width:380px) and (max-width:760px) { #btn-download-pdf .btn-label { display:inline; } }
@media(max-width:379px) { #btn-download-pdf { width:36px; padding:0; } }
@media(prefers-reduced-motion:reduce) { .editor-notification-icon { animation:none !important; } .topbar-right > button, #btn-translate { transition:none; } }
