*,*::before,*::after{box-sizing:border-box}

:root{
color-scheme:dark;
--bg:#0c1016;
--surface:#151b24;
--surface-2:#1b222d;
--ink:#e9edf4;
--ink-2:#a3aec1;
--ink-3:#828da1;
--line:#28313f;
--line-2:#1f2733;
--brand:#ff4a52;
--brand-ink:#1a0709;
--brand-soft:#2a1417;
--money:#3ddc84;
--money-soft:#13291d;
--focus:#4d9bff;
--radius:14px;
--radius-lg:20px;
--shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -12px rgba(0,0,0,.7);
--shadow-lg:0 2px 4px rgba(0,0,0,.4),0 18px 40px -18px rgba(0,0,0,.8);
--wrap:820px;
--mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

:root[data-theme="light"]{
color-scheme:light;
--bg:#eef1f6;
--surface:#ffffff;
--surface-2:#f7f9fc;
--ink:#11151c;
--ink-2:#4c5768;
--ink-3:#5d6880;
--line:#dfe4ee;
--line-2:#eceff6;
--brand:#d81f26;
--brand-ink:#ffffff;
--brand-soft:#fdeced;
--money:#0d7c3f;
--money-soft:#e8f6ee;
--focus:#1f6feb;
--shadow:0 1px 2px rgba(17,21,28,.05),0 8px 24px -12px rgba(17,21,28,.16);
--shadow-lg:0 2px 4px rgba(17,21,28,.05),0 18px 40px -18px rgba(17,21,28,.24);
}

html{-webkit-text-size-adjust:100%}

body{
margin:0;
background:var(--bg);
color:var(--ink);
font-family:var(--sans);
font-size:17px;
line-height:1.62;
-webkit-font-smoothing:antialiased;
}

img,svg{max-width:100%;height:auto;display:block}

a{color:var(--ink);text-decoration-color:var(--line);text-underline-offset:3px}
a:hover{text-decoration-color:var(--brand)}

:where(a,button,input,select,summary):focus-visible{
outline:3px solid var(--focus);
outline-offset:2px;
border-radius:6px;
}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:18px}

.skip{
position:absolute;left:-9999px;top:0;
background:var(--brand);color:var(--brand-ink);
padding:12px 18px;border-radius:0 0 12px 0;font-weight:700;z-index:99;
}
.skip:focus{left:0}

.ic{
display:inline-block;
width:1em;height:1em;
background:currentColor;
-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
-webkit-mask-position:center;mask-position:center;
-webkit-mask-size:contain;mask-size:contain;
flex:none;
}
.ic-swap{-webkit-mask-image:url(/icons/swap.svg);mask-image:url(/icons/swap.svg)}
.ic-check{-webkit-mask-image:url(/icons/check.svg);mask-image:url(/icons/check.svg)}
.ic-menu{-webkit-mask-image:url(/icons/menu.svg);mask-image:url(/icons/menu.svg)}
.ic-close{-webkit-mask-image:url(/icons/close.svg);mask-image:url(/icons/close.svg)}
.ic-arrow{-webkit-mask-image:url(/icons/arrow-right.svg);mask-image:url(/icons/arrow-right.svg)}
.ic-robux{-webkit-mask-image:url(/icons/robux.svg);mask-image:url(/icons/robux.svg)}
.ic-coin{-webkit-mask-image:url(/icons/coin.svg);mask-image:url(/icons/coin.svg)}
.ic-sun{-webkit-mask-image:url(/icons/sun.svg);mask-image:url(/icons/sun.svg)}
.ic-moon{-webkit-mask-image:url(/icons/moon.svg);mask-image:url(/icons/moon.svg)}

.top{
position:sticky;top:0;z-index:40;
background:color-mix(in srgb,var(--surface) 88%,transparent);
backdrop-filter:saturate(1.4) blur(10px);
border-bottom:1px solid var(--line);
}
.top-in{display:flex;align-items:center;gap:14px;height:62px}

.brand{
font-weight:800;font-size:19px;letter-spacing:-.02em;
text-decoration:none;display:flex;align-items:center;gap:9px;
margin-right:auto;
}
.brand-mark{
width:30px;height:30px;border-radius:9px;
background:var(--brand);color:var(--brand-ink);
display:grid;place-items:center;font-size:17px;
}
.brand em{font-style:normal;color:var(--brand)}

.nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nav a{
display:block;padding:8px 13px;border-radius:10px;
text-decoration:none;font-weight:600;font-size:15px;color:var(--ink-2);
}
.nav a:hover{background:var(--surface-2);color:var(--ink)}
.nav a[aria-current="page"]{background:var(--brand-soft);color:var(--brand)}

.menu-btn,.theme-btn{
width:42px;height:42px;border-radius:11px;
border:1px solid var(--line);background:var(--surface);
color:var(--ink);font-size:20px;
align-items:center;justify-content:center;cursor:pointer;
flex:none;
}
.theme-btn{display:flex}
.theme-btn:hover{border-color:var(--brand);color:var(--brand)}
.menu-btn{display:none}
.menu-btn .ic-close{display:none}
.menu-btn[aria-expanded="true"] .ic-menu{display:none}
.menu-btn[aria-expanded="true"] .ic-close{display:inline-block}

.theme-btn .ic-moon{display:none}
.theme-btn .ic-sun{display:inline-block}
:root[data-theme="light"] .theme-btn .ic-moon{display:inline-block}
:root[data-theme="light"] .theme-btn .ic-sun{display:none}

@media (max-width:860px){
.menu-btn{display:flex}
.nav{
position:absolute;left:0;right:0;top:100%;
background:var(--surface);border-bottom:1px solid var(--line);
padding:10px 18px 16px;
display:none;box-shadow:var(--shadow);
}
.nav.open{display:block}
.nav ul{flex-direction:column;gap:2px}
.nav a{padding:12px 14px;font-size:16px}
}

main{display:block}

.hero{padding:34px 0 8px}
h1{
font-size:clamp(28px,5.2vw,40px);
line-height:1.16;letter-spacing:-.025em;
margin:0 0 10px;font-weight:800;
}
.lede{margin:0;color:var(--ink-2);font-size:clamp(16px,2.1vw,18px)}

.stamp{
display:inline-flex;align-items:center;gap:7px;
margin-top:14px;padding:5px 12px 5px 9px;
background:var(--money-soft);color:var(--money);
border-radius:999px;font-size:13.5px;font-weight:700;
}

.calc{
background:var(--surface);
border:1px solid var(--line);
border-radius:var(--radius-lg);
box-shadow:var(--shadow-lg);
margin:24px 0 8px;
overflow:hidden;
}
.calc-head{
display:flex;align-items:center;gap:12px;flex-wrap:wrap;
padding:16px 20px;border-bottom:1px solid var(--line-2);
background:var(--surface-2);
}
.calc-title{font-weight:700;font-size:15px;margin:0;display:flex;align-items:center;gap:9px}
.calc-title .ic{font-size:18px;color:var(--brand)}

.swap{
margin-left:auto;
display:inline-flex;align-items:center;gap:8px;
padding:9px 15px;border-radius:11px;
border:1px solid var(--line);background:var(--surface);
color:var(--ink);font:inherit;font-size:14px;font-weight:700;
cursor:pointer;
}
.swap:hover{border-color:var(--brand);color:var(--brand)}
.swap .ic{font-size:16px}

.calc-body{padding:22px 20px}

.field label{
display:block;font-weight:700;font-size:13.5px;
color:var(--ink-2);margin-bottom:8px;
text-transform:uppercase;letter-spacing:.06em;
}
.input-row{display:flex;align-items:stretch;gap:0;position:relative}
.unit{
display:grid;place-items:center;
padding:0 16px;font-weight:800;font-size:19px;
background:var(--surface-2);color:var(--ink-3);
border:2px solid var(--line);border-right:0;
border-radius:var(--radius) 0 0 var(--radius);
min-width:58px;
}
.input-row input{
flex:1;min-width:0;
font-family:var(--mono);font-size:clamp(22px,4.4vw,28px);font-weight:600;
padding:14px 16px;
border:2px solid var(--line);
border-radius:0 var(--radius) var(--radius) 0;
background:var(--surface);color:var(--ink);
-moz-appearance:textfield;
}
.input-row input::-webkit-outer-spin-button,
.input-row input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.input-row input:focus{outline:0;border-color:var(--brand)}
.input-row:focus-within .unit{border-color:var(--brand);color:var(--brand)}

.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chip{
padding:7px 14px;border-radius:999px;
border:1px solid var(--line);background:var(--surface);
color:var(--ink-2);font:inherit;font-size:14px;font-weight:700;
cursor:pointer;font-variant-numeric:tabular-nums;
}
.chip:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}

.result{
margin-top:22px;padding:20px;
background:var(--money-soft);
border-radius:var(--radius);
}
.result-label{
font-size:13px;font-weight:700;color:var(--money);
text-transform:uppercase;letter-spacing:.07em;margin:0 0 4px;
}
.result-value{
font-family:var(--mono);
font-size:clamp(32px,7.4vw,48px);
font-weight:700;letter-spacing:-.03em;line-height:1.1;
color:var(--money);margin:0;
font-variant-numeric:tabular-nums;
overflow-wrap:anywhere;
}
.result-note{margin:8px 0 0;font-size:14.5px;color:var(--ink-2)}

.modes{
display:flex;gap:4px;margin-top:18px;padding:4px;
background:var(--surface-2);border:1px solid var(--line);
border-radius:13px;
}
.mode{
flex:1;padding:11px 14px;
border:0;border-radius:10px;background:transparent;
color:var(--ink-2);font:inherit;font-size:14.5px;font-weight:700;
cursor:pointer;white-space:nowrap;
}
.mode:hover{color:var(--ink)}
.mode[aria-pressed="true"]{
background:var(--surface);color:var(--brand);
box-shadow:var(--shadow);
}

section.block{padding:38px 0 0}
h2{
font-size:clamp(22px,3.4vw,28px);
letter-spacing:-.022em;line-height:1.24;
margin:0 0 12px;font-weight:800;
}
h3{font-size:clamp(17px,2.4vw,19px);letter-spacing:-.012em;margin:24px 0 8px;font-weight:700}
p{margin:0 0 14px}
.block p{color:var(--ink-2)}
.block p strong{color:var(--ink);font-weight:700}

.table-card{
background:var(--surface);border:1px solid var(--line);
border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
margin-top:16px;
}
.table-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:15.5px}
caption{
text-align:left;padding:14px 18px;
font-size:14px;font-weight:700;color:var(--ink-2);
border-bottom:1px solid var(--line-2);background:var(--surface-2);
}
th,td{padding:12px 18px;text-align:right;white-space:nowrap}
th:first-child,td:first-child{text-align:left}
thead th{
font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;
color:var(--ink-3);border-bottom:1px solid var(--line);background:var(--surface-2);
}
tbody tr{border-bottom:1px solid var(--line-2)}
tbody tr:last-child{border-bottom:0}
tbody tr:hover{background:var(--surface-2)}
tbody td{font-family:var(--mono);font-variant-numeric:tabular-nums}
tbody td:first-child{font-weight:600}
tbody td small{color:var(--ink-3);font-weight:400;font-size:.82em}
td.pos{color:var(--money);font-weight:600}

.faq{margin-top:16px;display:grid;gap:10px}
details{
background:var(--surface);border:1px solid var(--line);
border-radius:var(--radius);overflow:hidden;
}
details[open]{box-shadow:var(--shadow)}
summary{
padding:15px 18px;cursor:pointer;
font-weight:700;font-size:16.5px;
list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;
}
summary::-webkit-details-marker{display:none}
summary::after{
content:"";width:11px;height:11px;flex:none;
border-right:2.4px solid var(--ink-3);border-bottom:2.4px solid var(--ink-3);
transform:rotate(45deg) translate(-2px,-2px);
transition:transform .18s ease;
}
details[open] summary::after{transform:rotate(-135deg) translate(-3px,-3px)}
summary:hover{color:var(--brand)}
details p{padding:0 18px;margin:0 0 15px;color:var(--ink-2)}

.links{
display:grid;gap:10px;margin-top:16px;
grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
}
.link-card{
display:flex;align-items:center;gap:12px;
padding:14px 16px;border-radius:var(--radius);
background:var(--surface);border:1px solid var(--line);
text-decoration:none;box-shadow:var(--shadow);
}
.link-card:hover{border-color:var(--brand);transform:translateY(-1px)}
.link-card .flag{
width:34px;height:34px;border-radius:9px;flex:none;
background:var(--surface-2);border:1px solid var(--line-2);
display:grid;place-items:center;
font-size:13px;font-weight:800;color:var(--ink-2);letter-spacing:-.02em;
}
.link-card b{display:block;font-size:15.5px;font-weight:700;line-height:1.3}
.link-card small{display:block;font-size:13px;color:var(--ink-3);font-family:var(--mono)}
.link-card .ic-arrow{margin-left:auto;font-size:17px;color:var(--ink-3)}
.link-card:hover .ic-arrow{color:var(--brand)}

.note{
margin-top:26px;padding:16px 18px;
background:var(--surface-2);border:1px solid var(--line-2);
border-radius:var(--radius);font-size:14.5px;color:var(--ink-2);
}
.note strong{color:var(--ink)}

.foot{
margin-top:56px;padding:40px 0 34px;
border-top:1px solid var(--line);background:var(--surface);
}

.foot-top{
display:grid;gap:34px 30px;
grid-template-columns:minmax(210px,1.15fr) minmax(250px,1.5fr) minmax(130px,.65fr);
}

.foot-brand .brand{margin:0 0 12px;font-size:18px}
.foot-brand p{
margin:0;font-size:14.5px;line-height:1.6;color:var(--ink-3);
}

.foot-col h3,.foot-brand h3{
margin:0 0 13px;font-size:12px;font-weight:800;
text-transform:uppercase;letter-spacing:.09em;color:var(--ink-3);
}
.foot-col ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.foot-cur ul{display:block;columns:2;column-gap:20px}
.foot-cur li{break-inside:avoid;margin-bottom:9px}
.foot-col a{
font-size:14.5px;color:var(--ink-2);text-decoration:none;
display:inline-block;
}
.foot-col a:hover{color:var(--brand)}

.foot-base{
margin-top:34px;padding-top:22px;
border-top:1px solid var(--line-2);
display:flex;align-items:baseline;justify-content:space-between;
gap:20px;flex-wrap:wrap;
}
.foot-legal{
margin:0;flex:1 1 420px;
font-size:13px;line-height:1.65;color:var(--ink-3);
}
.foot-copy{
margin:0;flex:none;
font-size:13px;font-weight:600;color:var(--ink-3);
}

@media (max-width:720px){
.foot-top{grid-template-columns:1fr 1fr;gap:30px 24px}
.foot-brand{grid-column:1 / -1}
}
@media (max-width:460px){
.foot-top{grid-template-columns:1fr}
.foot-cur ul{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:560px){
body{font-size:16px}
.calc-head{padding:14px 16px}
.calc-body{padding:18px 16px}
.swap{margin-left:0;width:100%;justify-content:center}
.calc-title{width:100%}
th,td{padding:11px 14px}
.result{padding:17px}
}

@media (prefers-reduced-motion:reduce){
*{transition:none !important;animation:none !important}
.link-card:hover{transform:none}
}