@font-face {
  font-family: "Sora"; font-style: normal; font-weight: 100 800; font-display: swap;
  src: url(/assets/fonts/sora-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Sora"; font-style: normal; font-weight: 100 800; font-display: swap;
  src: url(/assets/fonts/sora-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root, [data-theme="light"] {
  --coral: #f06767;
  --bg: #fff8f6; --surface: #ffffff; --text: #524f75; --text-soft: #6f6c90; --muted: #9693b0;
  --border: #524f75; --shadow: #3b3958; --line: #f3e2de; --tint: #ffe9e5; --tint-2: #ffd3cc;
  --btn-bg: #524f75; --btn-text: #ffffff; --accent-text: #d84a4a;
  --panel: #524f75; --panel-2: #5f5c85; --panel-line: rgba(255, 255, 255, .14);
  --input: #ffffff; --danger-bg: #ffe9e5; --danger: #c43d3d;
}
[data-theme="dark"] {
  --bg: #17162a; --surface: #221f38; --text: #f6f3ff; --text-soft: #c5c1df; --muted: #8f8bae;
  --border: #6d6a96; --shadow: #0b0a17; --line: #2f2c4a; --tint: #34233a; --tint-2: #4a2c42;
  --btn-bg: #f06767; --btn-text: #1b1a2e; --accent-text: #ff8c8c;
  --panel: #221f38; --panel-2: #2c2848; --panel-line: rgba(255, 255, 255, .08);
  --input: #1c1a31; --danger-bg: #3a2333; --danger: #ff8c8c;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body, button, input, select, textarea { font-family: "Sora", -apple-system, sans-serif; }
body { background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; transition: background-color .35s, color .35s; }
a { color: inherit; text-decoration: none; }
svg { flex: none; }

.icon-btn {
  display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; cursor: pointer;
  background: var(--surface); color: var(--text); border: 2.5px solid var(--border); box-shadow: 0 3px 0 var(--shadow);
  transition: transform .15s, background-color .35s;
}
.icon-btn:hover { transform: translateY(-2px); }
.icon-btn svg { width: 20px; height: 20px; }
.theme-toggle .moon, [data-theme="dark"] .theme-toggle .sun { display: none; }
[data-theme="dark"] .theme-toggle .moon { display: block; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 15px 24px; border: 0; border-radius: 16px;
  background: var(--btn-bg); color: var(--btn-text); font-size: 16px; font-weight: 700; cursor: pointer;
  box-shadow: 0 4px 0 var(--shadow); transition: transform .15s, box-shadow .15s, background-color .35s;
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 6px 0 var(--shadow); }
.btn:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--shadow); }
.btn svg { width: 20px; height: 20px; }

.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 24px; font-weight: 800; letter-spacing: -.8px; }
.brand img { height: 38px; width: auto; }