.app-header { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:16px; height:auto; min-height:66px; padding:10px 24px; position:relative; }
.app-header > .brand { display:flex; align-items:center; justify-self:start; gap:8px; min-width:0; text-decoration:none; color:var(--text); font-size:28px; letter-spacing:-.6px; }
.app-header .brand-mark { width:36px; height:36px; flex-shrink:0; }
.app-header .brand > strong { font-weight:600; }
.app-header .brand-description { display:block; border-left:1px solid var(--line); padding-left:16px; color:#b0b3b7; font-size:13px; font-weight:400; letter-spacing:normal; }
.app-header > .app-navigation { justify-self:center; align-self:stretch; width:auto; margin:0; order:initial; }
.app-header > .header-actions { display:flex; justify-content:flex-end; justify-self:end; width:auto; gap:8px; order:initial; }
.app-header .header-actions button { min-height:44px; padding:8px 12px; font-size:13px; }
.shell[hidden],.library-discovery[hidden] { display:none; }
.library-discovery { max-width:1100px; margin:48px auto; padding:24px; }
.library-discovery h1 { font-size:clamp(27px,4vw,42px); white-space:normal; line-height:1.15; }
.library-discovery-description { max-width:680px; margin:20px 0 32px; color:#b0b3b7; font-size:17px; line-height:1.6; }
.library-discovery-features { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.library-discovery-features article { padding:26px; background:var(--surface); border:1px solid var(--line); border-radius:14px; }
.library-discovery-features article > span { color:var(--accent); font-size:30px; }
.library-discovery-features h2 { font-size:18px; margin:16px 0 10px; }
.library-discovery-features p { color:#b0b3b7; line-height:1.6; }
.library-discovery-actions { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:32px; }
.library-discovery-actions a { color:var(--accent); }
@media(max-width:1400px) { .app-header .brand-description { display:none; } }
@media(max-width:650px) {
  .app-header > .brand,.app-header .brand h1 { font-size:22px; }
  .app-header .brand-mark { width:30px; height:30px; }
  .app-header { grid-template-columns:minmax(0,1fr) auto; gap:0; min-height:96px; padding:8px 12px 0; }
  .app-header > .app-navigation { grid-column:1 / -1; grid-row:2; width:100%; justify-content:center; }
  .app-header > .header-actions { grid-column:2; grid-row:1; }
  .app-header .header-actions button { min-height:44px; padding:8px 10px; font-size:12px; }
  .app-header > .app-navigation a { flex:1; justify-content:center; }
  .library-discovery { margin:16px auto; padding:20px 16px; }
  .library-discovery-features { grid-template-columns:1fr; }
}

.app-header #language { width:auto; min-height:44px; font-size:13px; }
@media(max-width:650px) { .app-header > .brand { grid-column:1 / -1; grid-row:1; } .app-header > .app-navigation { grid-column:1 / -1; grid-row:3; } .app-header > .header-actions { grid-column:1 / -1; grid-row:2; width:100%; justify-content:flex-end; padding:8px 0; } }