html { color-scheme: light; font-size: 62.5%; }
.marketing-arrow-icon { transition: translate 0.22s cubic-bezier(0.22, 1, 0.36, 1); }
:is(a, button):is(:hover, :focus-visible) .marketing-arrow-icon { translate: 4px; }
@media (prefers-reduced-motion: reduce) {
.marketing-arrow-icon { transition: none; }
:is(a, button):is(:hover, :focus-visible) .marketing-arrow-icon { translate: none; }
}
:root { --action-primary: var(--tm-ink); --action-primary-hover: var(--tm-blue); --action-primary-pressed: var(--tm-blue-pressed); --action-primary-text: var(--tm-paper); --action-secondary: var(--tm-selected); --action-secondary-hover: var(--tm-border); --action-secondary-text: var(--tm-ink); --surface-content: var(--tm-paper); --surface-sidebar: var(--tm-surface); --surface-footer: var(--tm-selected); --bg: var(--tm-ink); --paper: var(--tm-ink); --ink: var(--tm-paper); --ink-soft: var(--tm-outline); --muted: var(--tm-subtle); --line: var(--tm-ink); --line-soft: var(--tm-text); --thumb-bg: var(--tm-ink); --danger: var(--tm-window-red); --danger-light: rgb(var(--tm-danger-fill-rgb) / .16); --brand: var(--tm-blue-focus); --brand-dark: var(--tm-blue-focus); --brand-light: rgb(40 100 237 / .16); --brand-text: var(--tm-ink); --brand-strong: var(--brand); --mention: var(--tm-blue-focus); --mention-bg: rgb(40 100 237 / .18); --brand-icon: var(--brand); --ok: var(--tm-success-light); --ok-light: rgb(var(--tm-success-light-rgb) / .15); --r-lg: 1.2rem; --r-md: 1rem; --r-sm: 0.6rem; --r-pill: 9.9rem; --s-1: 0.2rem; --s-2: 0.4rem; --s-3: 0.6rem; --s-4: 0.8rem; --s-5: 1rem; --s-6: 1.2rem; --s-7: 1.4rem; --s-8: 1.6rem; --s-9: 2rem; --s-10: 2.4rem; --s-11: 3.2rem; --s-12: 4rem; --s-13: 6.4rem; --s-14: 9.6rem; --shadow: 0 1rem 3rem -1rem rgb(40 100 237 / .1); --site-content-width: 1320px; --site-page-gutter: 24px; --shell-rail-w: 8rem; --shell-tabbar-h: 5.6rem; --shell-header-h: 7.7rem; }
:root[data-theme="light"] { --bg: var(--surface-content); --paper: var(--surface-content); --ink: var(--tm-ink); --ink-soft: var(--tm-text); --muted: var(--tm-muted); --line: var(--tm-border); --line-soft: var(--tm-outline); --thumb-bg: var(--tm-surface); --danger: var(--tm-danger); --danger-light: rgb(var(--tm-danger-fill-rgb) / .1); --brand: var(--tm-blue); --brand-dark: var(--tm-blue-pressed); --brand-light: rgb(40 100 237 / .1); --brand-text: var(--tm-paper); --brand-strong: var(--tm-blue-pressed); --mention: var(--tm-blue-hover); --mention-bg: rgb(40 100 237 / .12); --brand-icon: var(--tm-blue); --ok: var(--tm-success); --ok-light: rgb(var(--tm-success-rgb) / .12); --shadow: 0 1rem 3rem -1rem rgb(32 36 43 / .12); }
@media (prefers-color-scheme: light) {
:root[data-theme="system"] { --bg: var(--surface-content); --paper: var(--surface-content); --ink: var(--tm-ink); --ink-soft: var(--tm-text); --muted: var(--tm-muted); --line: var(--tm-border); --line-soft: var(--tm-outline); --thumb-bg: var(--tm-surface); --danger: var(--tm-danger); --danger-light: rgb(var(--tm-danger-fill-rgb) / .1); --brand: var(--tm-blue); --brand-dark: var(--tm-blue-pressed); --brand-light: rgb(40 100 237 / .1); --brand-text: var(--tm-paper); --brand-strong: var(--tm-blue-pressed); --mention: var(--tm-blue-hover); --mention-bg: rgb(40 100 237 / .12); --brand-icon: var(--tm-blue); --ok: var(--tm-success); --ok-light: rgb(var(--tm-success-rgb) / .12); --shadow: 0 1rem 3rem -1rem rgb(32 36 43 / .12); }
}
* { margin: 0px; padding: 0px; box-sizing: border-box; }
body { font-family: "Pretendard Variable", Pretendard, -apple-system, sans-serif; font-size: 1.6rem; line-height: 1.6; color: var(--ink); background: var(--bg); word-break: keep-all; overflow-wrap: break-word; -webkit-font-smoothing: antialiased; display: flex; flex-direction: column; min-height: 100vh; }
#main { flex: 1 0 auto; }
a { text-decoration: none; }
a, button { color: inherit; }
button { font-family: inherit; cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background: none; }
li, ul { list-style: none; }
::selection { background: var(--brand); color: var(--brand-text); }
[data-fade="right"] { mask-image: linear-gradient(90deg, rgb(0, 0, 0) calc(100% - 4rem), transparent); }
[data-fade="left"] { mask-image: linear-gradient(270deg, rgb(0, 0, 0) calc(100% - 4rem), transparent); }
[data-fade="both"] { mask-image: linear-gradient(90deg, transparent 0px, rgb(0, 0, 0) 4rem, rgb(0, 0, 0) calc(100% - 4rem), transparent); }
[data-fade="none"] { mask-image: none; }
html[data-native-composer], html[data-native-composer] body { height: 100%; overflow: hidden; overscroll-behavior: none; }
:root { --site-logo-filter: invert(1); --site-marker-top: 0; --site-accent-ink: var(--tm-ink); --site-surface: var(--tm-ink); --site-soft: var(--tm-ink); --site-hover: var(--tm-ink); --site-line: var(--tm-text); --site-ink: var(--tm-surface); --site-muted: var(--tm-subtle); --site-accent: var(--tm-blue-focus); --site-accent-soft: var(--tm-ink); }
:root[data-theme="light"] { --site-logo-filter: none; --site-marker-top: initial; --site-accent-ink: initial; --site-surface: initial; --site-soft: initial; --site-hover: initial; --site-line: initial; --site-ink: initial; --site-muted: initial; --site-accent: initial; --site-accent-soft: initial; }
@media (prefers-color-scheme: light) {
:root[data-theme="system"] { --site-logo-filter: none; --site-marker-top: initial; --site-accent-ink: initial; --site-surface: initial; --site-soft: initial; --site-hover: initial; --site-line: initial; --site-ink: initial; --site-muted: initial; --site-accent: initial; --site-accent-soft: initial; }
}
input::placeholder, textarea::placeholder { color: var(--site-muted,var(--muted)); opacity: 1; }
@media (max-width: 600px) {
:root { --site-page-gutter: 16px; }
}
@media (max-width: 360px) {
:root { --site-page-gutter: 12px; }
}