/* Shared identity for the standalone teaching tools; their workflows stay local. */
@font-face { font-family: Inter; src: url('/fonts/inter-variable.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'Playfair Display'; src: url('/fonts/playfair-display-latin.woff2') format('woff2'); font-weight: 400 900; font-display: swap; }
@font-face { font-family: 'Source Serif 4'; src: url('/fonts/source-serif-4-latin.woff2') format('woff2'); font-weight: 400 900; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('/fonts/ibm-plex-mono-400-latin.woff2') format('woff2'); font-weight: 400; font-display: swap; }
:root { --paper: #f4ede0; --paper-deep: #e8ddc9; --ink: #302b27; --accent: #a12a3a; --card: #fffaf2; --line: #d0c3b2; --muted: #6a6057; --wash: #eae0ce; --highlight: #eae0ce; background: #f4ede0; color: #302b27; font-family: Inter, Arial, sans-serif; }
body { margin: 0; background: #f4ede0; color: #302b27; }
body, button, input, select, textarea { font-family: Inter, Arial, sans-serif; }
#root :is(h1,h2,h3), #root .font-serif { font-family: 'Playfair Display', Georgia, serif; letter-spacing: -.025em; }
#root :is(h1,h2,h3) { text-wrap: balance; }
#root [class~="bg-[#f5f0e8]"], #root [class~="bg-[#F5F0E8]"] { background-color: #f4ede0; }
#root [class~="bg-[#c8102e]"], #root [class~="bg-[#C8102E]"] { background-color: #a12a3a; }
#root [class~="text-[#c8102e]"], #root [class~="text-[#C8102E]"] { color: #a12a3a; }
.mag-tool-header { box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px max(24px,calc((100% - 1216px)/2)); border-bottom: 1px solid #d0c3b2; background: #f4ede0; color: #302b27; }
.mag-tool-brand { display: flex; align-items: center; gap: 14px; color: inherit; text-decoration: none; font: 700 18px/1.05 'Playfair Display',Georgia,serif; }
.mag-tool-brand > span:first-child { color: #a12a3a; font: italic 700 43px/1 'Playfair Display',Georgia,serif; }
.mag-tool-nav { display: flex; gap: 24px; align-items: center; }
.mag-tool-nav a { color: #302b27; font: 12px/1.5 Inter,Arial,sans-serif; text-decoration: none; padding: 10px 0; }
.mag-tool-nav a:last-child { border-bottom: 1px solid #a12a3a; color: #a12a3a; }
.mag-tool-header a:focus-visible { outline: 2px solid #a12a3a; outline-offset: 5px; }
@media (max-width:600px) { .mag-tool-header { padding: 16px 20px; gap: 20px; flex-wrap: wrap; } .mag-tool-brand { font-size: 16px; } .mag-tool-nav { gap: 20px; } .mag-tool-nav a { font-size: 11px; } }
@media print { .mag-tool-header { display: none; } }
@font-face { font-family: 'Playfair Display'; src: url('/fonts/playfair-display-italic-latin.woff2') format('woff2'); font-weight: 400 900; font-style: italic; font-display: swap; }
#root .bg-paper { background-color: #f4ede0; }
#root .bg-card { background-color: #fffaf2; }
#root .bg-highlight { background-color: #eae0ce; }
#root .text-ink { color: #302b27; }
#root :is(.text-swiss,.text-accent) { color: #a12a3a; }
#root :is(.bg-swiss,.bg-accent) { background-color: #a12a3a; }
#root .border-line { border-color: #d0c3b2; }
#root header a[href="https://digitalespausenbrot.ch"], #root header a[href="https://digitalespausenbrot.ch/"] { display: none; }
@media (max-width:600px) {
  #root h1 { font-size: clamp(30px,8.5vw,44px); }
  #root :is(h1,h2,h3) { overflow-wrap: anywhere; }
  #root header > div, #root header > div > div { min-width: 0; }
}