@import url('/mdr-content/fonts.css'); /* * root.css — Ta-Na-Si Media & Document Repository (v20260526-7) * Fixed two-row nav: title row 1, buttons row 2 right-aligned — never overlapping * * Changes vs v20260526-6: * - .nav-link + .drop-btn: replaced fixed sizes with clamp() for fluid scaling * mobile (.74rem) → tablet (~.79rem) → desktop (.82rem) → 1080p (.86rem) * - padding switched to em units — scales automatically with font-size * - removed hard @media overrides for nav buttons (clamp covers all breakpoints) */ /* ── TOKENS ── */ :root { --bg: #eef4ee; --navy: #1a2a3a; --tomato: #ff6347; --tomato-d: #e5533d; --royal: #4169e1; --royal-d: #2c4a9e; --green: #2ecc71; --card: #fff; --muted: #777; --accent: #3498db; --radius: 12px; --border: #dde; /* Container width: ~80% at 1080p +30%, fluid on smaller screens */ --max-w: min(1560px, 92vw); } /* ── RESET ── */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: 'Segoe UI', Arial, sans-serif; background: var(--bg); color: #333; min-height: 100vh; } a { color: inherit; } /* ── NAV — Fixed two-row layout ─────────────────────────────────────────── * * Row 1: Logo (fixed) | Brand title (full remaining width) * Row 2: empty (logo width) | Buttons right-aligned * * Title and buttons NEVER share the same row → title is always fully visible. * Buttons wrap onto multiple lines if needed, always right-aligned. * On small screens (< 600px): buttons become left-aligned to avoid overflow. */ /* HINWEIS (2026-05-31): Das frühere generische "nav { … }"-Layout (blaues Grid) wurde entfernt. Der neue gemeinsame Header nutzt "nav.site-header" (siehe HEADER-Block am Dateiende). Die generische Regel hätte sonst auch die Breadcrumb (