/* Privacy, terms and imprint of the Mall page: cream card on lavender, same type as the game page. */
@font-face { font-family: "Fredoka"; src: url("/mall/fonts/Fredoka.ttf") format("truetype"); font-weight: 300 700; font-display: swap; }
@font-face { font-family: "Nunito"; src: url("/mall/fonts/Nunito.ttf") format("truetype"); font-weight: 200 1000; font-display: swap; }

:root { --lav: #DECDF5; --cream: #FDF6E8; --cocoa: #4A1F14; --muted: #7A675D; --line: #EADCC6; color-scheme: light; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--lav); color: #4E3A33; font-family: "Nunito", "Segoe UI", system-ui, sans-serif; font-size: 17px; line-height: 1.6; }
a { color: var(--cocoa); }
a:focus-visible { outline: 3px solid #E8735A; outline-offset: 2px; }
h1, h2, h3 { font-family: "Fredoka", "Trebuchet MS", system-ui, sans-serif; color: var(--cocoa); line-height: 1.2; text-wrap: balance; }
.wrap { max-width: 900px; margin: 0 auto; padding-block: 16px 40px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; background: var(--cream); border-radius: 25px; padding: 8px 22px 8px 16px; }
.brand { display: flex; align-items: center; gap: 8px; text-decoration: none; font-family: "Fredoka", sans-serif; font-weight: 600; font-size: 1.1rem; }
.brand img { width: 32px; height: 32px; border-radius: 8px; }
.top nav { display: flex; flex-wrap: wrap; gap: 4px 18px; font-family: "Fredoka", sans-serif; }
.top nav a { text-decoration: none; }
.top nav a:hover, .top nav a[aria-current] { text-decoration: underline; text-underline-offset: 4px; }
.doc { margin-top: 18px; background: var(--cream); border-radius: 26px; padding: clamp(24px, 4vw, 52px); }
.doc h1 { font-size: clamp(2rem, 3vw + 1rem, 2.7rem); margin: 0 0 4px; }
.meta { color: var(--muted); margin: 0 0 26px; }
.doc h2 { font-size: 1.4rem; margin: 30px 0 8px; }
.doc h3 { font-size: 1.08rem; margin: 18px 0 4px; }
.doc p, .doc li { max-width: 70ch; }
.doc p { margin: 0; }
.doc p + p { margin-top: 10px; }
.doc ul { padding-left: 1.2em; margin: 8px 0; }
.doc li + li { margin-top: 4px; }
.doc dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 10px 0; }
.doc dt { font-weight: 700; color: var(--cocoa); }
.doc dd { margin: 0; }
.doc code { font-size: .92em; background: #F3E8D2; padding: 1px 5px; border-radius: 5px; word-break: break-all; }
.foot { margin-top: 18px; text-align: center; color: var(--muted); font-size: .92rem; }
@media (max-width: 520px) { .doc dl { grid-template-columns: 1fr; gap: 0; } .doc dd { margin-bottom: 8px; } .top { justify-content: center; } }